Skip to content

Commit

Permalink
Contacts List Trusting
Browse files Browse the repository at this point in the history
  • Loading branch information
ericvicenti committed Jul 31, 2023
1 parent 7c1b87c commit a884d25
Show file tree
Hide file tree
Showing 11 changed files with 190 additions and 110 deletions.
5 changes: 1 addition & 4 deletions frontend/apps/electron/src/preload.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,21 +7,18 @@ process.once('loaded', async () => {

ipcRenderer.addListener('initWindow', (info, event) => {
// const {route, windowId} = event
console.log('INIT WINDOW', event)
// console.log('INIT WINDOW', event)
contextBridge.exposeInMainWorld('windowInfo', event)
})

contextBridge.exposeInMainWorld('ipc', {
send: (cmd, args) => {
console.log('IPC SENDING', cmd, args)
ipcRenderer.send(cmd, args)
},
listen: async (cmd: string, handler: (event: any) => void) => {
const innerHandler = (value: any) => {
console.log('IPC event received', cmd, value)
handler(value)
}
console.log('listening!', cmd)
ipcRenderer.addListener(cmd, innerHandler)
return () => {
ipcRenderer.removeListener(cmd, innerHandler)
Expand Down
6 changes: 3 additions & 3 deletions frontend/packages/app/src/components/footer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -50,10 +50,10 @@ function FooterContactsButton() {
<XStack alignItems="center" theme="mint" gap="$2">
<Button
size="$1"
chromeless={route.key != 'connections'}
color={route.key == 'connections' ? '$blue10' : undefined}
chromeless={route.key != 'contacts'}
color={route.key == 'contacts' ? '$blue10' : undefined}
onPress={() => {
navigate({key: 'connections'})
navigate({key: 'contacts'})
}}
paddingHorizontal="$2"
>
Expand Down
14 changes: 7 additions & 7 deletions frontend/packages/app/src/components/titlebar/common.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ import {
import toast from 'react-hot-toast'
import {TitleBarProps} from '.'
import {PublicationDropdown, PublishShareButton} from './publish-share'
import {FilePlus2, Pencil} from '@tamagui/lucide-icons'
import {FilePlus2, Folder, Pencil} from '@tamagui/lucide-icons'
import {Tooltip} from '@mintter/app/src/components/tooltip'
import {memo} from 'react'
import {usePopoverState} from '@mintter/app/src/use-popover-state'
Expand All @@ -59,7 +59,7 @@ export function ActionButtons(props: TitleBarProps) {

{route.key == 'draft' ? null : (
<div className="button-group">
{route.key == 'connections' ? (
{route.key == 'contacts' ? (
<ContactsPrompt />
) : (
<Tooltip content="New Document">
Expand Down Expand Up @@ -195,8 +195,8 @@ function NavMenuContentUnpure({
onPress={() => {
onRoute({key: 'home'})
}}
title="Trusted Publications"
icon={File}
title="Publications"
icon={Folder}
iconAfter={
<SizableText size="$1" color="$mint5">
&#8984; 1
Expand Down Expand Up @@ -238,12 +238,12 @@ function NavMenuContentUnpure({
</YGroup.Item>
<YGroup.Item>
<MenuItem
disabled={route.key == 'connections'}
disabled={route.key == 'contacts'}
onPress={() => {
onRoute({key: 'connections'})
onRoute({key: 'contacts'})
}}
icon={User}
title="Connections"
title="Contacts"
iconAfter={
<SizableText size="$1" color="$mint5">
&#8984; 9
Expand Down
4 changes: 2 additions & 2 deletions frontend/packages/app/src/components/titlebar/linux.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -146,8 +146,8 @@ function NavMenu() {
}
/>
<Dropdown.Item
disabled={route.key == 'connections'}
onPress={() => navigate({key: 'connections'})}
disabled={route.key == 'contacts'}
onPress={() => navigate({key: 'contacts'})}
icon={User}
title="Connections"
iconAfter={
Expand Down
9 changes: 5 additions & 4 deletions frontend/packages/app/src/components/titlebar/title.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,15 +15,16 @@ import {
User,
XStack,
} from '@mintter/ui'
import {Folder} from '@tamagui/lucide-icons'

export function TitleContent({size = '$4'}: {size?: FontSizeTokens}) {
const route = useNavRoute()
if (route.key === 'home') {
return (
<>
<File size={12} />
<Folder size={12} />
<TitleText data-tauri-drag-region size={size}>
Trusted Publications
Publications
</TitleText>
</>
)
Expand All @@ -38,12 +39,12 @@ export function TitleContent({size = '$4'}: {size?: FontSizeTokens}) {
</>
)
}
if (route.key === 'connections') {
if (route.key === 'contacts') {
return (
<>
<User size={12} />
<TitleText data-tauri-drag-region size={size}>
Connections
Contacts
</TitleText>
</>
)
Expand Down
4 changes: 2 additions & 2 deletions frontend/packages/app/src/components/titlebar/windows.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -414,8 +414,8 @@ function SystemMenu() {
icon: Search,
},
{
id: 'connections',
title: 'Connections',
id: 'contacts',
title: 'Contacts',
accelerator: 'Ctrl+9',
onSelect: () => {},
icon: Reload,
Expand Down
2 changes: 2 additions & 0 deletions frontend/packages/app/src/models/accounts.ts
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,8 @@ export function useSetTrusted(
},
onSuccess: (result, input, ctx) => {
invalidate([queryKeys.GET_ACCOUNT, input.accountId])
invalidate([queryKeys.GET_ALL_ACCOUNTS])
invalidate([queryKeys.GET_PUBLICATION_LIST])
opts?.onSuccess?.(result, input, ctx)
},
...opts,
Expand Down
83 changes: 0 additions & 83 deletions frontend/packages/app/src/pages/connections-page.tsx

This file was deleted.

163 changes: 163 additions & 0 deletions frontend/packages/app/src/pages/contacts-page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,163 @@
import {
useAccountIsConnected,
useAllAccounts,
} from '@mintter/app/src/models/accounts'
import {useNavigate} from '@mintter/app/src/utils/navigation'
import {Avatar} from '@mintter/app/src/components/avatar'
import Footer from '@mintter/app/src/components/footer'
import {OnlineIndicator} from '@mintter/app/src/components/indicator'
import {Account} from '@mintter/shared'
import {
Button,
Container,
Heading,
MainWrapper,
Spinner,
Text,
XStack,
YStack,
styled,
} from '@mintter/ui'
import {useSetTrusted} from '../models/accounts'
import {PlusCircle} from '@tamagui/lucide-icons'

const PageHeading = styled(Heading, {
color: '$gray10',
fontSize: '$7',
fontWeight: 'normal',
})

function ContactItem({
account,
isTrusted,
}: {
account: Account
isTrusted: boolean
}) {
const navigate = useNavigate()
const isConnected = useAccountIsConnected(account)
const alias = account.profile?.alias
const setTrusted = useSetTrusted()
return (
<Button
chromeless
theme="gray"
tag="li"
gap="$4"
onPress={() => {
navigate({key: 'account', accountId: account.id})
}}
>
<XStack alignItems="center" gap="$4" flex={1}>
<Avatar
size="$2"
accountId={account.id}
alias={account.profile?.alias || ''}
/>
{alias ? (
<Text fontWeight="700" fontFamily="$body">
{alias}
</Text>
) : (
<Text fontFamily="$body" fontWeight="bold" color="muted">
{account.id.slice(0, 5)}...{account.id.slice(-5)}
</Text>
)}
</XStack>
{!isTrusted && (
<Button
onPress={(e) => {
e.stopPropagation()
setTrusted.mutate({accountId: account.id, isTrusted: true})
}}
icon={PlusCircle}
>
Trust
</Button>
)}
<OnlineIndicator online={isConnected} />
</Button>
)
}

function ErrorPage({}: {error: any}) {
// todo, this!
return (
<MainWrapper>
<Container>
<Text fontFamily="$body" fontSize="$3">
Error
</Text>
</Container>
</MainWrapper>
)
}

export default function ContactsPage() {
const contacts = useAllAccounts()
const allAccounts = contacts.data?.accounts || []
const trustedAccounts = allAccounts.filter((account) => account.isTrusted)
const untrustedAccounts = allAccounts.filter((account) => !account.isTrusted)
if (contacts.isLoading) {
return (
<MainWrapper>
<Container>
<Spinner />
</Container>
</MainWrapper>
)
}
if (contacts.error) {
return <ErrorPage error={contacts.error} />
}
if (allAccounts.length === 0) {
return (
<MainWrapper>
<Container>
<YStack gap="$5" paddingVertical="$8">
<Text fontFamily="$body" fontSize="$3">
You have no Contacts yet.
</Text>
</YStack>
</Container>
</MainWrapper>
)
}
return (
<>
<MainWrapper>
<Container marginVertical="$4">
{trustedAccounts.length ? (
<>
<PageHeading>Trusted Contacts</PageHeading>
<YStack tag="ul" padding={0} gap="$2">
{trustedAccounts.map((account) => {
return (
<ContactItem
key={account.id}
account={account}
isTrusted={true}
/>
)
})}
</YStack>
<PageHeading marginTop="$4">Other Contacts</PageHeading>
</>
) : null}
<YStack tag="ul" padding={0} gap="$2">
{untrustedAccounts.map((account) => {
return (
<ContactItem
key={account.id}
account={account}
isTrusted={false}
/>
)
})}
</YStack>
</Container>
</MainWrapper>
<Footer />
</>
)
}
Loading

0 comments on commit a884d25

Please sign in to comment.