fix: delay clearing modal content until fade-out on public board (#151)

* fix: closing the modal on the public board page clears the content before the modal fade out animation finishes

* refactor: enhance CheckboxDropdown component to handle empty states and improve item rendering

* Update apps/web/src/views/public/board/CardModal.tsx

Co-authored-by: Henry <30578846+hjball@users.noreply.github.com>

---------

Co-authored-by: Henry <30578846+hjball@users.noreply.github.com>

apps/web/src/components/CheckboxDropdown.tsx

@@ -55,7 +55,8 @@ export default function CheckboxDropdown({
 
   const renderMenuItems = (items: Item[], groupKey: string | null) => (
     <>
-      {items.map((item) => (
+      {items.length > 0 ? (
+        items.map((item) => (
           <Menu.Item key={item.key}>
             <div
               className="group flex items-center rounded-[5px] p-2 hover:bg-light-200 dark:hover:bg-dark-300"
@@ -99,7 +100,14 @@ export default function CheckboxDropdown({
               )}
             </div>
           </Menu.Item>
-      ))}
+        ))
+      ) : (
+        !handleCreate && (
+          <div className="flex items-center p-2 text-[12px] text-dark-900">
+            No items
+          </div>
+        )
+      )}
       {handleCreate && (
         <button
           type="button"

apps/web/src/views/public/board/CardModal.tsx

@@ -69,6 +69,8 @@ export function CardModal({
                 onClick={async (e) => {
                   e.preventDefault();
                   closeModal();
+
+                  setTimeout(async () => {
                     try {
                       await router.replace(
                         `/${workspaceSlug}/${boardSlug}`,
@@ -80,6 +82,7 @@ export function CardModal({
                     } catch (error) {
                       console.error(error);
                     }
+                  }, 400);
                 }}
               >
                 <HiXMark