Merge pull request #57 from CityOfZion/CU-86dtkpxzt

CU-86dtkpxzt - Neon 3 - Contact Management - Remove "My Accounts" link
CityOfZion · May 23, 2024 · 2dedb71 · 2dedb71
2 parents 6b1ca28 + 434b0ac
commit 2dedb71
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 35 deletions.
diff --git a/src/renderer/src/@types/i18next-resources.d.ts b/src/renderer/src/@types/i18next-resources.d.ts
@@ -830,6 +830,7 @@ interface Resources {
     }
     contacts: {
       title: 'Contacts'
+      listTitle: 'All contacts'
       buttonAddContactLabel: 'Add Contact'
       contactList: {
         contacts: 'CONTACTS'

diff --git a/src/renderer/src/components/Contact/ContactList.tsx b/src/renderer/src/components/Contact/ContactList.tsx
@@ -133,7 +133,7 @@ export const ContactList = ({
 
   return (
     <Fragment>
-      <div className="px-2 flex flex-col w-full h-full items-center">
+      <div className="flex flex-col w-full h-full items-center">
         <div className="mb-8 w-full">
           <SearchInput placeholder={contactT('search')} onChange={event => setSearch(event.target.value)} compacted />
         </div>

diff --git a/src/renderer/src/locales/en/pages.json b/src/renderer/src/locales/en/pages.json
@@ -178,6 +178,7 @@
   },
   "contacts": {
     "title": "Contacts",
+    "listTitle": "All contacts",
     "buttonAddContactLabel": "Add Contact",
     "contactList": {
       "contacts": "CONTACTS",

diff --git a/src/renderer/src/routes/pages/Contacts/ContactsTabContent.tsx b/src/renderer/src/routes/pages/Contacts/ContactsTabContent.tsx
diff --git a/src/renderer/src/routes/pages/Contacts/index.tsx b/src/renderer/src/routes/pages/Contacts/index.tsx
@@ -4,21 +4,14 @@ import { TbPencil, TbPlus } from 'react-icons/tb'
 import { IContactState } from '@renderer/@types/store'
 import { Button } from '@renderer/components/Button'
 import { ContactAddressTable } from '@renderer/components/Contact/ContactAddressTable'
+import { ContactList } from '@renderer/components/Contact/ContactList'
 import { IconButton } from '@renderer/components/IconButton'
 import { Separator } from '@renderer/components/Separator'
-import { Tabs } from '@renderer/components/Tabs'
 import { StringHelper } from '@renderer/helpers/StringHelper'
 import { useContactsSelector } from '@renderer/hooks/useContactSelector'
 import { useModalNavigate } from '@renderer/hooks/useModalRouter'
 import { MainLayout } from '@renderer/layouts/Main'
 
-import { ContactsTabContent } from './ContactsTabContent'
-
-enum ESidebarOption {
-  CONTACTS = 'CONTACTS',
-  MY_ACCOUNTS = 'MY_ACCOUNTS',
-}
-
 export const ContactsPage = () => {
   const { t } = useTranslation('pages', { keyPrefix: 'contacts' })
   const { t: commonGeneral } = useTranslation('common', { keyPrefix: 'general' })
@@ -41,27 +34,19 @@ export const ContactsPage = () => {
       }
     >
       <section className="bg-gray-800 w-full h-full flex rounded">
-        <div className="w-full max-w-[17.188rem] px-2 border-r border-gray-300/15 flex flex-col items-center">
-          <Tabs.Root defaultValue={ESidebarOption.CONTACTS} className="w-full h-full flex-col flex">
-            <Tabs.List className="w-full mt-3 mb-7">
-              <Tabs.Trigger value={ESidebarOption.CONTACTS} className="px-8">
-                {t('contactList.contacts')}
-              </Tabs.Trigger>
-              <Tabs.Trigger value={ESidebarOption.MY_ACCOUNTS} className="px-8" disabled>
-                {t('contactList.myAccounts')}
-              </Tabs.Trigger>
-            </Tabs.List>
+        <div className="w-full max-w-[17.188rem] px-4 border-r border-gray-300/15 flex flex-col items-center">
+          <div className="flex flex-col gap-y-1 mt-2 mb-9 h-[3.25rem]a w-full">
+            <span className="w-full h-10 flex items-center justify-between  text-sm">{t('listTitle')}</span>
+            <Separator />
+          </div>
 
-            <Tabs.Content value={ESidebarOption.CONTACTS} className="h-full">
-              <ContactsTabContent onContactSelected={setSelectedContact} />
-            </Tabs.Content>
-          </Tabs.Root>
+          <ContactList onContactSelected={setSelectedContact} selectFirst={true} showSelectedIcon={false} />
         </div>
 
         {selectedContact && (
-          <div className="w-full px-2">
+          <div className="w-full px-4">
             <div className="flex flex-col gap-y-1 mt-2 mb-5 h-[3.25rem]">
-              <div className="w-full h-10 flex items-center justify-between px-2">
+              <div className="w-full h-10 flex items-center justify-between">
                 {StringHelper.truncateStringMiddle(selectedContact.name, 70)}
                 <Button
                   leftIcon={<TbPencil className="text-neon" />}