From 1fcd36514f24fbd2f2591111f6038f8ebf4bc2d8 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Sat, 10 Feb 2024 20:29:27 -0500
Subject: minimal fix to get react date picker to work.

---
 src/client/documents/Documents.ts                  |  1 +
 .../collectionSchema/SchemaTableCell.tsx           | 37 ++++++++++++++++++----
 2 files changed, 32 insertions(+), 6 deletions(-)

(limited to 'src')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 355a4c937..2d2f5fe4a 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -252,6 +252,7 @@ export class DocumentOptions {
     layout_hideDecorationTitle?: BOOLt = new BoolInfo('whether to suppress the document decortations title when selected');
     _layout_hideContextMenu?: BOOLt = new BoolInfo('whether the context menu can be shown');
     layout_borderRounding?: string;
+    _layout_modificationDate?: DATEt = new DateInfo('last modification date of doc layout', false);
     _layout_nativeDimEditable?: BOOLt = new BoolInfo('native dimensions can be modified using document decoration reizers', false);
     _layout_reflowVertical?: BOOLt = new BoolInfo('native height can be changed independent of width by dragging decoration resizers');
     _layout_reflowHorizontal?: BOOLt = new BoolInfo('whether a doc with a native size can be horizonally resized, causing some form of reflow');
diff --git a/src/client/views/collections/collectionSchema/SchemaTableCell.tsx b/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
index 5c0eba860..001ad5ab6 100644
--- a/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaTableCell.tsx
@@ -24,6 +24,11 @@ import { KeyValueBox } from '../../nodes/KeyValueBox';
 import { FormattedTextBox } from '../../nodes/formattedText/FormattedTextBox';
 import { ColumnType, FInfotoColType } from './CollectionSchemaView';
 import './CollectionSchemaView.scss';
+import 'react-datepicker/dist/react-datepicker.css';
+import { Popup, Size, Type } from 'browndash-components';
+import { IconLookup, faCaretDown } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { SettingsManager } from '../../../util/SettingsManager';
 
 export interface SchemaTableCellProps {
     Document: Doc;
@@ -162,7 +167,7 @@ export class SchemaTableCell extends ObservableReactComponent<SchemaTableCellPro
             case ColumnType.Boolean: return <SchemaBoolCell {...this._props} />;
             case ColumnType.RTF: return <SchemaRTFCell {...this._props} />;
             case ColumnType.Enumeration: return <SchemaEnumerationCell {...this._props} options={this._props.getFinfo(this._props.fieldKey)?.values?.map(val => val.toString())} />;
-            case ColumnType.Date: // return <SchemaDateCell {...this._props} />;
+            case ColumnType.Date: return <SchemaDateCell {...this._props} />;
             default:  return this.defaultCellContent;
         }
     }
@@ -260,8 +265,7 @@ export class SchemaDateCell extends ObservableReactComponent<SchemaTableCellProp
         return DateCast(this._props.Document[this._props.fieldKey]);
     }
 
-    @action
-    handleChange = (date: Date | null) => {
+    handleChange = undoable((date: Date | null) => {
         // const script = CompileScript(date.toString(), { requiredType: "Date", addReturn: true, params: { this: Doc.name } });
         // if (script.compiled) {
         //     this.applyToDoc(this._document, this._props.row, this._props.col, script.run);
@@ -269,10 +273,31 @@ export class SchemaDateCell extends ObservableReactComponent<SchemaTableCellProp
         // ^ DateCast is always undefined for some reason, but that is what the field should be set to
         date && (this._props.Document[this._props.fieldKey] = new DateField(date));
         //}
-    };
+    }, 'date change');
 
     render() {
-        return <DatePicker dateFormat="Pp" selected={this.date.date} onChange={date => this.handleChange(date)} />;
+        const { color, textDecoration, fieldProps, cursor, pointerEvents } = SchemaTableCell.renderProps(this._props);
+        return (
+            <>
+                <div style={{ pointerEvents: 'none' }}>
+                    <DatePicker dateFormat="Pp" selected={this.date?.date ?? Date.now()} onChange={e => {}} />
+                </div>
+                {pointerEvents === 'none' ? null : (
+                    <Popup
+                        icon={<FontAwesomeIcon size="sm" icon="caret-down" />}
+                        size={Size.XSMALL}
+                        type={Type.TERT}
+                        color={SettingsManager.userColor}
+                        background={SettingsManager.userBackgroundColor}
+                        popup={
+                            <div style={{ width: 'fit-content', height: '200px' }}>
+                                <DatePicker open={true} dateFormat="Pp" selected={this.date?.date ?? Date.now()} onChange={this.handleChange} />
+                            </div>
+                        }
+                    />
+                )}
+            </>
+        );
     }
 }
 @observer
@@ -394,7 +419,7 @@ export class SchemaEnumerationCell extends ObservableReactComponent<SchemaTableC
                             }),
                         }}
                         menuPortalTarget={this._props.menuTarget}
-                        menuPosition={'absolute'}
+                        menuPosition="absolute"
                         placeholder={StrCast(this._props.Document[this._props.fieldKey], 'select...')}
                         options={options}
                         isMulti={false}
-- 
cgit v1.2.3-70-g09d2