feat: updates tab preference keys

This commit is contained in:
Jacob Fletcher
2022-11-14 18:30:18 -05:00
parent 32833ec571
commit 35426eef36
14 changed files with 27 additions and 14 deletions

View File

@@ -20,7 +20,7 @@ const RenderFields: React.FC<Props> = (props) => {
readOnly: readOnlyOverride,
className,
forceRender,
pathByIndex: incomingFieldIndex
indexPath: incomingIndexPath
} = props;
const [hasRendered, setHasRendered] = useState(Boolean(forceRender));
@@ -91,7 +91,7 @@ const RenderFields: React.FC<Props> = (props) => {
...field,
path: field.path || (isFieldAffectingData ? field.name : ''),
fieldTypes,
pathByIndex: incomingFieldIndex ? `${incomingFieldIndex}[${fieldIndex}]` : `[${fieldIndex}]`,
indexPath: incomingIndexPath ? `${incomingIndexPath}.${fieldIndex}` : `${fieldIndex}`,
admin: {
...(field.admin || {}),
readOnly,

View File

@@ -12,5 +12,5 @@ export type Props = {
filter?: (field: Field) => boolean
fieldSchema: FieldWithPath[]
fieldTypes: FieldTypes
pathByIndex: string
indexPath?: string
}

View File

@@ -38,6 +38,7 @@ const ArrayFieldType: React.FC<Props> = (props) => {
maxRows,
minRows,
permissions,
indexPath,
admin: {
readOnly,
description,
@@ -292,6 +293,7 @@ const ArrayFieldType: React.FC<Props> = (props) => {
readOnly={readOnly}
fieldTypes={fieldTypes}
permissions={permissions?.fields}
indexPath={indexPath}
fieldSchema={fields.map((field) => ({
...field,
path: `${path}.${i}${fieldAffectsData(field) ? `.${field.name}` : ''}`,

View File

@@ -7,4 +7,5 @@ export type Props = Omit<ArrayField, 'type'> & {
fieldTypes: FieldTypes
permissions: FieldPermissions
label: string | false
indexPath: string
}

View File

@@ -50,6 +50,7 @@ const BlocksField: React.FC<Props> = (props) => {
required,
validate = blocksValidator,
permissions,
indexPath,
admin: {
readOnly,
description,
@@ -345,6 +346,7 @@ const BlocksField: React.FC<Props> = (props) => {
...field,
path: `${path}.${i}${fieldAffectsData(field) ? `.${field.name}` : ''}`,
}))}
indexPath={indexPath}
/>
</Collapsible>

View File

@@ -6,4 +6,5 @@ export type Props = Omit<BlockField, 'type'> & {
path?: string
fieldTypes: FieldTypes
permissions: FieldPermissions
indexPath: string
}

View File

@@ -21,7 +21,7 @@ const CollapsibleField: React.FC<Props> = (props) => {
fieldTypes,
path,
permissions,
pathByIndex,
indexPath,
admin: {
readOnly,
className,
@@ -78,7 +78,7 @@ const CollapsibleField: React.FC<Props> = (props) => {
readOnly={readOnly}
permissions={permissions}
fieldTypes={fieldTypes}
pathByIndex={pathByIndex}
indexPath={indexPath}
fieldSchema={fields.map((field) => ({
...field,
path: getFieldPath(path, field),

View File

@@ -6,5 +6,5 @@ export type Props = Omit<CollapsibleField, 'type'> & {
path?: string
fieldTypes: FieldTypes
permissions: FieldPermissions
pathByIndex: string
indexPath: string
}

View File

@@ -19,6 +19,7 @@ const Group: React.FC<Props> = (props) => {
name,
path: pathFromProps,
fieldTypes,
indexPath,
admin: {
readOnly,
style,
@@ -70,6 +71,7 @@ const Group: React.FC<Props> = (props) => {
permissions={permissions?.fields}
readOnly={readOnly}
fieldTypes={fieldTypes}
indexPath={indexPath}
fieldSchema={fields.map((subField) => ({
...subField,
path: `${path}${fieldAffectsData(subField) ? `.${subField.name}` : ''}`,

View File

@@ -6,4 +6,5 @@ export type Props = Omit<GroupField, 'type'> & {
path?: string
fieldTypes: FieldTypes
permissions: FieldPermissions
indexPath: string
}

View File

@@ -16,6 +16,7 @@ const Row: React.FC<Props> = (props) => {
readOnly,
className,
},
indexPath
} = props;
const classes = [
@@ -30,6 +31,7 @@ const Row: React.FC<Props> = (props) => {
className={classes}
permissions={permissions}
fieldTypes={fieldTypes}
indexPath={indexPath}
fieldSchema={fields.map((field) => ({
...field,
path: getFieldPath(path, field),

View File

@@ -6,4 +6,5 @@ export type Props = Omit<RowField, 'type'> & {
path?: string
fieldTypes: FieldTypes
permissions: FieldPermissions
indexPath: string
}

View File

@@ -21,7 +21,7 @@ const TabsField: React.FC<Props> = (props) => {
fieldTypes,
path,
permissions,
pathByIndex,
indexPath,
admin: {
readOnly,
className,
@@ -33,15 +33,16 @@ const TabsField: React.FC<Props> = (props) => {
const isWithinCollapsible = useCollapsible();
const [activeTabIndex, setActiveTabIndex] = useState<number>(0);
const tabsPrefKey = `tabs-${indexPath}`;
useEffect(() => {
const getInitialPref = async () => {
const existingPreferences: DocumentPreferences = await getPreference(preferencesKey);
const initialIndex = path ? existingPreferences?.fields?.[path]?.tabIndex : existingPreferences?.fields?.[pathByIndex]?.tabIndex;
const initialIndex = path ? existingPreferences?.fields?.[path]?.tabIndex : existingPreferences?.fields?.[tabsPrefKey]?.tabIndex;
setActiveTabIndex(initialIndex || 0)
}
getInitialPref();
}, [path, pathByIndex])
}, [path, indexPath])
const handleTabChange = useCallback((incomingTabIndex: number) => {
setActiveTabIndex(incomingTabIndex)
@@ -62,8 +63,8 @@ const TabsField: React.FC<Props> = (props) => {
} : {
fields: {
...existingPreferences?.fields,
[pathByIndex]: {
...existingPreferences?.fields?.[pathByIndex],
[tabsPrefKey]: {
...existingPreferences?.fields?.[tabsPrefKey],
tabIndex: incomingTabIndex,
}
},
@@ -72,7 +73,7 @@ const TabsField: React.FC<Props> = (props) => {
}
handlePref();
}, [pathByIndex, preferencesKey, getPreference, setPreference, path])
}, [indexPath, preferencesKey, getPreference, setPreference, path])
const activeTabConfig = tabs[activeTabIndex];
@@ -126,7 +127,7 @@ const TabsField: React.FC<Props> = (props) => {
...field,
path: `${path ? `${path}.` : ''}${tabHasName(activeTabConfig) ? `${activeTabConfig.name}.` : ''}${fieldAffectsData(field) ? field.name : ''}`,
}))}
pathByIndex={pathByIndex}
indexPath={indexPath}
/>
</div>
)}

View File

@@ -6,5 +6,5 @@ export type Props = Omit<TabsField, 'type'> & {
path?: string
fieldTypes: FieldTypes
permissions: FieldPermissions
pathByIndex: string
indexPath: string
}