Merge pull request #435 from digi-monkey/develop

feat: merge v0.2.8 into main

.github/workflows/ci.yaml

@@ -3,9 +3,11 @@ on:
   pull_request:
     branches:
       - master
+      - develop
   push:
     branches:
       - master
+      - develop
 
 jobs:
   lint:

package.json

@@ -1,6 +1,6 @@
 {
   "name": "flycat",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "private": true,
   "scripts": {
     "wasm:profile": "cd wasm && rustc --crate-type cdylib --target wasm32-unknown-unknown -C lto -C opt-level=z -o profile.wasm examples/profile.rs",
@@ -31,6 +31,9 @@
     "@next/bundle-analyzer": "14.0.3",
     "@noble/hashes": "1.1.5",
     "@noble/secp256k1": "1.7.0",
+    "@radix-ui/react-avatar": "1.0.4",
+    "@radix-ui/react-dialog": "1.0.5",
+    "@radix-ui/react-dropdown-menu": "2.0.6",
     "@radix-ui/react-hover-card": "1.0.7",
     "@radix-ui/react-popover": "1.0.7",
     "@reduxjs/toolkit": "1.7.1",
@@ -129,6 +132,7 @@
     "typescript": "4.7.4",
     "usehooks-ts": "2.9.1",
     "uuid": "9.0.0",
+    "vaul": "0.8.0",
     "wasm": "file:./wasm/pkg",
     "web-vitals": "2.1.2"
   },

public/locales/en/common.json

@@ -4,6 +4,7 @@
     "noNumberData": "?"
   },
   "timeSince": {
+    "now": "just now",
     "seconds": "seconds ago",
     "minutes": "minutes ago",
     "hours": "hours ago",

public/locales/zh/common.json

@@ -4,6 +4,7 @@
     "noNumberData": "?"
   },
   "timeSince": {
+    "now": "刚刚",
     "seconds": "秒钟前",
     "minutes": "分钟前",
     "hours": "小时前",

src/components/BaseLayout/add-note.tsx

@@ -0,0 +1,42 @@
+import React, { useState } from 'react';
+import * as Dialog from '@radix-ui/react-dialog';
+import { useTranslation } from 'react-i18next';
+import { cn } from 'utils/classnames';
+import PubNoteTextarea from 'components/PubNoteTextarea';
+
+type AddNoteDialogProps = {
+  children: React.ReactNode;
+};
+
+const AddNoteDialog = (props: AddNoteDialogProps) => {
+  const { t } = useTranslation();
+  const [opened, setOpened] = useState(false);
+
+  return (
+    <Dialog.Root open={opened} onOpenChange={setOpened}>
+      <Dialog.Trigger asChild>{props.children}</Dialog.Trigger>
+      <Dialog.Portal>
+        <Dialog.Overlay className="fixed inset-0 bg-overflay-01 animate-overlay-show z-40" />
+        <Dialog.Content
+          className={cn(
+            'fixed w-[90vw] sm:w-auto sm:min-w-[630px] top-1/3 left-1/2 -translate-x-1/2 -translate-y-1/2',
+            'py-4 bg-surface-03 rounded-lg shadow-sm z-50',
+            'animate-content-show',
+          )}
+        >
+          <div className="flex flex-col px-6 gap-3 mb-3">
+            <Dialog.Title className="my-0 subheader01-bold text-text-primary">
+              {t('baseLayout.modal.title')}
+            </Dialog.Title>
+            <Dialog.Description className="label text-text-secondary my-0">
+              {t('baseLayout.modal.desc')}
+            </Dialog.Description>
+          </div>
+          <PubNoteTextarea pubSuccessCallback={() => setOpened(false)} />
+        </Dialog.Content>
+      </Dialog.Portal>
+    </Dialog.Root>
+  );
+};
+
+export default AddNoteDialog;

src/components/BaseLayout/drawer.tsx

@@ -0,0 +1,81 @@
+import Icon from 'components/Icon';
+import {
+  Drawer,
+  DrawerTrigger,
+  DrawerContent,
+  DrawerClose,
+} from 'components/shared/ui/Drawer';
+import { EventSetMetadataContent } from 'core/nostr/type';
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { FiMenu, FiX } from 'react-icons/fi';
+import { useSelector } from 'react-redux';
+import { RootState } from 'store/configureStore';
+import { useWindowSize } from 'usehooks-ts';
+import { NavLink } from './nav-link';
+import { Profile } from './profile';
+import { MenuItem, UserMenus } from './utils';
+
+export type UserDrawerProps = {
+  user?: EventSetMetadataContent;
+};
+
+export function UserDrawer(props: UserDrawerProps) {
+  const { user } = props;
+  const { t } = useTranslation();
+  const [opened, setOpened] = useState(false);
+  const { height } = useWindowSize();
+  const isLoggedIn = useSelector(
+    (state: RootState) => state.loginReducer.isLoggedIn,
+  );
+
+  const userMenus = UserMenus.reduce((result, item) => {
+    if (!isLoggedIn && item.needLogin) {
+      return result;
+    }
+    result.push(item);
+    return result;
+  }, [] as MenuItem[]);
+
+  return (
+    <Drawer open={opened} onOpenChange={setOpened}>
+      <DrawerTrigger asChild>
+        <div className="sm:hidden flex items-center">
+          <FiMenu className="w-7 h-7 fill-gray-700" />
+        </div>
+      </DrawerTrigger>
+      <DrawerContent
+        className="h-screen bg-surface-02 rounded-none"
+        style={{ height }}
+      >
+        <div className="mx-auto w-full p-4 box-border">
+          <div className="mb-2 px-2">
+            <div className="flex justify-end items-center">
+              <DrawerClose asChild>
+                <FiX className="w-7 h-7 fill-gray-700" />
+              </DrawerClose>
+            </div>
+            <Profile user={user} className="justify-start" showName />
+          </div>
+          <ul className="list-none p-0 y-0">
+            {userMenus.map(item => (
+              <NavLink
+                key={item.id}
+                as="li"
+                item={item}
+                className="flex items-center px-2 py-3 gap-3 hover:bg-conditional-hover01 rounded-full cursor-pointer"
+                onClick={() => {
+                  setOpened(false);
+                  return true;
+                }}
+              >
+                <Icon type={item.icon} className="w-6 h-6 fill-text-primary" />
+                <span className="label text-text-primary">{t(item.title)}</span>
+              </NavLink>
+            ))}
+          </ul>
+        </div>
+      </DrawerContent>
+    </Drawer>
+  );
+}

src/components/BaseLayout/hooks.ts

@@ -17,7 +17,7 @@ export function useUserInfo() {
     if (!worker) return;
     if (!isValidPublicKey(myPublicKey)) return;
     worker.subMetadata([myPublicKey]);
-  }, [worker]);
+  }, [worker, myPublicKey]);
 
   useEffect(() => {
     if (!isValidPublicKey(myPublicKey)) return;