@sanity/assist 5.0.4 → 6.0.0

package/src/translate/FieldTranslationProvider.tsx

@@ -1,382 +0,0 @@
-import {PlayIcon} from '@sanity/icons'
-import {Box, Button, Checkbox, Dialog, Flex, Radio, Spinner, Stack, Text, Tooltip} from '@sanity/ui'
-import {
-  createContext,
-  type PropsWithChildren,
-  useCallback,
-  useContext,
-  useId,
-  useMemo,
-  useState,
-} from 'react'
-import {
-  type ObjectSchemaType,
-  type Path,
-  pathToString,
-  type SanityDocumentLike,
-  useClient,
-} from 'sanity'
-
-import {useAiAssistanceConfig} from '../assistLayout/AiAssistanceConfigContext'
-import type {ConditionalMemberState} from '../helpers/conditionalMembers'
-import {createStyleGuideResolver} from '../helpers/styleguide'
-import {API_VERSION_WITH_EXTENDED_TYPES, useApiClient, useTranslate} from '../useApiClient'
-import {getLanguageParams} from './getLanguageParams'
-import {getPreferredToFieldLanguages, setPreferredToFieldLanguages} from './languageStore'
-import {
-  defaultLanguageOutputs,
-  type FieldLanguageMap,
-  getDocumentMembersFlat,
-  getFieldLanguageMap,
-} from './paths'
-import type {Language} from './types'
-
-interface FieldTranslationParams {
-  document: SanityDocumentLike
-  documentSchema: ObjectSchemaType
-  translatePath: Path
-  conditionalMembers: ConditionalMemberState[]
-}
-
-export interface FieldTranslationContextValue {
-  openFieldTranslation: (args: FieldTranslationParams) => void
-  translationLoading: boolean
-}
-
-export const FieldTranslationContext = createContext<FieldTranslationContextValue>({
-  openFieldTranslation: () => {},
-  translationLoading: false,
-})
-
-export function useFieldTranslation() {
-  return useContext(FieldTranslationContext)
-}
-
-function hasValuesToTranslate(
-  fieldLanguageMaps: FieldLanguageMap[] | undefined,
-  fromLanguage: Language | undefined,
-  basePath: Path,
-) {
-  return fieldLanguageMaps?.some(
-    (map) =>
-      map.inputLanguageId === fromLanguage?.id &&
-      map.inputPath &&
-      pathToString(map.inputPath).startsWith(pathToString(basePath)),
-  )
-}
-
-// eslint-disable-next-line @typescript-eslint/ban-types
-export function FieldTranslationProvider(props: PropsWithChildren<{}>) {
-  const {config: assistConfig} = useAiAssistanceConfig()
-
-  const apiClient = useApiClient(assistConfig.__customApiClient)
-  const styleguide = assistConfig.translate?.styleguide
-  const config = assistConfig.translate?.field
-  const {translate: runTranslate} = useTranslate(apiClient)
-
-  const [dialogOpen, setDialogOpen] = useState(false)
-
-  const [fieldTranslationParams, setFieldTranslationParams] = useState<
-    FieldTranslationParams | undefined
-  >()
-  const [languages, setLanguages] = useState<Language[] | undefined>()
-  const [fromLanguage, setFromLanguage] = useState<Language | undefined>(undefined)
-  const [toLanguages, setToLanguages] = useState<Language[] | undefined>(undefined)
-  const [fieldLanguageMaps, setFieldLanguageMaps] = useState<FieldLanguageMap[] | undefined>()
-
-  const close = useCallback(() => {
-    setDialogOpen(false)
-    setLanguages(undefined)
-    setFieldTranslationParams(undefined)
-  }, [])
-  const languageClient = useClient({
-    apiVersion: config?.apiVersion ?? API_VERSION_WITH_EXTENDED_TYPES,
-  })
-  const documentId = fieldTranslationParams?.document?._id
-  const id = useId()
-
-  const selectFromLanguage = useCallback(
-    (
-      from: Language,
-      languages: Language[] | undefined,
-      params: FieldTranslationParams | undefined,
-    ) => {
-      const {document, documentSchema} = params ?? {}
-      setFromLanguage(from)
-      if (!document || !documentSchema || !params || !languages) {
-        setFieldLanguageMaps(undefined)
-        return
-      }
-
-      const preferred = getPreferredToFieldLanguages(from.id)
-      const allToLanguages = languages.filter((l) => l.id !== from?.id)
-      const filteredToLanguages = allToLanguages.filter(
-        (l) => !preferred.length || preferred.includes(l.id),
-      )
-
-      setToLanguages(filteredToLanguages)
-      const fromId = from?.id
-      const allToIds = allToLanguages?.map((l) => l.id) ?? []
-      const docMembers = getDocumentMembersFlat(document, documentSchema, config?.maxPathDepth)
-      if (fromId && allToIds?.length) {
-        const transMap = getFieldLanguageMap(
-          documentSchema,
-          docMembers,
-          fromId,
-          allToIds.filter((toId) => fromId !== toId),
-          config?.translationOutputs ?? defaultLanguageOutputs,
-        )
-        setFieldLanguageMaps(transMap)
-      } else {
-        setFieldLanguageMaps(undefined)
-      }
-    },
-    [config],
-  )
-
-  const toggleToLanguage = useCallback(
-    (
-      toggledLang: Language,
-      toLanguages: Language[] | undefined,
-      languages: Language[] | undefined,
-    ) => {
-      if (!languages || !fromLanguage) {
-        return
-      }
-      const wasSelected = !!toLanguages?.find((l) => l.id === toggledLang.id)
-      const newToLangs = languages.filter(
-        (anyLang) =>
-          !!toLanguages?.find(
-            (selectedLang) => toggledLang.id !== selectedLang.id && selectedLang.id === anyLang.id,
-          ) ||
-          (toggledLang.id === anyLang.id && !wasSelected),
-      )
-      setToLanguages(newToLangs)
-      setPreferredToFieldLanguages(
-        fromLanguage.id,
-        newToLangs.map((l) => l.id),
-      )
-    },
-    [fromLanguage],
-  )
-
-  const openFieldTranslation = useCallback(
-    async (params: FieldTranslationParams) => {
-      setDialogOpen(true)
-      const languageParams = getLanguageParams(config?.selectLanguageParams, params.document)
-      const languages: Language[] | undefined = await (typeof config?.languages === 'function'
-        ? config?.languages(languageClient, languageParams)
-        : Promise.resolve(config?.languages))
-      setLanguages(languages)
-      setFieldTranslationParams(params)
-      const fromLanguage = languages?.[0]
-      if (fromLanguage) {
-        selectFromLanguage(fromLanguage, languages, params)
-      } else {
-        console.error('No languages available for selected language params', languageParams)
-      }
-    },
-    [selectFromLanguage, config, languageClient],
-  )
-
-  const contextValue: FieldTranslationContextValue = useMemo(() => {
-    return {
-      openFieldTranslation,
-      translationLoading: false,
-    }
-  }, [openFieldTranslation])
-
-  const runDisabled =
-    !fromLanguage ||
-    !toLanguages?.length ||
-    !fieldLanguageMaps?.length ||
-    !documentId ||
-    !hasValuesToTranslate(fieldLanguageMaps, fromLanguage, fieldTranslationParams.translatePath)
-
-  const onRunTranslation = useCallback(() => {
-    const translatePath = fieldTranslationParams?.translatePath
-    if (fieldLanguageMaps && documentId && translatePath) {
-      runTranslate({
-        documentId,
-        translatePath,
-        styleguide: createStyleGuideResolver(styleguide, {
-          client: languageClient,
-          documentId,
-          schemaType: fieldTranslationParams?.documentSchema,
-          translatePath,
-        }),
-        fieldLanguageMap: fieldLanguageMaps.map((map) => ({
-          ...map,
-          // eslint-disable-next-line max-nested-callbacks
-          outputs: map.outputs.filter((out) => !!toLanguages?.find((l) => l.id === out.id)),
-        })),
-        conditionalMembers: fieldTranslationParams?.conditionalMembers,
-      })
-    }
-    close()
-  }, [
-    fieldLanguageMaps,
-    documentId,
-    runTranslate,
-    styleguide,
-    close,
-    toLanguages,
-    fieldTranslationParams?.translatePath,
-    fieldTranslationParams?.conditionalMembers,
-    fieldTranslationParams?.documentSchema,
-    languageClient,
-  ])
-
-  const runButton = (
-    <Button
-      text={`Translate`}
-      tone="primary"
-      icon={PlayIcon}
-      style={{width: '100%'}}
-      disabled={runDisabled}
-      onClick={onRunTranslation}
-    />
-  )
-
-  return (
-    <FieldTranslationContext.Provider value={contextValue}>
-      {dialogOpen ? (
-        <Dialog
-          id={id}
-          width={1}
-          open={dialogOpen}
-          onClose={close}
-          header="Translate fields"
-          footer={
-            <Flex justify="space-between" padding={2} flex={1}>
-              {runDisabled ? (
-                <Tooltip
-                  content={
-                    <Flex padding={2}>
-                      <Text>There is nothing to translate in the selected from-language.</Text>
-                    </Flex>
-                  }
-                  placement="top"
-                >
-                  <Flex flex={1}>{runButton}</Flex>
-                </Tooltip>
-              ) : (
-                runButton
-              )}
-            </Flex>
-          }
-        >
-          {languages ? (
-            <Flex padding={4} gap={5} align="flex-start" justify="center">
-              <Stack space={2}>
-                <Box marginBottom={2}>
-                  <Text weight="semibold">From</Text>
-                </Box>
-                {languages?.map((radioLanguage) => (
-                  <FromLanguageRadio
-                    key={radioLanguage.id}
-                    {...{
-                      radioLanguage,
-                      fromLanguage,
-                      selectFromLanguage,
-                      languages,
-                      fieldTranslationParams,
-                    }}
-                  />
-                ))}
-              </Stack>
-
-              <Stack space={2}>
-                <Box marginBottom={2}>
-                  <Text weight="semibold">To</Text>
-                </Box>
-                {languages.map((checkboxLanguage) => (
-                  <ToLanguageCheckbox
-                    key={checkboxLanguage.id}
-                    {...{checkboxLanguage, fromLanguage, toLanguages, toggleToLanguage, languages}}
-                  />
-                ))}
-              </Stack>
-            </Flex>
-          ) : (
-            <Flex padding={4} gap={2} align="flex-start" justify="center">
-              <Box>
-                <Spinner />
-              </Box>
-              <Text>Loading languages...</Text>
-            </Flex>
-          )}
-        </Dialog>
-      ) : null}
-      {props.children}
-    </FieldTranslationContext.Provider>
-  )
-}
-
-function ToLanguageCheckbox(props: {
-  checkboxLanguage: Language
-  fromLanguage: Language | undefined
-  toLanguages: Language[] | undefined
-  toggleToLanguage: (
-    toggledLang: Language,
-    toLanguages: Language[] | undefined,
-    languages: Language[] | undefined,
-  ) => void
-  languages: Language[]
-}) {
-  const {checkboxLanguage, fromLanguage, toLanguages, toggleToLanguage, languages} = props
-  const langId = checkboxLanguage.id
-  const onChange = useCallback(
-    () => toggleToLanguage(checkboxLanguage, toLanguages, languages),
-    [toggleToLanguage, checkboxLanguage, toLanguages, languages],
-  )
-  return (
-    <Flex
-      key={langId}
-      gap={3}
-      align="center"
-      as={'label'}
-      style={langId === fromLanguage?.id ? {opacity: 0.5} : undefined}
-    >
-      <Checkbox
-        name="toLang"
-        value={langId}
-        checked={langId !== fromLanguage?.id && !!toLanguages?.find((tl) => tl.id === langId)}
-        onChange={onChange}
-        disabled={langId === fromLanguage?.id}
-      />
-      <Text muted={langId === fromLanguage?.id}>{checkboxLanguage.title ?? langId}</Text>
-    </Flex>
-  )
-}
-
-function FromLanguageRadio(props: {
-  radioLanguage: Language
-  fromLanguage: Language | undefined
-  selectFromLanguage: (
-    from: Language,
-    languages: Language[] | undefined,
-    params: FieldTranslationParams | undefined,
-  ) => void
-  languages: Language[] | undefined
-  fieldTranslationParams: FieldTranslationParams | undefined
-}) {
-  const {languages, radioLanguage, selectFromLanguage, fromLanguage, fieldTranslationParams} = props
-  const langId = radioLanguage.id
-
-  const onChange = useCallback(
-    () => selectFromLanguage(radioLanguage, languages, fieldTranslationParams),
-    [selectFromLanguage, radioLanguage, languages, fieldTranslationParams],
-  )
-  return (
-    <Flex key={langId} gap={3} align="center" as={'label'}>
-      <Radio
-        name="fromLang"
-        value={langId}
-        checked={langId === fromLanguage?.id}
-        onChange={onChange}
-      />
-      <Text>{radioLanguage.title ?? radioLanguage.id}</Text>
-    </Flex>
-  )
-}

package/src/translate/getLanguageParams.ts

@@ -1,26 +0,0 @@
-import {get} from 'lodash'
-import type {SanityDocumentLike} from 'sanity'
-
-export const getLanguageParams = (
-  select: Record<string, string> | undefined,
-  document: SanityDocumentLike | undefined,
-): Record<string, unknown> => {
-  if (!select || !document) {
-    return {}
-  }
-
-  const selection: Record<string, string> = select || {}
-  const selectedValue: Record<string, unknown> = {}
-  for (const [key, path] of Object.entries(selection)) {
-    let value = get(document, path)
-    if (Array.isArray(value)) {
-      // If there are references in the array, ensure they have `_ref` set, otherwise they are considered empty and can safely be ignored
-      value = value.filter((item) =>
-        typeof item === 'object' ? item?._type !== 'reference' || '_ref' in item : true,
-      )
-    }
-    selectedValue[key] = value
-  }
-
-  return selectedValue
-}

package/src/translate/languageStore.ts

@@ -1,18 +0,0 @@
-export const toFieldLanguagesKeyPrefix = 'sanityStudio:assist:field-languages:from:'
-
-export function getPreferredToFieldLanguages(fromLanguageId: string): string[] {
-  if (typeof localStorage === 'undefined') {
-    return []
-  }
-
-  const value = localStorage.getItem(`${toFieldLanguagesKeyPrefix}${fromLanguageId}`)
-  return value ? (JSON.parse(value) as string[]) : []
-}
-
-export function setPreferredToFieldLanguages(fromLanguageId: string, languageIds: string[]) {
-  if (typeof localStorage === 'undefined') {
-    return
-  }
-
-  localStorage.setItem(`${toFieldLanguagesKeyPrefix}${fromLanguageId}`, JSON.stringify(languageIds))
-}

package/src/translate/paths.test.ts

@@ -1,181 +0,0 @@
-import {Schema} from '@sanity/schema'
-import {
-  defineType,
-  type ObjectSchemaType,
-  pathToString,
-  type SanityDocumentLike,
-  typed,
-} from 'sanity'
-import {describe, expect, test} from 'vitest'
-
-import {
-  defaultLanguageOutputs,
-  type FieldLanguageMap,
-  getDocumentMembersFlat,
-  getFieldLanguageMap,
-} from './paths'
-
-describe('paths', () => {
-  test('should return internationalizedArrayString paths and find translation mappings', () => {
-    const docSchema: ObjectSchemaType = Schema.compile({
-      name: 'test',
-      types: [
-        defineType({
-          type: 'document',
-          name: 'article',
-          fields: [
-            {type: 'string', name: 'title'},
-            {
-              type: 'object',
-              name: 'localeTitle',
-              fields: [
-                {type: 'string', name: 'en'},
-                {type: 'string', name: 'no'},
-              ],
-            },
-            {
-              type: 'array',
-              name: 'translations',
-              of: [
-                {
-                  type: 'object',
-                  name: 'internationalizedArrayString',
-                  fields: [{type: 'string', name: 'value'}],
-                },
-              ],
-            },
-          ],
-        }),
-      ],
-    }).get('article')
-
-    const doc: SanityDocumentLike = {
-      _id: 'na',
-      _type: 'article',
-      title: 'some title',
-      localeTitle: {
-        en: 'en string',
-      },
-      translations: [
-        {
-          _type: 'internationalizedArrayString',
-          _key: 'en',
-          value: 'some string',
-        },
-      ],
-    }
-
-    const members = getDocumentMembersFlat(doc, docSchema)
-    expect(members.map((p) => pathToString(p.path))).toEqual([
-      'title',
-      'localeTitle',
-      'localeTitle.en',
-      // this path has no value in the document, so are not included
-      //'localeTitle.no',
-      'translations',
-      'translations[_key=="en"]',
-      'translations[_key=="en"].value',
-      // these path has no value in the document, so are not included
-      //'translations[_key=="nb"]',
-      //'translations[_key=="nb"].value',
-    ])
-
-    const transMap = getFieldLanguageMap(docSchema, members, 'en', ['nb'], defaultLanguageOutputs)
-
-    expect(transMap).toEqual(
-      typed<FieldLanguageMap[]>([
-        {
-          inputLanguageId: 'en',
-          inputPath: ['translations', {_key: 'en'}],
-          outputs: [{id: 'nb', outputPath: ['translations', {_key: 'nb'}]}],
-        },
-      ]),
-    )
-  })
-
-  test('should use first type in array when array item is missing _type', () => {
-    const docSchema: ObjectSchemaType = Schema.compile({
-      name: 'test',
-      types: [
-        defineType({
-          type: 'document',
-          name: 'article',
-          fields: [
-            {
-              type: 'array',
-              name: 'translations',
-              of: [
-                {
-                  type: 'object',
-                  name: 'internationalizedArrayString',
-                  fields: [{type: 'string', name: 'value'}],
-                },
-              ],
-            },
-          ],
-        }),
-      ],
-    }).get('article')
-
-    const doc: SanityDocumentLike = {
-      _id: 'na',
-      _type: 'article',
-      translations: [
-        {
-          //assume type is missing in the data for some reason
-          //_type: 'internationalizedArrayString',
-          _key: 'en',
-          value: 'some string',
-        },
-      ],
-    }
-
-    const members = getDocumentMembersFlat(doc, docSchema)
-    expect(members.map((p) => pathToString(p.path))).toEqual([
-      'translations',
-      'translations[_key=="en"]',
-      'translations[_key=="en"].value',
-    ])
-  })
-
-  test('should limit depth to 1 when specified', () => {
-    const docSchema: ObjectSchemaType = Schema.compile({
-      name: 'test',
-      types: [
-        defineType({
-          type: 'document',
-          name: 'article',
-          fields: [
-            {
-              type: 'array',
-              name: 'translations',
-              of: [
-                {
-                  type: 'object',
-                  name: 'internationalizedArrayString',
-                  fields: [{type: 'string', name: 'value'}],
-                },
-              ],
-            },
-          ],
-        }),
-      ],
-    }).get('article')
-
-    const doc: SanityDocumentLike = {
-      _id: 'na',
-      _type: 'article',
-      translations: [
-        {
-          //assume type is missing in the data for some reason
-          //_type: 'internationalizedArrayString',
-          _key: 'en',
-          value: 'some string',
-        },
-      ],
-    }
-
-    const members = getDocumentMembersFlat(doc, docSchema, 1)
-    expect(members.map((p) => pathToString(p.path))).toEqual(['translations'])
-  })
-})