feat: respect current server's char limit

components/publish/PublishWidget.vue

@@ -3,7 +3,6 @@ import type { CreateStatusParams, StatusVisibility } from 'masto'
 import { fileOpen } from 'browser-fs-access'
 import { useDropZone } from '@vueuse/core'
 import { EditorContent } from '@tiptap/vue-3'
-import { POST_CHARS_LIMIT } from '~~/constants'
 
 const {
   draftKey,
@@ -174,7 +173,7 @@ onUnmounted(() => {
             :class="isExpanded ? 'min-h-120px' : ''"
           />
           <div v-if="isExpanded" absolute right-0 bottom-0 pointer-events-none text-sm op25>
-            {{ POST_CHARS_LIMIT - editor?.storage.characterCount.characters() }}
+            {{ characterLimit - editor?.storage.characterCount.characters() }}
           </div>
         </div>
 

composables/tiptap.ts

@@ -10,7 +10,6 @@ import { Plugin } from 'prosemirror-state'
 
 import type { Ref } from 'vue'
 import { HashSuggestion, MentionSuggestion } from './tiptap/suggestion'
-import { POST_CHARS_LIMIT } from '~/constants'
 
 export interface UseTiptapOptions {
   content: Ref<string | undefined>
@@ -44,7 +43,7 @@ export function useTiptap(options: UseTiptapOptions) {
         placeholder,
       }),
       CharacterCount.configure({
-        limit: POST_CHARS_LIMIT,
+        limit: characterLimit.value,
       }),
       CodeBlock,
       Extension.create({

composables/users.ts

@@ -1,7 +1,7 @@
-import type { AccountCredentials } from 'masto'
 import { login as loginMasto } from 'masto'
+import type { AccountCredentials, Instance } from 'masto'
 import type { UserLogin } from '~/types'
-import { DEFAULT_SERVER, STORAGE_KEY_CURRENT_USER, STORAGE_KEY_USERS } from '~/constants'
+import { DEFAULT_POST_CHARS_LIMIT, DEFAULT_SERVER, STORAGE_KEY_CURRENT_USER, STORAGE_KEY_SERVER, STORAGE_KEY_USERS } from '~/constants'
 
 const users = useLocalStorage<UserLogin[]>(STORAGE_KEY_USERS, [], { deep: true })
 const currentUserId = useLocalStorage<string>(STORAGE_KEY_CURRENT_USER, '')
@@ -21,6 +21,10 @@ export const currentServer = computed<string>(() => currentUser.value?.server ||
 
 export const useUsers = () => users
 
+export const currentInstance = useLocalStorage<Partial<Instance>>(STORAGE_KEY_SERVER, {}, { deep: true })
+
+export const characterLimit = computed(() => currentInstance.value.configuration?.statuses.maxCharacters ?? DEFAULT_POST_CHARS_LIMIT)
+
 export async function loginTo(user: UserLogin & { account?: AccountCredentials }) {
   const existing = users.value.findIndex(u => u.server === user.server && u.token === user.token)
   if (existing !== -1) {
@@ -37,6 +41,7 @@ export async function loginTo(user: UserLogin & { account?: AccountCredentials }
   })
   const me = await masto.accounts.verifyCredentials()
   user.account = me
+  currentInstance.value = await masto.instances.fetch()
 
   users.value.push(user)
   currentUserId.value = me.id

constants/index.ts

@@ -4,10 +4,10 @@ export const HOST_DOMAIN = process.dev
   ? 'http://localhost:3000'
   : 'https://elk.zone'
 
-export const POST_CHARS_LIMIT = 500
-
+export const DEFAULT_POST_CHARS_LIMIT = 500
 export const DEFAULT_SERVER = 'mas.to'
 
+export const STORAGE_KEY_SERVER = 'elk-current-server'
 export const STORAGE_KEY_DRAFTS = 'elk-drafts'
 export const STORAGE_KEY_USERS = 'elk-users'
 export const STORAGE_KEY_CURRENT_USER = 'elk-current-user'