Merge branch 'lanyi-branch' of https://github.com/brown-dash/Dash-Web into lanyi-branch

1 files changed, 125 insertions, 0 deletions

diff --git a/src/client/views/nodes/scrapbook/ScrapbookVersionTwo.tsx b/src/client/views/nodes/scrapbook/ScrapbookVersionTwo.tsx
new file mode 100644
index 000000000..d15d2fe56
--- /dev/null
+++ b/src/client/views/nodes/scrapbook/ScrapbookVersionTwo.tsx
@@ -0,0 +1,125 @@
+//IGNORE FOR NOW, CURRENTLY NOT USED IN SCRAPBOOK IMPLEMENTATION
+import { action, makeObservable, observable } from 'mobx';
+import * as React from 'react';
+import { RichTextField } from '../../../../fields/RichTextField';
+import { Docs } from '../../../documents/Documents';
+import { DocumentType } from '../../../documents/DocumentTypes';
+import { ViewBoxAnnotatableComponent } from '../../DocComponent';
+import { FieldView, FieldViewProps } from '../FieldView';
+import { FormattedTextBox, FormattedTextBoxProps } from '../formattedText/FormattedTextBox';
+
+export class ScrapbookVersionTwo extends ViewBoxAnnotatableComponent<FieldViewProps>() {
+    @observable scrapbookDate: string;
+
+    public static LayoutString(fieldStr: string) {
+        return FieldView.LayoutString(ScrapbookVersionTwo, fieldStr);
+    }
+
+    constructor(props: FormattedTextBoxProps) {
+        super(props);
+        makeObservable(this);
+        this.scrapbookDate = this.getFormattedDate();
+
+        console.log('Constructor: Setting initial title and text...');
+        this.setDailyTitle();
+        this.setDailyText();
+    }
+
+    getFormattedDate(): string {
+        const date = new Date().toLocaleDateString(undefined, {
+            weekday: 'long',
+            year: 'numeric',
+            month: 'long',
+            day: 'numeric',
+        });
+        console.log('getFormattedDate():', date);
+        return date;
+    }
+
+    @action
+    setDailyTitle() {
+        console.log('setDailyTitle() called...');
+        console.log('Current title before update:', this.dataDoc.title);
+
+        if (!this.dataDoc.title || this.dataDoc.title !== this.scrapbookDate) {
+            console.log('Updating title to:', this.scrapbookDate);
+            this.dataDoc.title = this.scrapbookDate;
+        }
+
+        console.log('New title after update:', this.dataDoc.title);
+    }
+
+    @action
+    setDailyText() {
+        console.log('setDailyText() called...');
+        const placeholderText = 'Start writing here...';
+        const initialText = `Scrapbook - $\n${placeholderText}`;
+
+        console.log('Checking if dataDoc has text field...');
+
+        const styles = {
+            bold: true, // Make the journal date bold
+            color: 'red', // Set the journal date color to blue
+            fontSize: 12, // Set the font size to 18px for the whole text
+            display: 'grid',
+            gridTemplateColumns: 'repeat(auto-fill, minmax(100px, 1fr))',
+            gap: '8px',
+            padding: '10px',
+            background: '#fafafa',
+            width: '100%',
+            height: '100%',
+        };
+
+        console.log('Setting new text field with:', initialText);
+        this.dataDoc[this.fieldKey] = RichTextField.textToRtf(
+            initialText,
+            undefined, // No image DocId
+            styles, // Pass the styles object here
+            placeholderText.length // The position for text selection
+        );
+
+        console.log('Current text field:', this.dataDoc[this.fieldKey]);
+    }
+
+    componentDidMount(): void {
+        console.log('componentDidMount() triggered...');
+        // bcz: This should be moved into Docs.Create.DailyJournalDocument()
+        // otherwise, it will override all the text whenever the note is reloaded
+        this.setDailyTitle();
+        this.setDailyText();
+    }
+
+    render() {
+        return (
+            <div
+            style={{
+              display: 'grid',
+              gridTemplateColumns: 'repeat(auto-fill, minmax(100px, 1fr))',
+              gap: '8px',
+              padding: '10px',
+              background: '#fafafa',
+              width: '100%',
+              height: '100%',
+            }}
+          >
+                <FormattedTextBox {...this._props} fieldKey={'text'} Document={this.Document} TemplateDataDocument={undefined} />
+            </div>
+        );
+    }
+}
+
+Docs.Prototypes.TemplateMap.set(DocumentType.SCRAPBOOK, {
+    layout: { view: ScrapbookVersionTwo, dataField: 'text' },
+    options: {
+        acl: '',
+        _height: 35,
+        _xMargin: 10,
+        _yMargin: 10,
+        _layout_autoHeight: true,
+        _layout_nativeDimEditable: true,
+        _layout_reflowVertical: true,
+        _layout_reflowHorizontal: true,
+        defaultDoubleClick: 'ignore',
+        systemIcon: 'BsFileEarmarkTextFill',
+    },
+});
\ No newline at end of file