-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
d8a0ff2
commit c20c7de
Showing
7 changed files
with
248 additions
and
85 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,48 @@ | ||
"use client"; | ||
import React from "react"; | ||
|
||
import Container from "@mui/material/Container"; | ||
import Stack from "@mui/material/Stack"; | ||
import { Divider } from "@mui/material"; | ||
|
||
import { DossierData } from "@/repository/database"; | ||
import AmendementCard from "./AmendementCard"; | ||
|
||
export default function AmendementsList( | ||
props: Pick<DossierData, "amendements" | "acteurs"> & { numero: string } | ||
) { | ||
const { amendements, acteurs, numero } = props; | ||
|
||
const filteredAmendements = amendements | ||
.filter((amendement) => { | ||
if (numero === "") { | ||
return true; | ||
} | ||
return amendement.numeroLong | ||
.toLowerCase() | ||
.startsWith(numero.toLowerCase()); | ||
}) | ||
.filter( | ||
({ texteLegislatifRefUid }) => | ||
texteLegislatifRefUid === "PIONANR5L16B0360" | ||
) | ||
.sort((a, b) => | ||
Number.parseInt(a.numeroOrdreDepot) < Number.parseInt(b.numeroOrdreDepot) | ||
? -1 | ||
: 1 | ||
); | ||
|
||
return ( | ||
<Stack> | ||
{filteredAmendements.slice(0, 10).map((amendement) => ( | ||
<React.Fragment key={amendement.uid}> | ||
<AmendementCard | ||
{...amendement} | ||
acteur={acteurs[amendement.acteurRefUid]} | ||
/> | ||
<Divider /> | ||
</React.Fragment> | ||
))} | ||
</Stack> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
import TextField from "@mui/material/TextField"; | ||
|
||
type FilterProps = { | ||
numero: string; | ||
handleNumero: (numero: string) => void; | ||
}; | ||
|
||
export const Filter = (props: FilterProps) => { | ||
const { numero, handleNumero } = props; | ||
|
||
return ( | ||
<TextField | ||
size="small" | ||
label="Numero" | ||
value={numero} | ||
onChange={(event) => { | ||
handleNumero(event.target.value); | ||
}} | ||
variant="outlined" | ||
type="numeric" | ||
/> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,52 +1,50 @@ | ||
"use client"; | ||
|
||
import React from "react"; | ||
|
||
import Container from "@mui/material/Container"; | ||
import Stack from "@mui/material/Stack"; | ||
import Box from "@mui/material/Box"; | ||
|
||
import { DossierData } from "@/repository/database"; | ||
import AmendementCard from "./AmendementCard"; | ||
import { Divider } from "@mui/material"; | ||
import { FilterContainer } from "@/components/FilterContainer"; | ||
|
||
import { Filter } from "./Filter"; | ||
import { useFilterState } from "./useFilter"; | ||
import AmendementList from "./AmendementList"; | ||
|
||
type AmendementTabProps = { | ||
dossier?: DossierData; | ||
}; | ||
|
||
export const AmendementTab = ({ dossier }: AmendementTabProps) => { | ||
const { | ||
commissionFondId, | ||
commissionAvisId, | ||
organes = {}, | ||
rapporteursFondIds, | ||
coSignatairesIds, | ||
acteurs = {}, | ||
acts = [], | ||
documents = [], | ||
amendementCount = {}, | ||
amendements = [], | ||
} = dossier ?? {}; | ||
const { amendements = [], acteurs = {} } = dossier ?? {}; | ||
|
||
const { numero, handleNumero } = useFilterState(); | ||
|
||
return ( | ||
<Container | ||
sx={{ | ||
pt: 3, | ||
display: "flex", | ||
flexDirection: { | ||
xs: "column-reverse", | ||
xs: "column", | ||
md: "row", | ||
}, | ||
gap: 5, | ||
}} | ||
> | ||
<Stack> | ||
{amendements.slice(0, 10).map((amendement) => ( | ||
<React.Fragment key={amendement.uid}> | ||
<AmendementCard {...amendement} /> | ||
<Divider /> | ||
</React.Fragment> | ||
))} | ||
<Stack spacing={3} useFlexGap flex={2}> | ||
<FilterContainer> | ||
<Filter numero={numero} handleNumero={handleNumero} /> | ||
</FilterContainer> | ||
</Stack> | ||
<Box flex={8} sx={{ minWidth: 0 }}> | ||
<AmendementList | ||
amendements={amendements} | ||
acteurs={acteurs} | ||
numero={numero} | ||
/> | ||
</Box> | ||
</Container> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,50 @@ | ||
"use client"; | ||
import * as React from "react"; | ||
import { usePathname, useRouter, useSearchParams } from "next/navigation"; | ||
import { useTransition } from "react"; | ||
|
||
export type AmendementsFilterState = { | ||
numero: string; | ||
search: string; | ||
}; | ||
|
||
export function useFilterState() { | ||
const { replace } = useRouter(); | ||
const pathname = usePathname(); | ||
const searchParams = useSearchParams(); | ||
|
||
const [isPending, startTransition] = useTransition(); | ||
|
||
const [numero, setNumero] = React.useState<string>( | ||
searchParams.get("numero") ?? "" | ||
); | ||
|
||
function handleSearch(term: string) { | ||
const params = new URLSearchParams(window.location.search); | ||
if (term) { | ||
params.set("q", term); | ||
} else { | ||
params.delete("q"); | ||
} | ||
|
||
startTransition(() => { | ||
replace(`${pathname}?${params.toString()}`); | ||
}); | ||
} | ||
|
||
function handleNumero(numero: string) { | ||
const params = new URLSearchParams(window.location.search); | ||
setNumero(numero); | ||
if (numero === "") { | ||
params.delete("numero"); | ||
} else { | ||
params.set("numero", numero); | ||
} | ||
|
||
startTransition(() => { | ||
replace(`${pathname}?${params.toString()}`); | ||
}); | ||
} | ||
|
||
return { isPending, handleSearch, handleNumero, numero }; | ||
} |
Oops, something went wrong.