package-lock.json

@@ -14,13 +14,11 @@
                 "@chakra-ui/react": "^2.4.2",
                 "@emotion/react": "^11.4.1",
                 "@emotion/styled": "^11.3.0",
-                "@fontsource/open-sans": "^5.1.0",
                 "@types/react": "^18.3.12",
                 "express": "^4.21.1",
                 "framer-motion": "^6.2.8",
                 "react": "^18.3.1",
                 "react-dom": "^18.3.1",
-                "react-icons": "^5.3.0",
                 "react-router-dom": "^6.27.0"
             },
             "devDependencies": {
@@ -3305,12 +3303,6 @@
                 "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
             }
         },
-        "node_modules/@fontsource/open-sans": {
-            "version": "5.1.0",
-            "resolved": "https://registry.npmjs.org/@fontsource/open-sans/-/open-sans-5.1.0.tgz",
-            "integrity": "sha512-g+mjF8gWUDwck9DrRCkhmFeEj7fskjtKZJKAQguVzSg93lc6ThakTHMRgs0dZfe5qBbktrV839tDrb4bIDyZSA==",
-            "license": "OFL-1.1"
-        },
         "node_modules/@humanfs/core": {
             "version": "0.19.1",
             "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz",
@@ -9081,15 +9073,6 @@
                 }
             }
         },
-        "node_modules/react-icons": {
-            "version": "5.3.0",
-            "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.3.0.tgz",
-            "integrity": "sha512-DnUk8aFbTyQPSkCfF8dbX6kQjXA9DktMeJqfjrg6cK9vwQVMxmcA3BfP4QoiztVmEHtwlTgLFsPuH2NskKT6eg==",
-            "license": "MIT",
-            "peerDependencies": {
-                "react": "*"
-            }
-        },
         "node_modules/react-is": {
             "version": "16.13.1",
             "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
@@ -9970,7 +9953,6 @@
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-4.0.0.tgz",
             "integrity": "sha512-1V4WqhhZZgjVAVJyt7TdDPZoPBPNHbekX4fWnCJL1yQukhCeZhJySUL+gL9y6sNdN95uEOS83Y55SqHcP7MzLA==",
-            "license": "MIT",
             "engines": {
                 "node": ">= 18.12.0"
             },

package.json

@@ -22,13 +22,11 @@
         "@chakra-ui/react": "^2.4.2",
         "@emotion/react": "^11.4.1",
         "@emotion/styled": "^11.3.0",
-        "@fontsource/open-sans": "^5.1.0",
         "@types/react": "^18.3.12",
         "express": "^4.21.1",
         "framer-motion": "^6.2.8",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
-        "react-icons": "^5.3.0",
         "react-router-dom": "^6.27.0"
     },
     "devDependencies": {

src/assets/icons/index.ts

@@ -1 +0,0 @@
-export { default as LogoSvg } from './dry-master-logo.svg';

src/assets/images/index.ts

@@ -1 +0,0 @@
-export { default as DemoVideoPosterImg } from './demo-video-poster.webp';

src/assets/videos/index.ts

@@ -1 +0,0 @@
-export { default as DemoVideo } from './demo.mp4';

src/components/PageSpinner/PageSpinner.tsx

@@ -1,16 +0,0 @@
-import React, { FC } from 'react';
-import { Flex, Spinner } from '@chakra-ui/react';
-
-export const PageSpinner: FC = () => {
-  return (
-    <Flex w='full' h='100vh' justifyContent='center' alignItems='center'>
-      <Spinner
-        thickness='5px'
-        speed='0.65s'
-        emptyColor='gray.200'
-        color='green.500'
-        size='xl'
-      />
-    </Flex>
-  );
-};

src/components/PageSpinner/index.ts

@@ -1 +0,0 @@
-export { PageSpinner } from './PageSpinner';

src/components/index.ts

@@ -1 +0,0 @@
-export * from './PageSpinner';

src/components/landing/BenefitsSection/BenefitsSection.tsx

@@ -1,48 +0,0 @@
-import React, { FC } from 'react';
-import {
-  MdEco,
-  MdMiscellaneousServices,
-  MdPlace,
-  MdHandshake,
-} from 'react-icons/md';
-import { Heading, HStack, List, Text, VStack } from '@chakra-ui/react';
-import { CtaButton, PageSection } from '../';
-import { ListItem } from './ListItem';
-
-export const BenefitsSection: FC = () => {
-  return (
-    <PageSection>
-      <VStack w='full' spacing={2}>
-        <Heading as='h2'>Преимущества экологичной автомойки</Heading>
-        <Text>
-          Откройте для себя преимущества наших услуг по химчистке автомобилей
-        </Text>
-      </VStack>
-      <List display='flex' flexDirection='column' spacing={3}>
-        {[
-          {
-            Icon: MdEco,
-            children: 'Экологически безопасные продукты',
-          },
-          {
-            Icon: MdMiscellaneousServices,
-            children: 'Быстрое и эффективное обслуживание',
-          },
-          {
-            Icon: MdPlace,
-            children: 'Удобный мобильный доступ',
-          },
-          {
-            Icon: MdHandshake,
-            children: 'Надежный и заслуживающий доверия',
-          },
-        ].map((props, i) => (
-          <ListItem key={i} {...props} />
-        ))}
-      </List>
-      <HStack w='full' justify='flex-end'>
-        <CtaButton />
-      </HStack>
-    </PageSection>
-  );
-};

src/components/landing/BenefitsSection/ListItem/ListItem.tsx

@@ -1,16 +0,0 @@
-import React, { FC, PropsWithChildren } from 'react';
-import { ListIcon, ListItem as ChakraListItem } from '@chakra-ui/react';
-import { IconType } from 'react-icons';
-
-type ListItemProps = PropsWithChildren & {
-  Icon: IconType;
-};
-
-export const ListItem: FC<ListItemProps> = ({ Icon, children }) => {
-  return (
-    <ChakraListItem display='inline-flex'>
-      <ListIcon as={Icon} color='primary.500' boxSize='6' />
-      {children}
-    </ChakraListItem>
-  );
-};

src/components/landing/BenefitsSection/ListItem/index.ts

@@ -1 +0,0 @@
-export { ListItem } from './ListItem';

src/components/landing/BenefitsSection/index.ts

@@ -1 +0,0 @@
-export { BenefitsSection } from './BenefitsSection';

src/components/landing/CtaButton/CtaButton.tsx

@@ -1,11 +0,0 @@
-import React, { FC } from 'react';
-import { Link as RouterLink } from 'react-router-dom';
-import { ButtonProps, Button } from '@chakra-ui/react';
-
-export const CtaButton: FC<ButtonProps> = (props) => {
-  return (
-    <Button as={RouterLink} to='/dry-wash/order-form' colorScheme='primary' {...props}>
-      Сделать заказ
-    </Button>
-  );
-};

src/components/landing/CtaButton/index.ts

@@ -1 +0,0 @@
-export { CtaButton } from './CtaButton';

src/components/landing/Footer/Copyright/Copyright.tsx

@@ -1,8 +0,0 @@
-import React, { FC } from 'react';
-import { Text } from '@chakra-ui/react';
-
-const currentYear = new Date().getFullYear();
-
-export const Copyright: FC = () => {
-  return <Text color='whiteAlpha.500'>&copy; {currentYear} DryMaster. Все права защищены</Text>;
-};

src/components/landing/Footer/Copyright/index.ts

@@ -1 +0,0 @@
-export { Copyright } from './Copyright';

src/components/landing/Footer/Footer.tsx

@@ -1,27 +0,0 @@
-import React, { FC } from 'react';
-import { Link, List, ListItem } from '@chakra-ui/react';
-import { Link as RouterLink } from 'react-router-dom';
-import { SiteLogo, PageSection } from '../';
-import { Copyright } from './Copyright';
-
-export const Footer: FC = () => {
-  return (
-    <PageSection as='footer' py={5} bg='gray.700' color='white'>
-      <SiteLogo />
-      <Copyright />
-      <List spacing={2}>
-        {[
-          { to: '#', label: 'Политика конфиденциальности' },
-          { to: '#', label: 'Условия обслуживания' },
-          { to: '#', label: 'FAQ' },
-        ].map(({ to, label }, i) => (
-          <ListItem key={i}>
-            <Link as={RouterLink} to={to}>
-              {label}
-            </Link>
-          </ListItem>
-        ))}
-      </List>
-    </PageSection>
-  );
-};

src/components/landing/Footer/index.ts

@@ -1 +0,0 @@
-export { Footer } from './Footer';

src/components/landing/HeroSection/HeroSection.tsx

@@ -1,60 +0,0 @@
-import React, { FC } from 'react';
-import { Box, Heading, Text, Center, VStack, BoxProps } from '@chakra-ui/react';
-import { DemoVideo } from '../../../assets/videos';
-import { DemoVideoPosterImg } from '../../../assets/images';
-import { CtaButton, SiteLogo, PageSection } from '../';
-
-type HeroSectionProps = Pick<BoxProps, 'flexShrink'>;
-
-export const HeroSection: FC<HeroSectionProps> = ({ flexShrink }) => {
-  return (
-    <Box flexShrink={flexShrink} as='header' pos='relative' zIndex={0}>
-      <Box
-        as='video'
-        src={DemoVideo}
-        poster={DemoVideoPosterImg}
-        autoPlay
-        loop
-        muted
-        w='full'
-        h='full'
-        pos='absolute'
-        objectFit='cover'
-        filter='brightness(50%)'
-        zIndex={-1}
-      />
-      <PageSection
-        h='full'
-        minH='375px'
-        maxH='1000px'
-        py={10}
-        justifyContent='center'
-        alignItems='center'
-        spacing={8}
-      >
-        <Center>
-          <SiteLogo />
-        </Center>
-        <VStack spacing={4}>
-          <Heading
-            as='h1'
-            textAlign='center'
-            color='white'
-            __css={{ textWrap: 'balance' }}
-          >
-            Оживите свою поездку с помощью экологически чистого ухода!
-          </Heading>
-          <Text
-            textAlign='center'
-            __css={{ textWrap: 'balance' }}
-            color='white'
-          >
-            Ощутите максимальное удобство сухой мойки автомобилей, созданной для
-            того, чтобы планета стала чище
-          </Text>
-        </VStack>
-        <CtaButton size='lg' />
-      </PageSection>
-    </Box>
-  );
-};

src/components/landing/HeroSection/index.ts

@@ -1 +0,0 @@
-export { HeroSection } from './HeroSection';

src/components/landing/PageSection/PageSection.tsx

@@ -1,12 +0,0 @@
-import React, { FC, PropsWithChildren } from 'react';
-import { StackProps, VStack } from '@chakra-ui/react';
-
-type PageSectionProps = StackProps & PropsWithChildren;
-
-export const PageSection: FC<PageSectionProps> = ({ children, ...restProps }) => {
-  return (
-    <VStack as='section' w='full' px={5} py={5} spacing={6} alignItems='flex-start' {...restProps}>
-      {children}
-    </VStack>
-  );
-};

src/components/landing/PageSection/index.ts

@@ -1 +0,0 @@
-export { PageSection } from './PageSection';

src/components/landing/SiteLogo/SiteLogo.tsx

@@ -1,10 +0,0 @@
-import React, { FC } from 'react';
-import { Image } from '@chakra-ui/react';
-import { LogoSvg } from '../../../assets/icons';
-
-export const SiteLogo: FC = () => {
-  return <Image src={LogoSvg} alt='Логотип компании "Сухой мастер"' w={40} />;
-};
-
-// todo: add i18n for alt
-// todo: replace Image by SVG React component

src/components/landing/SiteLogo/index.ts

@@ -1 +0,0 @@
-export { SiteLogo } from './SiteLogo';

src/components/landing/SocialProofSection/ReviewsSlider/ReviewCard/ReviewCard.tsx

@@ -1,37 +0,0 @@
-import React, { FC } from 'react';
-import { Card, Avatar, Text } from '@chakra-ui/react';
-
-type ReviewCardProps = {
-  firstname: string;
-  lastname: string;
-  picture: string;
-  text: string;
-};
-
-export const ReviewCard: FC<ReviewCardProps> = ({
-  firstname,
-  lastname,
-  picture,
-  text,
-}) => {
-  const name = [firstname, lastname].join(' ');
-
-  return (
-    <Card p={4} gap={2} alignItems='center' variant='elevated'>
-      <Avatar
-        name={name}
-        src={picture}
-        size='xl'
-        boxShadow='2px 2px 0 1px var(--chakra-colors-secondary-500)'
-      />
-      <Text
-        as='q'
-        fontSize='sm'
-        textAlign='center'
-        __css={{ textWrap: 'balance' }}
-      >
-        {text}
-      </Text>
-    </Card>
-  );
-};

src/components/landing/SocialProofSection/ReviewsSlider/ReviewCard/index.ts

@@ -1 +0,0 @@
-export { ReviewCard } from './ReviewCard';

src/components/landing/SocialProofSection/ReviewsSlider/ReviewsSlider.tsx

@@ -1,73 +0,0 @@
-import React, { FC, useEffect, useState } from 'react';
-import {
-  Tab,
-  TabList,
-  TabPanel,
-  TabPanels,
-  Tabs,
-  Text,
-} from '@chakra-ui/react';
-import { mockReviews } from '../../../../mocks/landing';
-import { ReviewCard } from './ReviewCard';
-
-const reviewsCount = mockReviews.length;
-const SLIDE_CHANGE_INTERVAL = 5000;
-
-export const ReviewsSlider: FC = () => {
-  const [activeTab, setActiveTab] = useState(0);
-  const [isSlideShowStopped, setIsSlideShowStopped] = useState(false);
-
-  useEffect(() => {
-    const timer = setInterval(() => {
-      const newActiveTab = (activeTab + 1) % reviewsCount;
-      setActiveTab(newActiveTab);
-    }, SLIDE_CHANGE_INTERVAL);
-
-    if (isSlideShowStopped) {
-      clearInterval(timer);
-    }
-
-    return () => {
-      clearInterval(timer);
-    };
-  }, [activeTab]);
-
-  return (
-    <Tabs
-      index={activeTab}
-      onChange={(selectedTab) => {
-        setIsSlideShowStopped(true);
-        setActiveTab(selectedTab);
-      }}
-      display='flex'
-      flexDir='column'
-      alignItems='center'
-      variant='soft-rounded'
-      colorScheme='gray'
-    >
-      <TabList gap={2}>
-        {mockReviews.map(({ id }, i) => (
-          <Tab
-            key={id}
-            w={4}
-            h={4}
-            p={0}
-            bg='gray.100'
-            _selected={{
-              bg: 'secondary.100',
-            }}
-          >
-            <Text visibility='hidden'>{i}</Text>
-          </Tab>
-        ))}
-      </TabList>
-      <TabPanels>
-        {mockReviews.map(({ id, ...reviewProps }) => (
-          <TabPanel key={id}>
-            <ReviewCard {...reviewProps} />
-          </TabPanel>
-        ))}
-      </TabPanels>
-    </Tabs>
-  );
-};

src/components/landing/SocialProofSection/ReviewsSlider/index.ts

@@ -1 +0,0 @@
-export { ReviewsSlider } from './ReviewsSlider';

src/components/landing/SocialProofSection/SocialProofSection.tsx

@@ -1,19 +0,0 @@
-import React, { FC } from 'react';
-import {
-  Heading,
-  HStack,
-} from '@chakra-ui/react';
-import { CtaButton, PageSection } from '../';
-import { ReviewsSlider } from './ReviewsSlider';
-
-export const SocialProofSection: FC = () => {
-  return (
-    <PageSection>
-      <Heading as='h2'>Нас выбирают</Heading>
-      <ReviewsSlider />
-      <HStack w='full' justify='flex-end'>
-        <CtaButton />
-      </HStack>
-    </PageSection>
-  );
-};

src/components/landing/SocialProofSection/index.ts

@@ -1 +0,0 @@
-export { SocialProofSection } from './SocialProofSection';

src/components/landing/index.ts

@@ -1,7 +0,0 @@
-export * from './CtaButton';
-export * from './PageSection';
-export * from './BenefitsSection'; // CtaButton, PageSection
-export * from './SocialProofSection'; // CtaButton, PageSection
-export * from './SiteLogo';
-export * from './Footer'; // PageSection, SiteLogo
-export * from './HeroSection'; // CtaButton, PageSection, SiteLogo

src/containers/LandingThemeProvider/Fonts.tsx

@@ -1,31 +0,0 @@
-import React from 'react';
-import { Global } from '@emotion/react';
-import '@fontsource/open-sans/400.css';
-import '@fontsource/open-sans/700.css';
-
-const Fonts = () => (
-  <Global
-    styles={`
-      /* open-sans-cyrillic-400-normal */
-      @font-face {
-        font-family: 'Open Sans';
-        font-style: normal;
-        font-display: swap;
-        font-weight: 400;
-        src: url(./files/open-sans-cyrillic-400-normal.woff2) format('woff2'), url(./files/open-sans-cyrillic-400-normal.woff) format('woff');
-        unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
-      }
-      /* open-sans-cyrillic-700-normal */
-      @font-face {
-        font-family: 'Open Sans';
-        font-style: normal;
-        font-display: swap;
-        font-weight: 700;
-        src: url(./files/open-sans-cyrillic-700-normal.woff2) format('woff2'), url(./files/open-sans-cyrillic-700-normal.woff) format('woff');
-        unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
-      }
-      `}
-  />
-);
-
-export default Fonts;

src/containers/LandingThemeProvider/LandingThemeProvider.tsx

@@ -1,13 +0,0 @@
-import React, { FC, PropsWithChildren } from 'react';
-import { ChakraProvider } from '@chakra-ui/react';
-import { default as landingTheme } from './theme-config';
-import Fonts from './Fonts';
-
-export const LandingThemeProvider: FC<PropsWithChildren> = ({ children }) => {
-  return (
-    <ChakraProvider theme={landingTheme}>
-      <Fonts />
-      {children}
-    </ChakraProvider>
-  );
-};

src/containers/LandingThemeProvider/index.ts

@@ -1 +0,0 @@
-export { LandingThemeProvider } from './LandingThemeProvider';

src/containers/LandingThemeProvider/theme-config.ts

@@ -1,42 +0,0 @@
-import { extendTheme } from '@chakra-ui/react';
-
-const overrides = {
-  colors: {
-    primary: {
-      50: "#F1F8ED",
-      100: "#D9EACC",
-      200: "#C0DDAC",
-      300: "#A8D08B",
-      400: "#8FC26B",
-      500: "#77B54A",
-      600: "#5F913B",
-      700: "#476D2C",
-      800: "#2F481E",
-      900: "#18240F"
-    },
-    secondary: {
-      50: "#E7F7FD",
-      100: "#BCEAFB",
-      200: "#91DCF8",
-      300: "#66CEF5",
-      400: "#3BC1F2",
-      500: "#0FB3F0",
-      600: "#0C8FC0",
-      700: "#096B90",
-      800: "#064860",
-      900: "#032430"
-    }
-  },
-  fonts: {
-    heading: `'Open Sans', sans-serif`,
-  },
-  styles: {
-    global: {
-      body: {
-        bg: 'gray.100'
-      }
-    },
-  },
-};
-
-export default extendTheme(overrides);

src/containers/index.ts

@@ -1 +0,0 @@
-export * from './LandingThemeProvider';

src/mocks/landing/index.ts

@@ -1,34 +0,0 @@
-type ReviewItem = {
-  id: string;
-  firstname: string;
-  lastname: string;
-  picture: string;
-  text: string;
-};
-
-export const mockReviews: ReviewItem[] = [
-  {
-    firstname: 'Анна',
-    lastname: 'Смирнова',
-    picture: 'https://img.freepik.com/free-photo/indoor-portrait-beautiful-freckled-woman-with-dark-curly-hair-wears-fashionable-striped-shirt-rejoices-day-off-isolated-white-wall-curly-satisfied-woman-stands-indoor-alone_273609-15765.jpg',
-    text: "Недавно воспользовалась услугами сухой мойки автомобилей и осталась крайне удовлетворена. Процесс был проведён профессионально: сотрудники использовали качественные средства, которые не повредили лакокрасочное покрытие. Особенно впечатлила возможность мыть машину без воды, что не только экономит ресурсы, но и бережет окружающую среду. Рекомендую всем, кто заботится о своём автомобиле и экологии!"
-  },
-  {
-    firstname: 'Дмитрий',
-    lastname: 'Петров',
-    picture: 'https://img.freepik.com/free-photo/calm-handsome-curly-haired-boy-posing-isolated-light-grey-standing-still-looks-peaceful-wearing-casual-manner-youth-style-concept_176532-8831.jpg',
-    text: "Как же я рад, что нашел эту сухую мойку! Моя машина сияет, как новенькая! 🌟 Сначала был скептически настроен, думал, как же без воды можно отмыть всё это? Но результат превзошёл все ожидания! Ветеринар мойки профессионально подошёл к делу, и она теперь выглядит потрясающе. Если вы хотите, чтобы ваш автомобиль всегда выглядел на 100%, обязательно попробуйте!"
-  },
-  {
-    firstname: 'Алексей',
-    lastname: 'Сидоров',
-    picture: 'https://img.freepik.com/free-photo/waist-up-portrait-handsome-serious-unshaven-male-keeps-hands-together-dressed-dark-blue-shirt-has-talk-with-interlocutor-stands-against-white-wall-self-confident-man-freelancer_273609-16320.jpg',
-    text: "Сухая мойка автомобилей - интересное решение, которое я опробовал недавно. В целом остался доволен качеством работы. Однако, не все загрязнения удалось удалить с первого раза, но сотрудник предложил дополнительные услуги, что меня устроило. Плюс, большое внимание уделили защите поверхности, что тоже немаловажно. Думаю, в следующий раз снова воспользуюсь этой услугой."
-  },
-  {
-    firstname: 'Екатерина',
-    lastname: 'Иванова',
-    picture: 'https://img.freepik.com/free-photo/portrait-young-blonde-woman-with-plait-polka-dot-blouse_273609-10490.jpg',
-    text: "К сожалению, мой опыт с сухой мойкой автомобилей оказался неудачным. Ожидала увидеть чистую машину после процедуры, но многие участки остались незаделанными. Кроме того, процедура заняла больше времени, чем мне обещали. Возможно, в этом конкретном центре что-то пошло не так, но я бы не стала повторно обращаться за этой услугой."
-  },
-].map((data, i) => ({ id: `review${i}`, ...data }));

src/pages/landing/index.tsx

@@ -1,37 +1,7 @@
-import React, { FC } from 'react';
+import React from "react";
-import { Box, Container, VStack } from '@chakra-ui/react';
-import {
-  BenefitsSection,
-  Footer,
-  HeroSection,
-  SocialProofSection,
-} from '../../components/landing';
-import { LandingThemeProvider } from '../../containers';
 
-const Page: FC = () => {
+const Page = () => {
-  return (
+  return <h1>Landing</h1>;
-    <LandingThemeProvider>
-      <Container
-        w='full'
-        maxWidth='container.xl'
-        minH='100vh'
-        padding={0}
-        bg='white'
-        centerContent
-      >
-        <VStack w='full' h='full' alignItems='stretch'>
-          <HeroSection flexShrink={0} />
-          <Box flexGrow={1}>
-            <VStack as='main'>
-              <BenefitsSection />
-              <SocialProofSection />
-            </VStack>
-          </Box>
-          <Footer />
-        </VStack>
-      </Container>
-    </LandingThemeProvider>
-  );
 };
 
 export default Page;

src/routes.tsx

@@ -1,24 +1,16 @@
-import React, { lazy, Suspense } from 'react';
+import React from 'react';
 import { Routes, Route } from 'react-router-dom';
-import { PageSpinner } from './components';
 import Arm from './pages/arm';
-
+import Order from './pages/order-view';
-const Landing = lazy(() => import('./pages/landing'));
+import Landing from './pages/landing';
-const OrderForm = lazy(() => import('./pages/order-form'));
-const OrderView = lazy(() => import('./pages/order-view'));
 
 const Routers = () => {
   return (
-    <Suspense fallback={<PageSpinner />}>
+    <Routes>
-      <Routes>
+      <Route path='/dry-wash' element={<Landing />}></Route>
-        <Route path='/dry-wash'>
+      <Route path='/dry-wash/order' element={<Order />}></Route>
-          <Route index element={<Landing />} />
+      <Route path='/dry-wash/arm' element={<Arm />}></Route>
-          <Route path='order-form' element={<OrderForm />} />
+    </Routes>
-          <Route path='order-view' element={<OrderView />} />
-        </Route>
-        <Route path='/dry-wash/arm' element={<Arm />}></Route>
-      </Routes>
-    </Suspense>
   );
 };
 

types.d.ts

@@ -3,20 +3,3 @@ declare interface NodeModule {
     accept: (path: string, callback: () => void) => void;
   };
 }
-
-declare module "*.svg" {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const value: any;
-  export = value;
-}
-
-declare module "*.webp" {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const value: any;
-  export = value;
-}
-
-declare module '*.mp4' {
-  const src: string;
-  export default src;
-}