mirror of
https://github.com/elk-zone/elk
synced 2024-12-15 15:18:00 +09:00
154 lines
4.3 KiB
TypeScript
154 lines
4.3 KiB
TypeScript
|
import { fileOpen } from 'browser-fs-access'
|
||
|
import type { Ref } from 'vue'
|
||
|
import type { mastodon } from 'masto'
|
||
|
import type { UseDraft } from './statusDrafts'
|
||
|
import type { Draft } from '~~/types'
|
||
|
|
||
|
export const usePublish = (options: {
|
||
|
draftState: UseDraft
|
||
|
expanded: Ref<boolean>
|
||
|
isUploading: Ref<boolean>
|
||
|
initialDraft: Ref<() => Draft>
|
||
|
}) => {
|
||
|
const { expanded, isUploading, initialDraft } = $(options)
|
||
|
let { draft, isEmpty } = $(options.draftState)
|
||
|
const masto = useMasto()
|
||
|
|
||
|
let isSending = $ref(false)
|
||
|
const isExpanded = $ref(false)
|
||
|
|
||
|
const shouldExpanded = $computed(() => expanded || isExpanded || !isEmpty)
|
||
|
const isPublishDisabled = $computed(() => {
|
||
|
return isEmpty || isUploading || isSending || (draft.attachments.length === 0 && !draft.params.status)
|
||
|
})
|
||
|
|
||
|
async function publishDraft() {
|
||
|
const payload = {
|
||
|
...draft.params,
|
||
|
status: htmlToText(draft.params.status || ''),
|
||
|
mediaIds: draft.attachments.map(a => a.id),
|
||
|
...(isGlitchEdition.value ? { 'content-type': 'text/markdown' } : {}),
|
||
|
} as mastodon.v1.CreateStatusParams
|
||
|
|
||
|
if (process.dev) {
|
||
|
// eslint-disable-next-line no-console
|
||
|
console.info({
|
||
|
raw: draft.params.status,
|
||
|
...payload,
|
||
|
})
|
||
|
// eslint-disable-next-line no-alert
|
||
|
const result = confirm('[DEV] Payload logged to console, do you want to publish it?')
|
||
|
if (!result)
|
||
|
return
|
||
|
}
|
||
|
|
||
|
try {
|
||
|
isSending = true
|
||
|
|
||
|
let status: mastodon.v1.Status
|
||
|
if (!draft.editingStatus)
|
||
|
status = await masto.v1.statuses.create(payload)
|
||
|
else
|
||
|
status = await masto.v1.statuses.update(draft.editingStatus.id, payload)
|
||
|
if (draft.params.inReplyToId)
|
||
|
navigateToStatus({ status })
|
||
|
|
||
|
draft = initialDraft()
|
||
|
|
||
|
return status
|
||
|
}
|
||
|
finally {
|
||
|
isSending = false
|
||
|
}
|
||
|
}
|
||
|
|
||
|
return $$({
|
||
|
isSending,
|
||
|
isExpanded,
|
||
|
shouldExpanded,
|
||
|
isPublishDisabled,
|
||
|
|
||
|
publishDraft,
|
||
|
})
|
||
|
}
|
||
|
|
||
|
export type MediaAttachmentUploadError = [filename: string, message: string]
|
||
|
|
||
|
export const useUploadMediaAttachment = (draftRef: Ref<Draft>) => {
|
||
|
const draft = $(draftRef)
|
||
|
const masto = useMasto()
|
||
|
const { t } = useI18n()
|
||
|
|
||
|
let isUploading = $ref<boolean>(false)
|
||
|
let isExceedingAttachmentLimit = $ref<boolean>(false)
|
||
|
let failedAttachments = $ref<MediaAttachmentUploadError[]>([])
|
||
|
const dropZoneRef = ref<HTMLDivElement>()
|
||
|
|
||
|
async function uploadAttachments(files: File[]) {
|
||
|
isUploading = true
|
||
|
failedAttachments = []
|
||
|
// TODO: display some kind of message if too many media are selected
|
||
|
// DONE
|
||
|
const limit = currentInstance.value!.configuration.statuses.maxMediaAttachments || 4
|
||
|
for (const file of files.slice(0, limit)) {
|
||
|
if (draft.attachments.length < limit) {
|
||
|
isExceedingAttachmentLimit = false
|
||
|
try {
|
||
|
const attachment = await masto.v1.mediaAttachments.create({
|
||
|
file,
|
||
|
})
|
||
|
draft.attachments.push(attachment)
|
||
|
}
|
||
|
catch (e) {
|
||
|
// TODO: add some human-readable error message, problem is that masto api will not return response code
|
||
|
console.error(e)
|
||
|
failedAttachments = [...failedAttachments, [file.name, (e as Error).message]]
|
||
|
}
|
||
|
}
|
||
|
else {
|
||
|
isExceedingAttachmentLimit = true
|
||
|
failedAttachments = [...failedAttachments, [file.name, t('state.attachments_limit_error')]]
|
||
|
}
|
||
|
}
|
||
|
isUploading = false
|
||
|
}
|
||
|
|
||
|
async function pickAttachments() {
|
||
|
const mimeTypes = currentInstance.value!.configuration.mediaAttachments.supportedMimeTypes
|
||
|
const files = await fileOpen({
|
||
|
description: 'Attachments',
|
||
|
multiple: true,
|
||
|
mimeTypes,
|
||
|
})
|
||
|
await uploadAttachments(files)
|
||
|
}
|
||
|
|
||
|
async function setDescription(att: mastodon.v1.MediaAttachment, description: string) {
|
||
|
att.description = description
|
||
|
await masto.v1.mediaAttachments.update(att.id, { description: att.description })
|
||
|
}
|
||
|
|
||
|
function removeAttachment(index: number) {
|
||
|
draft.attachments.splice(index, 1)
|
||
|
}
|
||
|
|
||
|
async function onDrop(files: File[] | null) {
|
||
|
if (files)
|
||
|
await uploadAttachments(files)
|
||
|
}
|
||
|
|
||
|
const { isOverDropZone } = useDropZone(dropZoneRef, onDrop)
|
||
|
|
||
|
return $$({
|
||
|
isUploading,
|
||
|
isExceedingAttachmentLimit,
|
||
|
failedAttachments,
|
||
|
isOverDropZone,
|
||
|
|
||
|
uploadAttachments,
|
||
|
pickAttachments,
|
||
|
setDescription,
|
||
|
removeAttachment,
|
||
|
})
|
||
|
}
|