Refactor composer state for threads (#5945)

* Refactor composer state for threads

* Remove unnecessary default case

TS can see it's exhaustive.
This commit is contained in:
dan
2024-10-29 20:27:44 +00:00
committed by GitHub
parent 3bf91eb814
commit bab44a5a13
4 changed files with 130 additions and 62 deletions
+73 -31
View File
@@ -47,19 +47,15 @@ export type EmbedDraft = {
link: Link | undefined
}
export type ComposerDraft = {
export type PostDraft = {
richtext: RichText
labels: SelfLabel[]
postgate: AppBskyFeedPostgate.Record
threadgate: ThreadgateAllowUISetting[]
embed: EmbedDraft
}
export type ComposerAction =
export type PostAction =
| {type: 'update_richtext'; richtext: RichText}
| {type: 'update_labels'; labels: SelfLabel[]}
| {type: 'update_postgate'; postgate: AppBskyFeedPostgate.Record}
| {type: 'update_threadgate'; threadgate: ThreadgateAllowUISetting[]}
| {type: 'embed_add_images'; images: ComposerImage[]}
| {type: 'embed_update_image'; image: ComposerImage}
| {type: 'embed_remove_image'; image: ComposerImage}
@@ -77,12 +73,65 @@ export type ComposerAction =
| {type: 'embed_update_gif'; alt: string}
| {type: 'embed_remove_gif'}
export type ThreadDraft = {
posts: PostDraft[]
postgate: AppBskyFeedPostgate.Record
threadgate: ThreadgateAllowUISetting[]
}
export type ComposerState = {
thread: ThreadDraft
activePostIndex: number // TODO: Add actions to update this.
}
export type ComposerAction =
| {type: 'update_postgate'; postgate: AppBskyFeedPostgate.Record}
| {type: 'update_threadgate'; threadgate: ThreadgateAllowUISetting[]}
| {type: 'update_post'; postAction: PostAction}
export const MAX_IMAGES = 4
export function composerReducer(
state: ComposerDraft,
state: ComposerState,
action: ComposerAction,
): ComposerDraft {
): ComposerState {
switch (action.type) {
case 'update_postgate': {
return {
...state,
thread: {
...state.thread,
postgate: action.postgate,
},
}
}
case 'update_threadgate': {
return {
...state,
thread: {
...state.thread,
threadgate: action.threadgate,
},
}
}
case 'update_post': {
const nextPosts = [...state.thread.posts]
nextPosts[state.activePostIndex] = postReducer(
state.thread.posts[state.activePostIndex],
action.postAction,
)
return {
...state,
thread: {
...state.thread,
posts: nextPosts,
},
}
}
}
}
function postReducer(state: PostDraft, action: PostAction): PostDraft {
switch (action.type) {
case 'update_richtext': {
return {
@@ -96,18 +145,6 @@ export function composerReducer(
labels: action.labels,
}
}
case 'update_postgate': {
return {
...state,
postgate: action.postgate,
}
}
case 'update_threadgate': {
return {
...state,
threadgate: action.threadgate,
}
}
case 'embed_add_images': {
if (action.images.length === 0) {
return state
@@ -339,8 +376,6 @@ export function composerReducer(
},
}
}
default:
return state
}
}
@@ -354,7 +389,7 @@ export function createComposerState({
initMention: string | undefined
initImageUris: ComposerOpts['imageUris']
initQuoteUri: string | undefined
}): ComposerDraft {
}): ComposerState {
let media: ImagesMedia | undefined
if (initImageUris?.length) {
media = {
@@ -385,14 +420,21 @@ export function createComposerState({
: '',
})
return {
richtext: initRichText,
labels: [],
postgate: createPostgateRecord({post: ''}),
threadgate: threadgateViewToAllowUISetting(undefined),
embed: {
quote,
media,
link: undefined,
activePostIndex: 0,
thread: {
posts: [
{
richtext: initRichText,
labels: [],
embed: {
quote,
media,
link: undefined,
},
},
],
postgate: createPostgateRecord({post: ''}),
threadgate: threadgateViewToAllowUISetting(undefined),
},
}
}