diff --git a/frontend/src/components/Link.tsx b/frontend/src/components/Link.tsx index dd2ae77..84108f8 100644 --- a/frontend/src/components/Link.tsx +++ b/frontend/src/components/Link.tsx @@ -1,15 +1,11 @@ import * as React from "react" -import {Anchor} from "@steffo/bluelib-react"; -import {navigate} from "@reach/router"; +import {Anchor, BringAttention as B} from "@steffo/bluelib-react"; +import {navigate, useLocation} from "@reach/router"; import {AnchorProps} from "@steffo/bluelib-react/dist/components/common/Anchor"; -interface LinkProps extends AnchorProps { - -} - - export function Link({href, children, onClick, ...props}: AnchorProps): JSX.Element { + const location = useLocation() const onClickWrapped = React.useCallback( event => { @@ -22,10 +18,17 @@ export function Link({href, children, onClick, ...props}: AnchorProps): JSX.Elem navigate(href) } }, - [href] + [href, onClick] ) - return ( - - ) + if(location.pathname === href) { + return ( + + ) + } + else { + return ( + + ) + } } diff --git a/frontend/src/components/ResearchGroupListBox.tsx b/frontend/src/components/ResearchGroupListBox.tsx index 08c2479..6555fb6 100644 --- a/frontend/src/components/ResearchGroupListBox.tsx +++ b/frontend/src/components/ResearchGroupListBox.tsx @@ -6,12 +6,7 @@ import {useDRFManagedViewSet} from "../hooks/useDRF"; import {Loading} from "./Loading"; -interface ResearchGroupListBoxProps { - -} - - -export function ResearchGroupListBox({}: ResearchGroupListBoxProps): JSX.Element { +export function ResearchGroupListBox(): JSX.Element { const {resources, refreshing} = useDRFManagedViewSet("/api/core/groups/", "slug") const groups = React.useMemo( diff --git a/frontend/src/components/UserLink.tsx b/frontend/src/components/UserLink.tsx index 97a62ab..a9ec6c3 100644 --- a/frontend/src/components/UserLink.tsx +++ b/frontend/src/components/UserLink.tsx @@ -20,17 +20,17 @@ export function UserLink({id}: UserLinkProps): JSX.Element { React.useEffect( () => { const abort = new AbortController() - retrieve(id.toString(), {signal: abort.signal}).then(u => setUser(u)) + retrieve(id.toString(), {signal: abort.signal}) + .then(u => setUser(u)) + .catch(e => setError(e as Error)) return () => { abort.abort() } }, - [retrieve, setUser] + [retrieve, setUser, id] ) - // FIXME: use proper bluelib Anchors - if(error) return ( {id}