Issue/241

pkgs/frontend/app/routes/$treeId_.splits.new.tsx

@@ -221,7 +221,7 @@ const SplitterNew: FC = () => {
   const availableName = useMemo(() => {
     if (!splitterName) return false;
 
-    return addresses?.[0]?.length === 0;
+    return addresses[0].length === 0;
   }, [splitterName, addresses]);
 
   const { createSplits, previewSplits, isLoading } = useSplitsCreator(

pkgs/frontend/app/routes/api.namestone.$action.tsx

@@ -52,6 +52,19 @@ export const action: ActionFunction = async ({ request, params }) => {
     switch (action) {
       case "set-name": {
         const { name, address, text_records } = await request.json();
+
+        // Check if name is already taken
+        const existingNames = await ns.searchNames({
+          domain,
+          name,
+          exact_match: true,
+        });
+
+        // If name exists and is owned by a different address, throw error
+        if (existingNames.length > 0) {
+          throw data({ message: "Name is already taken" }, 409);
+        }
+
         await ns.setName({ domain, name, address, text_records });
         return { message: "OK" };
       }

pkgs/frontend/app/routes/login.tsx

@@ -43,7 +43,7 @@ const Login: FC = () => {
   }, [wallet, navigate, fetchNames]);
 
   return (
-    <Grid gridTemplateRows="1fr auto" h="100vh">
+    <Grid gridTemplateRows="1fr auto" h="calc(100vh - 72px)">
       <Flex justifyContent="center" alignItems="center" flexWrap="wrap">
         <Box>
           <Box width="160px">

pkgs/frontend/app/routes/signup.tsx

@@ -3,7 +3,7 @@ import { useAddressesByNames, useSetName } from "hooks/useENS";
 import { useUploadImageFileToIpfs } from "hooks/useIpfs";
 import { useActiveWallet } from "hooks/useWallet";
 import type { TextRecords } from "namestone-sdk";
-import { type FC, useMemo, useState } from "react";
+import { type FC, useCallback, useMemo, useState } from "react";
 import { BasicButton } from "~/components/BasicButton";
 import { CommonInput } from "~/components/common/CommonInput";
 import { UserIcon } from "~/components/icon/UserIcon";
@@ -30,34 +30,45 @@ const Login: FC = () => {
   const availableName = useMemo(() => {
     if (!userName) return false;
 
-    return addresses?.[0]?.length === 0;
+    return addresses[0].length === 0;
   }, [userName, addresses]);
 
-  const handleSubmit = async () => {
+  const handleSubmit = useCallback(async () => {
     if (!wallet || !availableName) return;
 
-    const params: {
-      name: string;
-      address: string;
-      text_records: TextRecords;
-    } = {
-      name: userName,
-      address: wallet.account?.address,
-      text_records: {},
-    };
+    try {
+      const params: {
+        name: string;
+        address: string;
+        text_records: TextRecords;
+      } = {
+        name: userName,
+        address: wallet.account?.address,
+        text_records: {},
+      };
 
-    if (imageFile) {
-      const res = await uploadImageFileToIpfs();
-      if (res) params.text_records.avatar = res.ipfsUri;
-    }
-
-    await setName(params);
+      if (imageFile) {
+        const res = await uploadImageFileToIpfs();
+        if (res) params.text_records.avatar = res.ipfsUri;
+      }
 
-    window.location.href = "/workspace";
-  };
+      await setName(params);
+    } catch (error) {
+      console.error(error);
+    } finally {
+      window.location.href = "/workspace";
+    }
+  }, [
+    availableName,
+    imageFile,
+    setName,
+    uploadImageFileToIpfs,
+    userName,
+    wallet,
+  ]);
 
   return (
-    <Grid gridTemplateRows="1fr auto" h="100vh">
+    <Grid gridTemplateRows="1fr auto" h="calc(100vh - 72px)">
       <Flex justifyContent="center" alignItems="center" flexWrap="wrap">
         <Box w="100%">
           <Flex