__mocks__/file-mock.ts

@@ -1 +0,0 @@
-module.exports = 'file';

babel.config.js

@@ -1,7 +0,0 @@
-module.exports = {
-  presets: [
-    '@babel/preset-env',
-    '@babel/preset-typescript',
-    ['@babel/preset-react', { runtime: 'automatic' }],
-  ],
-};

bro.config.js

@@ -21,7 +21,6 @@ module.exports = {
   features: {
     'dry-wash-pl': {
       // add your features here in the format [featureName]: { value: string }
-      'order-view-status-polling': { value: '3000' }
     },
   },
   config: {

eslint.config.mjs

@@ -1,13 +1,12 @@
-import globals from 'globals';
+import globals from "globals";
-import pluginJs from '@eslint/js';
+import pluginJs from "@eslint/js";
-import tseslint from 'typescript-eslint';
+import tseslint from "typescript-eslint";
-import pluginReact from 'eslint-plugin-react';
+import pluginReact from "eslint-plugin-react";
 import stylistic from '@stylistic/eslint-plugin';
 import pluginImport from 'eslint-plugin-import';
 
 export default [
-  { files: ['**/*.{js,mjs,cjs,ts,jsx,tsx}'] },
+  { files: ["**/*.{js,mjs,cjs,ts,jsx,tsx}"] },
-
   { languageOptions: { globals: globals.browser } },
   pluginJs.configs.recommended,
   ...tseslint.configs.recommended,
@@ -15,38 +14,35 @@ export default [
   {
     plugins: {
       '@stylistic': stylistic,
-      import: pluginImport,
+      'import': pluginImport,
     },
-    rules: {
+    "rules": {
-      'no-unused-vars': 'off',
+      "no-unused-vars": "off",
-      '@typescript-eslint/no-unused-vars': [
+      "@typescript-eslint/no-unused-vars": [
-        'warn', // or "error"
+        "warn", // or "error"
         {
-          argsIgnorePattern: '^_',
+          "argsIgnorePattern": "^_",
-          varsIgnorePattern: '^_',
+          "varsIgnorePattern": "^_",
-          caughtErrorsIgnorePattern: '^_',
+          "caughtErrorsIgnorePattern": "^_"
-        },
+        }
       ],
-      'sort-imports': ['off'],
+      "sort-imports": ["off"],
-      'import/order': [
+      "import/order": [
-        'error',
+        "error",
         {
-          groups: [
+          "groups": [
-            'builtin',
+            "builtin",
-            'external',
+            "external",
-            'internal',
+            "internal",
-            'parent',
+            "parent",
-            ['sibling', 'index'],
+            ["sibling", "index"]
           ],
-          'newlines-between': 'always',
+          "newlines-between": "always",
-        },
+        }
       ],
-      semi: ['error', 'always'],
+      semi: ["error", "always"],
       '@stylistic/indent': ['error', 2],
-      'react/prop-types': 'off',
+      'react/prop-types': 'off'
-    },
-  },
-  {
-    ignores: ['babel.config.js'],
     },
+  }
 ];

jest-preset-it/jest-preset.ts

@@ -1,17 +0,0 @@
-module.exports = {
-  transform: {
-    '^.+\\.tsx?$': 'babel-jest',
-  },
-  coverageProvider: 'v8',
-  coverageDirectory: 'coverage',
-  collectCoverageFrom: ['**/src/**/*.{ts,tsx}', '!**/src/app.tsx'],
-  collectCoverage: true,
-  clearMocks: true,
-  moduleNameMapper: {
-    '\\.(svg|webp)$': '<rootDir>/__mocks__/file',
-  },
-  testEnvironmentOptions: {
-    customExportConditions: [''],
-  },
-  testEnvironment: 'jest-fixed-jsdom',
-};

locales/en.json

@@ -42,7 +42,7 @@
   "dry-wash.order-create.create-order-query.success.title": "The order is successfully created",
   "dry-wash.order-create.create-order-query.error.title": "Failed to create an order",
   "dry-wash.order-view.title": "Your order",
-  "dry-wash.order-view.get-order-query.error.title": "Failed to fetch the details of order",
+  "dry-wash.order-view.get-order-query.error.title": "Failed to fetch the details of order #{{number}}",
   "dry-wash.order-view.details.title": "Order #{{number}}",
   "dry-wash.order-view.details.owner": "Owner",
   "dry-wash.order-view.details.car": "Car",
@@ -86,15 +86,6 @@
   "dry-wash.arm.master.drawer.inputPhone.placeholder": "Enter Phone Number",
   "dry-wash.arm.master.drawer.button.save": "Save",
   "dry-wash.arm.master.drawer.button.cancel": "Cancel",
-  "dry-wash.arm.master.drawer.toast.create-master": "Master created",
-  "dry-wash.arm.master.drawer.toast.error.empty-fields": "Fields cannot be empty",
-  "dry-wash.arm.master.drawer.toast.error.base": "Error",
-  "dry-wash.arm.master.drawer.toast.error.create-master": "Error creating master",
-  "dry-wash.arm.master.drawer.toast.error.create-master-details": "Failed to add master. Please try again",
-  "dry-wash.arm.master.drawer.form.name.required": "Master name is required",
-  "dry-wash.arm.master.drawer.form.phone.required": "Phone number is required",
-  "dry-wash.arm.master.drawer.form.phone.pattern": "Invalid phone number",
-  "dry-wash.arm.master.drawer.form.name.minLength": "Name must contain at least 2 characters",
   "dry-wash.arm.master.sideBar.orders": "Orders",
   "dry-wash.arm.master.sideBar.master": "Masters",
   "dry-wash.arm.master.sideBar.title": "Dry Master",

locales/ru.json

@@ -36,15 +36,6 @@
   "dry-wash.arm.master.drawer.inputPhone.placeholder": "Введите номер телефона",
   "dry-wash.arm.master.drawer.button.save": "Сохранить",
   "dry-wash.arm.master.drawer.button.cancel": "Отменить",
-  "dry-wash.arm.master.drawer.toast.create-master": "Мастер создан",
-  "dry-wash.arm.master.drawer.toast.error.empty-fields": "Поля не могут быть пустыми",
-  "dry-wash.arm.master.drawer.toast.error.base": "Ошибка",
-  "dry-wash.arm.master.drawer.toast.error.create-master": "Ошибка при создании мастера",
-  "dry-wash.arm.master.drawer.toast.error.create-master-details": "Не удалось добавить мастера. Попробуйте еще раз",
-  "dry-wash.arm.master.drawer.form.name.required": "Имя мастера обязательно",
-  "dry-wash.arm.master.drawer.form.phone.required": "Телефон обязателен",
-  "dry-wash.arm.master.drawer.form.phone.pattern": "Некорректный номер телефона",
-  "dry-wash.arm.master.drawer.form.name.minLength": "Имя должно содержать минимум 2 символа",
   "dry-wash.arm.master.sideBar.orders": "Заказы",
   "dry-wash.arm.master.sideBar.master": "Мастера",
   "dry-wash.arm.master.sideBar.title": "Сухой мастер",
@@ -91,7 +82,7 @@
   "dry-wash.order-create.create-order-query.success.title": "Заказ успешно создан",
   "dry-wash.order-create.create-order-query.error.title": "Не удалось создать заказ",
   "dry-wash.order-view.title": "Ваш заказ",
-  "dry-wash.order-view.get-order-query.error.title": "Не удалось загрузить детали заказа",
+  "dry-wash.order-view.get-order-query.error.title": "Не удалось загрузить детали заказа №{{number}}",
   "dry-wash.order-view.details.title": "Заказ №{{number}}",
   "dry-wash.order-view.details.owner": "Владелец",
   "dry-wash.order-view.details.car": "Автомобиль",

package.json

@@ -4,7 +4,7 @@
     "description": "<a id=\"readme-top\"></a>",
     "main": "./src/index.tsx",
     "scripts": {
-        "test": "jest -u",
+        "test": "echo \"Error: no test specified\" && exit 1",
         "start": "brojs server --port=8099 --with-open-browser",
         "build": "npm run clean && brojs build --dev",
         "build:prod": "npm run clean && brojs build",
@@ -17,11 +17,7 @@
     "author": "",
     "license": "ISC",
     "dependencies": {
-        "@brojs/cli": "^1.8.4",
+        "@brojs/cli": "^1.6.3",
-        "@babel/core": "^7.26.7",
-        "@babel/preset-env": "^7.26.7",
-        "@babel/preset-react": "^7.26.3",
-        "@babel/preset-typescript": "^7.26.0",
         "@chakra-ui/icons": "^2.2.4",
         "@chakra-ui/react": "^2.10.5",
         "@emotion/react": "^11.4.1",
@@ -30,19 +26,12 @@
         "@lottiefiles/react-lottie-player": "^3.5.4",
         "@pbe/react-yandex-maps": "^1.2.5",
         "@reduxjs/toolkit": "^2.5.0",
-        "@testing-library/dom": "^10.4.0",
-        "@testing-library/react": "^16.2.0",
         "@types/react": "^18.3.12",
-        "babel-jest": "^29.7.0",
         "dayjs": "^1.11.13",
         "express": "^4.21.1",
         "framer-motion": "^6.2.8",
         "i18next": "^23.16.4",
-        "jest": "^29.7.0",
-        "jest-environment-jsdom": "^29.7.0",
-        "jest-fixed-jsdom": "^0.0.9",
         "keycloak-js": "^23.0.7",
-        "msw": "^2.7.0",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
         "react-hook-form": "^7.53.2",
@@ -50,9 +39,7 @@
         "react-icons": "^5.3.0",
         "react-phone-number-input": "^3.4.9",
         "react-redux": "^9.2.0",
-        "react-router-dom": "^6.27.0",
+        "react-router-dom": "^6.27.0"
-        "ts-jest": "^29.2.5",
-        "ts-node": "^10.9.2"
     },
     "devDependencies": {
         "@eslint/js": "^9.14.0",
@@ -63,10 +50,6 @@
         "eslint-plugin-react": "^7.37.2",
         "globals": "^15.11.0",
         "prettier": "3.3.3",
-        "typescript": "^5.7.3",
         "typescript-eslint": "^8.12.2"
-    },
-    "jest": {
-        "preset": "./jest-preset-it/jest-preset.ts"
     }
 }

src/__data__/features.ts

@@ -1,15 +0,0 @@
-import { getFeatures } from "@brojs/cli";
-
-const features = getFeatures('dry-wash-pl');
-
-export const FEATURE = {
-  orderViewStatusPolling: {
-    isOn: Boolean(features['order-view-status-polling']),
-    getValue: () => {
-      const interval = parseInt(features['order-view-status-polling'].value);
-      if (!Number.isNaN(interval)) {
-        return interval;
-      }
-    }
-  }
-};

src/__data__/service/api.ts

@@ -3,7 +3,17 @@ import { getConfigValue } from '@brojs/cli';
 
 import { Master } from '../../models/api/master';
 
-import { extractBodyFromResponse } from './utils';
+type SuccessResponse<Body> = {
+  success: true;
+  body: Body;
+};
+
+type ErrorResponse = {
+  success: false;
+  message: string;
+};
+
+type BaseResponse<Body> = SuccessResponse<Body> | ErrorResponse;
 
 export const api = createApi({
   reducerPath: 'api',
@@ -12,7 +22,11 @@ export const api = createApi({
   endpoints: (builder) => ({
     getMasters: builder.query<Master[], void>({
       query: () => ({ url: '/arm/masters' }),
-      transformResponse: extractBodyFromResponse<Master[]>,
+      transformResponse: (response: BaseResponse<Master[]>) => {
+        if (response.success) {
+          return response.body;
+        }
+      },
       providesTags: ['Masters'],
     }),
     addMaster: builder.mutation<void, Pick<Master, 'name' | 'phone'>>({

src/__data__/service/landing.api.ts

@@ -1,14 +0,0 @@
-import { GetOrder } from "../../models/api";
-
-import { api } from "./api";
-import { extractBodyFromResponse, extractErrorMessageFromResponse } from "./utils";
-
-export const landingApi = api.injectEndpoints({
-  endpoints: ({ query }) => ({
-    getOrder: query<GetOrder.Response, GetOrder.Params>({
-      query: ({ orderId }) => `/order/${orderId}`,
-      transformResponse: extractBodyFromResponse<GetOrder.Response>,
-      transformErrorResponse: extractErrorMessageFromResponse,
-    })
-  })
-});

src/__data__/service/utils.ts

@@ -1,15 +0,0 @@
-import { FetchBaseQueryError } from "@reduxjs/toolkit/query";
-
-import { BaseResponse } from "../../models/api";
-
-export const extractBodyFromResponse = <Body>(response: BaseResponse<Body>) => {
-  if (response.success) {
-    return response.body;
-  }
-};
-
-export const extractErrorMessageFromResponse = ({ data }: FetchBaseQueryError) => {
-  if (typeof data === 'object' && 'message' in data && typeof data.message === 'string') {
-    return data.message;
-  }
-};

src/api/landing.tsx

@@ -1,11 +1,12 @@
 import { getConfigValue } from '@brojs/cli';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 
-import { CreateOrder } from '../models/api';
+import { CreateOrder, GetOrder } from '../models/api';
 
 import { QueryState, Trigger } from './types';
 
 enum LandingEndpoints {
+  ORDER = '/order',
   ORDER_CREATE = '/order/create',
 }
 
@@ -62,4 +63,45 @@ const useCreateOrderMutation = <D extends CreateOrder.Response>(): [
   return [createOrder, { isLoading, isSuccess, data, isError, error }];
 };
 
-export { useCreateOrderMutation };
+const useGetOrderQuery = <D extends GetOrder.Response>({
+  orderId,
+}: GetOrder.Params): QueryState<D> => {
+  const [isLoading, setIsLoading] = useState<QueryState<D>['isLoading']>(true);
+  const [isSuccess, setIsSuccess] = useState<QueryState<D>['isSuccess']>();
+  const [data, setData] = useState<QueryState<D>['data']>();
+  const [isError, setIsError] = useState<QueryState<D>['isError']>();
+  const [error, setError] = useState<QueryState<D>['error']>();
+  
+  useEffect(() => {
+    (async () => {
+      try {
+        const response = await fetch(
+          `${endpoint}${LandingEndpoints.ORDER}/${orderId}`,
+        );
+
+        if (!response.ok) {
+          const errorResponseObject =
+            (await response.json()) as QueryState<D>['error'];
+          setIsError(true);
+          setError(errorResponseObject);
+          throw errorResponseObject;
+        }
+
+        const dataResponseObject =
+          (await response.json()) as QueryState<D>['data'];
+        setIsSuccess(true);
+        setData(dataResponseObject);
+      } catch (error) {
+        setIsError(true);
+        setError(error);
+        throw error;
+      } finally {
+        setIsLoading(false);
+      }
+    })();
+  }, []);
+
+  return { isLoading, isSuccess, data, isError, error };
+};
+
+export { useCreateOrderMutation, useGetOrderQuery };

src/components/MasterDrawer/MasterDrawer.tsx

@@ -1,5 +1,4 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
-import { useForm, SubmitHandler } from 'react-hook-form';
 import {
   Button,
   FormControl,
@@ -15,136 +14,107 @@ import {
   useToast,
   InputGroup,
   InputLeftElement,
-  FormErrorMessage,
 } from '@chakra-ui/react';
 import { useTranslation } from 'react-i18next';
 import { PhoneIcon } from '@chakra-ui/icons';
 
 import { api } from '../../__data__/service/api';
-import showToast from '../../helpers/showToast';
-import { DrawerInputs } from '../../models/arm/form';
-
-interface MasterDrawerProps {
-  isOpen: boolean;
-  onClose: () => void;
-}
-
-const MasterDrawer = ({ isOpen, onClose }: MasterDrawerProps) => {
-  const {
-    register,
-    handleSubmit,
-    reset,
-    formState: { errors },
-  } = useForm<DrawerInputs>();
-
-  const { t } = useTranslation('~', {
-    keyPrefix: 'dry-wash.arm.master.drawer',
-  });
-
-  const onSubmit: SubmitHandler<DrawerInputs> = async (data) => {
-    const trimMaster = {
-      name: data.name.trim(),
-      phone: data.phone.trim(),
-    };
-
-    const isEmptyFields = trimMaster.name === '' || trimMaster.phone === '';
-
-    if (isEmptyFields) {
-      showToast({
-        toast,
-        title: t('toast.error.base'),
-        description: t('toast.error.empty-fields'),
-        status: 'error',
-      });
-      return;
-    }
-
-    await addMaster(trimMaster);
-  };
 
+const MasterDrawer = ({ isOpen, onClose }) => {
   const [addMaster, { error, isSuccess }] = api.useAddMasterMutation();
   const toast = useToast();
 
+  const [newMaster, setNewMaster] = useState({ name: '', phone: '' });
+
+  const handleSave = async () => {
+    const trimMaster = {
+      phone: newMaster.phone.trim(),
+      name: newMaster.name.trim(),
+    };
+
+    if (trimMaster.name === '' || trimMaster.phone === '') {
+      return;
+    }
+
+    addMaster(trimMaster);
+  };
+
   useEffect(() => {
     if (isSuccess) {
-      showToast({
+      toast({
-        toast,
+        title: 'Мастер создан.',
-        title: t('toast.create-master'),
+        description: `Мастер "${newMaster.name}" успешно добавлен.`,
         status: 'success',
+        duration: 5000,
+        isClosable: true,
+        position: 'top-right',
       });
-      reset();
       onClose();
     }
   }, [isSuccess]);
 
   useEffect(() => {
     if (error) {
-      showToast({
+      toast({
-        toast,
+        title: 'Ошибка при создании мастера.',
-        title: t('toast.error.create-master'),
+        description: 'Не удалось добавить мастера. Попробуйте еще раз.',
-        description: t('toast.error.create-master-details'),
         status: 'error',
+        duration: 5000,
+        isClosable: true,
+        position: 'top-right',
       });
       console.error(error);
     }
   }, [error]);
 
+  const { t } = useTranslation('~', {
+    keyPrefix: 'dry-wash.arm.master.drawer',
+  });
+
   return (
     <Drawer isOpen={isOpen} onClose={onClose} size='md'>
       <DrawerOverlay />
       <DrawerContent>
-        <form onSubmit={handleSubmit(onSubmit)}>
         <DrawerCloseButton />
         <DrawerHeader>{t('title')}</DrawerHeader>
         <DrawerBody>
-            <FormControl mb='4' isInvalid={!!errors.name}>
+          <FormControl mb='4'>
             <FormLabel>{t('inputName.label')}</FormLabel>
             <Input
-                {...register('name', {
+              // isInvalid
-                  required: t('form.name.required'),
+              value={newMaster.name}
-                  minLength: {
+              onChange={(e) =>
-                    value: 2,
+                setNewMaster({ ...newMaster, name: e.target.value })
-                    message: t('form.name.minLength'),
+              }
-                  },
-                })}
               placeholder={t('inputName.placeholder')}
             />
-              <FormErrorMessage>
-                {errors.name && errors.name.message}
-              </FormErrorMessage>
           </FormControl>
-            <FormControl isInvalid={!!errors.phone}>
+          <FormControl>
             <FormLabel>{t('inputPhone.label')}</FormLabel>
+
             <InputGroup>
               <InputLeftElement pointerEvents='none'>
                 <PhoneIcon color='gray.300' />
               </InputLeftElement>
               <Input
-                  {...register('phone', {
+                // isInvalid
-                    required: t('form.phone.required'),
+                value={newMaster.phone}
-                    pattern: {
+                onChange={(e) =>
-                      value: /^(\+7|8)\d{10}$/,
+                  setNewMaster({ ...newMaster, phone: e.target.value })
-                      message: t('form.phone.pattern'),
+                }
-                    },
-                    setValueAs: (value) => value.replace(/[^\d+]/g, ''),
-                  })}
                 placeholder={t('inputPhone.placeholder')}
               />
             </InputGroup>
-              <FormErrorMessage>
-                {errors.phone && errors.phone.message}
-              </FormErrorMessage>
           </FormControl>
         </DrawerBody>
         <DrawerFooter>
-            <Button colorScheme='teal' mr={3} type='submit'>
+          <Button colorScheme='teal' mr={3} onClick={handleSave}>
             {t('button.save')}
           </Button>
           <Button variant='ghost' onClick={onClose}>
             {t('button.cancel')}
           </Button>
         </DrawerFooter>
-        </form>
       </DrawerContent>
     </Drawer>
   );

src/components/order-view/details/order-details.tsx

@@ -19,7 +19,7 @@ import { OrderStatus } from './status';
 
 type OrderDetailsProps = Pick<
   Order.View,
-  | 'orderNumber'
+  | 'id'
   | 'status'
   | 'phone'
   | 'carNumber'
@@ -32,7 +32,7 @@ type OrderDetailsProps = Pick<
 >;
 
 export const OrderDetails: FC<OrderDetailsProps> = ({
-  orderNumber,
+  id,
   status,
   phone,
   carNumber,
@@ -58,7 +58,7 @@ export const OrderDetails: FC<OrderDetailsProps> = ({
         gap={2}
       >
         <Heading as='h2' size='lg'>
-          {t('title', { number: orderNumber })}
+          {t('title', { number: id })}
         </Heading>
         <OrderStatus value={status} />
       </HStack>

src/components/order-view/details/status/order-status.tsx

@@ -15,19 +15,19 @@ const getPropsByStatus = (
         colorScheme: 'red',
         children: t('canceled'),
       };
+    case 'progress':
+      return {
+        colorScheme: 'yellow',
+        children: t('progress'),
+      };
     case 'pending':
       return {
         colorScheme: 'yellow',
         children: t('pending'),
       };
-    case 'progress':
-      return {
-        colorScheme: 'orange',
-        children: t('progress'),
-      };
     case 'working':
       return {
-        colorScheme: 'orange',
+        colorScheme: 'yellow',
         children: t('working'),
       };
     case 'complete':

src/helpers/showToast.ts

@@ -1,21 +0,0 @@
-import { UseToastOptions } from '@chakra-ui/react';
-
-interface ShowToast {
-  toast: (options: UseToastOptions) => void;
-  title: string;
-  description?: string;
-  status: 'info' | 'warning' | 'success' | 'error';
-}
-
-const showToast = ({ toast, title, description, status }: ShowToast) => {
-  toast({
-    title,
-    description,
-    status,
-    duration: 5000,
-    isClosable: true,
-    position: 'top-right',
-  });
-};
-
-export default showToast;

src/models/api/common.ts

@@ -1,13 +0,0 @@
-type SuccessResponse<Body> = {
-  success: true;
-  body: Body;
-};
-
-export type ErrorMessage = string;
-
-type ErrorResponse = {
-  success: false;
-  message: ErrorMessage;
-};
-
-export type BaseResponse<Body> = SuccessResponse<Body> | ErrorResponse;

src/models/api/index.ts

@@ -1,2 +1 @@
-export * from './common';
 export * from './order';

src/models/api/order.ts

@@ -1,16 +1,6 @@
 /* eslint-disable @typescript-eslint/no-namespace */
 import { Order } from "../landing";
 
-import { ErrorMessage } from "./common";
-
-export namespace GetOrder {
-  export type Response = Order.View;
-  export type Params = {
-    orderId: Order.Id
-  };
-  export type Error = ErrorMessage;
-}
-
 export namespace CreateOrder {
   export type Response = {
     id: Order.Id
@@ -19,3 +9,10 @@ export namespace CreateOrder {
     body: Order.Create
   };
 };
+
+export namespace GetOrder {
+  export type Response = Order.View;
+  export type Params = {
+    orderId: Order.Id
+  };
+};

src/models/arm/form.ts

@@ -1,4 +0,0 @@
-export type DrawerInputs = {
-  phone: string;
-  name: string;
-};

src/models/landing/order.ts

@@ -26,8 +26,6 @@ export type Create = {
   }
 };
 
-export type Number = string;
-
 export type View = {
   phone: Customer.PhoneNumber;
   carNumber: Car.RegistrationNumber;
@@ -36,7 +34,6 @@ export type View = {
   location: Washing.Location;
   startWashTime: Washing.AvailableBeginDateTime;
   endWashTime: Washing.AvailableEndDateTime;
-  orderNumber: Number,
   status: Status,
   notes: string;
   created: IsoDate;

src/pages/__tests__/__snapshots__/arm.test.tsx.snap

@@ -1,325 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Arm Page render  1`] = `
-<div>
-  <div
-    class="css-1yeiifd"
-  >
-    <div
-      class="css-1fp6kaj"
-    >
-      <h2
-        class="chakra-heading css-9q1d0h"
-      >
-        title
-      </h2>
-      <div
-        class="chakra-stack css-1oen434"
-      >
-        <hr
-          aria-orientation="horizontal"
-          class="chakra-divider css-1upb9tn"
-        />
-        <a
-          class="chakra-button css-uxt1e8"
-          href="/auth/login"
-        >
-          orders
-        </a>
-        <hr
-          aria-orientation="horizontal"
-          class="chakra-divider css-1upb9tn"
-        />
-        <a
-          class="chakra-button css-uxt1e8"
-          href="/auth/login"
-        >
-          master
-        </a>
-        <hr
-          aria-orientation="horizontal"
-          class="chakra-divider css-1upb9tn"
-        />
-      </div>
-    </div>
-    <div
-      class="css-sy55x5"
-    >
-      <div
-        class="css-hpgf8j"
-      >
-        <h2
-          class="chakra-heading css-r7q7qr"
-        >
-          title
-        </h2>
-        <div
-          class="css-1me9tx"
-        >
-          <button
-            class="chakra-button css-4xx2wk"
-            type="button"
-          >
-            <svg
-              class="chakra-icon css-onkibi"
-              focusable="false"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
-                fill="currentColor"
-              />
-            </svg>
-          </button>
-          <p
-            class="chakra-text css-1bntq7d"
-          >
-            2/2/2025
-          </p>
-          <button
-            class="chakra-button css-4xx2wk"
-            type="button"
-          >
-            <svg
-              class="chakra-icon css-onkibi"
-              focusable="false"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"
-                fill="currentColor"
-              />
-            </svg>
-          </button>
-        </div>
-        <table
-          class="chakra-table css-0"
-        >
-          <thead
-            class="css-0"
-          >
-            <tr
-              class="css-0"
-            >
-              <th
-                class="css-0"
-              >
-                table.header.carNumber
-              </th>
-              <th
-                class="css-0"
-              >
-                table.header.orderDate
-              </th>
-              <th
-                class="css-0"
-              >
-                table.header.status
-              </th>
-              <th
-                class="css-0"
-              >
-                table.header.masters
-              </th>
-              <th
-                class="css-0"
-              >
-                table.header.telephone
-              </th>
-              <th
-                class="css-0"
-              >
-                table.header.location
-              </th>
-            </tr>
-          </thead>
-          <tbody
-            class="css-0"
-          >
-            <tr
-              class="css-0"
-            >
-              <td
-                class="css-12rlgei"
-                colspan="6"
-              >
-                <div
-                  class="chakra-spinner css-1y7joxr"
-                >
-                  <span
-                    class="css-8b45rq"
-                  >
-                    Loading...
-                  </span>
-                </div>
-              </td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
-exports[`Arm Page render  2`] = `
-<div>
-  <div
-    class="css-1yeiifd"
-  >
-    <div
-      class="css-1fp6kaj"
-    >
-      <h2
-        class="chakra-heading css-9q1d0h"
-      >
-        title
-      </h2>
-      <div
-        class="chakra-stack css-1oen434"
-      >
-        <hr
-          aria-orientation="horizontal"
-          class="chakra-divider css-1upb9tn"
-        />
-        <a
-          class="chakra-button css-uxt1e8"
-          href="/auth/login"
-        >
-          orders
-        </a>
-        <hr
-          aria-orientation="horizontal"
-          class="chakra-divider css-1upb9tn"
-        />
-        <a
-          class="chakra-button css-uxt1e8"
-          href="/auth/login"
-        >
-          master
-        </a>
-        <hr
-          aria-orientation="horizontal"
-          class="chakra-divider css-1upb9tn"
-        />
-      </div>
-    </div>
-    <div
-      class="css-sy55x5"
-    >
-      <div
-        class="css-hpgf8j"
-      >
-        <h2
-          class="chakra-heading css-r7q7qr"
-        >
-          title
-        </h2>
-        <div
-          class="css-1me9tx"
-        >
-          <button
-            class="chakra-button css-4xx2wk"
-            type="button"
-          >
-            <svg
-              class="chakra-icon css-onkibi"
-              focusable="false"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
-                fill="currentColor"
-              />
-            </svg>
-          </button>
-          <p
-            class="chakra-text css-1bntq7d"
-          >
-            2/2/2025
-          </p>
-          <button
-            class="chakra-button css-4xx2wk"
-            type="button"
-          >
-            <svg
-              class="chakra-icon css-onkibi"
-              focusable="false"
-              viewBox="0 0 24 24"
-            >
-              <path
-                d="M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"
-                fill="currentColor"
-              />
-            </svg>
-          </button>
-        </div>
-        <table
-          class="chakra-table css-0"
-        >
-          <thead
-            class="css-0"
-          >
-            <tr
-              class="css-0"
-            >
-              <th
-                class="css-0"
-              >
-                table.header.carNumber
-              </th>
-              <th
-                class="css-0"
-              >
-                table.header.orderDate
-              </th>
-              <th
-                class="css-0"
-              >
-                table.header.status
-              </th>
-              <th
-                class="css-0"
-              >
-                table.header.masters
-              </th>
-              <th
-                class="css-0"
-              >
-                table.header.telephone
-              </th>
-              <th
-                class="css-0"
-              >
-                table.header.location
-              </th>
-            </tr>
-          </thead>
-          <tbody
-            class="css-0"
-          >
-            <tr
-              class="css-0"
-            >
-              <td
-                class="css-12rlgei"
-                colspan="6"
-              >
-                <div
-                  class="chakra-spinner css-1y7joxr"
-                >
-                  <span
-                    class="css-8b45rq"
-                  >
-                    Loading...
-                  </span>
-                </div>
-              </td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
-    </div>
-  </div>
-</div>
-`;

src/pages/__tests__/arm.test.tsx

@@ -1,130 +0,0 @@
-import React from 'react';
-import {
-  describe,
-  it,
-  expect,
-  jest,
-  beforeAll,
-  afterEach,
-  afterAll,
-} from '@jest/globals';
-import { render, screen, waitFor } from '@testing-library/react';
-import { http, HttpResponse } from 'msw';
-import { setupServer } from 'msw/node';
-import { BrowserRouter } from 'react-router-dom';
-
-import Page from '../arm';
-
-const server = setupServer(
-  http.post('/api/arm/orders', () => {
-    return HttpResponse.json({
-      success: true,
-      body: [
-        {
-          id: 'order1',
-          carNumber: 'A123BC',
-          startWashTime: '2024-11-24T10:30:00.000Z',
-          endWashTime: '2024-11-24T16:30:00.000Z',
-          orderDate: '2024-11-24T08:41:46.366Z',
-          status: 'pending',
-          phone: '79001234563',
-          location: 'Казань, ул. Баумана, 1',
-          master: {
-            name: 'Олег Макаров',
-            phone: '79001234567',
-            id: '23423442',
-          },
-          notes: '',
-        },
-        {
-          id: 'order2',
-          carNumber: 'A245BC',
-          startWashTime: '2024-11-24T11:30:00.000Z',
-          endWashTime: '2024-11-24T17:30:00.000Z',
-          orderDate: '2024-11-24T07:40:46.366Z',
-          status: 'progress',
-          phone: '79001234567',
-          location: 'Казань, ул. Баумана, 43',
-          master: [],
-          notes: '',
-        },
-      ],
-    });
-  }),
-  http.get('/api/arm/masters', () => {
-    return HttpResponse.json({
-      success: true,
-      body: [
-        {
-          id: '4545423234',
-          name: 'Иван Иванов',
-          phone: '+7 900 123 45 67',
-        },
-        {
-          name: 'Олег Макаров',
-          phone: '79001234567',
-          id: '23423442',
-        },
-        {
-          id: '345354234',
-          name: 'Иван Галкин',
-          schedule: [
-            {
-              id: 'order1',
-              startWashTime: '2024-11-24T10:30:00.000Z',
-              endWashTime: '2024-11-24T16:30:00.000Z',
-            },
-            {
-              id: 'order2',
-              startWashTime: '2024-11-24T11:30:00.000Z',
-              endWashTime: '2024-11-24T17:30:00.000Z',
-            },
-          ],
-          phone: '+7 900 123 45 67',
-        },
-      ],
-    });
-  }),
-);
-
-jest.mock('react-i18next', () => {
-  return {
-    useTranslation: () => {
-      return {
-        t: (key: never) => `${key}`,
-        i18n: {},
-      };
-    },
-  };
-});
-
-jest.mock('@brojs/cli', () => {
-  return {
-    getNavigationValue: () => '/auth/login',
-    getConfigValue: () => '/api',
-  };
-});
-
-describe('Arm Page', () => {
-  beforeAll(() => server.listen());
-  afterEach(() => server.resetHandlers());
-  afterAll(() => server.close());
-
-  it('render ', async () => {
-    server.events.on('request:start', ({ request }) => {
-      console.log('Outgoing:', request.method, request.url);
-    });
-
-    const { container } = render(
-      <BrowserRouter>
-        <Page mockUser={{ name: 'ilnaz' }} />
-      </BrowserRouter>,
-    );
-
-    expect(container).toMatchSnapshot();
-
-    await waitFor(() => screen.getByText('A123BC'));
-
-    expect(container).toMatchSnapshot();
-  });
-});

src/pages/arm/index.tsx

@@ -6,12 +6,8 @@ import LayoutArm from '../../components/LayoutArm';
 import authLogin from '../../keycloak';
 import { URLs } from '../../__data__/urls';
 
-interface PageProps {
+const Page = () => {
-  mockUser?: { name: string };
+  const [user, setUser] = useState(null);
-}
-
-const Page = ({ mockUser }: PageProps) => {
-  const [user, setUser] = useState(mockUser || null);
 
   const navigate = useNavigate();
 

src/pages/order-view/index.tsx

@@ -1,13 +1,5 @@
 import React, { FC } from 'react';
-import {
+import { Alert, AlertDescription, AlertIcon, AlertTitle, HStack, Spinner } from '@chakra-ui/react';
-  Alert,
-  AlertDescription,
-  AlertIcon,
-  AlertTitle,
-  Box,
-  HStack,
-  Spinner,
-} from '@chakra-ui/react';
 import { useTranslation } from 'react-i18next';
 import { Container, Heading, VStack } from '@chakra-ui/react';
 import { useParams } from 'react-router-dom';
@@ -18,9 +10,7 @@ import {
 } from '../../containers';
 import { OrderDetails } from '../../components/order-view';
 import { Order } from '../../models/landing';
-import { landingApi } from '../../__data__/service/landing.api';
+import { useGetOrderQuery } from '../../api';
-import { ErrorMessage } from '../../models/api';
-import { FEATURE } from '../../__data__/features';
 
 const Page: FC = () => {
   const { t } = useTranslation('~', {
@@ -31,21 +21,12 @@ const Page: FC = () => {
   const {
     isLoading,
     isSuccess,
-    data: order,
+    data: { body: order } = {},
     isError,
     error,
-  } = landingApi.useGetOrderQuery(
+  } = useGetOrderQuery({
-    {
     orderId,
-    },
+  });
-    FEATURE.orderViewStatusPolling.isOn
-      ? {
-        pollingInterval: FEATURE.orderViewStatusPolling.getValue(),
-        skipPollingIfUnfocused: true,
-      }
-      : undefined,
-  );
-  const errorMessage = error as ErrorMessage;
 
   return (
     <LandingThemeProvider>
@@ -70,7 +51,7 @@ const Page: FC = () => {
               <>
                 {isSuccess && (
                   <OrderDetails
-                    orderNumber={order.orderNumber}
+                    id={order.id}
                     status={order.status}
                     phone={order.phone}
                     carNumber={order.carNumber}
@@ -85,14 +66,14 @@ const Page: FC = () => {
               </>
               <>
                 {isError && (
-                  <Alert status='error' alignItems='flex-start'>
+                  <Alert status='error'>
                     <AlertIcon />
-                    <Box>
                     <AlertTitle>
-                        {t('get-order-query.error.title')}
+                      {t('get-order-query.error.title', {
+                        number: orderId,
+                      })}
                     </AlertTitle>
-                      <AlertDescription>{errorMessage}</AlertDescription>
+                    <AlertDescription>{error.data?.error}</AlertDescription>
-                    </Box>
                   </Alert>
                 )}
               </>

stubs/api/admin.js

@@ -2,7 +2,7 @@
 /* eslint-disable @typescript-eslint/no-require-imports */
 const router = require('express').Router();
 
-const STUBS = { masters: 'success', orders: 'success', orderView: 'success-pending' };
+const STUBS = { masters: 'success', orders: 'success', orderView: 'success' };
 
 router.get('/set/:name/:value', (req, res) => {
   const { name, value } = req.params;
@@ -28,8 +28,7 @@ router.get('/', (req, res) => {
     </fieldset>
     <fieldset> 
     <legend>Лендинг - Детали заказа</legend>
-      ${generateRadioInput('orderView', 'success-pending')}
+      ${generateRadioInput('orderView', 'success')}
-      ${generateRadioInput('orderView', 'success-working')}
       ${generateRadioInput('orderView', 'error')}
     </fieldset>
 </div>`);

stubs/json/landing-order-view/1-success.json

@@ -8,11 +8,10 @@
       "startWashTime": "2025-01-19T14:03:00.000Z",
       "endWashTime": "2025-01-19T14:03:00.000Z",
       "location": "55.793833888711006,49.19037910644527 Республика Татарстан (Татарстан), Казань, жилой район Седьмое Небо",
-      "orderNumber": "1",
+      "status": "progress",
-      "status": "pending",
       "notes": "",
       "created": "2025-01-19T14:04:02.985Z",
       "updated": "2025-01-19T14:04:02.987Z",
-      "id": "id1"
+      "id": "678d06527d78ec30be2679d8"
   }
 }

stubs/json/landing-order-view/id1-error.json

@@ -1,4 +0,0 @@
-{
-  "success": false,
-  "message": "Не удалось загрузить детали заказа"
-}

stubs/json/landing-order-view/id1-success-working.json

@@ -1,18 +0,0 @@
-{
-  "success": true,
-  "body": {
-      "phone": "+79876543210",
-      "carNumber": "А123АА16",
-      "carBody": 2,
-      "carColor": "#ffffff",
-      "startWashTime": "2025-01-19T14:03:00.000Z",
-      "endWashTime": "2025-01-19T14:03:00.000Z",
-      "location": "55.793833888711006,49.19037910644527 Республика Татарстан (Татарстан), Казань, жилой район Седьмое Небо",
-      "orderNumber": "1",
-      "status": "working",
-      "notes": "",
-      "created": "2025-01-19T14:04:02.985Z",
-      "updated": "2025-01-19T14:04:02.987Z",
-      "id": "id1"
-  }
-}