diff --git a/components/settings/general.tsx b/components/settings/general.tsx index 0036b811..414fd776 100644 --- a/components/settings/general.tsx +++ b/components/settings/general.tsx @@ -1,4 +1,4 @@ -import { useCallback, FormEvent } from 'react'; +import { FormEvent, useCallback } from 'react'; import { TextField } from '@rmwc/textfield'; import useTranslation from 'next-translate/useTranslation'; @@ -7,8 +7,8 @@ import PhotoInput from 'components/photo-input'; import { Org } from 'lib/model/org'; import useSocialProps from 'lib/hooks/social-props'; -import { useSettings } from './context'; import styles from './settings.module.scss'; +import { useSettings } from './context'; export default function General(): JSX.Element { const { t } = useTranslation(); diff --git a/components/settings/index.tsx b/components/settings/index.tsx index 9030180e..8a097bda 100644 --- a/components/settings/index.tsx +++ b/components/settings/index.tsx @@ -1,4 +1,4 @@ -import { ReactNode, useCallback, useEffect } from 'react'; +import { ReactNode, useCallback, useMemo } from 'react'; import { Snackbar, SnackbarAction } from '@rmwc/snackbar'; import Link from 'next/link'; import axios from 'axios'; @@ -20,8 +20,6 @@ export interface SettingsProps { children: ReactNode; } -const emptyOrg = new Org(); - export default function Settings({ orgId, active, @@ -42,6 +40,10 @@ export default function Settings({ return Org.fromJSON(data); }, []); + const initialData = useMemo( + () => orgs.find((o) => o.id === orgId) || new Org(), + [orgId, orgs] + ); const { data: org, setData: setOrg, @@ -50,12 +52,9 @@ export default function Settings({ error, retry, timeout, - } = useContinuous(emptyOrg, updateRemote, updateLocal); + } = useContinuous(initialData, updateRemote, updateLocal); - useEffect(() => { - const idx = orgs.findIndex((o: Org) => o.id === orgId); - if (idx >= 0) setOrg(orgs[idx]); - }, [orgs, orgId, setOrg]); + const settingsContextValue = useMemo(() => ({ org, setOrg }), [org, setOrg]); return ( <> @@ -99,7 +98,7 @@ export default function Settings({