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

@@ -1,8 +1,8 @@
 import UsersModel from '../../common/data/model/usersModel';
 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

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

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

@@ -0,0 +1,29 @@
+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

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

src/driven/utils/helpers/globalHelpers.ts

@@ -1,4 +1,8 @@
-import { errorHandlingStateTypes, UIErrorHandling } from './protocols/globalHelpersProtocols';
+import StateManagementService from '~/driven/boundaries/state-management';
+import {
+  errorHandlingStateTypes,
+  UIErrorHandling,
+} from './protocols/globalHelpersProtocols';
 
 export const UIErrorHandlingFactory = <DATA_RESPONSE>({
   state,
@@ -13,3 +17,14 @@ 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/driving/application/core/places-list/infra/PlacesList.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import getPlaces from '~/business-logic/core/places/get-places';
 import getPlacesAdapter from '~/driven/adapters/get-places-adapter/getPlacesAdapter';
-import StateManagementService from '~/driven/boundaries/state-management';
 import PlacesModel from '~/business-logic/core/places/common/model/placesModel';
+import { prepareStateManagementForVM } from '~/driven/utils/helpers/globalHelpers';
 import PlacesListView from '../view/PlacesListView';
 import usePlacesListVM from '../viewmodel/placesListVM';
 import placesListModel from '../model/placesListModel';
@@ -14,23 +14,14 @@ 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(url, placesModel);
+  const useGetPlacesList = prepareStateManagementForVM<PlacesModel>(
+    url,
+    placesModel
+  );
   const { selectedRowId, setSelectedRowId, placesData } = usePlacesListVM({
     useGetPlacesList,
   });

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

@@ -1,8 +1,34 @@
 import React from 'react';
+import getUsersAdapter from '~/driven/adapters/get-users-adapter/getUsersAdapter';
+import getUsers from '~/business-logic/core/users/get-users';
+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 { selectedRowId, setSelectedRowId } = useUsersListVM();
-  return <UsersListView selectedRowId={selectedRowId} setSelectedRowId={setSelectedRowId} />;
+  const { getingusersLogic, url } = prepareTheLogicForModel();
+  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

@@ -0,0 +1,6 @@
+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

@@ -0,0 +1,10 @@
+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

@@ -4,8 +4,8 @@ import TableRow from '../../common/table-row';
 import { IUserListProps } from './protocols';
 
 export default function UsersListView(props: IUserListProps) {
-  const { selectedRowId, setSelectedRowId } = props;
-
+  const { selectedRowId, setSelectedRowId, usersList } = props;
+  console.log(usersList.data);
   const rows = () => {
     const userdata = [
       {
@@ -37,11 +37,11 @@ export default function UsersListView(props: IUserListProps) {
   };
 
   return (
-    <table className='table-auto rounded-md w-full text-sm'>
-      <thead className='text-txt-medium font-bold'>
+    <table className="table-auto rounded-md w-full text-sm">
+      <thead className="text-txt-medium font-bold">
         <tr>
-          <th className='py-3'>{staticMessages.global.fistname}</th>
-          <th className='py-3'>{staticMessages.global.lastname}</th>
+          <th className="py-3">{staticMessages.global.fistname}</th>
+          <th className="py-3">{staticMessages.global.lastname}</th>
         </tr>
       </thead>
       <tbody>{rows()}</tbody>

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

@@ -1,4 +1,11 @@
+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,6 +1,12 @@
 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,12 +1,23 @@
 import { useState } from 'react';
+import UsersModel from '~/business-logic/core/users/common/data/model/usersModel';
 import { userListReturnType } from './protocols';
 
-const useUsersListVM = (): userListReturnType => {
+interface IUsersListVM {
+  useGetusersList: () => {
+    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,
   };
 };