From 545432b4f19664c45aa7fe9b2123d96bfaacf9e1 Mon Sep 17 00:00:00 2001
From: nyne <me@nyne.dev>
Date: Tue, 13 May 2025 12:51:15 +0800
Subject: [PATCH] Show available space of storages.

---
 frontend/src/pages/manage_storage_page.tsx   | 4 ++++
 frontend/src/pages/resource_details_page.tsx | 2 +-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/frontend/src/pages/manage_storage_page.tsx b/frontend/src/pages/manage_storage_page.tsx
index c9668eb..002d798 100644
--- a/frontend/src/pages/manage_storage_page.tsx
+++ b/frontend/src/pages/manage_storage_page.tsx
@@ -79,6 +79,7 @@ export default function StorageView() {
         <tr>
           <td>{t("Name")}</td>
           <td>{t("Created At")}</td>
+          <td>{t("Size")}</td>
           <td>{t("Action")}</td>
         </tr>
         </thead>
@@ -92,6 +93,9 @@ export default function StorageView() {
               <td>
                 {(new Date(s.createdAt)).toLocaleString()}
               </td>
+              <td>
+                {(s.currentSize/1024/1024).toFixed(2)} / {s.maxSize/1024/1024} MB
+              </td>
               <td>
                 <button className={"btn btn-square"} type={"button"} onClick={() => {
                   const dialog = document.getElementById(`confirm_delete_dialog_${s.id}`) as HTMLDialogElement;
diff --git a/frontend/src/pages/resource_details_page.tsx b/frontend/src/pages/resource_details_page.tsx
index a2eada4..a8e307c 100644
--- a/frontend/src/pages/resource_details_page.tsx
+++ b/frontend/src/pages/resource_details_page.tsx
@@ -336,7 +336,7 @@ function CreateFileDialog({resourceId}: { resourceId: number }) {
               <option value={""} disabled>{t("Select Storage")}</option>
               {
                 storages.current?.map((s) => {
-                  return <option key={s.id} value={s.id}>{s.name}</option>
+                  return <option key={s.id} value={s.id}>{s.name}({(s.currentSize/1024/1024).toFixed(2)}/{s.maxSize/1024/1024}MB)</option>
                 })
               }
             </select>