Skip to content

Commit 25bbd2a

Browse files
lorenzocorallolorenzocorallo
authored
Merge branch 'main' into 274-issues-link-in-about
2 parents 43fd007 + 1ab1013 commit 25bbd2a

File tree

4 files changed

+72
-55
lines changed

4 files changed

+72
-55
lines changed

‎src/app/_home/$school/$year/$id/-Table/Toolbar.tsx‎

Lines changed: 43 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { LuCircleX } from "react-icons/lu"
44
import { Removable } from "@/components/custom-ui/Removable"
55
import { Button } from "@/components/ui/button"
66
import { Input } from "@/components/ui/input"
7+
import { useStudentId } from "@/hooks/use-student-id"
78
// import { MdDownload } from "react-icons/md";
89
// import { FilterBtn } from "./FilterBtn";
910
// import { enrollStatusOpts, enrollAllowedOpts } from "./columns";
@@ -22,83 +23,85 @@ export function Toolbar({ has, onCsvClick: _, table }: Props) {
2223
// const enrollStatusCol = table.getColumn("enrollStatus");
2324
// const enrollAllowedCol = table.getColumn("enrollAllowed");
2425

26+
const [savedId] = useStudentId()
2527
const [matricolaFilter, setMatricolaFilter] = useState<string>("")
2628
const [matricolaFilterSubmitted, setMatricolaFilterSubmitted] =
2729
useState<boolean>(false)
28-
const { rows: filteredRows } = table.getFilteredRowModel()
2930

30-
function filterTableMatricolaCol(value?: string) {
31-
idCol?.setFilterValue(value)
32-
}
33-
34-
function handleClearMatricolaFilter() {
31+
function reset() {
3532
setMatricolaFilter("")
36-
filterTableMatricolaCol()
33+
idCol?.setFilterValue(undefined)
3734
setMatricolaFilterSubmitted(false)
3835
}
3936

40-
function handleMatricolaFilterChange(
41-
event: React.ChangeEvent<HTMLInputElement>
42-
) {
43-
if (matricolaFilterSubmitted) filterTableMatricolaCol()
44-
const input = event.target.value
45-
setMatricolaFilter(input)
46-
setMatricolaFilterSubmitted(false)
47-
}
48-
49-
async function handleMatricolaFilterSubmit(
50-
e: React.FormEvent<HTMLFormElement>
51-
) {
52-
e.preventDefault()
53-
54-
if (matricolaFilter.length === 0) handleClearMatricolaFilter()
55-
else {
56-
const hash = await sha256(matricolaFilter)
57-
filterTableMatricolaCol(hash)
58-
setMatricolaFilterSubmitted(true)
37+
async function submit(matricola: string) {
38+
if (matricola.length === 0) {
39+
reset()
40+
return
5941
}
42+
43+
const hash = await sha256(matricola)
44+
idCol?.setFilterValue(hash)
45+
setMatricolaFilterSubmitted(true)
6046
}
6147

6248
return (
6349
<div className="flex w-full flex-wrap items-start justify-start gap-6 max-2xs:flex-col">
6450
{has.id && idCol && (
65-
<div className="grid grid-cols-[auto_220px] grid-rows-[auto_auto] gap-x-4 gap-y-1">
51+
<div className="flex flex-row items-center gap-x-4 gap-y-1">
6652
<p className="self-center text-sm">Matricola</p>
67-
{filteredRows.length > 0 && matricolaFilterSubmitted ? (
68-
<Removable
69-
onRemove={handleClearMatricolaFilter}
70-
className="justify-between"
71-
>
53+
{matricolaFilterSubmitted &&
54+
table.getFilteredRowModel().rows.length !== 0 ? (
55+
<Removable onRemove={reset} className="justify-between">
7256
{matricolaFilter}
7357
</Removable>
7458
) : (
7559
<>
7660
<form
7761
className="relative w-full"
78-
onSubmit={handleMatricolaFilterSubmit}
62+
onSubmit={async (e) => {
63+
e.preventDefault()
64+
await submit(matricolaFilter)
65+
}}
7966
>
8067
<Input
68+
className={
69+
matricolaFilterSubmitted
70+
? "border-red-600 dark:border-red-800"
71+
: ""
72+
}
8173
placeholder="AX1234"
8274
value={matricolaFilter}
83-
onChange={handleMatricolaFilterChange}
75+
onChange={(e) => {
76+
setMatricolaFilterSubmitted(false)
77+
setMatricolaFilter(e.target.value)
78+
}}
8479
/>
8580
{matricolaFilter.length > 0 && (
8681
<Button
8782
type="button"
8883
variant="ghost"
8984
size="icon"
90-
className="-translate-y-1/2 absolute top-1/2 right-1 h-7 w-7 text-gray-500 hover:bg-transparent hover:text-gray-900 dark:text-gray-400 dark:hover:bg-transparent dark:hover:text-gray-100"
91-
onClick={handleClearMatricolaFilter}
85+
className="absolute top-1 right-1 h-7 w-7 text-gray-500 hover:bg-transparent hover:text-gray-900 dark:text-gray-400 dark:hover:bg-transparent dark:hover:text-gray-100"
86+
onClick={reset}
9287
>
9388
<LuCircleX className="h-5 w-5" />
9489
<span className="sr-only">Clear</span>
9590
</Button>
9691
)}
9792
</form>
98-
{matricolaFilterSubmitted && (
99-
<p className="col-start-2 text-red-600 text-sm dark:text-red-400">
100-
Matricola non trovata, ricontrolla.
101-
</p>
93+
{savedId && (
94+
<Button
95+
aria-label="Seleziona ricerca recente"
96+
variant="outline"
97+
className="whitespace-nowrap text-center"
98+
onClick={async () => {
99+
await submit(savedId)
100+
setMatricolaFilter(savedId)
101+
}}
102+
>
103+
📋 {savedId}
104+
</Button>
102105
)}
103106
</>
104107
)}

‎src/app/_home/index.tsx‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,12 @@
11
import { useQuery } from "@tanstack/react-query"
22
import { createFileRoute } from "@tanstack/react-router"
3-
import { useEffect, useState } from "react"
43
import Alert from "@/components/custom-ui/Alert"
54
import Page from "@/components/custom-ui/Page"
65
import Spinner from "@/components/custom-ui/Spinner"
76
import { ArchiveTip } from "@/components/Homepage/ArchiveTip"
87
import { SchoolCard } from "@/components/Homepage/SchoolCard"
98
import { StudentIdSearch } from "@/components/Homepage/StudentIdSearch"
109
import { useQueries } from "@/hooks/use-queries"
11-
import { LOCAL_STORAGE } from "@/utils/constants"
1210

1311
export const Route = createFileRoute("/_home/")({
1412
component: RouteComponent,
@@ -22,11 +20,6 @@ function RouteComponent() {
2220
? (Object.keys(data) as (keyof typeof data)[])
2321
: undefined
2422

25-
const [currentId, setCurrentId] = useState<string | null>(null)
26-
useEffect(() => {
27-
setCurrentId(localStorage.getItem(LOCAL_STORAGE.searchedStudentId))
28-
}, [])
29-
3023
return (
3124
<Page className="pt-8 pb-4">
3225
<div className="flex w-full flex-1 flex-col items-start gap-6">
@@ -56,7 +49,7 @@ function RouteComponent() {
5649
{error instanceof Error && <Alert level="error">{error.message}</Alert>}
5750

5851
<div className="flex w-full flex-1 flex-col items-center justify-start">
59-
<StudentIdSearch currentId={currentId} />
52+
<StudentIdSearch />
6053
</div>
6154
<div className="flex w-full flex-col items-center justify-center gap-4">
6255
{data && <ArchiveTip data={data} />}

‎src/components/Homepage/StudentIdSearch.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { LuInfo, LuLock, LuShieldCheck } from "react-icons/lu"
55
import { Button } from "@/components/ui/button"
66
import { Input } from "@/components/ui/input"
77
import { useQueries } from "@/hooks/use-queries"
8-
import { LOCAL_STORAGE } from "@/utils/constants"
8+
import { useStudentId } from "@/hooks/use-student-id"
99
import { sha256 } from "@/utils/strings/crypto"
1010
import type { IndexEntry } from "@/utils/types/data/ranking"
1111
import type { School } from "@/utils/types/data/school"
@@ -68,8 +68,9 @@ function getSortedGroups(results: GroupedResults | null) {
6868
})
6969
}
7070

71-
export function StudentIdSearch({ currentId }: { currentId: string | null }) {
71+
export function StudentIdSearch() {
7272
const [studentId, setStudentId] = useState("")
73+
const [currentId, setSavedId] = useStudentId()
7374
const [prevCurrentId, setPrevCurrentId] = useState<string | null>(null)
7475
const [submittedId, setSubmittedId] = useState<string | null>(null)
7576

@@ -101,16 +102,15 @@ export function StudentIdSearch({ currentId }: { currentId: string | null }) {
101102
const clear = async () => {
102103
setSubmittedId(null)
103104
setStudentId("")
104-
localStorage.removeItem(LOCAL_STORAGE.searchedStudentId)
105+
setSavedId(null)
105106
}
106107

107108
useEffect(() => {
108109
if (studentIdIndex && submittedId !== null) {
109-
if (studentIdIndex[submittedId])
110-
localStorage.setItem(LOCAL_STORAGE.searchedStudentId, studentId)
111-
else localStorage.removeItem(LOCAL_STORAGE.searchedStudentId)
110+
if (studentIdIndex[submittedId]) setSavedId(studentId)
111+
else setSavedId(null)
112112
}
113-
}, [studentIdIndex, submittedId, studentId])
113+
}, [studentIdIndex, submittedId, studentId, setSavedId])
114114

115115
useEffect(() => {
116116
if (

‎src/hooks/use-student-id.ts‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { useCallback, useEffect, useState } from "react"
2+
import { LOCAL_STORAGE } from "@/utils/constants"
3+
4+
export function useStudentId() {
5+
const [currentId, setCurrentId] = useState<string | null>(null)
6+
7+
useEffect(() => {
8+
setCurrentId(localStorage.getItem(LOCAL_STORAGE.searchedStudentId))
9+
}, [])
10+
11+
const set = useCallback((id: string | null) => {
12+
if (id) {
13+
localStorage.setItem(LOCAL_STORAGE.searchedStudentId, id)
14+
} else {
15+
localStorage.removeItem(LOCAL_STORAGE.searchedStudentId)
16+
}
17+
setCurrentId(id)
18+
}, [])
19+
20+
return [currentId, set] as const
21+
}

0 commit comments

Comments
 (0)