Next upgrade multiview

.github/workflows/pr-check.yml

@@ -22,21 +22,6 @@ jobs:
     - run: npm test
       working-directory: packages/react
 
-  lint-vue3:
-    name: Lint Vue3 codebase
-    runs-on: ubuntu-latest
-
-    steps:
-    - uses: actions/checkout@v4
-    - name: Use Node.js
-      uses: actions/setup-node@v4
-      with:
-        node-version: '22.x'
-    - run: npm ci
-      working-directory: packages/vue3
-    - run: npm run lint
-      working-directory: packages/vue3
-
   lint:
     name: Lint codebase
     runs-on: ubuntu-latest

packages/react/package.json

@@ -81,8 +81,10 @@
     "react-day-picker": "^9.6.7",
     "react-dom": "^19.1.0",
     "react-error-boundary": "^4.0.13",
-    "react-hook-form": "^7.56.3",
-    "react-i18next": "^15.5.1",
+    "react-helmet-async": "^2.0.4",
+    "react-grid-layout": "^1.5.2",
+    "react-hook-form": "^7.49.2",
+    "react-i18next": "^15.2.0",
     "react-image": "^4.1.0",
     "react-linkify-it": "^1.0.8",
     "react-player": "^2.16.0",

packages/react/src/components/header/userMenu/components/UserMenu.tsx

@@ -56,15 +56,15 @@ export function UserMenu() {
     <DropdownMenu modal={false}>
       <DropdownMenuTrigger className="w-8 overflow-hidden rounded-full bg-base-2 z-30 mx-2 shrink-0">
         <img
-          src={`https://api.dicebear.com/7.x/shapes/svg?seed=${user.id}`}
+          src={`https://api.dicebear.com/9.x/shapes/svg?seed=${user.id}`}
           alt="User avatar"
         />
       </DropdownMenuTrigger>
       <DropdownMenuContent className="relative z-30 bg-base-2 right-8 w-72">
         <DropdownMenuItem className="flex flex-row">
           <Avatar className="mx-2">
             <AvatarImage
-              src={`https://api.dicebear.com/7.x/shapes/svg?seed=${user.id}`}
+              src={`https://api.dicebear.com/9.x/shapes/svg?seed=${user.id}`}
               alt="userIcon"
             />
             <AvatarFallback>CN</AvatarFallback>

packages/react/src/components/layout/PlayerWrapper.tsx

@@ -18,10 +18,11 @@ interface IPlayerWrapper {
   id: string;
   url: string;
   customSetPlayerRef?: React.Ref<ReactPlayer>;
+  autoplay?: boolean;
 }
 
 export const PlayerWrapper = React.memo(
-  ({ id, url, customSetPlayerRef }: IPlayerWrapper) => {
+  ({ id, url, customSetPlayerRef, autoplay = true }: IPlayerWrapper) => {
     const playerRefAtom = videoPlayerRefAtomFamily(id);
     const setPlayerRef = useSetAtom(playerRefAtom);
 
@@ -68,7 +69,7 @@ export const PlayerWrapper = React.memo(
           youtube: {
             playerVars: {
               origin: window.origin,
-              autoplay: 1,
+              autoplay: autoplay,
             },
           },
         }}

packages/react/src/components/multiview/Multiview.scss

@@ -0,0 +1,5 @@
+$toolbar-height: 64px;
+
+#multiview {
+  --toolbar-height: #{$toolbar-height};
+}