Merge pull request #214 from terminusdb/newDoc

Francesca-Bit · web-flow · commit 7ab126e90920 · 2023-04-25T11:52:59.000+01:00
document links create filled form retention on submit error
diff --git a/packages/tdb-dashboard/src/components/Alerts.js b/packages/tdb-dashboard/src/components/Alerts.js
@@ -65,7 +65,7 @@ export const Alerts = ({message, type, onCancel, time}) => {
             <div className="d-flex justify-content-between">
                 <div className="w-100">
                     <FaExclamationTriangle className="me-1 mb-1" />
-                    {/*<strong>Oops! Something went wrong.</strong>*/} {message}
+                    {<strong>ERROR: </strong>} {message}
                 </div> 
                 <AlertCloseButton className={"alert_btn_close alert_danger_text"} onClick={() => onClose("danger")}/>
             </div>
diff --git a/packages/tdb-documents-ui/src/components/CreateDocumentLink.js b/packages/tdb-documents-ui/src/components/CreateDocumentLink.js
@@ -13,7 +13,7 @@ import { DisplayDocumentation } from "../templates"
 import { documentInternalProperties } from "../helpers/documentHelpers"
 
 // display based on action  
-const DisplayLinkFrame = ({ reference, args, linkPropertyComment, order_by, onSelect, propertyDocumentation, documentData, cardKey, setDocumentData, action, onChange, documentLinkPropertyName, extracted, required, mode, linked_to, linkId }) => {
+const DisplayLinkFrame = ({ reference, args, linkPropertyComment, formData, order_by, onSelect, propertyDocumentation, documentData, cardKey, setDocumentData, action, onChange, documentLinkPropertyName, extracted, required, mode, linked_to, linkId }) => {
 
   let nextCreateLink =  false
 
@@ -126,6 +126,7 @@ const DisplayLinkFrame = ({ reference, args, linkPropertyComment, order_by, onSe
           //hideFieldLabel={hideFieldLabel}
           linkId={linkId}
           onSelect={onSelect}
+          formData={formData &&  formData.hasOwnProperty(field) && formData[field] ? formData[field] : false}
           args={args}
           depth={cardKey}
           reference={reference}
@@ -147,7 +148,7 @@ const DisplayLinkFrame = ({ reference, args, linkPropertyComment, order_by, onSe
           propertyName: documentLinkPropertyName,
           id: fieldID,
           key: `${linked_to}__${uuidv4()}`,
-          formData: util.getFormDataPerProperty(documentData, fieldName),
+          formData: formData && formData.hasOwnProperty(fieldName) && formData[fieldName]? {[fieldName]: formData[fieldName]} :util.getFormDataPerProperty(documentData, fieldName),
           required: definitions.required.includes(fieldName),
           mode: mode,
           args: args,
@@ -172,7 +173,7 @@ const DisplayLinkFrame = ({ reference, args, linkPropertyComment, order_by, onSe
 
     return <SearchExistingLink onSelect={onSelect}
       mode={mode} 
-      formData={null}
+      formData={formData}
       onChange={onChange}
       id={cardKey}
       linked_to={linked_to}/>
@@ -182,7 +183,7 @@ const DisplayLinkFrame = ({ reference, args, linkPropertyComment, order_by, onSe
 }
  
 
-export const CreateDisplay = ({ args, name, linkPropertyComment, order_by, reference, required, onSelect, propertyDocumentation, cardKey, linked_to, extracted, mode, onChange, action, setAction, documentData, setDocumentData, linkId }) => {
+export const CreateDisplay = ({ args, name, formData,linkPropertyComment, order_by, reference, required, onSelect, propertyDocumentation, cardKey, linked_to, extracted, mode, onChange, action, setAction, documentData, setDocumentData, linkId }) => {
   
   return <>
     {getDocumentLinkChoiceDescription(name, linked_to)}
@@ -200,6 +201,7 @@ export const CreateDisplay = ({ args, name, linkPropertyComment, order_by, refer
       onChange={onChange}
       onSelect={onSelect}
       order_by={order_by}
+      formData={formData}
       linked_to={linked_to}
       documentLinkPropertyName={name}
       documentData={documentData} 
@@ -214,12 +216,18 @@ function getID (linkId, depth) {
   }
   return depth+1
 }
+
+export function extractFormData(formData, linked_to) {
+  if(typeof formData === CONST.STRING_TYPE) return formData
+  if(Object.keys(formData).length) return formData
+  return { [CONST.TYPE]: linked_to }
+}
  
 // CREATE MODE
-export const CreateDocument = ({ args, name, required, onSelect, reference, order_by, hideFieldLabel, linked_to, extracted, mode, onChange, depth, propertyDocumentation, linkId }) => {
+export const CreateDocument = ({ args, name, required, formData, onSelect, reference, order_by, hideFieldLabel, linked_to, extracted, mode, onChange, depth, propertyDocumentation, linkId }) => {
 
-  const [action, setAction] = useState(false)
-  const [documentData, setDocumentData] = useState({ [CONST.TYPE]: linked_to }) 
+  const [action, setAction] = useState(formData ? typeof formData===CONST.STRING_TYPE ? CONST.LINK_EXISTING_DOCUMENT : CONST.LINK_NEW_DOCUMENT :false) 
+  const [documentData, setDocumentData] = useState(formData ? extractFormData(formData, linked_to) : { [CONST.TYPE]: linked_to }) 
   //const [cardKey, setCardKey]=useState(uuidv4())
   const [cardKey, setCardKey]=useState(getID(linkId, depth)) 
 
@@ -230,6 +238,7 @@ export const CreateDocument = ({ args, name, required, onSelect, reference, orde
     if(linked_to) setDocumentData({ [CONST.TYPE]: linked_to } )
   }, [linked_to])
 
+
   return <>
     <DisplayDocumentation documentation={propertyDocumentation}/>
     <Stack direction="horizontal">
@@ -244,6 +253,7 @@ export const CreateDocument = ({ args, name, required, onSelect, reference, orde
             extracted={extracted} 
             mode= {mode} 
             linkId={linkId}
+            formData={formData}
             args={args}
             order_by={order_by}
             propertyDocumentation={propertyDocumentation}
diff --git a/packages/tdb-documents-ui/src/components/EditDocumentLink.js b/packages/tdb-documents-ui/src/components/EditDocumentLink.js
@@ -13,6 +13,7 @@ import { CreateDocument, CreateDisplay } from "./CreateDocumentLink"
 import { UnlinkButton } from "./UnlinkButton"
 import { SearchExistingLink } from "./SearchExistingLink"
 import { documentInternalProperties } from "../helpers/documentHelpers"
+import { extractFormData } from "./CreateDocumentLink"
 
 const DisplayFilledFrame = ({ args, documentData, propertyDocumentation, onTraverse, onSelect, reference, setDocumentData, unfoldable, cardKey, action, formData, onChange, documentLinkPropertyName, extracted, required, mode, linked_to, clickedUnlinked }) => {
 
@@ -48,6 +49,7 @@ const DisplayFilledFrame = ({ args, documentData, propertyDocumentation, onTrave
           fields.push(<CreateDocument name={field} 
           linked_to={linked_to}
           mode={mode}
+          formData={formData &&  formData.hasOwnProperty(field) && formData[field] ? formData[field] : false}
           args={args}
           propertyDocumentation={propertyDocumentation}
           depth={cardKey}
@@ -72,7 +74,8 @@ const DisplayFilledFrame = ({ args, documentData, propertyDocumentation, onTrave
             args={args}
             onTraverse={onTraverse}
             unfoldable={unfoldable}
-            formData={formData[field]}
+            formData={formData &&  formData.hasOwnProperty(field) && formData[field] ? formData[field] : false}
+            //formData={formData[field]}
             extracted={definitions}
             //comment={comment}  // review
             required={required} />)
@@ -96,7 +99,7 @@ const DisplayFilledFrame = ({ args, documentData, propertyDocumentation, onTrave
           required: definitions.required.includes(fieldName),
           mode: mode,
           args: args,
-          //fieldUIFrame: fieldUIFrame, // review diff ui
+          //fieldUIFrame: fieldUIFrame, // review diff ui 
           onChange: handleChange,
           currentDocumentClass: documentData[CONST.TYPE],
           defaultClassName: defaultClassName,
@@ -177,13 +180,13 @@ const EditHelper = ({ linked_to, cardKey, setDeleteLink, clickedUnlinked }) => {
       label={"Unlink"}
       id={cardKey} />
   </Stack>
-}
+} 
  
 // EDIT MODE
 export const EditDocument = ({ name, args, reference, onTraverse, clickedUnlinked, index, order_by, propertyDocumentation, hideFieldLabel, onSelect, required, comment, formData, linked_to, extracted, mode, onChange, unfoldable, depth }) => {
 
   const [action, setAction] = useState(getAction(formData, unfoldable))
-  const [documentData, setDocumentData] = useState(formData)
+  const [documentData, setDocumentData] = useState(formData ? extractFormData(formData, linked_to) : { [CONST.TYPE]: linked_to })
   const [deleteLink, setDeleteLink] = useState(false)
   const [cardKey, setCardKey]=useState(depth+1)
   //const [cardKey, setCardKey]=useState(uuidv4())
@@ -216,11 +219,11 @@ export const EditDocument = ({ name, args, reference, onTraverse, clickedUnlinke
           clickedUnlinked={clickedUnlinked}
           cardKey={cardKey}
           unfoldable={unfoldable}
+          formData={formData}
           reference={reference}
           onChange={onChange}
           linked_to={linked_to}
           onSelect={onSelect}
-          formData={formData}
           documentLinkPropertyName={name}
           documentData={documentData} 
           setDocumentData={setDocumentData}/>}
@@ -235,6 +238,7 @@ export const EditDocument = ({ name, args, reference, onTraverse, clickedUnlinke
             args={args}
             onSelect={onSelect}
             reference={reference}
+            formData={formData &&  formData.hasOwnProperty(name) && formData[name] ? formData[name] : false}
             linked_to={linked_to} 
             extracted={extracted} 
             mode= {mode} 
diff --git a/packages/tdb-documents-ui/src/utils.js b/packages/tdb-documents-ui/src/utils.js
@@ -401,6 +401,7 @@ export function availableInReference (references, documentType) {
 // used to get config form data for subdocuments, documentlinks etc.
 export function getFormDataPerProperty (subDocumentData, fieldName) {
   if(subDocumentData.hasOwnProperty(fieldName)) return subDocumentData[fieldName]
+	//if(subDocumentData.hasOwnProperty(fieldName)) return {[fieldName] : subDocumentData[fieldName]}
   return ""
 }
 
diff --git a/packages/tdb-documents-ui/src/widgets/choiceDocumentsWidget.js b/packages/tdb-documents-ui/src/widgets/choiceDocumentsWidget.js
@@ -41,6 +41,7 @@ const DisplaySelectedDocument = ({ props, selected, args, id, clickedUnlinked, c
       mode={mode}
       hideFieldLabel={true}
       args={args}
+      formData={props && props.formData ?  props.formData : false}
       onSelect={onSelect}
       clickedUnlinked={clickedUnlinked}
       reference={reference}
diff --git a/packages/tdb-documents-ui/src/widgets/documentWidget.js b/packages/tdb-documents-ui/src/widgets/documentWidget.js
@@ -21,6 +21,7 @@ export const TDBDocument = ({ args, extracted, reference, uiFrame, clickedUnlink
     linkId={linkId}
     order_by={order_by}
     args={args}
+    formData={props && props.formData ? props.formData : false}
     onSelect={onSelect}
     mode={mode}
     hideFieldLabel={hideFieldLabel}

Original file line number	Diff line number	Diff line change
`@@ -401,6 +401,7 @@ export function availableInReference (references, documentType) {`
`401`	`401`	`// used to get config form data for subdocuments, documentlinks etc.`
`402`	`402`	`export function getFormDataPerProperty (subDocumentData, fieldName) {`
`403`	`403`	`if(subDocumentData.hasOwnProperty(fieldName)) return subDocumentData[fieldName]`
	`404`	`+ //if(subDocumentData.hasOwnProperty(fieldName)) return {[fieldName] : subDocumentData[fieldName]}`
`404`	`405`	`return ""`
`405`	`406`	`}`
`406`	`407`