dididy commented on code in PR #5044:
URL: https://github.com/apache/zeppelin/pull/5044#discussion_r2328687172
##########
zeppelin-web-angular/src/app/pages/workspace/notebook/notebook.component.ts:
##########
@@ -142,15 +155,19 @@ export class NotebookComponent extends
MessageListenersManager implements OnInit
return;
}
const definedNote = this.note;
- definedNote.paragraphs.splice(data.index, 0, data.paragraph).map(p => {
- return {
- ...p,
- focus: p.id === data.paragraph.id
- };
- });
- definedNote.paragraphs = [...definedNote.paragraphs];
+ definedNote.paragraphs.splice(data.index, 0, data.paragraph);
+ const paragraphIndex = definedNote.paragraphs.findIndex(p => p.id ===
data.paragraph.id);
+
+ definedNote.paragraphs[paragraphIndex].focus = true;
+ const addedParagraph = this.listOfNotebookParagraphComponent.find((_,
index) => index === paragraphIndex)
+ ?.notebookParagraphCodeEditorComponent;
Review Comment:
5aab81a
Upon review, components using `ChangeDetectionStrategy.OnPush`—as you
mentioned—do not detect changes in the same reference array unless the
reference itself is replaced. Since I am currently modifying the array with
`splice` (which does change the reference in place), Angular does not
automatically recognize the change. Therefore, calling `detectChanges` or
`markForCheck` is necessary.
The reason why Clone Paragraph or Add Paragraph (Insert Paragraph) in the
current PR appeared to work correctly is due to Angular’s behavior of updating
the view during events triggered within the component. Consequently, when
executed via a button click, the focus handling works as expected, but when
triggered via a shortcut key, the focus does not update properly.
To address this, after receiving `PARAGRAPH_ADDED` and performing a `splice`
to update the array, we now explicitly call `detectChanges` to force change
detection, which has been confirmed to work correctly.
1cdff50
Even after handling it this way, the focus event did not work correctly when
triggered via shortcut keys. To address this, in `paragraph.component.ts`, I
added a blur event on the current paragraph when executing `cloneParagraph` and
`insertParagraph`.
---
I rebased again due to conflicts caused by merging the latest PR.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
