feat: add locked for account
This commit is contained in:
parent
338e203b6f
commit
d5856b83c6
|
@ -165,8 +165,9 @@ const personalNoteMaxLength = 2000
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div flex="~ col gap1" pt2>
|
<div flex="~ col gap1" pt2>
|
||||||
<div flex justify-between>
|
<div flex gap2 items-center>
|
||||||
<AccountDisplayName :account="account" font-bold sm:text-2xl text-xl />
|
<AccountDisplayName :account="account" font-bold sm:text-2xl text-xl />
|
||||||
|
<AccountLockIndicator v-if="account.locked" show-label />
|
||||||
<AccountBotIndicator v-if="account.bot" show-label />
|
<AccountBotIndicator v-if="account.bot" show-label />
|
||||||
</div>
|
</div>
|
||||||
<AccountHandle :account="account" overflow-unset line-clamp-unset />
|
<AccountHandle :account="account" overflow-unset line-clamp-unset />
|
||||||
|
|
|
@ -23,6 +23,7 @@ const { account, as = 'div' } = defineProps<{
|
||||||
<div flex="~ col" shrink pt-1 h-full overflow-hidden justify-center leading-none select-none>
|
<div flex="~ col" shrink pt-1 h-full overflow-hidden justify-center leading-none select-none>
|
||||||
<div flex="~" gap-2>
|
<div flex="~" gap-2>
|
||||||
<AccountDisplayName :account="account" font-bold line-clamp-1 ws-pre-wrap break-all text-lg />
|
<AccountDisplayName :account="account" font-bold line-clamp-1 ws-pre-wrap break-all text-lg />
|
||||||
|
<AccountLockIndicator v-if="account.bot" text-xs />
|
||||||
<AccountBotIndicator v-if="account.bot" text-xs />
|
<AccountBotIndicator v-if="account.bot" text-xs />
|
||||||
</div>
|
</div>
|
||||||
<AccountHandle :account="account" text-secondary-light />
|
<AccountHandle :account="account" text-secondary-light />
|
||||||
|
|
21
components/account/AccountLockIndicator.vue
Normal file
21
components/account/AccountLockIndicator.vue
Normal file
|
@ -0,0 +1,21 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
defineProps<{
|
||||||
|
showLabel?: boolean
|
||||||
|
}>()
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div
|
||||||
|
flex="~ gap1" items-center
|
||||||
|
:class="{ 'border border-base rounded-md px-1': showLabel }"
|
||||||
|
text-secondary-light
|
||||||
|
>
|
||||||
|
<slot name="prepend" />
|
||||||
|
<CommonTooltip no-auto-focus content="Lock" :disabled="showLabel">
|
||||||
|
<div i-ri:lock-line />
|
||||||
|
</CommonTooltip>
|
||||||
|
<div v-if="showLabel">
|
||||||
|
Lock
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
|
@ -6,12 +6,15 @@ defineProps<{
|
||||||
}>()
|
}>()
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<!-- TODO: reuse AccountInfo.vue -->
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div flex gap-2 items-center>
|
<div flex gap-2 items-center>
|
||||||
<AccountAvatar w-10 h-10 :account="account" shrink-0 />
|
<AccountAvatar w-10 h-10 :account="account" shrink-0 />
|
||||||
<div flex="~ col gap1" shrink h-full overflow-hidden leading-none>
|
<div flex="~ col gap1" shrink h-full overflow-hidden leading-none>
|
||||||
<div flex="~" gap-2>
|
<div flex="~" gap-2>
|
||||||
<AccountDisplayName :account="account" line-clamp-1 ws-pre-wrap break-all text-base />
|
<AccountDisplayName :account="account" line-clamp-1 ws-pre-wrap break-all text-base />
|
||||||
|
<AccountLockIndicator v-if="account.bot" text-xs />
|
||||||
<AccountBotIndicator v-if="account.bot" text-xs />
|
<AccountBotIndicator v-if="account.bot" text-xs />
|
||||||
</div>
|
</div>
|
||||||
<AccountHandle text-sm :account="account" text-secondary-light />
|
<AccountHandle text-sm :account="account" text-secondary-light />
|
||||||
|
|
|
@ -155,6 +155,7 @@ const forceShow = ref(false)
|
||||||
</AccountHoverWrapper>
|
</AccountHoverWrapper>
|
||||||
<div flex-auto />
|
<div flex-auto />
|
||||||
<div v-show="!getPreferences(userSettings, 'zenMode')" text-sm text-secondary flex="~ row nowrap" hover:underline whitespace-nowrap>
|
<div v-show="!getPreferences(userSettings, 'zenMode')" text-sm text-secondary flex="~ row nowrap" hover:underline whitespace-nowrap>
|
||||||
|
<AccountLockIndicator v-if="status.account.bot" me-2 />
|
||||||
<AccountBotIndicator v-if="status.account.bot" me-2 />
|
<AccountBotIndicator v-if="status.account.bot" me-2 />
|
||||||
<div flex="~ gap1" items-center>
|
<div flex="~ gap1" items-center>
|
||||||
<StatusVisibilityIndicator v-if="status.visibility !== 'public'" :status="status" />
|
<StatusVisibilityIndicator v-if="status.visibility !== 'public'" :status="status" />
|
||||||
|
|
|
@ -47,6 +47,7 @@ const { form, reset, submitter, isDirty, isError } = useForm({
|
||||||
fieldsAttributes,
|
fieldsAttributes,
|
||||||
|
|
||||||
bot: account?.bot ?? false,
|
bot: account?.bot ?? false,
|
||||||
|
locked: account?.locked ?? false,
|
||||||
|
|
||||||
// These look more like account and privacy settings than appearance settings
|
// These look more like account and privacy settings than appearance settings
|
||||||
// discoverable: false,
|
// discoverable: false,
|
||||||
|
@ -143,6 +144,14 @@ onReactivated(refreshInfo)
|
||||||
:account="{ ...account, displayName: form.displayName }"
|
:account="{ ...account, displayName: form.displayName }"
|
||||||
font-bold sm:text-2xl text-xl
|
font-bold sm:text-2xl text-xl
|
||||||
/>
|
/>
|
||||||
|
<div flex="~ row" items-center gap2>
|
||||||
|
<label>
|
||||||
|
<AccountLockIndicator show-label px2 py1>
|
||||||
|
<template #prepend>
|
||||||
|
<input v-model="form.locked" type="checkbox" cursor-pointer>
|
||||||
|
</template>
|
||||||
|
</AccountLockIndicator>
|
||||||
|
</label>
|
||||||
<label>
|
<label>
|
||||||
<AccountBotIndicator show-label px2 py1>
|
<AccountBotIndicator show-label px2 py1>
|
||||||
<template #prepend>
|
<template #prepend>
|
||||||
|
@ -151,6 +160,7 @@ onReactivated(refreshInfo)
|
||||||
</AccountBotIndicator>
|
</AccountBotIndicator>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<AccountHandle :account="account" />
|
<AccountHandle :account="account" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in a new issue