1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
|
import React, { useRef } from "react";
import { Link } from "react-router-dom";
import styles from "./Sidebar.module.css";
import { UserProfile } from "@customTypes/Profile";
import Login from "@components/Login";
import {
UploadIcon,
BookIcon,
HelpIcon,
} from "../../images/Images";
import links from "./Links";
interface FooterProps {
profile?: UserProfile;
isSearching: boolean;
selectedButtonIndex: number;
onUploadRun: () => void;
setProfile: React.Dispatch<React.SetStateAction<UserProfile | undefined>>;
setToken: React.Dispatch<React.SetStateAction<string | undefined>>;
handle_sidebar_click: (clicked_sidebar_idx: number) => void;
};
const _Footer: React.FC<FooterProps> = ({ profile, isSearching, selectedButtonIndex, onUploadRun, setToken, setProfile, handle_sidebar_click }) => {
const uploadRunRef = useRef<HTMLButtonElement>(null);
return (
<div className="px-2 gap-2 flex flex-col mb-2">
{profile && profile.profile && (
<button
ref={uploadRunRef}
id="upload-run"
className={``}
onClick={() => onUploadRun()}
>
<img src={UploadIcon} alt="Upload" className={``} />
{true && <span className="font-[--font-barlow-semicondensed-regular] truncate">Upload Record</span>}
</button>
)}
{/* <div className={true ? 'min-w-0' : 'flex justify-center'}>
<Login
setToken={setToken}
profile={profile}
setProfile={setProfile}
isOpen={true}
/>
</div> */}
{links.footer.map(({ to, icon, label }, i) => (
<Link to={to} tabIndex={-1} key={i}>
<button
className={`${styles.button} ${selectedButtonIndex == links.content.length + i + 1 ? styles["button-selected"] : ""} ${isSearching ? styles["button-hidden"] : ""}`}
onClick={() => handle_sidebar_click(links.content.length + i + 1)}
>
<img src={icon} />
<span className="">
{label}
</span>
</button>
</Link>
))}
</div>
);
}
export default _Footer;
|