.eslintrc.json

@@ -66,11 +66,11 @@
     ],
     "prettier/prettier": [
       "error",
+      {},
       {
         "usePrettierrc": true,
-        "singleQuote": true
+        "endOfLine": "auto"
-      },
+      }
-      {}
     ],
     "jest/valid-title": "off",
     "react/button-has-type": "off",

setupTests.ts

@@ -1 +1 @@
-import '@testing-library/jest-dom';
+import "@testing-library/jest-dom";

src/business-logic/core/places/common/model/placesModel.ts

@@ -1,9 +1,9 @@
-import Places from '../entity/placeEntity';
+import Places from "../entity/placeEntity";
 
 class PlacesModel {
   private placesList: Places[];
 
-  private modelTitle = 'places';
+  private modelTitle = "places";
 
   constructor(data: Places[]) {
     this.placesList = data;

src/business-logic/core/places/get-places/data/repository/GetPlacesRepo.ts

@@ -1,6 +1,6 @@
-import PlacesModel from '../../../common/model/placesModel';
+import PlacesModel from "../../../common/model/placesModel";
-import getPlacesRO from '../response-object/getPlacesRO';
+import getPlacesRO from "../response-object/getPlacesRO";
-import { GetPlacesResponse } from '../response-object/protocols';
+import { GetPlacesResponse } from "../response-object/protocols";
 
 const getPlacesRepo = async (httpHandler: () => Promise<GetPlacesResponse>) => {
   // call httpHandler

src/business-logic/core/places/get-places/data/repository/IGetPlacesRepo.ts

@@ -1,4 +1,4 @@
-import PlacesModel from '../../../common/model/placesModel';
+import PlacesModel from "../../../common/model/placesModel";
 
 type IGetPlacesRepo = () => Promise<PlacesModel>;
 

src/business-logic/core/places/get-places/data/response-object/getPlacesRO.ts

@@ -1,5 +1,5 @@
 /* eslint-disable no-underscore-dangle */
-import { GetPlacesRO, GetPlacesResponse } from './protocols';
+import { GetPlacesRO, GetPlacesResponse } from "./protocols";
 
 const getPlacesRO = (placesResponse: GetPlacesResponse): GetPlacesRO => {
   return placesResponse.map((placeResponse) => {

src/business-logic/core/places/get-places/data/response-object/protocols.ts

@@ -1,4 +1,4 @@
-import Places from '../../../common/entity/placeEntity';
+import Places from "../../../common/entity/placeEntity";
 
 export type GetPlacesResponse = {
   _id: string;

src/business-logic/core/places/get-places/index.ts

@@ -1,3 +1,3 @@
-import getPlaces from './infra/getPlacesInfra';
+import getPlaces from "./infra/getPlacesInfra";
 
 export default getPlaces;

src/business-logic/core/places/get-places/infra/getPlacesInfra.ts

@@ -1,7 +1,7 @@
-import getPlacesRepo from '../data/repository/GetPlacesRepo';
+import getPlacesRepo from "../data/repository/GetPlacesRepo";
-import IGetPlacesRepo from '../data/repository/IGetPlacesRepo';
+import IGetPlacesRepo from "../data/repository/IGetPlacesRepo";
-import GettingPlacesUsecase from '../usecase/getPlaceUsecase';
+import GettingPlacesUsecase from "../usecase/getPlaceUsecase";
-import { IgetPlacesInfra, getPlacesReturnType } from './protocols';
+import { IgetPlacesInfra, getPlacesReturnType } from "./protocols";
 
 const getPlaces = ({ httpHandler }: IgetPlacesInfra): getPlacesReturnType => {
   // get httpHandler

src/business-logic/core/places/get-places/infra/protocols.ts

@@ -1,5 +1,5 @@
-import PlacesModel from '../../common/model/placesModel';
+import PlacesModel from "../../common/model/placesModel";
-import { GetPlacesResponse } from '../data/response-object/protocols';
+import { GetPlacesResponse } from "../data/response-object/protocols";
 
 export interface IgetPlacesInfra {
   httpHandler: () => Promise<GetPlacesResponse>;

src/business-logic/core/places/get-places/port.ts

@@ -1,4 +1,4 @@
-import { getPlacesReturnType, type IgetPlacesInfra } from './infra/protocols';
+import { getPlacesReturnType, type IgetPlacesInfra } from "./infra/protocols";
 
 export default IgetPlacesInfra;
 

src/business-logic/core/places/get-places/usecase/__test__/getPlacesUsecase.test.ts

@@ -1,24 +1,26 @@
-import PlacesModel from '../../../common/model/placesModel';
+import PlacesModel from "../../../common/model/placesModel";
-import IGetPlacesRepo from '../../data/repository/IGetPlacesRepo';
+import IGetPlacesRepo from "../../data/repository/IGetPlacesRepo";
-import { GetPlacesRO } from '../../data/response-object/protocols';
+import { GetPlacesRO } from "../../data/response-object/protocols";
-import GettingPlacesUsecase from '../getPlaceUsecase';
+import GettingPlacesUsecase from "../getPlaceUsecase";
 
 const mockedRO: GetPlacesRO = {
-  availableServices: [''],
+  availableServices: [""],
-  createdAt: 'createdAt',
+  createdAt: "createdAt",
-  id: 'id',
+  id: "id",
-  name: 'name',
+  name: "name",
   parentId: null,
-  placeType: 'continent',
+  placeType: "continent",
-  updatedAt: 'updatedTime',
+  updatedAt: "updatedTime",
   qr: null,
 };
 
 const model = new PlacesModel(mockedRO);
-const mockedRepo: IGetPlacesRepo = jest.fn().mockImplementation(async () => model);
+const mockedRepo: IGetPlacesRepo = jest
+  .fn()
+  .mockImplementation(async () => model);
 
-describe('getting places usecase tests', () => {
+describe("getting places usecase tests", () => {
-  it('call repository on execute usecase', async () => {
+  it("call repository on execute usecase", async () => {
     const usecase = new GettingPlacesUsecase(mockedRepo);
     await usecase.execute();
 

src/business-logic/core/places/get-places/usecase/getPlaceUsecase.ts

@@ -1,5 +1,5 @@
-import PlacesModel from '../../common/model/placesModel';
+import PlacesModel from "../../common/model/placesModel";
-import IGetPlacesRepo from '../data/repository/IGetPlacesRepo';
+import IGetPlacesRepo from "../data/repository/IGetPlacesRepo";
 
 /**
  * this usecase is responsible for calling the repo and returning the places data from the repository

src/business-logic/core/users/common/data/model/usersModel.ts

@@ -1,9 +1,9 @@
-import Users from '../../entity/entity';
+import Users from "../../entity/entity";
 
 class UsersModel {
   private usersList: Users[];
 
-  private modelTitle = 'users';
+  private modelTitle = "users";
 
   constructor(data: Users[]) {
     this.usersList = data;

src/business-logic/core/users/get-users/data/repository/IGetUserRepo.ts

@@ -1,4 +1,4 @@
-import UsersModel from '../../../common/data/model/usersModel';
+import UsersModel from "../../../common/data/model/usersModel";
 
 type IGetUsersRepo = () => Promise<UsersModel>;
 

src/business-logic/core/users/get-users/data/repository/getUserRepo.ts

@@ -1,6 +1,6 @@
-import UsersModel from '../../../common/data/model/usersModel';
+import UsersModel from "../../../common/data/model/usersModel";
-import getUsersResponseObject from '../response-object/usersRO';
+import getUsersResponseObject from "../response-object/usersRO";
-import { GetUsersResponse } from '../response-object/protocols';
+import { GetUsersResponse } from "../response-object/protocols";
 
 const getUsersRepo = async (httpHandler: () => Promise<GetUsersResponse>) => {
   // call httpHandler

src/business-logic/core/users/get-users/data/response-object/usersRO.ts

@@ -1,6 +1,6 @@
 /* eslint-disable no-underscore-dangle */
-import Users from '../../../common/entity/entity';
+import Users from "../../../common/entity/entity";
-import { GetUsersResponse } from './protocols';
+import { GetUsersResponse } from "./protocols";
 
 const getUsersResponseObject = (apiResponse: GetUsersResponse): Users[] => {
   return apiResponse.map((userItem) => {

src/business-logic/core/users/get-users/index.ts

@@ -1,3 +1,3 @@
-import getUsers from './infra/getUsersInfra';
+import getUsers from "./infra/getUsersInfra";
 
 export default getUsers;

src/business-logic/core/users/get-users/infra/getUsersInfra.ts

@@ -1,7 +1,7 @@
-import IGetUsersRepo from '../data/repository/IGetUserRepo';
+import IGetUsersRepo from "../data/repository/IGetUserRepo";
-import getUsersRepo from '../data/repository/getUserRepo';
+import getUsersRepo from "../data/repository/getUserRepo";
-import GettingUsersUsecase from '../usecase/getUsersUsecase';
+import GettingUsersUsecase from "../usecase/getUsersUsecase";
-import { IgetusersInfra, getusersReturnType } from './protocols';
+import { IgetusersInfra, getusersReturnType } from "./protocols";
 
 const getUsers = ({ httpHandler }: IgetusersInfra): getusersReturnType => {
   // get httpHandler

src/business-logic/core/users/get-users/infra/protocols.ts

@@ -1,8 +1,8 @@
-import UsersModel from '../../common/data/model/usersModel';
+import UsersModel from "../../common/data/model/usersModel";
-import { GetUsersResponse } from '../data/response-object/protocols';
+import { GetUsersResponse } from "../data/response-object/protocols";
 
-export interface IgetUsersInfra {
+export interface IgetusersInfra {
   httpHandler: () => Promise<GetUsersResponse>;
 }
 
-export type getUsersReturnType = () => Promise<UsersModel>;
+export type getusersReturnType = () => Promise<UsersModel>;

src/business-logic/core/users/get-users/ports.ts

@@ -1,5 +0,0 @@
-import { getUsersReturnType, type IgetUsersInfra } from './infra/protocols';
-
-export default IgetUsersInfra;
-
-export type getUsersReturnPort = getUsersReturnType;

src/business-logic/core/users/get-users/usecase/getUsersUsecase.ts

@@ -1,5 +1,5 @@
-import UsersModel from '../../common/data/model/usersModel';
+import UsersModel from "../../common/data/model/usersModel";
-import IGetUsersRepo from '../data/repository/IGetUserRepo';
+import IGetUsersRepo from "../data/repository/IGetUserRepo";
 
 /**
  * this usecase is responsible for calling the repo and returning the users data from the repository

src/driven/adapters/get-places-adapter/getPlacesAdapter.ts

@@ -1,9 +1,9 @@
-import { GetPlacesResponse } from '~/business-logic/core/places/get-places/data/response-object/protocols';
+import { GetPlacesResponse } from "~/business-logic/core/places/get-places/data/response-object/protocols";
-import IGetPlacesPort from '~/business-logic/core/places/get-places/port';
+import IGetPlacesPort from "~/business-logic/core/places/get-places/port";
-import { HTTPPovider } from '~/driven/boundaries/http-boundary/httpBoundary';
+import { HTTPPovider } from "~/driven/boundaries/http-boundary/httpBoundary";
-import { HttpOptionsType } from '~/driven/boundaries/http-boundary/protocols';
+import { HttpOptionsType } from "~/driven/boundaries/http-boundary/protocols";
-import { apiUrls } from '~/driven/utils/configs/appConfig';
+import { apiUrls } from "~/driven/utils/configs/appConfig";
-import { getPlacesAdapterReturnType } from './protocols';
+import { getPlacesAdapterReturnType } from "./protocols";
 
 const getPlacesAdapter = (): IGetPlacesPort & getPlacesAdapterReturnType => {
   // url of api
@@ -11,7 +11,7 @@ const getPlacesAdapter = (): IGetPlacesPort & getPlacesAdapterReturnType => {
   // make the options of request
   const options: HttpOptionsType = {
     url,
-    method: 'GET',
+    method: "GET",
   };
   // make the httpHandler
   const httpProvider = new HTTPPovider();

src/driven/adapters/get-users-adapter/getUsersAdapter.ts

@@ -1,29 +0,0 @@
-import { apiUrls } from '~/driven/utils/configs/appConfig';
-import { HttpOptionsType } from '~/driven/boundaries/http-boundary/protocols';
-import { HTTPPovider } from '~/driven/boundaries/http-boundary/httpBoundary';
-import { GetUsersResponse } from '~/business-logic/core/users/get-users/data/response-object/protocols';
-import IGetUsersPort from '~/business-logic/core/users/get-users/ports';
-import { getUsersAdapterReturnType } from './protocols';
-
-const getUsersAdapter = (): IGetUsersPort & getUsersAdapterReturnType => {
-  // url of api
-  const url = apiUrls.core.getUsers;
-  // make the options of request
-  const options: HttpOptionsType = {
-    url,
-    method: 'GET',
-  };
-  // make the httpHandler
-  const httpProvider = new HTTPPovider();
-
-  const httpHandler = async () =>
-    httpProvider.request<GetUsersResponse>(options);
-
-  // return the method
-  return {
-    httpHandler,
-    url,
-  };
-};
-
-export default getUsersAdapter;

src/driven/adapters/get-users-adapter/protocols.ts

@@ -1,3 +0,0 @@
-export type getUsersAdapterReturnType = {
-  url: string;
-};

src/driven/boundaries/http-boundary/httpBoundary.ts

@@ -1,7 +1,7 @@
-import axios from 'axios';
+import axios from "axios";
-import { staticMessages } from '~/driven/utils/constants/staticMessages';
+import { staticMessages } from "~/driven/utils/constants/staticMessages";
-import { ApiGlobalResponseObject } from '~/driven/utils/protocols/serviceProtocols';
+import { ApiGlobalResponseObject } from "~/driven/utils/protocols/serviceProtocols";
-import { HttpOptionsType } from './protocols';
+import { HttpOptionsType } from "./protocols";
 
 export class HTTPPovider {
   async request<R>(customOptions: HttpOptionsType) {
@@ -9,8 +9,8 @@ export class HTTPPovider {
       ...customOptions,
       headers: {
         ...customOptions.headers,
-        mode: 'cors',
+        mode: "cors",
-        credentials: 'include',
+        credentials: "include",
         Authorization: `Bearer eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6ICI4NXh0WnA5eThxVDBXVDkwUFpuUkRja3N4LWw0clVyM0tHQW5JSU9DckJNIn0.eyJleHAiOjE2ODQ2Njc2MTEsImlhdCI6MTY4NDU4MTIxMSwianRpIjoiN2VlNzQ5ZTMtMjdhOC00ZTc1LWE4MTAtOTU0MGY5NDdmNjlkIiwiaXNzIjoiaHR0cDovL2xvY2FsaG9zdDo4MDgwL3JlYWxtcy9kaXBhbF9kZXYiLCJhdWQiOiJhY2NvdW50Iiwic3ViIjoiY2RmYzY3YzQtZGJkOC00NGVhLWI0OWEtYjQ3MjZhMzNmOTAxIiwidHlwIjoiQmVhcmVyIiwiYXpwIjoiY29tZm9ydGVjaCIsInNlc3Npb25fc3RhdGUiOiI3YTFlZDk2OS1lNWY2LTQzZTctOThhMy05OGQ3Zjk3YWM1NDgiLCJyZWFsbV9hY2Nlc3MiOnsicm9sZXMiOlsiZGVmYXVsdC1yb2xlcy1tYXN0ZXIiLCJvZmZsaW5lX2FjY2VzcyIsInVtYV9hdXRob3JpemF0aW9uIl19LCJyZXNvdXJjZV9hY2Nlc3MiOnsiY29tZm9ydGVjaCI6eyJyb2xlcyI6WyJ1c2VyIiwib3BlcmF0b3IiXX0sImFjY291bnQiOnsicm9sZXMiOlsibWFuYWdlLWFjY291bnQiLCJtYW5hZ2UtYWNjb3VudC1saW5rcyIsInZpZXctcHJvZmlsZSJdfX0sInNjb3BlIjoiZW1haWwgcHJvZmlsZSIsInNpZCI6IjdhMWVkOTY5LWU1ZjYtNDNlNy05OGEzLTk4ZDdmOTdhYzU0OCIsImVtYWlsX3ZlcmlmaWVkIjpmYWxzZSwicHJlZmVycmVkX3VzZXJuYW1lIjoiKzc3Nzc3Nzc3Nzc3In0.qp1GetUEy2LOZWy6Aaiwf_0d0U8wBqXJQhhuSgIO4RkkEgUnwYZ5fFupkp1iTXZMpqWAsmbRp-C0Z8nYT8Hor6XjnE73XwAVVY0Jbx6HSxtcTBOqo2IT0SmVm6z-TFpgYnErHiFZZgsqP4KYkc12xlQH4SrpN-h-oXN4ZtwuOIG65ixt2yKC-8KTyZzfZGa_8llAtnthQBtxX00MdivFpRP-NU1KfCtJqHSTKn40RNs-Nt8Gi_x7vWv9OKD8h-IIp27oOCJZNyL4aa237cuPw9IWbdiDuUAOgxkPw30i9LIDPA70GvdpRKWgLq0-itcT_hpf2RguuALDafaqoGgoGQ`,
       },
     };

src/driven/boundaries/http-boundary/protocols.ts

@@ -1,3 +1,3 @@
-import { AxiosRequestConfig } from 'axios';
+import { AxiosRequestConfig } from "axios";
 
 export type HttpOptionsType = AxiosRequestConfig;

src/driven/boundaries/router-boundary/index.tsx

@@ -1,4 +1,9 @@
-import { NavigateFunction, Outlet, useLocation, useNavigate } from 'react-router-dom';
+import {
+  NavigateFunction,
+  Outlet,
+  useLocation,
+  useNavigate,
+} from "react-router-dom";
 
 class RouterBoundary {
   outletRoute = () => <Outlet />;

src/driven/boundaries/state-management/index.ts

@@ -1,3 +1,3 @@
-import StateManagementService from './stateManagementService';
+import StateManagementService from "./stateManagementService";
 
 export default StateManagementService;

src/driven/boundaries/state-management/stateManagementService.ts

@@ -1,5 +1,5 @@
-import StateManagementProvider from './stateManagementProvider';
+import StateManagementProvider from "./stateManagementProvider";
-import SwrBoundary from './swrBoundary';
+import SwrBoundary from "./swrBoundary";
 
 export default class StateManagementService implements StateManagementProvider {
   private provider: StateManagementProvider;

src/driven/boundaries/state-management/swrBoundary.ts

@@ -1,5 +1,5 @@
-import useSwr from 'swr';
+import useSwr from "swr";
-import StateManagementProvider from './stateManagementProvider';
+import StateManagementProvider from "./stateManagementProvider";
 
 export default class SwrBoundary implements StateManagementProvider {
   useGetQuery<DataType>(

src/driven/utils/components/buttons/primary-button/PrimaryButton.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React from "react";
 
 interface IPrimaryButtonProps {
   title: string;

src/driven/utils/components/inputs/simple-input/SimpleInput.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React from "react";
 
 interface ISimpleInput {
   title: string;
@@ -9,10 +9,13 @@ export default function SimpleInput(props: ISimpleInput) {
   const { title, className } = props;
   return (
     <div className={`flex flex-col ${className}`}>
-      <label className='mb-1 text-txt-second text-xs' htmlFor={title}>
+      <label className="mb-1 text-txt-second text-xs" htmlFor={title}>
         {title}
       </label>
-      <input className='bg-bg-gray h-11 rounded-lg focus:outline-0 px-2 text-txt-medium' id={title} />
+      <input
+        className="bg-bg-gray h-11 rounded-lg focus:outline-0 px-2 text-txt-medium"
+        id={title}
+      />
     </div>
   );
 }

src/driven/utils/components/loading/Loading.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
+import React from "react";
-import style from './style.module.css';
+import style from "./style.module.css";
 
 export default function Loading() {
   return (

src/driven/utils/components/page-title/pageTitle.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React from "react";
 
 interface IPageTitleProps {
   title: string;
@@ -7,5 +7,11 @@ interface IPageTitleProps {
 
 export default function PageTitle(props: IPageTitleProps) {
   const { title, className } = props;
-  return <div className={`w-full shadow-sm shadow-txt-light font-semibold ${className}`}>{title}</div>;
+  return (
+    <div
+      className={`w-full shadow-sm shadow-txt-light font-semibold ${className}`}
+    >
+      {title}
+    </div>
+  );
 }

src/driven/utils/configs/appConfig.ts

@@ -1,12 +1,12 @@
-import { icons } from '../constants/assertUrls';
+import { icons } from "../constants/assertUrls";
-import { ENVs } from '../constants/envs';
+import { ENVs } from "../constants/envs";
-import { staticMessages } from '../constants/staticMessages';
+import { staticMessages } from "../constants/staticMessages";
 
 export const appConfig = {};
 
 export const routes = {
-  usersList: '/',
+  usersList: "/",
-  createUser: '/create-user',
+  createUser: "/create-user",
 };
 
 export const routesData = {

src/driven/utils/constants/assertUrls.ts

@@ -1,4 +1,4 @@
-const baseAssetsUrl = 'assets/';
+const baseAssetsUrl = "assets/";
 const baseIconsUrl = `${baseAssetsUrl}icons/`;
 export const icons = {
   logo: `${baseIconsUrl}logo.svg`,

src/driven/utils/constants/staticMessages.ts

@@ -1,24 +1,24 @@
 export const staticMessages = {
   global: {
     errors: {
-      input: 'please fill all inputs correctly',
+      input: "please fill all inputs correctly",
     },
-    users: 'Users',
+    users: "Users",
-    submit: 'Submit',
+    submit: "Submit",
-    fistname: 'Firstname',
+    fistname: "Firstname",
-    lastname: 'Lastname',
+    lastname: "Lastname",
-    place_id: 'Place id',
+    place_id: "Place id",
-    title: 'title',
+    title: "title",
-    status: 'Status',
+    status: "Status",
-    address: 'Address',
+    address: "Address",
-    qrCode: 'qrCode',
+    qrCode: "qrCode",
-    createUser: 'Create user',
+    createUser: "Create user",
-    phoneNumber: 'Phone Number',
+    phoneNumber: "Phone Number",
   },
   service: {
     errors: {
-      500: 'server not respond please try again later!',
+      500: "server not respond please try again later!",
-      401: 'Authentication error!',
+      401: "Authentication error!",
     },
   },
 };

src/driven/utils/helpers/globalHelpers.ts

@@ -1,8 +1,7 @@
-import StateManagementService from '~/driven/boundaries/state-management';
 import {
   errorHandlingStateTypes,
   UIErrorHandling,
-} from './protocols/globalHelpersProtocols';
+} from "./protocols/globalHelpersProtocols";
 
 export const UIErrorHandlingFactory = <DATA_RESPONSE>({
   state,
@@ -17,14 +16,3 @@ export const UIErrorHandlingFactory = <DATA_RESPONSE>({
   message,
   state,
 });
-
-export const prepareStateManagementForVM = <ReturnType>(
-  apiUrl: string,
-  model: () => Promise<ReturnType>
-) => {
-  const stateManagement = StateManagementService.swr();
-
-  const useGetPlacesList = () => stateManagement.useGetQuery(apiUrl, model);
-
-  return useGetPlacesList;
-};

src/driven/utils/helpers/protocols/globalHelpersProtocols.ts

@@ -1,7 +1,7 @@
 export enum errorHandlingStateTypes {
-  error = 'error',
+  error = "error",
-  warning = 'warning',
+  warning = "warning",
-  success = 'success',
+  success = "success",
 }
 
 export type UIErrorHandling<DATA_RESPONSE> = {

src/driven/utils/protocols/serviceProtocols.ts

@@ -1,7 +1,7 @@
-export type RequestMethods = 'get' | 'post' | 'put' | 'delete';
+export type RequestMethods = "get" | "post" | "put" | "delete";
 
 export type ApiGlobalResponseObject<DataType> = {
-  type: 'Success' | 'client Error' | string;
+  type: "Success" | "client Error" | string;
   status: 200 | 400 | 401 | 500 | number;
   message: string;
   description: string;

src/driving/application/core/common/table-row/index.tsx

@@ -1,3 +1,3 @@
-import TableRow from './infra/TableRowInfra';
+import TableRow from "./infra/TableRowInfra";
 
 export default TableRow;

src/driving/application/core/common/table-row/infra/TableRowInfra.tsx

@@ -1,7 +1,7 @@
-import React from 'react';
+import React from "react";
-import useTableRowVM from '../viewmodel/tableRowVM';
+import useTableRowVM from "../viewmodel/tableRowVM";
-import TableRowView from '../view/TableRow';
+import TableRowView from "../view/TableRow";
-import { ITableRowInfra } from './protocols';
+import { ITableRowInfra } from "./protocols";
 
 export default function TableRow(props: ITableRowInfra) {
   const { rowData, selectedRowId, setSelectedRowId } = props;
@@ -9,5 +9,11 @@ export default function TableRow(props: ITableRowInfra) {
 
   const { isRowSelected } = useTableRowVM({ selectedRowId, rowId });
 
-  return <TableRowView isSelected={isRowSelected} rowData={rowData} setSelectedRowId={setSelectedRowId} />;
+  return (
+    <TableRowView
+      isSelected={isRowSelected}
+      rowData={rowData}
+      setSelectedRowId={setSelectedRowId}
+    />
+  );
 }

src/driving/application/core/common/table-row/view/TableRow.tsx

@@ -1,12 +1,19 @@
-import React from 'react';
+import React from "react";
-import RowItem from './table-row-item/view/RowItem';
+import RowItem from "./table-row-item/view/RowItem";
-import { ITableRowProps } from './protocols';
+import { ITableRowProps } from "./protocols";
 
 export default function TableRowView(props: ITableRowProps) {
   const { isSelected, setSelectedRowId, rowData } = props;
   const { rowId, rowItemsTitle } = rowData;
   const columns = rowItemsTitle.map((rowItemTitle, index) => {
-    return <RowItem key={rowItemTitle} hasCheckbox={index === 0} isSelected={isSelected} title={rowItemTitle} />;
+    return (
+      <RowItem
+        key={rowItemTitle}
+        hasCheckbox={index === 0}
+        isSelected={isSelected}
+        title={rowItemTitle}
+      />
+    );
   });
 
   return <tr onClick={() => setSelectedRowId(rowId)}>{columns}</tr>;

src/driving/application/core/common/table-row/view/table-row-item/view/RowItem.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React from "react";
 
 interface IRowItemProp {
   title: string;
@@ -9,15 +9,19 @@ interface IRowItemProp {
 export default function RowItem(props: IRowItemProp) {
   const { title, hasCheckbox, isSelected } = props;
   return (
-    <td className={`px-1 py-2 ${isSelected ? 'bg-primary-100' : ''}`}>
+    <td className={`px-1 py-2 ${isSelected ? "bg-primary-100" : ""}`}>
-      <div className='w-full flex'>
+      <div className="w-full flex">
         {hasCheckbox && (
           <span
             className={`checkmak-container flex justify-center items-center mr-2 transition-all ${
-              isSelected ? 'opacity-100' : 'opacity-0'
+              isSelected ? "opacity-100" : "opacity-0"
             }`}
           >
-            <span className={`${isSelected ? 'visible' : 'hidden'} transition-all`}>&#10003;</span>
+            <span
+              className={`${isSelected ? "visible" : "hidden"} transition-all`}
+            >
+              &#10003;
+            </span>
           </span>
         )}
         {title}

src/driving/application/core/common/table-row/viewmodel/tableRowVM.ts

@@ -1,4 +1,4 @@
-import { IUserTableRowVM, tableRowVMReturnType } from './protocols';
+import { IUserTableRowVM, tableRowVMReturnType } from "./protocols";
 
 const useTableRowVM = (dependencies: IUserTableRowVM): tableRowVMReturnType => {
   const { rowId, selectedRowId } = dependencies;

src/driving/application/core/create-user/index.tsx

@@ -1,3 +1,3 @@
-import CreateUser from './infra/CreateUser';
+import CreateUser from "./infra/CreateUser";
 
 export default CreateUser;

src/driving/application/core/create-user/infra/CreateUser.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
+import React from "react";
-import CreateUserView from '../view/CreateUserView';
+import CreateUserView from "../view/CreateUserView";
 
 export default function CreateUser() {
   return <CreateUserView />;

src/driving/application/core/create-user/view/CreateUserView.tsx

@@ -1,18 +1,30 @@
-import React from 'react';
+import React from "react";
-import PrimaryButton from '~/driven/utils/components/buttons/primary-button/PrimaryButton';
+import PrimaryButton from "~/driven/utils/components/buttons/primary-button/PrimaryButton";
-import SimpleInput from '~/driven/utils/components/inputs/simple-input/SimpleInput';
+import SimpleInput from "~/driven/utils/components/inputs/simple-input/SimpleInput";
-import { staticMessages } from '~/driven/utils/constants/staticMessages';
+import { staticMessages } from "~/driven/utils/constants/staticMessages";
 
 export default function CreateUserView() {
   return (
-    <div className='px-4 my-8'>
+    <div className="px-4 my-8">
-      <div className='flex flex-wrap w-full gap-4'>
+      <div className="flex flex-wrap w-full gap-4">
-        <SimpleInput title={staticMessages.global.fistname} className='mb-4 w-[48%]' />
+        <SimpleInput
-        <SimpleInput title={staticMessages.global.lastname} className='mb-4 w-[48%]' />
+          title={staticMessages.global.fistname}
-        <SimpleInput title={staticMessages.global.phoneNumber} className='mb-4 w-[48%]' />
+          className="mb-4 w-[48%]"
+        />
+        <SimpleInput
+          title={staticMessages.global.lastname}
+          className="mb-4 w-[48%]"
+        />
+        <SimpleInput
+          title={staticMessages.global.phoneNumber}
+          className="mb-4 w-[48%]"
+        />
       </div>
-      <div className='flex'>
+      <div className="flex">
-        <PrimaryButton onClick={() => null} title={staticMessages.global.submit} />
+        <PrimaryButton
+          onClick={() => null}
+          title={staticMessages.global.submit}
+        />
       </div>
     </div>
   );

src/driving/application/core/places-list/index.tsx

@@ -1,3 +1,3 @@
-import PlacesList from './infra/PlacesList';
+import PlacesList from "./infra/PlacesList";
 
 export default PlacesList;

src/driving/application/core/places-list/infra/PlacesList.tsx

@@ -1,11 +1,11 @@
-import React from 'react';
+import React from "react";
-import getPlaces from '~/business-logic/core/places/get-places';
+import getPlaces from "~/business-logic/core/places/get-places";
-import getPlacesAdapter from '~/driven/adapters/get-places-adapter/getPlacesAdapter';
+import getPlacesAdapter from "~/driven/adapters/get-places-adapter/getPlacesAdapter";
-import PlacesModel from '~/business-logic/core/places/common/model/placesModel';
+import StateManagementService from "~/driven/boundaries/state-management";
-import { prepareStateManagementForVM } from '~/driven/utils/helpers/globalHelpers';
+import PlacesModel from "~/business-logic/core/places/common/model/placesModel";
-import PlacesListView from '../view/PlacesListView';
+import PlacesListView from "../view/PlacesListView";
-import usePlacesListVM from '../viewmodel/placesListVM';
+import usePlacesListVM from "../viewmodel/placesListVM";
-import placesListModel from '../model/placesListModel';
+import placesListModel from "../model/placesListModel";
 
 const prepareTheLogicForModel = () => {
   const gettingPlacesDrivenAdapter = getPlacesAdapter();
@@ -14,14 +14,23 @@ const prepareTheLogicForModel = () => {
   return { getingPlacesLogic, url };
 };
 
+const prepareStateManagementForVM = (
+  apiUrl: string,
+  placesModel: () => Promise<PlacesModel>
+) => {
+  const stateManagement = StateManagementService.swr();
+
+  const useGetPlacesList = () =>
+    stateManagement.useGetQuery(apiUrl, placesModel);
+
+  return useGetPlacesList;
+};
+
 export default function PlacessList() {
   const { getingPlacesLogic, url } = prepareTheLogicForModel();
   const placesModel = async () => await placesListModel(getingPlacesLogic);
 
-  const useGetPlacesList = prepareStateManagementForVM<PlacesModel>(
+  const useGetPlacesList = prepareStateManagementForVM(url, placesModel);
-    url,
-    placesModel
-  );
   const { selectedRowId, setSelectedRowId, placesData } = usePlacesListVM({
     useGetPlacesList,
   });

src/driving/application/core/places-list/model/placesListModel.ts

@@ -1,4 +1,4 @@
-import { getPlacesModel } from './protocols';
+import { getPlacesModel } from "./protocols";
 
 const placesListModel: getPlacesModel = async (getPlaces) => {
   // get the method for handling the logic

src/driving/application/core/places-list/model/protocols.ts

@@ -1,4 +1,6 @@
-import PlacesModel from '~/business-logic/core/places/common/model/placesModel';
+import PlacesModel from "~/business-logic/core/places/common/model/placesModel";
-import { getPlacesReturnPort } from '~/business-logic/core/places/get-places/port';
+import { getPlacesReturnPort } from "~/business-logic/core/places/get-places/port";
 
-export type getPlacesModel = (getPlaces: getPlacesReturnPort) => Promise<PlacesModel>;
+export type getPlacesModel = (
+  getPlaces: getPlacesReturnPort
+) => Promise<PlacesModel>;

src/driving/application/core/places-list/view/PlacesListView.tsx

@@ -1,8 +1,8 @@
-import React from 'react';
+import React from "react";
-import { staticMessages } from '~/driven/utils/constants/staticMessages';
+import { staticMessages } from "~/driven/utils/constants/staticMessages";
-import Loading from '~/driven/utils/components/loading/Loading';
+import Loading from "~/driven/utils/components/loading/Loading";
-import TableRow from '../../common/table-row';
+import TableRow from "../../common/table-row";
-import { IPlacesListProps } from './protocols';
+import { IPlacesListProps } from "./protocols";
 
 export default function UsersListView(props: IPlacesListProps) {
   const { selectedRowId, setSelectedRowId, placesList } = props;
@@ -10,18 +10,18 @@ export default function UsersListView(props: IPlacesListProps) {
   const rows = () => {
     const placesdata = [
       {
-        id: '1',
+        id: "1",
-        place_id: '6440020b89366fdcaf15a8c2',
+        place_id: "6440020b89366fdcaf15a8c2",
-        title: 'flat demoplace	',
+        title: "flat demoplace	",
-        status: 'demo',
+        status: "demo",
-        address: 'demoplace',
+        address: "demoplace",
       },
       {
-        id: '2',
+        id: "2",
-        place_id: '6440020b89366fdcaf15asdfa',
+        place_id: "6440020b89366fdcaf15asdfa",
-        title: 'flat demoplace second	',
+        title: "flat demoplace second	",
-        status: 'demo second',
+        status: "demo second",
-        address: 'demoplace second',
+        address: "demoplace second",
       },
     ];
 
@@ -32,7 +32,7 @@ export default function UsersListView(props: IPlacesListProps) {
           places.title,
           places.status,
           places.address,
-          '',
+          "",
         ],
         rowId: places.id,
       };

src/driving/application/core/places-list/view/protocols.ts

@@ -1,4 +1,4 @@
-import PlacesModel from '~/business-logic/core/places/common/model/placesModel';
+import PlacesModel from "~/business-logic/core/places/common/model/placesModel";
 
 export interface IPlacesListProps {
   placesList: {

src/driving/application/core/places-list/viewmodel/placesListVM.ts

@@ -1,6 +1,6 @@
-import { useState } from 'react';
+import { useState } from "react";
-import PlacesModel from '~/business-logic/core/places/common/model/placesModel';
+import PlacesModel from "~/business-logic/core/places/common/model/placesModel";
-import { placesListReturnType } from './protocols';
+import { placesListReturnType } from "./protocols";
 
 interface IPlacesListVM {
   useGetPlacesList: () => {
@@ -12,7 +12,7 @@ interface IPlacesListVM {
 const usePlacesListVM = (dependencies: IPlacesListVM): placesListReturnType => {
   const { useGetPlacesList } = dependencies;
   const placesData = useGetPlacesList();
-  const [selectedRowId, setSelectedRowId] = useState<string>('');
+  const [selectedRowId, setSelectedRowId] = useState<string>("");
 
   return {
     selectedRowId,

src/driving/application/core/places-list/viewmodel/protocols.ts

@@ -1,5 +1,5 @@
-import React from 'react';
+import React from "react";
-import PlacesModel from '~/business-logic/core/places/common/model/placesModel';
+import PlacesModel from "~/business-logic/core/places/common/model/placesModel";
 
 export type placesListReturnType = {
   selectedRowId: string;

src/driving/application/core/users-list/index.tsx

@@ -1,3 +1,3 @@
-import UsersList from './infra/UsersList';
+import UsersList from "./infra/UsersList";
 
 export default UsersList;

src/driving/application/core/users-list/infra/UsersList.tsx

@@ -1,32 +1,11 @@
-import React from 'react';
+import React from "react";
-import getUsersAdapter from '~/driven/adapters/get-users-adapter/getUsersAdapter';
+import useUsersListVM from "../viewmodel/usersListVM";
-import getUsers from '~/business-logic/core/users/get-users';
+import UsersListView from "../view/UsersListView";
-import UsersModel from '~/business-logic/core/users/common/data/model/usersModel';
-import { prepareStateManagementForVM } from '~/driven/utils/helpers/globalHelpers';
-import useUsersListVM from '../viewmodel/usersListVM';
-import UsersListView from '../view/UsersListView';
-import usersListModel from '../model/usersListModel';
-
-const prepareTheLogicForModel = () => {
-  const gettingUsersDrivenAdapter = getUsersAdapter();
-  const { url } = gettingUsersDrivenAdapter;
-  const getingusersLogic = getUsers(gettingUsersDrivenAdapter);
-  return { getingusersLogic, url };
-};
 
 export default function UsersList() {
-  const { getingusersLogic, url } = prepareTheLogicForModel();
+  const { selectedRowId, setSelectedRowId } = useUsersListVM();
-  const usersModel = async () => await usersListModel(getingusersLogic);
-  const useGetusersList = prepareStateManagementForVM<UsersModel>(
-    url,
-    usersModel
-  );
-  const { selectedRowId, setSelectedRowId, usersData } = useUsersListVM({
-    useGetusersList,
-  });
   return (
     <UsersListView
-      usersList={usersData}
       selectedRowId={selectedRowId}
       setSelectedRowId={setSelectedRowId}
     />

src/driving/application/core/users-list/model/protocols.ts

@@ -1,6 +0,0 @@
-import UsersModel from '~/business-logic/core/users/common/data/model/usersModel';
-import { getUsersReturnPort } from '~/business-logic/core/users/get-users/ports';
-
-export type getUsersModel = (
-  getUsers: getUsersReturnPort
-) => Promise<UsersModel>;

src/driving/application/core/users-list/model/usersListModel.ts

@@ -1,10 +0,0 @@
-import { getUsersModel } from './protocols';
-
-const usersListModel: getUsersModel = async (getUsers) => {
-  // get the method for handling the logic
-  const users = await getUsers();
-  return users;
-  // handling the errors
-};
-
-export default usersListModel;

src/driving/application/core/users-list/view/UsersListView.tsx

@@ -1,22 +1,22 @@
-import React from 'react';
+import React from "react";
-import { staticMessages } from '~/driven/utils/constants/staticMessages';
+import { staticMessages } from "~/driven/utils/constants/staticMessages";
-import TableRow from '../../common/table-row';
+import TableRow from "../../common/table-row";
-import { IUserListProps } from './protocols';
+import { IUserListProps } from "./protocols";
 
 export default function UsersListView(props: IUserListProps) {
-  const { selectedRowId, setSelectedRowId, usersList } = props;
+  const { selectedRowId, setSelectedRowId } = props;
-  console.log(usersList.data);
+
   const rows = () => {
     const userdata = [
       {
-        id: '1',
+        id: "1",
-        firstname: 'behnam',
+        firstname: "behnam",
-        lastname: 'rahimpour',
+        lastname: "rahimpour",
       },
       {
-        id: '2',
+        id: "2",
-        firstname: 'Salar',
+        firstname: "Salar",
-        lastname: 'Sali',
+        lastname: "Sali",
       },
     ];
 

src/driving/application/core/users-list/view/protocols.ts

@@ -1,11 +1,4 @@
-import UsersModel from '~/business-logic/core/users/common/data/model/usersModel';
-
 export interface IUserListProps {
   selectedRowId: string;
   setSelectedRowId: React.Dispatch<React.SetStateAction<string>>;
-  usersList: {
-    data: UsersModel | undefined;
-    isLoading: boolean;
-    error?: string | undefined;
-  };
 }

src/driving/application/core/users-list/viewmodel/protocols.ts

@@ -1,12 +1,6 @@
-import React from 'react';
+import React from "react";
-import UsersModel from '~/business-logic/core/users/common/data/model/usersModel';
 
 export type userListReturnType = {
   selectedRowId: string;
   setSelectedRowId: React.Dispatch<React.SetStateAction<string>>;
-  usersData: {
-    data: UsersModel | undefined;
-    isLoading: boolean;
-    error?: string | undefined;
-  };
 };

src/driving/application/core/users-list/viewmodel/usersListVM.ts

@@ -1,23 +1,12 @@
-import { useState } from 'react';
+import { useState } from "react";
-import UsersModel from '~/business-logic/core/users/common/data/model/usersModel';
+import { userListReturnType } from "./protocols";
-import { userListReturnType } from './protocols';
 
-interface IUsersListVM {
+const useUsersListVM = (): userListReturnType => {
-  useGetusersList: () => {
+  const [selectedRowId, setSelectedRowId] = useState<string>("");
-    data: UsersModel | undefined;
-    isLoading: boolean;
-    error?: string | undefined;
-  };
-}
-const useUsersListVM = (dependencies: IUsersListVM): userListReturnType => {
-  const { useGetusersList } = dependencies;
-  const [selectedRowId, setSelectedRowId] = useState<string>('');
-  const usersData = useGetusersList();
 
   return {
     selectedRowId,
     setSelectedRowId,
-    usersData,
   };
 };
 

src/driving/application/support/sidebar/index.tsx

@@ -1,3 +1,3 @@
-import Sidebar from './view/Sidebar';
+import Sidebar from "./view/Sidebar";
 
 export default Sidebar;

src/driving/application/support/sidebar/view/Sidebar.tsx

@@ -1,7 +1,7 @@
-import React from 'react';
+import React from "react";
-import { Link, useLocation } from 'react-router-dom';
+import { Link, useLocation } from "react-router-dom";
-import { routesData } from '~/driven/utils/configs/appConfig';
+import { routesData } from "~/driven/utils/configs/appConfig";
-import { icons } from '~/driven/utils/constants/assertUrls';
+import { icons } from "~/driven/utils/constants/assertUrls";
 
 export default function Sidebar() {
   const isCurrentPage = useLocation();
@@ -13,21 +13,23 @@ export default function Sidebar() {
         key={key}
         to={routesData[key].path}
         className={`flex text-white mb-6 text-sm w-full  py-2 pl-2 rounded-lg ${
-          isCurrentPage.pathname === routesData[key].path ? 'bg-primary-300' : ''
+          isCurrentPage.pathname === routesData[key].path
+            ? "bg-primary-300"
+            : ""
         }`}
       >
-        <img src={routesData[key].icon} alt='page icon' className='mr-2' />
+        <img src={routesData[key].icon} alt="page icon" className="mr-2" />
         <div>{routesData[key].title}</div>
       </Link>
     );
   });
 
   return (
-    <aside className='w-[15rem] min-w-[10rem] [background:var(--color-gradient-primary-dark)] p-4 pt-6'>
+    <aside className="w-[15rem] min-w-[10rem] [background:var(--color-gradient-primary-dark)] p-4 pt-6">
-      <div className='logo'>
+      <div className="logo">
-        <img src={icons.logo} alt='logo icon' />
+        <img src={icons.logo} alt="logo icon" />
       </div>
-      <div className='mt-14 flex flex-col items-baseline'>{pages}</div>
+      <div className="mt-14 flex flex-col items-baseline">{pages}</div>
     </aside>
   );
 }

src/driving/main/App.tsx

@@ -1,6 +1,6 @@
-import { BrowserRouter as RouterWrapper } from 'react-router-dom';
+import { BrowserRouter as RouterWrapper } from "react-router-dom";
-import Router from './Router/Router';
+import Router from "./Router/Router";
-import './style/App.css';
+import "./style/App.css";
 
 function App() {
   return (

src/driving/main/Router/Router.tsx

@@ -1,8 +1,8 @@
-import { Navigate, Route, Routes, useLocation } from 'react-router-dom';
+import { Navigate, Route, Routes, useLocation } from "react-router-dom";
-import Home from '~/driving/main/pages';
+import Home from "~/driving/main/pages";
-import { routes } from '~/driven/utils/configs/appConfig';
+import { routes } from "~/driven/utils/configs/appConfig";
-import CreateUser from '../pages/CreateUser';
+import CreateUser from "../pages/CreateUser";
-import MainPageLayout from '../pages/layouts/MainPageLayout';
+import MainPageLayout from "../pages/layouts/MainPageLayout";
 
 export default function Router() {
   const location = useLocation();
@@ -13,7 +13,7 @@ export default function Router() {
         <Route index element={<Home />} />
         <Route path={routes.createUser} element={<CreateUser />} />
       </Route>
-      <Route path='*' element={<Navigate to={routes.usersList} replace />} />
+      <Route path="*" element={<Navigate to={routes.usersList} replace />} />
     </Routes>
   );
 }

src/driving/main/index.tsx

@@ -1,4 +1,6 @@
-import ReactDOM from 'react-dom/client';
+import ReactDOM from "react-dom/client";
-import App from './App';
+import App from "./App";
 
-ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(<App />);
+ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
+  <App />
+);

src/driving/main/pages/CreateUser.tsx

@@ -1,12 +1,15 @@
-import React from 'react';
+import React from "react";
-import PageTitle from '~/driven/utils/components/page-title/pageTitle';
+import PageTitle from "~/driven/utils/components/page-title/pageTitle";
-import { staticMessages } from '~/driven/utils/constants/staticMessages';
+import { staticMessages } from "~/driven/utils/constants/staticMessages";
-import CreateUser from '~/driving/application/core/create-user';
+import CreateUser from "~/driving/application/core/create-user";
 
 export default function CreateUserPage() {
   return (
     <>
-      <PageTitle className='px-4 py-5' title={staticMessages.global.createUser} />
+      <PageTitle
+        className="px-4 py-5"
+        title={staticMessages.global.createUser}
+      />
       <CreateUser />
     </>
   );

src/driving/main/pages/index.tsx

@@ -1,19 +1,23 @@
-import React from 'react';
+import React from "react";
-import PrimaryButton from '~/driven/utils/components/buttons/primary-button/PrimaryButton';
+import PrimaryButton from "~/driven/utils/components/buttons/primary-button/PrimaryButton";
-import PageTitle from '~/driven/utils/components/page-title/pageTitle';
+import PageTitle from "~/driven/utils/components/page-title/pageTitle";
-import { staticMessages } from '~/driven/utils/constants/staticMessages';
+import { staticMessages } from "~/driven/utils/constants/staticMessages";
-import PlacesList from '~/driving/application/core/places-list';
+import PlacesList from "~/driving/application/core/places-list";
-import UsersList from '~/driving/application/core/users-list';
+import UsersList from "~/driving/application/core/users-list";
 
 export default function index() {
   return (
     <>
-      <PageTitle className='px-4 py-5' title={staticMessages.global.users} />
+      <PageTitle className="px-4 py-5" title={staticMessages.global.users} />
-      <div className='container mx-auto px-4'>
+      <div className="container mx-auto px-4">
-        <div className='w-full flex flex-row-reverse items-center py-2'>
+        <div className="w-full flex flex-row-reverse items-center py-2">
-          <PrimaryButton className='text-sm' title={staticMessages.global.submit} onClick={() => null} />
+          <PrimaryButton
+            className="text-sm"
+            title={staticMessages.global.submit}
+            onClick={() => null}
+          />
         </div>
-        <div className='md:grid-cols-2 gap-x-4 grid grid-cols-1 mx-auto'>
+        <div className="md:grid-cols-2 gap-x-4 grid grid-cols-1 mx-auto">
           <UsersList />
           <PlacesList />
         </div>

src/driving/main/pages/layouts/MainPageLayout.tsx

@@ -1,12 +1,12 @@
-import React from 'react';
+import React from "react";
-import { Outlet } from 'react-router-dom';
+import { Outlet } from "react-router-dom";
-import Sidebar from '~/driving/application/support/sidebar';
+import Sidebar from "~/driving/application/support/sidebar";
 
 export default function MainPageLayout() {
   return (
-    <div className='flex flex-nowrap h-screen'>
+    <div className="flex flex-nowrap h-screen">
       <Sidebar />
-      <main className='dipal-panel w-full text-black bg-white h-fit'>
+      <main className="dipal-panel w-full text-black bg-white h-fit">
         <Outlet />
       </main>
     </div>