feat(nest): add create nest popover

proto/api/v1/nest_service.proto

@@ -16,7 +16,7 @@ service NestService {
   rpc CreateNest(CreateNestRequest) returns (Nest) {
     option (google.api.http) = {
       post: "/api/v1/nests"
-      body: "nest"
+      body: "uid"
     };
   }
   // ListNests lists all nests.
@@ -61,7 +61,7 @@ message Nest {
 }
 
 message CreateNestRequest {
-  Nest nest = 1;
+  string uid = 1;
 }
 
 message ListNestsRequest {

proto/gen/apidocs.swagger.yaml

@@ -424,11 +424,11 @@ paths:
           schema:
             $ref: '#/definitions/googlerpcStatus'
       parameters:
-        - name: nest
+        - name: uid
           in: body
           required: true
           schema:
-            $ref: '#/definitions/v1Nest'
+            type: string
       tags:
         - NestService
   /api/v1/nests:by-uid/{uid}:

server/router/api/v1/nest_service.go

@@ -28,7 +28,7 @@ func (s *APIV1Service) CreateNest(ctx context.Context, request *v1pb.CreateNestR
 
 	create := &store.Nest{
 		CreatorID: user.ID,
-		UID:       request.Nest.Name,
+		UID:       request.Uid,
 	}
 
 	nest, err := s.Store.CreateNest(ctx, create)

web/src/components/AddNestPopover.tsx

@@ -0,0 +1,56 @@
+import { Input } from "@mui/joy";
+import { Button } from "@usememos/mui";
+import { PlusIcon } from "lucide-react";
+import { useState } from "react";
+import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/Popover";
+import { useTranslate } from "@/utils/i18n";
+import { useNestStore } from "@/store/v1";
+import { useCommonContext } from "@/layouts/CommonContextProvider";
+
+const AddNestPopover = () => {
+  const t = useTranslate();
+  const nestStore = useNestStore();
+  const [popoverOpen, setPopoverOpen] = useState<boolean>(false);
+  const [nestUID, setNestUID] = useState<string>("");
+  const commonContext =  useCommonContext();
+
+  const addNest = async () => {
+    const nest = await nestStore.createNest({
+      uid: nestUID
+    })
+    if (nest) {
+      await nestStore.fetchNests();
+      commonContext.setNest(nest.name);
+    }
+    setPopoverOpen(false);
+    setNestUID("");
+  };
+
+  return (
+    <Popover open={popoverOpen} onOpenChange={setPopoverOpen}>
+      <PopoverTrigger className="w-9">
+        <Button className="flex items-center justify-center" size="sm" variant="plain" asChild>
+          <PlusIcon className="w-5 h-5 mx-auto p-0" />
+        </Button>
+      </PopoverTrigger>
+      <PopoverContent align="center">
+        <div className="w-[16rem] flex flex-col justify-start items-start">
+          <Input
+            className="w-full"
+            size="md"
+            placeholder={t("nest.add-nest")}
+            value={nestUID}
+            onChange={(e) => setNestUID(e.target.value.trim())}
+          />
+          <div className="mt-2 w-full flex flex-row justify-end items-center gap-2">
+            <Button size="sm" color="primary" onClick={addNest} disabled={nestUID.length === 0}>
+              {t("common.add")}
+            </Button>
+          </div>
+        </div>
+      </PopoverContent>
+    </Popover>
+  );
+};
+
+export default AddNestPopover

web/src/components/NestBanner.tsx

@@ -4,7 +4,7 @@ import useCurrentUser from "@/hooks/useCurrentUser";
 import { useCommonContext } from "@/layouts/CommonContextProvider";
 import NestIcon from "./NestIcon";
 import { useNestList, useNestStore } from "@/store/v1";
-import { Nest } from "@/types/proto/api/v1/nest_service";
+import AddNestPopover from "./AddNestPopover";
 
 interface Props {
   collapsed?: boolean;
@@ -22,7 +22,7 @@ const NestBanner = (props: Props) => {
   };
 
   return (
-    <div className="relative w-full h-auto px-1 shrink-0">
+    <div className="flex flex-row justify-between items-center">
       <Dropdown>
         <MenuButton disabled={!user} slots={{ root: "div" }}>
           <div
@@ -45,6 +45,7 @@ const NestBanner = (props: Props) => {
           ))}
         </Menu>
       </Dropdown>
+      <AddNestPopover/>
     </div>
   );
 };

web/src/locales/en.json

@@ -143,6 +143,9 @@
     "no-memos-found": "No memos found",
     "search-placeholder": "Search content"
   },
+  "nest": {
+    "add-nest": "Add nest"
+  },
   "resource": {
     "clear": "Clear",
     "copy-link": "Copy Link",