chore: hide collaboration options if no account
This commit is contained in:
@@ -27,6 +27,8 @@ import NoProSubscription from '../Account/NoProSubscription'
|
||||
const Vaults = () => {
|
||||
const application = useApplication()
|
||||
|
||||
const hasAccount = application.hasAccount()
|
||||
|
||||
const [vaults, setVaults] = useState<VaultListingInterface[]>([])
|
||||
const [canCreateMoreVaults, setCanCreateMoreVaults] = useState(true)
|
||||
const [invites, setInvites] = useState<InviteRecord[]>([])
|
||||
@@ -140,21 +142,23 @@ const Vaults = () => {
|
||||
</PreferencesGroup>
|
||||
)}
|
||||
|
||||
<PreferencesGroup>
|
||||
<PreferencesSegment>
|
||||
<Title>Contacts</Title>
|
||||
{contacts.length > 0 && (
|
||||
<div className="my-2 flex flex-col gap-3.5">
|
||||
{contacts.map((contact) => {
|
||||
return <ContactItem contact={contact} key={contact.uuid} />
|
||||
})}
|
||||
{hasAccount && (
|
||||
<PreferencesGroup>
|
||||
<PreferencesSegment>
|
||||
<Title>Contacts</Title>
|
||||
{contacts.length > 0 && (
|
||||
<div className="my-2 flex flex-col gap-3.5">
|
||||
{contacts.map((contact) => {
|
||||
return <ContactItem contact={contact} key={contact.uuid} />
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
<div className="mt-2.5 flex flex-row">
|
||||
<Button label="Add New Contact" className={'mr-3 text-xs'} onClick={createNewContact} />
|
||||
</div>
|
||||
)}
|
||||
<div className="mt-2.5 flex flex-row">
|
||||
<Button label="Add New Contact" className={'mr-3 text-xs'} onClick={createNewContact} />
|
||||
</div>
|
||||
</PreferencesSegment>
|
||||
</PreferencesGroup>
|
||||
</PreferencesSegment>
|
||||
</PreferencesGroup>
|
||||
)}
|
||||
|
||||
<PreferencesGroup>
|
||||
<PreferencesSegment>
|
||||
@@ -181,46 +185,48 @@ const Vaults = () => {
|
||||
</PreferencesSegment>
|
||||
</PreferencesGroup>
|
||||
|
||||
<PreferencesGroup>
|
||||
<PreferencesSegment>
|
||||
<Title>CollaborationID</Title>
|
||||
<Subtitle>Share your CollaborationID with collaborators to join their vaults.</Subtitle>
|
||||
{contactService.isCollaborationEnabled() ? (
|
||||
<>
|
||||
<code className="mt-2.5 overflow-hidden whitespace-pre-wrap break-words rounded border border-border bg-contrast p-3">
|
||||
{contactService.getCollaborationID()}
|
||||
</code>
|
||||
<Button
|
||||
label="Copy ID"
|
||||
className="mt-2"
|
||||
onClick={async () => {
|
||||
try {
|
||||
await navigator.clipboard.writeText(contactService.getCollaborationID())
|
||||
addToast({
|
||||
type: ToastType.Success,
|
||||
message: 'Copied to clipboard',
|
||||
})
|
||||
} catch (error) {
|
||||
addToast({
|
||||
type: ToastType.Error,
|
||||
message: 'Failed to copy to clipboard',
|
||||
})
|
||||
console.error(error)
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<div className="mt-2.5 flex flex-row">
|
||||
<Button
|
||||
label="Enable Vault Sharing"
|
||||
className="mr-3 text-xs"
|
||||
onClick={() => contactService.enableCollaboration()}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</PreferencesSegment>
|
||||
</PreferencesGroup>
|
||||
{hasAccount && (
|
||||
<PreferencesGroup>
|
||||
<PreferencesSegment>
|
||||
<Title>CollaborationID</Title>
|
||||
<Subtitle>Share your CollaborationID with collaborators to join their vaults.</Subtitle>
|
||||
{contactService.isCollaborationEnabled() ? (
|
||||
<>
|
||||
<code className="mt-2.5 overflow-hidden whitespace-pre-wrap break-words rounded border border-border bg-contrast p-3">
|
||||
{contactService.getCollaborationID()}
|
||||
</code>
|
||||
<Button
|
||||
label="Copy ID"
|
||||
className="mt-2"
|
||||
onClick={async () => {
|
||||
try {
|
||||
await navigator.clipboard.writeText(contactService.getCollaborationID())
|
||||
addToast({
|
||||
type: ToastType.Success,
|
||||
message: 'Copied to clipboard',
|
||||
})
|
||||
} catch (error) {
|
||||
addToast({
|
||||
type: ToastType.Error,
|
||||
message: 'Failed to copy to clipboard',
|
||||
})
|
||||
console.error(error)
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<div className="mt-2.5 flex flex-row">
|
||||
<Button
|
||||
label="Enable Vault Sharing"
|
||||
className="mr-3 text-xs"
|
||||
onClick={() => contactService.enableCollaboration()}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</PreferencesSegment>
|
||||
</PreferencesGroup>
|
||||
)}
|
||||
</PreferencesPane>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -138,7 +138,7 @@ const VaultItem = ({ vault }: Props) => {
|
||||
<EditVaultModal existingVaultUuid={vault.uuid} onCloseDialog={closeVaultModal} />
|
||||
</ModalOverlay>
|
||||
|
||||
<div className="flex flex-row gap-3.5 rounded-lg border border-border px-3.5 py-2.5 shadow">
|
||||
<div className="flex flex-row gap-3.5 rounded-lg border border-border px-3.5 py-2.5 shadow-sm">
|
||||
<Icon type={vault.iconString} size="custom" className="mt-2.5 h-5.5 w-5.5 flex-shrink-0" />
|
||||
<div className="flex flex-col gap-1.5 py-1.5">
|
||||
<span className="mr-auto overflow-hidden text-ellipsis text-base font-bold">{vault.name}</span>
|
||||
@@ -164,14 +164,14 @@ const VaultItem = ({ vault }: Props) => {
|
||||
)}
|
||||
{vault.isSharedVaultListing() ? (
|
||||
<Button colorStyle="info" label="Invite Contacts" className="text-xs" onClick={openInviteModal} />
|
||||
) : (
|
||||
) : application.hasAccount() ? (
|
||||
<Button
|
||||
colorStyle="info"
|
||||
label="Enable Collaboration"
|
||||
className="text-xs"
|
||||
onClick={convertToSharedVault}
|
||||
/>
|
||||
)}
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user