Merge branch 'master' into fix/141984-146887-video-width

.changeset/config.json

@@ -0,0 +1,11 @@
+{
+  "$schema": "https://unpkg.com/@changesets/config@3.0.0/schema.json",
+  "changelog": ["@changesets/changelog-github", { "repo": "weseek/growi" }],
+  "commit": false,
+  "fixed": [],
+  "linked": [],
+  "access": "restricted",
+  "baseBranch": "master",
+  "updateInternalDependencies": "patch",
+  "ignore": []
+}

apps/app/package.json

@@ -194,7 +194,7 @@
     "remark-toc": "^8.0.1",
     "remark-wiki-link": "^1.0.4",
     "sanitize-filename": "^1.6.3",
-    "socket.io": "^4.7.2",
+    "socket.io": "^4.7.5",
     "stream-to-promise": "^3.0.0",
     "string-width": "=4.2.2",
     "superjson": "^1.9.1",
@@ -210,9 +210,9 @@
     "validator": "^13.7.0",
     "ws": "^8.3.0",
     "xss": "^1.0.14",
-    "y-mongodb-provider": "^0.1.7",
-    "y-socket.io": "^1.1.0",
-    "yjs": "^13.6.12"
+    "y-mongodb-provider": "^0.1.10",
+    "y-socket.io": "^1.1.3",
+    "yjs": "^13.6.15"
   },
   "// comments for defDependencies": {
     "bootstrap": "v5.3.3 has a bug. refs: https://github.com/twbs/bootstrap/issues/39798",
@@ -280,7 +280,7 @@
     "sass": "^1.53.0",
     "simple-load-script": "^1.0.2",
     "simplebar-react": "^2.3.6",
-    "socket.io-client": "^4.2.0",
+    "socket.io-client": "^4.7.5",
     "source-map-loader": "^4.0.1",
     "swagger2openapi": "^7.0.8",
     "tsc-alias": "^1.2.9"

apps/app/src/components/Layout/BasicLayout.module.scss

@@ -0,0 +1,28 @@
+@use '@growi/core-styles/scss/bootstrap/init' as bs;
+@use '~/styles/mixins';
+
+
+// for react-toastify
+.grw-basic-layout :global {
+  .Toastify .Toastify__toast-container {
+    top: 2.5em;
+
+    @include bs.media-breakpoint-down(md) {
+      top: 6.5em;
+    }
+  }
+}
+
+.grw-basic-layout {
+  @include mixins.with-editing() {
+    .Toastify .Toastify__toast-container {
+      top: 5em;
+
+      @include bs.media-breakpoint-down(md) {
+        top: 7em;
+      }
+    }
+  }
+}
+
+

apps/app/src/components/Layout/BasicLayout.tsx

@@ -9,6 +9,12 @@ import { Sidebar } from '../Sidebar';
 
 import { RawLayout } from './RawLayout';
 
+
+import styles from './BasicLayout.module.scss';
+
+const moduleClass = styles['grw-basic-layout'] ?? '';
+
+
 const AlertSiteUrlUndefined = dynamic(() => import('../AlertSiteUrlUndefined').then(mod => mod.AlertSiteUrlUndefined), { ssr: false });
 const DeleteAttachmentModal = dynamic(() => import('../PageAttachment/DeleteAttachmentModal').then(mod => mod.DeleteAttachmentModal), { ssr: false });
 const HotkeysManager = dynamic(() => import('../Hotkeys/HotkeysManager'), { ssr: false });
@@ -35,7 +41,7 @@ type Props = {
 
 export const BasicLayout = ({ children, className }: Props): JSX.Element => {
   return (
-    <RawLayout className={`${className ?? ''}`}>
+    <RawLayout className={`${moduleClass} ${className ?? ''}`}>
       <DndProvider backend={HTML5Backend}>
 
         <div className="page-wrapper flex-row">

apps/app/src/components/Navbar/GrowiContextualSubNavigation.module.scss

@@ -9,7 +9,7 @@
   }
 }
 
-@include mixins.editing {
+@include mixins.at-editing() {
   .grw-contextual-sub-navigation {
     position: fixed;
     right: 0;

apps/app/src/components/PageEditor/EditorNavbarBottom.module.scss

@@ -2,7 +2,7 @@
 @use '~/styles/variables' as var;
 @use '~/styles/mixins';
 
-@include mixins.editing {
+@include mixins.at-editing() {
   .grw-editor-navbar-bottom :global {
     .grw-grant-selector {
       max-width: 250px;

apps/app/src/components/PageEditor/PageEditor.tsx

@@ -149,7 +149,10 @@ export const PageEditor = React.memo((props: Props): JSX.Element => {
     // set to ref
     initialValueRef.current = initialValue;
   }, [initialValue]);
-  const [markdownToPreview, setMarkdownToPreview] = useState<string>(initialValue);
+
+  const { data: codeMirrorEditor } = useCodeMirrorEditorIsolated(GlobalCodeMirrorEditorKey.MAIN);
+
+  const [markdownToPreview, setMarkdownToPreview] = useState<string>(codeMirrorEditor?.getDoc() ?? '');
   const setMarkdownPreviewWithDebounce = useMemo(() => debounce(100, throttle(150, (value: string) => {
     setMarkdownToPreview(value);
   })), []);
@@ -159,8 +162,6 @@ export const PageEditor = React.memo((props: Props): JSX.Element => {
   }, [setMarkdownPreviewWithDebounce]);
 
 
-  const { data: codeMirrorEditor } = useCodeMirrorEditorIsolated(GlobalCodeMirrorEditorKey.MAIN);
-
   const { scrollEditorHandler, scrollPreviewHandler } = useScrollSync(GlobalCodeMirrorEditorKey.MAIN, previewRef);
 
   const scrollEditorHandlerThrottle = useMemo(() => throttle(25, scrollEditorHandler), [scrollEditorHandler]);

apps/app/src/components/Sidebar/SidebarHead/ToggleCollapseButton.module.scss

@@ -24,7 +24,7 @@
 }
 
 // Hide when editing
-@include mixins.editing {
+@include mixins.at-editing() {
   .btn-toggle-collapse {
     visibility: hidden;
   }

apps/app/src/server/service/yjs-connection-manager.ts

@@ -59,10 +59,9 @@ class YjsConnectionManager {
 
     await this.mdb.flushDocument(pageId);
 
-    const persistedCodeMirrorText = persistedYdoc.getText('codemirror').toString();
-    const currentCodeMirrorText = currentYdoc.getText('codemirror').toString();
-
-    if (persistedCodeMirrorText === '' && currentCodeMirrorText === '') {
+    // If no write operation has been performed, insert initial value
+    const clientsSize = currentYdoc.store.clients.size;
+    if (clientsSize === 0) {
       currentYdoc.getText('codemirror').insert(0, initialValue);
     }
 

apps/app/src/styles/_editor.scss

@@ -97,15 +97,6 @@
 
   }
 
-  // .builtin-editor .tab-pane#edit
-
-  /*****************
-   *     Toastr
-   *****************/
-  .Toastify .Toastify__toast-container {
-    top: 4.5em;
-  }
-
 }
 
 // TODO: Never used this id class

apps/app/src/styles/mixins/_editing.scss

@@ -1,13 +1,38 @@
-@mixin editing($global: false) {
+/**
+ * USAGE:
+ * @include at-editing() {
+ *   .component-class {
+ *     visibility: hidden;
+ *   }
+ * }
+ *
+ * outputs: .layout-root.editing .component-class_LOCAL_ID { visibility: hidden; }
+ */
+@mixin at-editing() {
   :global {
     .layout-root.editing {
-      @if $global {
+      :local {
         @content;
-      } @else {
-        :local {
-          @content;
-        }
       }
     }
   }
 }
+
+/**
+ * USAGE:
+ * .component-class {
+ *   @include with-editing() {
+ *     visibility: hidden;
+ *   }
+ * }
+ *
+ * outputs: .component-class_LOCAL_ID.layout-root.editing { visibility: hidden; }
+ */
+
+@mixin with-editing() {
+  &:global {
+    &.layout-root.editing {
+      @content;
+    }
+  }
+}

package.json

@@ -48,6 +48,8 @@
     "yargs": "^17.7.1"
   },
   "devDependencies": {
+    "@changesets/changelog-github": "^0.5.0",
+    "@changesets/cli": "^2.27.3",
     "@swc-node/register": "^1.6.2",
     "@swc/core": "^1.3.36",
     "@swc/helpers": "^0.4.14",
@@ -83,8 +85,8 @@
     "rollup-plugin-node-externals": "^6.1.1",
     "shx": "^0.3.4",
     "stylelint": "^16.5.0",
-    "stylelint-config-recommended-scss": "^14.0.0",
     "stylelint-config-recess-order": "^5.0.1",
+    "stylelint-config-recommended-scss": "^14.0.0",
     "ts-node-dev": "^2.0.0",
     "tsconfig-paths": "^3.9.0",
     "typescript": "~5.0.0",

packages/editor/package.json

@@ -61,8 +61,8 @@
     "string-width": "=4.2.2",
     "swr": "^2.2.2",
     "ts-deepmerge": "^6.2.0",
-    "y-codemirror.next": "^0.3.2",
-    "y-socket.io": "^1.1.0",
-    "yjs": "^13.6.12"
+    "y-codemirror.next": "^0.3.3",
+    "y-socket.io": "^1.1.3",
+    "yjs": "^13.6.15"
   }
 }

packages/pluginkit/package.json

@@ -21,7 +21,7 @@
     "test": "vitest run --coverage"
   },
   "dependencies": {
-    "@growi/core": "link:../core",
+    "@growi/core": "^0.9.0",
     "extensible-custom-error": "^0.0.7"
   },
   "devDependencies": {