comic_viewer/src/components/ComicView.tsx
2023-03-09 14:40:21 +08:00

26 lines
811 B
TypeScript

//@ts-nocheck
import { Box } from '@mantine/core';
import { equals } from 'ramda';
import { FC, useLayoutEffect } from 'react';
import { useMeasure } from 'react-use';
import { useZoomState } from '../states/zoom';
import { ContinuationView } from './ContinuationView';
import { SingleView } from './SingleView';
export const ComicView: FC = () => {
const viewMode = useZoomState.use.viewMode();
const updateViewHeight = useZoomState.use.updateViewHeight();
const [containerRef, { height }] = useMeasure();
useLayoutEffect(() => {
updateViewHeight(height);
}, [height]);
return (
<Box w="100%" h="100%" sx={{ overflow: 'hidden' }} ref={containerRef}>
{equals(viewMode, 'single') && <SingleView />}
{equals(viewMode, 'continuation') && <ContinuationView />}
</Box>
);
};