Doc properties - compound & url

src/cloud/components/ContentManager/ContentManagerToolbar.tsx

@@ -292,18 +292,10 @@ const ContentManagerToolbar = ({
 
       const docProp = props[key] as FilledSerializedPropData
       switch (docProp.type) {
-        case 'json':
-          if (docProp.data.dataType === 'timeperiod') {
-            values[key] = {
-              type: docProp.type,
-              subType: 'timeperiod',
-              value: docProp.data.data,
-            }
-          }
-          break
         case 'user':
           values[key] = {
             type: docProp.type,
+            subType: docProp.subType,
             value:
               docProp.data == null
                 ? []
@@ -315,6 +307,7 @@ const ContentManagerToolbar = ({
         case 'status':
           values[key] = {
             type: docProp.type,
+            subType: docProp.subType,
             value:
               docProp.data == null
                 ? undefined
@@ -328,6 +321,7 @@ const ContentManagerToolbar = ({
         case 'string':
           values[key] = {
             type: docProp.type,
+            subType: docProp.subType,
             value: docProp.data,
           }
           break
@@ -366,14 +360,6 @@ const ContentManagerToolbar = ({
 
         const docProp = props[key] as FilledSerializedPropData
         switch (docProp.type) {
-          case 'json':
-            if (
-              docProp.data.dataType !== 'timeperiod' ||
-              docProp.data.data !== values[key]['value']
-            ) {
-              delete values[key]
-            }
-            break
           case 'user':
             {
               let newUserArray = values[key].value.slice() as string[]
@@ -391,11 +377,9 @@ const ContentManagerToolbar = ({
           case 'status':
             {
               const docPropStatus: SerializedStatus | undefined =
-                props[key] == null
-                  ? undefined
-                  : Array.isArray(props[key].data)
-                  ? props[key].data[0]
-                  : props[key].data
+                docProp[key] == Array.isArray(docProp[key].data)
+                  ? docProp[key].data[0]
+                  : docProp[key].data
               if (
                 docPropStatus == null ||
                 docPropStatus.id !== values[key].value.id
@@ -595,8 +579,9 @@ const ContentManagerToolbar = ({
                     updateProp([
                       propColumn.name,
                       {
-                        type: 'json',
-                        data: { dataType: 'timeperiod', data: val },
+                        type: 'number',
+                        subType: 'timeperiod',
+                        data: val,
                       },
                     ])
                   }}

src/cloud/components/DocPage/index.tsx

@@ -22,6 +22,7 @@ import ColoredBlock from '../../../design/components/atoms/ColoredBlock'
 import Editor from '../Editor'
 import ApplicationPage from '../ApplicationPage'
 import { freePlanDocLimit, freePlanMembersLimit } from '../../lib/subscription'
+import { useCloudDocPreview } from '../../lib/hooks/useCloudDocPreview'
 
 interface DocPageProps {
   doc: SerializedDocWithSupplemental
@@ -74,6 +75,7 @@ const DocPage = ({
   }, [currentDoc, team])
 
   useTitle(pageTitle)
+  useCloudDocPreview(team)
 
   useEffect(() => {
     if (currentDoc == null) {

src/cloud/components/DocProperties.tsx

@@ -84,12 +84,9 @@ const DocProperties = ({
             </div>
             {docProperties.map((prop, i) => {
               const iconPath = getIconPathOfPropType(
-                prop[1].data.type === 'json' &&
-                  prop[1].data.data != null &&
-                  prop[1].data.data.dataType != null
-                  ? prop[1].data.data.dataType
-                  : prop[1].data.type
+                prop[1].data.subType || prop[1].data.type
               )
+
               return (
                 <div className='doc-props__property' key={`prop-${i}`}>
                   <Button
@@ -108,7 +105,8 @@ const DocProperties = ({
                           onUpdate={(prop, updated) => {
                             if (
                               prop.name !== updated.name ||
-                              prop.data.type !== updated.data.type
+                              prop.data.type !== updated.data.type ||
+                              prop.data.subType !== updated.data.subType
                             ) {
                               modifyProp(prop.name, updated.name, updated.data)
                             }

src/cloud/components/Modal/contents/SmartView/ConditionItem.tsx

@@ -74,8 +74,9 @@ const ConditionItem = ({
               onChange: (selectedOption: { label: any; value: string }) => {
                 update(
                   getDefaultConditionByType(
-                    selectedOption.value,
-                    condition.rule
+                    selectedOption.value.split('/')[0],
+                    condition.rule,
+                    selectedOption.value.split('/')[1] || undefined
                   )
                 )
               },
@@ -152,8 +153,8 @@ function inferConditionPrimaryType(t: TFunction, condition: EditableCondition) {
             value: supportedCustomPropertyTypes['status'].value,
           }
           break
-        case 'json':
-          switch (condition.value.value.type) {
+        case 'number':
+          switch (condition.value.subType) {
             case 'timeperiod':
               return {
                 label: (
@@ -167,7 +168,6 @@ function inferConditionPrimaryType(t: TFunction, condition: EditableCondition) {
             default:
               break
           }
-
         //unsupported
         case 'number':
         default:
@@ -180,7 +180,8 @@ function inferConditionPrimaryType(t: TFunction, condition: EditableCondition) {
 
 function getDefaultConditionByType(
   type: string,
-  rule: 'and' | 'or'
+  rule: 'and' | 'or',
+  subType?: string
 ): EditableCondition {
   switch (type) {
     case 'date': {
@@ -193,6 +194,7 @@ function getDefaultConditionByType(
             type: 'relative',
             period: 0,
           },
+          subType,
           type: 'date',
         },
       }
@@ -205,19 +207,18 @@ function getDefaultConditionByType(
           name: '',
           value: [],
           type: 'user',
+          subType,
         },
       }
-    case 'json':
+    case 'number':
       return {
         rule,
         type: 'prop',
         value: {
           name: '',
-          value: {
-            type: 'timeperiod',
-            value: 0,
-          },
-          type: 'json',
+          value: 0,
+          type: 'number',
+          subType,
         },
       }
     case 'status':
@@ -228,6 +229,7 @@ function getDefaultConditionByType(
           name: '',
           value: -1,
           type: 'status',
+          subType,
         },
       }
     case 'label':

src/cloud/components/Modal/contents/SmartView/ConditionValueControl.tsx

@@ -215,7 +215,7 @@ const PropConditionValueControl = ({
             }
           />
         )}
-        {condition.type === 'number' && (
+        {condition.type === 'number' && condition.subType == null && (
           <FormInput
             type='number'
             value={condition.value.toString()}
@@ -227,17 +227,15 @@ const PropConditionValueControl = ({
             }
           />
         )}
-        {condition.type === 'json' && condition.value.type === 'timeperiod' && (
+        {condition.type === 'number' && condition.subType === 'timeperiod' && (
           <TimePeriodForm
             disabled={
               condition.name.trim() === '' ||
               sendingMap.get('properties') === 'suggestions'
             }
-            period={condition.value.value}
+            period={condition.value}
             updatePeriod={(period) => {
-              updateValue({
-                value: { type: 'timeperiod', value: period },
-              })
+              updateValue({ value: period })
             }}
           />
         )}