Merge pull request #486 from dappforce/improvement/moderation-ui

Minor UI Improvements
dappforce · Dec 8, 2023 · e179c47 · e179c47
2 parents 165842e + 4b2fa46
commit e179c47
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 23 deletions.
diff --git a/src/components/ProfilePreview.tsx b/src/components/ProfilePreview.tsx
@@ -95,7 +95,7 @@ const ProfilePreview = ({
                     tooltip={`Copy${isMyAddressPart} Grill public address`}
                     textToCopy={address}
                     textClassName={cx(
-                      'font-mono text-[15px] leading-[14px] whitespace-nowrap overflow-hidden overflow-ellipsis'
+                      'font-mono text-base whitespace-nowrap overflow-hidden overflow-ellipsis'
                     )}
                   />
                 </div>
@@ -108,7 +108,7 @@ const ProfilePreview = ({
                   tooltip={`Copy${isMyAddressPart} EVM address`}
                   textToCopy={evmAddress}
                   textClassName={cx(
-                    'font-mono text-[15px] leading-[14px] whitespace-nowrap overflow-hidden overflow-ellipsis'
+                    'font-mono text-base whitespace-nowrap overflow-hidden overflow-ellipsis'
                   )}
                 />
               </div>

diff --git a/src/components/auth/LoginModal/LoginModalContent.tsx b/src/components/auth/LoginModal/LoginModalContent.tsx
@@ -104,8 +104,8 @@ export const LoginContent = ({
             size='lg'
           >
             <div className='flex items-center justify-center gap-2'>
-              <WalletIcon />
-              Connect Wallet
+              <WalletIcon className='text-text-muted-on-primary' />
+              Connect wallet
             </div>
           </Button>
           <Button
@@ -114,7 +114,7 @@ export const LoginContent = ({
             size='lg'
           >
             <div className='flex items-center justify-center gap-2'>
-              <KeyIcon className='text-text-muted-on-primary' />
+              <KeyIcon className='text-text-muted' />
               Enter Grill secret key
             </div>
           </Button>

diff --git a/src/components/auth/ProfileModal/contents/AccountContent.tsx b/src/components/auth/ProfileModal/contents/AccountContent.tsx
@@ -82,6 +82,17 @@ export default function AccountContent({
       icon: LinkedAddressesIcon,
       onClick: onLinkedAddressesClick,
     },
+    ...colorModeOptions,
+    ...(isInstallAvailable()
+      ? [
+          {
+            text: 'Install app',
+            icon: FiDownload,
+            onClick: installApp,
+            iconClassName: 'text-text-muted text-xl',
+          },
+        ]
+      : []),
     {
       text: (
         <span className='flex items-center gap-2'>
@@ -96,22 +107,11 @@ export default function AccountContent({
       },
     },
     { text: 'Share session', icon: ShareIcon, onClick: onShareSessionClick },
-    ...colorModeOptions,
     {
       text: 'Suggest feature',
       icon: SuggestFeatureIcon,
       href: SUGGEST_FEATURE_LINK,
     },
-    ...(isInstallAvailable()
-      ? [
-          {
-            text: 'Install app',
-            icon: FiDownload,
-            onClick: installApp,
-            iconClassName: 'text-text-muted text-xl',
-          },
-        ]
-      : []),
     {
       text: 'About app',
       icon: InfoIcon,

diff --git a/src/components/moderation/ModerationForm.tsx b/src/components/moderation/ModerationForm.tsx
@@ -19,7 +19,6 @@ import FormButton from '../FormButton'
 import SelectInput, { ListItem } from '../inputs/SelectInput'
 import LinkText from '../LinkText'
 import { useName } from '../Name'
-import ProfilePreview from '../ProfilePreview'
 import Toast from '../Toast'
 
 export type ModerationFormProps = ComponentProps<'form'> & {
@@ -43,12 +42,12 @@ const blockingContentOptions = (isOwner?: boolean) => {
     id: FormSchema['blockingContent']['id']
     label: string
     disabledItem?: boolean | string
-  }[] = [{ id: 'message', label: 'Message' }]
+  }[] = [{ id: 'message', label: 'Moderate message' }]
 
   if (!isOwner) {
     options.push({
       id: 'owner',
-      label: 'Owner',
+      label: 'Moderate all messages from sender',
     })
   }
   return options
@@ -192,8 +191,8 @@ export default function ModerationForm({
         })
       })}
     >
-      <div className='flex flex-col gap-2'>
-        <span className='text-sm text-text-muted'>User</span>
+      {/* <div className='flex flex-col gap-2'>
+        <span className='text-sm text-text-muted'>Message Owner</span>
         <div
           className={cx(
             'rounded-xl border border-border-gray bg-background px-4 py-2'
@@ -212,14 +211,14 @@ export default function ModerationForm({
             )}
           </div>
         </div>
-      </div>
+      </div> */}
       <Controller
         control={control}
         name='blockingContent'
         render={({ field }) => {
           return (
             <SelectInput
-              fieldLabel='Blocking content'
+              fieldLabel='Action'
               disabled={isLoading}
               items={blockingContentOptions(isOwner)}
               selected={field.value}