Added persistance to the selected user record

This commit is contained in:
Joao Ramos
2024-06-20 23:20:52 +01:00
parent f6741dd80e
commit 61a86394ed
2 changed files with 29 additions and 4 deletions

View File

@@ -25,7 +25,7 @@ import {shouldRedirectHome} from "@/utils/navigation.disabled";
import useAssignments from "@/hooks/useAssignments"; import useAssignments from "@/hooks/useAssignments";
import {uuidv4} from "@firebase/util"; import {uuidv4} from "@firebase/util";
import {usePDFDownload} from "@/hooks/usePDFDownload"; import {usePDFDownload} from "@/hooks/usePDFDownload";
import useRecordStore from "@/stores/recordStore";
export const getServerSideProps = withIronSessionSsr(({req, res}) => { export const getServerSideProps = withIronSessionSsr(({req, res}) => {
const user = req.session.user; const user = req.session.user;
@@ -53,7 +53,8 @@ export const getServerSideProps = withIronSessionSsr(({req, res}) => {
}, sessionOptions); }, sessionOptions);
export default function History({user}: {user: User}) { export default function History({user}: {user: User}) {
const [statsUserId, setStatsUserId] = useState<string | undefined>(user.id); const [statsUserId, setStatsUserId] = useRecordStore((state) => [state.selectedUser, state.setSelectedUser]);
// const [statsUserId, setStatsUserId] = useState<string | undefined>(user.id);
const [groupedStats, setGroupedStats] = useState<{[key: string]: Stat[]}>(); const [groupedStats, setGroupedStats] = useState<{[key: string]: Stat[]}>();
const [filter, setFilter] = useState<"months" | "weeks" | "days" | "assignments">(); const [filter, setFilter] = useState<"months" | "weeks" | "days" | "assignments">();
const {assignments} = useAssignments({}); const {assignments} = useAssignments({});
@@ -89,6 +90,11 @@ export default function History({user}: {user: User}) {
} }
}, [stats, isStatsLoading]); }, [stats, isStatsLoading]);
useEffect(() => {
// just set this initially
if(!statsUserId) setStatsUserId(user.id);
}, []);
const toggleFilter = (value: "months" | "weeks" | "days" | "assignments") => { const toggleFilter = (value: "months" | "weeks" | "days" | "assignments") => {
setFilter((prev) => (prev === value ? undefined : value)); setFilter((prev) => (prev === value ? undefined : value));
}; };
@@ -310,6 +316,7 @@ export default function History({user}: {user: User}) {
); );
}; };
const selectedUser = users.find((x) => x.id === statsUserId) || user;
return ( return (
<> <>
<Head> <Head>
@@ -329,7 +336,7 @@ export default function History({user}: {user: User}) {
{(user.type === "developer" || user.type === "admin") && ( {(user.type === "developer" || user.type === "admin") && (
<Select <Select
options={users.map((x) => ({value: x.id, label: `${x.name} - ${x.email}`}))} options={users.map((x) => ({value: x.id, label: `${x.name} - ${x.email}`}))}
defaultValue={{value: user.id, label: `${user.name} - ${user.email}`}} value={{value: selectedUser.id, label: `${selectedUser.name} - ${selectedUser.email}`}}
onChange={(value) => setStatsUserId(value?.value)} onChange={(value) => setStatsUserId(value?.value)}
styles={{ styles={{
menuPortal: (base) => ({...base, zIndex: 9999}), menuPortal: (base) => ({...base, zIndex: 9999}),
@@ -346,7 +353,7 @@ export default function History({user}: {user: User}) {
options={users options={users
.filter((x) => groups.flatMap((y) => y.participants).includes(x.id)) .filter((x) => groups.flatMap((y) => y.participants).includes(x.id))
.map((x) => ({value: x.id, label: `${x.name} - ${x.email}`}))} .map((x) => ({value: x.id, label: `${x.name} - ${x.email}`}))}
defaultValue={{value: user.id, label: `${user.name} - ${user.email}`}} value={{value: selectedUser.id, label: `${selectedUser.name} - ${selectedUser.email}`}}
onChange={(value) => setStatsUserId(value?.value)} onChange={(value) => setStatsUserId(value?.value)}
styles={{ styles={{
menuPortal: (base) => ({...base, zIndex: 9999}), menuPortal: (base) => ({...base, zIndex: 9999}),

18
src/stores/recordStore.ts Normal file
View File

@@ -0,0 +1,18 @@
import {create} from "zustand";
export interface RecordState {
selectedUser?: string;
setSelectedUser: (selectedUser: string | undefined) => void;
}
export const initialState = {
selectedUser: undefined,
};
const recordStore = create<RecordState>((set) => ({
...initialState,
setSelectedUser: (selectedUser: string | undefined) => set(() => ({selectedUser})),
}));
export default recordStore;