Fix webservice wrong URL

README.md

@@ -9,7 +9,7 @@ This repository hosts the frontend service implementation of the Playground.
 To start the playground using Docker, run:
 
 ```bash
-docker-compose up
+docker-compose upg
 ```
 
 ## Prerequisites
@@ -68,13 +68,13 @@ services:
   backend:
     build:
       context: .
-      dockerfile: Dockerfile_Backend
+      dockerfile: PlaygroundMonoDockerfile
     ports:
       - '8080:8080'
     depends_on:
       - dicedb
     environment:
-      - DICE_ADDR=dicedb:7379
+      - DICEDB_ADDR=dicedb:7379
 ```
 
 2. Run the following command to start the backend server and DiceDB:
@@ -123,15 +123,17 @@ To generate a static production build of your Next.js application, follow these
    Ensure that you have the following line in your `next.config.mjs` file:
 
    ```javascript
-   output: 'export'
+   output: 'export';
    ```
+
 2. **Build the Project:**
 
    Run the following command in your terminal:
 
    ```bash
    npm run build
    ```
+
 3. **Testing static build locally:**
    ```bash
    npx serve@latest out
@@ -188,6 +190,6 @@ Contributors can join the [Discord Server](https://discord.gg/6r8uXWtXh7) for qu
 
 ## Contributors
 
-<a href = "https://github.com/dicedb/dice/graphs/contributors">
-  <img src = "https://contrib.rocks/image?repo=dicedb/dice"/>
+<a href = "https://github.com/dicedb/playground-web/graphs/contributors">
+  <img src = "https://contrib.rocks/image?repo=dicedb/playground-web"/>
 </a>

package.json

@@ -44,6 +44,7 @@
     "postcss": "^8",
     "prettier": "^3.3.3",
     "tailwindcss": "^3.4.1",
+    "ts-jest": "^29.2.5",
     "ts-node": "^10.9.2",
     "typescript": "^5"
   },

src/lib/__tests__/api.test.ts

@@ -0,0 +1,93 @@
+import { executeShellCommandOnServer } from '../api';
+import { WebService } from '@/services/webServices';
+
+// Mock WebService
+jest.mock('@/services/webServices', () => ({
+  WebService: {
+    post: jest.fn(),
+  },
+}));
+
+describe('executeShellCommandOnServer', () => {
+  const mockCmd = 'testCommand';
+  const mockCmdOptions = { option1: 'value1' };
+  const mockCmdExecURL = `/shell/exec/${mockCmd}`;
+  let consoleErrorSpy: jest.SpyInstance;
+
+  beforeEach(() => {
+    consoleErrorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+  });
+
+  afterEach(() => {
+    consoleErrorSpy.mockRestore();
+    jest.clearAllMocks();
+  });
+
+  it('should return data when WebService.post is successful', async () => {
+    const mockResponse = { data: 'Success Response' };
+    (WebService.post as jest.Mock).mockResolvedValueOnce(mockResponse);
+
+    const result = await executeShellCommandOnServer(mockCmd, mockCmdOptions);
+
+    expect(WebService.post).toHaveBeenCalledWith(
+      mockCmdExecURL,
+      mockCmdOptions,
+    );
+    expect(result).toEqual('Success Response');
+  });
+
+  it('should return error message when response structure is unexpected', async () => {
+    const mockResponse = {}; // Simulate unexpected response structure
+    (WebService.post as jest.Mock).mockResolvedValueOnce(mockResponse);
+
+    const result = await executeShellCommandOnServer(mockCmd, mockCmdOptions);
+
+    expect(result).toBe('Error: Error: Unexpected response structure');
+    expect(WebService.post).toHaveBeenCalledWith(
+      mockCmdExecURL,
+      mockCmdOptions,
+    );
+  });
+
+  it('should return error message when WebService.post throws an error', async () => {
+    const mockError = new Error('Network Error');
+
+    (WebService.post as jest.Mock).mockRejectedValueOnce(mockError);
+    const result = await executeShellCommandOnServer(mockCmd, mockCmdOptions);
+    expect(WebService.post).toHaveBeenCalledWith(
+      mockCmdExecURL,
+      mockCmdOptions,
+    );
+    expect(result).toBe(`Error: ${mockError}`);
+    consoleErrorSpy.mockRestore();
+  });
+
+  it('should log error to the console when WebService.post throws an error', async () => {
+    const mockError = new Error('Request Failed');
+    const consoleSpy = jest
+      .spyOn(console, 'error')
+      .mockImplementation(() => {});
+    (WebService.post as jest.Mock).mockRejectedValueOnce(mockError);
+
+    await executeShellCommandOnServer(mockCmd, mockCmdOptions);
+
+    expect(consoleSpy).toHaveBeenCalledWith(
+      'Error executing command:',
+      mockError,
+    );
+    consoleSpy.mockRestore();
+  });
+
+  it('should always include the cmd parameter in the URL', async () => {
+    const mockResponse = { data: 'Some Response' };
+    (WebService.post as jest.Mock).mockResolvedValueOnce(mockResponse);
+
+    const result = await executeShellCommandOnServer(mockCmd, mockCmdOptions);
+
+    expect(WebService.post).toHaveBeenCalledWith(
+      expect.stringContaining(`/shell/exec/${mockCmd}`),
+      mockCmdOptions,
+    );
+    expect(result).toEqual('Some Response');
+  });
+});

src/lib/api.ts

@@ -5,8 +5,10 @@ export const executeShellCommandOnServer = async (
   cmd: string,
   cmdOptions: object,
 ) => {
+  const cmdExecURL = `/shell/exec/${cmd}`;
+
   try {
-    const response = await WebService.post(`/shell/exec`, cmdOptions);
+    const response = await WebService.post(cmdExecURL, cmdOptions);
     if (response?.data) {
       return response.data;
     } else {

src/services/webServices.ts

@@ -2,7 +2,7 @@ let PLAYGROUND_MONO_URL = process.env.NEXT_PUBLIC_PLAYGROUND_MONO_URL;
 
 if (!PLAYGROUND_MONO_URL) {
   console.warn(
-    'Warning: NEXT_PUBLIC_BACKEND_URL is not defined. Defaulting to http://localhost:3000',
+    'Warning: NEXT_PUBLIC_PLAYGROUND_MONO_URL is not defined. Defaulting to http://localhost:8080',
   );
   PLAYGROUND_MONO_URL = 'http://localhost:8080';
 }
@@ -41,10 +41,16 @@ export const WebService = {
 
     try {
       const response = await fetch(`${PLAYGROUND_MONO_URL}${url}`, options);
+      if (!response) {
+        throw new Error('No response received from the server.');
+      }
+
       if (!response.ok) {
         throw new Error(`HTTP error! Status: ${response.status}`);
       }
+
       const result = await response.json();
+
       return result;
     } catch (error) {
       if (error instanceof Error)