diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 1b2be812bbd..e93f3286afa 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -164,7 +164,7 @@ const config = { // Ignore i18n in releases files. TODO: Remove this before moving releases to GA. { - files: ['**/*/core/releases/**/*', '**/*/core/versions/**/*'], + files: ['**/*/core/releases/**/*', '**/*/core/bundles/**/*'], rules: { 'i18next/no-literal-string': 'off', '@sanity/i18n/no-attribute-string-literals': 'off', diff --git a/packages/sanity/src/_singletons/context/VersionContext.tsx b/packages/sanity/src/_singletons/context/VersionContext.tsx deleted file mode 100644 index 19e98b7376c..00000000000 --- a/packages/sanity/src/_singletons/context/VersionContext.tsx +++ /dev/null @@ -1,62 +0,0 @@ -// eslint-disable-next-line no-warning-comments -/* TODO DO WE STILL NEED THIS AFTER THE STORES ARE SET UP? */ - -// eslint-disable-next-line import/consistent-type-specifier-style -import {createContext, type ReactElement} from 'react' - -import {useBundlesStore} from '../../../core/store/bundles' -import type {BundleDocument} from '../../../core/store/bundles/types' -import {LATEST} from '../../../core/versions/util/const' -import {useRouter} from '../../../router' - -export interface VersionContextValue { - currentVersion: Partial - isDraft: boolean - setCurrentVersion: (bundle: Partial) => void -} - -export const VersionContext = createContext({ - currentVersion: LATEST, - isDraft: true, - // eslint-disable-next-line no-empty-function - setCurrentVersion: () => {}, -}) - -interface VersionProviderProps { - children: ReactElement -} - -export function VersionProvider({children}: VersionProviderProps): JSX.Element { - const router = useRouter() - const {data: bundles} = useBundlesStore() - - const setCurrentVersion = (version: Partial) => { - const {name} = version - if (name === 'drafts') { - router.navigateStickyParam('perspective', '') - } else { - router.navigateStickyParam('perspective', `bundle.${name}`) - } - } - const selectedVersion = - router.stickyParams?.perspective && bundles - ? bundles.find((bundle) => { - return ( - `bundle.${bundle.name}`.toLocaleLowerCase() === - router.stickyParams.perspective?.toLocaleLowerCase() - ) - }) - : LATEST - - const currentVersion = selectedVersion || LATEST - - const isDraft = currentVersion.name === 'drafts' - - const contextValue: VersionContextValue = { - isDraft, - setCurrentVersion, - currentVersion, - } - - return {children} -} diff --git a/packages/sanity/src/core/versions/components/BundleBadge.tsx b/packages/sanity/src/core/bundles/components/BundleBadge.tsx similarity index 100% rename from packages/sanity/src/core/versions/components/BundleBadge.tsx rename to packages/sanity/src/core/bundles/components/BundleBadge.tsx diff --git a/packages/sanity/src/core/versions/components/BundleMenu.tsx b/packages/sanity/src/core/bundles/components/BundleMenu.tsx similarity index 86% rename from packages/sanity/src/core/versions/components/BundleMenu.tsx rename to packages/sanity/src/core/bundles/components/BundleMenu.tsx index e83cf628572..f0b76537d90 100644 --- a/packages/sanity/src/core/versions/components/BundleMenu.tsx +++ b/packages/sanity/src/core/bundles/components/BundleMenu.tsx @@ -1,14 +1,11 @@ import {CheckmarkIcon} from '@sanity/icons' import {Box, Flex, Menu, MenuButton, MenuDivider, MenuItem, Spinner, Text} from '@sanity/ui' -import {type ReactElement, useCallback, useContext} from 'react' +import {type ReactElement, useCallback} from 'react' import {RelativeTime} from 'sanity' import {styled} from 'styled-components' -import { - VersionContext, - type VersionContextValue, -} from '../../../_singletons/core/form/VersionContext' import {type BundleDocument} from '../../store/bundles/types' +import {usePerspective} from '../hooks/usePerspective' import {LATEST} from '../util/const' import {isDraftOrPublished} from '../util/dummyGetters' import {BundleBadge} from './BundleBadge' @@ -33,16 +30,15 @@ export function BundleMenu(props: BundleListProps): JSX.Element { const {bundles, loading, actions, button} = props const hasBundles = bundles && bundles.filter((b) => !isDraftOrPublished(b.name)).length > 0 - // TODO MAKE SURE THIS IS HOW WE WANT TO DO THIS - const {currentVersion, setCurrentVersion, isDraft} = - useContext(VersionContext) + const {currentGlobalBundle, setPerspective} = usePerspective() - // FIXME REPLACE WHEN WE HAVE REAL DATA const handleBundleChange = useCallback( (bundle: Partial) => () => { - setCurrentVersion(bundle) + if (bundle.name) { + setPerspective(bundle.name) + } }, - [setCurrentVersion], + [setPerspective], ) return ( @@ -59,7 +55,9 @@ export function BundleMenu(props: BundleListProps): JSX.Element { ) : ( <> : undefined} + iconRight={ + currentGlobalBundle.name === LATEST.name ? : undefined + } onClick={handleBundleChange(LATEST)} pressed={false} text={LATEST.title} @@ -100,7 +98,7 @@ export function BundleMenu(props: BundleListProps): JSX.Element { diff --git a/packages/sanity/src/core/versions/components/dialog/BundleForm.tsx b/packages/sanity/src/core/bundles/components/dialog/BundleForm.tsx similarity index 98% rename from packages/sanity/src/core/versions/components/dialog/BundleForm.tsx rename to packages/sanity/src/core/bundles/components/dialog/BundleForm.tsx index 7f2f284c48e..fd73e49ce11 100644 --- a/packages/sanity/src/core/versions/components/dialog/BundleForm.tsx +++ b/packages/sanity/src/core/bundles/components/dialog/BundleForm.tsx @@ -118,6 +118,8 @@ export function BundleForm(props: { )} + + {/* TODO ADD CHECK FOR EXISTING NAMES AND AVOID DUPLICATES */} {/* localize text */} Title diff --git a/packages/sanity/src/core/versions/components/dialog/BundleIconEditorPicker.tsx b/packages/sanity/src/core/bundles/components/dialog/BundleIconEditorPicker.tsx similarity index 100% rename from packages/sanity/src/core/versions/components/dialog/BundleIconEditorPicker.tsx rename to packages/sanity/src/core/bundles/components/dialog/BundleIconEditorPicker.tsx diff --git a/packages/sanity/src/core/versions/components/dialog/CreateBundleDialog.tsx b/packages/sanity/src/core/bundles/components/dialog/CreateBundleDialog.tsx similarity index 74% rename from packages/sanity/src/core/versions/components/dialog/CreateBundleDialog.tsx rename to packages/sanity/src/core/bundles/components/dialog/CreateBundleDialog.tsx index 0430fa818ac..8cfc9d0da6c 100644 --- a/packages/sanity/src/core/versions/components/dialog/CreateBundleDialog.tsx +++ b/packages/sanity/src/core/bundles/components/dialog/CreateBundleDialog.tsx @@ -1,13 +1,10 @@ import {ArrowRightIcon} from '@sanity/icons' import {Box, Button, Dialog, Flex} from '@sanity/ui' -import {type FormEvent, useCallback, useContext, useState} from 'react' +import {type FormEvent, useCallback, useState} from 'react' -import { - VersionContext, - type VersionContextValue, -} from '../../../../_singletons/core/form/VersionContext' import {type BundleDocument} from '../../../store/bundles/types' import {useBundleOperations} from '../../../store/bundles/useBundleOperations' +import {usePerspective} from '../../hooks/usePerspective' import {isDraftOrPublished} from '../../util/dummyGetters' import {BundleForm} from './BundleForm' @@ -30,24 +27,26 @@ export function CreateBundleDialog(props: CreateBundleDialogProps): JSX.Element const [isCreating, setIsCreating] = useState(false) // TODO MAKE SURE THIS IS HOW WE WANT TO DO THIS - const {setCurrentVersion} = useContext(VersionContext) + const {setPerspective} = usePerspective() const handleOnSubmit = useCallback( async (event: FormEvent) => { - try { - event.preventDefault() - setIsCreating(true) - await createBundle(value) - setValue(value) - } catch (err) { - console.error(err) - } finally { - setIsCreating(false) - setCurrentVersion(value) - onCreate() + if (value.name) { + try { + event.preventDefault() + setIsCreating(true) + await createBundle(value) + setValue(value) + } catch (err) { + console.error(err) + } finally { + setIsCreating(false) + setPerspective(value.name) + onCreate() + } } }, - [createBundle, value, setCurrentVersion, onCreate], + [createBundle, value, setPerspective, onCreate], ) const handleOnChange = useCallback((changedValue: Partial) => { diff --git a/packages/sanity/src/core/versions/components/panes/BundleActions.tsx b/packages/sanity/src/core/bundles/components/panes/BundleActions.tsx similarity index 95% rename from packages/sanity/src/core/versions/components/panes/BundleActions.tsx rename to packages/sanity/src/core/bundles/components/panes/BundleActions.tsx index bc0ca41da1c..58b24e28442 100644 --- a/packages/sanity/src/core/versions/components/panes/BundleActions.tsx +++ b/packages/sanity/src/core/bundles/components/panes/BundleActions.tsx @@ -15,14 +15,14 @@ import {type BundleDocument} from '../../../store/bundles/types' import {getAllVersionsOfDocument, versionDocumentExists} from '../../util/dummyGetters' interface BundleActionsProps { - currentVersion: BundleDocument + currentGlobalBundle: Partial documentId: string documentType: string } export function BundleActions(props: BundleActionsProps): JSX.Element { - const {currentVersion, documentId, documentType} = props - const {name, title} = currentVersion + const {currentGlobalBundle, documentId, documentType} = props + const {name, title} = currentGlobalBundle const {data: bundles, loading} = useBundles() const documentStore = useDocumentStore() diff --git a/packages/sanity/src/core/bundles/hooks/usePerspective.tsx b/packages/sanity/src/core/bundles/hooks/usePerspective.tsx new file mode 100644 index 00000000000..da715a132a3 --- /dev/null +++ b/packages/sanity/src/core/bundles/hooks/usePerspective.tsx @@ -0,0 +1,44 @@ +import {useRouter} from 'sanity/router' + +import {useBundlesStore} from '../../store/bundles' +import {type BundleDocument} from '../../store/bundles/types' +import {LATEST} from '../util/const' + +/** + * @internal + */ +export interface VersionContextValue { + /* Return the current global bundle */ + currentGlobalBundle: Partial + /* Change the perspective in the studio based on the perspective name */ + setPerspective: (name: string) => void +} + +export function usePerspective(): VersionContextValue { + const router = useRouter() + const {data: bundles} = useBundlesStore() + + const setPerspective = (name: string | undefined) => { + if (name === 'drafts') { + router.navigateStickyParam('perspective', '') + } else { + router.navigateStickyParam('perspective', `bundle.${name}`) + } + } + const selectedBundle = + router.stickyParams?.perspective && bundles + ? bundles.find((bundle: Partial) => { + return ( + `bundle.${bundle.name}`.toLocaleLowerCase() === + router.stickyParams.perspective?.toLocaleLowerCase() + ) + }) + : LATEST + + const currentGlobalBundle = selectedBundle || LATEST + + return { + setPerspective, + currentGlobalBundle, + } +} diff --git a/packages/sanity/src/core/versions/util/const.ts b/packages/sanity/src/core/bundles/util/const.ts similarity index 100% rename from packages/sanity/src/core/versions/util/const.ts rename to packages/sanity/src/core/bundles/util/const.ts diff --git a/packages/sanity/src/core/versions/util/dummyGetters.ts b/packages/sanity/src/core/bundles/util/dummyGetters.ts similarity index 100% rename from packages/sanity/src/core/versions/util/dummyGetters.ts rename to packages/sanity/src/core/bundles/util/dummyGetters.ts diff --git a/packages/sanity/src/core/releases/components/BundlesTable/BundleRow.tsx b/packages/sanity/src/core/releases/components/BundlesTable/BundleRow.tsx index 149e13c720f..8a335ee9c67 100644 --- a/packages/sanity/src/core/releases/components/BundlesTable/BundleRow.tsx +++ b/packages/sanity/src/core/releases/components/BundlesTable/BundleRow.tsx @@ -2,8 +2,8 @@ import {Box, Card, Flex, Stack, Text} from '@sanity/ui' import {RelativeTime} from 'sanity' import {useRouter} from 'sanity/router' +import {BundleBadge} from '../../../bundles/components/BundleBadge' import {type BundleDocument} from '../../../store/bundles/types' -import {BundleBadge} from '../../../versions/components/BundleBadge' import {BundleMenuButton} from '../BundleMenuButton/BundleMenuButton' type Props = { diff --git a/packages/sanity/src/core/releases/tool/BundlesOverview.tsx b/packages/sanity/src/core/releases/tool/BundlesOverview.tsx index 3187472ff88..b047127074f 100644 --- a/packages/sanity/src/core/releases/tool/BundlesOverview.tsx +++ b/packages/sanity/src/core/releases/tool/BundlesOverview.tsx @@ -4,10 +4,10 @@ import {isBefore} from 'date-fns' import {type MouseEventHandler, useCallback, useMemo, useState} from 'react' import {Button as StudioButton} from '../../../ui-components' +import {CreateBundleDialog} from '../../bundles/components/dialog/CreateBundleDialog' import {LoadingBlock} from '../../components/loadingBlock/LoadingBlock' import {useBundles} from '../../store/bundles/BundlesProvider' import {type BundleDocument} from '../../store/bundles/types' -import {CreateBundleDialog} from '../../versions/components/dialog/CreateBundleDialog' import {BundlesTable} from '../components/BundlesTable/BundlesTable' import {containsBundles} from '../types/bundle' diff --git a/packages/sanity/src/core/store/bundles/__workshop__/BundlesStoreStory.tsx b/packages/sanity/src/core/store/bundles/__workshop__/BundlesStoreStory.tsx index 240173ec6e7..b8beb90d135 100644 --- a/packages/sanity/src/core/store/bundles/__workshop__/BundlesStoreStory.tsx +++ b/packages/sanity/src/core/store/bundles/__workshop__/BundlesStoreStory.tsx @@ -2,9 +2,9 @@ import {Card, Flex, Stack, Text} from '@sanity/ui' import {type ComponentType, type FormEvent, useCallback, useState} from 'react' import {Button} from '../../../../ui-components' +import {BundleForm} from '../../../bundles/components/dialog/BundleForm' import {LoadingBlock} from '../../../components/loadingBlock/LoadingBlock' import {AddonDatasetProvider} from '../../../studio/addonDataset/AddonDatasetProvider' -import {BundleForm} from '../../../versions/components/dialog/BundleForm' import {BundlesProvider, useBundles} from '../BundlesProvider' import {type BundleDocument} from '../types' import {useBundleOperations} from '../useBundleOperations' diff --git a/packages/sanity/src/core/studio/StudioProvider.tsx b/packages/sanity/src/core/studio/StudioProvider.tsx index 291f3676422..bb1166b9a15 100644 --- a/packages/sanity/src/core/studio/StudioProvider.tsx +++ b/packages/sanity/src/core/studio/StudioProvider.tsx @@ -6,9 +6,7 @@ import javascript from 'refractor/lang/javascript.js' import json from 'refractor/lang/json.js' import jsx from 'refractor/lang/jsx.js' import typescript from 'refractor/lang/typescript.js' -import {AddonDatasetProvider} from 'sanity' -import {VersionProvider} from '../../_singletons/core/form/VersionContext' import {LoadingBlock} from '../components/loadingBlock' import {ErrorLogger} from '../error/ErrorLogger' import {errorReporter} from '../error/errorReporter' @@ -72,14 +70,10 @@ export function StudioProvider({ - - - - - {children} - - - + + + {children} + diff --git a/packages/sanity/src/core/studio/components/navbar/StudioNavbar.tsx b/packages/sanity/src/core/studio/components/navbar/StudioNavbar.tsx index f74a7056823..5a2063d848e 100644 --- a/packages/sanity/src/core/studio/components/navbar/StudioNavbar.tsx +++ b/packages/sanity/src/core/studio/components/navbar/StudioNavbar.tsx @@ -19,7 +19,6 @@ import {Button, TooltipDelayGroupProvider} from '../../../../ui-components' import {type NavbarProps} from '../../../config/studio/types' import {isDev} from '../../../environment' import {useTranslation} from '../../../i18n' -import {GlobalBundleMenu} from '../../../versions/components/GlobalBundleMenu' import {useToolMenuComponent} from '../../studio-components-hooks' import {useWorkspace} from '../../workspace' import {ConfigIssuesButton} from './configIssues/ConfigIssuesButton' @@ -28,6 +27,7 @@ import {FreeTrialProvider} from './free-trial/FreeTrialProvider' import {HomeButton} from './home/HomeButton' import {NavDrawer} from './navDrawer' import {NewDocumentButton, useNewDocumentOptions} from './new-document' +import {GlobalPerspectiveMenu} from './perspective/GlobalPerspectiveMenu' import {PresenceMenu} from './presence' import {ResourcesButton} from './resources/ResourcesButton' import {SearchButton, SearchDialog} from './search' @@ -215,7 +215,7 @@ export function StudioNavbar(props: Omit) { {/* Versions button */} - + {/* New document button */} (VersionContext) + const {currentGlobalBundle} = usePerspective() + const {title, hue, icon} = currentGlobalBundle /* create new bundle */ const handleCreateBundleClick = useCallback(() => { @@ -34,19 +30,14 @@ export function GlobalBundleMenu(): JSX.Element { - + } bundles={bundles} loading={loading} actions={ // localize text + // eslint-disable-next-line @sanity/i18n/no-attribute-string-literals } /> diff --git a/packages/sanity/src/structure/panes/document/documentPanel/header/DocumentHeaderTitle.tsx b/packages/sanity/src/structure/panes/document/documentPanel/header/DocumentHeaderTitle.tsx index d5b6ddba236..701845754ae 100644 --- a/packages/sanity/src/structure/panes/document/documentPanel/header/DocumentHeaderTitle.tsx +++ b/packages/sanity/src/structure/panes/document/documentPanel/header/DocumentHeaderTitle.tsx @@ -3,9 +3,9 @@ import {Flex, Text} from '@sanity/ui' import {createElement, type ReactElement} from 'react' import {unstable_useValuePreview as useValuePreview, useTranslation} from 'sanity' -import {DocumentVersionMenu} from '../../../../../core/versions/components/panes/DocumentVersionMenu' import {structureLocaleNamespace} from '../../../../i18n' import {useDocumentPane} from '../../useDocumentPane' +import {DocumentPerspectiveMenu} from './perspective/DocumentPerspectiveMenu' export function DocumentHeaderTitle(): ReactElement { const {documentId, connectionState, schemaType, title, value: documentValue} = useDocumentPane() @@ -59,7 +59,7 @@ export function DocumentHeaderTitle(): ReactElement { - + ) diff --git a/packages/sanity/src/core/versions/components/panes/DocumentVersionMenu.tsx b/packages/sanity/src/structure/panes/document/documentPanel/header/perspective/DocumentPerspectiveMenu.tsx similarity index 51% rename from packages/sanity/src/core/versions/components/panes/DocumentVersionMenu.tsx rename to packages/sanity/src/structure/panes/document/documentPanel/header/perspective/DocumentPerspectiveMenu.tsx index 2870c58be08..12c03e67b36 100644 --- a/packages/sanity/src/core/versions/components/panes/DocumentVersionMenu.tsx +++ b/packages/sanity/src/structure/panes/document/documentPanel/header/perspective/DocumentPerspectiveMenu.tsx @@ -1,29 +1,23 @@ -/* eslint-disable no-warning-comments */ import {ChevronDownIcon} from '@sanity/icons' import {Box, Button} from '@sanity/ui' -import {useCallback, useContext, useEffect, useState} from 'react' +import {useCallback, useEffect, useState} from 'react' import {DEFAULT_STUDIO_CLIENT_OPTIONS, useClient} from 'sanity' -import { - VersionContext, - type VersionContextValue, -} from '../../../../_singletons/core/form/VersionContext' -import {useBundles} from '../../../store/bundles/BundlesProvider' -import {type BundleDocument} from '../../../store/bundles/types' -import {getAllVersionsOfDocument} from '../../util/dummyGetters' -import {BundleBadge} from '../BundleBadge' -import {BundleMenu} from '../BundleMenu' +import {BundleBadge} from '../../../../../../core/bundles/components/BundleBadge' +import {BundleMenu} from '../../../../../../core/bundles/components/BundleMenu' +import {usePerspective} from '../../../../../../core/bundles/hooks/usePerspective' +import {LATEST} from '../../../../../../core/bundles/util/const' +import {getAllVersionsOfDocument} from '../../../../../../core/bundles/util/dummyGetters' +import {useBundles} from '../../../../../../core/store/bundles/BundlesProvider' +import {type BundleDocument} from '../../../../../../core/store/bundles/types' -// TODO A LOT OF DOCUMENTED CODE IS RELATED TO SEARCH AND CREATING BUNDLE FROM HERE -// STILL NEED TO DECIDE IF WE KEEP IT OR NOT -export function DocumentVersionMenu(props: {documentId: string}): JSX.Element { +export function DocumentPerspectiveMenu(props: {documentId: string}): JSX.Element { const {documentId} = props const client = useClient(DEFAULT_STUDIO_CLIENT_OPTIONS) - // TODO MAKE SURE THIS IS HOW WE WANT TO DO THIS - const {currentVersion, isDraft} = useContext(VersionContext) + const {currentGlobalBundle} = usePerspective() - const {title, hue, icon} = currentVersion + const {title, hue, icon} = currentGlobalBundle const {data: bundles} = useBundles() @@ -44,16 +38,14 @@ export function DocumentVersionMenu(props: {documentId: string}): JSX.Element { fetchVersionsInner() }, [fetchVersions]) - /* TODO Version Badge should only show when the current opened document is in a version */ - return ( <> - {currentVersion && !isDraft && ( + {/* FIXME Version Badge should only show when the current opened document is in a version, RIGHT + NOW IT'S USING THE GLOBAL */} + {currentGlobalBundle && currentGlobalBundle.name === LATEST.name && ( )} - - {/** - * TODO IS THIS STILL NEEDED? VS THE PICKER IN STUDIO NAVBAR? */} + {/** TODO IS THIS STILL NEEDED? VS THE PICKER IN STUDIO NAVBAR? */} } diff --git a/packages/sanity/src/structure/panes/document/statusBar/DocumentStatusBarActions.tsx b/packages/sanity/src/structure/panes/document/statusBar/DocumentStatusBarActions.tsx index 8892800c192..2571af944ba 100644 --- a/packages/sanity/src/structure/panes/document/statusBar/DocumentStatusBarActions.tsx +++ b/packages/sanity/src/structure/panes/document/statusBar/DocumentStatusBarActions.tsx @@ -1,7 +1,7 @@ /* eslint-disable no-warning-comments */ /* eslint-disable camelcase */ import {Flex, Hotkeys, LayerProvider, Stack, Text} from '@sanity/ui' -import {memo, useCallback, useContext, useMemo, useState} from 'react' +import {memo, useCallback, useMemo, useState} from 'react' import { type DocumentActionComponent, type DocumentActionDescription, @@ -10,8 +10,9 @@ import { useTimelineSelector, } from 'sanity' -import {VersionContext, type VersionContextValue} from '../../../../_singletons/core/form/VersionContext' -import {BundleActions} from '../../../../core/versions/components/panes/BundleActions' +import {BundleActions} from '../../../../core/bundles/components/panes/BundleActions' +import {usePerspective} from '../../../../core/bundles/hooks/usePerspective' +import {LATEST} from '../../../../core/bundles/util/const' import {Button, Tooltip} from '../../../../ui-components' import {RenderActionCollectionState} from '../../../components' import {HistoryRestoreAction} from '../../../documentActions' @@ -65,9 +66,8 @@ const DocumentStatusBarActionsInner = memo(function DocumentStatusBarActionsInne /* Version / Bundling handling */ - // eslint-disable-next-line no-warning-comments // TODO MAKE SURE THIS IS HOW WE WANT TO DO THIS - const {currentVersion, isDraft} = useContext(VersionContext) + const {currentGlobalBundle} = usePerspective() return ( @@ -76,7 +76,7 @@ const DocumentStatusBarActionsInner = memo(function DocumentStatusBarActionsInne - {isDraft ? ( + {currentGlobalBundle.name === LATEST.name ? (