From cc4a09914cfbe7b9e415516226013ce1ffba8e7e Mon Sep 17 00:00:00 2001
From: Henry <henry_ball@hotmail.co.uk>
Date: Wed, 9 Jul 2025 21:24:53 +0100
Subject: [PATCH] feat: add loading state to update board slug button

---
 .../views/board/components/UpdateBoardSlugButton.tsx   | 10 ++++++++++
 apps/web/src/views/board/index.tsx                     |  1 +
 2 files changed, 11 insertions(+)

diff --git a/apps/web/src/views/board/components/UpdateBoardSlugButton.tsx b/apps/web/src/views/board/components/UpdateBoardSlugButton.tsx
index 2cb5154f..799cb464 100644
--- a/apps/web/src/views/board/components/UpdateBoardSlugButton.tsx
+++ b/apps/web/src/views/board/components/UpdateBoardSlugButton.tsx
@@ -6,11 +6,21 @@ const UpdateBoardSlugButton = ({
   handleOnClick,
   workspaceSlug,
   boardSlug,
+  isLoading,
 }: {
   handleOnClick: () => void;
   workspaceSlug: string;
   boardSlug: string;
+  isLoading: boolean;
 }) => {
+  if (!isLoading && (!workspaceSlug || !boardSlug)) return <></>;
+
+  if (isLoading) {
+    return (
+      <div className="hidden h-[36px] w-[225px] animate-pulse rounded-full bg-light-200 dark:bg-dark-100 xl:flex" />
+    );
+  }
+
   return (
     <button
       onClick={handleOnClick}
diff --git a/apps/web/src/views/board/index.tsx b/apps/web/src/views/board/index.tsx
index aa550885..eb881486 100644
--- a/apps/web/src/views/board/index.tsx
+++ b/apps/web/src/views/board/index.tsx
@@ -270,6 +270,7 @@ export default function BoardPage() {
           <div className="order-1 mb-4 flex items-center justify-end space-x-2 md:order-2 md:mb-0">
             <UpdateBoardSlugButton
               handleOnClick={() => openModal("UPDATE_BOARD_SLUG")}
+              isLoading={isLoading}
               workspaceSlug={workspace.slug ?? ""}
               boardSlug={boardData?.slug ?? ""}
             />