Add requesting for retrieving virtual labs of user

src/components/ApplicationSidebar/index.tsx

@@ -12,7 +12,6 @@ import Icon, {
 } from '@ant-design/icons';
 import { signOut, useSession } from 'next-auth/react';
 
-import VirtualLabsList from './VirtualLabsList';
 import { basePath } from '@/config';
 import { classNames } from '@/util/utils';
 import useOnClickOutside from '@/hooks/useOnClickOutside';
@@ -177,10 +176,6 @@ export function DefaultAccountPanel({ expanded }: { expanded: boolean }) {
         </div>
       </div>
 
-      <div className="h-px w-full bg-primary-7" />
-      <VirtualLabsList />
-      <div className="h-px w-full bg-primary-7" />
-
       <Link
         href="/virtual-lab/create/information"
         className="inline-flex w-full items-center justify-between p-5"

src/services/virtual-lab/labs/index.ts

@@ -1,5 +1,10 @@
 import { virtualLabApi } from '@/config';
-import { VirtualLabAPIListResponse, VirtualLabAPIResponse } from '@/types/virtual-lab/lab';
+import {
+  Project,
+  VirtualLab,
+  VirtualLabAPIListResponse,
+  VirtualLabAPIResponse,
+} from '@/types/virtual-lab/lab';
 
 const accessToken = 'Bearer ';
 
@@ -14,7 +19,20 @@ export async function getVirtualLabDetail(id: string): Promise<VirtualLabAPIResp
   return response.json();
 }
 
-export async function getVirtualLabProjects(id: string): Promise<VirtualLabAPIListResponse> {
+export async function getVirtualLabsOfUser(): Promise<VirtualLabAPIListResponse<VirtualLab>> {
+  const response = await fetch(`${virtualLabApi.url}/virtual-labs`, {
+    method: 'GET',
+    headers: { Authorization: accessToken, accept: 'application/json' },
+  });
+  if (!response.ok) {
+    throw new Error(`Status: ${response.status}`);
+  }
+  return response.json();
+}
+
+export async function getVirtualLabProjects(
+  id: string
+): Promise<VirtualLabAPIListResponse<Project>> {
   const response = await fetch(`${virtualLabApi.url}/virtual-labs/${id}/projects`, {
     method: 'GET',
     headers: { Authorization: accessToken, accept: 'application/json' },

src/state/virtual-lab/lab.ts

@@ -1,8 +1,12 @@
 import { atom } from 'jotai';
 import { atomFamily } from 'jotai/utils';
 
-import { getVirtualLabDetail, getVirtualLabProjects } from '@/services/virtual-lab/labs';
-import { VirtualLab, VirtualLabAPIListData } from '@/types/virtual-lab/lab';
+import {
+  getVirtualLabDetail,
+  getVirtualLabProjects,
+  getVirtualLabsOfUser,
+} from '@/services/virtual-lab/labs';
+import { Project, VirtualLab, VirtualLabAPIListData } from '@/types/virtual-lab/lab';
 
 export const virtualLabDetailAtomFamily = atomFamily((virtualLabId: string) =>
   atom<Promise<VirtualLab>>(async () => {
@@ -12,10 +16,17 @@ export const virtualLabDetailAtomFamily = atomFamily((virtualLabId: string) =>
 );
 
 export const virtualLabProjectsAtomFamily = atomFamily((virtualLabId: string) =>
-  atom<Promise<VirtualLabAPIListData>>(async () => {
+  atom<Promise<VirtualLabAPIListData<Project>>>(async () => {
     const response = await getVirtualLabProjects(virtualLabId);
     return response.data;
   })
 );
 
+export const virtualLabOfUserAtom = atom<Promise<VirtualLabAPIListData<VirtualLab>>>(
+  async () => {
+    const response = await getVirtualLabsOfUser();
+    return response.data;
+  }
+);
+
 export const currentVirtualLabIdAtom = atom<string | null>(null);

src/types/virtual-lab/lab.ts

@@ -5,13 +5,13 @@ export type VirtualLabAPIResponse = {
   };
 };
 
-export type VirtualLabAPIListResponse = {
+export type VirtualLabAPIListResponse<ResponseType> = {
   message: string;
-  data: VirtualLabAPIListData;
+  data: VirtualLabAPIListData<ResponseType>;
 };
 
-export type VirtualLabAPIListData = {
-  results: Project[];
+export type VirtualLabAPIListData<ReponseType> = {
+  results: ReponseType[];
   page: number;
   size: number;
   page_size: number;