From e5e2ea563eeda6614dcf63d1623743a4ca717614 Mon Sep 17 00:00:00 2001
From: fzk <458813868@qq.com>
Date: Wed, 12 Jun 2024 10:29:09 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E7=BC=96=E8=BE=91=E8=A7=86=E9=A2=91bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md                                  |  8 +++---
 packages/web/package.json                  |  6 ++---
 packages/web/src/pages/editVideo/index.tsx |  9 ++++++-
 packages/web/vite.config.ts                | 30 +++++++++++++++++++++-
 4 files changed, 45 insertions(+), 8 deletions(-)

diff --git a/README.md b/README.md
index 23acf52..6a94f4b 100644
--- a/README.md
+++ b/README.md
@@ -151,9 +151,11 @@ Features that have been ticked are the latest in the development process but may
 | Link | [Download](https://github.com/027xiguapi/pear-rec/releases) | [Download](https://github.com/027xiguapi/pear-rec/releases) | [Download](https://github.com/027xiguapi/pear-rec/releases) |
 
 
-## 🖖 Vue
-
-Screenshot implemented by community personnel based on `vue` 👉 [electron-screenshort](https://github.com/yejimeiming/electron-screenshort).
+## 💐 Acknowledgements
+- A screenshot plugin for electron and react. [react-screenshots](https://github.com/nashaofu/screenshots)
+- Process audio/video data in the browser using WebCodecs. [WebAV](https://github.com/hughfenghen/WebAV)
+- JavaScript GIF encoding library. [gif.js](https://github.com/jnordberg/gif.js)
+- Screenshot implemented by community personnel based on `vue`.  [electron-screenshort](https://github.com/yejimeiming/electron-screenshort).
 
 ## 👨‍👨‍👦‍👦 Feedback
 
diff --git a/packages/web/package.json b/packages/web/package.json
index 2b106b0..741c56a 100644
--- a/packages/web/package.json
+++ b/packages/web/package.json
@@ -22,9 +22,9 @@
     "@pear-rec/recorder": "workspace:^",
     "@pear-rec/screenshot": "workspace:^",
     "@pear-rec/timer": "workspace:^",
-    "@webav/av-canvas": "^0.8.0",
-    "@webav/av-cliper": "^0.8.0",
-    "@webav/av-recorder": "^0.8.0",
+    "@webav/av-canvas": "^0.10.0",
+    "@webav/av-cliper": "^0.10.0",
+    "@webav/av-recorder": "^0.10.0",
     "@xzdarcy/react-timeline-editor": "^0.1.9",
     "antd": "^5.16.1",
     "aplayer": "^1.10.1",
diff --git a/packages/web/src/pages/editVideo/index.tsx b/packages/web/src/pages/editVideo/index.tsx
index 1e39c1e..dd9a9b5 100644
--- a/packages/web/src/pages/editVideo/index.tsx
+++ b/packages/web/src/pages/editVideo/index.tsx
@@ -8,6 +8,8 @@ import {
 } from '@xzdarcy/react-timeline-editor';
 import React, { useEffect, useRef, useState } from 'react';
 import { assetsPrefix, createFileWriter } from './utils';
+import ininitApp from '@/pages/main.tsx';
+import Home from '@/pages/home';
 
 type TLActionWithName = TimelineAction & { name: string };
 
@@ -91,6 +93,7 @@ const TimelineEditor = ({
           onOffsetChange(action);
         }}
         onClickAction={(_, { action }) => {
+          // @ts-expect-error
           setActiveAction(action);
         }}
         getActionRender={(action: TLActionWithName) => {
@@ -114,7 +117,7 @@ const actionSpriteMap = new WeakMap<TimelineAction, VisibleSprite>();
 
 const clipsSrc = assetsPrefix(['video/bunny_0.mp4', 'audio/16kHz-1chan.mp3', 'img/bunny.png']);
 
-export default function App() {
+function EditVideo() {
   const [avCvs, setAVCvs] = useState<AVCanvas | null>(null);
   const tlState = useRef<TimelineState>();
 
@@ -320,3 +323,7 @@ export default function App() {
     </div>
   );
 }
+
+ininitApp(EditVideo);
+
+export default EditVideo;
diff --git a/packages/web/vite.config.ts b/packages/web/vite.config.ts
index 7409997..cd7c3df 100644
--- a/packages/web/vite.config.ts
+++ b/packages/web/vite.config.ts
@@ -1,8 +1,35 @@
 import react from '@vitejs/plugin-react-swc';
-import { join, resolve } from 'path';
+import { readFile, writeFile } from 'fs/promises';
+import { join, resolve, dirname } from 'path';
 import { visualizer } from 'rollup-plugin-visualizer';
 import { defineConfig } from 'vite';
+import { fileURLToPath } from 'url';
 import { VitePWA } from 'vite-plugin-pwa';
+import type { PluginOption } from 'vite';
+
+function reactVirtualized(): PluginOption {
+  const WRONG_CODE = `import { bpfrpt_proptype_WindowScroller } from "../WindowScroller.js";`;
+
+  return {
+    name: 'my:react-virtualized',
+    async configResolved() {
+      const reactVirtualizedPath = dirname(fileURLToPath(import.meta.resolve('react-virtualized')));
+
+      const brokenFilePath = join(
+        reactVirtualizedPath,
+        '..', // back to dist
+        'es',
+        'WindowScroller',
+        'utils',
+        'onScroll.js',
+      );
+      const brokenCode = await readFile(brokenFilePath, 'utf-8');
+
+      const fixedCode = brokenCode.replace(WRONG_CODE, '');
+      await writeFile(brokenFilePath, fixedCode);
+    },
+  };
+}
 
 // https://vitejs.dev/config/
 const buildOptionsProject = {
@@ -125,6 +152,7 @@ export default ({ mode }) => {
           ignoreURLParametersMatching: [/.*/],
         },
       }),
+      reactVirtualized(),
     ],
     optimizeDeps: {
       exclude: ['@ffmpeg/ffmpeg', '@ffmpeg/util'],