OV-29: * prettier adjusments

BinaryStudioAcademy · Aug 22, 2024 · 5bbe156 · 5bbe156
1 parent dd6dde1
commit 5bbe156
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 23 deletions.
diff --git a/frontend/src/bundles/common/helpers/helpers.ts b/frontend/src/bundles/common/helpers/helpers.ts
@@ -1,2 +1,6 @@
-export { isEmptyArray,isNullOrUndefined, isStringNullOrEmpty } from './utilities.js';
+export {
+    isEmptyArray,
+    isNullOrUndefined,
+    isStringNullOrEmpty,
+} from './utilities.js';
 export { configureString } from 'shared';
diff --git a/frontend/src/bundles/common/helpers/utilities.ts b/frontend/src/bundles/common/helpers/utilities.ts
@@ -1,9 +1,13 @@
-const isNullOrUndefined = <T>(value: T | null | undefined): value is null | undefined =>
-    value === undefined || value === null;
+const isNullOrUndefined = <T>(
+    value: T | null | undefined,
+): value is null | undefined => value === undefined || value === null;
 
-const isStringNullOrEmpty = (value: string | null | undefined): value is null | undefined =>
-    isNullOrUndefined<string>(value) || (value ).trim().length === 0;
+const isStringNullOrEmpty = (
+    value: string | null | undefined,
+): value is null | undefined =>
+    isNullOrUndefined<string>(value) || value.trim().length === 0;
 
-const isEmptyArray = <T>(value: T[]): boolean => isNullOrUndefined<T[]>(value) || value.length === 0;
+const isEmptyArray = <T>(value: T[]): boolean =>
+    isNullOrUndefined<T[]>(value) || value.length === 0;
 
 export { isEmptyArray, isNullOrUndefined, isStringNullOrEmpty };
diff --git a/frontend/src/bundles/video-editor/components/menu/menu.tsx b/frontend/src/bundles/video-editor/components/menu/menu.tsx
@@ -1,5 +1,8 @@
 import { Box, Flex, VStack } from '~/bundles/common/components/components.js';
-import { isEmptyArray, isNullOrUndefined } from '~/bundles/common/helpers/helpers.js';
+import {
+    isEmptyArray,
+    isNullOrUndefined,
+} from '~/bundles/common/helpers/helpers.js';
 import { useCallback } from '~/bundles/common/hooks/hooks.js';
 
 import { type MenuItem } from '../../types/types.js';
@@ -10,21 +13,28 @@ type MenuProperties = {
     setActiveIndex: (index: number) => void;
 };
 
-const Menu: React.FC<MenuProperties> = ({ items, activeIndex, setActiveIndex }) => {
+const Menu: React.FC<MenuProperties> = ({
+    items,
+    activeIndex,
+    setActiveIndex,
+}) => {
     const handleClick = useCallback(
         (index: number) => {
             return () => {
-                if (isEmptyArray(items) || index >= items.length)
-                    {return;}
+                if (isEmptyArray(items) || index >= items.length) {
+                    return;
+                }
 
                 const item = items[index];
-                if(isNullOrUndefined(item)) {return;}
+                if (isNullOrUndefined(item)) {
+                    return;
+                }
 
                 setActiveIndex(index);
                 item.onClick();
             };
         },
-        [setActiveIndex, items]
+        [setActiveIndex, items],
     );
     return (
         <Box
@@ -54,22 +64,25 @@ const Menu: React.FC<MenuProperties> = ({ items, activeIndex, setActiveIndex })
                             gap: 1,
                             cursor: 'pointer',
                             borderRadius: '8px',
-                            bg: activeIndex === index ? 'background.600' : 'transparent',
+                            bg:
+                                activeIndex === index
+                                    ? 'background.600'
+                                    : 'transparent',
                             _hover: {
                                 bg: 'background.600',
                             },
                         }}
                     >
                         <Box
                             sx={{
-                                fontSize: 'xl'
+                                fontSize: 'xl',
                             }}
                         >
                             {item.icon}
                         </Box>
                         <Box
                             sx={{
-                                fontSize: '12px'
+                                fontSize: '12px',
                             }}
                         >
                             {item.label}

diff --git a/frontend/src/bundles/video-editor/components/mock/menu-mock.tsx b/frontend/src/bundles/video-editor/components/mock/menu-mock.tsx
@@ -7,9 +7,7 @@ const TemplatesContent: React.FC = () => (
 const AvatarsContent: React.FC = () => <div>This is the Avatars content.</div>;
 const ScriptHeader: React.FC = () => (
     <Flex justifyContent={'space-between'} w={'280px'}>
-        <div>
-            Script
-        </div>
+        <div>Script</div>
         <div>
             <ChatGhptIcon />
         </div>

diff --git a/frontend/src/bundles/video-editor/pages/video-editor.tsx b/frontend/src/bundles/video-editor/pages/video-editor.tsx
@@ -1,4 +1,10 @@
-import { AssetsIcon, AvatarIcon, ScriptIcon, TemplatesIcon, TextIcon } from '~/bundles/common/components/icons/icons.js';
+import {
+    AssetsIcon,
+    AvatarIcon,
+    ScriptIcon,
+    TemplatesIcon,
+    TextIcon,
+} from '~/bundles/common/components/icons/icons.js';
 import { useCallback, useState } from '~/bundles/common/hooks/hooks.js';
 
 import { Menu, MenuBody } from '../components/components.js';
@@ -17,10 +23,15 @@ const VideoEditor: React.FC = () => {
     const [activeContent, setActiveContent] = useState<React.ReactNode | null>(
         null,
     );
-    const [activeTitle, setActiveTitle] = useState<string | React.ReactNode>('');
+    const [activeTitle, setActiveTitle] = useState<string | React.ReactNode>(
+        '',
+    );
     const [isOpen, setIsOpen] = useState(false);
 
-    const handleMenuClick = (header: string | React.ReactNode, content: React.ReactNode): void => {
+    const handleMenuClick = (
+        header: string | React.ReactNode,
+        content: React.ReactNode,
+    ): void => {
         setActiveContent(content);
         setActiveTitle(header);
         setIsOpen(true);
@@ -61,8 +72,16 @@ const VideoEditor: React.FC = () => {
 
     return (
         <>
-            <Menu items={menuItems} activeIndex={activeIndex} setActiveIndex={setActiveIndex}/>
-            <MenuBody title={activeTitle} isOpen={isOpen} onClose={resetActiveItem}>
+            <Menu
+                items={menuItems}
+                activeIndex={activeIndex}
+                setActiveIndex={setActiveIndex}
+            />
+            <MenuBody
+                title={activeTitle}
+                isOpen={isOpen}
+                onClose={resetActiveItem}
+            >
                 {activeContent}
             </MenuBody>
         </>