diff --git a/src/common/components/pages/UserDefinedSpace.tsx b/src/common/components/pages/UserDefinedSpace.tsx index 77fb3418..34a0e54e 100644 --- a/src/common/components/pages/UserDefinedSpace.tsx +++ b/src/common/components/pages/UserDefinedSpace.tsx @@ -26,29 +26,32 @@ export default function UserDefinedSpace({ editableSpaces, loadSpace, remoteSpaces, - localSpaces, saveLocalCopy, commitSpaceToDb, registerSpace, + getCurrentSpaceConfig, + setCurrentSpaceId, } = useAppStore((state) => ({ editableSpaces: state.space.editableSpaces, loadSpace: state.space.loadSpace, - localSpaces: state.space.localSpaces, remoteSpaces: state.space.remoteSpaces, saveLocalCopy: state.space.saveLocalSpace, commitSpaceToDb: state.space.commitSpaceToDatabase, registerSpace: state.space.registerSpace, + getCurrentSpaceConfig: state.currentSpace.getCurrentSpaceConfig, + setCurrentSpaceId: state.currentSpace.setCurrentSpaceId, })); const [loading, setLoading] = useState(!isNil(providedSpaceId)); const [loadSuccess, setLoadSuccesss] = useState(false); useEffect(() => { + setCurrentSpaceId(providedSpaceId); if (!isNil(providedSpaceId)) { setLoading(true); loadSpace(providedSpaceId).then((res) => { setLoadSuccesss(res !== null); - setLoading(false); setSpaceId(providedSpaceId); + setLoading(false); }); } }, [providedSpaceId]); @@ -96,21 +99,11 @@ export default function UserDefinedSpace({ if (loading) { return undefined; } - if (loadSuccess) { + const currentSpaceConfig = getCurrentSpaceConfig(); + if (loadSuccess && currentSpaceConfig) { return { - ...localSpaces[spaceId], + ...currentSpaceConfig, isEditable, - fidgetInstanceDatums: mapValues( - localSpaces[spaceId].fidgetInstanceDatums, - (datum) => ({ - ...datum, - config: { - settings: datum.config.settings, - editable: datum.config.editable, - data: {}, // TO DO: Inject fidget data here - }, - }), - ), }; } } @@ -118,7 +111,7 @@ export default function UserDefinedSpace({ ...INITIAL_PERSONAL_SPACE_CONFIG, isEditable, }; - }, [spaceId, isEditable, localSpaces, loading, loadSuccess, fid]); + }, [spaceId, isEditable, loading, loadSuccess, fid]); useEffect(() => { if (isEditable && isNil(spaceId) && !isNil(currentUserFid)) { diff --git a/src/common/data/stores/app/currentSpace/index.ts b/src/common/data/stores/app/currentSpace/index.ts new file mode 100644 index 00000000..c83bf5f3 --- /dev/null +++ b/src/common/data/stores/app/currentSpace/index.ts @@ -0,0 +1,56 @@ +import { SetterFunction, StoreGet, StoreSet } from "../../createStore"; +import { AppStore } from ".."; +import { SpaceConfig } from "@/common/components/templates/Space"; +import { isNil, mapValues } from "lodash"; + +interface CurrentSpaceStoreState { + currentSpaceId: string | null; +} + +interface CurrentSpaceStoreActions { + setCurrentSpaceId: SetterFunction; + getCurrentSpaceConfig: () => Omit | undefined; +} + +const HOMEBASE_ID = "homebase"; + +export type CurrentSpaceStore = CurrentSpaceStoreState & + CurrentSpaceStoreActions; + +export const currentSpaceStoreDefaults: CurrentSpaceStoreState = { + currentSpaceId: HOMEBASE_ID, +}; + +export const createCurrentSpaceStoreFunc = ( + set: StoreSet, + get: StoreGet, +): CurrentSpaceStore => ({ + ...currentSpaceStoreDefaults, + setCurrentSpaceId(id) { + set((draft) => { + draft.currentSpace.currentSpaceId = id; + }, "setCurrentSpaceId"); + }, + getCurrentSpaceConfig: () => { + const currentSpaceId = get().currentSpace.currentSpaceId; + if (currentSpaceId === HOMEBASE_ID) return get().homebase.homebaseConfig; + if (isNil(currentSpaceId)) return undefined; + const currentSpaceUpdatableConfig = get().space.localSpaces[currentSpaceId]; + return currentSpaceUpdatableConfig + ? { + ...currentSpaceUpdatableConfig, + fidgetInstanceDatums: mapValues( + currentSpaceUpdatableConfig.fidgetInstanceDatums, + (datum) => ({ + ...datum, + config: { + settings: datum.config.settings, + editable: datum.config.editable, + data: {}, // TO DO: Inject fidget data here + }, + }), + ), + } + : undefined; + }, +}); diff --git a/src/common/data/stores/app/index.ts b/src/common/data/stores/app/index.ts index 299a4139..dbd8ffe9 100644 --- a/src/common/data/stores/app/index.ts +++ b/src/common/data/stores/app/index.ts @@ -22,12 +22,14 @@ import { SpaceStore, } from "./space/spaceStore"; import { usePrivy } from "@privy-io/react-auth"; +import { createCurrentSpaceStoreFunc, CurrentSpaceStore } from "./currentSpace"; export type AppStore = { account: AccountStore; setup: SetupStore; homebase: HomeBaseStore; space: SpaceStore; + currentSpace: CurrentSpaceStore; logout: () => void; getIsAccountReady: () => boolean; getIsInitializing: () => boolean; @@ -40,6 +42,7 @@ const makeStoreFunc: MatativeConfig = (set, get, state) => ({ account: createAccountStoreFunc(set, get, state), homebase: createHomeBaseStoreFunc(set, get), space: createSpaceStoreFunc(set, get), + currentSpace: createCurrentSpaceStoreFunc(set, get), logout: () => { get().account.reset(); get().homebase.clearHomebase(); diff --git a/src/common/lib/theme/UserThemeProvider.tsx b/src/common/lib/theme/UserThemeProvider.tsx index 51f0d62b..3c9f3ffd 100644 --- a/src/common/lib/theme/UserThemeProvider.tsx +++ b/src/common/lib/theme/UserThemeProvider.tsx @@ -10,11 +10,11 @@ export interface UserThemeContextValue { } export const useUserTheme = () => { - const { userTheme } = useAppStore((state) => ({ - userTheme: state?.homebase?.homebaseConfig?.theme, + const { getCurrentSpace } = useAppStore((state) => ({ + getCurrentSpace: state.currentSpace.getCurrentSpaceConfig, })); - return userTheme ?? defaultTheme; + return getCurrentSpace()?.theme ?? defaultTheme; }; export const UserThemeProvider = ({ children }) => { diff --git a/src/pages/homebase/index.tsx b/src/pages/homebase/index.tsx index f05d57ca..c05ec960 100644 --- a/src/pages/homebase/index.tsx +++ b/src/pages/homebase/index.tsx @@ -13,6 +13,7 @@ const Homebase: NextPageWithLayout = () => { resetConfig, getIsLoggedIn, getIsInitializing, + setCurrentSpaceId, } = useAppStore((state) => ({ homebaseConfig: state.homebase.homebaseConfig, saveConfig: state.homebase.saveHomebaseConfig, @@ -21,10 +22,13 @@ const Homebase: NextPageWithLayout = () => { resetConfig: state.homebase.resetHomebaseConfig, getIsLoggedIn: state.getIsAccountReady, getIsInitializing: state.getIsInitializing, + setCurrentSpaceId: state.currentSpace.setCurrentSpaceId, })); const isLoggedIn = getIsLoggedIn(); const isInitializing = getIsInitializing(); + useEffect(() => setCurrentSpaceId("homebase"), []); + useEffect(() => { isLoggedIn && loadConfig(); }, [isLoggedIn]); @@ -55,12 +59,7 @@ const Homebase: NextPageWithLayout = () => { Homebase.getLayout = function getLayout(page: React.ReactElement) { return ( -
- {page} -
+
{page}
); }; diff --git a/src/pages/s/[handle].tsx b/src/pages/s/[handle].tsx index 7d5989d7..eb6a0b6d 100644 --- a/src/pages/s/[handle].tsx +++ b/src/pages/s/[handle].tsx @@ -99,12 +99,7 @@ const UserPrimarySpace: NextPageWithLayout = ({ UserPrimarySpace.getLayout = (page: React.ReactElement) => { return ( -
- {page} -
+
{page}
); };