Feature #27: Hook client to server endpoints

docker-compose.yml

@@ -8,8 +8,10 @@ services:
       - 5000
     labels:
       - "traefik.enable=true"
-      - "traefik.http.routers.py-genai-helper.entrypoints=py-genai-helper"
-      - "traefik.http.routers.py-genai-helper.rule=PathPrefix(`/`)"
+      - "traefik.http.routers.py-genai-helper.entrypoints=web"
+      - "traefik.http.routers.py-genai-helper.rule=PathPrefix(`/api/v1/helper`)"
+      - "traefik.http.middlewares.helper-stripprefix.stripprefix.prefixes=/api/v1/helper"
+      - "traefik.http.routers.py-genai-helper.middlewares=helper-stripprefix"
       - "traefik.http.services.py-genai-helper.loadbalancer.server.port=5000"
     networks:
       - proxy
@@ -29,8 +31,10 @@ services:
       - SPRING_JPA_HIBERNATE_DDL_AUTO=update
     labels:
       - "traefik.enable=true"
-      - "traefik.http.routers.organization-service.entrypoints=organization-service"
-      - "traefik.http.routers.organization-service.rule=PathPrefix(`/`)"
+      - "traefik.http.routers.organization-service.entrypoints=web"
+      - "traefik.http.routers.organization-service.rule=PathPrefix(`/api/v1/organization`)"
+      - "traefik.http.middlewares.organization-stripprefix.stripprefix.prefixes=/api/v1/organization"
+      - "traefik.http.routers.organization-service.middlewares=organization-stripprefix"
       - "traefik.http.services.organization-service.loadbalancer.server.port=8080"
     networks:
       - proxy
@@ -51,8 +55,10 @@ services:
       - SPRING_JPA_HIBERNATE_DDL_AUTO=update
     labels:
       - "traefik.enable=true"
-      - "traefik.http.routers.member-service.entrypoints=member-service"
-      - "traefik.http.routers.member-service.rule=PathPrefix(`/`)"
+      - "traefik.http.routers.member-service.entrypoints=web"
+      - "traefik.http.routers.member-service.rule=PathPrefix(`/api/v1/members`)"
+      - "traefik.http.middlewares.member-stripprefix.stripprefix.prefixes=/api/v1/members"
+      - "traefik.http.routers.member-service.middlewares=member-stripprefix"
       - "traefik.http.services.member-service.loadbalancer.server.port=8080"
     networks:
       - proxy
@@ -73,8 +79,10 @@ services:
       - SPRING_JPA_HIBERNATE_DDL_AUTO=update
     labels:
       - "traefik.enable=true"
-      - "traefik.http.routers.event-service.entrypoints=event-service"
-      - "traefik.http.routers.event-service.rule=PathPrefix(`/`)"
+      - "traefik.http.routers.event-service.entrypoints=web"
+      - "traefik.http.routers.event-service.rule=PathPrefix(`/api/v1/events`)"
+      - "traefik.http.middlewares.event-stripprefix.stripprefix.prefixes=/api/v1/events"
+      - "traefik.http.routers.event-service.middlewares=event-stripprefix"
       - "traefik.http.services.event-service.loadbalancer.server.port=8080"
     networks:
       - proxy
@@ -95,8 +103,10 @@ services:
       - SPRING_JPA_HIBERNATE_DDL_AUTO=update
     labels:
       - "traefik.enable=true"
-      - "traefik.http.routers.feedback-service.entrypoints=feedback-service"
-      - "traefik.http.routers.feedback-service.rule=PathPrefix(`/`)"
+      - "traefik.http.routers.feedback-service.entrypoints=web"
+      - "traefik.http.routers.feedback-service.rule=PathPrefix(`/api/v1/feedback`)"
+      - "traefik.http.middlewares.feedback-stripprefix.stripprefix.prefixes=/api/v1/feedback"
+      - "traefik.http.routers.feedback-service.middlewares=feedback-stripprefix"
       - "traefik.http.services.feedback-service.loadbalancer.server.port=8080"
     networks:
       - proxy
@@ -117,8 +127,10 @@ services:
       - SPRING_JPA_HIBERNATE_DDL_AUTO=update
     labels:
       - "traefik.enable=true"
-      - "traefik.http.routers.finance-service.entrypoints=finance-service"
-      - "traefik.http.routers.finance-service.rule=PathPrefix(`/`)"
+      - "traefik.http.routers.finance-service.entrypoints=web"
+      - "traefik.http.routers.finance-service.rule=PathPrefix(`/api/v1/finances`)"
+      - "traefik.http.middlewares.finance-stripprefix.stripprefix.prefixes=/api/v1/finances"
+      - "traefik.http.routers.finance-service.middlewares=finance-stripprefix"
       - "traefik.http.services.finance-service.loadbalancer.server.port=8080"
     networks:
       - proxy
@@ -139,8 +151,10 @@ services:
       - SPRING_JPA_HIBERNATE_DDL_AUTO=update
     labels:
       - "traefik.enable=true"
-      - "traefik.http.routers.letter-service.entrypoints=letter-service"
-      - "traefik.http.routers.letter-service.rule=PathPrefix(`/`)"
+      - "traefik.http.routers.letter-service.entrypoints=web"
+      - "traefik.http.routers.letter-service.rule=PathPrefix(`/api/v1/letters`)"
+      - "traefik.http.middlewares.letter-stripprefix.stripprefix.prefixes=/api/v1/letters"
+      - "traefik.http.routers.letter-service.middlewares=letter-stripprefix"
       - "traefik.http.services.letter-service.loadbalancer.server.port=8080"
     networks:
       - proxy
@@ -161,7 +175,7 @@ services:
       - py-genai-helper
     labels:
       - "traefik.enable=true"
-      - "traefik.http.routers.web-client.entrypoints=web-client"
+      - "traefik.http.routers.web-client.entrypoints=web"
       - "traefik.http.routers.web-client.rule=PathPrefix(`/`)"
       - "traefik.http.services.web-client.loadbalancer.server.port=8080"
     networks:
@@ -175,23 +189,9 @@ services:
       - "--providers.docker=true"
       - "--providers.docker.exposedByDefault=false"
       - "--providers.docker.network=proxy"
-      - "--entrypoints.py-genai-helper.address=:5000"
-      - "--entrypoints.organization-service.address=:8001"
-      - "--entrypoints.member-service.address=:8002"
-      - "--entrypoints.event-service.address=:8003"
-      - "--entrypoints.feedback-service.address=:8004"
-      - "--entrypoints.finance-service.address=:8005"
-      - "--entrypoints.letter-service.address=:8006"
-      - "--entrypoints.web-client.address=:3000"
+      - "--entrypoints.web.address=:80"
     ports:
-      - "3000:3000"
-      - "5000:5000"
-      - "8001:8001"
-      - "8002:8002"
-      - "8003:8003"
-      - "8004:8004"
-      - "8005:8005"
-      - "8006:8006"
+      - "80:80"
       - "8080:8080"
     volumes:
       - /var/run/docker.sock:/var/run/docker.sock:ro

web-client/src/app/router/AppRouter.tsx

@@ -1,8 +1,10 @@
 import { NavLink, Navigate, Route, Routes } from 'react-router-dom'
 import { useEffect, useState } from 'react'
 import { getEventsHello } from '@/features/events/api'
+import { getFeedbackHello } from '@/features/feedback/api'
 import { getLettersHello } from '@/features/letters/api'
 import { getMembersHello } from '@/features/members/api'
+import { getOrganizationHello } from '@/features/organization/api'
 import { getPaymentsHello } from '@/features/payments/api'
 
 type ServicePlaceholderPageProps = {
@@ -70,6 +72,8 @@ export function AppRouter() {
             <NavLink to="/events" className={navLinkClass}>Events</NavLink>
             <NavLink to="/payments" className={navLinkClass}>Payments</NavLink>
             <NavLink to="/letters" className={navLinkClass}>Letters</NavLink>
+            <NavLink to="/organization" className={navLinkClass}>Organization</NavLink>
+            <NavLink to="/feedback" className={navLinkClass}>Feedback</NavLink>
           </nav>
         </div>
       </header>
@@ -93,6 +97,14 @@ export function AppRouter() {
             path="/letters"
             element={<ServicePlaceholderPage title="Letter Service" loadMessage={getLettersHello} />}
           />
+          <Route
+            path="/organization"
+            element={<ServicePlaceholderPage title="Organization Service" loadMessage={getOrganizationHello} />}
+          />
+          <Route
+            path="/feedback"
+            element={<ServicePlaceholderPage title="Feedback Service" loadMessage={getFeedbackHello} />}
+          />
         </Routes>
       </main>
     </div>

web-client/src/features/events/api.ts

@@ -1,14 +1,6 @@
-import type { HelloResponse } from '@/features/events/types'
-
-function mockEventsHello(): Promise<HelloResponse> {
-  return Promise.resolve({
-    service: 'event-service',
-    message: 'Hello from event-service (mock placeholder)',
-  })
-}
+import { eventsClient } from '@/features/events/client'
 
 export async function getEventsHello(): Promise<string> {
-  // TODO: Replace mock with real endpoint when backend is available.
-  const data = await mockEventsHello()
-  return `${data.service}: ${data.message}`
+  const res = await eventsClient.get<string>('/hello')
+  return res.data
 }

web-client/src/features/events/client.ts

@@ -0,0 +1,5 @@
+import axios from 'axios'
+
+export const eventsClient = axios.create({
+  baseURL: '/api/v1/events',
+})

web-client/src/features/feedback/api.ts

@@ -0,0 +1,6 @@
+import { feedbackClient } from '@/features/feedback/client'
+
+export async function getFeedbackHello(): Promise<string> {
+  const res = await feedbackClient.get<string>('/hello')
+  return res.data
+}

web-client/src/features/feedback/client.ts

@@ -0,0 +1,5 @@
+import axios from 'axios'
+
+export const feedbackClient = axios.create({
+  baseURL: '/api/v1/feedback',
+})

web-client/src/features/letters/api.ts

@@ -1,14 +1,6 @@
-import type { HelloResponse } from '@/features/letters/types'
-
-function mockLettersHello(): Promise<HelloResponse> {
-  return Promise.resolve({
-    service: 'letter-service',
-    message: 'Hello from letter-service (mock placeholder)',
-  })
-}
+import { lettersClient } from '@/features/letters/client'
 
 export async function getLettersHello(): Promise<string> {
-  // TODO: Replace mock with real endpoint when backend is available.
-  const data = await mockLettersHello()
-  return `${data.service}: ${data.message}`
+  const res = await lettersClient.get<string>('/hello')
+  return res.data
 }

web-client/src/features/letters/client.ts

@@ -0,0 +1,5 @@
+import axios from 'axios'
+
+export const lettersClient = axios.create({
+  baseURL: '/api/v1/letters',
+})

web-client/src/features/members/api.ts

@@ -1,14 +1,6 @@
-import type { HelloResponse } from '@/features/members/types'
-
-function mockMembersHello(): Promise<HelloResponse> {
-  return Promise.resolve({
-    service: 'member-service',
-    message: 'Hello from member-service (mock placeholder)',
-  })
-}
+import { membersClient } from '@/features/members/client'
 
 export async function getMembersHello(): Promise<string> {
-  // TODO: Replace mock with real endpoint when backend is available.
-  const data = await mockMembersHello()
-  return `${data.service}: ${data.message}`
+  const res = await membersClient.get<string>('/hello')
+  return res.data
 }

web-client/src/features/members/client.ts

@@ -0,0 +1,5 @@
+import axios from 'axios'
+
+export const membersClient = axios.create({
+  baseURL: '/api/v1/members',
+})

web-client/src/features/organization/api.ts

@@ -0,0 +1,6 @@
+import { organizationClient } from '@/features/organization/client'
+
+export async function getOrganizationHello(): Promise<string> {
+  const res = await organizationClient.get<string>('/hello')
+  return res.data
+}

web-client/src/features/organization/client.ts

@@ -0,0 +1,5 @@
+import axios from 'axios'
+
+export const organizationClient = axios.create({
+  baseURL: '/api/v1/organization',
+})

web-client/src/features/payments/api.ts

@@ -1,14 +1,6 @@
-import type { HelloResponse } from '@/features/payments/types'
-
-function mockPaymentsHello(): Promise<HelloResponse> {
-  return Promise.resolve({
-    service: 'payment-service',
-    message: 'Hello from payment-service (mock placeholder)',
-  })
-}
+import { paymentsClient } from '@/features/payments/client'
 
 export async function getPaymentsHello(): Promise<string> {
-  // TODO: Replace mock with real endpoint when backend is available.
-  const data = await mockPaymentsHello()
-  return `${data.service}: ${data.message}`
+  const res = await paymentsClient.get<string>('/hello')
+  return res.data
 }

web-client/src/features/payments/client.ts

@@ -0,0 +1,5 @@
+import axios from 'axios'
+
+export const paymentsClient = axios.create({
+  baseURL: '/api/v1/finances',
+})