From 5f07fd2515a50a067d3774f0d0825d1805c0e754 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90?= <sxzz@sxzz.moe>
Date: Sun, 8 Jan 2023 22:08:11 +0800
Subject: [PATCH] feat(settings): add bot option for profile appearance

---
 components/account/AccountBotIndicator.vue |  3 ++-
 components/account/AccountInfo.vue         |  2 +-
 components/search/SearchAccountInfo.vue    |  2 +-
 pages/settings/profile/appearance.vue      | 21 ++++++++++++++++-----
 4 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/components/account/AccountBotIndicator.vue b/components/account/AccountBotIndicator.vue
index 1a4cfa68..721ca6f8 100644
--- a/components/account/AccountBotIndicator.vue
+++ b/components/account/AccountBotIndicator.vue
@@ -8,8 +8,9 @@ defineProps<{
   <div
     flex="~ gap1" items-center
     :class="{ 'border border-base rounded-md px-1': showLabel }"
-    text-secondary-light text-xs
+    text-secondary-light
   >
+    <slot name="prepend" />
     <CommonTooltip :content="$t('account.bot')" :disabled="showLabel">
       <div i-ri:robot-line />
     </CommonTooltip>
diff --git a/components/account/AccountInfo.vue b/components/account/AccountInfo.vue
index db965e09..b5f7af73 100644
--- a/components/account/AccountInfo.vue
+++ b/components/account/AccountInfo.vue
@@ -23,7 +23,7 @@ defineOptions({
     <div flex="~ col" shrink pt-1 h-full overflow-hidden justify-center leading-none>
       <div flex="~" gap-2>
         <AccountDisplayName :account="account" font-bold line-clamp-1 ws-pre-wrap break-all text-lg />
-        <AccountBotIndicator v-if="account.bot" />
+        <AccountBotIndicator v-if="account.bot" text-xs />
       </div>
       <AccountHandle :account="account" text-secondary-light />
     </div>
diff --git a/components/search/SearchAccountInfo.vue b/components/search/SearchAccountInfo.vue
index e3de38f8..eb6846d3 100644
--- a/components/search/SearchAccountInfo.vue
+++ b/components/search/SearchAccountInfo.vue
@@ -12,7 +12,7 @@ defineProps<{
     <div flex="~ col gap1" shrink h-full overflow-hidden leading-none>
       <div flex="~" gap-2>
         <AccountDisplayName :account="account" line-clamp-1 ws-pre-wrap break-all text-base />
-        <AccountBotIndicator v-if="account.bot" />
+        <AccountBotIndicator v-if="account.bot" text-xs />
       </div>
       <AccountHandle text-sm :account="account" text-secondary-light />
     </div>
diff --git a/pages/settings/profile/appearance.vue b/pages/settings/profile/appearance.vue
index 340ab739..4210c313 100644
--- a/pages/settings/profile/appearance.vue
+++ b/pages/settings/profile/appearance.vue
@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import type { mastodon } from 'masto'
+import { satisfies } from 'semver'
 import { useForm } from 'slimeform'
 import { parse } from 'ultrahtml'
 
@@ -41,9 +42,10 @@ const { form, reset, submitter, dirtyFields, isError } = useForm({
 
       fieldsAttributes,
 
+      bot: account?.bot ?? false,
+
       // These look more like account and privacy settings than appearance settings
       // discoverable: false,
-      // bot: false,
       // locked: false,
     }
   },
@@ -114,10 +116,19 @@ onReactivated(refreshInfo)
         <CommonCropImage v-model="form.avatar" />
 
         <div px4>
-          <AccountDisplayName
-            :account="{ ...account, displayName: form.displayName }"
-            font-bold sm:text-2xl text-xl
-          />
+          <div flex justify-between>
+            <AccountDisplayName
+              :account="{ ...account, displayName: form.displayName }"
+              font-bold sm:text-2xl text-xl
+            />
+            <label>
+              <AccountBotIndicator show-label px2 py1>
+                <template #prepend>
+                  <input v-model="form.bot" type="checkbox">
+                </template>
+              </AccountBotIndicator>
+            </label>
+          </div>
           <AccountHandle :account="account" />
         </div>
       </div>