feat: move frontend bff to use RemoteGroupService

apps/backend-bff/src/app/remoteGroup/remote.group.controller.ts

@@ -3,11 +3,11 @@ import { Body, Controller, Get, HttpCode, Param, Post } from '@nestjs/common';
 import {
   container,
   Group,
-  GroupCreateDto,
+  GroupCreateDto, GroupService,
   GroupServiceWorkflow,
   Table,
-  TableCreateDto,
-} from '@spos/services/common';
+  TableCreateDto, TYPES
+} from "@spos/services/common";
 import { ApiProperty, ApiTags } from '@nestjs/swagger';
 
 export class TableDto implements Table {
@@ -48,22 +48,22 @@ export class AnnotatedGroupCreateDto implements GroupCreateDto {
 export class RemoteGroupController {
   @Get()
   async getGroups(): Promise<AnnotatedGroup[]> {
-    return container.get(GroupServiceWorkflow).getGroups();
+    return container.get<GroupService>(TYPES.GroupService).getGroups();
   }
 
   @Get(':id')
   async getGroup(
     @Param('id')
     id: string
   ): Promise<AnnotatedGroup> {
-    return container.get(GroupServiceWorkflow).getGroup(id);
+    return container.get<GroupService>(TYPES.GroupService).getGroup(id);
   }
 
   @Post()
   @HttpCode(201)
   async addGroup(
     @Body() body: AnnotatedGroupCreateDto
   ): Promise<AnnotatedGroup> {
-    return container.get(GroupServiceWorkflow).addGroup(body);
+    return container.get<GroupService>(TYPES.GroupService).addGroup(body);
   }
 }

apps/frontend-bff/src/main.tsx

@@ -6,7 +6,7 @@ import { BrowserRouter } from "react-router-dom";
 import App from "./app/app";
 import { CssBaseline } from "@mui/material";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { container } from "@spos/services/common";
+import { bffContainer, container } from "@spos/services/common";
 import { ContainerContext } from "@spos/ui/common";
 
 const root = ReactDOM.createRoot(
@@ -17,7 +17,7 @@ root.render(
   <StrictMode>
     <QueryClientProvider client={queryClient}>
       <BrowserRouter>
-        <ContainerContext.Provider value={container}>
+        <ContainerContext.Provider value={bffContainer}>
           <CssBaseline />
           <App />
         </ContainerContext.Provider>

libs/services/common/src/index.ts

@@ -6,3 +6,4 @@ export * from './lib/container';
 export * from './lib/types';
 export * from './lib/group/groupCreate.dto';
 export * from './lib/group/groupServiceWorkflow';
+export * from './lib/bff.container';

libs/services/common/src/lib/apis/backendBffApiService.ts

@@ -4,6 +4,7 @@ import { Configuration, RemoteGroupApi } from "@spos/clients-bff";
 @injectable()
 export class BackendBffApiService {
   private configuration = new Configuration({
+    basePath: "http://localhost:3000",
   });
   private remoteGroupApi = new RemoteGroupApi(this.configuration);
 

libs/services/common/src/lib/group/groupRemoteService.ts

@@ -14,19 +14,22 @@ export class GroupRemoteService implements GroupService {
 
   }
   async addGroup(groupCreateDto: GroupCreateDto): Promise<Group> {
+    console.log('addGroupRemoteService', groupCreateDto, 'groupCreateDto');
     return (await this.backendBffApiService.getRemoteGroupApi().remoteGroupControllerAddGroup({
      annotatedGroupCreateDto: groupCreateDto,
    })).data;
   }
 
   async getGroup(id: string): Promise<Group> {
+    console.log('getGroupRemoteService', id, 'id');
     return (await (this.backendBffApiService.getRemoteGroupApi().remoteGroupControllerGetGroup({
       id,
     }))).data;
 
   }
 
   async getGroups(): Promise<Group[]> {
+    console.log('getGroupsRemoteService');
     return (await this.backendBffApiService.getRemoteGroupApi().remoteGroupControllerGetGroups()).data;
   }
 

libs/ui/common/src/lib/offers/offers.tsx

@@ -4,19 +4,21 @@ import { useOffers } from './stores/offers';
 import { useNavigate } from 'react-router-dom';
 import { useMutation } from '@tanstack/react-query';
 import {
-  container,
   GroupCreateDto,
   GroupService,
   TYPES,
 } from '@spos/services/common';
 import { useCurrentSelectedGroup } from '../tables/stores/currentSelectedGroup';
+import { ContainerContext } from "../containerHook/containerContext";
+import { useContext } from "react";
 
 export function Offers() {
   const offers = useOffers((state) => state.offers);
   const selectedTables = useCurrentSelectedGroup((state) => state.tables);
   const resetCurrentSelectedGroup = useCurrentSelectedGroup(
     (state) => state.resetTables
   );
+  const container = useContext(ContainerContext);
   const mutation = useMutation({
     mutationFn: (newGroup: GroupCreateDto) => {
       return container.get<GroupService>(TYPES.GroupService).addGroup(newGroup);