commit: 02e2e6b1bf635c8f39af2b40904bc64cc7166bf9
parent 1edada7e9dc05e2ae837acb9ea196e2f7e351e3a
Author: tusooa <tusooa@kazv.moe>
Date: Fri, 10 Mar 2023 12:10:39 -0500
Add minimal draft management tool
Diffstat:
10 files changed, 188 insertions(+), 47 deletions(-)
diff --git a/src/boot/routes.js b/src/boot/routes.js
@@ -26,6 +26,7 @@ import ListsEdit from 'components/lists_edit/lists_edit.vue'
import NavPanel from 'src/components/nav_panel/nav_panel.vue'
import AnnouncementsPage from 'components/announcements_page/announcements_page.vue'
import QuotesTimeline from '../components/quotes_timeline/quotes_timeline.vue'
+import Drafts from 'components/drafts/drafts.vue'
export default (store) => {
const validateAuthenticatedRoute = (to, from, next) => {
@@ -80,6 +81,7 @@ export default (store) => {
{ name: 'who-to-follow', path: '/who-to-follow', component: WhoToFollow, beforeEnter: validateAuthenticatedRoute },
{ name: 'about', path: '/about', component: About },
{ name: 'announcements', path: '/announcements', component: AnnouncementsPage },
+ { name: 'drafts', path: '/drafts', component: Drafts },
{ name: 'user-profile', path: '/users/:name', component: UserProfile },
{ name: 'legacy-user-profile', path: '/:name', component: UserProfile },
{ name: 'lists', path: '/lists', component: Lists },
diff --git a/src/components/draft/draft.js b/src/components/draft/draft.js
@@ -0,0 +1,42 @@
+import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
+
+const Draft = {
+ components: {
+ PostStatusForm
+ },
+ props: {
+ draft: {
+ type: Object,
+ required: true
+ }
+ },
+ data () {
+ return {
+ editing: false
+ }
+ },
+ computed: {
+ relAttrs () {
+ if (this.draft.type === 'edit') {
+ return { statusId: this.draft.refId }
+ } else if (this.draft.type === 'reply') {
+ return { replyTo: this.draft.refId }
+ } else {
+ return {}
+ }
+ },
+ postStatusFormProps () {
+ return {
+ draftId: this.draft.id,
+ ...this.relAttrs
+ }
+ }
+ },
+ methods: {
+ toggleEditing () {
+ this.editing = !this.editing
+ }
+ }
+}
+
+export default Draft
diff --git a/src/components/draft/draft.vue b/src/components/draft/draft.vue
@@ -0,0 +1,35 @@
+<template>
+ <article class="Draft">
+ <div>
+ {{ draft.id }}
+ </div>
+ <div v-if="draft.inReplyToStatusId">
+ {{ draft.inReplyToStatusId }}
+ </div>
+ <div
+ class="draft-content"
+ >
+ {{ draft.status }}
+ </div>
+ <div>
+ <button
+ class="btn button-default"
+ :aria-expanded="editing"
+ @click.prevent.stop="toggleEditing"
+ >
+ {{ $t('drafts.continue') }}
+ </button>
+ </div>
+ <div v-if="editing">
+ <PostStatusForm v-bind="postStatusFormProps" />
+ </div>
+ </article>
+</template>
+
+<script src="./draft.js"></script>
+
+<style lang="scss">
+.Draft {
+ margin: 1em;
+}
+</style>
diff --git a/src/components/drafts/drafts.js b/src/components/drafts/drafts.js
@@ -0,0 +1,17 @@
+import Draft from 'src/components/draft/draft.vue'
+import List from 'src/components/list/list.vue'
+
+const Drafts = {
+ components: {
+ Draft,
+ List
+ },
+ computed: {
+ drafts () {
+ console.debug('available drafts:', this.$store.getters.draftsArray)
+ return this.$store.getters.draftsArray
+ }
+ }
+}
+
+export default Drafts
diff --git a/src/components/drafts/drafts.vue b/src/components/drafts/drafts.vue
@@ -0,0 +1,24 @@
+<template>
+ <div class="Drafts">
+ <div class="panel panel-default">
+ <div class="panel-heading">
+ <div class="title">
+ {{ $t('drafts.drafts') }}
+ </div>
+ </div>
+ <div class="panel-body">
+ <List
+ :items="drafts"
+ >
+ <template #item="{ item: draft }">
+ <Draft
+ :draft="draft"
+ />
+ </template>
+ </List>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script src="./drafts.js"></script>
diff --git a/src/components/nav_panel/nav_panel.js b/src/components/nav_panel/nav_panel.js
@@ -19,7 +19,8 @@ import {
faInfoCircle,
faStream,
faList,
- faBullhorn
+ faBullhorn,
+ faFilePen
} from '@fortawesome/free-solid-svg-icons'
library.add(
@@ -34,7 +35,8 @@ library.add(
faInfoCircle,
faStream,
faList,
- faBullhorn
+ faBullhorn,
+ faFilePen
)
const NavPanel = {
props: ['forceExpand', 'forceEditMode'],
diff --git a/src/components/navigation/navigation.js b/src/components/navigation/navigation.js
@@ -78,6 +78,11 @@ export const ROOT_ITEMS = {
label: 'nav.announcements',
badgeGetter: 'unreadAnnouncementCount',
criteria: ['announcements']
+ },
+ drafts: {
+ route: 'drafts',
+ icon: 'file-pen',
+ label: 'nav.drafts'
}
}
diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
@@ -141,59 +141,48 @@ const PostStatusForm = {
const [statusType, refId] = typeAndRefId({ replyTo: this.replyTo, profileMention: this.profileMention, statusId: this.statusId })
- if (statusType === 'reply' || statusType === 'mention') {
- const currentUser = this.$store.state.users.currentUser
- statusText = buildMentionsString({ user: this.repliedUser, attentions: this.attentions }, currentUser)
- }
+ let statusParams = this.getDraft(statusType, refId)
- const scope = ((this.copyMessageScope && scopeCopy) || this.copyMessageScope === 'direct')
- ? this.copyMessageScope
- : this.$store.state.users.currentUser.default_scope
-
- const { postContentType: contentType, sensitiveByDefault } = this.$store.getters.mergedConfig
-
- let statusParams = {
- type: statusType,
- refId,
- spoilerText: this.subject || '',
- status: statusText,
- nsfw: !!sensitiveByDefault,
- files: [],
- poll: {},
- mediaDescriptions: {},
- visibility: scope,
- contentType
- }
+ if (!statusParams) {
+ if (statusType === 'reply' || statusType === 'mention') {
+ const currentUser = this.$store.state.users.currentUser
+ statusText = buildMentionsString({ user: this.repliedUser, attentions: this.attentions }, currentUser)
+ }
+
+ const scope = ((this.copyMessageScope && scopeCopy) || this.copyMessageScope === 'direct')
+ ? this.copyMessageScope
+ : this.$store.state.users.currentUser.default_scope
+
+ const { postContentType: contentType, sensitiveByDefault } = this.$store.getters.mergedConfig
- if (statusType === 'edit') {
- const statusContentType = this.statusContentType || contentType
statusParams = {
type: statusType,
refId,
spoilerText: this.subject || '',
- status: this.statusText || '',
- nsfw: this.statusIsSensitive || !!sensitiveByDefault,
- files: this.statusFiles || [],
- poll: this.statusPoll || {},
- mediaDescriptions: this.statusMediaDescriptions || {},
- visibility: this.statusScope || scope,
- contentType: statusContentType,
+ status: statusText,
+ nsfw: !!sensitiveByDefault,
+ files: [],
+ poll: {},
+ mediaDescriptions: {},
+ visibility: scope,
+ contentType,
quoting: false
}
- }
- console.debug('type and ref:', [statusType, refId])
-
- const maybeDraft = this.$store.state.drafts.drafts[this.draftId]
- if (this.draftId && maybeDraft) {
- console.debug('current draft:', maybeDraft)
- statusParams = maybeDraft
- } else {
- const existingDrafts = this.$store.getters.draftsByTypeAndRefId(statusType, refId)
-
- console.debug('existing drafts:', existingDrafts)
- if (existingDrafts.length) {
- statusParams = existingDrafts[0]
+ if (statusType === 'edit') {
+ const statusContentType = this.statusContentType || contentType
+ statusParams = {
+ type: statusType,
+ refId,
+ spoilerText: this.subject || '',
+ status: this.statusText || '',
+ nsfw: this.statusIsSensitive || !!sensitiveByDefault,
+ files: this.statusFiles || [],
+ poll: this.statusPoll || {},
+ mediaDescriptions: this.statusMediaDescriptions || {},
+ visibility: this.statusScope || scope,
+ contentType: statusContentType
+ }
}
}
@@ -717,6 +706,23 @@ const PostStatusForm = {
}
})
}
+ },
+ getDraft (statusType, refId) {
+ console.debug('type and ref:', [statusType, refId])
+
+ const maybeDraft = this.$store.state.drafts.drafts[this.draftId]
+ if (this.draftId && maybeDraft) {
+ console.debug('current draft:', maybeDraft)
+ return maybeDraft
+ } else {
+ const existingDrafts = this.$store.getters.draftsByTypeAndRefId(statusType, refId)
+
+ console.debug('existing drafts:', existingDrafts)
+ if (existingDrafts.length) {
+ return existingDrafts[0]
+ }
+ }
+ // No draft available, fall back
}
}
}
diff --git a/src/i18n/en.json b/src/i18n/en.json
@@ -190,7 +190,8 @@
"mobile_notifications_close": "Close notifications",
"mobile_notifications_mark_as_seen": "Mark all as seen",
"announcements": "Announcements",
- "quotes": "Quotes"
+ "quotes": "Quotes",
+ "drafts": "Drafts"
},
"notifications": {
"broken_favorite": "Unknown status, searching for it…",
@@ -1401,5 +1402,9 @@
},
"unicode_domain_indicator": {
"tooltip": "This domain contains non-ascii characters."
+ },
+ "drafts": {
+ "drafts": "Drafts",
+ "continue": "Continue editing"
}
}
diff --git a/src/modules/drafts.js b/src/modules/drafts.js
@@ -22,6 +22,9 @@ export const getters = {
return (type, refId) => {
return Object.values(state.drafts).filter(draft => draft.type === type && draft.refId === refId)
}
+ },
+ draftsArray (state) {
+ return Object.values(state.drafts)
}
}
