toeverything/AFFiNE
1
1
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2024-12-23 12:12:51 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix: solved the issue of the sidebar favoritedList not being fully displayed (#1523)

Browse Source 
Co-authored-by: Himself65 <himself65@outlook.com>
This commit is contained in:
sheben 2023-03-11 02:40:38 +08:00 committed by GitHub
parent f47a23b0b5
commit 1c89841d6f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 93 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
apps/web/package.json
View File

@ -30,11 +30,11 @@
"jotai": "^2.0.3",
"jotai-devtools": "^0.2.0",
"lit": "^2.6.1",
"lottie-web": "^5.10.2",
"next-themes": "^0.2.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-is": "^18.2.0",
"react-lottie": "^1.2.3",
"swr": "^2.0.4",
"y-indexeddb": "^9.0.9",
"y-protocols": "^1.0.5",
@ -48,7 +48,6 @@
"@swc-jotai/react-refresh": "^0.0.4",
"@types/react": "^18.0.28",
"@types/react-dom": "^18.0.11",
"@types/react-lottie": "^1.2.6",
"@types/webpack-env": "^1.18.0",
"dotenv": "^16.0.3",
"eslint": "^8.35.0",

3
apps/web/src/components/__tests__/WorkSpaceSliderBar.spec.tsx
View File

@ -21,7 +21,8 @@ import { useWorkspacesHelper } from '../../hooks/use-workspaces';
import { ThemeProvider } from '../../providers/ThemeProvider';
import { pathGenerator, RemWorkspaceFlavour } from '../../shared';
import { WorkSpaceSliderBar } from '../pure/workspace-slider-bar';
vi.mock('react-lottie', () => ({
vi.mock('../blocksuite/header/editor-mode-switch/CustomLottie', () => ({
default: (props: React.PropsWithChildren) => <>{props.children}</>,
}));

54
apps/web/src/components/blocksuite/header/editor-mode-switch/CustomLottie.tsx Normal file
View File

@ -0,0 +1,54 @@
import lottie from 'lottie-web';
import { FC, useEffect, useRef } from 'react';
type CustomLottieProps = {
options: {
loop?: boolean | number | undefined;
autoplay?: boolean | undefined;
animationData: any;
rendererSettings?: {
preserveAspectRatio?: string | undefined;
};
};
isStopped?: boolean | undefined;
speed?: number | undefined;
width?: number | string | undefined;
height?: number | string | undefined;
};
const CustomLottie: FC<CustomLottieProps> = ({
options,
isStopped,
speed,
width,
height,
}) => {
const element = useRef<HTMLDivElement>(null);
const lottieInstance = useRef<any>();
useEffect(() => {
if (element.current) {
lottieInstance.current = lottie.loadAnimation({
...options,
container: element.current,
});
}
return () => {
lottieInstance.current?.destroy();
};
}, [options]);
useEffect(() => {
if (speed) {
lottieInstance.current?.setSpeed(speed);
}
if (isStopped) {
lottieInstance.current?.stop();
} else {
lottieInstance.current?.play();
}
}, [isStopped, speed]);
return <div ref={element} style={{ width, height }}></div>;
};
export default CustomLottie;

2
apps/web/src/components/blocksuite/header/editor-mode-switch/switch-items.tsx
View File

@ -1,6 +1,6 @@
import React, { cloneElement, HTMLAttributes, useState } from 'react';
import Lottie from 'react-lottie';
import Lottie from './CustomLottie';
import { StyledSwitchItem } from './style';
type HoverAnimateControllerProps = {

27
apps/web/src/components/pure/workspace-slider-bar/index.tsx
View File

@ -53,19 +53,20 @@ const FavoriteList: React.FC<FavoriteListProps> = ({
{favoriteList.map((pageMeta, index) => {
const active = router.query.pageId === pageMeta.id;
return (
<StyledSubListItem
data-testid={`favorite-list-item-${pageMeta.id}`}
active={active}
key={`${pageMeta}-${index}`}
onClick={() => {
if (active) {
return;
}
openPage(pageMeta.id);
}}
>
{pageMeta.title || 'Untitled'}
</StyledSubListItem>
<div key={`${pageMeta}-${index}`}>
<StyledSubListItem
data-testid={`favorite-list-item-${pageMeta.id}`}
active={active}
onClick={() => {
if (active) {
return;
}
openPage(pageMeta.id);
}}
>
{pageMeta.title || 'Untitled'}
</StyledSubListItem>
</div>
);
})}
{favoriteList.length === 0 && (

10
apps/web/src/hooks/__tests__/index.spec.tsx
View File

@ -42,9 +42,13 @@ import {
useSyncRouterWithCurrentWorkspaceAndPage,
} from '../use-sync-router-with-current-workspace-and-page';
import { useWorkspaces, useWorkspacesHelper } from '../use-workspaces';
vi.mock('react-lottie', () => ({
default: (props: React.PropsWithChildren) => <>{props.children}</>,
}));
vi.mock(
'../../components/blocksuite/header/editor-mode-switch/CustomLottie',
() => ({
default: (props: React.PropsWithChildren) => <>{props.children}</>,
})
);
let blockSuiteWorkspace: BlockSuiteWorkspace;
beforeAll(() => {

52
pnpm-lock.yaml
View File

@ -154,7 +154,6 @@ importers:
'@swc-jotai/react-refresh': ^0.0.4
'@types/react': ^18.0.28
'@types/react-dom': ^18.0.11
'@types/react-lottie': ^1.2.6
'@types/webpack-env': ^1.18.0
cmdk: ^0.1.22
css-spring: ^4.1.0
@ -165,6 +164,7 @@ importers:
jotai: ^2.0.3
jotai-devtools: ^0.2.0
lit: ^2.6.1
lottie-web: ^5.10.2
next: ^13.2.2
next-debug-local: ^0.1.5
next-router-mock: ^0.9.2
@ -173,7 +173,6 @@ importers:
react: ^18.2.0
react-dom: ^18.2.0
react-is: ^18.2.0
react-lottie: ^1.2.3
redux: ^4.2.1
swc-plugin-coverage-instrument: ^0.0.14
swr: ^2.0.4
@ -205,11 +204,11 @@ importers:
jotai: 2.0.3_react@18.2.0
jotai-devtools: 0.2.0_tfg3pgykuuhpvkcrwis64xs5oq
lit: 2.6.1
lottie-web: 5.10.2
next-themes: 0.2.1_nvzgbose6yf6w7ijjprgspqefi
react: 18.2.0
react-dom: 18.2.0_react@18.2.0
react-is: 18.2.0
react-lottie: 1.2.3_react@18.2.0
swr: 2.0.4_react@18.2.0
y-indexeddb: 9.0.9_yjs@13.5.48
y-protocols: 1.0.5
@ -222,7 +221,6 @@ importers:
'@swc-jotai/react-refresh': 0.0.4
'@types/react': 18.0.28
'@types/react-dom': 18.0.11
'@types/react-lottie': 1.2.6
'@types/webpack-env': 1.18.0
dotenv: 16.0.3
eslint: 8.35.0
@ -3385,6 +3383,7 @@ packages:
engines: {node: '>= 10'}
cpu: [arm64]
os: [linux]
libc: [glibc]
requiresBuild: true
dev: false
optional: true
@ -3394,6 +3393,7 @@ packages:
engines: {node: '>= 10'}
cpu: [arm64]
os: [linux]
libc: [glibc]
requiresBuild: true
optional: true
@ -3402,6 +3402,7 @@ packages:
engines: {node: '>= 10'}
cpu: [arm64]
os: [linux]
libc: [musl]
requiresBuild: true
dev: false
optional: true
@ -3411,6 +3412,7 @@ packages:
engines: {node: '>= 10'}
cpu: [arm64]
os: [linux]
libc: [musl]
requiresBuild: true
optional: true
@ -3419,6 +3421,7 @@ packages:
engines: {node: '>= 10'}
cpu: [x64]
os: [linux]
libc: [glibc]
requiresBuild: true
dev: false
optional: true
@ -3428,6 +3431,7 @@ packages:
engines: {node: '>= 10'}
cpu: [x64]
os: [linux]
libc: [glibc]
requiresBuild: true
optional: true
@ -3436,6 +3440,7 @@ packages:
engines: {node: '>= 10'}
cpu: [x64]
os: [linux]
libc: [musl]
requiresBuild: true
dev: false
optional: true
@ -3445,6 +3450,7 @@ packages:
engines: {node: '>= 10'}
cpu: [x64]
os: [linux]
libc: [musl]
requiresBuild: true
optional: true
@ -4802,6 +4808,7 @@ packages:
engines: {node: '>= 10'}
cpu: [arm64]
os: [linux]
libc: [glibc]
requiresBuild: true
dev: true
optional: true
@ -4811,6 +4818,7 @@ packages:
engines: {node: '>= 10'}
cpu: [arm64]
os: [linux]
libc: [musl]
requiresBuild: true
dev: true
optional: true
@ -4820,6 +4828,7 @@ packages:
engines: {node: '>= 10'}
cpu: [x64]
os: [linux]
libc: [glibc]
requiresBuild: true
dev: true
optional: true
@ -4829,6 +4838,7 @@ packages:
engines: {node: '>= 10'}
cpu: [x64]
os: [linux]
libc: [musl]
requiresBuild: true
dev: true
optional: true
@ -5185,12 +5195,6 @@ packages:
'@types/react': 18.0.28
dev: false
/@types/react-lottie/1.2.6:
resolution: {integrity: sha512-fvGJHD7SeUdVESHo7f7erRnXkTWaa/6Mo5TB+R0/ieSftKoFspA4sMlF2qMH6BljXI7ehFJbBtrD5bzDxPCkGg==}
dependencies:
'@types/react': 18.0.28
dev: true
/@types/react-transition-group/4.4.5:
resolution: {integrity: sha512-juKD/eiSM3/xZYzjuzH6ZwpP+/lejltmiS3QEzV/vmb/Q8+HfDmxu+Baga8UEMGBqV88Nbg4l2hY/K2DkyaLLA==}
dependencies:
@ -6024,13 +6028,6 @@ packages:
- supports-color
dev: true
/babel-runtime/6.26.0:
resolution: {integrity: sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g==}
dependencies:
core-js: 2.6.12
regenerator-runtime: 0.11.1
dev: false
/balanced-match/1.0.2:
resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
@ -6596,12 +6593,6 @@ packages:
browserslist: 4.21.5
dev: true
/core-js/2.6.12:
resolution: {integrity: sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==}
deprecated: core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.
requiresBuild: true
dev: false
/core-util-is/1.0.3:
resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==}
@ -10997,17 +10988,6 @@ packages:
/react-is/18.2.0:
resolution: {integrity: sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==}
/react-lottie/1.2.3_react@18.2.0:
resolution: {integrity: sha512-qLCERxUr8M+4mm1LU0Ruxw5Y5Fn/OmYkGfnA+JDM/dZb3oKwVAJCjwnjkj9TMHtzR2U6sMEUD3ZZ1RaHagM7kA==}
engines: {npm: ^3.0.0}
peerDependencies:
react: ^0.14.7 || ^15.0.0 || ^16.0.0
dependencies:
babel-runtime: 6.26.0
lottie-web: 5.10.2
react: 18.2.0
dev: false
/react-refresh/0.14.0:
resolution: {integrity: sha512-wViHqhAd8OHeLS/IRMJjTSDHF3U9eWi62F/MledQGPdJGDhodXJ9PBLNGr6WWL7qlH12Mt3TyTpbS+hGXMjCzQ==}
engines: {node: '>=0.10.0'}
@ -11208,10 +11188,6 @@ packages:
resolution: {integrity: sha512-zrceR/XhGYU/d/opr2EKO7aRHUeiBI8qjtfHqADTwZd6Szfy16la6kqD0MIUs5z5hx6AaKa+PixpPrR289+I0A==}
dev: true
/regenerator-runtime/0.11.1:
resolution: {integrity: sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==}
dev: false
/regenerator-runtime/0.13.11:
resolution: {integrity: sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==}