Refactor composer state for threads (#5945)

* Refactor composer state for threads

* Remove unnecessary default case

TS can see it's exhaustive.

1 files changed, 69 insertions, 27 deletions

diff --git a/src/view/com/composer/state/composer.ts b/src/view/com/composer/state/composer.ts
index 3c1edb6bd..958718eaf 100644
--- a/src/view/com/composer/state/composer.ts
+++ b/src/view/com/composer/state/composer.ts
@@ -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,35 +73,76 @@ 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_richtext': {
+    case 'update_postgate': {
       return {
         ...state,
-        richtext: action.richtext,
+        thread: {
+          ...state.thread,
+          postgate: action.postgate,
+        },
       }
     }
-    case 'update_labels': {
+    case 'update_threadgate': {
       return {
         ...state,
-        labels: action.labels,
+        thread: {
+          ...state.thread,
+          threadgate: action.threadgate,
+        },
       }
     }
-    case 'update_postgate': {
+    case 'update_post': {
+      const nextPosts = [...state.thread.posts]
+      nextPosts[state.activePostIndex] = postReducer(
+        state.thread.posts[state.activePostIndex],
+        action.postAction,
+      )
       return {
         ...state,
-        postgate: action.postgate,
+        thread: {
+          ...state.thread,
+          posts: nextPosts,
+        },
       }
     }
-    case 'update_threadgate': {
+  }
+}
+
+function postReducer(state: PostDraft, action: PostAction): PostDraft {
+  switch (action.type) {
+    case 'update_richtext': {
       return {
         ...state,
-        threadgate: action.threadgate,
+        richtext: action.richtext,
+      }
+    }
+    case 'update_labels': {
+      return {
+        ...state,
+        labels: action.labels,
       }
     }
     case 'embed_add_images': {
@@ -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),
     },
   }
 }