feat: CodeMirror integration and bug fixes
This commit addresses several issues related to the migration from TipTap to CodeMirror:
- **CodeMirror Initialization Fixes:**
- Resolved 'Unrecognized extension value' errors by refactoring to explicitly import individual CodeMirror extensions instead of relying on . This ensures proper singleton usage and prevents module duplication issues.
- Updated and to utilize these individual extensions.
- **Text Wrapping Enabled:**
- Added to the extensions in and to enable text wrapping in the CodeMirror editors.
- **Content Saving Fixes:**
- Corrected content binding for CodeMirror editor instances in various IDAA components:
- (description, location_text, attend_text)
- (content, notes)
- (content)
- (description, notes)
- (description, notes)
- Ensured that the prop of is correctly bound to the respective state variables in the parent components, and these state variables are initialized with existing content.
- **Save Button Enablement:**
- Fixed an issue in where the Save button was not enabling on content changes. The logic now directly compares the and with the original object's content, ensuring reactivity.
This commit is contained in:
@@ -36,9 +36,9 @@
|
||||
let prom_api__archive_content_obj: any = $state();
|
||||
let prom_api__archive_content_obj__hosted_file: any = $state();
|
||||
|
||||
let description_new_html = $state('');
|
||||
let description_new_html = $state($idaa_slct.archive_content_obj?.description ?? '');
|
||||
let description_changed = $state(false);
|
||||
let notes_new_html = $state('');
|
||||
let notes_new_html = $state($idaa_slct.archive_content_obj?.notes ?? '');
|
||||
let notes_changed = $state(false);
|
||||
let disable_submit_btn = $state(false);
|
||||
|
||||
@@ -422,7 +422,7 @@
|
||||
<label for="description" class="ae_label w-full">
|
||||
<span class="legend text-sm font-semibold"> Description </span>
|
||||
<Tiptap_editor
|
||||
html_text={$idaa_slct.archive_content_obj.description}
|
||||
bind:html_text={description_new_html}
|
||||
classes="preset-tonal-surface hover:preset-filled-surface-100-900"
|
||||
placeholder="Your content description here..."
|
||||
/>
|
||||
@@ -910,7 +910,7 @@
|
||||
>Internal Staff Notes</span
|
||||
>
|
||||
<Tiptap_editor
|
||||
html_text={$idaa_slct.archive_content_obj.notes}
|
||||
bind:html_text={notes_new_html}
|
||||
classes="preset-tonal-surface preset-filled-surface-100-900"
|
||||
placeholder="Internal notes for staff only. Not shown to the public."
|
||||
/>
|
||||
|
||||
@@ -35,9 +35,9 @@
|
||||
let prom_api__archive_obj: any;
|
||||
let prom_api__archive_obj__hosted_file: any;
|
||||
|
||||
let description_new_html = $state('');
|
||||
let description_new_html = $state($idaa_slct.archive_obj?.description ?? '');
|
||||
let description_changed = $state(false);
|
||||
let notes_new_html = $state('');
|
||||
let notes_new_html = $state($idaa_slct.archive_obj?.notes ?? '');
|
||||
let notes_changed = $state(false);
|
||||
let disable_submit_btn = true;
|
||||
|
||||
@@ -339,7 +339,7 @@
|
||||
<label for="description" class="ae_label w-full">
|
||||
<span class="legend text-sm font-semibold"> Description </span>
|
||||
<Tiptap_editor
|
||||
html_text={$idaa_slct.archive_obj.description}
|
||||
bind:html_text={description_new_html}
|
||||
classes="preset-tonal-surface hover:preset-filled-surface-100-900"
|
||||
placeholder="Your archive description here..."
|
||||
/>
|
||||
@@ -678,7 +678,7 @@
|
||||
>Internal Staff Notes</span
|
||||
>
|
||||
<Tiptap_editor
|
||||
html_text={$idaa_slct.archive_obj.notes}
|
||||
bind:html_text={notes_new_html}
|
||||
classes="preset-tonal-surface preset-filled-surface-100-900"
|
||||
placeholder="Internal notes for staff only. Not shown to the public."
|
||||
/>
|
||||
|
||||
@@ -38,7 +38,7 @@
|
||||
|
||||
let prom_api__post_comment_obj: any = $state();
|
||||
|
||||
let content_new_html = $state('');
|
||||
let content_new_html = $state($idaa_slct.post_comment_obj?.content ?? '');
|
||||
let content_changed = $state(false);
|
||||
// let notes_new_html = $state('');
|
||||
// let notes_changed = $state(false);
|
||||
@@ -487,7 +487,7 @@
|
||||
</span>
|
||||
|
||||
<Tiptap_editor
|
||||
html_text={$idaa_slct.post_comment_obj?.content}
|
||||
bind:html_text={content_new_html}
|
||||
classes="bg-gray-100 dark:bg-gray-800"
|
||||
placeholder="Your post content here..."
|
||||
/>
|
||||
|
||||
@@ -61,10 +61,8 @@
|
||||
let prom_api__post_obj: any = $state();
|
||||
// let prom_api__post_obj__hosted_file: any;
|
||||
|
||||
let content_new_html = $state('');
|
||||
let content_changed = $state(false);
|
||||
let notes_new_html = $state('');
|
||||
let notes_changed = $state(false);
|
||||
let content_new_html = $state($idaa_slct.post_obj?.content ?? '');
|
||||
let notes_new_html = $state($idaa_slct.post_obj?.notes ?? '');
|
||||
let hosted_file_id_li = $state<string[]>([]); // Array of hosted file IDs
|
||||
let hosted_file_obj_li = $state<any[]>([]); // Array of hosted file objects
|
||||
let upload_complete = $state(false);
|
||||
@@ -372,8 +370,8 @@
|
||||
!obj_changed &&
|
||||
orig_post_obj?.id &&
|
||||
(JSON.stringify($idaa_slct.post_obj) !== JSON.stringify(orig_post_obj) ||
|
||||
content_changed ||
|
||||
notes_changed)
|
||||
content_new_html !== (orig_post_obj.content ?? '') ||
|
||||
notes_new_html !== (orig_post_obj.notes ?? ''))
|
||||
) {
|
||||
// console.log('Post object has changed from original.', $inspect(orig_post_obj));
|
||||
console.log('Post object has changed from original.', orig_post_obj);
|
||||
@@ -383,8 +381,8 @@
|
||||
obj_changed &&
|
||||
orig_post_obj?.id &&
|
||||
JSON.stringify($idaa_slct.post_obj) === JSON.stringify(orig_post_obj) &&
|
||||
!content_changed &&
|
||||
!notes_changed
|
||||
content_new_html === (orig_post_obj.content ?? '') &&
|
||||
notes_new_html === (orig_post_obj.notes ?? '')
|
||||
) {
|
||||
obj_changed = false;
|
||||
}
|
||||
@@ -483,14 +481,14 @@
|
||||
|
||||
{#if $ae_loc.administrator_access}
|
||||
<Tiptap_editor
|
||||
html_text={$idaa_slct.post_obj?.content}
|
||||
bind:html_text={content_new_html}
|
||||
classes="preset-tonal-surface hover:preset-filled-surface-100-900"
|
||||
placeholder="Your post content here..."
|
||||
/>
|
||||
{:else}
|
||||
<Tiptap_editor
|
||||
default_minimal={true}
|
||||
html_text={$idaa_slct.post_obj?.content}
|
||||
bind:html_text={content_new_html}
|
||||
show_button_kv={{
|
||||
// text: true,
|
||||
// bullet_list: true,
|
||||
@@ -498,8 +496,6 @@
|
||||
// link: true,
|
||||
// unset_link: true
|
||||
}}
|
||||
bind:new_html={content_new_html}
|
||||
bind:changed={content_changed}
|
||||
classes="preset-tonal-surface hover:preset-filled-surface-100-900"
|
||||
placeholder="Your post content here..."
|
||||
/>
|
||||
@@ -1043,7 +1039,7 @@
|
||||
>Internal Staff Notes</span
|
||||
>
|
||||
<Tiptap_editor
|
||||
html_text={$idaa_slct.post_obj.notes}
|
||||
bind:html_text={notes_new_html}
|
||||
classes="preset-tonal-surface hover:preset-filled-surface-100-900"
|
||||
placeholder="Internal notes for staff only. Not shown to the public."
|
||||
/>
|
||||
|
||||
@@ -57,15 +57,15 @@
|
||||
|
||||
let prom_api__event_obj: any = $state();
|
||||
|
||||
let description_new_html = $state('');
|
||||
let description_new_html = $state($idaa_slct.event_obj?.description ?? '');
|
||||
let description_changed = $state(false);
|
||||
let location_text_new_html = $state('');
|
||||
let location_text_new_html = $state($idaa_slct.event_obj?.location_text ?? '');
|
||||
let location_text_changed = $state(false);
|
||||
let attend_text_new_html = $state('');
|
||||
let attend_text_new_html = $state($idaa_slct.event_obj?.attend_text ?? '');
|
||||
let attend_text_changed = $state(false);
|
||||
let recurring_text_new_html = $state('');
|
||||
let recurring_text_new_html = $state($idaa_slct.event_obj?.recurring_text ?? '');
|
||||
let recurring_text_changed = $state(false);
|
||||
let notes_new_html = $state('');
|
||||
let notes_new_html = $state($idaa_slct.event_obj?.notes ?? '');
|
||||
let notes_changed = $state(false);
|
||||
|
||||
let disable_submit_btn = $state(true);
|
||||
@@ -933,7 +933,7 @@
|
||||
<!-- <textarea name="description" id="description" class="ae_value event__description tinymce_editor editor_basic textarea" rows="5" cols="70" bind:value={$idaa_slct.event_obj.description} ></textarea> -->
|
||||
|
||||
<Tiptap_editor
|
||||
html_text={$idaa_slct.event_obj?.description}
|
||||
bind:html_text={description_new_html}
|
||||
classes="preset-tonal-surface hover:preset-filled-surface-100-900 font-mono font-normal"
|
||||
placeholder="A short description or overview of this recovery meeting"
|
||||
/>
|
||||
@@ -1311,7 +1311,7 @@
|
||||
</span>
|
||||
<!-- <textarea class="ae_value event__location_text tinymce_editor editor_less_100 textarea" id="location_text" name="location_text" placeholder="Additional information about the meeting location" rows="2" cols="70" bind:value={$idaa_slct.event_obj.location_text}></textarea> -->
|
||||
<Tiptap_editor
|
||||
html_text={$idaa_slct.event_obj?.location_text}
|
||||
bind:html_text={location_text_new_html}
|
||||
classes="preset-tonal-surface hover:preset-filled-surface-100-900"
|
||||
placeholder="Additional information about the meeting location"
|
||||
/>
|
||||
@@ -1780,7 +1780,7 @@
|
||||
</span>
|
||||
<!-- <textarea class="ae_value event__attend_text tinymce_editor editor_less_100 textarea" id="attend_text" name="attend_text" placeholder="Additional information on how to attend or join the meeting" rows="2" cols="70" value={$lq__event_obj?.attend_text ?? ''}></textarea> -->
|
||||
<Tiptap_editor
|
||||
html_text={$idaa_slct.event_obj?.attend_text}
|
||||
bind:html_text={attend_text_new_html}
|
||||
classes="preset-tonal-surface hover:preset-filled-surface-100-900"
|
||||
placeholder="Additional information on how to attend or join the meeting"
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user