@levo-so/blocks 0.1.60 → 0.1.62

package/src/blocks/community/community-1.tsx

@@ -1,449 +1,36 @@
+import type {
+  IForum,
+  IForumJoinRequest,
+  IForumMembershipStatus,
+  IForumPost,
+  IResponseMultiple,
+  IResponseSingle,
+} from "@levo-so/core";
+import { getLevoError } from "@levo-so/core";
+import { useLevo } from "@levo-so/react";
 import {
-  type ILevoBlockBaseProps,
-  Heading,
-  Typography,
-  Container,
-  Section,
   Box,
-  ForumPost,
   Button,
-  Skeleton,
-  Image,
+  CategoryFilter,
+  Container,
+  CreateForumPost,
+  ForumPost,
+  ForumProvider,
+  Heading,
+  type ILevoBlockBaseProps,
   Media,
+  PostsRestrictionOverlay,
+  SamplePostSkeleton,
+  SearchInput,
+  Section,
+  Skeleton,
+  Typography,
+  useAuth,
 } from "@levo-so/studio";
 import { useCallback, useEffect, useRef, useState } from "react";
-import { useLevo } from "@levo-so/react";
-import type {
-  IForumPost,
-  ILevoMembership,
-  IResponseMultiple,
-} from "@levo-so/core";
 
 import type { ICommunity1Content } from "./community-1.schema";
 
-const LINK_METADATA = {
-  url: "https://example.com/renewable-energy-breakthrough",
-  title: "New Battery Technology Increases Storage Capacity by 300%",
-  description:
-    "Researchers at MIT have developed a revolutionary battery technology that could transform renewable energy storage, making solar and wind power more viable for 24/7 use.",
-  image: "https://picsum.photos/800/400?random=4",
-  domain: "example.com",
-};
-
-const TEST_USER: ILevoMembership.Account = {
-  _id: "USER_ID",
-  first_name: "Jane",
-  last_name: "Doe",
-  slug: "jane-doe",
-  username: "janedoeofficial",
-  email: "jane@example.com",
-  display_email: "jane@example.com",
-  reducted_email: "j***@e****.com",
-  email_verified: true,
-  email_verified_at: new Date().toISOString(),
-  verified_at: new Date().toISOString(),
-  mobile: null,
-  reducted_mobile: null,
-  mobile_verified: false,
-  mobile_verified_at: null,
-  profile_picture: {
-    id: "OaJDFLqx2UQyN",
-    kind: "image",
-    location: "https://github.com/shadcn.png",
-    srcset: {
-      "1080w": "https://github.com/shadcn.png",
-      "1200w": "https://github.com/shadcn.png",
-      "1920w": "https://github.com/shadcn.png",
-      "320w": "https://github.com/shadcn.png",
-      "640w": "https://github.com/shadcn.png",
-      "750w": "https://github.com/shadcn.png",
-      "828w": "https://github.com/shadcn.png",
-      path: "https://github.com/shadcn.png",
-    },
-  },
-  oauth_credentials: [],
-  account_locked_at: null,
-  credentials_expired_at: null,
-  deactivated_at: null,
-  last_access_at: new Date().toISOString(),
-  flagged_at: null,
-  created_at: new Date().toISOString(),
-  updated_at: new Date().toISOString(),
-  deleted_at: null,
-};
-
-const SAMPLE_FORUM_POSTS: IResponseMultiple<IForumPost> = {
-  content: {
-    data: [
-      {
-        _id: "7403047340596025651",
-        comments_count: 0,
-        content:
-          "<p>Hey, This is a content post. <br><br>Good Luck with the rest.</p>",
-        created_at: "2025-12-06T12:27:07.966Z",
-        created_by: TEST_USER,
-        expires_at: null,
-        kind: "post",
-        upvote_count: 50,
-        downvote_count: 10,
-        upvoted_at: null,
-        downvoted_at: "2025-12-06T12:28:33.774Z",
-        media: [],
-        metadata: null,
-        published_at: "2025-12-06T12:27:07.966Z",
-        show_participant_list: false,
-        show_participant_vote: true,
-        slug: "ui-content-post",
-        url: "",
-        title: "UI: Content Post",
-        updated_at: "2025-12-06T12:27:07.966Z",
-        deleted_at: null,
-        deleted_by: null,
-        vote_count: null,
-        options: [],
-      },
-      {
-        _id: "7403047700499286828",
-        comments_count: 0,
-        content:
-          "<p>This is a gallery post.<br><br>Good Luck with the rest.</p>",
-        created_at: "2025-12-06T12:28:33.774Z",
-        created_by: null,
-        expires_at: null,
-        kind: "gallery",
-        upvoted_at: "2025-12-06T12:28:33.774Z",
-        downvoted_at: null,
-        upvote_count: 23,
-        downvote_count: 66,
-        media: [
-          {
-            id: "uY2rOYbtH2WKZ",
-            location:
-              "https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP.jpg",
-            mimetype: "image/jpeg",
-            kind: "image",
-            srcset: {
-              "1080w":
-                "https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-1080w.webp",
-              "1200w":
-                "https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-1200w.webp",
-              "1920w":
-                "https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-1920w.webp",
-              "320w":
-                "https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-320w.webp",
-              "640w":
-                "https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-640w.webp",
-              "750w":
-                "https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-750w.webp",
-              "828w":
-                "https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-828w.webp",
-              path: "https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-1080w.webp 1080w, https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-1200w.webp 1200w, https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-1920w.webp 1920w, https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-320w.webp 320w, https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-640w.webp 640w, https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-750w.webp 750w, https://static.levostg.online/WZZKMUBH/wp2845973-itachi-anbu-wallpaper-CISpLrr9FxcTP-828w.webp 828w",
-            },
-          },
-          {
-            id: "lDig3GwIc8cuX",
-            location:
-              "https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr.jpg",
-            mimetype: "image/jpeg",
-            kind: "image",
-            srcset: {
-              "1080w":
-                "https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-1080w.webp",
-              "1200w":
-                "https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-1200w.webp",
-              "1920w":
-                "https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-1920w.webp",
-              "320w":
-                "https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-320w.webp",
-              "640w":
-                "https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-640w.webp",
-              "750w":
-                "https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-750w.webp",
-              "828w":
-                "https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-828w.webp",
-              path: "https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-320w.webp 320w, https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-1080w.webp 1080w, https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-750w.webp 750w, https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-640w.webp 640w, https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-828w.webp 828w, https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-1200w.webp 1200w, https://static.levostg.online/WZZKMUBH/7-Must-Have-Features-for-a-Food-Beverage-ERP-system-Softype-Inc-Netsuite-Alliance-Partner-moxx13I6bnlIr-1920w.webp 1920w",
-            },
-          },
-          {
-            id: "MqnM9ygQVs3aI",
-            location:
-              "https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3.jpg",
-            mimetype: "image/jpeg",
-            kind: "image",
-            srcset: {
-              "1080w":
-                "https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-1080w.webp",
-              "1200w":
-                "https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-1200w.webp",
-              "1920w":
-                "https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-1920w.webp",
-              "320w":
-                "https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-320w.webp",
-              "640w":
-                "https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-640w.webp",
-              "750w":
-                "https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-750w.webp",
-              "828w":
-                "https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-828w.webp",
-              path: "https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-320w.webp 320w, https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-640w.webp 640w, https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-750w.webp 750w, https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-828w.webp 828w, https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-1080w.webp 1080w, https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-1200w.webp 1200w, https://static.levostg.online/WZZKMUBH/The-Future-of-Retail-Covid-19-Softype-Inc-Blog-Update-xloAzCSXADxN3-1920w.webp 1920w",
-            },
-          },
-          {
-            id: "xloJuCSXADUpL",
-            location:
-              "https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm.jpg",
-            mimetype: "image/jpeg",
-            kind: "image",
-            srcset: {
-              "1080w":
-                "https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-1080w.webp",
-              "1200w":
-                "https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-1200w.webp",
-              "1920w":
-                "https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-1920w.webp",
-              "320w":
-                "https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-320w.webp",
-              "640w":
-                "https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-640w.webp",
-              "750w":
-                "https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-750w.webp",
-              "828w":
-                "https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-828w.webp",
-              path: "https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-1920w.webp 1920w, https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-320w.webp 320w, https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-828w.webp 828w, https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-750w.webp 750w, https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-640w.webp 640w, https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-1200w.webp 1200w, https://static.levostg.online/WZZKMUBH/3-tips-for-successful-Accounts-Payable-Management-Softype-INC-4JOrxlk9pfgLm-1080w.webp 1080w",
-            },
-          },
-          {
-            id: "4JO75lk9pfVoz",
-            location:
-              "https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk.jpg",
-            mimetype: "image/jpeg",
-            kind: "image",
-            srcset: {
-              "1080w":
-                "https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-1080w.webp",
-              "1200w":
-                "https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-1200w.webp",
-              "1920w":
-                "https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-1920w.webp",
-              "320w":
-                "https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-320w.webp",
-              "640w":
-                "https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-640w.webp",
-              "750w":
-                "https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-750w.webp",
-              "828w":
-                "https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-828w.webp",
-              path: "https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-1200w.webp 1200w, https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-1920w.webp 1920w, https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-320w.webp 320w, https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-640w.webp 640w, https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-750w.webp 750w, https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-1080w.webp 1080w, https://static.levostg.online/WZZKMUBH/shutterstock572315812-xloAsCSXADxFk-828w.webp 828w",
-            },
-          },
-          {
-            id: "1d74SLgA5aCsp",
-            location:
-              "https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D.jpg",
-            mimetype: "image/jpeg",
-            kind: "image",
-            srcset: {
-              "1080w":
-                "https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-1080w.webp",
-              "1200w":
-                "https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-1200w.webp",
-              "1920w":
-                "https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-1920w.webp",
-              "320w":
-                "https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-320w.webp",
-              "640w":
-                "https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-640w.webp",
-              "750w":
-                "https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-750w.webp",
-              "828w":
-                "https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-828w.webp",
-              path: "https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-1920w.webp 1920w, https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-320w.webp 320w, https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-750w.webp 750w, https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-640w.webp 640w, https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-828w.webp 828w, https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-1080w.webp 1080w, https://static.levostg.online/WZZKMUBH/7-reasons-NetSuite-is-Worlds-1-Cloud-Financial-Accounting-Software-Softype-Inc-74dEtDIGEyR4D-1200w.webp 1200w",
-            },
-          },
-          {
-            id: "GLUJwcipcQ1DJ",
-            location:
-              "https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX.jpg",
-            mimetype: "image/jpeg",
-            kind: "image",
-            srcset: {
-              "1080w":
-                "https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-1080w.webp",
-              "1200w":
-                "https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-1200w.webp",
-              "1920w":
-                "https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-1920w.webp",
-              "320w":
-                "https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-320w.webp",
-              "640w":
-                "https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-640w.webp",
-              "750w":
-                "https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-750w.webp",
-              "828w":
-                "https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-828w.webp",
-              path: "https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-320w.webp 320w, https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-640w.webp 640w, https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-828w.webp 828w, https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-750w.webp 750w, https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-1080w.webp 1080w, https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-1200w.webp 1200w, https://static.levostg.online/WZZKMUBH/Building-an-Effective-and-Efficient-Sales-Workforce-in-the-New-Normal-Softype-Inc-XZbIObcKFJZWX-1920w.webp 1920w",
-            },
-          },
-          {
-            id: "A8sdO1BeFXg2Q",
-            location:
-              "https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz.jpg",
-            mimetype: "image/jpeg",
-            kind: "image",
-            srcset: {
-              "1080w":
-                "https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-1080w.webp",
-              "1200w":
-                "https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-1200w.webp",
-              "1920w":
-                "https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-1920w.webp",
-              "320w":
-                "https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-320w.webp",
-              "640w":
-                "https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-640w.webp",
-              "750w":
-                "https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-750w.webp",
-              "828w":
-                "https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-828w.webp",
-              path: "https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-828w.webp 828w, https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-1080w.webp 1080w, https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-1200w.webp 1200w, https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-1920w.webp 1920w, https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-320w.webp 320w, https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-750w.webp 750w, https://static.levostg.online/WZZKMUBH/Learning-to-Go-Live-Lessons-From-The-Pandemic-Trenches-Softype-INC-30WLnpdHjSoUz-640w.webp 640w",
-            },
-          },
-        ],
-        metadata: null,
-        published_at: "2025-12-06T12:28:33.774Z",
-        show_participant_list: false,
-        show_participant_vote: true,
-        slug: "ui-gallery-post",
-        url: "",
-        title: "UI: Gallery Post",
-        updated_at: "2025-12-06T12:28:33.774Z",
-        deleted_at: null,
-        deleted_by: null,
-        vote_count: null,
-        options: [],
-      },
-      {
-        _id: "7403048140069180235",
-        comments_count: 0,
-        content:
-          "<p>Hey, This is a Poll Post.<br><br>Good Luck with the rest.</p>",
-        created_at: "2025-12-06T12:30:18.575Z",
-        created_by: TEST_USER,
-        expires_at: "2026-12-31T12:30:00.000Z",
-        kind: "poll",
-        upvoted_at: "2025-12-06T12:28:33.774Z",
-        downvoted_at: null,
-        upvote_count: 100,
-        downvote_count: 1,
-        media: [],
-        metadata: null,
-        published_at: "2025-12-06T12:30:18.575Z",
-        show_participant_list: true,
-        show_participant_vote: true,
-        slug: "ui-this-is-a-poll",
-        url: "",
-        title: "UI: Poll Post",
-        updated_at: "2025-12-06T12:30:18.575Z",
-        deleted_at: null,
-        deleted_by: null,
-        vote_count: 16,
-        user_voted_option: "7403048138708901408",
-        options: [
-          {
-            _id: "7403048138708668754",
-            label: "Poll Option 1",
-            count: 4,
-          },
-          {
-            _id: "7403048138710723182",
-            label: "Poll Option 2",
-            count: 8,
-          },
-          {
-            _id: "7403048138708304207",
-            label: "Poll Option 3",
-            count: 3,
-          },
-          {
-            _id: "7403048138708901408",
-            label: "Poll Option 4",
-            count: 1,
-          },
-        ],
-      },
-      {
-        _id: "7403048494051511085",
-        comments_count: 0,
-        content:
-          "<p>Hey, This is a link post.<br><br>Good luck with the rest.</p>",
-        created_at: "2025-12-06T12:31:42.971Z",
-        created_by: TEST_USER,
-        expires_at: null,
-        kind: "link",
-        upvoted_at: null,
-        downvoted_at: "2025-12-06T12:28:33.774Z",
-        upvote_count: 60,
-        downvote_count: 10,
-        media: [],
-        metadata: null,
-        published_at: "2025-12-06T12:31:42.971Z",
-        show_participant_list: false,
-        show_participant_vote: true,
-        slug: "ui-link-post",
-        url: "https://www.youtube.com/",
-        title: "UI: Link Post",
-        updated_at: "2025-12-06T12:31:42.971Z",
-        deleted_at: null,
-        deleted_by: null,
-        vote_count: null,
-        options: [],
-      },
-      {
-        _id: "7403048494051511085",
-        comments_count: 0,
-        content:
-          "<p>Hey, This is a link post.<br><br>Good luck with the rest.</p>",
-        created_at: "2025-12-06T12:31:42.971Z",
-        created_by: TEST_USER,
-        expires_at: null,
-        kind: "link",
-        upvote_count: 50,
-        downvote_count: 97,
-        upvoted_at: null,
-        downvoted_at: "2025-12-06T12:28:33.774Z",
-        media: [],
-        metadata: {
-          meta_title: LINK_METADATA?.title,
-          meta_description: LINK_METADATA?.description,
-          og_image: {
-            id: "uY2rOYbtH2WKZ",
-            location: LINK_METADATA?.image,
-            mimetype: "image/jpeg",
-            kind: "image",
-          },
-        },
-        published_at: "2025-12-06T12:31:42.971Z",
-        show_participant_list: false,
-        show_participant_vote: true,
-        slug: "ui-link-post-2",
-        url: LINK_METADATA?.url,
-        title: "UI: Link Post 2",
-        updated_at: "2025-12-06T12:31:42.971Z",
-        deleted_at: null,
-        deleted_by: null,
-        vote_count: null,
-        options: [],
-      },
-    ] as any,
-
-    meta: {
-      pages: 1,
-      total: 2,
-    },
-  },
-  status: true,
-};
-
 const PostSkeleton: React.FC = () => {
   return (
     <div className="flex flex-col gap-3 rounded-lg border border-[#E5E5E5] bg-white p-3">
@@ -476,13 +63,21 @@ const PostSkeleton: React.FC = () => {
   );
 };
 
+/** Map API error codes to user-friendly messages */
+const JOIN_REQUEST_ERROR_MESSAGES: { [key: number]: string } = {
+  12111: "This forum doesn't require join requests.",
+  12112: "Join requests are not enabled for this forum.",
+  12113: "You are already a member of this forum.",
+  12114: "You have already submitted a join request.",
+};
+
 const MAX_RETRY_ATTEMPTS = 3;
 
-const Community1: React.FC<ILevoBlockBaseProps<ICommunity1Content>> = ({
-  content,
-}) => {
+const Community1: React.FC<ILevoBlockBaseProps<ICommunity1Content>> = ({ content }) => {
   const levoClient = useLevo();
+  const { isLoggedIn } = useAuth();
   const observerTarget = useRef<HTMLDivElement>(null);
+  const searchTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   const [isLoading, setIsLoading] = useState(true);
   const [isFetchingMore, setIsFetchingMore] = useState(false);
@@ -491,6 +86,107 @@ const Community1: React.FC<ILevoBlockBaseProps<ICommunity1Content>> = ({
   const [hasMore, setHasMore] = useState(true);
   const [failedAttempts, setFailedAttempts] = useState(0);
   const [hasError, setHasError] = useState(false);
+  const [forumData, setForumData] = useState<IForum | null>(null);
+  const [isMember, setIsMember] = useState<boolean>(false);
+  const [isLoadingMembership, setIsLoadingMembership] = useState(false);
+  const [searchQuery, setSearchQuery] = useState("");
+  const [isSearching, setIsSearching] = useState(false);
+  const hasFetchedMembershipRef = useRef(false);
+
+  const [selectedCategories, setSelectedCategories] = useState<string[]>([]);
+
+  // Track initial mount to prevent duplicate fetches
+  const isInitialMountRef = useRef(true);
+
+  // Join request state
+  const [joinRequest, setJoinRequest] = useState<IForumJoinRequest | null>(null);
+
+  const forumKey = content?.forum_key as unknown as string;
+
+  useEffect(() => {
+    return () => {
+      if (searchTimeoutRef.current) {
+        clearTimeout(searchTimeoutRef.current);
+      }
+    };
+  }, []);
+
+  const fetchSingleForumData = useCallback(async () => {
+    try {
+      const response = await levoClient.fetch
+        .url(`/v1/community/${forumKey}/get-single`)
+        .get()
+        .json<IResponseSingle<IForum>>();
+
+      if (response?.content?.data) {
+        setForumData(response.content.data);
+      }
+
+      return response;
+    } catch (error) {
+      levoClient?.logger?.error("Error fetching single forum data:", error);
+      return null;
+    }
+  }, [forumKey]);
+
+  const checkMembership = useCallback(async () => {
+    if (!forumData?.settings?.invite_only || !isLoggedIn) {
+      setIsMember(false);
+      setJoinRequest(null);
+      hasFetchedMembershipRef.current = true;
+      return;
+    }
+
+    setIsLoadingMembership(true);
+
+    try {
+      const response = await levoClient.fetch
+        .url(`/v1/community/${forumKey}/member/get-me`)
+        .get()
+        .json<IResponseSingle<IForumMembershipStatus>>();
+
+      const data = response?.content?.data;
+      setIsMember(!!data?.member);
+      setJoinRequest(data?.join_request || null);
+    } catch (error) {
+      const levoError = getLevoError(error);
+      levoClient?.logger?.error("Error checking membership:", levoError);
+      setIsMember(false);
+      setJoinRequest(null);
+    } finally {
+      setIsLoadingMembership(false);
+      hasFetchedMembershipRef.current = true;
+    }
+  }, [forumKey, forumData?.settings?.invite_only, isLoggedIn, levoClient]);
+
+  /**
+   * Submit a join request for the current user
+   */
+  const handleSubmitJoinRequest = useCallback(
+    async (message?: string): Promise<boolean> => {
+      try {
+        const response = await levoClient.fetch
+          .url(`/v1/community/${forumKey}/join-request/submit`)
+          .post({ message })
+          .json<IResponseSingle<IForumJoinRequest>>();
+
+        if (response?.content?.data) {
+          setJoinRequest(response.content.data);
+          return true;
+        }
+        return false;
+      } catch (error) {
+        const levoError = getLevoError(error);
+        levoClient?.logger?.error("Failed to submit join request", levoError);
+
+        // Throw with user-friendly message
+        const errorMessage =
+          JOIN_REQUEST_ERROR_MESSAGES[levoError.code as any] || levoError.message;
+        throw new Error(errorMessage);
+      }
+    },
+    [forumKey, levoClient],
+  );
 
   const fetchPolls = useCallback(
     async (pageNumber: number, append = false) => {
@@ -501,16 +197,28 @@ const Community1: React.FC<ILevoBlockBaseProps<ICommunity1Content>> = ({
       }
 
       try {
-        const response = await levoClient.fetch
-          .url("/v1/community/forum/posts/list")
-          .post({
-            limit: 10,
-            page: pageNumber,
-            sort: {
-              created_at: "desc",
-            },
-          })
+        const requestBody: {
+          limit: number;
+          page: number;
+          sort: { created_at: "desc" };
+          where?: { categories: { in: string[] } };
+        } = {
+          limit: 10,
+          page: pageNumber,
+          sort: {
+            created_at: "desc",
+          },
+        };
 
+        if (selectedCategories.length > 0) {
+          requestBody.where = {
+            categories: { in: selectedCategories },
+          };
+        }
+
+        const response = await levoClient.fetch
+          .url(`/v1/community/${forumKey}/post/list`)
+          .post(requestBody)
           .json<IResponseMultiple<IForumPost>>();
 
         if (response && response?.content?.data) {
@@ -536,13 +244,133 @@ const Community1: React.FC<ILevoBlockBaseProps<ICommunity1Content>> = ({
         setIsFetchingMore(false);
       }
     },
-    [levoClient, failedAttempts],
+    [levoClient, forumKey, failedAttempts, selectedCategories],
   );
 
-  useEffect(() => {
-    fetchPolls(1, false);
+  const handleSearch = useCallback(
+    (query: string) => {
+      setSearchQuery(query);
+
+      if (searchTimeoutRef.current) {
+        clearTimeout(searchTimeoutRef.current);
+      }
+
+      if (!query.trim()) {
+        fetchPolls(1, false);
+        return;
+      }
+
+      searchTimeoutRef.current = setTimeout(async () => {
+        setIsSearching(true);
+        try {
+          const searchRequestBody: {
+            limit: number;
+            page: number;
+            sort: { created_at: "desc" };
+            search: string;
+            where?: { categories: { in: string[] } };
+          } = {
+            limit: 10,
+            page: 1,
+            sort: {
+              created_at: "desc",
+            },
+            search: query,
+          };
+
+          if (selectedCategories.length > 0) {
+            searchRequestBody.where = {
+              categories: { in: selectedCategories },
+            };
+          }
+
+          const response = await levoClient.fetch
+            .url(`/v1/community/${forumKey}/post/list`)
+            .post(searchRequestBody)
+            .json<IResponseMultiple<IForumPost>>();
+
+          if (response?.content?.data) {
+            setForumPosts(response.content.data);
+            setHasMore(false);
+          }
+        } catch (error) {
+          const levoError = getLevoError(error);
+          console.error("Search failed:", levoError);
+        } finally {
+          setIsSearching(false);
+        }
+      }, 500);
+    },
+    [forumKey, levoClient, fetchPolls, selectedCategories],
+  );
+
+  const handleCategoryToggle = useCallback((categoryId: string) => {
+    setSelectedCategories((prev) => {
+      const isSelected = prev.includes(categoryId);
+      return isSelected ? prev.filter((id) => id !== categoryId) : [...prev, categoryId];
+    });
+  }, []);
+
+  const handlePostCreated = useCallback((post: IForumPost) => {
+    setForumPosts((prev) => [post, ...prev]);
   }, []);
 
+  useEffect(() => {
+    fetchSingleForumData();
+  }, [fetchSingleForumData]);
+
+  useEffect(() => {
+    if (forumData) {
+      checkMembership();
+    }
+  }, [forumData, checkMembership]);
+
+  const isInviteOnly = forumData?.settings?.invite_only ?? false;
+  const allowJoinRequests = forumData?.settings?.allow_join_requests ?? false;
+
+  /** Whether membership check is still pending for invite-only forums */
+  const isMembershipCheckPending = isInviteOnly && !hasFetchedMembershipRef.current;
+
+  /**
+   * Check if posts should be restricted (show overlay):
+   * 1. For non-logged-in users: when invite_only=true
+   * 2. For logged-in non-members: when invite_only=true AND allow_public_view_for_post=false
+   * Note: Only evaluate after membership check is complete to avoid flash
+   */
+  const shouldRestrictPosts =
+    isInviteOnly &&
+    hasFetchedMembershipRef.current &&
+    !isLoadingMembership &&
+    (!isLoggedIn || (!isMember && !forumData?.settings?.allow_public_view_for_post));
+
+  /**
+   * Whether user can interact with posts (upvote/downvote):
+   * - Not invite-only: true (login modal will show if not logged in)
+   * - Invite-only + member: true
+   * - Invite-only + non-member: false (greyed out)
+   */
+  const canInteractWithPosts = !isInviteOnly || isMember;
+
+  useEffect(() => {
+    // Only fetch posts if we've checked membership and posts are not restricted
+    if (forumData && !isLoadingMembership && !shouldRestrictPosts) {
+      fetchPolls(1, false);
+    }
+  }, [forumData, isLoadingMembership, shouldRestrictPosts]);
+
+  // Re-fetch posts when category filter changes (skip initial mount)
+  useEffect(() => {
+    if (isInitialMountRef.current) {
+      isInitialMountRef.current = false;
+      return;
+    }
+
+    if (forumData && !isLoadingMembership && !shouldRestrictPosts) {
+      setPage(1);
+      fetchPolls(1, false);
+    }
+  }, [selectedCategories, forumData, isLoadingMembership, shouldRestrictPosts, fetchPolls]);
+
   useEffect(() => {
     const observer = new IntersectionObserver(
       (entries) => {
@@ -576,114 +404,153 @@ const Community1: React.FC<ILevoBlockBaseProps<ICommunity1Content>> = ({
   }, [hasMore, isLoading, isFetchingMore, hasError, page, fetchPolls]);
 
   return (
-    <Section elementKey="layout">
-      <Container elementKey="container">
-        <Box elementKey="content_section">
-          <Box elementKey="left_container">
-            <Box elementKey="sidebar_links_levoGroup">
-              {content?.sidebar_links?.map((v, index) => {
-                return (
-                  <Button
-                    key={`sidebar_links.${index}.sidebar_link`}
-                    elementKey={`sidebar_links.${index}.sidebar_link`}
-                  />
-                );
-              })}
+    <ForumProvider
+      forum={forumData}
+      isMember={isMember}
+      isLoadingMembership={isLoadingMembership}
+      isInviteOnly={isInviteOnly}
+      canInteractWithPosts={canInteractWithPosts}
+      canInteractWithComments={canInteractWithPosts}
+      joinRequest={joinRequest}
+      isJoinRequestPending={!!joinRequest}
+      allowJoinRequests={allowJoinRequests}
+      submitJoinRequest={handleSubmitJoinRequest}
+      refreshMembershipStatus={checkMembership}
+    >
+      <Section elementKey="layout">
+        <Container elementKey="container">
+          <Box elementKey="content_section">
+            <Box elementKey="left_container">
+              <Box elementKey="sidebar_links_levoGroup">
+                {content?.sidebar_links?.map((v, index) => {
+                  return (
+                    <Button
+                      key={`sidebar_links.${index}.sidebar_link`}
+                      elementKey={`sidebar_links.${index}.sidebar_link`}
+                    />
+                  );
+                })}
+              </Box>
             </Box>
-          </Box>
 
-          <Box elementKey="feed_container">
-            <Box elementKey="header">
-              <Heading elementKey="title" />
-              <Typography elementKey="description" />
-            </Box>
-            <Box elementKey="posts">
-              {isLoading ? (
-                <>
-                  <PostSkeleton />
-                  <PostSkeleton />
-                  <PostSkeleton />
-                  <PostSkeleton />
-                </>
-              ) : (
-                <>
-                  {forumPosts?.map((item, index: number) => (
-                    <ForumPost
-                      key={`polls.${index}`}
-                      post={item}
-                      postDetailPageBaseURL={
-                        content?.post_detail_page_url || ""
-                      }
-                    />
-                  ))}
-
-                  {hasMore && !hasError && (
-                    <div ref={observerTarget} className="h-4" />
-                  )}
-
-                  {isFetchingMore && (
-                    <>
-                      <PostSkeleton />
-                      <PostSkeleton />
-                    </>
-                  )}
-
-                  {hasError && (
-                    <Box
-                      elementKey="error_container"
-                      style={{
-                        display: "flex",
-                        alignItems: "center",
-                        justifyContent: "center",
-                        minHeight: "16rem",
-                      }}
-                    >
-                      <Typography
-                        elementKey="error_text"
-                        className="text-sm font-medium text-red-600"
+            <Box elementKey="feed_container">
+              <Box elementKey="header">
+                <Heading elementKey="title" />
+                <Typography elementKey="description" />
+              </Box>
+              <Box elementKey="search_container">
+                <SearchInput
+                  name="search"
+                  placeholder="Search..."
+                  value={searchQuery}
+                  onChange={(e) => handleSearch(e.target.value)}
+                />
+                <Button elementKey="new_post_cta" />
+              </Box>
+
+              <CreateForumPost forumKey={forumKey} onPostCreated={handlePostCreated} />
+              <Box elementKey="posts">
+                {isMembershipCheckPending ||
+                isLoadingMembership ||
+                (isLoading && !shouldRestrictPosts) ||
+                isSearching ? (
+                  <>
+                    <PostSkeleton />
+                    <PostSkeleton />
+                    <PostSkeleton />
+                    <PostSkeleton />
+                  </>
+                ) : shouldRestrictPosts ? (
+                  <>
+                    {/* Show sample posts behind the overlay */}
+                    <SamplePostSkeleton opacity={0.6} />
+                    <SamplePostSkeleton opacity={0.4} />
+                    <SamplePostSkeleton opacity={0.3} />
+                    <PostsRestrictionOverlay isOpen communityName={forumData?.name} />
+                  </>
+                ) : (
+                  <>
+                    {forumPosts?.map((item, index: number) => (
+                      <ForumPost
+                        key={`poll_${forumKey}_${item?._id}_${index}`}
+                        post={item}
+                        postDetailPageBaseURL={content?.post_detail_page_url || ""}
+                        forumKey={forumKey}
+                      />
+                    ))}
+
+                    {hasMore && !hasError && <div ref={observerTarget} className="h-4" />}
+
+                    {isFetchingMore && (
+                      <>
+                        <PostSkeleton />
+                        <PostSkeleton />
+                      </>
+                    )}
+
+                    {hasError && (
+                      <Box
+                        elementKey="error_container"
+                        style={{
+                          display: "flex",
+                          alignItems: "center",
+                          justifyContent: "center",
+                          minHeight: "16rem",
+                        }}
                       >
-                        Failed to load posts after {MAX_RETRY_ATTEMPTS}{" "}
-                        attempts. Please try refreshing the page.
-                      </Typography>
-                    </Box>
-                  )}
-                </>
-              )}
+                        <Typography
+                          elementKey="error_text"
+                          className="font-medium text-red-600 text-sm"
+                        >
+                          Failed to load posts. Please try refreshing the page.
+                        </Typography>
+                      </Box>
+                    )}
+                  </>
+                )}
+              </Box>
             </Box>
-          </Box>
-          <Box elementKey="right_container">
-            <Box elementKey="edit_profile_block">
-              <Box elementKey="edit_profile_block_content_wrapper">
-                <Media
-                  elementKey="edit_profile_block_banner_image"
-                  alt="Banner Image"
-                />
-                <Box elementKey="edit_profile_block_content">
-                  <Media
-                    elementKey="edit_profile_block_logo"
-                    alt="Community Logo"
+            <Box elementKey="right_container">
+              <Box elementKey="category_container">
+                <Box elementKey="category_header">
+                  <Heading elementKey="category_title" />
+                  <Typography elementKey="category_description" />
+                </Box>
+                <Box elementKey="category_list_container">
+                  <CategoryFilter
+                    forumKey={forumKey}
+                    selectedCategories={selectedCategories}
+                    onCategoryToggle={handleCategoryToggle}
                   />
-                  <Box elementKey="edit_profile_block_text_container">
-                    <Heading elementKey="edit_profile_block_title" />
-                    <Typography elementKey="edit_profile_block_description" />
-                  </Box>
                 </Box>
               </Box>
-              <Box elementKey="edit_profile_ctas_levoGroup">
-                {content?.edit_profile_ctas?.map((v, index) => {
-                  return (
-                    <Button
-                      key={`edit_profile_ctas.${index}.edit_profile_cta`}
-                      elementKey={`edit_profile_ctas.${index}.edit_profile_cta`}
-                    />
-                  );
-                })}
+              <Box elementKey="edit_profile_block">
+                <Box elementKey="edit_profile_block_content_wrapper">
+                  <Media elementKey="edit_profile_block_banner_image" alt="Banner Image" />
+                  <Box elementKey="edit_profile_block_content">
+                    <Media elementKey="edit_profile_block_logo" alt="Community Logo" />
+                    <Box elementKey="edit_profile_block_text_container">
+                      <Heading elementKey="edit_profile_block_title" />
+                      <Typography elementKey="edit_profile_block_description" />
+                    </Box>
+                  </Box>
+                </Box>
+                <Box elementKey="edit_profile_ctas_levoGroup">
+                  {content?.edit_profile_ctas?.map((v, index) => {
+                    return (
+                      <Button
+                        key={`edit_profile_ctas.${index}.edit_profile_cta`}
+                        elementKey={`edit_profile_ctas.${index}.edit_profile_cta`}
+                      />
+                    );
+                  })}
+                </Box>
               </Box>
             </Box>
           </Box>
-        </Box>
-      </Container>
-    </Section>
+        </Container>
+      </Section>
+    </ForumProvider>
   );
 };