♻️(frontend) add api versionning per request

We were using the version of the api from the
.env file, but we could have different versions
of the api in the same app. So we now use the
version from the request.

src/frontend/apps/impress/.env.development

@@ -1,3 +1,2 @@
 NEXT_PUBLIC_API_ORIGIN=http://localhost:8071
-NEXT_PUBLIC_API_URL=/api/v1.0/
 NEXT_PUBLIC_SIGNALING_URL=ws://localhost:4444

src/frontend/apps/impress/.env.production

@@ -1 +0,0 @@
-NEXT_PUBLIC_API_URL=/api/v1.0/

src/frontend/apps/impress/.env.test

@@ -1,2 +1 @@
 NEXT_PUBLIC_API_ORIGIN=http://test.jest
-NEXT_PUBLIC_API_URL=/api/

src/frontend/apps/impress/src/api/__tests__/fetchApi.test.tsx

@@ -9,15 +9,15 @@ describe('fetchAPI', () => {
   });
 
   it('adds correctly the basename', () => {
-    fetchMock.mock('http://test.jest/api/some/url', 200);
+    fetchMock.mock('http://test.jest/api/v1.0/some/url', 200);
 
     void fetchAPI('some/url');
 
-    expect(fetchMock.lastUrl()).toEqual('http://test.jest/api/some/url');
+    expect(fetchMock.lastUrl()).toEqual('http://test.jest/api/v1.0/some/url');
   });
 
   it('adds the credentials automatically', () => {
-    fetchMock.mock('http://test.jest/api/some/url', 200);
+    fetchMock.mock('http://test.jest/api/v1.0/some/url', 200);
 
     void fetchAPI('some/url', { body: 'some body' });
 
@@ -36,10 +36,18 @@ describe('fetchAPI', () => {
       .spyOn(useAuthStore.getState(), 'logout')
       .mockImplementation(logoutMock);
 
-    fetchMock.mock('http://test.jest/api/some/url', 401);
+    fetchMock.mock('http://test.jest/api/v1.0/some/url', 401);
 
     await fetchAPI('some/url');
 
     expect(logoutMock).toHaveBeenCalled();
   });
+
+  it('check the versionning', () => {
+    fetchMock.mock('http://test.jest/api/v2.0/some/url', 200);
+
+    void fetchAPI('some/url', {}, '2.0');
+
+    expect(fetchMock.lastUrl()).toEqual('http://test.jest/api/v2.0/some/url');
+  });
 });

src/frontend/apps/impress/src/api/fetchApi.ts

@@ -13,9 +13,12 @@ function getCSRFToken() {
     .pop();
 }
 
-export const fetchAPI = async (input: string, init?: RequestInit) => {
-  const apiUrl = `${baseApiUrl()}${input}`;
-
+export const fetchAPI = async (
+  input: string,
+  init?: RequestInit,
+  apiVersion = '1.0',
+) => {
+  const apiUrl = `${baseApiUrl(apiVersion)}${input}`;
   const csrfToken = getCSRFToken();
 
   const response = await fetch(apiUrl, {

src/frontend/apps/impress/src/core/conf.ts

@@ -1,9 +1,9 @@
-export const baseApiUrl = () => {
+export const baseApiUrl = (apiVersion: string = '1.0') => {
   const origin =
     process.env.NEXT_PUBLIC_API_ORIGIN ||
     (typeof window !== 'undefined' ? window.location.origin : '');
 
-  return `${origin}${process.env.NEXT_PUBLIC_API_URL}`;
+  return `${origin}/api/v${apiVersion}/`;
 };
 
 export const signalingUrl = (padId: string) => {

src/frontend/apps/impress/src/custom-next.d.ts

@@ -20,7 +20,6 @@ declare module '*.svg?url' {
 namespace NodeJS {
   interface ProcessEnv {
     NEXT_PUBLIC_API_ORIGIN?: string;
-    NEXT_PUBLIC_API_URL?: string;
     NEXT_PUBLIC_SIGNALING_URL?: string;
   }
 }

src/frontend/apps/impress/src/features/pads/pads-panel/__tests__/PanelPads.test.tsx

@@ -23,7 +23,7 @@ describe('PanelPads', () => {
   });
 
   it('renders with no pad to display', async () => {
-    fetchMock.mock(`end:/api/documents/?page=1&ordering=-created_at`, {
+    fetchMock.mock(`end:/documents/?page=1&ordering=-created_at`, {
       count: 0,
       results: [],
     });
@@ -40,7 +40,7 @@ describe('PanelPads', () => {
   });
 
   it('renders an empty pad', async () => {
-    fetchMock.mock(`end:/api/documents/?page=1&ordering=-created_at`, {
+    fetchMock.mock(`end:/documents/?page=1&ordering=-created_at`, {
       count: 1,
       results: [
         {
@@ -59,7 +59,7 @@ describe('PanelPads', () => {
   });
 
   it('renders a pad with only 1 member', async () => {
-    fetchMock.mock(`end:/api/documents/?page=1&ordering=-created_at`, {
+    fetchMock.mock(`end:/documents/?page=1&ordering=-created_at`, {
       count: 1,
       results: [
         {
@@ -83,7 +83,7 @@ describe('PanelPads', () => {
   });
 
   it('renders a non-empty pad', async () => {
-    fetchMock.mock(`end:/api/documents/?page=1&ordering=-created_at`, {
+    fetchMock.mock(`end:/documents/?page=1&ordering=-created_at`, {
       count: 1,
       results: [
         {
@@ -111,7 +111,7 @@ describe('PanelPads', () => {
   });
 
   it('renders the error', async () => {
-    fetchMock.mock(`end:/api/documents/?page=1&ordering=-created_at`, {
+    fetchMock.mock(`end:/documents/?page=1&ordering=-created_at`, {
       status: 500,
     });
 
@@ -127,7 +127,7 @@ describe('PanelPads', () => {
   });
 
   it('renders with doc panel open', async () => {
-    fetchMock.mock(`end:/api/documents/?page=1&ordering=-created_at`, {
+    fetchMock.mock(`end:/documents/?page=1&ordering=-created_at`, {
       count: 1,
       results: [],
     });
@@ -142,7 +142,7 @@ describe('PanelPads', () => {
   });
 
   it('closes and opens the doc panel', async () => {
-    fetchMock.mock(`end:/api/documents/?page=1&ordering=-created_at`, {
+    fetchMock.mock(`end:/documents/?page=1&ordering=-created_at`, {
       count: 1,
       results: [],
     });

src/helm/env.d/dev/values.impress.yaml.gotmpl

@@ -72,7 +72,6 @@ frontend:
   envVars:
     PORT: 8080
     NEXT_PUBLIC_API_ORIGIN: https://impress.127.0.0.1.nip.io
-    NEXT_PUBLIC_API_URL: /api/v1.0/
     NEXT_PUBLIC_SIGNALING_URL: wss://impress.127.0.0.1.nip.io/ws
 
   replicas: 1