From ab703fe3ae3b166da844ea488bd916d031ffd3f1 Mon Sep 17 00:00:00 2001
From: Alex Yang <himself65@outlook.com>
Date: Tue, 27 Jun 2023 21:05:24 +0800
Subject: [PATCH] test: fix image preview (#2874)

---
 nx.json                                       |  2 ++
 .../components/image-preview-modal/index.tsx  | 21 ++++++++++---------
 packages/i18n/build.mjs                       | 13 ++++++++++++
 packages/i18n/package.json                    |  1 +
 tests/parallels/image-preview.spec.ts         |  6 +++---
 5 files changed, 30 insertions(+), 13 deletions(-)
 create mode 100644 packages/i18n/build.mjs

diff --git a/nx.json b/nx.json
index e69accda52..1f66ae0b28 100644
--- a/nx.json
+++ b/nx.json
@@ -15,6 +15,7 @@
   },
   "namedInputs": {
     "default": ["{projectRoot}/**/*", "sharedGlobals"],
+    "packages": ["{workspaceRoot}/packages/**/*"],
     "sharedGlobals": [
       "{workspaceRoot}/tsconfig.json",
       "{workspaceRoot}/nx.json"
@@ -37,6 +38,7 @@
         "{workspaceRoot/apps/electron/dist"
       ],
       "inputs": [
+        "packages",
         {
           "runtime": "node -v"
         },
diff --git a/packages/component/src/components/image-preview-modal/index.tsx b/packages/component/src/components/image-preview-modal/index.tsx
index 2c9511f54b..f0fe3a10ba 100644
--- a/packages/component/src/components/image-preview-modal/index.tsx
+++ b/packages/component/src/components/image-preview-modal/index.tsx
@@ -102,7 +102,7 @@ const ImagePreviewModalImpl = (
       const nextBlock = page
         .getNextSiblings(block)
         .find(
-          (block): block is ImageBlockModel => block.flavour === 'affine:embed'
+          (block): block is ImageBlockModel => block.flavour === 'affine:image'
         );
       if (nextBlock) {
         setBlockId(nextBlock.id);
@@ -122,7 +122,7 @@ const ImagePreviewModalImpl = (
       const prevBlock = page
         .getPreviousSiblings(block)
         .findLast(
-          (block): block is ImageBlockModel => block.flavour === 'affine:embed'
+          (block): block is ImageBlockModel => block.flavour === 'affine:image'
         );
       if (prevBlock) {
         setBlockId(prevBlock.id);
@@ -145,14 +145,14 @@ const ImagePreviewModalImpl = (
           .getPreviousSiblings(block)
           .findLast(
             (block): block is ImageBlockModel =>
-              block.flavour === 'affine:embed'
+              block.flavour === 'affine:image'
           )
       ) {
         const prevBlock = page
           .getPreviousSiblings(block)
           .findLast(
             (block): block is ImageBlockModel =>
-              block.flavour === 'affine:embed'
+              block.flavour === 'affine:image'
           );
         if (prevBlock) {
           setBlockId(prevBlock.id);
@@ -162,14 +162,14 @@ const ImagePreviewModalImpl = (
           .getNextSiblings(block)
           .find(
             (block): block is ImageBlockModel =>
-              block.flavour === 'affine:embed'
+              block.flavour === 'affine:image'
           )
       ) {
         const nextBlock = page
           .getNextSiblings(block)
           .find(
             (block): block is ImageBlockModel =>
-              block.flavour === 'affine:embed'
+              block.flavour === 'affine:image'
           );
         if (nextBlock) {
           setBlockId(nextBlock.id);
@@ -252,7 +252,7 @@ const ImagePreviewModalImpl = (
     assertExists(block);
     setCaption(block?.caption);
   }, [props.blockId, props.pageId, props.workspace]);
-  const { data } = useSWR(['workspace', 'embed', props.pageId, props.blockId], {
+  const { data } = useSWR(['workspace', 'image', props.pageId, props.blockId], {
     fetcher: ([_, __, pageId, blockId]) => {
       const page = props.workspace.getPage(pageId);
       assertExists(page);
@@ -494,7 +494,7 @@ export const ImagePreviewModal = (
           .getPreviousSiblings(block)
           .findLast(
             (block): block is ImageBlockModel =>
-              block.flavour === 'affine:embed'
+              block.flavour === 'affine:image'
           );
         if (prevBlock) {
           setBlockId(prevBlock.id);
@@ -504,7 +504,7 @@ export const ImagePreviewModal = (
           .getNextSiblings(block)
           .find(
             (block): block is ImageBlockModel =>
-              block.flavour === 'affine:embed'
+              block.flavour === 'affine:image'
           );
         if (nextBlock) {
           setBlockId(nextBlock.id);
@@ -542,8 +542,9 @@ export const ImagePreviewModal = (
         />
       </Suspense>
       <button
+        data-testid="image-preview-close-button"
         onClick={() => {
-          setIsOpen(false);
+          setBlockId(null);
         }}
         className={imagePreviewModalCloseButtonStyle}
       >
diff --git a/packages/i18n/build.mjs b/packages/i18n/build.mjs
new file mode 100644
index 0000000000..2a2f8bea80
--- /dev/null
+++ b/packages/i18n/build.mjs
@@ -0,0 +1,13 @@
+import { runCli } from '@magic-works/i18n-codegen';
+import { fileURLToPath } from 'url';
+
+await runCli(
+  {
+    config: fileURLToPath(new URL('../../.i18n-codegen.json', import.meta.url)),
+    watch: false,
+  },
+  error => {
+    console.error(error);
+    process.exit(1);
+  }
+);
diff --git a/packages/i18n/package.json b/packages/i18n/package.json
index 5f7c2b5bfb..f8948fd52e 100644
--- a/packages/i18n/package.json
+++ b/packages/i18n/package.json
@@ -15,6 +15,7 @@
     }
   },
   "scripts": {
+    "build": "node build.mjs",
     "sync-languages": "NODE_OPTIONS=--experimental-fetch ts-node-esm src/scripts/sync.ts",
     "sync-languages:check": "yarn run sync-languages --check",
     "download-resources": "NODE_OPTIONS=--experimental-fetch ts-node-esm src/scripts/download.ts"
diff --git a/tests/parallels/image-preview.spec.ts b/tests/parallels/image-preview.spec.ts
index 12aeb16781..8d1066bb66 100644
--- a/tests/parallels/image-preview.spec.ts
+++ b/tests/parallels/image-preview.spec.ts
@@ -34,7 +34,7 @@ async function importImage(page: Page, url: string) {
 async function closeImagePreviewModal(page: Page) {
   await page
     .getByTestId('image-preview-modal')
-    .locator('button')
+    .getByTestId('image-preview-close-button')
     .first()
     .click();
   await page.waitForTimeout(500);
@@ -83,7 +83,7 @@ test('image go left and right', async ({ page }) => {
   const locator = page.getByTestId('image-preview-modal');
   expect(locator.isVisible()).toBeTruthy();
   await page.locator('img').first().dblclick();
-  await page.waitForTimeout(5000);
+  await page.waitForTimeout(1000);
   {
     const newBlobId = (await page
       .locator('img[data-blob-id]')
@@ -92,7 +92,7 @@ test('image go left and right', async ({ page }) => {
     expect(newBlobId).not.toBe(blobId);
   }
   await page.keyboard.press('ArrowRight');
-  await page.waitForTimeout(5000);
+  await page.waitForTimeout(1000);
   {
     const newBlobId = (await page
       .locator('img[data-blob-id]')