Merge remote-tracking branch 'origin/hadi/xmtp-plugin' into console

JustaName-id · Dec 9, 2024 · 823c5ea · 823c5ea
2 parents 9fc50b0 + 4a3af5e
commit 823c5ea
Show file tree

Hide file tree

Showing 69 changed files with 4,435 additions and 2,317 deletions.
diff --git a/.gitignore b/.gitignore
@@ -62,4 +62,6 @@ cache/
 
 .yarn/install-state.gz
 
-storybook-static
+storybook-static
+
+.million
diff --git a/apps/console/next.config.js b/apps/console/next.config.js
@@ -2,6 +2,7 @@
 
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const { composePlugins, withNx } = require('@nx/next');
+const MillionLint = require('@million/lint');
 
 /**
  * @type {import('@nx/next/plugins/with-nx').WithNxOptions}
@@ -23,4 +24,6 @@ const plugins = [
   withNx,
 ];
 
-module.exports = composePlugins(...plugins)(nextConfig);
+module.exports = MillionLint.next({ rsc: true })(
+  composePlugins(...plugins)(nextConfig)
+);
diff --git a/package.json b/package.json
@@ -19,6 +19,7 @@
     "@hookform/resolvers": "^3.9.0",
     "@inquirer/prompts": "^4.3.0",
     "@justaname.id/address-resolution": "^1.1.0",
+    "@million/lint": "^1.0.13",
     "@privy-io/react-auth": "^1.82.0",
     "@privy-io/wagmi": "^0.2.12",
     "@radix-ui/react-accordion": "^1.2.1",

diff --git a/packages/@justaname.id/react/src/lib/hooks/client/useEnsPublicClient.ts b/packages/@justaname.id/react/src/lib/hooks/client/useEnsPublicClient.ts
@@ -22,7 +22,7 @@ export const getEnsPublicClient = (
 };
 
 export const buildEnsPublicClientKey = (chainId: ChainId | undefined) => [
-  'CLIENT',
+  'ENS_PUBLIC_CLIENT',
   chainId,
 ];
 

diff --git a/packages/@justaname.id/react/src/lib/hooks/primaryName/usePrimaryName.ts b/packages/@justaname.id/react/src/lib/hooks/primaryName/usePrimaryName.ts
@@ -6,6 +6,7 @@ import { useEnsPublicClient } from '../client/useEnsPublicClient';
 import { defaultOptions } from '../../query';
 import { getName } from '@ensdomains/ensjs/public';
 import { PrimaryNameTaskQueue } from './primary-name-task-queue';
+import { buildPrimaryNameBatchKey } from './usePrimaryNameBatch';
 
 export const buildPrimaryName = (
   address: string,
@@ -59,6 +60,16 @@ export const usePrimaryName = (
 
     let name = '';
 
+    const primaryNames = queryClient.getQueryData(
+      buildPrimaryNameBatchKey(_chainId)
+    ) as Record<string, string>;
+
+    if (primaryNames && _params?.address) {
+      if (primaryNames[_params?.address]) {
+        return primaryNames[_params.address];
+      }
+    }
+
     const primaryNameGetByAddressResponse =
       await justaname.subnames.getPrimaryNameByAddress({
         address: params?.address,
@@ -82,25 +93,6 @@ export const usePrimaryName = (
         name = reverseResolution.name;
       }
     }
-
-    // const reverseResolution = await getName(ensClient, {
-    //   address: params?.address,
-    // });
-    //
-    // if (reverseResolution && reverseResolution?.name) {
-    //   name = reverseResolution.name;
-    // } else {
-    //   const primaryNameGetByAddressResponse =
-    //     await justaname.subnames.getPrimaryNameByAddress({
-    //       address: params?.address,
-    //       chainId: _chainId,
-    //     });
-    //
-    //   if (primaryNameGetByAddressResponse) {
-    //     name = primaryNameGetByAddressResponse.name;
-    //   }
-    // }
-    //
     return name;
   };
 

diff --git a/packages/@justaname.id/react/src/lib/hooks/records/useRecords.ts b/packages/@justaname.id/react/src/lib/hooks/records/useRecords.ts
@@ -260,11 +260,7 @@ export const useRecords = (params?: UseRecordsParams): UseRecordsResult => {
       }
       return failureCount < 3;
     },
-    queryKey: buildRecordsBySubnameKey(
-      _ens || '',
-      _chainId
-      // params?.standard
-    ),
+    queryKey: buildRecordsBySubnameKey(_ens || '', _chainId),
     queryFn: () =>
       getRecordsInternal(
         {

diff --git a/packages/@justaname.id/react/src/lib/providers/JustaNameProvider.tsx b/packages/@justaname.id/react/src/lib/providers/JustaNameProvider.tsx
@@ -68,8 +68,8 @@ export const JustaNameProvider: FC<JustaNameProviderProps> = ({
   const { chainId } = useMountedAccount();
 
   const defaultChain = useMemo(() => {
-    return !chainId
-      ? undefined
+    return !chainId === undefined
+      ? 1
       : chainId !== 1 && chainId !== 11155111
       ? 1
       : chainId;

diff --git a/packages/@justaname.id/sdk/src/lib/api/axiosController.ts b/packages/@justaname.id/sdk/src/lib/api/axiosController.ts
@@ -42,7 +42,6 @@ export const controlledAxiosPromise = <T extends NonNullable<unknown>>(
       return res.data.result.data as T;
     })
     .catch((err: AxiosError<BaseResponse<null>>) => {
-      console.error(err);
       if (err?.response) {
         if (err?.response?.data?.result) {
           if (err?.response?.data?.result?.error) {

diff --git a/packages/@justweb3/efp-plugin/src/lib/components/FollowButton/index.tsx b/packages/@justweb3/efp-plugin/src/lib/components/FollowButton/index.tsx
@@ -15,6 +15,9 @@ export const FollowButton: React.FC<FollowButtonProps> = ({ ens, address }) => {
     addressOrEns1: address,
     addressOrEns2: ownAddress,
   });
+  if (ownAddress === address) {
+    return null;
+  }
 
   if (!ownAddress) {
     return (

diff --git a/packages/@justweb3/ui/src/lib/ui/NotificationBadge/NotificationBadge.module.css b/packages/@justweb3/ui/src/lib/ui/NotificationBadge/NotificationBadge.module.css
@@ -0,0 +1,26 @@
+.notificationIcon {
+    position: relative;
+    display: flex;
+}
+
+.icon {
+    font-size: 24px; /* Adjust icon size */
+    line-height: 40px; /* Center the icon vertically */
+    text-align: center;
+}
+
+.badge {
+    position: absolute;
+    top: 0;
+    right: 4px;
+    background-color: red;
+    color: white;
+    font-size: 8px;
+    font-weight: bold;
+    line-height: 1;
+    border-radius: 100px;
+    padding: 2px 4px;
+    transform: translate(50%, -50%);
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+    white-space: nowrap;
+}
diff --git a/packages/@justweb3/ui/src/lib/ui/NotificationBadge/index.tsx b/packages/@justweb3/ui/src/lib/ui/NotificationBadge/index.tsx
@@ -0,0 +1,30 @@
+import React from 'react';
+import styles from './NotificationBadge.module.css';
+import { SPAN } from '../Text';
+
+interface NotificationBadgeProps {
+  count: number;
+  icon?: React.ReactNode;
+  maxCount?: number;
+}
+
+export const NotificationBadge: React.FC<NotificationBadgeProps> = ({
+  count,
+  icon,
+  maxCount = 99,
+}) => {
+  return (
+    <div className={styles.notificationIcon}>
+      {/*<div className={styles.icon}>{icon}</div>*/}
+      {icon}
+      {/*{count > 0 && <SPAN className={styles.badge}>{count}</SPAN>}*/}
+      {count > 0 && (
+        <SPAN className={styles.badge}>
+          {count > maxCount ? `${maxCount}+` : count}
+        </SPAN>
+      )}
+    </div>
+  );
+};
+
+export default NotificationBadge;
diff --git a/packages/@justweb3/ui/src/lib/ui/Tabs/Tabs.module.css b/packages/@justweb3/ui/src/lib/ui/Tabs/Tabs.module.css
@@ -6,6 +6,8 @@
     margin-bottom: 10px;
     gap: 10px;
     display: flex;
+    overflow-x: auto;
+    overflow-y: visible;
 }
 
 /* Underlined variant */
@@ -22,6 +24,7 @@
     font-family: var(--justweb3-font-family);
     border-bottom: 2px solid transparent;
 
+
 }
 
 .underlinedTabs .tabsTrigger[data-state='active'] {

diff --git a/packages/@justweb3/ui/src/lib/ui/index.ts b/packages/@justweb3/ui/src/lib/ui/index.ts
@@ -18,3 +18,4 @@ export * from './Sheet';
 export * from './Label';
 export * from './Checkbox';
 export * from './Skeleton';
+export * from './NotificationBadge';
diff --git a/packages/@justweb3/ui/src/stories/ui/notification-badge.stories.tsx b/packages/@justweb3/ui/src/stories/ui/notification-badge.stories.tsx
@@ -0,0 +1,57 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { NotificationBadge } from '../../lib/ui';
+import React from 'react';
+
+const meta: Meta<typeof NotificationBadge> = {
+  component: NotificationBadge,
+  title: 'Design System/UI/NotificationBadge',
+  tags: ['autodocs'],
+};
+
+export default meta;
+type Story = StoryObj<typeof NotificationBadge>;
+
+const ChatIcon = () => {
+  return (
+    <svg
+      width="20"
+      height="20"
+      viewBox="0 0 20 20"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M10 2.5C11.9884 2.49947 13.8956 3.28926 15.3021 4.69566C16.7086 6.10206 17.4992 8.00989 17.5 9.9995C17.4997 10.9847 17.3055 11.9603 16.9285 12.8704C16.5514 13.7806 15.9989 14.6075 15.3025 15.304C14.606 16.0005 13.7793 16.5529 12.8695 16.9297C11.9597 17.3065 10.9847 17.5003 10 17.5C8.694 17.5 7.09 17.1718 5.946 16.5524L3.156 17.475C3.06789 17.5039 2.97347 17.5078 2.8833 17.4861C2.79313 17.4644 2.71076 17.4181 2.6454 17.3523C2.58003 17.2865 2.53425 17.2037 2.51316 17.1134C2.49208 17.023 2.49652 16.9286 2.526 16.8406L3.452 14.0679C2.78 12.8942 2.5 11.3603 2.5 9.9995C2.5008 8.00989 3.29139 6.10206 4.69788 4.69566C6.10437 3.28926 8.01158 2.49947 10 2.5Z"
+        fill="var(--justweb3-primary-color)"
+      />
+    </svg>
+  );
+};
+
+export const Normal: Story = {
+  args: {
+    count: 1,
+    icon: <ChatIcon />,
+  },
+};
+
+export const Zero: Story = {
+  args: {
+    count: 0,
+    icon: <ChatIcon />,
+  },
+};
+
+export const Many: Story = {
+  args: {
+    count: 50,
+    icon: <ChatIcon />,
+  },
+};
+
+export const ManyWithMax: Story = {
+  args: {
+    count: 1000,
+    icon: <ChatIcon />,
+  },
+};
diff --git a/packages/@justweb3/widget/src/lib/components/JustEnsCard/JustEnsCard.module.css b/packages/@justweb3/widget/src/lib/components/JustEnsCard/JustEnsCard.module.css
@@ -70,3 +70,8 @@
   display: flex;
   gap: 5px;
 }
+
+.socialIcon {
+  width: 12px;
+  height: 12px;
+}
diff --git a/packages/@justweb3/widget/src/lib/components/JustEnsCard/index.tsx b/packages/@justweb3/widget/src/lib/components/JustEnsCard/index.tsx
@@ -214,8 +214,7 @@ export const JustEnsCard: FC<JustEnsCardProps> = ({
             {records.sanitizedRecords.socials.map((social, index) =>
               React.cloneElement(getTextRecordIcon(social.key), {
                 key: `${ens}-${index}-${social.key}`,
-                width: 12,
-                height: 12,
+                className: styles.socialIcon,
               })
             )}
           </Flex>