1 files changed, 107 insertions, 0 deletions
diff --git a/src/client/views/nodes/formattedText/DailyJournal.tsx b/src/client/views/nodes/formattedText/DailyJournal.tsx
new file mode 100644
index 000000000..ec1f7a023
--- /dev/null
+++ b/src/client/views/nodes/formattedText/DailyJournal.tsx
@@ -0,0 +1,107 @@
+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 './FormattedTextBox';
+
+export class DailyJournal extends ViewBoxAnnotatableComponent<FieldViewProps>() {
+    @observable journalDate: string;
+
+    public static LayoutString(fieldStr: string) {
+        return FieldView.LayoutString(DailyJournal, fieldStr);
+    }
+
+    constructor(props: FormattedTextBoxProps) {
+        super(props);
+        makeObservable(this);
+        this.journalDate = 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.journalDate) {
+            console.log('Updating title to:', this.journalDate);
+            this.dataDoc.title = this.journalDate;
+        }
+
+        console.log('New title after update:', this.dataDoc.title);
+    }
+
+    @action
+    setDailyText() {
+        console.log('setDailyText() called...');
+        const placeholderText = 'Start writing here...';
+        const initialText = `Journal Entry - ${this.journalDate}\n${placeholderText}`;
+
+        console.log('Checking if dataDoc has text field...');
+
+        const styles = {
+            bold: true, // Make the journal date bold
+            color: 'blue', // Set the journal date color to blue
+            fontSize: 18, // Set the font size to 18px for the whole text
+        };
+
+        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={{ background: 'beige', width: '100%', height: '100%' }}>
+                <FormattedTextBox {...this._props} fieldKey={'text'} Document={this.Document} TemplateDataDocument={undefined} />
+            </div>
+        );
+    }
+}
+
+Docs.Prototypes.TemplateMap.set(DocumentType.JOURNAL, {
+    layout: { view: DailyJournal, 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',
+    },
+});