fix(fields): add optional pageId to fields

This feature should already be included into v2.0.0 but went missing.
This change adds a optional pageId property to all fields thatare based
on the template id of the jaen context.

This change is required to make the fields more flexible by allowing
to use the same field in different contexts.

Author: schettn

packages/jaen-pages/src/containers/fields/ChoiceField/index.tsx

@@ -48,7 +48,8 @@ const ChoiceField: React.FC<ChoiceFieldProps> = ({
   onRenderPopover,
   onRender,
   initValue,
-  fieldName
+  fieldName,
+  ...props
 }) => {
   const dispatch = useAppDispatch()
 
@@ -58,7 +59,7 @@ const ChoiceField: React.FC<ChoiceFieldProps> = ({
   const field = {initValue, fieldName, block}
 
   const {jaenPageContext} = useTemplate()
-  const pageId = jaenPageContext.id
+  const pageId = props.pageId || jaenPageContext.id
 
   const register = () => dispatch(registerPageField({pageId, field}))
   const unregister = () => dispatch(unregisterPageField({pageId, field}))

packages/jaen-pages/src/containers/fields/ImageField/index.tsx

@@ -36,7 +36,7 @@ const ImageField: React.FC<ImageFieldProps> = ({
   const dispatch = useAppDispatch()
   const isEditing = useAppSelector(state => state.options.isEditing)
   const {jaenPageContext} = useTemplate()
-  const pageId = jaenPageContext.id
+  const pageId = props.pageId || jaenPageContext.id
 
   const page = usePage(pageId)
 

packages/jaen-pages/src/containers/fields/TextField/index.tsx

@@ -28,12 +28,13 @@ const TextField: React.FC<TextFieldProps> = ({
   rtf = true,
   toolbar = 'balloon',
   fieldName,
-  initValue
+  initValue,
+  ...props
 }) => {
   const dispatch = useAppDispatch()
   const isEditing = useAppSelector(state => state.options.isEditing)
   const {jaenPageContext} = useTemplate()
-  const pageId = jaenPageContext.id
+  const pageId = props.pageId || jaenPageContext.id
 
   const {block, updatedFieldName} = useBlock(fieldName)
   fieldName = updatedFieldName

packages/jaen-pages/src/types.ts

@@ -16,6 +16,10 @@ export type StreamBlockIdentifier = {
 export type FieldIdentifier = {
   initValue: any
   fieldName: string
+  /**
+   * Override the default pageId for the field.
+   */
+  pageId?: string
 }
 
 export type BlockIdentifier = {