wip

packages/app/src/client/services/PageContainer.js

@@ -47,7 +47,8 @@ export default class PageContainer extends Container {
 
     this.state = {
       // local page data
-      markdown: null, // will be initialized after initStateMarkdown()
+      markdown: 'markdown test', // will be initialized after initStateMarkdown()
+      // markdown: null, // will be initialized after initStateMarkdown()
       pageId: mainContent.getAttribute('data-page-id'),
       revisionId,
       revisionCreatedAt: +mainContent.getAttribute('data-page-revision-created'),
@@ -87,7 +88,8 @@ export default class PageContainer extends Container {
 
       // latest(on remote) information
       remoteRevisionId: revisionId,
-      remoteRevisionBody: null,
+      remoteRevisionBody: 'remoteRevisionBody',
+      // remoteRevisionBody: null,
       remoteRevisionUpdateAt: null,
       revisionIdHackmdSynced: mainContent.getAttribute('data-page-revision-id-hackmd-synced') || null,
       lastUpdateUsername: mainContent.getAttribute('data-page-last-update-username') || null,
@@ -95,7 +97,8 @@ export default class PageContainer extends Container {
       pageIdOnHackmd: mainContent.getAttribute('data-page-id-on-hackmd') || null,
       hasDraftOnHackmd: !!mainContent.getAttribute('data-page-has-draft-on-hackmd'),
       isHackmdDraftUpdatingInRealtime: false,
-      isConflictDiffModalOpen: false,
+      isConflictDiffModalOpen: true,
+      // isConflictDiffModalOpen: false,
     };
 
     // parse creator, lastUpdateUser and revisionAuthor
@@ -688,7 +691,7 @@ export default class PageContainer extends Container {
 
   async resolveConflictAndReload(pageId, revisionId, markdown, optionsToSave) {
     await this.resolveConflict(pageId, revisionId, markdown, optionsToSave);
-    window.location.reload();
+    // window.location.reload();
   }
 
 }

packages/app/src/components/PageEditor/ConflictDiffModal.tsx

@@ -1,5 +1,5 @@
 import React, {
-  useState, useRef, useEffect, FC,
+  useState, useRef, useEffect, FC, useCallback, Ref,
 } from 'react';
 import PropTypes from 'prop-types';
 import { UserPicture } from '@growi/ui';
@@ -15,7 +15,7 @@ import EditorContainer from '../../client/services/EditorContainer';
 import AppContainer from '../../client/services/AppContainer';
 
 import { IRevisionOnConflict } from '../../interfaces/revision';
-import { UncontrolledCodeMirror } from '../UncontrolledCodeMirror';
+import { UncontrolledCodeMirror, UncontrolledCodeMirrorCore } from '../UncontrolledCodeMirror';
 
 require('codemirror/lib/codemirror.css');
 require('codemirror/addon/merge/merge');
@@ -42,6 +42,9 @@ export const ConflictDiffModal: FC<ConflictDiffModalProps> = (props) => {
   const [resolvedRevision, setResolvedRevision] = useState<string>('');
   const [isRevisionselected, setIsRevisionSelected] = useState<boolean>(false);
   const [codeMirrorRef, setCodeMirrorRef] = useState<HTMLDivElement | null>(null);
+  const [uncontrolledCodeMirror, setUncontrolledCodeMirror] = useState<Ref<UncontrolledCodeMirrorCore>>(null);
+
+  const uncontrolledRef = useCallback((cm) => { setUncontrolledCodeMirror(cm) }, []);
 
   const { pageContainer, editorContainer, appContainer } = props;
 
@@ -92,6 +95,7 @@ export const ConflictDiffModal: FC<ConflictDiffModalProps> = (props) => {
   const onResolveConflict = async() : Promise<void> => {
     // disable button after clicked
     setIsRevisionSelected(false);
+    console.log(uncontrolledCodeMirror);
     editorContainer.disableUnsavedWarning();
     try {
       await pageContainer.resolveConflictAndReload(
@@ -203,6 +207,7 @@ export const ConflictDiffModal: FC<ConflictDiffModalProps> = (props) => {
             <div className="col-12 border border-dark">
               <h3 className="font-weight-bold my-2">{t('modal_resolve_conflict.selected_editable_revision')}</h3>
               <UncontrolledCodeMirror
+                ref={uncontrolledRef}
                 value={resolvedRevision}
                 options={{
                   placeholder: t('modal_resolve_conflict.resolve_conflict_message'),

packages/app/src/components/UncontrolledCodeMirror.tsx

@@ -21,7 +21,7 @@ interface UncontrolledCodeMirrorCoreProps extends UncontrolledCodeMirrorProps {
   forwardedRef: Ref<UncontrolledCodeMirrorCore>;
 }
 
-class UncontrolledCodeMirrorCore extends AbstractEditor<UncontrolledCodeMirrorCoreProps> {
+export class UncontrolledCodeMirrorCore extends AbstractEditor<UncontrolledCodeMirrorCoreProps> {
 
   render(): ReactNode {