Added loading state for messagecomposer; Improved threads layout;

homebase-id · Jan 7, 2025 · 8f3801d · 8f3801d
1 parent f09f650
commit 8f3801d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 9 deletions.
diff --git a/packages/apps/community-app/src/components/Community/Message/composer/MessageComposer.tsx b/packages/apps/community-app/src/components/Community/Message/composer/MessageComposer.tsx
@@ -220,7 +220,11 @@ export const MessageComposer = ({
             }
           }}
         >
-          <Suspense>
+          <Suspense
+            fallback={
+              <div className="relative h-[119px] w-full border-t bg-background px-2 pb-1 dark:border-slate-800 md:rounded-md md:border" />
+            }
+          >
             <RichTextEditor
               className="relative w-8 flex-grow border-t bg-background px-2 pb-1 dark:border-slate-800 md:rounded-md md:border"
               contentClassName="max-h-[50vh] overflow-auto"

diff --git a/packages/apps/community-app/src/templates/Community/CommunityThreadsCatchup.tsx b/packages/apps/community-app/src/templates/Community/CommunityThreadsCatchup.tsx
@@ -63,20 +63,17 @@ export const CommunityThreadsCatchup = memo(() => {
               {!flatThreadMetas?.length ? (
                 <p className="m-auto text-lg">{t('No threads found')}</p>
               ) : (
-                <div
-                  className="relative flex h-20 flex-grow flex-col overflow-auto p-3"
-                  ref={scrollRef}
-                >
+                <div className="relative h-20 flex-grow flex-col overflow-auto p-3" ref={scrollRef}>
                   <div
-                    className="relative w-full flex-shrink-0 flex-grow-0 overflow-hidden"
+                    className="relative w-full overflow-hidden"
                     style={{
                       height: virtualizer.getTotalSize(),
                     }}
                   >
                     <div
-                      className="absolute left-0 top-0 flex h-full w-full flex-col"
+                      className="absolute left-0 top-0 w-full"
                       style={{
-                        transform: `translateY(${items[0]?.start ?? 0}px)`,
+                        transform: `translateY(${items[0]?.start - virtualizer.options.scrollMargin}px)`,
                       }}
                     >
                       {items.map((item) => {
@@ -86,7 +83,7 @@ export const CommunityThreadsCatchup = memo(() => {
                             key={item.key}
                             data-index={item.index}
                             ref={virtualizer.measureElement}
-                            className="flex-shrink-0 pb-3 last-of-type:pb-0"
+                            className="pb-3 last-of-type:pb-0"
                           >
                             {threadMeta ? (
                               <CommunityThreadCatchup