Refactor copyFromParent

Summary: Refactors the "copy from parent" logic. Reduces prop-drilling and keeps the field/textarea components simpler.

Reviewed By: SajidBashar

Differential Revision: D93452995

fbshipit-source-id: 9bcf908117e428ccdaf88163f5aaeb1d8fb00a7b

Author: babyleafy

addons/isl/src/CommitInfoView/CommitInfoField.tsx

@@ -11,10 +11,13 @@ import type {FieldConfig} from './types';
 import {Icon} from 'isl-components/Icon';
 import {extractTokens, TokensList} from 'isl-components/Tokens';
 import {DOCUMENTATION_DELAY, Tooltip} from 'isl-components/Tooltip';
+import {useAtomValue} from 'jotai';
 import {Fragment} from 'react';
 import {tracker} from '../analytics';
 import {Copyable} from '../Copyable';
 import {T} from '../i18n';
+import {copyFromParentCommit, parentCommitContextAtom} from './CommitInfoState';
+import {isFieldNonEmpty} from './CommitMessageFields';
 import {RenderMarkup} from './RenderMarkup';
 import {SeeMoreContainer} from './SeeMoreContainer';
 import {CommitInfoTextArea} from './TextArea';
@@ -29,7 +32,6 @@ export function CommitInfoField({
   editedField,
   startEditingField,
   setEditedField,
-  copyFromParent,
   extra,
   autofocus,
 }: {
@@ -40,10 +42,12 @@ export function CommitInfoField({
   content?: string | Array<string>;
   editedField: string | Array<string> | undefined;
   setEditedField: (value: string) => unknown;
-  copyFromParent?: () => void;
   extra?: JSX.Element;
   autofocus?: boolean;
 }): JSX.Element | null {
+  const parentFields = useAtomValue(parentCommitContextAtom)?.parentFields;
+  const showCopyFromParent =
+    !readonly && parentFields != null && isFieldNonEmpty(parentFields[field.key]);
   const editedFieldContent =
     editedField == null ? '' : Array.isArray(editedField) ? editedField.join(', ') : editedField;
   if (field.type === 'title') {
@@ -73,9 +77,9 @@ export function CommitInfoField({
             </ClickToEditField>
             <div className="commit-info-field-buttons">
               {readonly ? null : <EditFieldButton onClick={startEditingField} />}
-              {readonly || copyFromParent == null ? null : (
-                <CopyFromParentButton onClick={copyFromParent} />
-              )}
+              {showCopyFromParent ? (
+                <CopyFromParentButton onClick={() => copyFromParentCommit(field.key)} />
+              ) : null}
             </div>
           </div>
         )}
@@ -129,7 +133,6 @@ export function CommitInfoField({
                 autoFocus={autofocus ?? false}
                 editedMessage={editedFieldContent}
                 setEditedField={setEditedField}
-                copyFromParent={copyFromParent}
               />
             )}
             {extra}
@@ -187,9 +190,9 @@ export function CommitInfoField({
             <T>{field.key}</T>
             <div className="commit-info-field-buttons">
               {readonly ? null : <EditFieldButton onClick={startEditingField} />}
-              {readonly || copyFromParent == null ? null : (
-                <CopyFromParentButton onClick={copyFromParent} />
-              )}
+              {showCopyFromParent ? (
+                <CopyFromParentButton onClick={() => copyFromParentCommit(field.key)} />
+              ) : null}
             </div>
           </SmallCapsTitle>
           <ClickToEditField

addons/isl/src/CommitInfoView/CommitInfoState.tsx

@@ -293,3 +293,54 @@ export const commitInfoViewCurrentCommits = atom(get => {
     return selected.length > 1 ? selected : [commit];
   }
 });
+
+/**
+ * Derived atom that reactively computes the parent commit context and parsed fields.
+ * Returns undefined if there is no eligible parent commit.
+ */
+export const parentCommitContextAtom = atom(get => {
+  const currentCommits = get(commitInfoViewCurrentCommits);
+  const mode = get(commitMode);
+  const commit = currentCommits?.length === 1 ? currentCommits[0] : undefined;
+  if (!commit) {
+    return undefined;
+  }
+  const isCommitMode = mode === 'commit';
+  const parentCommit = get(dagWithPreviews).get(isCommitMode ? commit.hash : commit.parents[0]);
+  if (!parentCommit || parentCommit.phase === 'public') {
+    return undefined;
+  }
+  const schema = get(commitMessageFieldsSchema);
+  const parentFields = parseCommitMessageFields(
+    schema,
+    parentCommit.title,
+    parentCommit.description,
+  );
+  return {commit, isCommitMode, parentFields};
+});
+
+/**
+ * Copy a field's value from the parent commit into the current commit's edited message.
+ */
+export function copyFromParentCommit(fieldKey: string): void {
+  const ctx = readAtom(parentCommitContextAtom);
+  if (!ctx) {
+    return;
+  }
+  const {commit, isCommitMode, parentFields} = ctx;
+  const parentVal = parentFields[fieldKey];
+  if (!parentVal) {
+    return;
+  }
+
+  tracker.track('CopyCommitFieldsFromParent');
+  const schema = readAtom(commitMessageFieldsSchema);
+  const field = schema.find(f => f.key === fieldKey);
+  const hashOrHead = isCommitMode ? 'head' : commit.hash;
+  const val = Array.isArray(parentVal) ? parentVal.join(',') : parentVal;
+  const newVal = field?.type === 'field' ? val + ',' : val;
+  writeAtom(editedCommitMessages(hashOrHead), prev => ({
+    ...prev,
+    [fieldKey]: field?.type === 'field' ? newVal.split(',') : newVal,
+  }));
+}

addons/isl/src/CommitInfoView/CommitInfoView.tsx

@@ -49,7 +49,7 @@ import {getCachedGeneratedFileStatuses, useGeneratedFileStatuses} from '../Gener
 import {t, T} from '../i18n';
 import {IrrelevantCwdIcon} from '../icons/IrrelevantCwdIcon';
 import {numPendingImageUploads} from '../ImageUpload';
-import {readAtom, useAtomGet, writeAtom} from '../jotaiUtils';
+import {readAtom, writeAtom} from '../jotaiUtils';
 import {Link} from '../Link';
 import {
   messageSyncingEnabledState,
@@ -244,12 +244,6 @@ export function CommitInfoDetails({commit}: {commit: CommitInfo}) {
 
   const parsedFields = useAtomValue(latestCommitMessageFields(hashOrHead));
 
-  const parentCommit = useAtomGet(dagWithPreviews, isCommitMode ? commit.hash : commit.parents[0]);
-  const parentFields =
-    parentCommit && parentCommit.phase !== 'public'
-      ? parseCommitMessageFields(schema, parentCommit.title, parentCommit.description)
-      : undefined;
-
   const provider = useAtomValue(codeReviewProvider);
   const startEditingField = (field: string) => {
     const original = parsedFields[field];
@@ -312,20 +306,18 @@ export function CommitInfoDetails({commit}: {commit: CommitInfo}) {
               return;
             }
 
-            const setField = (newVal: string) =>
-              setEditedCommitMessage(val => ({
-                ...val,
-                [field.key]: field.type === 'field' ? newVal.split(',') : newVal,
-              }));
-
             let editedFieldValue = editedMessage?.[field.key];
             if (editedFieldValue == null && isCommitMode) {
               // If the field is supposed to edited but not in the editedMessage,
               // it means we're loading from a blank slate. This is when we can load from the commit template.
               editedFieldValue = parsedFields[field.key];
             }
 
-            const parentVal = parentFields?.[field.key];
+            const setField = (newVal: string) =>
+              setEditedCommitMessage(val => ({
+                ...val,
+                [field.key]: field.type === 'field' ? newVal.split(',') : newVal,
+              }));
 
             return (
               <CommitInfoField
@@ -338,15 +330,6 @@ export function CommitInfoDetails({commit}: {commit: CommitInfo}) {
                 startEditingField={() => startEditingField(field.key)}
                 editedField={editedFieldValue}
                 setEditedField={setField}
-                copyFromParent={
-                  parentVal != null
-                    ? () => {
-                        tracker.track('CopyCommitFieldsFromParent');
-                        const val = Array.isArray(parentVal) ? parentVal.join(',') : parentVal;
-                        setField(field.type === 'field' ? val + ',' : val);
-                      }
-                    : undefined
-                }
                 extra={
                   field.key === 'Title' ? (
                     <>

addons/isl/src/CommitInfoView/TextArea.tsx

@@ -11,6 +11,7 @@ import {Button} from 'isl-components/Button';
 import {Icon} from 'isl-components/Icon';
 import {TextArea} from 'isl-components/TextArea';
 import {Tooltip} from 'isl-components/Tooltip';
+import {useAtomValue} from 'jotai';
 import {useEffect, useRef} from 'react';
 import {InternalFieldName} from 'shared/constants';
 import {
@@ -20,6 +21,8 @@ import {
   useUploadFilesCallback,
 } from '../ImageUpload';
 import {Internal} from '../Internal';
+import {copyFromParentCommit, parentCommitContextAtom} from './CommitInfoState';
+import {isFieldNonEmpty} from './CommitMessageFields';
 import {MinHeightTextField} from './MinHeightTextField';
 import {convertFieldNameToKey} from './utils';
 
@@ -33,14 +36,12 @@ export function CommitInfoTextArea({
   autoFocus,
   editedMessage,
   setEditedField,
-  copyFromParent,
 }: {
   kind: 'title' | 'textarea' | 'field';
   name: string;
   autoFocus: boolean;
   editedMessage: string;
   setEditedField: (fieldValue: string) => unknown;
-  copyFromParent?: () => void;
 }) {
   const ref = useRef<HTMLTextAreaElement>(null);
   useEffect(() => {
@@ -98,7 +99,6 @@ export function CommitInfoTextArea({
         fieldName={name}
         uploadFiles={supportsImageUpload ? uploadFiles : undefined}
         textAreaRef={ref}
-        copyFromParent={copyFromParent}
       />
     </div>
   );
@@ -116,12 +116,10 @@ export function EditorToolbar({
   fieldName,
   textAreaRef,
   uploadFiles,
-  copyFromParent,
 }: {
   fieldName: string;
   uploadFiles?: (files: Array<File>) => unknown;
   textAreaRef: RefObject<HTMLTextAreaElement>;
-  copyFromParent?: () => void;
 }) {
   const parts: Array<ReactNode> = [];
   if (uploadFiles != null) {
@@ -135,10 +133,15 @@ export function EditorToolbar({
   if (fieldName === InternalFieldName.Summary && Internal.GenerateSummaryButton) {
     parts.push(<Internal.GenerateSummaryButton key="generate-summary" />);
   }
-  if (copyFromParent != null) {
+  const parentFields = useAtomValue(parentCommitContextAtom)?.parentFields;
+  if (
+    parentFields &&
+    isFieldNonEmpty(parentFields[fieldName]) &&
+    (fieldName === InternalFieldName.Summary || fieldName === InternalFieldName.TestPlan)
+  ) {
     parts.push(
       <Tooltip title="Copy from previous commit" key="copy-parent">
-        <Button icon onClick={copyFromParent}>
+        <Button icon onClick={() => copyFromParentCommit(fieldName)}>
           <Icon icon="clippy" />
         </Button>
       </Tooltip>,