diff --git a/.github/instructions/bash.instructions.md b/.github/instructions/bash.instructions.md
new file mode 100644
index 000000000..b14d3c9ed
--- /dev/null
+++ b/.github/instructions/bash.instructions.md
@@ -0,0 +1,48 @@
+---
+description: Guidelines for bash commands and tooling in the monorepo
+applyTo: "**/*.sh"
+---
+
+# Bash & Tooling Instructions
+
+This document outlines the standard tools and commands used in this monorepo.
+
+## Package Manager
+
+We use **pnpm** for package management.
+- **Do not use `npm` or `yarn`.**
+- Lockfile: `pnpm-lock.yaml`
+- Workspace configuration: `pnpm-workspace.yaml`
+
+### Common Commands
+- Install dependencies: `pnpm install`
+- Run a script in a specific package: `pnpm --filter <package_name> run <script>`
+- Run a script in all packages: `pnpm -r run <script>`
+
+## Monorepo Tooling
+
+We use **Turbo** for build system orchestration.
+- Configuration: `turbo.json`
+
+## Project Structure
+
+- `apps/`: Contains application services (admin, api, live, proxy, space, web).
+- `packages/`: Contains shared packages and libraries.
+- `deployments/`: Deployment configurations.
+
+## Running Tests
+
+- To run tests in a specific package (e.g., codemods):
+  ```bash
+  cd packages/codemods
+  pnpm run test
+  ```
+- Or from root:
+  ```bash
+  pnpm --filter @plane/codemods run test
+  ```
+
+## Docker
+
+- Local development uses `docker-compose-local.yml`.
+- Production/Staging uses `docker-compose.yml`.
diff --git a/.github/instructions/typescript.instructions.md b/.github/instructions/typescript.instructions.md
new file mode 100644
index 000000000..4af2f9fdd
--- /dev/null
+++ b/.github/instructions/typescript.instructions.md
@@ -0,0 +1,129 @@
+---
+description: Guidelines for using modern TypeScript features (v5.0-v5.8)
+applyTo: "**/*.{ts,tsx,mts,cts}"
+---
+
+# TypeScript Coding Guidelines & Modern Features (v5.0 - v5.8)
+
+When writing TypeScript code, prioritize using modern features and best practices introduced in recent versions (up to 5.8).
+
+## Global Themes Across 5.x
+
+1. **Standard decorators are here; legacy decorators are legacy.**
+   New TC39-compliant decorators landed in 5.0 and were extended in 5.2 (metadata). Old `experimentalDecorators`-style behavior is still supported but should be treated as legacy.
+
+2. **Type system is more precise and less noisy.**
+   Major work went into narrowing, control flow analysis, error messages, and new helpers like `NoInfer`, inferred predicates, and better `undefined`/`never`/uninitialized checks.
+
+3. **Module / runtime interop has been modernized.**
+   Options like `--moduleResolution bundler`, `--module nodenext`/`node18`, `--rewriteRelativeImportExtensions`, `--erasableSyntaxOnly`, and `--verbatimModuleSyntax` are about playing nicely with ESM, Node 18+/22+, direct TypeScript execution, and bundlers.
+
+4. **The standard library keeps tracking modern JS.**
+   Support for new ES features (iterator helpers, `Object.groupBy`/`Map.groupBy`, new Set/ES2024 APIs) shows up as type declarations and sometimes extra checks (regex syntax checking, etc.).
+
+When generating or refactoring code, prefer these newer idioms, and avoid patterns that conflict with updated checks.
+
+## Modern Features to Utilize
+
+### Type System & Inference
+- **`const` Type Parameters (5.0)**: Use `const` type parameters for more precise literal inference.
+  ```typescript
+  declare function names<const T extends string[]>(...names: T): void;
+  ```
+- **`@satisfies` Operator (5.0)**: Use `satisfies` to validate types without widening them.
+- **Inferred Type Predicates (5.5)**: Allow TypeScript to infer type predicates for functions that filter arrays or check types, reducing the need for explicit `is` return types.
+- **`NoInfer` Utility (5.4)**: Use `NoInfer<T>` to block inference for specific type arguments when you want them to be determined by other arguments.
+- **Narrowing**:
+  - **Switch(true) (5.3)**: Utilize narrowing in `switch(true)` blocks.
+  - **Boolean Comparisons (5.3)**: Rely on narrowing from direct boolean comparisons.
+  - **Closures (5.4)**: Trust preserved narrowing in closures when variables aren't modified after the check.
+  - **Constant Indexed Access (5.5)**: Use constant indices to narrow object/array properties.
+
+### Syntax & Control Flow
+- **Decorators (5.0)**: Use standard ECMAScript decorators (Stage 3).
+- **`using` Declarations (5.2)**: Use `using` for explicit resource management (Disposable pattern) instead of manual cleanup.
+  ```typescript
+  using resource = new Resource();
+  ```
+- **Import Attributes (5.3/5.8)**: Use `with { type: "json" }` for import attributes. Avoid the deprecated `assert` syntax.
+- **`switch` Exhaustiveness**: Rely on TypeScript's exhaustiveness checking in switch statements.
+
+### Modules & Imports
+- **`verbatimModuleSyntax` (5.0)**: Respect this flag by using `import type` explicitly when importing types to ensure they are erased during compilation.
+- **Type-Only Imports with Extensions (5.2)**: You can use `.ts`, `.mts`, `.cts` extensions in `import type` statements.
+- **`resolution-mode` (5.3)**: Use `import type { Type } from "mod" with { "resolution-mode": "import" }` if needed for specific module resolution contexts.
+- **JSDoc `@import` (5.5)**: Use `@import` tags in JSDoc for cleaner type imports in JS files if working in a mixed codebase.
+
+### Standard Library & Built-ins
+- **Iterator Helpers (5.6)**: Use new iterator methods (map, filter, etc.) if targeting modern environments.
+- **Set Methods (5.5)**: Utilize new `Set` methods like `union`, `intersection`, etc., when available.
+- **`Object.groupBy` / `Map.groupBy` (5.4)**: Use these standard methods for grouping instead of external libraries like Lodash when appropriate.
+- **`Promise.withResolvers` (5.7)**: Use `Promise.withResolvers()` for creating promises with exposed resolve/reject functions.
+
+### Configuration & Tooling
+- **`--moduleResolution bundler` (5.0)**: Assume this resolution strategy for modern web projects (Vite, Next.js, etc.).
+- **`--erasableSyntaxOnly` (5.8)**: Be aware of this flag; avoid TypeScript-specific syntax that cannot be simply erased (like `enum`s or `namespaces`) if the project aims for maximum compatibility with tools like Node.js's `--strip-types`. Prefer `const` objects or unions over `enum`s if requested.
+
+## Specific Coding Patterns
+
+### Arrays & Collections
+- Use **Copying Array Methods (5.2)** (`toSorted`, `toSpliced`, `with`) for immutable array operations.
+- **TypedArrays (5.7)**: Be aware that TypedArrays are now generic over `ArrayBufferLike`.
+
+### Classes
+- **Parameter Decorators (5.0/5.2)**: Use modern standard decorators.
+- **`super` Property Access (5.3)**: Avoid accessing instance fields via `super`.
+
+### Error Handling
+- **Checks for Never-Initialized Variables (5.7)**: Ensure variables are initialized before use to avoid new errors.
+
+## Deprecations to Avoid
+- Avoid `import ... assert` (use `with`).
+- Avoid implicit `any` returns in `undefined`-returning functions (though 5.1 makes this easier, explicit is better).
+- Avoid `enum`s if the project prefers erasable syntax (5.8).
+
+## Version-Specific Highlights
+
+### TypeScript 5.0
+- **Decorators**: Use standard decorators unless `experimentalDecorators` is explicitly enabled.
+- **`const` Type Parameters**: Use for literal inference.
+- **Enums**: All enums are union enums.
+- **Modules**: `--moduleResolution bundler` and `--verbatimModuleSyntax` are key for modern bundlers.
+
+### TypeScript 5.1
+- **Returns**: `undefined`-returning functions don't need explicit returns.
+- **Getters/Setters**: Can have unrelated types with explicit annotations.
+
+### TypeScript 5.2
+- **Resource Management**: `using` declarations for `Symbol.dispose`.
+- **Decorator Metadata**: Use `context.metadata` for design-time metadata.
+
+### TypeScript 5.3
+- **Import Attributes**: Use `with { type: "json" }`.
+- **Switch(true)**: Narrowing works in `switch(true)`.
+
+### TypeScript 5.4
+- **Closures**: Narrowing preserved in closures if last assignment is before creation.
+- **`NoInfer`**: Block inference for specific arguments.
+- **Grouping**: `Object.groupBy` / `Map.groupBy`.
+
+### TypeScript 5.5
+- **Inferred Predicates**: Functions checking types often don't need explicit `is` return types.
+- **Constant Index Access**: Better narrowing for constant keys.
+- **Regex**: Syntax checking for regex literals.
+
+### TypeScript 5.6
+- **Truthiness Checks**: Errors on always-truthy/falsy conditions (e.g., `if (/regex/)`).
+- **Iterator Helpers**: `.map`, `.filter` on iterators.
+
+### TypeScript 5.7
+- **Uninitialized Variables**: Stricter checks for never-initialized variables.
+- **Relative Imports**: `--rewriteRelativeImportExtensions` for `.ts` imports in output.
+- **ES2024**: Support for `Promise.withResolvers`, `Atomics.waitAsync`.
+
+### TypeScript 5.8
+- **Return Checks**: Granular checks for conditional returns.
+- **Node Modules**: `--module node18` stable; `require()` of ESM allowed in `nodenext`.
+- **Erasable Syntax**: `--erasableSyntaxOnly` forbids enums, namespaces, etc.
+
+When generating code, always prefer the most modern, standard, and type-safe approach available in TypeScript 5.8.
diff --git a/apps/admin/app/(all)/(dashboard)/ai/form.tsx b/apps/admin/app/(all)/(dashboard)/ai/form.tsx
index 5b931e9d7..a9ee4ebac 100644
--- a/apps/admin/app/(all)/(dashboard)/ai/form.tsx
+++ b/apps/admin/app/(all)/(dashboard)/ai/form.tsx
@@ -17,7 +17,7 @@ type IInstanceAIForm = {
 
 type AIFormValues = Record<TInstanceAIConfigurationKeys, string>;
 
-export const InstanceAIForm: React.FC<IInstanceAIForm> = (props) => {
+export function InstanceAIForm(props: IInstanceAIForm) {
   const { config } = props;
   // store
   const { updateInstanceConfigurations } = useInstance();
@@ -133,4 +133,4 @@ export const InstanceAIForm: React.FC<IInstanceAIForm> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/admin/app/(all)/(dashboard)/ai/page.tsx b/apps/admin/app/(all)/(dashboard)/ai/page.tsx
index e5323e92b..16b50e209 100644
--- a/apps/admin/app/(all)/(dashboard)/ai/page.tsx
+++ b/apps/admin/app/(all)/(dashboard)/ai/page.tsx
@@ -9,7 +9,7 @@ import { useInstance } from "@/hooks/store";
 import type { Route } from "./+types/page";
 import { InstanceAIForm } from "./form";
 
-const InstanceAIPage = observer<React.FC<Route.ComponentProps>>(() => {
+const InstanceAIPage = observer(function InstanceAIPage(_props: Route.ComponentProps) {
   // store
   const { fetchInstanceConfigurations, formattedConfig } = useInstance();
 
diff --git a/apps/admin/app/(all)/(dashboard)/authentication/gitea/form.tsx b/apps/admin/app/(all)/(dashboard)/authentication/gitea/form.tsx
index fefc1ac89..0bce17b93 100644
--- a/apps/admin/app/(all)/(dashboard)/authentication/gitea/form.tsx
+++ b/apps/admin/app/(all)/(dashboard)/authentication/gitea/form.tsx
@@ -27,7 +27,7 @@ type Props = {
 
 type GiteaConfigFormValues = Record<TInstanceGiteaAuthenticationConfigurationKeys, string>;
 
-export const InstanceGiteaConfigForm: FC<Props> = (props) => {
+export function InstanceGiteaConfigForm(props: Props) {
   const { config } = props;
   // states
   const [isDiscardChangesModalOpen, setIsDiscardChangesModalOpen] = useState(false);
@@ -207,4 +207,4 @@ export const InstanceGiteaConfigForm: FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/admin/app/(all)/(dashboard)/authentication/gitea/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/gitea/page.tsx
index 8c2090279..260e82ab1 100644
--- a/apps/admin/app/(all)/(dashboard)/authentication/gitea/page.tsx
+++ b/apps/admin/app/(all)/(dashboard)/authentication/gitea/page.tsx
@@ -15,7 +15,7 @@ import { useInstance } from "@/hooks/store";
 import type { Route } from "./+types/page";
 import { InstanceGiteaConfigForm } from "./form";
 
-const InstanceGiteaAuthenticationPage = observer(() => {
+const InstanceGiteaAuthenticationPage = observer(function InstanceGiteaAuthenticationPage() {
   // store
   const { fetchInstanceConfigurations, formattedConfig, updateInstanceConfigurations } = useInstance();
   // state
diff --git a/apps/admin/app/(all)/(dashboard)/authentication/github/form.tsx b/apps/admin/app/(all)/(dashboard)/authentication/github/form.tsx
index 86ab729b8..fb0a1b7bb 100644
--- a/apps/admin/app/(all)/(dashboard)/authentication/github/form.tsx
+++ b/apps/admin/app/(all)/(dashboard)/authentication/github/form.tsx
@@ -28,7 +28,7 @@ type Props = {
 
 type GithubConfigFormValues = Record<TInstanceGithubAuthenticationConfigurationKeys, string>;
 
-export const InstanceGithubConfigForm: React.FC<Props> = (props) => {
+export function InstanceGithubConfigForm(props: Props) {
   const { config } = props;
   // states
   const [isDiscardChangesModalOpen, setIsDiscardChangesModalOpen] = useState(false);
@@ -245,4 +245,4 @@ export const InstanceGithubConfigForm: React.FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/admin/app/(all)/(dashboard)/authentication/github/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/github/page.tsx
index 155f3b9f5..94c2bdbc0 100644
--- a/apps/admin/app/(all)/(dashboard)/authentication/github/page.tsx
+++ b/apps/admin/app/(all)/(dashboard)/authentication/github/page.tsx
@@ -19,7 +19,9 @@ import { useInstance } from "@/hooks/store";
 import type { Route } from "./+types/page";
 import { InstanceGithubConfigForm } from "./form";
 
-const InstanceGithubAuthenticationPage = observer<React.FC<Route.ComponentProps>>(() => {
+const InstanceGithubAuthenticationPage = observer(function InstanceGithubAuthenticationPage(
+  _props: Route.ComponentProps
+) {
   // store
   const { fetchInstanceConfigurations, formattedConfig, updateInstanceConfigurations } = useInstance();
   // state
diff --git a/apps/admin/app/(all)/(dashboard)/authentication/gitlab/form.tsx b/apps/admin/app/(all)/(dashboard)/authentication/gitlab/form.tsx
index f8ffc6c35..65f2b776c 100644
--- a/apps/admin/app/(all)/(dashboard)/authentication/gitlab/form.tsx
+++ b/apps/admin/app/(all)/(dashboard)/authentication/gitlab/form.tsx
@@ -24,7 +24,7 @@ type Props = {
 
 type GitlabConfigFormValues = Record<TInstanceGitlabAuthenticationConfigurationKeys, string>;
 
-export const InstanceGitlabConfigForm: React.FC<Props> = (props) => {
+export function InstanceGitlabConfigForm(props: Props) {
   const { config } = props;
   // states
   const [isDiscardChangesModalOpen, setIsDiscardChangesModalOpen] = useState(false);
@@ -208,4 +208,4 @@ export const InstanceGitlabConfigForm: React.FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/admin/app/(all)/(dashboard)/authentication/gitlab/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/gitlab/page.tsx
index d354cb788..a8175c46d 100644
--- a/apps/admin/app/(all)/(dashboard)/authentication/gitlab/page.tsx
+++ b/apps/admin/app/(all)/(dashboard)/authentication/gitlab/page.tsx
@@ -15,7 +15,9 @@ import { useInstance } from "@/hooks/store";
 import type { Route } from "./+types/page";
 import { InstanceGitlabConfigForm } from "./form";
 
-const InstanceGitlabAuthenticationPage = observer<React.FC<Route.ComponentProps>>(() => {
+const InstanceGitlabAuthenticationPage = observer(function InstanceGitlabAuthenticationPage(
+  _props: Route.ComponentProps
+) {
   // store
   const { fetchInstanceConfigurations, formattedConfig, updateInstanceConfigurations } = useInstance();
   // state
diff --git a/apps/admin/app/(all)/(dashboard)/authentication/google/form.tsx b/apps/admin/app/(all)/(dashboard)/authentication/google/form.tsx
index f3235f6b7..4d5bcbbae 100644
--- a/apps/admin/app/(all)/(dashboard)/authentication/google/form.tsx
+++ b/apps/admin/app/(all)/(dashboard)/authentication/google/form.tsx
@@ -27,7 +27,7 @@ type Props = {
 
 type GoogleConfigFormValues = Record<TInstanceGoogleAuthenticationConfigurationKeys, string>;
 
-export const InstanceGoogleConfigForm: React.FC<Props> = (props) => {
+export function InstanceGoogleConfigForm(props: Props) {
   const { config } = props;
   // states
   const [isDiscardChangesModalOpen, setIsDiscardChangesModalOpen] = useState(false);
@@ -232,4 +232,4 @@ export const InstanceGoogleConfigForm: React.FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/admin/app/(all)/(dashboard)/authentication/google/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/google/page.tsx
index 12e9189cc..146239067 100644
--- a/apps/admin/app/(all)/(dashboard)/authentication/google/page.tsx
+++ b/apps/admin/app/(all)/(dashboard)/authentication/google/page.tsx
@@ -15,7 +15,9 @@ import { useInstance } from "@/hooks/store";
 import type { Route } from "./+types/page";
 import { InstanceGoogleConfigForm } from "./form";
 
-const InstanceGoogleAuthenticationPage = observer<React.FC<Route.ComponentProps>>(() => {
+const InstanceGoogleAuthenticationPage = observer(function InstanceGoogleAuthenticationPage(
+  _props: Route.ComponentProps
+) {
   // store
   const { fetchInstanceConfigurations, formattedConfig, updateInstanceConfigurations } = useInstance();
   // state
diff --git a/apps/admin/app/(all)/(dashboard)/authentication/page.tsx b/apps/admin/app/(all)/(dashboard)/authentication/page.tsx
index 380966e02..dfcce21e5 100644
--- a/apps/admin/app/(all)/(dashboard)/authentication/page.tsx
+++ b/apps/admin/app/(all)/(dashboard)/authentication/page.tsx
@@ -14,7 +14,7 @@ import { useInstance } from "@/hooks/store";
 import { AuthenticationModes } from "@/plane-admin/components/authentication";
 import type { Route } from "./+types/page";
 
-const InstanceAuthenticationPage = observer<React.FC<Route.ComponentProps>>(() => {
+const InstanceAuthenticationPage = observer(function InstanceAuthenticationPage(_props: Route.ComponentProps) {
   // store
   const { fetchInstanceConfigurations, formattedConfig, updateInstanceConfigurations } = useInstance();
 
diff --git a/apps/admin/app/(all)/(dashboard)/email/email-config-form.tsx b/apps/admin/app/(all)/(dashboard)/email/email-config-form.tsx
index 2c00311b7..17f4173e9 100644
--- a/apps/admin/app/(all)/(dashboard)/email/email-config-form.tsx
+++ b/apps/admin/app/(all)/(dashboard)/email/email-config-form.tsx
@@ -30,7 +30,7 @@ const EMAIL_SECURITY_OPTIONS: { [key in TEmailSecurityKeys]: string } = {
   NONE: "No email security",
 };
 
-export const InstanceEmailForm: React.FC<IInstanceEmailForm> = (props) => {
+export function InstanceEmailForm(props: IInstanceEmailForm) {
   const { config } = props;
   // states
   const [isSendTestEmailModalOpen, setIsSendTestEmailModalOpen] = useState(false);
@@ -224,4 +224,4 @@ export const InstanceEmailForm: React.FC<IInstanceEmailForm> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/admin/app/(all)/(dashboard)/email/page.tsx b/apps/admin/app/(all)/(dashboard)/email/page.tsx
index 152c51dda..6e8e96cc7 100644
--- a/apps/admin/app/(all)/(dashboard)/email/page.tsx
+++ b/apps/admin/app/(all)/(dashboard)/email/page.tsx
@@ -11,7 +11,7 @@ import { useInstance } from "@/hooks/store";
 import type { Route } from "./+types/page";
 import { InstanceEmailForm } from "./email-config-form";
 
-const InstanceEmailPage = observer<React.FC<Route.ComponentProps>>(() => {
+const InstanceEmailPage = observer(function InstanceEmailPage(_props: Route.ComponentProps) {
   // store
   const { fetchInstanceConfigurations, formattedConfig, disableEmail } = useInstance();
 
diff --git a/apps/admin/app/(all)/(dashboard)/email/test-email-modal.tsx b/apps/admin/app/(all)/(dashboard)/email/test-email-modal.tsx
index 89043fcc1..260b4fbaf 100644
--- a/apps/admin/app/(all)/(dashboard)/email/test-email-modal.tsx
+++ b/apps/admin/app/(all)/(dashboard)/email/test-email-modal.tsx
@@ -19,7 +19,7 @@ enum ESendEmailSteps {
 
 const instanceService = new InstanceService();
 
-export const SendTestEmailModal: React.FC<Props> = (props) => {
+export function SendTestEmailModal(props: Props) {
   const { isOpen, handleClose } = props;
 
   // state
@@ -133,4 +133,4 @@ export const SendTestEmailModal: React.FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/admin/app/(all)/(dashboard)/general/form.tsx b/apps/admin/app/(all)/(dashboard)/general/form.tsx
index 5d9578fd8..ccd520326 100644
--- a/apps/admin/app/(all)/(dashboard)/general/form.tsx
+++ b/apps/admin/app/(all)/(dashboard)/general/form.tsx
@@ -19,7 +19,7 @@ export interface IGeneralConfigurationForm {
   instanceAdmins: IInstanceAdmin[];
 }
 
-export const GeneralConfigurationForm: React.FC<IGeneralConfigurationForm> = observer((props) => {
+export const GeneralConfigurationForm = observer(function GeneralConfigurationForm(props: IGeneralConfigurationForm) {
   const { instance, instanceAdmins } = props;
   // hooks
   const { instanceConfigurations, updateInstanceInfo, updateInstanceConfigurations } = useInstance();
diff --git a/apps/admin/app/(all)/(dashboard)/general/intercom.tsx b/apps/admin/app/(all)/(dashboard)/general/intercom.tsx
index 61a417c45..94bb310ff 100644
--- a/apps/admin/app/(all)/(dashboard)/general/intercom.tsx
+++ b/apps/admin/app/(all)/(dashboard)/general/intercom.tsx
@@ -13,7 +13,7 @@ type TIntercomConfig = {
   isTelemetryEnabled: boolean;
 };
 
-export const IntercomConfig: React.FC<TIntercomConfig> = observer((props) => {
+export const IntercomConfig = observer(function IntercomConfig(props: TIntercomConfig) {
   const { isTelemetryEnabled } = props;
   // hooks
   const { instanceConfigurations, updateInstanceConfigurations, fetchInstanceConfigurations } = useInstance();
diff --git a/apps/admin/app/(all)/(dashboard)/header.tsx b/apps/admin/app/(all)/(dashboard)/header.tsx
index 049c30834..131640a0d 100644
--- a/apps/admin/app/(all)/(dashboard)/header.tsx
+++ b/apps/admin/app/(all)/(dashboard)/header.tsx
@@ -10,7 +10,7 @@ import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 // hooks
 import { useTheme } from "@/hooks/store";
 
-export const HamburgerToggle = observer(() => {
+export const HamburgerToggle = observer(function HamburgerToggle() {
   const { isSidebarCollapsed, toggleSidebar } = useTheme();
   return (
     <div
@@ -22,7 +22,7 @@ export const HamburgerToggle = observer(() => {
   );
 });
 
-export const AdminHeader = observer(() => {
+export const AdminHeader = observer(function AdminHeader() {
   const pathName = usePathname();
 
   const getHeaderTitle = (pathName: string) => {
diff --git a/apps/admin/app/(all)/(dashboard)/image/form.tsx b/apps/admin/app/(all)/(dashboard)/image/form.tsx
index da105bb3e..a77c62b40 100644
--- a/apps/admin/app/(all)/(dashboard)/image/form.tsx
+++ b/apps/admin/app/(all)/(dashboard)/image/form.tsx
@@ -14,7 +14,7 @@ type IInstanceImageConfigForm = {
 
 type ImageConfigFormValues = Record<TInstanceImageConfigurationKeys, string>;
 
-export const InstanceImageConfigForm: React.FC<IInstanceImageConfigForm> = (props) => {
+export function InstanceImageConfigForm(props: IInstanceImageConfigForm) {
   const { config } = props;
   // store hooks
   const { updateInstanceConfigurations } = useInstance();
@@ -77,4 +77,4 @@ export const InstanceImageConfigForm: React.FC<IInstanceImageConfigForm> = (prop
       </div>
     </div>
   );
-};
+}
diff --git a/apps/admin/app/(all)/(dashboard)/image/page.tsx b/apps/admin/app/(all)/(dashboard)/image/page.tsx
index 8a8fad01a..50eefdb0c 100644
--- a/apps/admin/app/(all)/(dashboard)/image/page.tsx
+++ b/apps/admin/app/(all)/(dashboard)/image/page.tsx
@@ -9,7 +9,7 @@ import { useInstance } from "@/hooks/store";
 import type { Route } from "./+types/page";
 import { InstanceImageConfigForm } from "./form";
 
-const InstanceImagePage = observer<React.FC<Route.ComponentProps>>(() => {
+const InstanceImagePage = observer(function InstanceImagePage(_props: Route.ComponentProps) {
   // store
   const { formattedConfig, fetchInstanceConfigurations } = useInstance();
 
diff --git a/apps/admin/app/(all)/(dashboard)/layout.tsx b/apps/admin/app/(all)/(dashboard)/layout.tsx
index da9be8bb9..61ee7cdbd 100644
--- a/apps/admin/app/(all)/(dashboard)/layout.tsx
+++ b/apps/admin/app/(all)/(dashboard)/layout.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import { useEffect } from "react";
 import { observer } from "mobx-react";
 import { useRouter } from "next/navigation";
@@ -14,7 +13,7 @@ import type { Route } from "./+types/layout";
 import { AdminHeader } from "./header";
 import { AdminSidebar } from "./sidebar";
 
-const AdminLayout: React.FC<Route.ComponentProps> = () => {
+function AdminLayout(_props: Route.ComponentProps) {
   // router
   const { replace } = useRouter();
   // store hooks
@@ -48,6 +47,6 @@ const AdminLayout: React.FC<Route.ComponentProps> = () => {
   }
 
   return <></>;
-};
+}
 
 export default observer(AdminLayout);
diff --git a/apps/admin/app/(all)/(dashboard)/sidebar-dropdown.tsx b/apps/admin/app/(all)/(dashboard)/sidebar-dropdown.tsx
index 656d0531d..81b94cbef 100644
--- a/apps/admin/app/(all)/(dashboard)/sidebar-dropdown.tsx
+++ b/apps/admin/app/(all)/(dashboard)/sidebar-dropdown.tsx
@@ -16,7 +16,7 @@ import { useTheme, useUser } from "@/hooks/store";
 // service initialization
 const authService = new AuthService();
 
-export const AdminSidebarDropdown = observer(() => {
+export const AdminSidebarDropdown = observer(function AdminSidebarDropdown() {
   // store hooks
   const { isSidebarCollapsed } = useTheme();
   const { currentUser, signOut } = useUser();
diff --git a/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx b/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx
index 157c3240b..f421ec34a 100644
--- a/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx
+++ b/apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx
@@ -34,7 +34,7 @@ const helpOptions = [
   },
 ];
 
-export const AdminSidebarHelpSection: React.FC = observer(() => {
+export const AdminSidebarHelpSection = observer(function AdminSidebarHelpSection() {
   // states
   const [isNeedHelpOpen, setIsNeedHelpOpen] = useState(false);
   // store
diff --git a/apps/admin/app/(all)/(dashboard)/sidebar-menu.tsx b/apps/admin/app/(all)/(dashboard)/sidebar-menu.tsx
index b33ccecff..0442a66c5 100644
--- a/apps/admin/app/(all)/(dashboard)/sidebar-menu.tsx
+++ b/apps/admin/app/(all)/(dashboard)/sidebar-menu.tsx
@@ -50,7 +50,7 @@ const INSTANCE_ADMIN_LINKS = [
   },
 ];
 
-export const AdminSidebarMenu = observer(() => {
+export const AdminSidebarMenu = observer(function AdminSidebarMenu() {
   // store hooks
   const { isSidebarCollapsed, toggleSidebar } = useTheme();
   // router
diff --git a/apps/admin/app/(all)/(dashboard)/sidebar.tsx b/apps/admin/app/(all)/(dashboard)/sidebar.tsx
index fb8091df0..38d9930f7 100644
--- a/apps/admin/app/(all)/(dashboard)/sidebar.tsx
+++ b/apps/admin/app/(all)/(dashboard)/sidebar.tsx
@@ -11,7 +11,7 @@ import { AdminSidebarDropdown } from "./sidebar-dropdown";
 import { AdminSidebarHelpSection } from "./sidebar-help-section";
 import { AdminSidebarMenu } from "./sidebar-menu";
 
-export const AdminSidebar = observer(() => {
+export const AdminSidebar = observer(function AdminSidebar() {
   // store
   const { isSidebarCollapsed, toggleSidebar } = useTheme();
 
diff --git a/apps/admin/app/(all)/(dashboard)/workspace/create/form.tsx b/apps/admin/app/(all)/(dashboard)/workspace/create/form.tsx
index 6ec3fe4a6..09135ed35 100644
--- a/apps/admin/app/(all)/(dashboard)/workspace/create/form.tsx
+++ b/apps/admin/app/(all)/(dashboard)/workspace/create/form.tsx
@@ -15,7 +15,7 @@ import { useWorkspace } from "@/hooks/store";
 
 const instanceWorkspaceService = new InstanceWorkspaceService();
 
-export const WorkspaceCreateForm = () => {
+export function WorkspaceCreateForm() {
   // router
   const router = useRouter();
   // states
@@ -209,4 +209,4 @@ export const WorkspaceCreateForm = () => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/admin/app/(all)/(dashboard)/workspace/create/page.tsx b/apps/admin/app/(all)/(dashboard)/workspace/create/page.tsx
index 6d69d313f..83ec216fe 100644
--- a/apps/admin/app/(all)/(dashboard)/workspace/create/page.tsx
+++ b/apps/admin/app/(all)/(dashboard)/workspace/create/page.tsx
@@ -5,19 +5,21 @@ import { observer } from "mobx-react";
 import type { Route } from "./+types/page";
 import { WorkspaceCreateForm } from "./form";
 
-const WorkspaceCreatePage = observer<React.FC<Route.ComponentProps>>(() => (
-  <div className="relative container mx-auto w-full h-full p-4 py-4 space-y-6 flex flex-col">
-    <div className="border-b border-custom-border-100 mx-4 py-4 space-y-1 flex-shrink-0">
-      <div className="text-xl font-medium text-custom-text-100">Create a new workspace on this instance.</div>
-      <div className="text-sm font-normal text-custom-text-300">
-        You will need to invite users from Workspace Settings after you create this workspace.
+const WorkspaceCreatePage = observer(function WorkspaceCreatePage(_props: Route.ComponentProps) {
+  return (
+    <div className="relative container mx-auto w-full h-full p-4 py-4 space-y-6 flex flex-col">
+      <div className="border-b border-custom-border-100 mx-4 py-4 space-y-1 flex-shrink-0">
+        <div className="text-xl font-medium text-custom-text-100">Create a new workspace on this instance.</div>
+        <div className="text-sm font-normal text-custom-text-300">
+          You will need to invite users from Workspace Settings after you create this workspace.
+        </div>
+      </div>
+      <div className="flex-grow overflow-hidden overflow-y-scroll vertical-scrollbar scrollbar-md px-4">
+        <WorkspaceCreateForm />
       </div>
     </div>
-    <div className="flex-grow overflow-hidden overflow-y-scroll vertical-scrollbar scrollbar-md px-4">
-      <WorkspaceCreateForm />
-    </div>
-  </div>
-));
+  );
+});
 
 export const meta: Route.MetaFunction = () => [{ title: "Create Workspace - God Mode" }];
 
diff --git a/apps/admin/app/(all)/(dashboard)/workspace/page.tsx b/apps/admin/app/(all)/(dashboard)/workspace/page.tsx
index 5b6c96daa..723b7ffce 100644
--- a/apps/admin/app/(all)/(dashboard)/workspace/page.tsx
+++ b/apps/admin/app/(all)/(dashboard)/workspace/page.tsx
@@ -18,7 +18,7 @@ import { WorkspaceListItem } from "@/components/workspace/list-item";
 import { useInstance, useWorkspace } from "@/hooks/store";
 import type { Route } from "./+types/page";
 
-const WorkspaceManagementPage = observer<React.FC<Route.ComponentProps>>(() => {
+const WorkspaceManagementPage = observer(function WorkspaceManagementPage(_props: Route.ComponentProps) {
   // states
   const [isSubmitting, setIsSubmitting] = useState<boolean>(false);
   // store
diff --git a/apps/admin/app/(all)/(home)/auth-banner.tsx b/apps/admin/app/(all)/(home)/auth-banner.tsx
index 2af42ed8e..3b8fd5ce5 100644
--- a/apps/admin/app/(all)/(home)/auth-banner.tsx
+++ b/apps/admin/app/(all)/(home)/auth-banner.tsx
@@ -9,7 +9,7 @@ type TAuthBanner = {
   handleBannerData?: (bannerData: TAdminAuthErrorInfo | undefined) => void;
 };
 
-export const AuthBanner: React.FC<TAuthBanner> = (props) => {
+export function AuthBanner(props: TAuthBanner) {
   const { bannerData, handleBannerData } = props;
 
   if (!bannerData) return <></>;
@@ -27,4 +27,4 @@ export const AuthBanner: React.FC<TAuthBanner> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/admin/app/(all)/(home)/auth-header.tsx b/apps/admin/app/(all)/(home)/auth-header.tsx
index 115c85381..f92c5be0f 100644
--- a/apps/admin/app/(all)/(home)/auth-header.tsx
+++ b/apps/admin/app/(all)/(home)/auth-header.tsx
@@ -3,10 +3,12 @@
 import Link from "next/link";
 import { PlaneLockup } from "@plane/propel/icons";
 
-export const AuthHeader = () => (
-  <div className="flex items-center justify-between gap-6 w-full flex-shrink-0 sticky top-0">
-    <Link href="/">
-      <PlaneLockup height={20} width={95} className="text-custom-text-100" />
-    </Link>
-  </div>
-);
+export function AuthHeader() {
+  return (
+    <div className="flex items-center justify-between gap-6 w-full flex-shrink-0 sticky top-0">
+      <Link href="/">
+        <PlaneLockup height={20} width={95} className="text-custom-text-100" />
+      </Link>
+    </div>
+  );
+}
diff --git a/apps/admin/app/(all)/(home)/page.tsx b/apps/admin/app/(all)/(home)/page.tsx
index 2308c691d..c5311a0a2 100644
--- a/apps/admin/app/(all)/(home)/page.tsx
+++ b/apps/admin/app/(all)/(home)/page.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import { observer } from "mobx-react";
 // components
 import { LogoSpinner } from "@/components/common/logo-spinner";
@@ -11,7 +10,7 @@ import { useInstance } from "@/hooks/store";
 import type { Route } from "./+types/page";
 import { InstanceSignInForm } from "./sign-in-form";
 
-const HomePage = () => {
+function HomePage() {
   // store hooks
   const { instance, error } = useInstance();
 
@@ -36,7 +35,7 @@ const HomePage = () => {
 
   // if instance is fetched and setup is done, show sign in form
   return <InstanceSignInForm />;
-};
+}
 
 export default observer(HomePage);
 
diff --git a/apps/admin/app/(all)/(home)/sign-in-form.tsx b/apps/admin/app/(all)/(home)/sign-in-form.tsx
index 56f0ca735..6c3fe0626 100644
--- a/apps/admin/app/(all)/(home)/sign-in-form.tsx
+++ b/apps/admin/app/(all)/(home)/sign-in-form.tsx
@@ -45,7 +45,7 @@ const defaultFromData: TFormData = {
   password: "",
 };
 
-export const InstanceSignInForm: React.FC = () => {
+export function InstanceSignInForm() {
   // search params
   const searchParams = useSearchParams();
   const emailParam = searchParams.get("email") || undefined;
@@ -192,4 +192,4 @@ export const InstanceSignInForm: React.FC = () => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/admin/app/(all)/instance.provider.tsx b/apps/admin/app/(all)/instance.provider.tsx
index 8a5cadcd1..5dcd3b6f5 100644
--- a/apps/admin/app/(all)/instance.provider.tsx
+++ b/apps/admin/app/(all)/instance.provider.tsx
@@ -3,7 +3,7 @@ import useSWR from "swr";
 // hooks
 import { useInstance } from "@/hooks/store";
 
-export const InstanceProvider = observer<React.FC<React.PropsWithChildren>>((props) => {
+export const InstanceProvider = observer(function InstanceProvider(props: React.PropsWithChildren) {
   const { children } = props;
   // store hooks
   const { fetchInstanceInfo } = useInstance();
diff --git a/apps/admin/app/(all)/store.provider.tsx b/apps/admin/app/(all)/store.provider.tsx
index 35c6cbc01..8df99e062 100644
--- a/apps/admin/app/(all)/store.provider.tsx
+++ b/apps/admin/app/(all)/store.provider.tsx
@@ -28,7 +28,7 @@ export type StoreProviderProps = {
   initialState?: any;
 };
 
-export const StoreProvider = ({ children, initialState = {} }: StoreProviderProps) => {
+export function StoreProvider({ children, initialState = {} }: StoreProviderProps) {
   const store = initializeStore(initialState);
   return <StoreContext.Provider value={store}>{children}</StoreContext.Provider>;
-};
+}
diff --git a/apps/admin/app/(all)/toast.tsx b/apps/admin/app/(all)/toast.tsx
index 9cd1c46a1..7e5849ab3 100644
--- a/apps/admin/app/(all)/toast.tsx
+++ b/apps/admin/app/(all)/toast.tsx
@@ -4,7 +4,7 @@ import { useTheme } from "next-themes";
 import { Toast } from "@plane/propel/toast";
 import { resolveGeneralTheme } from "@plane/utils";
 
-export const ToastWithTheme = () => {
+export function ToastWithTheme() {
   const { resolvedTheme } = useTheme();
   return <Toast theme={resolveGeneralTheme(resolvedTheme)} />;
-};
+}
diff --git a/apps/admin/app/(all)/user.provider.tsx b/apps/admin/app/(all)/user.provider.tsx
index 5ff9e88c7..167104f38 100644
--- a/apps/admin/app/(all)/user.provider.tsx
+++ b/apps/admin/app/(all)/user.provider.tsx
@@ -6,7 +6,7 @@ import useSWR from "swr";
 // hooks
 import { useInstance, useTheme, useUser } from "@/hooks/store";
 
-export const UserProvider = observer<React.FC<React.PropsWithChildren>>(({ children }) => {
+export const UserProvider = observer(function UserProvider({ children }: React.PropsWithChildren) {
   // hooks
   const { isSidebarCollapsed, toggleSidebar } = useTheme();
   const { currentUser, fetchCurrentUser } = useUser();
diff --git a/apps/admin/app/compat/next/image.tsx b/apps/admin/app/compat/next/image.tsx
index 91de8b781..6be0c536f 100644
--- a/apps/admin/app/compat/next/image.tsx
+++ b/apps/admin/app/compat/next/image.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import React from "react";
 
 // Minimal shim so code using next/image compiles under React Router + Vite
@@ -9,6 +8,8 @@ type NextImageProps = React.ImgHTMLAttributes<HTMLImageElement> & {
   src: string;
 };
 
-const Image: React.FC<NextImageProps> = ({ src, alt = "", ...rest }) => <img src={src} alt={alt} {...rest} />;
+function Image({ src, alt = "", ...rest }: NextImageProps) {
+  return <img src={src} alt={alt} {...rest} />;
+}
 
 export default Image;
diff --git a/apps/admin/app/compat/next/link.tsx b/apps/admin/app/compat/next/link.tsx
index 4f4236327..00ddf0ed5 100644
--- a/apps/admin/app/compat/next/link.tsx
+++ b/apps/admin/app/compat/next/link.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import React from "react";
 import { Link as RRLink } from "react-router";
 import { ensureTrailingSlash } from "./helper";
@@ -12,13 +11,8 @@ type NextLinkProps = React.ComponentProps<"a"> & {
   shallow?: boolean; // next.js prop, ignored
 };
 
-const Link: React.FC<NextLinkProps> = ({
-  href,
-  replace,
-  prefetch: _prefetch,
-  scroll: _scroll,
-  shallow: _shallow,
-  ...rest
-}) => <RRLink to={ensureTrailingSlash(href)} replace={replace} {...rest} />;
+function Link({ href, replace, prefetch: _prefetch, scroll: _scroll, shallow: _shallow, ...rest }: NextLinkProps) {
+  return <RRLink to={ensureTrailingSlash(href)} replace={replace} {...rest} />;
+}
 
 export default Link;
diff --git a/apps/admin/app/components/404.tsx b/apps/admin/app/components/404.tsx
index fa17e4fcd..3851daa32 100644
--- a/apps/admin/app/components/404.tsx
+++ b/apps/admin/app/components/404.tsx
@@ -5,30 +5,32 @@ import { Button } from "@plane/propel/button";
 // images
 import Image404 from "@/app/assets/images/404.svg?url";
 
-const PageNotFound = () => (
-  <div className={`h-screen w-full overflow-hidden bg-custom-background-100`}>
-    <div className="grid h-full place-items-center p-4">
-      <div className="space-y-8 text-center">
-        <div className="relative mx-auto h-60 w-60 lg:h-80 lg:w-80">
-          <img src={Image404} alt="404 - Page not found" className="h-full w-full object-contain" />
+function PageNotFound() {
+  return (
+    <div className={`h-screen w-full overflow-hidden bg-custom-background-100`}>
+      <div className="grid h-full place-items-center p-4">
+        <div className="space-y-8 text-center">
+          <div className="relative mx-auto h-60 w-60 lg:h-80 lg:w-80">
+            <img src={Image404} alt="404 - Page not found" className="h-full w-full object-contain" />
+          </div>
+          <div className="space-y-2">
+            <h3 className="text-lg font-semibold">Oops! Something went wrong.</h3>
+            <p className="text-sm text-custom-text-200">
+              Sorry, the page you are looking for cannot be found. It may have been removed, had its name changed, or is
+              temporarily unavailable.
+            </p>
+          </div>
+          <Link to="/general/">
+            <span className="flex justify-center py-4">
+              <Button variant="neutral-primary" size="md">
+                Go to general settings
+              </Button>
+            </span>
+          </Link>
         </div>
-        <div className="space-y-2">
-          <h3 className="text-lg font-semibold">Oops! Something went wrong.</h3>
-          <p className="text-sm text-custom-text-200">
-            Sorry, the page you are looking for cannot be found. It may have been removed, had its name changed, or is
-            temporarily unavailable.
-          </p>
-        </div>
-        <Link to="/general/">
-          <span className="flex justify-center py-4">
-            <Button variant="neutral-primary" size="md">
-              Go to general settings
-            </Button>
-          </span>
-        </Link>
       </div>
     </div>
-  </div>
-);
+  );
+}
 
 export default PageNotFound;
diff --git a/apps/admin/ce/components/authentication/authentication-modes.tsx b/apps/admin/ce/components/authentication/authentication-modes.tsx
index 402716d3f..7b0f658d8 100644
--- a/apps/admin/ce/components/authentication/authentication-modes.tsx
+++ b/apps/admin/ce/components/authentication/authentication-modes.tsx
@@ -106,7 +106,7 @@ export const getAuthenticationModes: (props: TGetBaseAuthenticationModeProps) =>
   },
 ];
 
-export const AuthenticationModes = observer<React.FC<TAuthenticationModeProps>>((props) => {
+export const AuthenticationModes = observer(function AuthenticationModes(props: TAuthenticationModeProps) {
   const { disabled, updateConfig } = props;
   // next-themes
   const { resolvedTheme } = useTheme();
diff --git a/apps/admin/ce/components/common/upgrade-button.tsx b/apps/admin/ce/components/common/upgrade-button.tsx
index 14a955f21..063c1ad80 100644
--- a/apps/admin/ce/components/common/upgrade-button.tsx
+++ b/apps/admin/ce/components/common/upgrade-button.tsx
@@ -7,9 +7,15 @@ import { SquareArrowOutUpRight } from "lucide-react";
 import { getButtonStyling } from "@plane/propel/button";
 import { cn } from "@plane/utils";
 
-export const UpgradeButton: React.FC = () => (
-  <a href="https://plane.so/pricing?mode=self-hosted" target="_blank" className={cn(getButtonStyling("primary", "sm"))}>
-    Upgrade
-    <SquareArrowOutUpRight className="h-3.5 w-3.5 p-0.5" />
-  </a>
-);
+export function UpgradeButton() {
+  return (
+    <a
+      href="https://plane.so/pricing?mode=self-hosted"
+      target="_blank"
+      className={cn(getButtonStyling("primary", "sm"))}
+    >
+      Upgrade
+      <SquareArrowOutUpRight className="h-3.5 w-3.5 p-0.5" />
+    </a>
+  );
+}
diff --git a/apps/admin/core/components/authentication/authentication-method-card.tsx b/apps/admin/core/components/authentication/authentication-method-card.tsx
index c1f613a96..88fa119f7 100644
--- a/apps/admin/core/components/authentication/authentication-method-card.tsx
+++ b/apps/admin/core/components/authentication/authentication-method-card.tsx
@@ -13,7 +13,7 @@ type Props = {
   unavailable?: boolean;
 };
 
-export const AuthenticationMethodCard: React.FC<Props> = (props) => {
+export function AuthenticationMethodCard(props: Props) {
   const { name, description, icon, config, disabled = false, withBorder = true, unavailable = false } = props;
 
   return (
@@ -52,4 +52,4 @@ export const AuthenticationMethodCard: React.FC<Props> = (props) => {
       <div className={`shrink-0 ${disabled && "opacity-70"}`}>{config}</div>
     </div>
   );
-};
+}
diff --git a/apps/admin/core/components/authentication/email-config-switch.tsx b/apps/admin/core/components/authentication/email-config-switch.tsx
index 3a2a5f541..46e0c9ec4 100644
--- a/apps/admin/core/components/authentication/email-config-switch.tsx
+++ b/apps/admin/core/components/authentication/email-config-switch.tsx
@@ -14,7 +14,7 @@ type Props = {
   updateConfig: (key: TInstanceAuthenticationMethodKeys, value: string) => void;
 };
 
-export const EmailCodesConfiguration: React.FC<Props> = observer((props) => {
+export const EmailCodesConfiguration = observer(function EmailCodesConfiguration(props: Props) {
   const { disabled, updateConfig } = props;
   // store
   const { formattedConfig } = useInstance();
diff --git a/apps/admin/core/components/authentication/gitea-config.tsx b/apps/admin/core/components/authentication/gitea-config.tsx
index 8b0b9b374..41775fe36 100644
--- a/apps/admin/core/components/authentication/gitea-config.tsx
+++ b/apps/admin/core/components/authentication/gitea-config.tsx
@@ -17,7 +17,7 @@ type Props = {
   updateConfig: (key: TInstanceAuthenticationMethodKeys, value: string) => void;
 };
 
-export const GiteaConfiguration: React.FC<Props> = observer((props) => {
+export const GiteaConfiguration = observer(function GiteaConfiguration(props: Props) {
   const { disabled, updateConfig } = props;
   // store
   const { formattedConfig } = useInstance();
diff --git a/apps/admin/core/components/authentication/github-config.tsx b/apps/admin/core/components/authentication/github-config.tsx
index 332191458..f164d8bc8 100644
--- a/apps/admin/core/components/authentication/github-config.tsx
+++ b/apps/admin/core/components/authentication/github-config.tsx
@@ -18,7 +18,7 @@ type Props = {
   updateConfig: (key: TInstanceAuthenticationMethodKeys, value: string) => void;
 };
 
-export const GithubConfiguration: React.FC<Props> = observer((props) => {
+export const GithubConfiguration = observer(function GithubConfiguration(props: Props) {
   const { disabled, updateConfig } = props;
   // store
   const { formattedConfig } = useInstance();
diff --git a/apps/admin/core/components/authentication/gitlab-config.tsx b/apps/admin/core/components/authentication/gitlab-config.tsx
index d491ec145..1250a1348 100644
--- a/apps/admin/core/components/authentication/gitlab-config.tsx
+++ b/apps/admin/core/components/authentication/gitlab-config.tsx
@@ -17,7 +17,7 @@ type Props = {
   updateConfig: (key: TInstanceAuthenticationMethodKeys, value: string) => void;
 };
 
-export const GitlabConfiguration: React.FC<Props> = observer((props) => {
+export const GitlabConfiguration = observer(function GitlabConfiguration(props: Props) {
   const { disabled, updateConfig } = props;
   // store
   const { formattedConfig } = useInstance();
diff --git a/apps/admin/core/components/authentication/google-config.tsx b/apps/admin/core/components/authentication/google-config.tsx
index a87c6027e..84bc31fc4 100644
--- a/apps/admin/core/components/authentication/google-config.tsx
+++ b/apps/admin/core/components/authentication/google-config.tsx
@@ -17,7 +17,7 @@ type Props = {
   updateConfig: (key: TInstanceAuthenticationMethodKeys, value: string) => void;
 };
 
-export const GoogleConfiguration: React.FC<Props> = observer((props) => {
+export const GoogleConfiguration = observer(function GoogleConfiguration(props: Props) {
   const { disabled, updateConfig } = props;
   // store
   const { formattedConfig } = useInstance();
diff --git a/apps/admin/core/components/authentication/password-config-switch.tsx b/apps/admin/core/components/authentication/password-config-switch.tsx
index 1126ff4fb..cc375c790 100644
--- a/apps/admin/core/components/authentication/password-config-switch.tsx
+++ b/apps/admin/core/components/authentication/password-config-switch.tsx
@@ -14,7 +14,7 @@ type Props = {
   updateConfig: (key: TInstanceAuthenticationMethodKeys, value: string) => void;
 };
 
-export const PasswordLoginConfiguration: React.FC<Props> = observer((props) => {
+export const PasswordLoginConfiguration = observer(function PasswordLoginConfiguration(props: Props) {
   const { disabled, updateConfig } = props;
   // store
   const { formattedConfig } = useInstance();
diff --git a/apps/admin/core/components/common/banner.tsx b/apps/admin/core/components/common/banner.tsx
index 32bc5bc77..dfc0d9ed0 100644
--- a/apps/admin/core/components/common/banner.tsx
+++ b/apps/admin/core/components/common/banner.tsx
@@ -6,7 +6,7 @@ type TBanner = {
   message: string;
 };
 
-export const Banner: FC<TBanner> = (props) => {
+export function Banner(props: TBanner) {
   const { type, message } = props;
 
   return (
@@ -29,4 +29,4 @@ export const Banner: FC<TBanner> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/admin/core/components/common/breadcrumb-link.tsx b/apps/admin/core/components/common/breadcrumb-link.tsx
index 567b88d92..7d83ac749 100644
--- a/apps/admin/core/components/common/breadcrumb-link.tsx
+++ b/apps/admin/core/components/common/breadcrumb-link.tsx
@@ -9,7 +9,7 @@ type Props = {
   icon?: React.ReactNode | undefined;
 };
 
-export const BreadcrumbLink: React.FC<Props> = (props) => {
+export function BreadcrumbLink(props: Props) {
   const { href, label, icon } = props;
   return (
     <Tooltip tooltipContent={label} position="bottom">
@@ -35,4 +35,4 @@ export const BreadcrumbLink: React.FC<Props> = (props) => {
       </li>
     </Tooltip>
   );
-};
+}
diff --git a/apps/admin/core/components/common/code-block.tsx b/apps/admin/core/components/common/code-block.tsx
index 88ad78a1e..ab4645949 100644
--- a/apps/admin/core/components/common/code-block.tsx
+++ b/apps/admin/core/components/common/code-block.tsx
@@ -6,16 +6,18 @@ type TProps = {
   darkerShade?: boolean;
 };
 
-export const CodeBlock = ({ children, className, darkerShade }: TProps) => (
-  <span
-    className={cn(
-      "px-0.5 text-xs text-custom-text-300 bg-custom-background-90 font-semibold rounded-md border border-custom-border-100",
-      {
-        "text-custom-text-200 bg-custom-background-80 border-custom-border-200": darkerShade,
-      },
-      className
-    )}
-  >
-    {children}
-  </span>
-);
+export function CodeBlock({ children, className, darkerShade }: TProps) {
+  return (
+    <span
+      className={cn(
+        "px-0.5 text-xs text-custom-text-300 bg-custom-background-90 font-semibold rounded-md border border-custom-border-100",
+        {
+          "text-custom-text-200 bg-custom-background-80 border-custom-border-200": darkerShade,
+        },
+        className
+      )}
+    >
+      {children}
+    </span>
+  );
+}
diff --git a/apps/admin/core/components/common/confirm-discard-modal.tsx b/apps/admin/core/components/common/confirm-discard-modal.tsx
index d1931f06f..bc2e27add 100644
--- a/apps/admin/core/components/common/confirm-discard-modal.tsx
+++ b/apps/admin/core/components/common/confirm-discard-modal.tsx
@@ -13,7 +13,7 @@ type Props = {
   onDiscardHref: string;
 };
 
-export const ConfirmDiscardModal: React.FC<Props> = (props) => {
+export function ConfirmDiscardModal(props: Props) {
   const { isOpen, handleClose, onDiscardHref } = props;
 
   return (
@@ -71,4 +71,4 @@ export const ConfirmDiscardModal: React.FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/admin/core/components/common/controller-input.tsx b/apps/admin/core/components/common/controller-input.tsx
index 4b16ffd07..ee5aef761 100644
--- a/apps/admin/core/components/common/controller-input.tsx
+++ b/apps/admin/core/components/common/controller-input.tsx
@@ -30,7 +30,7 @@ export type TControllerInputFormField = {
   required: boolean;
 };
 
-export const ControllerInput: React.FC<Props> = (props) => {
+export function ControllerInput(props: Props) {
   const { name, control, type, label, description, placeholder, error, required } = props;
   // states
   const [showPassword, setShowPassword] = useState(false);
@@ -81,4 +81,4 @@ export const ControllerInput: React.FC<Props> = (props) => {
       {description && <p className="pt-0.5 text-xs text-custom-text-300">{description}</p>}
     </div>
   );
-};
+}
diff --git a/apps/admin/core/components/common/copy-field.tsx b/apps/admin/core/components/common/copy-field.tsx
index 4f4f71753..e1f67adbb 100644
--- a/apps/admin/core/components/common/copy-field.tsx
+++ b/apps/admin/core/components/common/copy-field.tsx
@@ -19,7 +19,7 @@ export type TCopyField = {
   description: string | React.ReactNode;
 };
 
-export const CopyField: React.FC<Props> = (props) => {
+export function CopyField(props: Props) {
   const { label, url, description } = props;
 
   return (
@@ -43,4 +43,4 @@ export const CopyField: React.FC<Props> = (props) => {
       <div className="text-xs text-custom-text-300">{description}</div>
     </div>
   );
-};
+}
diff --git a/apps/admin/core/components/common/empty-state.tsx b/apps/admin/core/components/common/empty-state.tsx
index d0dae31aa..91bd53a17 100644
--- a/apps/admin/core/components/common/empty-state.tsx
+++ b/apps/admin/core/components/common/empty-state.tsx
@@ -16,32 +16,27 @@ type Props = {
   disabled?: boolean;
 };
 
-export const EmptyState: React.FC<Props> = ({
-  title,
-  description,
-  image,
-  primaryButton,
-  secondaryButton,
-  disabled = false,
-}) => (
-  <div className={`flex h-full w-full items-center justify-center`}>
-    <div className="flex w-full flex-col items-center text-center">
-      {image && <img src={image} className="w-52 sm:w-60" alt={primaryButton?.text || "button image"} />}
-      <h6 className="mb-3 mt-6 text-xl font-semibold sm:mt-8">{title}</h6>
-      {description && <p className="mb-7 px-5 text-custom-text-300 sm:mb-8">{description}</p>}
-      <div className="flex items-center gap-4">
-        {primaryButton && (
-          <Button
-            variant="primary"
-            prependIcon={primaryButton.icon}
-            onClick={primaryButton.onClick}
-            disabled={disabled}
-          >
-            {primaryButton.text}
-          </Button>
-        )}
-        {secondaryButton}
+export function EmptyState({ title, description, image, primaryButton, secondaryButton, disabled = false }: Props) {
+  return (
+    <div className={`flex h-full w-full items-center justify-center`}>
+      <div className="flex w-full flex-col items-center text-center">
+        {image && <img src={image} className="w-52 sm:w-60" alt={primaryButton?.text || "button image"} />}
+        <h6 className="mb-3 mt-6 text-xl font-semibold sm:mt-8">{title}</h6>
+        {description && <p className="mb-7 px-5 text-custom-text-300 sm:mb-8">{description}</p>}
+        <div className="flex items-center gap-4">
+          {primaryButton && (
+            <Button
+              variant="primary"
+              prependIcon={primaryButton.icon}
+              onClick={primaryButton.onClick}
+              disabled={disabled}
+            >
+              {primaryButton.text}
+            </Button>
+          )}
+          {secondaryButton}
+        </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/admin/core/components/common/logo-spinner.tsx b/apps/admin/core/components/common/logo-spinner.tsx
index f51bdfe17..4d06d2822 100644
--- a/apps/admin/core/components/common/logo-spinner.tsx
+++ b/apps/admin/core/components/common/logo-spinner.tsx
@@ -2,7 +2,7 @@ import { useTheme } from "next-themes";
 import LogoSpinnerDark from "@/app/assets/images/logo-spinner-dark.gif?url";
 import LogoSpinnerLight from "@/app/assets/images/logo-spinner-light.gif?url";
 
-export const LogoSpinner = () => {
+export function LogoSpinner() {
   const { resolvedTheme } = useTheme();
 
   const logoSrc = resolvedTheme === "dark" ? LogoSpinnerLight : LogoSpinnerDark;
@@ -12,4 +12,4 @@ export const LogoSpinner = () => {
       <img src={logoSrc} alt="logo" className="h-6 w-auto sm:h-11" />
     </div>
   );
-};
+}
diff --git a/apps/admin/core/components/common/page-header.tsx b/apps/admin/core/components/common/page-header.tsx
index a4b27b92f..f371131dc 100644
--- a/apps/admin/core/components/common/page-header.tsx
+++ b/apps/admin/core/components/common/page-header.tsx
@@ -5,7 +5,7 @@ type TPageHeader = {
   description?: string;
 };
 
-export const PageHeader: React.FC<TPageHeader> = (props) => {
+export function PageHeader(props: TPageHeader) {
   const { title = "God Mode - Plane", description = "Plane god mode" } = props;
 
   return (
@@ -14,4 +14,4 @@ export const PageHeader: React.FC<TPageHeader> = (props) => {
       <meta name="description" content={description} />
     </>
   );
-};
+}
diff --git a/apps/admin/core/components/instance/failure.tsx b/apps/admin/core/components/instance/failure.tsx
index 746c141f6..f4ffc8f8d 100644
--- a/apps/admin/core/components/instance/failure.tsx
+++ b/apps/admin/core/components/instance/failure.tsx
@@ -7,7 +7,7 @@ import { AuthHeader } from "@/app/(all)/(home)/auth-header";
 import InstanceFailureDarkImage from "@/app/assets/instance/instance-failure-dark.svg?url";
 import InstanceFailureImage from "@/app/assets/instance/instance-failure.svg?url";
 
-export const InstanceFailureView: React.FC = observer(() => {
+export const InstanceFailureView = observer(function InstanceFailureView() {
   const { resolvedTheme } = useTheme();
 
   const instanceImage = resolvedTheme === "dark" ? InstanceFailureDarkImage : InstanceFailureImage;
diff --git a/apps/admin/core/components/instance/form-header.tsx b/apps/admin/core/components/instance/form-header.tsx
index d915ad293..a2e4155c0 100644
--- a/apps/admin/core/components/instance/form-header.tsx
+++ b/apps/admin/core/components/instance/form-header.tsx
@@ -1,8 +1,10 @@
 "use client";
 
-export const FormHeader = ({ heading, subHeading }: { heading: string; subHeading: string }) => (
-  <div className="flex flex-col gap-1">
-    <span className="text-2xl font-semibold text-custom-text-100 leading-7">{heading}</span>
-    <span className="text-lg font-semibold text-custom-text-400 leading-7">{subHeading}</span>
-  </div>
-);
+export function FormHeader({ heading, subHeading }: { heading: string; subHeading: string }) {
+  return (
+    <div className="flex flex-col gap-1">
+      <span className="text-2xl font-semibold text-custom-text-100 leading-7">{heading}</span>
+      <span className="text-lg font-semibold text-custom-text-400 leading-7">{subHeading}</span>
+    </div>
+  );
+}
diff --git a/apps/admin/core/components/instance/instance-not-ready.tsx b/apps/admin/core/components/instance/instance-not-ready.tsx
index d47b14f67..20f80060b 100644
--- a/apps/admin/core/components/instance/instance-not-ready.tsx
+++ b/apps/admin/core/components/instance/instance-not-ready.tsx
@@ -5,24 +5,26 @@ import { Button } from "@plane/propel/button";
 // assets
 import PlaneTakeOffImage from "@/app/assets/images/plane-takeoff.png?url";
 
-export const InstanceNotReady: React.FC = () => (
-  <div className="h-full w-full relative container px-5 mx-auto flex justify-center items-center">
-    <div className="w-auto max-w-2xl relative space-y-8 py-10">
-      <div className="relative flex flex-col justify-center items-center space-y-4">
-        <h1 className="text-3xl font-bold pb-3">Welcome aboard Plane!</h1>
-        <img src={PlaneTakeOffImage} alt="Plane Logo" />
-        <p className="font-medium text-base text-custom-text-400">
-          Get started by setting up your instance and workspace
-        </p>
-      </div>
+export function InstanceNotReady() {
+  return (
+    <div className="h-full w-full relative container px-5 mx-auto flex justify-center items-center">
+      <div className="w-auto max-w-2xl relative space-y-8 py-10">
+        <div className="relative flex flex-col justify-center items-center space-y-4">
+          <h1 className="text-3xl font-bold pb-3">Welcome aboard Plane!</h1>
+          <img src={PlaneTakeOffImage} alt="Plane Logo" />
+          <p className="font-medium text-base text-custom-text-400">
+            Get started by setting up your instance and workspace
+          </p>
+        </div>
 
-      <div>
-        <Link href={"/setup/?auth_enabled=0"}>
-          <Button size="lg" className="w-full">
-            Get started
-          </Button>
-        </Link>
+        <div>
+          <Link href={"/setup/?auth_enabled=0"}>
+            <Button size="lg" className="w-full">
+              Get started
+            </Button>
+          </Link>
+        </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/admin/core/components/instance/loading.tsx b/apps/admin/core/components/instance/loading.tsx
index 72d7c24c8..2b45deff2 100644
--- a/apps/admin/core/components/instance/loading.tsx
+++ b/apps/admin/core/components/instance/loading.tsx
@@ -3,7 +3,7 @@ import { useTheme } from "next-themes";
 import LogoSpinnerDark from "@/app/assets/images/logo-spinner-dark.gif?url";
 import LogoSpinnerLight from "@/app/assets/images/logo-spinner-light.gif?url";
 
-export const InstanceLoading = () => {
+export function InstanceLoading() {
   const { resolvedTheme } = useTheme();
 
   const logoSrc = resolvedTheme === "dark" ? LogoSpinnerLight : LogoSpinnerDark;
@@ -13,4 +13,4 @@ export const InstanceLoading = () => {
       <img src={logoSrc} alt="logo" className="h-6 w-auto sm:h-11" />
     </div>
   );
-};
+}
diff --git a/apps/admin/core/components/instance/setup-form.tsx b/apps/admin/core/components/instance/setup-form.tsx
index eae4c6d87..ab64a66c1 100644
--- a/apps/admin/core/components/instance/setup-form.tsx
+++ b/apps/admin/core/components/instance/setup-form.tsx
@@ -53,7 +53,7 @@ const defaultFromData: TFormData = {
   is_telemetry_enabled: true,
 };
 
-export const InstanceSetupForm: React.FC = (props) => {
+export function InstanceSetupForm(props) {
   const {} = props;
   // search params
   const searchParams = useSearchParams();
@@ -351,4 +351,4 @@ export const InstanceSetupForm: React.FC = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/admin/core/components/new-user-popup.tsx b/apps/admin/core/components/new-user-popup.tsx
index 6192f5741..43562c93f 100644
--- a/apps/admin/core/components/new-user-popup.tsx
+++ b/apps/admin/core/components/new-user-popup.tsx
@@ -12,7 +12,7 @@ import TakeoffIconLight from "@/app/assets/logos/takeoff-icon-light.svg?url";
 import { useTheme } from "@/hooks/store";
 // icons
 
-export const NewUserPopup = observer(() => {
+export const NewUserPopup = observer(function NewUserPopup() {
   // hooks
   const { isNewUserPopup, toggleNewUserPopup } = useTheme();
   // theme
diff --git a/apps/admin/core/components/workspace/list-item.tsx b/apps/admin/core/components/workspace/list-item.tsx
index 85a2b3c61..31252a315 100644
--- a/apps/admin/core/components/workspace/list-item.tsx
+++ b/apps/admin/core/components/workspace/list-item.tsx
@@ -11,7 +11,7 @@ type TWorkspaceListItemProps = {
   workspaceId: string;
 };
 
-export const WorkspaceListItem = observer(({ workspaceId }: TWorkspaceListItemProps) => {
+export const WorkspaceListItem = observer(function WorkspaceListItem({ workspaceId }: TWorkspaceListItemProps) {
   // store hooks
   const { getWorkspaceById } = useWorkspace();
   // derived values
diff --git a/apps/space/app/compat/next/image.tsx b/apps/space/app/compat/next/image.tsx
index 91de8b781..6be0c536f 100644
--- a/apps/space/app/compat/next/image.tsx
+++ b/apps/space/app/compat/next/image.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import React from "react";
 
 // Minimal shim so code using next/image compiles under React Router + Vite
@@ -9,6 +8,8 @@ type NextImageProps = React.ImgHTMLAttributes<HTMLImageElement> & {
   src: string;
 };
 
-const Image: React.FC<NextImageProps> = ({ src, alt = "", ...rest }) => <img src={src} alt={alt} {...rest} />;
+function Image({ src, alt = "", ...rest }: NextImageProps) {
+  return <img src={src} alt={alt} {...rest} />;
+}
 
 export default Image;
diff --git a/apps/space/app/compat/next/link.tsx b/apps/space/app/compat/next/link.tsx
index 4f4236327..00ddf0ed5 100644
--- a/apps/space/app/compat/next/link.tsx
+++ b/apps/space/app/compat/next/link.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import React from "react";
 import { Link as RRLink } from "react-router";
 import { ensureTrailingSlash } from "./helper";
@@ -12,13 +11,8 @@ type NextLinkProps = React.ComponentProps<"a"> & {
   shallow?: boolean; // next.js prop, ignored
 };
 
-const Link: React.FC<NextLinkProps> = ({
-  href,
-  replace,
-  prefetch: _prefetch,
-  scroll: _scroll,
-  shallow: _shallow,
-  ...rest
-}) => <RRLink to={ensureTrailingSlash(href)} replace={replace} {...rest} />;
+function Link({ href, replace, prefetch: _prefetch, scroll: _scroll, shallow: _shallow, ...rest }: NextLinkProps) {
+  return <RRLink to={ensureTrailingSlash(href)} replace={replace} {...rest} />;
+}
 
 export default Link;
diff --git a/apps/space/app/error.tsx b/apps/space/app/error.tsx
index 98fe1cd0a..ef907d233 100644
--- a/apps/space/app/error.tsx
+++ b/apps/space/app/error.tsx
@@ -1,9 +1,8 @@
 "use client";
-
 // ui
 import { Button } from "@plane/propel/button";
 
-const ErrorPage = () => {
+function ErrorPage() {
   const handleRetry = () => {
     window.location.reload();
   };
@@ -42,6 +41,6 @@ const ErrorPage = () => {
       </div>
     </div>
   );
-};
+}
 
 export default ErrorPage;
diff --git a/apps/space/app/issues/[anchor]/page.tsx b/apps/space/app/issues/[anchor]/page.tsx
index c4a4eb1bd..04b8c3089 100644
--- a/apps/space/app/issues/[anchor]/page.tsx
+++ b/apps/space/app/issues/[anchor]/page.tsx
@@ -10,7 +10,7 @@ import { usePublish } from "@/hooks/store/publish";
 import { useLabel } from "@/hooks/store/use-label";
 import { useStates } from "@/hooks/store/use-state";
 
-const IssuesPage = observer(() => {
+const IssuesPage = observer(function IssuesPage() {
   // params
   const params = useParams<{ anchor: string }>();
   const { anchor } = params;
diff --git a/apps/space/app/not-found.tsx b/apps/space/app/not-found.tsx
index e902cd050..36dc848be 100644
--- a/apps/space/app/not-found.tsx
+++ b/apps/space/app/not-found.tsx
@@ -1,22 +1,23 @@
 "use client";
-
 // assets
 import SomethingWentWrongImage from "@/app/assets/something-went-wrong.svg?url";
 
-const NotFound = () => (
-  <div className="h-screen w-screen grid place-items-center">
-    <div className="text-center">
-      <div className="mx-auto size-32 md:size-52 grid place-items-center rounded-full bg-custom-background-80">
-        <div className="size-16 md:size-32 grid place-items-center">
-          <img src={SomethingWentWrongImage} alt="Something went wrong" width={128} height={128} />
+function NotFound() {
+  return (
+    <div className="h-screen w-screen grid place-items-center">
+      <div className="text-center">
+        <div className="mx-auto size-32 md:size-52 grid place-items-center rounded-full bg-custom-background-80">
+          <div className="size-16 md:size-32 grid place-items-center">
+            <img src={SomethingWentWrongImage} alt="Something went wrong" width={128} height={128} />
+          </div>
         </div>
+        <h1 className="mt-8 md:mt-12 text-xl md:text-3xl font-semibold">That didn{"'"}t work</h1>
+        <p className="mt-2 md:mt-4 text-sm md:text-base">
+          Check the URL you are entering in the browser{"'"}s address bar and try again.
+        </p>
       </div>
-      <h1 className="mt-8 md:mt-12 text-xl md:text-3xl font-semibold">That didn{"'"}t work</h1>
-      <p className="mt-2 md:mt-4 text-sm md:text-base">
-        Check the URL you are entering in the browser{"'"}s address bar and try again.
-      </p>
     </div>
-  </div>
-);
+  );
+}
 
 export default NotFound;
diff --git a/apps/space/app/page.tsx b/apps/space/app/page.tsx
index f544bcb10..d17632b32 100644
--- a/apps/space/app/page.tsx
+++ b/apps/space/app/page.tsx
@@ -11,7 +11,7 @@ import { AuthView } from "@/components/views";
 // hooks
 import { useUser } from "@/hooks/store/use-user";
 
-const HomePage = observer(() => {
+const HomePage = observer(function HomePage() {
   const { data: currentUser, isAuthenticated, isInitializing } = useUser();
   const searchParams = useSearchParams();
   const router = useRouter();
diff --git a/apps/space/ce/components/editor/embeds/mentions/root.tsx b/apps/space/ce/components/editor/embeds/mentions/root.tsx
index 299a1e36a..b04de12cf 100644
--- a/apps/space/ce/components/editor/embeds/mentions/root.tsx
+++ b/apps/space/ce/components/editor/embeds/mentions/root.tsx
@@ -1,4 +1,6 @@
 // plane editor
 import type { TCallbackMentionComponentProps } from "@plane/editor";
 
-export const EditorAdditionalMentionsRoot: React.FC<TCallbackMentionComponentProps> = () => null;
+export function EditorAdditionalMentionsRoot(_props: TCallbackMentionComponentProps) {
+  return null;
+}
diff --git a/apps/space/ce/components/issue-layouts/root.tsx b/apps/space/ce/components/issue-layouts/root.tsx
index 028bf4e91..95d58029d 100644
--- a/apps/space/ce/components/issue-layouts/root.tsx
+++ b/apps/space/ce/components/issue-layouts/root.tsx
@@ -6,4 +6,6 @@ type Props = {
   publishSettings: PublishStore;
 };
 
-export const ViewLayoutsRoot = (_props: Props) => <PageNotFound />;
+export function ViewLayoutsRoot(_props: Props) {
+  return <PageNotFound />;
+}
diff --git a/apps/space/ce/components/navbar/index.tsx b/apps/space/ce/components/navbar/index.tsx
index 0d00777ce..e91b2d47e 100644
--- a/apps/space/ce/components/navbar/index.tsx
+++ b/apps/space/ce/components/navbar/index.tsx
@@ -5,4 +5,6 @@ type Props = {
 };
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const ViewNavbarRoot = (props: Props) => <></>;
+export function ViewNavbarRoot(props: Props) {
+  return <></>;
+}
diff --git a/apps/space/core/components/account/auth-forms/auth-banner.tsx b/apps/space/core/components/account/auth-forms/auth-banner.tsx
index 3006beacf..6f14a0eec 100644
--- a/apps/space/core/components/account/auth-forms/auth-banner.tsx
+++ b/apps/space/core/components/account/auth-forms/auth-banner.tsx
@@ -10,7 +10,7 @@ type TAuthBanner = {
   handleBannerData?: (bannerData: TAuthErrorInfo | undefined) => void;
 };
 
-export const AuthBanner: React.FC<TAuthBanner> = (props) => {
+export function AuthBanner(props: TAuthBanner) {
   const { bannerData, handleBannerData } = props;
 
   if (!bannerData) return <></>;
@@ -28,4 +28,4 @@ export const AuthBanner: React.FC<TAuthBanner> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/space/core/components/account/auth-forms/auth-header.tsx b/apps/space/core/components/account/auth-forms/auth-header.tsx
index 8e8aa196c..0be74a77f 100644
--- a/apps/space/core/components/account/auth-forms/auth-header.tsx
+++ b/apps/space/core/components/account/auth-forms/auth-header.tsx
@@ -27,7 +27,7 @@ const Titles: TAuthHeaderDetails = {
   },
 };
 
-export const AuthHeader: React.FC<TAuthHeader> = (props) => {
+export function AuthHeader(props: TAuthHeader) {
   const { authMode } = props;
 
   const getHeaderSubHeader = (mode: EAuthModes | null): TAuthHeaderContent => {
@@ -51,4 +51,4 @@ export const AuthHeader: React.FC<TAuthHeader> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/space/core/components/account/auth-forms/auth-root.tsx b/apps/space/core/components/account/auth-forms/auth-root.tsx
index a9c0f92bd..0fb41de65 100644
--- a/apps/space/core/components/account/auth-forms/auth-root.tsx
+++ b/apps/space/core/components/account/auth-forms/auth-root.tsx
@@ -32,7 +32,7 @@ import { AuthUniqueCodeForm } from "./unique-code";
 
 const authService = new SitesAuthService();
 
-export const AuthRoot: React.FC = observer(() => {
+export const AuthRoot = observer(function AuthRoot() {
   // router params
   const searchParams = useSearchParams();
   const emailParam = searchParams.get("email") || undefined;
diff --git a/apps/space/core/components/account/auth-forms/email.tsx b/apps/space/core/components/account/auth-forms/email.tsx
index 8b0fa712a..69f058462 100644
--- a/apps/space/core/components/account/auth-forms/email.tsx
+++ b/apps/space/core/components/account/auth-forms/email.tsx
@@ -19,7 +19,7 @@ type TAuthEmailForm = {
   onSubmit: (data: IEmailCheckData) => Promise<void>;
 };
 
-export const AuthEmailForm: React.FC<TAuthEmailForm> = observer((props) => {
+export const AuthEmailForm = observer(function AuthEmailForm(props: TAuthEmailForm) {
   const { onSubmit, defaultEmail } = props;
   // states
   const [isSubmitting, setIsSubmitting] = useState(false);
diff --git a/apps/space/core/components/account/auth-forms/password.tsx b/apps/space/core/components/account/auth-forms/password.tsx
index acd081bfc..d821711cf 100644
--- a/apps/space/core/components/account/auth-forms/password.tsx
+++ b/apps/space/core/components/account/auth-forms/password.tsx
@@ -35,7 +35,7 @@ const defaultValues: TPasswordFormValues = {
 
 const authService = new AuthService();
 
-export const AuthPasswordForm: React.FC<Props> = observer((props: Props) => {
+export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props) {
   const { email, nextPath, isSMTPConfigured, handleAuthStep, handleEmailClear, mode } = props;
   // ref
   const formRef = useRef<HTMLFormElement>(null);
diff --git a/apps/space/core/components/account/auth-forms/unique-code.tsx b/apps/space/core/components/account/auth-forms/unique-code.tsx
index 8e691cf8e..1cd7ebb85 100644
--- a/apps/space/core/components/account/auth-forms/unique-code.tsx
+++ b/apps/space/core/components/account/auth-forms/unique-code.tsx
@@ -33,7 +33,7 @@ const defaultValues: TUniqueCodeFormValues = {
   code: "",
 };
 
-export const AuthUniqueCodeForm: React.FC<TAuthUniqueCodeForm> = (props) => {
+export function AuthUniqueCodeForm(props: TAuthUniqueCodeForm) {
   const { mode, email, nextPath, handleEmailClear, generateEmailUniqueCode } = props;
   // derived values
   const defaultResetTimerValue = 5;
@@ -150,4 +150,4 @@ export const AuthUniqueCodeForm: React.FC<TAuthUniqueCodeForm> = (props) => {
       </div>
     </form>
   );
-};
+}
diff --git a/apps/space/core/components/account/terms-and-conditions.tsx b/apps/space/core/components/account/terms-and-conditions.tsx
index bd5a3ed2e..e7b7a623e 100644
--- a/apps/space/core/components/account/terms-and-conditions.tsx
+++ b/apps/space/core/components/account/terms-and-conditions.tsx
@@ -6,7 +6,7 @@ type Props = {
   isSignUp?: boolean;
 };
 
-export const TermsAndConditions: React.FC<Props> = (props) => {
+export function TermsAndConditions(props: Props) {
   const { isSignUp = false } = props;
   return (
     <span className="flex items-center justify-center py-6">
@@ -23,4 +23,4 @@ export const TermsAndConditions: React.FC<Props> = (props) => {
       </p>
     </span>
   );
-};
+}
diff --git a/apps/space/core/components/account/user-logged-in.tsx b/apps/space/core/components/account/user-logged-in.tsx
index f211c5680..4762ea178 100644
--- a/apps/space/core/components/account/user-logged-in.tsx
+++ b/apps/space/core/components/account/user-logged-in.tsx
@@ -10,7 +10,7 @@ import { UserAvatar } from "@/components/issues/navbar/user-avatar";
 // hooks
 import { useUser } from "@/hooks/store/use-user";
 
-export const UserLoggedIn = observer(() => {
+export const UserLoggedIn = observer(function UserLoggedIn() {
   // store hooks
   const { data: user } = useUser();
 
diff --git a/apps/space/core/components/common/logo-spinner.tsx b/apps/space/core/components/common/logo-spinner.tsx
index 6f7f843eb..cff21a423 100644
--- a/apps/space/core/components/common/logo-spinner.tsx
+++ b/apps/space/core/components/common/logo-spinner.tsx
@@ -5,7 +5,7 @@ import { useTheme } from "next-themes";
 import LogoSpinnerDark from "@/app/assets/images/logo-spinner-dark.gif?url";
 import LogoSpinnerLight from "@/app/assets/images/logo-spinner-light.gif?url";
 
-export const LogoSpinner = () => {
+export function LogoSpinner() {
   const { resolvedTheme } = useTheme();
 
   const logoSrc = resolvedTheme === "dark" ? LogoSpinnerLight : LogoSpinnerDark;
@@ -15,4 +15,4 @@ export const LogoSpinner = () => {
       <img src={logoSrc} alt="logo" className="h-6 w-auto sm:h-11" />
     </div>
   );
-};
+}
diff --git a/apps/space/core/components/common/powered-by.tsx b/apps/space/core/components/common/powered-by.tsx
index 57734feb6..e51eb26b2 100644
--- a/apps/space/core/components/common/powered-by.tsx
+++ b/apps/space/core/components/common/powered-by.tsx
@@ -8,7 +8,7 @@ type TPoweredBy = {
   disabled?: boolean;
 };
 
-export const PoweredBy: React.FC<TPoweredBy> = (props) => {
+export function PoweredBy(props: TPoweredBy) {
   // props
   const { disabled = false } = props;
 
@@ -27,4 +27,4 @@ export const PoweredBy: React.FC<TPoweredBy> = (props) => {
       </div>
     </a>
   );
-};
+}
diff --git a/apps/space/core/components/common/project-logo.tsx b/apps/space/core/components/common/project-logo.tsx
index bea8e213f..5f7869afe 100644
--- a/apps/space/core/components/common/project-logo.tsx
+++ b/apps/space/core/components/common/project-logo.tsx
@@ -8,7 +8,7 @@ type Props = {
   logo: TLogoProps;
 };
 
-export const ProjectLogo: React.FC<Props> = (props) => {
+export function ProjectLogo(props: Props) {
   const { className, logo } = props;
 
   if (logo.in_use === "icon" && logo.icon)
@@ -31,4 +31,4 @@ export const ProjectLogo: React.FC<Props> = (props) => {
     );
 
   return <span />;
-};
+}
diff --git a/apps/space/core/components/editor/embeds/mentions/root.tsx b/apps/space/core/components/editor/embeds/mentions/root.tsx
index 348bc1e09..fc6454bd4 100644
--- a/apps/space/core/components/editor/embeds/mentions/root.tsx
+++ b/apps/space/core/components/editor/embeds/mentions/root.tsx
@@ -5,7 +5,7 @@ import { EditorAdditionalMentionsRoot } from "@/plane-web/components/editor";
 // local components
 import { EditorUserMention } from "./user";
 
-export const EditorMentionsRoot: React.FC<TCallbackMentionComponentProps> = (props) => {
+export function EditorMentionsRoot(props: TCallbackMentionComponentProps) {
   const { entity_identifier, entity_name } = props;
 
   switch (entity_name) {
@@ -14,4 +14,4 @@ export const EditorMentionsRoot: React.FC<TCallbackMentionComponentProps> = (pro
     default:
       return <EditorAdditionalMentionsRoot {...props} />;
   }
-};
+}
diff --git a/apps/space/core/components/editor/embeds/mentions/user.tsx b/apps/space/core/components/editor/embeds/mentions/user.tsx
index f75bcba3b..bb3cc3756 100644
--- a/apps/space/core/components/editor/embeds/mentions/user.tsx
+++ b/apps/space/core/components/editor/embeds/mentions/user.tsx
@@ -9,7 +9,7 @@ type Props = {
   id: string;
 };
 
-export const EditorUserMention: React.FC<Props> = observer((props) => {
+export const EditorUserMention = observer(function EditorUserMention(props: Props) {
   const { id } = props;
   // store hooks
   const { data: currentUser } = useUser();
diff --git a/apps/space/core/components/editor/lite-text-editor.tsx b/apps/space/core/components/editor/lite-text-editor.tsx
index c338ae5b2..0a6c50ddb 100644
--- a/apps/space/core/components/editor/lite-text-editor.tsx
+++ b/apps/space/core/components/editor/lite-text-editor.tsx
@@ -32,7 +32,10 @@ type LiteTextEditorWrapperProps = MakeOptional<
       }
   );
 
-export const LiteTextEditor = React.forwardRef<EditorRefApi, LiteTextEditorWrapperProps>((props, ref) => {
+export const LiteTextEditor = React.forwardRef(function LiteTextEditor(
+  props: LiteTextEditorWrapperProps,
+  ref: React.ForwardedRef<EditorRefApi>
+) {
   const {
     anchor,
     containerClassName,
diff --git a/apps/space/core/components/editor/rich-text-editor.tsx b/apps/space/core/components/editor/rich-text-editor.tsx
index c5c538674..d1273dd2b 100644
--- a/apps/space/core/components/editor/rich-text-editor.tsx
+++ b/apps/space/core/components/editor/rich-text-editor.tsx
@@ -29,7 +29,10 @@ type RichTextEditorWrapperProps = MakeOptional<
       }
   );
 
-export const RichTextEditor = forwardRef<EditorRefApi, RichTextEditorWrapperProps>((props, ref) => {
+export const RichTextEditor = forwardRef(function RichTextEditor(
+  props: RichTextEditorWrapperProps,
+  ref: React.ForwardedRef<EditorRefApi>
+) {
   const {
     anchor,
     containerClassName,
diff --git a/apps/space/core/components/editor/toolbar.tsx b/apps/space/core/components/editor/toolbar.tsx
index bb6347f42..a2fda440c 100644
--- a/apps/space/core/components/editor/toolbar.tsx
+++ b/apps/space/core/components/editor/toolbar.tsx
@@ -19,7 +19,7 @@ type Props = {
 
 const toolbarItems = TOOLBAR_ITEMS.lite;
 
-export const IssueCommentToolbar: React.FC<Props> = (props) => {
+export function IssueCommentToolbar(props: Props) {
   const { executeCommand, handleSubmit, isCommentEmpty, editorRef, isSubmitting, showSubmitButton } = props;
   // states
   const [activeStates, setActiveStates] = useState<Record<string, boolean>>({});
@@ -113,4 +113,4 @@ export const IssueCommentToolbar: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/space/core/components/instance/instance-failure-view.tsx b/apps/space/core/components/instance/instance-failure-view.tsx
index 5680b39d6..a257573d2 100644
--- a/apps/space/core/components/instance/instance-failure-view.tsx
+++ b/apps/space/core/components/instance/instance-failure-view.tsx
@@ -6,7 +6,7 @@ import { Button } from "@plane/propel/button";
 import InstanceFailureDarkImage from "@/app/assets/instance/instance-failure-dark.svg?url";
 import InstanceFailureImage from "@/app/assets/instance/instance-failure.svg?url";
 
-export const InstanceFailureView: React.FC = () => {
+export function InstanceFailureView() {
   const { resolvedTheme } = useTheme();
 
   const instanceImage = resolvedTheme === "dark" ? InstanceFailureDarkImage : InstanceFailureImage;
@@ -34,4 +34,4 @@ export const InstanceFailureView: React.FC = () => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/space/core/components/issues/filters/applied-filters/filters-list.tsx b/apps/space/core/components/issues/filters/applied-filters/filters-list.tsx
index bffc7c553..0b71b9cfa 100644
--- a/apps/space/core/components/issues/filters/applied-filters/filters-list.tsx
+++ b/apps/space/core/components/issues/filters/applied-filters/filters-list.tsx
@@ -17,7 +17,7 @@ type Props = {
 
 export const replaceUnderscoreIfSnakeCase = (str: string) => str.replace(/_/g, " ");
 
-export const AppliedFiltersList: React.FC<Props> = observer((props) => {
+export const AppliedFiltersList = observer(function AppliedFiltersList(props: Props) {
   const { appliedFilters = {}, handleRemoveAllFilters, handleRemoveFilter } = props;
   const { t } = useTranslation();
 
diff --git a/apps/space/core/components/issues/filters/applied-filters/label.tsx b/apps/space/core/components/issues/filters/applied-filters/label.tsx
index 2b842c152..47a30aa80 100644
--- a/apps/space/core/components/issues/filters/applied-filters/label.tsx
+++ b/apps/space/core/components/issues/filters/applied-filters/label.tsx
@@ -10,7 +10,7 @@ type Props = {
   values: string[];
 };
 
-export const AppliedLabelsFilters: React.FC<Props> = (props) => {
+export function AppliedLabelsFilters(props: Props) {
   const { handleRemove, labels, values } = props;
 
   return (
@@ -41,4 +41,4 @@ export const AppliedLabelsFilters: React.FC<Props> = (props) => {
       })}
     </>
   );
-};
+}
diff --git a/apps/space/core/components/issues/filters/applied-filters/priority.tsx b/apps/space/core/components/issues/filters/applied-filters/priority.tsx
index da151873f..b2bfb90f9 100644
--- a/apps/space/core/components/issues/filters/applied-filters/priority.tsx
+++ b/apps/space/core/components/issues/filters/applied-filters/priority.tsx
@@ -8,7 +8,7 @@ type Props = {
   values: TIssuePriorities[];
 };
 
-export const AppliedPriorityFilters: React.FC<Props> = (props) => {
+export function AppliedPriorityFilters(props: Props) {
   const { handleRemove, values } = props;
 
   return (
@@ -30,4 +30,4 @@ export const AppliedPriorityFilters: React.FC<Props> = (props) => {
         ))}
     </>
   );
-};
+}
diff --git a/apps/space/core/components/issues/filters/applied-filters/root.tsx b/apps/space/core/components/issues/filters/applied-filters/root.tsx
index a266e8de9..28813d0a6 100644
--- a/apps/space/core/components/issues/filters/applied-filters/root.tsx
+++ b/apps/space/core/components/issues/filters/applied-filters/root.tsx
@@ -15,7 +15,7 @@ type TIssueAppliedFilters = {
   anchor: string;
 };
 
-export const IssueAppliedFilters: React.FC<TIssueAppliedFilters> = observer((props) => {
+export const IssueAppliedFilters = observer(function IssueAppliedFilters(props: TIssueAppliedFilters) {
   const { anchor } = props;
   // router
   const router = useRouter();
diff --git a/apps/space/core/components/issues/filters/applied-filters/state.tsx b/apps/space/core/components/issues/filters/applied-filters/state.tsx
index 1836c86a7..65ca4f500 100644
--- a/apps/space/core/components/issues/filters/applied-filters/state.tsx
+++ b/apps/space/core/components/issues/filters/applied-filters/state.tsx
@@ -12,7 +12,7 @@ type Props = {
   values: string[];
 };
 
-export const AppliedStateFilters: React.FC<Props> = observer((props) => {
+export const AppliedStateFilters = observer(function AppliedStateFilters(props: Props) {
   const { handleRemove, values } = props;
 
   const { sortedStates: states } = useStates();
diff --git a/apps/space/core/components/issues/filters/helpers/dropdown.tsx b/apps/space/core/components/issues/filters/helpers/dropdown.tsx
index e9f025b2b..4853974ec 100644
--- a/apps/space/core/components/issues/filters/helpers/dropdown.tsx
+++ b/apps/space/core/components/issues/filters/helpers/dropdown.tsx
@@ -13,7 +13,7 @@ type Props = {
   placement?: Placement;
 };
 
-export const FiltersDropdown: React.FC<Props> = (props) => {
+export function FiltersDropdown(props: Props) {
   const { children, title = "Dropdown", placement } = props;
 
   const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);
@@ -62,4 +62,4 @@ export const FiltersDropdown: React.FC<Props> = (props) => {
       }}
     </Popover>
   );
-};
+}
diff --git a/apps/space/core/components/issues/filters/helpers/filter-header.tsx b/apps/space/core/components/issues/filters/helpers/filter-header.tsx
index 4505efbdb..568504b8e 100644
--- a/apps/space/core/components/issues/filters/helpers/filter-header.tsx
+++ b/apps/space/core/components/issues/filters/helpers/filter-header.tsx
@@ -9,15 +9,17 @@ interface IFilterHeader {
   handleIsPreviewEnabled: () => void;
 }
 
-export const FilterHeader = ({ title, isPreviewEnabled, handleIsPreviewEnabled }: IFilterHeader) => (
-  <div className="sticky top-0 flex items-center justify-between gap-2 bg-custom-background-100">
-    <div className="flex-grow truncate text-xs font-medium text-custom-text-300">{title}</div>
-    <button
-      type="button"
-      className="grid h-5 w-5 flex-shrink-0 place-items-center rounded hover:bg-custom-background-80"
-      onClick={handleIsPreviewEnabled}
-    >
-      {isPreviewEnabled ? <ChevronUpIcon height={14} width={14} /> : <ChevronDownIcon height={14} width={14} />}
-    </button>
-  </div>
-);
+export function FilterHeader({ title, isPreviewEnabled, handleIsPreviewEnabled }: IFilterHeader) {
+  return (
+    <div className="sticky top-0 flex items-center justify-between gap-2 bg-custom-background-100">
+      <div className="flex-grow truncate text-xs font-medium text-custom-text-300">{title}</div>
+      <button
+        type="button"
+        className="grid h-5 w-5 flex-shrink-0 place-items-center rounded hover:bg-custom-background-80"
+        onClick={handleIsPreviewEnabled}
+      >
+        {isPreviewEnabled ? <ChevronUpIcon height={14} width={14} /> : <ChevronDownIcon height={14} width={14} />}
+      </button>
+    </div>
+  );
+}
diff --git a/apps/space/core/components/issues/filters/helpers/filter-option.tsx b/apps/space/core/components/issues/filters/helpers/filter-option.tsx
index ba782b2c3..49a2c35c5 100644
--- a/apps/space/core/components/issues/filters/helpers/filter-option.tsx
+++ b/apps/space/core/components/issues/filters/helpers/filter-option.tsx
@@ -12,7 +12,7 @@ type Props = {
   multiple?: boolean;
 };
 
-export const FilterOption: React.FC<Props> = (props) => {
+export function FilterOption(props: Props) {
   const { icon, isChecked, multiple = true, onClick, title } = props;
 
   return (
@@ -34,4 +34,4 @@ export const FilterOption: React.FC<Props> = (props) => {
       </div>
     </button>
   );
-};
+}
diff --git a/apps/space/core/components/issues/filters/labels.tsx b/apps/space/core/components/issues/filters/labels.tsx
index a3effcf2b..fe089693c 100644
--- a/apps/space/core/components/issues/filters/labels.tsx
+++ b/apps/space/core/components/issues/filters/labels.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import React, { useState } from "react";
 // plane imports
 import { Loader } from "@plane/ui";
@@ -9,9 +8,9 @@ import type { IIssueLabel } from "@/types/issue";
 import { FilterHeader } from "./helpers/filter-header";
 import { FilterOption } from "./helpers/filter-option";
 
-const LabelIcons = ({ color }: { color: string }) => (
-  <span className="h-2.5 w-2.5 rounded-full" style={{ backgroundColor: color }} />
-);
+function LabelIcons({ color }: { color: string }) {
+  return <span className="h-2.5 w-2.5 rounded-full" style={{ backgroundColor: color }} />;
+}
 
 type Props = {
   appliedFilters: string[] | null;
@@ -20,7 +19,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterLabels: React.FC<Props> = (props) => {
+export function FilterLabels(props: Props) {
   const { appliedFilters, handleUpdate, labels, searchQuery } = props;
 
   const [itemsToRender, setItemsToRender] = useState(5);
@@ -82,4 +81,4 @@ export const FilterLabels: React.FC<Props> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/apps/space/core/components/issues/filters/priority.tsx b/apps/space/core/components/issues/filters/priority.tsx
index 674b052f5..be24a4626 100644
--- a/apps/space/core/components/issues/filters/priority.tsx
+++ b/apps/space/core/components/issues/filters/priority.tsx
@@ -16,7 +16,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterPriority: React.FC<Props> = observer((props) => {
+export const FilterPriority = observer(function FilterPriority(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
 
   // hooks
diff --git a/apps/space/core/components/issues/filters/root.tsx b/apps/space/core/components/issues/filters/root.tsx
index 6b21171c7..c3cd73ea9 100644
--- a/apps/space/core/components/issues/filters/root.tsx
+++ b/apps/space/core/components/issues/filters/root.tsx
@@ -20,7 +20,7 @@ type IssueFiltersDropdownProps = {
   anchor: string;
 };
 
-export const IssueFiltersDropdown: React.FC<IssueFiltersDropdownProps> = observer((props) => {
+export const IssueFiltersDropdown = observer(function IssueFiltersDropdown(props: IssueFiltersDropdownProps) {
   const { anchor } = props;
   // router
   const router = useRouter();
diff --git a/apps/space/core/components/issues/filters/selection.tsx b/apps/space/core/components/issues/filters/selection.tsx
index 221e9df8c..00a32d0f8 100644
--- a/apps/space/core/components/issues/filters/selection.tsx
+++ b/apps/space/core/components/issues/filters/selection.tsx
@@ -16,7 +16,7 @@ type Props = {
   layoutDisplayFiltersOptions: TIssueFilterKeys[];
 };
 
-export const FilterSelection: React.FC<Props> = observer((props) => {
+export const FilterSelection = observer(function FilterSelection(props: Props) {
   const { filters, handleFilters, layoutDisplayFiltersOptions } = props;
 
   const [filtersSearchQuery, setFiltersSearchQuery] = useState("");
diff --git a/apps/space/core/components/issues/filters/state.tsx b/apps/space/core/components/issues/filters/state.tsx
index a794d532a..68920ffff 100644
--- a/apps/space/core/components/issues/filters/state.tsx
+++ b/apps/space/core/components/issues/filters/state.tsx
@@ -18,7 +18,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterState: React.FC<Props> = observer((props) => {
+export const FilterState = observer(function FilterState(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
 
   const { sortedStates: states } = useStates();
diff --git a/apps/space/core/components/issues/issue-layouts/error.tsx b/apps/space/core/components/issues/issue-layouts/error.tsx
index a67ca8a6a..ec5e4761c 100644
--- a/apps/space/core/components/issues/issue-layouts/error.tsx
+++ b/apps/space/core/components/issues/issue-layouts/error.tsx
@@ -1,20 +1,22 @@
 // assets
 import SomethingWentWrongImage from "@/app/assets/something-went-wrong.svg?url";
 
-export const SomethingWentWrongError = () => (
-  <div className="grid min-h-screen w-full place-items-center p-6">
-    <div className="text-center">
-      <div className="mx-auto grid h-52 w-52 place-items-center rounded-full bg-custom-background-80">
-        <div className="grid h-32 w-32 place-items-center">
-          <img
-            src={SomethingWentWrongImage}
-            alt="Oops! Something went wrong"
-            className="w-full h-full object-contain"
-          />
+export function SomethingWentWrongError() {
+  return (
+    <div className="grid min-h-screen w-full place-items-center p-6">
+      <div className="text-center">
+        <div className="mx-auto grid h-52 w-52 place-items-center rounded-full bg-custom-background-80">
+          <div className="grid h-32 w-32 place-items-center">
+            <img
+              src={SomethingWentWrongImage}
+              alt="Oops! Something went wrong"
+              className="w-full h-full object-contain"
+            />
+          </div>
         </div>
+        <h1 className="mt-12 text-3xl font-semibold">Oops! Something went wrong.</h1>
+        <p className="mt-4 text-custom-text-300">The public board does not exist. Please check the URL.</p>
       </div>
-      <h1 className="mt-12 text-3xl font-semibold">Oops! Something went wrong.</h1>
-      <p className="mt-4 text-custom-text-300">The public board does not exist. Please check the URL.</p>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/space/core/components/issues/issue-layouts/issue-layout-HOC.tsx b/apps/space/core/components/issues/issue-layouts/issue-layout-HOC.tsx
index 473843343..8527732f9 100644
--- a/apps/space/core/components/issues/issue-layouts/issue-layout-HOC.tsx
+++ b/apps/space/core/components/issues/issue-layouts/issue-layout-HOC.tsx
@@ -14,7 +14,7 @@ interface Props {
   getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader;
 }
 
-export const IssueLayoutHOC = observer((props: Props) => {
+export const IssueLayoutHOC = observer(function IssueLayoutHOC(props: Props) {
   const { getIssueLoader, getGroupIssueCount } = props;
 
   const issueCount = getGroupIssueCount(undefined, undefined, false);
diff --git a/apps/space/core/components/issues/issue-layouts/kanban/base-kanban-root.tsx b/apps/space/core/components/issues/issue-layouts/kanban/base-kanban-root.tsx
index b65b93924..c939a2652 100644
--- a/apps/space/core/components/issues/issue-layouts/kanban/base-kanban-root.tsx
+++ b/apps/space/core/components/issues/issue-layouts/kanban/base-kanban-root.tsx
@@ -15,7 +15,7 @@ import { KanBan } from "./default";
 type Props = {
   anchor: string;
 };
-export const IssueKanbanLayoutRoot: React.FC<Props> = observer((props: Props) => {
+export const IssueKanbanLayoutRoot = observer(function IssueKanbanLayoutRoot(props: Props) {
   const { anchor } = props;
   // store hooks
   const { groupedIssueIds, getIssueLoader, fetchNextPublicIssues, getGroupIssueCount, getPaginationData } = useIssue();
diff --git a/apps/space/core/components/issues/issue-layouts/kanban/block-reactions.tsx b/apps/space/core/components/issues/issue-layouts/kanban/block-reactions.tsx
index 504b67dff..abc5ad534 100644
--- a/apps/space/core/components/issues/issue-layouts/kanban/block-reactions.tsx
+++ b/apps/space/core/components/issues/issue-layouts/kanban/block-reactions.tsx
@@ -11,7 +11,7 @@ import { usePublish } from "@/hooks/store/publish";
 type Props = {
   issueId: string;
 };
-export const BlockReactions = observer((props: Props) => {
+export const BlockReactions = observer(function BlockReactions(props: Props) {
   const { issueId } = props;
   const { anchor } = useParams();
   const { canVote, canReact } = usePublish(anchor.toString());
diff --git a/apps/space/core/components/issues/issue-layouts/kanban/block.tsx b/apps/space/core/components/issues/issue-layouts/kanban/block.tsx
index e98502b3f..944b8474c 100644
--- a/apps/space/core/components/issues/issue-layouts/kanban/block.tsx
+++ b/apps/space/core/components/issues/issue-layouts/kanban/block.tsx
@@ -36,7 +36,7 @@ interface IssueDetailsBlockProps {
   displayProperties: IIssueDisplayProperties | undefined;
 }
 
-const KanbanIssueDetailsBlock: React.FC<IssueDetailsBlockProps> = observer((props) => {
+const KanbanIssueDetailsBlock = observer(function KanbanIssueDetailsBlock(props: IssueDetailsBlockProps) {
   const { issue, displayProperties } = props;
   const { anchor } = useParams();
   // hooks
@@ -67,7 +67,7 @@ const KanbanIssueDetailsBlock: React.FC<IssueDetailsBlockProps> = observer((prop
   );
 });
 
-export const KanbanIssueBlock: React.FC<IssueBlockProps> = observer((props) => {
+export const KanbanIssueBlock = observer(function KanbanIssueBlock(props: IssueBlockProps) {
   const { issueId, groupId, subGroupId, displayProperties } = props;
   const searchParams = useSearchParams();
   // query params
diff --git a/apps/space/core/components/issues/issue-layouts/kanban/blocks-list.tsx b/apps/space/core/components/issues/issue-layouts/kanban/blocks-list.tsx
index c5cea19cc..b4aac0674 100644
--- a/apps/space/core/components/issues/issue-layouts/kanban/blocks-list.tsx
+++ b/apps/space/core/components/issues/issue-layouts/kanban/blocks-list.tsx
@@ -13,7 +13,7 @@ interface IssueBlocksListProps {
   scrollableContainerRef?: MutableRefObject<HTMLDivElement | null>;
 }
 
-export const KanbanIssueBlocksList: React.FC<IssueBlocksListProps> = observer((props) => {
+export const KanbanIssueBlocksList = observer(function KanbanIssueBlocksList(props: IssueBlocksListProps) {
   const { subGroupId, groupId, issueIds, displayProperties, scrollableContainerRef } = props;
 
   return (
diff --git a/apps/space/core/components/issues/issue-layouts/kanban/default.tsx b/apps/space/core/components/issues/issue-layouts/kanban/default.tsx
index e5e622e8a..c4d0c0ad2 100644
--- a/apps/space/core/components/issues/issue-layouts/kanban/default.tsx
+++ b/apps/space/core/components/issues/issue-layouts/kanban/default.tsx
@@ -42,7 +42,7 @@ export interface IKanBan {
   showEmptyGroup?: boolean;
 }
 
-export const KanBan: React.FC<IKanBan> = observer((props) => {
+export const KanBan = observer(function KanBan(props: IKanBan) {
   const {
     groupedIssueIds,
     displayProperties,
diff --git a/apps/space/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx b/apps/space/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
index a529afc77..803497b44 100644
--- a/apps/space/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
+++ b/apps/space/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
@@ -12,7 +12,7 @@ interface IHeaderGroupByCard {
   count: number;
 }
 
-export const HeaderGroupByCard: React.FC<IHeaderGroupByCard> = observer((props) => {
+export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHeaderGroupByCard) {
   const { icon, title, count } = props;
 
   return (
diff --git a/apps/space/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx b/apps/space/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx
index 6e5654c93..591a6f054 100644
--- a/apps/space/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx
+++ b/apps/space/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx
@@ -11,7 +11,7 @@ interface IHeaderSubGroupByCard {
   toggleExpanded: () => void;
 }
 
-export const HeaderSubGroupByCard: React.FC<IHeaderSubGroupByCard> = observer((props) => {
+export const HeaderSubGroupByCard = observer(function HeaderSubGroupByCard(props: IHeaderSubGroupByCard) {
   const { icon, title, count, isExpanded, toggleExpanded } = props;
   return (
     <div
diff --git a/apps/space/core/components/issues/issue-layouts/kanban/kanban-group.tsx b/apps/space/core/components/issues/issue-layouts/kanban/kanban-group.tsx
index 7fbcc5ae6..37a129b84 100644
--- a/apps/space/core/components/issues/issue-layouts/kanban/kanban-group.tsx
+++ b/apps/space/core/components/issues/issue-layouts/kanban/kanban-group.tsx
@@ -36,12 +36,15 @@ interface IKanbanGroup {
 }
 
 // Loader components
-const KanbanIssueBlockLoader = forwardRef<HTMLSpanElement>((props, ref) => (
-  <span ref={ref} className="block h-28 m-1.5 animate-pulse bg-custom-background-80 rounded" />
-));
+const KanbanIssueBlockLoader = forwardRef(function KanbanIssueBlockLoader(
+  props: Record<string, unknown>,
+  ref: React.ForwardedRef<HTMLSpanElement>
+) {
+  return <span ref={ref} className="block h-28 m-1.5 animate-pulse bg-custom-background-80 rounded" />;
+});
 KanbanIssueBlockLoader.displayName = "KanbanIssueBlockLoader";
 
-export const KanbanGroup = observer((props: IKanbanGroup) => {
+export const KanbanGroup = observer(function KanbanGroup(props: IKanbanGroup) {
   const {
     groupId,
     subGroupId,
diff --git a/apps/space/core/components/issues/issue-layouts/kanban/swimlanes.tsx b/apps/space/core/components/issues/issue-layouts/kanban/swimlanes.tsx
index 2799ee283..e3d53b40a 100644
--- a/apps/space/core/components/issues/issue-layouts/kanban/swimlanes.tsx
+++ b/apps/space/core/components/issues/issue-layouts/kanban/swimlanes.tsx
@@ -43,7 +43,7 @@ export interface IKanBanSwimLanes {
   orderBy: TIssueOrderByOptions | undefined;
 }
 
-export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
+export const KanBanSwimLanes = observer(function KanBanSwimLanes(props: IKanBanSwimLanes) {
   const {
     groupedIssueIds,
     displayProperties,
@@ -125,8 +125,14 @@ const visibilitySubGroupByGroupCount = (subGroupIssueCount: number, showEmptyGro
   return subGroupHeaderVisibility;
 };
 
-const SubGroupSwimlaneHeader: React.FC<ISubGroupSwimlaneHeader> = observer(
-  ({ subGroupBy, groupBy, groupList, showEmptyGroup, getGroupIssueCount }) => (
+const SubGroupSwimlaneHeader = observer(function SubGroupSwimlaneHeader({
+  subGroupBy,
+  groupBy,
+  groupList,
+  showEmptyGroup,
+  getGroupIssueCount,
+}: ISubGroupSwimlaneHeader) {
+  return (
     <div className="relative flex h-max min-h-full w-full items-center gap-2">
       {groupList &&
         groupList.length > 0 &&
@@ -143,8 +149,8 @@ const SubGroupSwimlaneHeader: React.FC<ISubGroupSwimlaneHeader> = observer(
           );
         })}
     </div>
-  )
-);
+  );
+});
 
 interface ISubGroupSwimlane extends ISubGroupSwimlaneHeader {
   groupedIssueIds: TGroupedIssues | TSubGroupedIssues;
@@ -162,7 +168,7 @@ interface ISubGroupSwimlane extends ISubGroupSwimlaneHeader {
   loadMoreIssues: (groupId?: string, subGroupId?: string) => void;
 }
 
-const SubGroupSwimlane: React.FC<ISubGroupSwimlane> = observer((props) => {
+const SubGroupSwimlane = observer(function SubGroupSwimlane(props: ISubGroupSwimlane) {
   const {
     groupedIssueIds,
     subGroupBy,
@@ -219,7 +225,7 @@ interface ISubGroup {
   loadMoreIssues: (groupId?: string, subGroupId?: string) => void;
 }
 
-const SubGroup: React.FC<ISubGroup> = observer((props) => {
+const SubGroup = observer(function SubGroup(props: ISubGroup) {
   const {
     groupedIssueIds,
     subGroupBy,
diff --git a/apps/space/core/components/issues/issue-layouts/list/base-list-root.tsx b/apps/space/core/components/issues/issue-layouts/list/base-list-root.tsx
index c3d498e31..f638d6f35 100644
--- a/apps/space/core/components/issues/issue-layouts/list/base-list-root.tsx
+++ b/apps/space/core/components/issues/issue-layouts/list/base-list-root.tsx
@@ -13,7 +13,7 @@ type Props = {
   anchor: string;
 };
 
-export const IssuesListLayoutRoot = observer((props: Props) => {
+export const IssuesListLayoutRoot = observer(function IssuesListLayoutRoot(props: Props) {
   const { anchor } = props;
   // store hooks
   const {
diff --git a/apps/space/core/components/issues/issue-layouts/list/block.tsx b/apps/space/core/components/issues/issue-layouts/list/block.tsx
index 522d46a9e..74b13cada 100644
--- a/apps/space/core/components/issues/issue-layouts/list/block.tsx
+++ b/apps/space/core/components/issues/issue-layouts/list/block.tsx
@@ -24,7 +24,7 @@ interface IssueBlockProps {
   displayProperties: IIssueDisplayProperties | undefined;
 }
 
-export const IssueBlock = observer((props: IssueBlockProps) => {
+export const IssueBlock = observer(function IssueBlock(props: IssueBlockProps) {
   const { anchor } = useParams();
   const { issueId, displayProperties } = props;
   const searchParams = useSearchParams();
diff --git a/apps/space/core/components/issues/issue-layouts/list/blocks-list.tsx b/apps/space/core/components/issues/issue-layouts/list/blocks-list.tsx
index 392d17a04..6a0b41dd6 100644
--- a/apps/space/core/components/issues/issue-layouts/list/blocks-list.tsx
+++ b/apps/space/core/components/issues/issue-layouts/list/blocks-list.tsx
@@ -10,7 +10,7 @@ interface Props {
   containerRef: MutableRefObject<HTMLDivElement | null>;
 }
 
-export const IssueBlocksList: React.FC<Props> = (props) => {
+export function IssueBlocksList(props: Props) {
   const { issueIds = [], groupId, displayProperties } = props;
 
   return (
@@ -22,4 +22,4 @@ export const IssueBlocksList: React.FC<Props> = (props) => {
         ))}
     </div>
   );
-};
+}
diff --git a/apps/space/core/components/issues/issue-layouts/list/default.tsx b/apps/space/core/components/issues/issue-layouts/list/default.tsx
index a10333a61..708809086 100644
--- a/apps/space/core/components/issues/issue-layouts/list/default.tsx
+++ b/apps/space/core/components/issues/issue-layouts/list/default.tsx
@@ -35,7 +35,7 @@ export interface IList {
   getIssueLoader: (groupId?: string | undefined, subGroupId?: string | undefined) => TLoader;
 }
 
-export const List: React.FC<IList> = observer((props) => {
+export const List = observer(function List(props: IList) {
   const {
     groupedIssueIds,
     groupBy,
diff --git a/apps/space/core/components/issues/issue-layouts/list/headers/group-by-card.tsx b/apps/space/core/components/issues/issue-layouts/list/headers/group-by-card.tsx
index e92e9daed..f463bdee3 100644
--- a/apps/space/core/components/issues/issue-layouts/list/headers/group-by-card.tsx
+++ b/apps/space/core/components/issues/issue-layouts/list/headers/group-by-card.tsx
@@ -11,7 +11,7 @@ interface IHeaderGroupByCard {
   toggleListGroup: (id: string) => void;
 }
 
-export const HeaderGroupByCard = observer((props: IHeaderGroupByCard) => {
+export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHeaderGroupByCard) {
   const { groupID, icon, title, count, toggleListGroup } = props;
 
   return (
diff --git a/apps/space/core/components/issues/issue-layouts/list/list-group.tsx b/apps/space/core/components/issues/issue-layouts/list/list-group.tsx
index f62cd0232..6c243a869 100644
--- a/apps/space/core/components/issues/issue-layouts/list/list-group.tsx
+++ b/apps/space/core/components/issues/issue-layouts/list/list-group.tsx
@@ -38,24 +38,29 @@ interface Props {
 }
 
 // List loader component
-const ListLoaderItemRow = forwardRef<HTMLDivElement>((props, ref) => (
-  <div ref={ref} className="flex items-center justify-between h-11 p-3 border-b border-custom-border-200">
-    <div className="flex items-center gap-3">
-      <span className="h-5 w-10 bg-custom-background-80 rounded animate-pulse" />
-      <span className={`h-5 w-52 bg-custom-background-80 rounded animate-pulse`} />
+const ListLoaderItemRow = forwardRef(function ListLoaderItemRow(
+  props: Record<string, unknown>,
+  ref: React.ForwardedRef<HTMLDivElement>
+) {
+  return (
+    <div ref={ref} className="flex items-center justify-between h-11 p-3 border-b border-custom-border-200">
+      <div className="flex items-center gap-3">
+        <span className="h-5 w-10 bg-custom-background-80 rounded animate-pulse" />
+        <span className={`h-5 w-52 bg-custom-background-80 rounded animate-pulse`} />
+      </div>
+      <div className="flex items-center gap-2">
+        {[...Array(6)].map((_, index) => (
+          <Fragment key={index}>
+            <span key={index} className="h-5 w-5 bg-custom-background-80 rounded animate-pulse" />
+          </Fragment>
+        ))}
+      </div>
     </div>
-    <div className="flex items-center gap-2">
-      {[...Array(6)].map((_, index) => (
-        <Fragment key={index}>
-          <span key={index} className="h-5 w-5 bg-custom-background-80 rounded animate-pulse" />
-        </Fragment>
-      ))}
-    </div>
-  </div>
-));
+  );
+});
 ListLoaderItemRow.displayName = "ListLoaderItemRow";
 
-export const ListGroup = observer((props: Props) => {
+export const ListGroup = observer(function ListGroup(props: Props) {
   const {
     groupIssueIds = [],
     group,
diff --git a/apps/space/core/components/issues/issue-layouts/properties/all-properties.tsx b/apps/space/core/components/issues/issue-layouts/properties/all-properties.tsx
index 1162331d0..45b65a31b 100644
--- a/apps/space/core/components/issues/issue-layouts/properties/all-properties.tsx
+++ b/apps/space/core/components/issues/issue-layouts/properties/all-properties.tsx
@@ -27,7 +27,7 @@ export interface IIssueProperties {
   className: string;
 }
 
-export const IssueProperties: React.FC<IIssueProperties> = observer((props) => {
+export const IssueProperties = observer(function IssueProperties(props: IIssueProperties) {
   const { issue, displayProperties, className } = props;
 
   if (!displayProperties || !issue.project_id) return null;
diff --git a/apps/space/core/components/issues/issue-layouts/properties/cycle.tsx b/apps/space/core/components/issues/issue-layouts/properties/cycle.tsx
index 0df14f1ed..a3a3fb503 100644
--- a/apps/space/core/components/issues/issue-layouts/properties/cycle.tsx
+++ b/apps/space/core/components/issues/issue-layouts/properties/cycle.tsx
@@ -14,7 +14,7 @@ type Props = {
   shouldShowBorder?: boolean;
 };
 
-export const IssueBlockCycle = observer(({ cycleId, shouldShowBorder = true }: Props) => {
+export const IssueBlockCycle = observer(function IssueBlockCycle({ cycleId, shouldShowBorder = true }: Props) {
   const { getCycleById } = useCycle();
 
   const cycle = getCycleById(cycleId);
diff --git a/apps/space/core/components/issues/issue-layouts/properties/due-date.tsx b/apps/space/core/components/issues/issue-layouts/properties/due-date.tsx
index 71afb2489..e68db6762 100644
--- a/apps/space/core/components/issues/issue-layouts/properties/due-date.tsx
+++ b/apps/space/core/components/issues/issue-layouts/properties/due-date.tsx
@@ -17,7 +17,7 @@ type Props = {
   shouldShowBorder?: boolean;
 };
 
-export const IssueBlockDate = observer((props: Props) => {
+export const IssueBlockDate = observer(function IssueBlockDate(props: Props) {
   const { due_date, stateId, shouldHighLight = true, shouldShowBorder = true } = props;
   const { getStateById } = useStates();
 
diff --git a/apps/space/core/components/issues/issue-layouts/properties/labels.tsx b/apps/space/core/components/issues/issue-layouts/properties/labels.tsx
index 9e4b80fff..44a7e7518 100644
--- a/apps/space/core/components/issues/issue-layouts/properties/labels.tsx
+++ b/apps/space/core/components/issues/issue-layouts/properties/labels.tsx
@@ -12,7 +12,7 @@ type Props = {
   shouldShowLabel?: boolean;
 };
 
-export const IssueBlockLabels = observer(({ labelIds, shouldShowLabel = false }: Props) => {
+export const IssueBlockLabels = observer(function IssueBlockLabels({ labelIds, shouldShowLabel = false }: Props) {
   const { getLabelsByIds } = useLabel();
 
   const labels = getLabelsByIds(labelIds);
diff --git a/apps/space/core/components/issues/issue-layouts/properties/member.tsx b/apps/space/core/components/issues/issue-layouts/properties/member.tsx
index 6b1bce1f9..52b7fabe3 100644
--- a/apps/space/core/components/issues/issue-layouts/properties/member.tsx
+++ b/apps/space/core/components/issues/issue-layouts/properties/member.tsx
@@ -24,7 +24,7 @@ type AvatarProps = {
   icon?: LucideIcon;
 };
 
-export const ButtonAvatars: React.FC<AvatarProps> = observer((props: AvatarProps) => {
+export const ButtonAvatars = observer(function ButtonAvatars(props: AvatarProps) {
   const { showTooltip, members, icon: Icon } = props;
 
   if (Array.isArray(members)) {
@@ -56,7 +56,7 @@ export const ButtonAvatars: React.FC<AvatarProps> = observer((props: AvatarProps
   );
 });
 
-export const IssueBlockMembers = observer(({ memberIds, shouldShowBorder = true }: Props) => {
+export const IssueBlockMembers = observer(function IssueBlockMembers({ memberIds, shouldShowBorder = true }: Props) {
   const { getMembersByIds } = useMember();
 
   const members = getMembersByIds(memberIds);
diff --git a/apps/space/core/components/issues/issue-layouts/properties/modules.tsx b/apps/space/core/components/issues/issue-layouts/properties/modules.tsx
index 29c7a4cee..da229bdb4 100644
--- a/apps/space/core/components/issues/issue-layouts/properties/modules.tsx
+++ b/apps/space/core/components/issues/issue-layouts/properties/modules.tsx
@@ -14,7 +14,7 @@ type Props = {
   shouldShowBorder?: boolean;
 };
 
-export const IssueBlockModules = observer(({ moduleIds, shouldShowBorder = true }: Props) => {
+export const IssueBlockModules = observer(function IssueBlockModules({ moduleIds, shouldShowBorder = true }: Props) {
   const { getModulesByIds } = useModule();
 
   const modules = getModulesByIds(moduleIds ?? []);
diff --git a/apps/space/core/components/issues/issue-layouts/properties/priority.tsx b/apps/space/core/components/issues/issue-layouts/properties/priority.tsx
index 720d9b468..b86da61a5 100644
--- a/apps/space/core/components/issues/issue-layouts/properties/priority.tsx
+++ b/apps/space/core/components/issues/issue-layouts/properties/priority.tsx
@@ -9,13 +9,13 @@ import type { TIssuePriorities } from "@plane/types";
 // constants
 import { cn, getIssuePriorityFilters } from "@plane/utils";
 
-export const IssueBlockPriority = ({
+export function IssueBlockPriority({
   priority,
   shouldShowName = false,
 }: {
   priority: TIssuePriorities | null;
   shouldShowName?: boolean;
-}) => {
+}) {
   // hooks
   const { t } = useTranslation();
   const priority_detail = priority != null ? getIssuePriorityFilters(priority) : null;
@@ -65,4 +65,4 @@ export const IssueBlockPriority = ({
       </div>
     </Tooltip>
   );
-};
+}
diff --git a/apps/space/core/components/issues/issue-layouts/properties/state.tsx b/apps/space/core/components/issues/issue-layouts/properties/state.tsx
index 2613adc4d..8e19ce544 100644
--- a/apps/space/core/components/issues/issue-layouts/properties/state.tsx
+++ b/apps/space/core/components/issues/issue-layouts/properties/state.tsx
@@ -13,7 +13,7 @@ type Props = {
   stateId: string | undefined;
   shouldShowBorder?: boolean;
 };
-export const IssueBlockState = observer(({ stateId, shouldShowBorder = true }: Props) => {
+export const IssueBlockState = observer(function IssueBlockState({ stateId, shouldShowBorder = true }: Props) {
   const { getStateById } = useStates();
 
   const state = getStateById(stateId);
diff --git a/apps/space/core/components/issues/issue-layouts/root.tsx b/apps/space/core/components/issues/issue-layouts/root.tsx
index bbe818669..85f3e06d8 100644
--- a/apps/space/core/components/issues/issue-layouts/root.tsx
+++ b/apps/space/core/components/issues/issue-layouts/root.tsx
@@ -22,7 +22,7 @@ type Props = {
   publishSettings: PublishStore;
 };
 
-export const IssuesLayoutsRoot: React.FC<Props> = observer((props) => {
+export const IssuesLayoutsRoot = observer(function IssuesLayoutsRoot(props: Props) {
   const { peekId, publishSettings } = props;
   // store hooks
   const { getIssueFilters } = useIssueFilter();
diff --git a/apps/space/core/components/issues/issue-layouts/with-display-properties-HOC.tsx b/apps/space/core/components/issues/issue-layouts/with-display-properties-HOC.tsx
index 6b63d2bd5..40593cde7 100644
--- a/apps/space/core/components/issues/issue-layouts/with-display-properties-HOC.tsx
+++ b/apps/space/core/components/issues/issue-layouts/with-display-properties-HOC.tsx
@@ -9,18 +9,21 @@ interface IWithDisplayPropertiesHOC {
   children: React.ReactNode;
 }
 
-export const WithDisplayPropertiesHOC = observer(
-  ({ displayProperties, shouldRenderProperty, displayPropertyKey, children }: IWithDisplayPropertiesHOC) => {
-    let shouldDisplayPropertyFromFilters = false;
-    if (Array.isArray(displayPropertyKey))
-      shouldDisplayPropertyFromFilters = displayPropertyKey.every((key) => !!displayProperties[key]);
-    else shouldDisplayPropertyFromFilters = !!displayProperties[displayPropertyKey];
+export const WithDisplayPropertiesHOC = observer(function WithDisplayPropertiesHOC({
+  displayProperties,
+  shouldRenderProperty,
+  displayPropertyKey,
+  children,
+}: IWithDisplayPropertiesHOC) {
+  let shouldDisplayPropertyFromFilters = false;
+  if (Array.isArray(displayPropertyKey))
+    shouldDisplayPropertyFromFilters = displayPropertyKey.every((key) => !!displayProperties[key]);
+  else shouldDisplayPropertyFromFilters = !!displayProperties[displayPropertyKey];
 
-    const renderProperty =
-      shouldDisplayPropertyFromFilters && (shouldRenderProperty ? shouldRenderProperty(displayProperties) : true);
+  const renderProperty =
+    shouldDisplayPropertyFromFilters && (shouldRenderProperty ? shouldRenderProperty(displayProperties) : true);
 
-    if (!renderProperty) return null;
+  if (!renderProperty) return null;
 
-    return <>{children}</>;
-  }
-);
+  return <>{children}</>;
+});
diff --git a/apps/space/core/components/issues/navbar/controls.tsx b/apps/space/core/components/issues/navbar/controls.tsx
index 7913f479b..6d9a3afde 100644
--- a/apps/space/core/components/issues/navbar/controls.tsx
+++ b/apps/space/core/components/issues/navbar/controls.tsx
@@ -24,7 +24,7 @@ export type NavbarControlsProps = {
   publishSettings: PublishStore;
 };
 
-export const NavbarControls: React.FC<NavbarControlsProps> = observer((props) => {
+export const NavbarControls = observer(function NavbarControls(props: NavbarControlsProps) {
   // props
   const { publishSettings } = props;
   // router
diff --git a/apps/space/core/components/issues/navbar/layout-icon.tsx b/apps/space/core/components/issues/navbar/layout-icon.tsx
index 2d5a5db5a..e5dc3d0a7 100644
--- a/apps/space/core/components/issues/navbar/layout-icon.tsx
+++ b/apps/space/core/components/issues/navbar/layout-icon.tsx
@@ -2,11 +2,11 @@ import type { TIssueLayout } from "@plane/constants";
 import { ListLayoutIcon, BoardLayoutIcon } from "@plane/propel/icons";
 import type { ISvgIcons } from "@plane/propel/icons";
 
-export const IssueLayoutIcon = ({
+export function IssueLayoutIcon({
   layout,
   size,
   ...props
-}: { layout: TIssueLayout; size?: number } & Omit<ISvgIcons, "width" | "height">) => {
+}: { layout: TIssueLayout; size?: number } & Omit<ISvgIcons, "width" | "height">) {
   const iconProps = {
     ...props,
     ...(size && { width: size, height: size }),
@@ -20,4 +20,4 @@ export const IssueLayoutIcon = ({
     default:
       return null;
   }
-};
+}
diff --git a/apps/space/core/components/issues/navbar/layout-selection.tsx b/apps/space/core/components/issues/navbar/layout-selection.tsx
index d6c196f54..23698c81e 100644
--- a/apps/space/core/components/issues/navbar/layout-selection.tsx
+++ b/apps/space/core/components/issues/navbar/layout-selection.tsx
@@ -19,7 +19,7 @@ type Props = {
   anchor: string;
 };
 
-export const IssuesLayoutSelection: React.FC<Props> = observer((props) => {
+export const IssuesLayoutSelection = observer(function IssuesLayoutSelection(props: Props) {
   const { anchor } = props;
   // hooks
   const { t } = useTranslation();
diff --git a/apps/space/core/components/issues/navbar/root.tsx b/apps/space/core/components/issues/navbar/root.tsx
index d6e6bf08c..b22ac8a1c 100644
--- a/apps/space/core/components/issues/navbar/root.tsx
+++ b/apps/space/core/components/issues/navbar/root.tsx
@@ -13,7 +13,7 @@ type Props = {
   publishSettings: PublishStore;
 };
 
-export const IssuesNavbarRoot: React.FC<Props> = observer((props) => {
+export const IssuesNavbarRoot = observer(function IssuesNavbarRoot(props: Props) {
   const { publishSettings } = props;
   // hooks
   const { project_details } = publishSettings;
diff --git a/apps/space/core/components/issues/navbar/theme.tsx b/apps/space/core/components/issues/navbar/theme.tsx
index 2078e9d12..8d6c7b10c 100644
--- a/apps/space/core/components/issues/navbar/theme.tsx
+++ b/apps/space/core/components/issues/navbar/theme.tsx
@@ -7,7 +7,7 @@ import { useTheme } from "next-themes";
 
 // mobx react lite
 
-export const NavbarTheme = observer(() => {
+export const NavbarTheme = observer(function NavbarTheme() {
   const [appTheme, setAppTheme] = useState("light");
 
   const { setTheme, theme } = useTheme();
diff --git a/apps/space/core/components/issues/navbar/user-avatar.tsx b/apps/space/core/components/issues/navbar/user-avatar.tsx
index 6b4d8cf0b..21d004ec1 100644
--- a/apps/space/core/components/issues/navbar/user-avatar.tsx
+++ b/apps/space/core/components/issues/navbar/user-avatar.tsx
@@ -20,7 +20,7 @@ import { useUser } from "@/hooks/store/use-user";
 
 const authService = new AuthService();
 
-export const UserAvatar: React.FC = observer(() => {
+export const UserAvatar = observer(function UserAvatar() {
   const pathName = usePathname();
   const searchParams = useSearchParams();
   // query params
diff --git a/apps/space/core/components/issues/peek-overview/comment/add-comment.tsx b/apps/space/core/components/issues/peek-overview/comment/add-comment.tsx
index 3a6e6f1d6..e2bea2543 100644
--- a/apps/space/core/components/issues/peek-overview/comment/add-comment.tsx
+++ b/apps/space/core/components/issues/peek-overview/comment/add-comment.tsx
@@ -26,7 +26,7 @@ type Props = {
   disabled?: boolean;
 };
 
-export const AddComment: React.FC<Props> = observer((props) => {
+export const AddComment = observer(function AddComment(props: Props) {
   const { anchor } = props;
   // states
   const [uploadedAssetIds, setUploadAssetIds] = useState<string[]>([]);
diff --git a/apps/space/core/components/issues/peek-overview/comment/comment-detail-card.tsx b/apps/space/core/components/issues/peek-overview/comment/comment-detail-card.tsx
index c33c1789b..91d8f6686 100644
--- a/apps/space/core/components/issues/peek-overview/comment/comment-detail-card.tsx
+++ b/apps/space/core/components/issues/peek-overview/comment/comment-detail-card.tsx
@@ -24,7 +24,7 @@ type Props = {
   comment: TIssuePublicComment;
 };
 
-export const CommentCard: React.FC<Props> = observer((props) => {
+export const CommentCard = observer(function CommentCard(props: Props) {
   const { anchor, comment } = props;
   // store hooks
   const { peekId, deleteIssueComment, updateIssueComment, uploadCommentAsset } = useIssueDetails();
@@ -157,7 +157,6 @@ export const CommentCard: React.FC<Props> = observer((props) => {
           </div>
         </div>
       </div>
-
       {!isInIframe && currentUser?.id === comment?.actor_detail?.id && (
         <Menu as="div" className="relative w-min text-left">
           <Menu.Button
diff --git a/apps/space/core/components/issues/peek-overview/comment/comment-reactions.tsx b/apps/space/core/components/issues/peek-overview/comment/comment-reactions.tsx
index 2636554ef..ff6a5eb64 100644
--- a/apps/space/core/components/issues/peek-overview/comment/comment-reactions.tsx
+++ b/apps/space/core/components/issues/peek-overview/comment/comment-reactions.tsx
@@ -20,7 +20,7 @@ type Props = {
   commentId: string;
 };
 
-export const CommentReactions: React.FC<Props> = observer((props) => {
+export const CommentReactions = observer(function CommentReactions(props: Props) {
   const { anchor, commentId } = props;
   // state
   const [isPickerOpen, setIsPickerOpen] = useState(false);
diff --git a/apps/space/core/components/issues/peek-overview/full-screen-peek-view.tsx b/apps/space/core/components/issues/peek-overview/full-screen-peek-view.tsx
index 2b40085af..f200429be 100644
--- a/apps/space/core/components/issues/peek-overview/full-screen-peek-view.tsx
+++ b/apps/space/core/components/issues/peek-overview/full-screen-peek-view.tsx
@@ -17,7 +17,7 @@ type Props = {
   issueDetails: IIssue | undefined;
 };
 
-export const FullScreenPeekView: React.FC<Props> = observer((props) => {
+export const FullScreenPeekView = observer(function FullScreenPeekView(props: Props) {
   const { anchor, handleClose, issueDetails } = props;
 
   return (
diff --git a/apps/space/core/components/issues/peek-overview/header.tsx b/apps/space/core/components/issues/peek-overview/header.tsx
index 0bf33066a..68a902cbb 100644
--- a/apps/space/core/components/issues/peek-overview/header.tsx
+++ b/apps/space/core/components/issues/peek-overview/header.tsx
@@ -38,7 +38,7 @@ const PEEK_MODES: {
   },
 ];
 
-export const PeekOverviewHeader: React.FC<Props> = observer((props) => {
+export const PeekOverviewHeader = observer(function PeekOverviewHeader(props: Props) {
   const { handleClose } = props;
 
   const { peekMode, setPeekMode } = useIssueDetails();
diff --git a/apps/space/core/components/issues/peek-overview/issue-activity.tsx b/apps/space/core/components/issues/peek-overview/issue-activity.tsx
index c31ca24f2..a02597c72 100644
--- a/apps/space/core/components/issues/peek-overview/issue-activity.tsx
+++ b/apps/space/core/components/issues/peek-overview/issue-activity.tsx
@@ -23,7 +23,7 @@ type Props = {
   issueDetails: IIssue;
 };
 
-export const PeekOverviewIssueActivity: React.FC<Props> = observer((props) => {
+export const PeekOverviewIssueActivity = observer(function PeekOverviewIssueActivity(props: Props) {
   const { anchor } = props;
   // router
   const pathname = usePathname();
diff --git a/apps/space/core/components/issues/peek-overview/issue-details.tsx b/apps/space/core/components/issues/peek-overview/issue-details.tsx
index 2ca097b23..2457766b3 100644
--- a/apps/space/core/components/issues/peek-overview/issue-details.tsx
+++ b/apps/space/core/components/issues/peek-overview/issue-details.tsx
@@ -12,7 +12,7 @@ type Props = {
   issueDetails: IIssue;
 };
 
-export const PeekOverviewIssueDetails: React.FC<Props> = observer((props) => {
+export const PeekOverviewIssueDetails = observer(function PeekOverviewIssueDetails(props: Props) {
   const { anchor, issueDetails } = props;
   // store hooks
   const { project_details, workspace: workspaceID } = usePublish(anchor);
diff --git a/apps/space/core/components/issues/peek-overview/issue-properties.tsx b/apps/space/core/components/issues/peek-overview/issue-properties.tsx
index 94507922a..622f4f374 100644
--- a/apps/space/core/components/issues/peek-overview/issue-properties.tsx
+++ b/apps/space/core/components/issues/peek-overview/issue-properties.tsx
@@ -24,7 +24,10 @@ type Props = {
   mode?: IPeekMode;
 };
 
-export const PeekOverviewIssueProperties: React.FC<Props> = observer(({ issueDetails, mode }) => {
+export const PeekOverviewIssueProperties = observer(function PeekOverviewIssueProperties({
+  issueDetails,
+  mode,
+}: Props) {
   // hooks
   const { t } = useTranslation();
   const { getStateById } = useStates();
diff --git a/apps/space/core/components/issues/peek-overview/issue-reaction.tsx b/apps/space/core/components/issues/peek-overview/issue-reaction.tsx
index 970f7ef5b..6e13a85bd 100644
--- a/apps/space/core/components/issues/peek-overview/issue-reaction.tsx
+++ b/apps/space/core/components/issues/peek-overview/issue-reaction.tsx
@@ -10,7 +10,7 @@ type Props = {
   anchor: string;
 };
 
-export const IssueReactions: React.FC<Props> = observer((props) => {
+export const IssueReactions = observer(function IssueReactions(props: Props) {
   const { anchor } = props;
   // store hooks
   const { canVote, canReact } = usePublish(anchor);
diff --git a/apps/space/core/components/issues/peek-overview/layout.tsx b/apps/space/core/components/issues/peek-overview/layout.tsx
index fe2a4655d..2d78dee09 100644
--- a/apps/space/core/components/issues/peek-overview/layout.tsx
+++ b/apps/space/core/components/issues/peek-overview/layout.tsx
@@ -16,7 +16,7 @@ type TIssuePeekOverview = {
   handlePeekClose?: () => void;
 };
 
-export const IssuePeekOverview: React.FC<TIssuePeekOverview> = observer((props) => {
+export const IssuePeekOverview = observer(function IssuePeekOverview(props: TIssuePeekOverview) {
   const { anchor, peekId, handlePeekClose } = props;
   const router = useRouter();
   const searchParams = useSearchParams();
diff --git a/apps/space/core/components/issues/peek-overview/side-peek-view.tsx b/apps/space/core/components/issues/peek-overview/side-peek-view.tsx
index 047989083..f6b770f3a 100644
--- a/apps/space/core/components/issues/peek-overview/side-peek-view.tsx
+++ b/apps/space/core/components/issues/peek-overview/side-peek-view.tsx
@@ -19,7 +19,7 @@ type Props = {
   issueDetails: IIssue | undefined;
 };
 
-export const SidePeekView: React.FC<Props> = observer((props) => {
+export const SidePeekView = observer(function SidePeekView(props: Props) {
   const { anchor, handleClose, issueDetails } = props;
   // store hooks
   const { canComment } = usePublish(anchor);
diff --git a/apps/space/core/components/issues/reactions/issue-emoji-reactions.tsx b/apps/space/core/components/issues/reactions/issue-emoji-reactions.tsx
index 0a3c193d9..59c1d82c5 100644
--- a/apps/space/core/components/issues/reactions/issue-emoji-reactions.tsx
+++ b/apps/space/core/components/issues/reactions/issue-emoji-reactions.tsx
@@ -19,7 +19,7 @@ type IssueEmojiReactionsProps = {
   issueIdFromProps?: string;
 };
 
-export const IssueEmojiReactions: React.FC<IssueEmojiReactionsProps> = observer((props) => {
+export const IssueEmojiReactions = observer(function IssueEmojiReactions(props: IssueEmojiReactionsProps) {
   const { anchor, issueIdFromProps } = props;
   // state
   const [isPickerOpen, setIsPickerOpen] = useState(false);
diff --git a/apps/space/core/components/issues/reactions/issue-vote-reactions.tsx b/apps/space/core/components/issues/reactions/issue-vote-reactions.tsx
index ce8642bb5..d8d3b6c70 100644
--- a/apps/space/core/components/issues/reactions/issue-vote-reactions.tsx
+++ b/apps/space/core/components/issues/reactions/issue-vote-reactions.tsx
@@ -19,7 +19,7 @@ type TIssueVotes = {
   size?: "md" | "sm";
 };
 
-export const IssueVotes: React.FC<TIssueVotes> = observer((props) => {
+export const IssueVotes = observer(function IssueVotes(props: TIssueVotes) {
   const { anchor, issueIdFromProps, size = "md" } = props;
   // states
   const [isSubmitting, setIsSubmitting] = useState(false);
diff --git a/apps/space/core/components/ui/icon.tsx b/apps/space/core/components/ui/icon.tsx
index 7ddc76843..39d10b2b1 100644
--- a/apps/space/core/components/ui/icon.tsx
+++ b/apps/space/core/components/ui/icon.tsx
@@ -5,6 +5,6 @@ type Props = {
   className?: string;
 };
 
-export const Icon: React.FC<Props> = ({ iconName, className = "" }) => (
-  <span className={`material-symbols-rounded text-sm font-light leading-5 ${className}`}>{iconName}</span>
-);
+export function Icon({ iconName, className = "" }: Props) {
+  return <span className={`material-symbols-rounded text-sm font-light leading-5 ${className}`}>{iconName}</span>;
+}
diff --git a/apps/space/core/components/ui/not-found.tsx b/apps/space/core/components/ui/not-found.tsx
index 5b78024a4..61e37448c 100644
--- a/apps/space/core/components/ui/not-found.tsx
+++ b/apps/space/core/components/ui/not-found.tsx
@@ -3,21 +3,23 @@
 // images
 import Image404 from "@/app/assets/404.svg?url";
 
-export const PageNotFound = () => (
-  <div className={`h-screen w-full overflow-hidden bg-custom-background-100`}>
-    <div className="grid h-full place-items-center p-4">
-      <div className="space-y-8 text-center">
-        <div className="relative mx-auto h-60 w-60 lg:h-80 lg:w-80">
-          <img src={Image404} alt="404- Page not found" className="w-full h-full object-contain" />
-        </div>
-        <div className="space-y-2">
-          <h3 className="text-lg font-semibold">Oops! Something went wrong.</h3>
-          <p className="text-sm text-custom-text-200">
-            Sorry, the page you are looking for cannot be found. It may have been removed, had its name changed, or is
-            temporarily unavailable.
-          </p>
+export function PageNotFound() {
+  return (
+    <div className={`h-screen w-full overflow-hidden bg-custom-background-100`}>
+      <div className="grid h-full place-items-center p-4">
+        <div className="space-y-8 text-center">
+          <div className="relative mx-auto h-60 w-60 lg:h-80 lg:w-80">
+            <img src={Image404} alt="404- Page not found" className="w-full h-full object-contain" />
+          </div>
+          <div className="space-y-2">
+            <h3 className="text-lg font-semibold">Oops! Something went wrong.</h3>
+            <p className="text-sm text-custom-text-200">
+              Sorry, the page you are looking for cannot be found. It may have been removed, had its name changed, or is
+              temporarily unavailable.
+            </p>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/space/core/components/views/auth.tsx b/apps/space/core/components/views/auth.tsx
index 756c047d3..74297b6e4 100644
--- a/apps/space/core/components/views/auth.tsx
+++ b/apps/space/core/components/views/auth.tsx
@@ -6,10 +6,12 @@ import { PoweredBy } from "@/components/common/powered-by";
 // local imports
 import { AuthHeader } from "./header";
 
-export const AuthView = () => (
-  <div className="relative z-10 flex flex-col items-center w-screen h-screen overflow-hidden overflow-y-auto pt-6 pb-10 px-8">
-    <AuthHeader />
-    <AuthRoot />
-    <PoweredBy />
-  </div>
-);
+export function AuthView() {
+  return (
+    <div className="relative z-10 flex flex-col items-center w-screen h-screen overflow-hidden overflow-y-auto pt-6 pb-10 px-8">
+      <AuthHeader />
+      <AuthRoot />
+      <PoweredBy />
+    </div>
+  );
+}
diff --git a/apps/space/core/components/views/header.tsx b/apps/space/core/components/views/header.tsx
index 80ba76de9..e64fdd789 100644
--- a/apps/space/core/components/views/header.tsx
+++ b/apps/space/core/components/views/header.tsx
@@ -4,10 +4,12 @@ import React from "react";
 import Link from "next/link";
 import { PlaneLockup } from "@plane/propel/icons";
 
-export const AuthHeader = () => (
-  <div className="flex items-center justify-between gap-6 w-full flex-shrink-0 sticky top-0">
-    <Link href="/">
-      <PlaneLockup height={20} width={95} className="text-custom-text-100" />
-    </Link>
-  </div>
-);
+export function AuthHeader() {
+  return (
+    <div className="flex items-center justify-between gap-6 w-full flex-shrink-0 sticky top-0">
+      <Link href="/">
+        <PlaneLockup height={20} width={95} className="text-custom-text-100" />
+      </Link>
+    </div>
+  );
+}
diff --git a/apps/space/core/lib/instance-provider.tsx b/apps/space/core/lib/instance-provider.tsx
index fa56fccc6..04e908980 100644
--- a/apps/space/core/lib/instance-provider.tsx
+++ b/apps/space/core/lib/instance-provider.tsx
@@ -17,7 +17,7 @@ import { InstanceFailureView } from "@/components/instance/instance-failure-view
 import { useInstance } from "@/hooks/store/use-instance";
 import { useUser } from "@/hooks/store/use-user";
 
-export const InstanceProvider = observer(({ children }: { children: React.ReactNode }) => {
+export const InstanceProvider = observer(function InstanceProvider({ children }: { children: React.ReactNode }) {
   const { fetchInstanceInfo, instance, error } = useInstance();
   const { fetchCurrentUser } = useUser();
   const { resolvedTheme } = useTheme();
diff --git a/apps/space/core/lib/store-provider.tsx b/apps/space/core/lib/store-provider.tsx
index cefb45c71..1194c306f 100644
--- a/apps/space/core/lib/store-provider.tsx
+++ b/apps/space/core/lib/store-provider.tsx
@@ -23,7 +23,7 @@ export type StoreProviderProps = {
   initialState?: any;
 };
 
-export const StoreProvider = ({ children, initialState = undefined }: StoreProviderProps) => {
+export function StoreProvider({ children, initialState = undefined }: StoreProviderProps) {
   const store = initializeStore();
   // If your page has Next.js data fetching methods that use a Mobx store, it will
   // get hydrated here, check `pages/ssg.js` and `pages/ssr.js` for more details
@@ -32,4 +32,4 @@ export const StoreProvider = ({ children, initialState = undefined }: StoreProvi
   }
 
   return <StoreContext.Provider value={store}>{children}</StoreContext.Provider>;
-};
+}
diff --git a/apps/space/core/lib/toast-provider.tsx b/apps/space/core/lib/toast-provider.tsx
index 22c2d7ecc..5ad32376f 100644
--- a/apps/space/core/lib/toast-provider.tsx
+++ b/apps/space/core/lib/toast-provider.tsx
@@ -5,7 +5,7 @@ import { useTheme } from "next-themes";
 import { Toast } from "@plane/propel/toast";
 import { resolveGeneralTheme } from "@plane/utils";
 
-export const ToastProvider = ({ children }: { children: React.ReactNode }) => {
+export function ToastProvider({ children }: { children: React.ReactNode }) {
   // themes
   const { resolvedTheme } = useTheme();
 
@@ -15,4 +15,4 @@ export const ToastProvider = ({ children }: { children: React.ReactNode }) => {
       {children}
     </>
   );
-};
+}
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/_sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/_sidebar.tsx
index d81d2c148..24dc90d68 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/_sidebar.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/_sidebar.tsx
@@ -14,7 +14,7 @@ import { useAppRail } from "@/hooks/use-app-rail";
 import { ExtendedAppSidebar } from "./extended-sidebar";
 import { AppSidebar } from "./sidebar";
 
-export const ProjectAppSidebar: FC = observer(() => {
+export const ProjectAppSidebar = observer(function ProjectAppSidebar() {
   // store hooks
   const {
     sidebarCollapsed,
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx
index 8408a9706..f09f8dc44 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx
@@ -9,7 +9,7 @@ import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 // plane web components
 import { UpgradeBadge } from "@/plane-web/components/workspace/upgrade-badge";
 
-export const WorkspaceActiveCycleHeader = observer(() => {
+export const WorkspaceActiveCycleHeader = observer(function WorkspaceActiveCycleHeader() {
   const { t } = useTranslation();
   return (
     <Header>
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx
index 8171d55a8..b4f87e5b8 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx
@@ -8,7 +8,7 @@ import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 
-export const WorkspaceAnalyticsHeader = observer(() => {
+export const WorkspaceAnalyticsHeader = observer(function WorkspaceAnalyticsHeader() {
   const { t } = useTranslation();
   return (
     <Header>
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/page.tsx
index a805da783..409b2eb12 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/page.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/page.tsx
@@ -46,7 +46,9 @@ function AnalyticsPage({ params }: Route.ComponentProps) {
   const pageTitle = currentWorkspace?.name
     ? t(`workspace_analytics.page_label`, { workspace: currentWorkspace?.name })
     : undefined;
-  const ANALYTICS_TABS = useMemo(() => getAnalyticsTabs(t), [t]);
+  const ANALYTICS_TABS = useMemo(function ANALYTICS_TABS() {
+    return getAnalyticsTabs(t);
+  });
   const tabs: TabItem[] = useMemo(
     () =>
       ANALYTICS_TABS.map((tab) => ({
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/header.tsx
index 7b854c58d..093130336 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/header.tsx
@@ -14,7 +14,7 @@ import { useProject } from "@/hooks/store/use-project";
 import { useAppRouter } from "@/hooks/use-app-router";
 import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common";
 
-export const ProjectIssueDetailsHeader = observer(() => {
+export const ProjectIssueDetailsHeader = observer(function ProjectIssueDetailsHeader() {
   // router
   const router = useAppRouter();
   const { workspaceSlug, workItem } = useParams();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx
index 9e8472822..6ab2ffd4e 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx
@@ -19,7 +19,7 @@ import { useProject } from "@/hooks/store/use-project";
 import { useUserPermissions } from "@/hooks/store/user";
 import { useWorkspaceDraftIssues } from "@/hooks/store/workspace-draft";
 
-export const WorkspaceDraftHeader = observer(() => {
+export const WorkspaceDraftHeader = observer(function WorkspaceDraftHeader() {
   // state
   const [isDraftIssueModalOpen, setIsDraftIssueModalOpen] = useState(false);
   // store hooks
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-project-sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-project-sidebar.tsx
index b193dbe24..e5040865f 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-project-sidebar.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-project-sidebar.tsx
@@ -20,7 +20,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import type { TProject } from "@/plane-web/types";
 import { ExtendedSidebarWrapper } from "./extended-sidebar-wrapper";
 
-export const ExtendedProjectSidebar = observer(() => {
+export const ExtendedProjectSidebar = observer(function ExtendedProjectSidebar() {
   // refs
   const extendedProjectSidebarRef = useRef<HTMLDivElement | null>(null);
   const [searchQuery, setSearchQuery] = useState<string>("");
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-sidebar-wrapper.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-sidebar-wrapper.tsx
index 878f9ee3f..264bfdde3 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-sidebar-wrapper.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-sidebar-wrapper.tsx
@@ -18,7 +18,7 @@ type Props = {
   excludedElementId: string;
 };
 
-export const ExtendedSidebarWrapper: FC<Props> = observer((props) => {
+export const ExtendedSidebarWrapper = observer(function ExtendedSidebarWrapper(props: Props) {
   const { children, extendedSidebarRef, isExtendedSidebarOpened, handleClose, excludedElementId } = props;
   // store hooks
   const { storedValue } = useLocalStorage("sidebarWidth", SIDEBAR_WIDTH);
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-sidebar.tsx
index 108de05f0..8abdd8177 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-sidebar.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-sidebar.tsx
@@ -13,7 +13,7 @@ import { useWorkspace } from "@/hooks/store/use-workspace";
 import { ExtendedSidebarItem } from "@/plane-web/components/workspace/sidebar/extended-sidebar-item";
 import { ExtendedSidebarWrapper } from "./extended-sidebar-wrapper";
 
-export const ExtendedAppSidebar = observer(() => {
+export const ExtendedAppSidebar = observer(function ExtendedAppSidebar() {
   // refs
   const extendedSidebarRef = useRef<HTMLDivElement | null>(null);
   // routers
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx
index 18629c172..a5890b018 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx
@@ -14,7 +14,7 @@ import { useHome } from "@/hooks/store/use-home";
 // local imports
 import { StarUsOnGitHubLink } from "./star-us-link";
 
-export const WorkspaceDashboardHeader = observer(() => {
+export const WorkspaceDashboardHeader = observer(function WorkspaceDashboardHeader() {
   // plane hooks
   const { t } = useTranslation();
   // hooks
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx
index cee770d80..b412ae7b5 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx
@@ -24,7 +24,7 @@ type TUserProfileHeader = {
   showProfileIssuesFilter?: boolean;
 };
 
-export const UserProfileHeader: FC<TUserProfileHeader> = observer((props) => {
+export const UserProfileHeader = observer(function UserProfileHeader(props: TUserProfileHeader) {
   const { userProjectsData, type = undefined, showProfileIssuesFilter } = props;
   // router
   const { workspaceSlug, userId } = useParams();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx
index c6d4e3410..64d3b636e 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx
@@ -25,7 +25,7 @@ import { IssueLayoutIcon } from "@/components/issues/issue-layouts/layout-icon";
 // hooks
 import { useIssues } from "@/hooks/store/use-issues";
 
-export const ProfileIssuesMobileHeader = observer(() => {
+export const ProfileIssuesMobileHeader = observer(function ProfileIssuesMobileHeader() {
   // plane i18n
   const { t } = useTranslation();
   // router
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/navbar.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/navbar.tsx
index a91836518..3e135687e 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/navbar.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/navbar.tsx
@@ -13,7 +13,7 @@ type Props = {
   isAuthorized: boolean;
 };
 
-export const ProfileNavbar: React.FC<Props> = (props) => {
+export function ProfileNavbar(props: Props) {
   const { isAuthorized } = props;
   const { t } = useTranslation();
   const { workspaceSlug, userId } = useParams();
@@ -40,4 +40,4 @@ export const ProfileNavbar: React.FC<Props> = (props) => {
       </div>
     </Header>
   );
-};
+}
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx
index fcb28bd3a..0941e688a 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx
@@ -46,7 +46,7 @@ const PROJECT_ARCHIVES_BREADCRUMB_LIST: {
   },
 };
 
-export const ProjectArchivesHeader: FC<TProps> = observer((props: TProps) => {
+export const ProjectArchivesHeader = observer(function ProjectArchivesHeader(props: TProps) {
   const { activeTab } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/header.tsx
index 3cfbdb816..32e326798 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/header.tsx
@@ -20,7 +20,7 @@ import { IssueService } from "@/services/issue";
 
 const issueService = new IssueService();
 
-export const ProjectArchivedIssueDetailsHeader = observer(() => {
+export const ProjectArchivedIssueDetailsHeader = observer(function ProjectArchivedIssueDetailsHeader() {
   // router
   const { workspaceSlug, projectId, archivedIssueId } = useParams();
   // store hooks
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx
index 885d6bc68..28203c37a 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx
@@ -45,7 +45,7 @@ import useLocalStorage from "@/hooks/use-local-storage";
 // plane web imports
 import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common";
 
-export const CycleIssuesHeader: React.FC = observer(() => {
+export const CycleIssuesHeader = observer(function CycleIssuesHeader() {
   // refs
   const parentRef = useRef<HTMLDivElement>(null);
   // states
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx
index 75c0a9114..30005abb8 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx
@@ -25,7 +25,7 @@ const SUPPORTED_LAYOUTS = [
   { key: "calendar", titleTranslationKey: "issue.layouts.calendar", icon: CalendarLayoutIcon },
 ];
 
-export const CycleIssuesMobileHeader = observer(() => {
+export const CycleIssuesMobileHeader = observer(function CycleIssuesMobileHeader() {
   // router
   const { workspaceSlug, projectId, cycleId } = useParams();
   // states
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx
index c2ac8e455..630a69e60 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx
@@ -19,7 +19,7 @@ import { useAppRouter } from "@/hooks/use-app-router";
 import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common";
 // constants
 
-export const CyclesListHeader: FC = observer(() => {
+export const CyclesListHeader = observer(function CyclesListHeader() {
   // router
   const router = useAppRouter();
   const { workspaceSlug } = useParams();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/mobile-header.tsx
index 4c8e4e9c4..ce4b02528 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/mobile-header.tsx
@@ -34,7 +34,7 @@ const CYCLE_VIEW_LAYOUTS: {
   },
 ];
 
-export const CyclesListMobileHeader = observer(() => {
+export const CyclesListMobileHeader = observer(function CyclesListMobileHeader() {
   const { currentProjectDetails } = useProject();
   // hooks
   const { updateDisplayFilters } = useCycleFilter();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/header.tsx
index 8a2e9a71a..f44441001 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/header.tsx
@@ -1,3 +1,5 @@
 import { IssuesHeader } from "@/plane-web/components/issues/header";
 
-export const ProjectIssuesHeader = () => <IssuesHeader />;
+export function ProjectIssuesHeader() {
+  return <IssuesHeader />;
+}
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx
index c714cfaf1..432346f9c 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx
@@ -20,7 +20,7 @@ import {
 import { useIssues } from "@/hooks/store/use-issues";
 import { useProject } from "@/hooks/store/use-project";
 
-export const ProjectIssuesMobileHeader = observer(() => {
+export const ProjectIssuesMobileHeader = observer(function ProjectIssuesMobileHeader() {
   // i18n
   const { t } = useTranslation();
   const [analyticsModal, setAnalyticsModal] = useState(false);
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx
index 2dec9fa96..f91609cdc 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx
@@ -45,7 +45,7 @@ import { usePlatformOS } from "@/hooks/use-platform-os";
 // plane web
 import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common";
 
-export const ModuleIssuesHeader: React.FC = observer(() => {
+export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() {
   // refs
   const parentRef = useRef<HTMLDivElement>(null);
   // states
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx
index 6be0088d6..3ee8f1755 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx
@@ -25,7 +25,7 @@ const SUPPORTED_LAYOUTS = [
   { key: "calendar", i18n_title: "issue.layouts.calendar", icon: CalendarLayoutIcon },
 ];
 
-export const ModuleIssuesMobileHeader = observer(() => {
+export const ModuleIssuesMobileHeader = observer(function ModuleIssuesMobileHeader() {
   // router
   const { workspaceSlug, projectId, moduleId } = useParams() as {
     workspaceSlug: string;
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx
index fbb40e3b4..7d72a15e7 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx
@@ -19,7 +19,7 @@ import { useAppRouter } from "@/hooks/use-app-router";
 import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common";
 // constants
 
-export const ModulesListHeader: React.FC = observer(() => {
+export const ModulesListHeader = observer(function ModulesListHeader() {
   // router
   const router = useAppRouter();
   const { workspaceSlug, projectId } = useParams() as { workspaceSlug: string; projectId: string };
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/mobile-header.tsx
index 94b190457..774dcb639 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/mobile-header.tsx
@@ -9,7 +9,7 @@ import { ModuleLayoutIcon } from "@/components/modules";
 import { useModuleFilter } from "@/hooks/store/use-module-filter";
 import { useProject } from "@/hooks/store/use-project";
 
-export const ModulesListMobileHeader = observer(() => {
+export const ModulesListMobileHeader = observer(function ModulesListMobileHeader() {
   const { currentProjectDetails } = useProject();
   const { updateDisplayFilters } = useModuleFilter();
   const { t } = useTranslation();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
index ad6b9c128..e93dc850c 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
@@ -28,7 +28,7 @@ export interface IPagesHeaderProps {
 
 const storeType = EPageStoreType.PROJECT;
 
-export const PageDetailsHeader = observer(() => {
+export const PageDetailsHeader = observer(function PageDetailsHeader() {
   // router
   const router = useAppRouter();
   const { workspaceSlug, pageId, projectId } = useParams();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx
index 4aa12716b..853e92568 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx
@@ -25,7 +25,7 @@ import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/com
 // plane web hooks
 import { EPageStoreType, usePageStore } from "@/plane-web/hooks/store";
 
-export const PagesListHeader = observer(() => {
+export const PagesListHeader = observer(function PagesListHeader() {
   // states
   const [isCreatingPage, setIsCreatingPage] = useState(false);
   // router
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(detail)/[viewId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(detail)/[viewId]/header.tsx
index 33a84241a..de9d4ec80 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(detail)/[viewId]/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(detail)/[viewId]/header.tsx
@@ -37,7 +37,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { useAppRouter } from "@/hooks/use-app-router";
 import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common";
 
-export const ProjectViewIssuesHeader: React.FC = observer(() => {
+export const ProjectViewIssuesHeader = observer(function ProjectViewIssuesHeader() {
   // refs
   const parentRef = useRef(null);
   // router
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx
index 1ac783ebd..02a4bdfc8 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx
@@ -14,7 +14,7 @@ import { useProject } from "@/hooks/store/use-project";
 // plane web
 import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common";
 
-export const ProjectViewsHeader = observer(() => {
+export const ProjectViewsHeader = observer(function ProjectViewsHeader() {
   const { workspaceSlug, projectId } = useParams() as { workspaceSlug: string; projectId: string };
   // store hooks
   const { toggleCreateViewModal } = useCommandPalette();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/mobile-header.tsx
index 3980e977f..f9a14a74e 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/mobile-header.tsx
@@ -13,7 +13,7 @@ import { ViewOrderByDropdown } from "@/components/views/filters/order-by";
 import { useMember } from "@/hooks/store/use-member";
 import { useProjectView } from "@/hooks/store/use-project-view";
 
-export const ViewMobileHeader = observer(() => {
+export const ViewMobileHeader = observer(function ViewMobileHeader() {
   // store hooks
   const { filters, updateFilters } = useProjectView();
   const {
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/archives/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/archives/page.tsx
index ac6e5c3cd..bbd6d42b1 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/archives/page.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/archives/page.tsx
@@ -1,4 +1,7 @@
 import { ProjectPageRoot } from "@/plane-web/components/projects/page";
 
-const ProjectsPage = () => <ProjectPageRoot />;
+function ProjectsPage() {
+  return <ProjectPageRoot />;
+}
+
 export default ProjectsPage;
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(list)/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(list)/page.tsx
index ac6e5c3cd..bbd6d42b1 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(list)/page.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(list)/page.tsx
@@ -1,4 +1,7 @@
 import { ProjectPageRoot } from "@/plane-web/components/projects/page";
 
-const ProjectsPage = () => <ProjectPageRoot />;
+function ProjectsPage() {
+  return <ProjectPageRoot />;
+}
+
 export default ProjectsPage;
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/sidebar.tsx
index a30707e21..f076ea2d3 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/sidebar.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/sidebar.tsx
@@ -15,7 +15,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 // plane web components
 import { SidebarTeamsList } from "@/plane-web/components/workspace/sidebar/teams-sidebar-list";
 
-export const AppSidebar: FC = observer(() => {
+export const AppSidebar = observer(function AppSidebar() {
   // store hooks
   const { allowPermissions } = useUserPermissions();
   const { groupedFavorites } = useFavorite();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/star-us-link.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/star-us-link.tsx
index 4644e7818..183594c9e 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/star-us-link.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/star-us-link.tsx
@@ -10,7 +10,7 @@ import githubWhiteImage from "@/app/assets/logos/github-white.png?url";
 // helpers
 import { captureElementAndEvent } from "@/helpers/event-tracker.helper";
 
-export const StarUsOnGitHubLink = () => {
+export function StarUsOnGitHubLink() {
   // plane hooks
   const { t } = useTranslation();
   // hooks
@@ -40,4 +40,4 @@ export const StarUsOnGitHubLink = () => {
       <span className="hidden text-xs font-medium sm:hidden md:block">{t("home.star_us_on_github")}</span>
     </a>
   );
-};
+}
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/stickies/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/stickies/header.tsx
index 49b76da57..757507a03 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/stickies/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/stickies/header.tsx
@@ -13,7 +13,7 @@ import { useStickyOperations } from "@/components/stickies/sticky/use-operations
 // hooks
 import { useSticky } from "@/hooks/use-stickies";
 
-export const WorkspaceStickyHeader = observer(() => {
+export const WorkspaceStickyHeader = observer(function WorkspaceStickyHeader() {
   const { workspaceSlug } = useParams();
   // hooks
   const { creatingSticky, toggleShowNewSticky } = useSticky();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/header.tsx
index 07f75a309..08f563379 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/header.tsx
@@ -30,7 +30,7 @@ import { useIssues } from "@/hooks/store/use-issues";
 import { useAppRouter } from "@/hooks/use-app-router";
 import { GlobalViewLayoutSelection } from "@/plane-web/components/views/helper";
 
-export const GlobalIssuesHeader = observer(() => {
+export const GlobalIssuesHeader = observer(function GlobalIssuesHeader() {
   // states
   const [createViewModal, setCreateViewModal] = useState(false);
   // router
diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/mobile-header-tabs.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/mobile-header-tabs.tsx
index 9e7c24982..93c01bf2f 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/mobile-header-tabs.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/mobile-header-tabs.tsx
@@ -8,7 +8,7 @@ import { useAppRouter } from "@/hooks/use-app-router";
 // plane web helpers
 import { shouldRenderSettingLink } from "@/plane-web/helpers/workspace.helper";
 
-export const MobileWorkspaceSettingsTabs = observer(() => {
+export const MobileWorkspaceSettingsTabs = observer(function MobileWorkspaceSettingsTabs() {
   const router = useAppRouter();
   const { workspaceSlug } = useParams();
   const pathname = usePathname();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/sidebar.tsx
index 3e9a6397c..d4f6aed1a 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/sidebar.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/sidebar.tsx
@@ -27,26 +27,18 @@ export const WORKSPACE_SETTINGS_ICONS: Record<keyof typeof WORKSPACE_SETTINGS, L
   webhooks: Webhook,
 };
 
-export const WorkspaceActionIcons = ({
-  type,
-  size,
-  className,
-}: {
-  type: string;
-  size?: number;
-  className?: string;
-}) => {
+export function WorkspaceActionIcons({ type, size, className }: { type: string; size?: number; className?: string }) {
   if (type === undefined) return null;
   const Icon = WORKSPACE_SETTINGS_ICONS[type as keyof typeof WORKSPACE_SETTINGS_ICONS];
   if (!Icon) return null;
   return <Icon size={size} className={className} strokeWidth={2} />;
-};
+}
 
 type TWorkspaceSettingsSidebarProps = {
   isMobile?: boolean;
 };
 
-export const WorkspaceSettingsSidebar = (props: TWorkspaceSettingsSidebarProps) => {
+export function WorkspaceSettingsSidebar(props: TWorkspaceSettingsSidebarProps) {
   const { isMobile = false } = props;
   // router
   const pathname = usePathname();
@@ -77,4 +69,4 @@ export const WorkspaceSettingsSidebar = (props: TWorkspaceSettingsSidebarProps)
       actionIcons={WorkspaceActionIcons}
     />
   );
-};
+}
diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/sidebar.tsx
index 0dd30509c..64234dc11 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/sidebar.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/sidebar.tsx
@@ -19,18 +19,18 @@ const ICONS = {
   connections: Blocks,
 };
 
-export const ProjectActionIcons = ({ type, size, className }: { type: string; size?: number; className?: string }) => {
+export function ProjectActionIcons({ type, size, className }: { type: string; size?: number; className?: string }) {
   if (type === undefined) return null;
   const Icon = ICONS[type as keyof typeof ICONS];
   if (!Icon) return null;
   return <Icon size={size} className={className} strokeWidth={2} />;
-};
+}
 
 type TProfileSidebarProps = {
   isMobile?: boolean;
 };
 
-export const ProfileSidebar = observer((props: TProfileSidebarProps) => {
+export const ProfileSidebar = observer(function ProfileSidebar(props: TProfileSidebarProps) {
   const { isMobile = false } = props;
   // router
   const pathname = usePathname();
diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/page.tsx
index a497d9ad4..14b72758e 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/page.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/page.tsx
@@ -6,7 +6,7 @@ import { Button, getButtonStyling } from "@plane/propel/button";
 import { cn } from "@plane/utils";
 import { useCommandPalette } from "@/hooks/store/use-command-palette";
 
-const ProjectSettingsPage = () => {
+function ProjectSettingsPage() {
   // store hooks
   const { resolvedTheme } = useTheme();
   const { toggleCreateProjectModal } = useCommandPalette();
@@ -37,6 +37,6 @@ const ProjectSettingsPage = () => {
       </div>
     </div>
   );
-};
+}
 
 export default ProjectSettingsPage;
diff --git a/apps/web/app/(all)/accounts/reset-password/page.tsx b/apps/web/app/(all)/accounts/reset-password/page.tsx
index 93cc0f830..ce799d6b9 100644
--- a/apps/web/app/(all)/accounts/reset-password/page.tsx
+++ b/apps/web/app/(all)/accounts/reset-password/page.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 // plane imports
 import { EAuthModes } from "@plane/constants";
 // components
@@ -11,15 +10,17 @@ import { EPageTypes } from "@/helpers/authentication.helper";
 import DefaultLayout from "@/layouts/default-layout";
 import { AuthenticationWrapper } from "@/lib/wrappers/authentication-wrapper";
 
-const ResetPasswordPage = () => (
-  <DefaultLayout>
-    <AuthenticationWrapper pageType={EPageTypes.NON_AUTHENTICATED}>
-      <div className="relative z-10 flex flex-col items-center w-screen h-screen overflow-hidden overflow-y-auto pt-6 pb-10 px-8">
-        <AuthHeader type={EAuthModes.SIGN_IN} />
-        <ResetPasswordForm />
-      </div>
-    </AuthenticationWrapper>
-  </DefaultLayout>
-);
+function ResetPasswordPage() {
+  return (
+    <DefaultLayout>
+      <AuthenticationWrapper pageType={EPageTypes.NON_AUTHENTICATED}>
+        <div className="relative z-10 flex flex-col items-center w-screen h-screen overflow-hidden overflow-y-auto pt-6 pb-10 px-8">
+          <AuthHeader type={EAuthModes.SIGN_IN} />
+          <ResetPasswordForm />
+        </div>
+      </AuthenticationWrapper>
+    </DefaultLayout>
+  );
+}
 
 export default ResetPasswordPage;
diff --git a/apps/web/app/(all)/accounts/set-password/page.tsx b/apps/web/app/(all)/accounts/set-password/page.tsx
index 3f9a07bf1..4ee93ae72 100644
--- a/apps/web/app/(all)/accounts/set-password/page.tsx
+++ b/apps/web/app/(all)/accounts/set-password/page.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 // plane imports
 import { EAuthModes } from "@plane/constants";
 // components
@@ -11,15 +10,17 @@ import { EPageTypes } from "@/helpers/authentication.helper";
 import DefaultLayout from "@/layouts/default-layout";
 import { AuthenticationWrapper } from "@/lib/wrappers/authentication-wrapper";
 
-const SetPasswordPage = () => (
-  <DefaultLayout>
-    <AuthenticationWrapper pageType={EPageTypes.SET_PASSWORD}>
-      <div className="relative z-10 flex flex-col items-center w-screen h-screen overflow-hidden overflow-y-auto pt-6 pb-10 px-8">
-        <AuthHeader type={EAuthModes.SIGN_IN} />
-        <ResetPasswordForm />
-      </div>
-    </AuthenticationWrapper>
-  </DefaultLayout>
-);
+function SetPasswordPage() {
+  return (
+    <DefaultLayout>
+      <AuthenticationWrapper pageType={EPageTypes.SET_PASSWORD}>
+        <div className="relative z-10 flex flex-col items-center w-screen h-screen overflow-hidden overflow-y-auto pt-6 pb-10 px-8">
+          <AuthHeader type={EAuthModes.SIGN_IN} />
+          <ResetPasswordForm />
+        </div>
+      </AuthenticationWrapper>
+    </DefaultLayout>
+  );
+}
 
 export default SetPasswordPage;
diff --git a/apps/web/app/(all)/layout.preload.tsx b/apps/web/app/(all)/layout.preload.tsx
index 266df5a1c..000b9b284 100644
--- a/apps/web/app/(all)/layout.preload.tsx
+++ b/apps/web/app/(all)/layout.preload.tsx
@@ -20,6 +20,9 @@
 //   }, []);
 // };
 
-export const PreloadResources = () =>
-  // usePreloadResources();
-  null;
+export function PreloadResources() {
+  return (
+    // usePreloadResources();
+    null
+  );
+}
diff --git a/apps/web/app/(all)/profile/security/page.tsx b/apps/web/app/(all)/profile/security/page.tsx
index a0ee1f472..ed27f95d2 100644
--- a/apps/web/app/(all)/profile/security/page.tsx
+++ b/apps/web/app/(all)/profile/security/page.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import { useState } from "react";
 import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
@@ -43,7 +42,7 @@ const defaultShowPassword = {
   confirmPassword: false,
 };
 
-const SecurityPage = () => {
+function SecurityPage() {
   // store
   const { data: currentUser, changePassword } = useUser();
   // states
@@ -254,6 +253,6 @@ const SecurityPage = () => {
       </ProfileSettingContentWrapper>
     </>
   );
-};
+}
 
 export default observer(SecurityPage);
diff --git a/apps/web/app/(all)/profile/sidebar.tsx b/apps/web/app/(all)/profile/sidebar.tsx
index 4619b186f..53dfd0de8 100644
--- a/apps/web/app/(all)/profile/sidebar.tsx
+++ b/apps/web/app/(all)/profile/sidebar.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import { useEffect, useRef, useState } from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
@@ -37,7 +36,7 @@ const WORKSPACE_ACTION_LINKS = [
   },
 ];
 
-const ProjectActionIcons = ({ type, size, className = "" }: { type: string; size?: number; className?: string }) => {
+function ProjectActionIcons({ type, size, className = "" }: { type: string; size?: number; className?: string }) {
   const icons = {
     profile: CircleUser,
     security: KeyRound,
@@ -51,8 +50,9 @@ const ProjectActionIcons = ({ type, size, className = "" }: { type: string; size
   const Icon = icons[type as keyof typeof icons];
   if (!Icon) return null;
   return <Icon size={size} className={className} />;
-};
-export const ProfileLayoutSidebar = observer(() => {
+}
+
+export const ProfileLayoutSidebar = observer(function ProfileLayoutSidebar() {
   // states
   const [isSigningOut, setIsSigningOut] = useState(false);
   // router
diff --git a/apps/web/app/(all)/sign-up/page.tsx b/apps/web/app/(all)/sign-up/page.tsx
index 18deab2d8..cef1afa3f 100644
--- a/apps/web/app/(all)/sign-up/page.tsx
+++ b/apps/web/app/(all)/sign-up/page.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 // components
 import { AuthBase } from "@/components/auth-screens/auth-base";
 // helpers
@@ -8,12 +7,14 @@ import { EAuthModes, EPageTypes } from "@/helpers/authentication.helper";
 import DefaultLayout from "@/layouts/default-layout";
 import { AuthenticationWrapper } from "@/lib/wrappers/authentication-wrapper";
 
-const SignUpPage = () => (
-  <DefaultLayout>
-    <AuthenticationWrapper pageType={EPageTypes.NON_AUTHENTICATED}>
-      <AuthBase authType={EAuthModes.SIGN_UP} />
-    </AuthenticationWrapper>
-  </DefaultLayout>
-);
+function SignUpPage() {
+  return (
+    <DefaultLayout>
+      <AuthenticationWrapper pageType={EPageTypes.NON_AUTHENTICATED}>
+        <AuthBase authType={EAuthModes.SIGN_UP} />
+      </AuthenticationWrapper>
+    </DefaultLayout>
+  );
+}
 
 export default SignUpPage;
diff --git a/apps/web/app/(home)/page.tsx b/apps/web/app/(home)/page.tsx
index 20a184ffc..ed49c16ba 100644
--- a/apps/web/app/(home)/page.tsx
+++ b/apps/web/app/(home)/page.tsx
@@ -9,12 +9,14 @@ import DefaultLayout from "@/layouts/default-layout";
 // wrappers
 import { AuthenticationWrapper } from "@/lib/wrappers/authentication-wrapper";
 
-const HomePage = () => (
-  <DefaultLayout>
-    <AuthenticationWrapper pageType={EPageTypes.NON_AUTHENTICATED}>
-      <AuthBase authType={EAuthModes.SIGN_IN} />
-    </AuthenticationWrapper>
-  </DefaultLayout>
-);
+function HomePage() {
+  return (
+    <DefaultLayout>
+      <AuthenticationWrapper pageType={EPageTypes.NON_AUTHENTICATED}>
+        <AuthBase authType={EAuthModes.SIGN_IN} />
+      </AuthenticationWrapper>
+    </DefaultLayout>
+  );
+}
 
 export default HomePage;
diff --git a/apps/web/app/compat/next/image.tsx b/apps/web/app/compat/next/image.tsx
index f9a858db2..3a7824bff 100644
--- a/apps/web/app/compat/next/image.tsx
+++ b/apps/web/app/compat/next/image.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import React from "react";
 
 // Minimal shim so code using next/image compiles under React Router + Vite
@@ -14,7 +13,7 @@ type NextImageProps = React.ImgHTMLAttributes<HTMLImageElement> & {
   blurDataURL?: string;
 };
 
-const Image: React.FC<NextImageProps> = ({
+function Image({
   src,
   alt = "",
   fill,
@@ -23,11 +22,11 @@ const Image: React.FC<NextImageProps> = ({
   placeholder: _placeholder,
   blurDataURL: _blurDataURL,
   ...rest
-}) => {
+}: NextImageProps) {
   // If fill is true, apply object-fit styles
   const style = fill ? { objectFit: "cover" as const, width: "100%", height: "100%" } : rest.style;
 
   return <img src={src} alt={alt} {...rest} style={style} />;
-};
+}
 
 export default Image;
diff --git a/apps/web/app/compat/next/link.tsx b/apps/web/app/compat/next/link.tsx
index 4f4236327..00ddf0ed5 100644
--- a/apps/web/app/compat/next/link.tsx
+++ b/apps/web/app/compat/next/link.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import React from "react";
 import { Link as RRLink } from "react-router";
 import { ensureTrailingSlash } from "./helper";
@@ -12,13 +11,8 @@ type NextLinkProps = React.ComponentProps<"a"> & {
   shallow?: boolean; // next.js prop, ignored
 };
 
-const Link: React.FC<NextLinkProps> = ({
-  href,
-  replace,
-  prefetch: _prefetch,
-  scroll: _scroll,
-  shallow: _shallow,
-  ...rest
-}) => <RRLink to={ensureTrailingSlash(href)} replace={replace} {...rest} />;
+function Link({ href, replace, prefetch: _prefetch, scroll: _scroll, shallow: _shallow, ...rest }: NextLinkProps) {
+  return <RRLink to={ensureTrailingSlash(href)} replace={replace} {...rest} />;
+}
 
 export default Link;
diff --git a/apps/web/app/compat/next/script.tsx b/apps/web/app/compat/next/script.tsx
index 2baa63f45..700fea1df 100644
--- a/apps/web/app/compat/next/script.tsx
+++ b/apps/web/app/compat/next/script.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import { useEffect } from "react";
 
 type ScriptProps = {
@@ -14,7 +13,7 @@ type ScriptProps = {
 };
 
 // Minimal shim for next/script that creates a script tag
-const Script: React.FC<ScriptProps> = ({ src, id, strategy: _strategy, onLoad, onError, children, ...rest }) => {
+function Script({ src, id, strategy: _strategy, onLoad, onError, children, ...rest }: ScriptProps) {
   useEffect(() => {
     if (src) {
       const script = document.createElement("script");
@@ -50,6 +49,6 @@ const Script: React.FC<ScriptProps> = ({ src, id, strategy: _strategy, onLoad, o
   }, [src, id, children, onLoad, onError, rest]);
 
   return null;
-};
+}
 
 export default Script;
diff --git a/apps/web/app/error/dev.tsx b/apps/web/app/error/dev.tsx
index d4c30165b..8ea7196ab 100644
--- a/apps/web/app/error/dev.tsx
+++ b/apps/web/app/error/dev.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 // plane imports
 import { isRouteErrorResponse } from "react-router";
 import { Banner } from "@plane/propel/banner";
@@ -12,18 +11,20 @@ interface ErrorActionsProps {
   onReload?: () => void;
 }
 
-const ErrorActions: React.FC<ErrorActionsProps> = ({ onGoHome, onReload }) => (
-  <div className="flex gap-3 pt-2">
-    <Button variant="primary" size="md" onClick={onGoHome}>
-      Go to home
-    </Button>
-    {onReload && (
-      <Button variant="outline-primary" size="md" onClick={onReload}>
-        Reload page
+function ErrorActions({ onGoHome, onReload }: ErrorActionsProps) {
+  return (
+    <div className="flex gap-3 pt-2">
+      <Button variant="primary" size="md" onClick={onGoHome}>
+        Go to home
       </Button>
-    )}
-  </div>
-);
+      {onReload && (
+        <Button variant="outline-primary" size="md" onClick={onReload}>
+          Reload page
+        </Button>
+      )}
+    </div>
+  );
+}
 
 interface DevErrorComponentProps {
   error: unknown;
@@ -31,7 +32,7 @@ interface DevErrorComponentProps {
   onReload: () => void;
 }
 
-export const DevErrorComponent: React.FC<DevErrorComponentProps> = ({ error, onGoHome, onReload }) => {
+export function DevErrorComponent({ error, onGoHome, onReload }: DevErrorComponentProps) {
   if (isRouteErrorResponse(error)) {
     return (
       <div className="min-h-screen bg-custom-background-90 p-6 flex items-start justify-center transition-none">
@@ -152,4 +153,4 @@ export const DevErrorComponent: React.FC<DevErrorComponentProps> = ({ error, onG
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/app/error/index.tsx b/apps/web/app/error/index.tsx
index b577f866b..88a94eb3d 100644
--- a/apps/web/app/error/index.tsx
+++ b/apps/web/app/error/index.tsx
@@ -6,7 +6,7 @@ import { useAppRouter } from "@/hooks/use-app-router";
 import { DevErrorComponent } from "./dev";
 import { ProdErrorComponent } from "./prod";
 
-export const CustomErrorComponent: React.FC<{ error: unknown }> = ({ error }) => {
+export function CustomErrorComponent({ error }: { error: unknown }) {
   // router
   const router = useAppRouter();
 
@@ -18,4 +18,4 @@ export const CustomErrorComponent: React.FC<{ error: unknown }> = ({ error }) =>
   }
 
   return <ProdErrorComponent onGoHome={handleGoHome} />;
-};
+}
diff --git a/apps/web/app/error/prod.tsx b/apps/web/app/error/prod.tsx
index e30c58bdd..c039c5b58 100644
--- a/apps/web/app/error/prod.tsx
+++ b/apps/web/app/error/prod.tsx
@@ -32,7 +32,7 @@ interface ProdErrorComponentProps {
   onGoHome: () => void;
 }
 
-export const ProdErrorComponent: React.FC<ProdErrorComponentProps> = ({ onGoHome }) => {
+export function ProdErrorComponent({ onGoHome }: ProdErrorComponentProps) {
   // hooks
   const { resolvedTheme } = useTheme();
 
@@ -86,4 +86,4 @@ export const ProdErrorComponent: React.FC<ProdErrorComponentProps> = ({ onGoHome
       </div>
     </DefaultLayout>
   );
-};
+}
diff --git a/apps/web/app/not-found.tsx b/apps/web/app/not-found.tsx
index 6a4e80854..5caf3ea9d 100644
--- a/apps/web/app/not-found.tsx
+++ b/apps/web/app/not-found.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import Link from "next/link";
 // ui
 import { Button } from "@plane/propel/button";
@@ -13,30 +12,32 @@ export const meta: Route.MetaFunction = () => [
   { name: "robots", content: "noindex, nofollow" },
 ];
 
-const PageNotFound = () => (
-  <div className={`h-screen w-full overflow-hidden bg-custom-background-100`}>
-    <div className="grid h-full place-items-center p-4">
-      <div className="space-y-8 text-center">
-        <div className="relative mx-auto h-60 w-60 lg:h-80 lg:w-80">
-          <img src={Image404} className="h-full w-full object-contain" alt="404- Page not found" />
+function PageNotFound() {
+  return (
+    <div className={`h-screen w-full overflow-hidden bg-custom-background-100`}>
+      <div className="grid h-full place-items-center p-4">
+        <div className="space-y-8 text-center">
+          <div className="relative mx-auto h-60 w-60 lg:h-80 lg:w-80">
+            <img src={Image404} className="h-full w-full object-contain" alt="404- Page not found" />
+          </div>
+          <div className="space-y-2">
+            <h3 className="text-lg font-semibold">Oops! Something went wrong.</h3>
+            <p className="text-sm text-custom-text-200">
+              Sorry, the page you are looking for cannot be found. It may have been removed, had its name changed, or is
+              temporarily unavailable.
+            </p>
+          </div>
+          <Link href="/">
+            <span className="flex justify-center">
+              <Button variant="neutral-primary" size="md">
+                Go to Home
+              </Button>
+            </span>
+          </Link>
         </div>
-        <div className="space-y-2">
-          <h3 className="text-lg font-semibold">Oops! Something went wrong.</h3>
-          <p className="text-sm text-custom-text-200">
-            Sorry, the page you are looking for cannot be found. It may have been removed, had its name changed, or is
-            temporarily unavailable.
-          </p>
-        </div>
-        <Link href="/">
-          <span className="flex justify-center">
-            <Button variant="neutral-primary" size="md">
-              Go to Home
-            </Button>
-          </span>
-        </Link>
       </div>
     </div>
-  </div>
-);
+  );
+}
 
 export default PageNotFound;
diff --git a/apps/web/app/provider.tsx b/apps/web/app/provider.tsx
index 125f50216..acd497e35 100644
--- a/apps/web/app/provider.tsx
+++ b/apps/web/app/provider.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import type { FC, ReactNode } from "react";
 import { lazy, Suspense } from "react";
 import { useTheme, ThemeProvider } from "next-themes";
@@ -18,21 +17,30 @@ import { AppProgressBar } from "@/lib/b-progress";
 import { StoreProvider } from "@/lib/store-context";
 // wrappers
 import { InstanceWrapper } from "@/lib/wrappers/instance-wrapper";
+
 // lazy imports
-const StoreWrapper = lazy(() => import("@/lib/wrappers/store-wrapper"));
-const PostHogProvider = lazy(() => import("@/lib/posthog-provider"));
-const IntercomProvider = lazy(() => import("@/lib/intercom-provider"));
+const StoreWrapper = lazy(function StoreWrapper() {
+  return import("@/lib/wrappers/store-wrapper");
+});
+
+const PostHogProvider = lazy(function PostHogProvider() {
+  return import("@/lib/posthog-provider");
+});
+
+const IntercomProvider = lazy(function IntercomProvider() {
+  return import("@/lib/intercom-provider");
+});
 
 export interface IAppProvider {
   children: ReactNode;
 }
 
-const ToastWithTheme = () => {
+function ToastWithTheme() {
   const { resolvedTheme } = useTheme();
   return <Toast theme={resolveGeneralTheme(resolvedTheme)} />;
-};
+}
 
-export const AppProvider: FC<IAppProvider> = (props) => {
+export function AppProvider(props: IAppProvider) {
   const { children } = props;
   // themes
   return (
@@ -56,4 +64,4 @@ export const AppProvider: FC<IAppProvider> = (props) => {
       </ThemeProvider>
     </StoreProvider>
   );
-};
+}
diff --git a/apps/web/ce/components/active-cycles/root.tsx b/apps/web/ce/components/active-cycles/root.tsx
index caad61a0a..ae0aa9b1f 100644
--- a/apps/web/ce/components/active-cycles/root.tsx
+++ b/apps/web/ce/components/active-cycles/root.tsx
@@ -1,4 +1,6 @@
 // local imports
 import { WorkspaceActiveCyclesUpgrade } from "./workspace-active-cycles-upgrade";
 
-export const WorkspaceActiveCyclesRoot = () => <WorkspaceActiveCyclesUpgrade />;
+export function WorkspaceActiveCyclesRoot() {
+  return <WorkspaceActiveCyclesUpgrade />;
+}
diff --git a/apps/web/ce/components/active-cycles/workspace-active-cycles-upgrade.tsx b/apps/web/ce/components/active-cycles/workspace-active-cycles-upgrade.tsx
index 982e15220..4728fd809 100644
--- a/apps/web/ce/components/active-cycles/workspace-active-cycles-upgrade.tsx
+++ b/apps/web/ce/components/active-cycles/workspace-active-cycles-upgrade.tsx
@@ -63,7 +63,7 @@ export const WORKSPACE_ACTIVE_CYCLES_DETAILS = [
   },
 ];
 
-export const WorkspaceActiveCyclesUpgrade = observer(() => {
+export const WorkspaceActiveCyclesUpgrade = observer(function WorkspaceActiveCyclesUpgrade() {
   const { t } = useTranslation();
   // store hooks
   const {
diff --git a/apps/web/ce/components/app-rail/root.tsx b/apps/web/ce/components/app-rail/root.tsx
index 259764b26..23aff7ca9 100644
--- a/apps/web/ce/components/app-rail/root.tsx
+++ b/apps/web/ce/components/app-rail/root.tsx
@@ -1,4 +1,6 @@
 "use client";
 import React from "react";
 
-export const AppRailRoot = () => <></>;
+export function AppRailRoot() {
+  return <></>;
+}
diff --git a/apps/web/ce/components/automations/list/wrapper.tsx b/apps/web/ce/components/automations/list/wrapper.tsx
index 1db9b9da6..80b819aa0 100644
--- a/apps/web/ce/components/automations/list/wrapper.tsx
+++ b/apps/web/ce/components/automations/list/wrapper.tsx
@@ -4,4 +4,6 @@ type Props = {
   children: React.ReactNode;
 };
 
-export const AutomationsListWrapper: React.FC<Props> = (props) => <>{props.children}</>;
+export function AutomationsListWrapper(props: Props) {
+  return <>{props.children}</>;
+}
diff --git a/apps/web/ce/components/automations/root.tsx b/apps/web/ce/components/automations/root.tsx
index e7f15288b..61a40ca1f 100644
--- a/apps/web/ce/components/automations/root.tsx
+++ b/apps/web/ce/components/automations/root.tsx
@@ -8,4 +8,6 @@ export type TCustomAutomationsRootProps = {
   workspaceSlug: string;
 };
 
-export const CustomAutomationsRoot: FC<TCustomAutomationsRootProps> = () => <></>;
+export function CustomAutomationsRoot(_props: TCustomAutomationsRootProps) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/breadcrumbs/common.tsx b/apps/web/ce/components/breadcrumbs/common.tsx
index 86a123915..bb7fc9624 100644
--- a/apps/web/ce/components/breadcrumbs/common.tsx
+++ b/apps/web/ce/components/breadcrumbs/common.tsx
@@ -14,7 +14,7 @@ type TCommonProjectBreadcrumbProps = {
   isLast?: boolean;
 };
 
-export const CommonProjectBreadcrumbs: FC<TCommonProjectBreadcrumbProps> = (props) => {
+export function CommonProjectBreadcrumbs(props: TCommonProjectBreadcrumbProps) {
   const { workspaceSlug, projectId, featureKey, isLast = false } = props;
   return (
     <>
@@ -29,4 +29,4 @@ export const CommonProjectBreadcrumbs: FC<TCommonProjectBreadcrumbProps> = (prop
       )}
     </>
   );
-};
+}
diff --git a/apps/web/ce/components/breadcrumbs/project-feature.tsx b/apps/web/ce/components/breadcrumbs/project-feature.tsx
index cad4338d3..15d29586e 100644
--- a/apps/web/ce/components/breadcrumbs/project-feature.tsx
+++ b/apps/web/ce/components/breadcrumbs/project-feature.tsx
@@ -23,7 +23,9 @@ type TProjectFeatureBreadcrumbProps = {
   additionalNavigationItems?: TNavigationItem[];
 };
 
-export const ProjectFeatureBreadcrumb = observer((props: TProjectFeatureBreadcrumbProps) => {
+export const ProjectFeatureBreadcrumb = observer(function ProjectFeatureBreadcrumb(
+  props: TProjectFeatureBreadcrumbProps
+) {
   const { workspaceSlug, projectId, featureKey, isLast = false, additionalNavigationItems } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/ce/components/breadcrumbs/project.tsx b/apps/web/ce/components/breadcrumbs/project.tsx
index b1137d329..01588ea6a 100644
--- a/apps/web/ce/components/breadcrumbs/project.tsx
+++ b/apps/web/ce/components/breadcrumbs/project.tsx
@@ -18,7 +18,7 @@ type TProjectBreadcrumbProps = {
   handleOnClick?: () => void;
 };
 
-export const ProjectBreadcrumb = observer((props: TProjectBreadcrumbProps) => {
+export const ProjectBreadcrumb = observer(function ProjectBreadcrumb(props: TProjectBreadcrumbProps) {
   const { workspaceSlug, projectId, handleOnClick } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/ce/components/command-palette/actions/work-item-actions/change-state-list.tsx b/apps/web/ce/components/command-palette/actions/work-item-actions/change-state-list.tsx
index fb3595d56..091aaea3f 100644
--- a/apps/web/ce/components/command-palette/actions/work-item-actions/change-state-list.tsx
+++ b/apps/web/ce/components/command-palette/actions/work-item-actions/change-state-list.tsx
@@ -14,7 +14,7 @@ export type TChangeWorkItemStateListProps = {
   handleStateChange: (stateId: string) => void;
 };
 
-export const ChangeWorkItemStateList = observer((props: TChangeWorkItemStateListProps) => {
+export const ChangeWorkItemStateList = observer(function ChangeWorkItemStateList(props: TChangeWorkItemStateListProps) {
   const { projectId, currentStateId, handleStateChange } = props;
   // store hooks
   const { getProjectStates } = useProjectState();
diff --git a/apps/web/ce/components/command-palette/modals/project-level.tsx b/apps/web/ce/components/command-palette/modals/project-level.tsx
index 6b9e8000d..baf430f55 100644
--- a/apps/web/ce/components/command-palette/modals/project-level.tsx
+++ b/apps/web/ce/components/command-palette/modals/project-level.tsx
@@ -14,7 +14,7 @@ export type TProjectLevelModalsProps = {
   projectId: string;
 };
 
-export const ProjectLevelModals = observer((props: TProjectLevelModalsProps) => {
+export const ProjectLevelModals = observer(function ProjectLevelModals(props: TProjectLevelModalsProps) {
   const { workspaceSlug, projectId } = props;
   // store hooks
   const {
diff --git a/apps/web/ce/components/command-palette/modals/work-item-level.tsx b/apps/web/ce/components/command-palette/modals/work-item-level.tsx
index d06602d7e..8f71596c7 100644
--- a/apps/web/ce/components/command-palette/modals/work-item-level.tsx
+++ b/apps/web/ce/components/command-palette/modals/work-item-level.tsx
@@ -19,7 +19,7 @@ export type TWorkItemLevelModalsProps = {
   workItemIdentifier: string | undefined;
 };
 
-export const WorkItemLevelModals: FC<TWorkItemLevelModalsProps> = observer((props) => {
+export const WorkItemLevelModals = observer(function WorkItemLevelModals(props: TWorkItemLevelModalsProps) {
   const { workItemIdentifier } = props;
   // router
   const { workspaceSlug, cycleId, moduleId } = useParams();
diff --git a/apps/web/ce/components/command-palette/modals/workspace-level.tsx b/apps/web/ce/components/command-palette/modals/workspace-level.tsx
index a6c89776d..6a82d54e9 100644
--- a/apps/web/ce/components/command-palette/modals/workspace-level.tsx
+++ b/apps/web/ce/components/command-palette/modals/workspace-level.tsx
@@ -8,7 +8,7 @@ export type TWorkspaceLevelModalsProps = {
   workspaceSlug: string;
 };
 
-export const WorkspaceLevelModals = observer((props: TWorkspaceLevelModalsProps) => {
+export const WorkspaceLevelModals = observer(function WorkspaceLevelModals(props: TWorkspaceLevelModalsProps) {
   const { workspaceSlug } = props;
   // store hooks
   const { isCreateProjectModalOpen, toggleCreateProjectModal } = useCommandPalette();
diff --git a/apps/web/ce/components/command-palette/power-k/pages/context-based/root.tsx b/apps/web/ce/components/command-palette/power-k/pages/context-based/root.tsx
index 2c6c0e891..12833d9df 100644
--- a/apps/web/ce/components/command-palette/power-k/pages/context-based/root.tsx
+++ b/apps/web/ce/components/command-palette/power-k/pages/context-based/root.tsx
@@ -6,6 +6,8 @@ import type { TPowerKContextTypeExtended } from "../../types";
 
 export const CONTEXT_ENTITY_MAP_EXTENDED: Record<TPowerKContextTypeExtended, TContextEntityMap> = {};
 
-export const PowerKContextBasedActionsExtended: React.FC<ContextBasedActionsProps> = () => null;
+export function PowerKContextBasedActionsExtended(_props: ContextBasedActionsProps) {
+  return null;
+}
 
 export const usePowerKContextBasedExtendedActions = (): TPowerKCommandConfig[] => [];
diff --git a/apps/web/ce/components/command-palette/power-k/pages/context-based/work-item/state-menu-item.tsx b/apps/web/ce/components/command-palette/power-k/pages/context-based/work-item/state-menu-item.tsx
index 5fbc91edf..da37a5689 100644
--- a/apps/web/ce/components/command-palette/power-k/pages/context-based/work-item/state-menu-item.tsx
+++ b/apps/web/ce/components/command-palette/power-k/pages/context-based/work-item/state-menu-item.tsx
@@ -15,7 +15,9 @@ export type TPowerKProjectStatesMenuItemsProps = {
   workspaceSlug: string;
 };
 
-export const PowerKProjectStatesMenuItems: React.FC<TPowerKProjectStatesMenuItemsProps> = observer((props) => {
+export const PowerKProjectStatesMenuItems = observer(function PowerKProjectStatesMenuItems(
+  props: TPowerKProjectStatesMenuItemsProps
+) {
   const { handleSelect, selectedStateId, states } = props;
 
   return (
diff --git a/apps/web/ce/components/command-palette/power-k/search/no-results-command.tsx b/apps/web/ce/components/command-palette/power-k/search/no-results-command.tsx
index cc8ca10d5..789facdfe 100644
--- a/apps/web/ce/components/command-palette/power-k/search/no-results-command.tsx
+++ b/apps/web/ce/components/command-palette/power-k/search/no-results-command.tsx
@@ -13,7 +13,7 @@ export type TPowerKModalNoSearchResultsCommandProps = {
   updateSearchTerm: (value: string) => void;
 };
 
-export const PowerKModalNoSearchResultsCommand: React.FC<TPowerKModalNoSearchResultsCommandProps> = (props) => {
+export function PowerKModalNoSearchResultsCommand(props: TPowerKModalNoSearchResultsCommandProps) {
   const { updateSearchTerm } = props;
   // translation
   const { t } = useTranslation();
@@ -33,4 +33,4 @@ export const PowerKModalNoSearchResultsCommand: React.FC<TPowerKModalNoSearchRes
       />
     </Command.Group>
   );
-};
+}
diff --git a/apps/web/ce/components/comments/comment-block.tsx b/apps/web/ce/components/comments/comment-block.tsx
index c5c9b442a..384c65b9c 100644
--- a/apps/web/ce/components/comments/comment-block.tsx
+++ b/apps/web/ce/components/comments/comment-block.tsx
@@ -17,7 +17,7 @@ type TCommentBlock = {
   children: ReactNode;
 };
 
-export const CommentBlock: FC<TCommentBlock> = observer((props) => {
+export const CommentBlock = observer(function CommentBlock(props: TCommentBlock) {
   const { comment, ends, quickActions, children } = props;
   // refs
   const commentBlockRef = useRef<HTMLDivElement>(null);
diff --git a/apps/web/ce/components/common/extended-app-header.tsx b/apps/web/ce/components/common/extended-app-header.tsx
index 59dbf3394..c72eac175 100644
--- a/apps/web/ce/components/common/extended-app-header.tsx
+++ b/apps/web/ce/components/common/extended-app-header.tsx
@@ -3,7 +3,7 @@ import { observer } from "mobx-react";
 import { AppSidebarToggleButton } from "@/components/sidebar/sidebar-toggle-button";
 import { useAppTheme } from "@/hooks/store/use-app-theme";
 
-export const ExtendedAppHeader = observer((props: { header: ReactNode }) => {
+export const ExtendedAppHeader = observer(function ExtendedAppHeader(props: { header: ReactNode }) {
   const { header } = props;
   // store hooks
   const { sidebarCollapsed } = useAppTheme();
diff --git a/apps/web/ce/components/common/subscription/subscription-pill.tsx b/apps/web/ce/components/common/subscription/subscription-pill.tsx
index ba30d3ad6..e03ecf8d7 100644
--- a/apps/web/ce/components/common/subscription/subscription-pill.tsx
+++ b/apps/web/ce/components/common/subscription/subscription-pill.tsx
@@ -4,4 +4,6 @@ type TProps = {
   workspace?: IWorkspace;
 };
 
-export const SubscriptionPill = (props: TProps) => <></>;
+export function SubscriptionPill(props: TProps) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/cycles/active-cycle/root.tsx b/apps/web/ce/components/cycles/active-cycle/root.tsx
index b0933218e..9bded0e52 100644
--- a/apps/web/ce/components/cycles/active-cycle/root.tsx
+++ b/apps/web/ce/components/cycles/active-cycle/root.tsx
@@ -29,7 +29,7 @@ interface IActiveCycleDetails {
   showHeader?: boolean;
 }
 
-export const ActiveCycleRoot: React.FC<IActiveCycleDetails> = observer((props) => {
+export const ActiveCycleRoot = observer(function ActiveCycleRoot(props: IActiveCycleDetails) {
   const { workspaceSlug, projectId, cycleId: propsCycleId, showHeader = true } = props;
   // theme hook
   const { resolvedTheme } = useTheme();
@@ -47,8 +47,8 @@ export const ActiveCycleRoot: React.FC<IActiveCycleDetails> = observer((props) =
     cycleIssueDetails,
   } = useCyclesDetails({ workspaceSlug, projectId, cycleId });
 
-  const ActiveCyclesComponent = useMemo(
-    () => (
+  const ActiveCyclesComponent = useMemo(function ActiveCyclesComponent() {
+    return (
       <>
         {!cycleId || !activeCycle ? (
           <DetailedEmptyState
@@ -89,9 +89,8 @@ export const ActiveCycleRoot: React.FC<IActiveCycleDetails> = observer((props) =
           </div>
         )}
       </>
-    ),
-    [cycleId, activeCycle, workspaceSlug, projectId, handleFiltersUpdate, cycleIssueDetails]
-  );
+    );
+  });
 
   return (
     <>
diff --git a/apps/web/ce/components/cycles/additional-actions.tsx b/apps/web/ce/components/cycles/additional-actions.tsx
index 0fd9efb31..96a4a004d 100644
--- a/apps/web/ce/components/cycles/additional-actions.tsx
+++ b/apps/web/ce/components/cycles/additional-actions.tsx
@@ -4,4 +4,6 @@ type Props = {
   cycleId: string;
   projectId: string;
 };
-export const CycleAdditionalActions: FC<Props> = observer(() => <></>);
+export const CycleAdditionalActions = observer(function CycleAdditionalActions(_props: Props) {
+  return <></>;
+});
diff --git a/apps/web/ce/components/cycles/analytics-sidebar/base.tsx b/apps/web/ce/components/cycles/analytics-sidebar/base.tsx
index 916428190..340be3395 100644
--- a/apps/web/ce/components/cycles/analytics-sidebar/base.tsx
+++ b/apps/web/ce/components/cycles/analytics-sidebar/base.tsx
@@ -19,7 +19,7 @@ type ProgressChartProps = {
   projectId: string;
   cycleId: string;
 };
-export const SidebarChart = observer((props: ProgressChartProps) => {
+export const SidebarChart = observer(function SidebarChart(props: ProgressChartProps) {
   const { workspaceSlug, projectId, cycleId } = props;
 
   // hooks
diff --git a/apps/web/ce/components/cycles/analytics-sidebar/root.tsx b/apps/web/ce/components/cycles/analytics-sidebar/root.tsx
index 6be4361ef..dd65b1d9f 100644
--- a/apps/web/ce/components/cycles/analytics-sidebar/root.tsx
+++ b/apps/web/ce/components/cycles/analytics-sidebar/root.tsx
@@ -10,4 +10,6 @@ type Props = {
   cycleId: string;
 };
 
-export const SidebarChartRoot: FC<Props> = (props) => <SidebarChart {...props} />;
+export function SidebarChartRoot(props: Props) {
+  return <SidebarChart {...props} />;
+}
diff --git a/apps/web/ce/components/cycles/end-cycle/modal.tsx b/apps/web/ce/components/cycles/end-cycle/modal.tsx
index 754c84f9f..87b4ded45 100644
--- a/apps/web/ce/components/cycles/end-cycle/modal.tsx
+++ b/apps/web/ce/components/cycles/end-cycle/modal.tsx
@@ -10,4 +10,6 @@ interface Props {
   cycleName: string;
 }
 
-export const EndCycleModal: React.FC<Props> = () => <></>;
+export function EndCycleModal(_props: Props) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/de-dupe/de-dupe-button.tsx b/apps/web/ce/components/de-dupe/de-dupe-button.tsx
index 94d800ca8..2ece4f4cd 100644
--- a/apps/web/ce/components/de-dupe/de-dupe-button.tsx
+++ b/apps/web/ce/components/de-dupe/de-dupe-button.tsx
@@ -10,7 +10,7 @@ type TDeDupeButtonRoot = {
   label: string;
 };
 
-export const DeDupeButtonRoot: FC<TDeDupeButtonRoot> = (props) => {
+export function DeDupeButtonRoot(props: TDeDupeButtonRoot) {
   const { workspaceSlug, isDuplicateModalOpen, label, handleOnClick } = props;
   return <></>;
-};
+}
diff --git a/apps/web/ce/components/de-dupe/duplicate-modal/root.tsx b/apps/web/ce/components/de-dupe/duplicate-modal/root.tsx
index 55eb084fd..6f96f0d8c 100644
--- a/apps/web/ce/components/de-dupe/duplicate-modal/root.tsx
+++ b/apps/web/ce/components/de-dupe/duplicate-modal/root.tsx
@@ -10,7 +10,7 @@ type TDuplicateModalRootProps = {
   handleDuplicateIssueModal: (value: boolean) => void;
 };
 
-export const DuplicateModalRoot: FC<TDuplicateModalRootProps> = (props) => {
+export function DuplicateModalRoot(props: TDuplicateModalRootProps) {
   const { workspaceSlug, issues, handleDuplicateIssueModal } = props;
   return <></>;
-};
+}
diff --git a/apps/web/ce/components/de-dupe/duplicate-popover/root.tsx b/apps/web/ce/components/de-dupe/duplicate-popover/root.tsx
index 3dd227cc8..a8648b120 100644
--- a/apps/web/ce/components/de-dupe/duplicate-popover/root.tsx
+++ b/apps/web/ce/components/de-dupe/duplicate-popover/root.tsx
@@ -18,7 +18,7 @@ type TDeDupeIssuePopoverRootProps = {
   isIntakeIssue?: boolean;
 };
 
-export const DeDupeIssuePopoverRoot: FC<TDeDupeIssuePopoverRootProps> = observer((props) => {
+export const DeDupeIssuePopoverRoot = observer(function DeDupeIssuePopoverRoot(props: TDeDupeIssuePopoverRootProps) {
   const {} = props;
   return <></>;
 });
diff --git a/apps/web/ce/components/de-dupe/issue-block/button-label.tsx b/apps/web/ce/components/de-dupe/issue-block/button-label.tsx
index d6e363456..5b6d97546 100644
--- a/apps/web/ce/components/de-dupe/issue-block/button-label.tsx
+++ b/apps/web/ce/components/de-dupe/issue-block/button-label.tsx
@@ -7,7 +7,7 @@ type TDeDupeIssueButtonLabelProps = {
   buttonLabel: string;
 };
 
-export const DeDupeIssueButtonLabel: FC<TDeDupeIssueButtonLabelProps> = (props) => {
+export function DeDupeIssueButtonLabel(props: TDeDupeIssueButtonLabelProps) {
   const { isOpen, buttonLabel } = props;
   return <></>;
-};
+}
diff --git a/apps/web/ce/components/editor/embeds/mentions/root.tsx b/apps/web/ce/components/editor/embeds/mentions/root.tsx
index e3d7cc49d..2f3f9a5b6 100644
--- a/apps/web/ce/components/editor/embeds/mentions/root.tsx
+++ b/apps/web/ce/components/editor/embeds/mentions/root.tsx
@@ -3,4 +3,6 @@ import type { TCallbackMentionComponentProps } from "@plane/editor";
 
 export type TEditorMentionComponentProps = TCallbackMentionComponentProps;
 
-export const EditorAdditionalMentionsRoot: React.FC<TEditorMentionComponentProps> = () => null;
+export function EditorAdditionalMentionsRoot(_props: TEditorMentionComponentProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/epics/epic-modal/modal.tsx b/apps/web/ce/components/epics/epic-modal/modal.tsx
index f1fec6ba8..f3749797b 100644
--- a/apps/web/ce/components/epics/epic-modal/modal.tsx
+++ b/apps/web/ce/components/epics/epic-modal/modal.tsx
@@ -17,4 +17,6 @@ export interface EpicModalProps {
   isProjectSelectionDisabled?: boolean;
 }
 
-export const CreateUpdateEpicModal: FC<EpicModalProps> = (props) => <></>;
+export function CreateUpdateEpicModal(props: EpicModalProps) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/estimates/estimate-list-item-buttons.tsx b/apps/web/ce/components/estimates/estimate-list-item-buttons.tsx
index 936fdc622..a2827d897 100644
--- a/apps/web/ce/components/estimates/estimate-list-item-buttons.tsx
+++ b/apps/web/ce/components/estimates/estimate-list-item-buttons.tsx
@@ -15,7 +15,7 @@ type TEstimateListItem = {
   onDeleteClick?: (estimateId: string) => void;
 };
 
-export const EstimateListItemButtons: FC<TEstimateListItem> = observer((props) => {
+export const EstimateListItemButtons = observer(function EstimateListItemButtons(props: TEstimateListItem) {
   const { estimateId, isAdmin, isEditable, onDeleteClick } = props;
 
   if (!isAdmin || !isEditable) return <></>;
diff --git a/apps/web/ce/components/estimates/inputs/time-input.tsx b/apps/web/ce/components/estimates/inputs/time-input.tsx
index 39341ac3b..17d6cec9d 100644
--- a/apps/web/ce/components/estimates/inputs/time-input.tsx
+++ b/apps/web/ce/components/estimates/inputs/time-input.tsx
@@ -5,4 +5,6 @@ export type TEstimateTimeInputProps = {
   handleEstimateInputValue: (value: string) => void;
 };
 
-export const EstimateTimeInput: FC<TEstimateTimeInputProps> = () => <></>;
+export function EstimateTimeInput(_props: TEstimateTimeInputProps) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/estimates/points/delete.tsx b/apps/web/ce/components/estimates/points/delete.tsx
index 522a28c96..a86a14ab2 100644
--- a/apps/web/ce/components/estimates/points/delete.tsx
+++ b/apps/web/ce/components/estimates/points/delete.tsx
@@ -16,4 +16,6 @@ export type TEstimatePointDelete = {
   estimateSystem: TEstimateSystemKeys;
 };
 
-export const EstimatePointDelete: FC<TEstimatePointDelete> = () => <></>;
+export function EstimatePointDelete(_props: TEstimatePointDelete) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/estimates/update/modal.tsx b/apps/web/ce/components/estimates/update/modal.tsx
index fd4317196..a614f1616 100644
--- a/apps/web/ce/components/estimates/update/modal.tsx
+++ b/apps/web/ce/components/estimates/update/modal.tsx
@@ -11,4 +11,6 @@ type TUpdateEstimateModal = {
   handleClose: () => void;
 };
 
-export const UpdateEstimateModal: FC<TUpdateEstimateModal> = observer(() => <></>);
+export const UpdateEstimateModal = observer(function UpdateEstimateModal(_props: TUpdateEstimateModal) {
+  return <></>;
+});
diff --git a/apps/web/ce/components/gantt-chart/blocks/block-row-list.tsx b/apps/web/ce/components/gantt-chart/blocks/block-row-list.tsx
index ecab672dd..7be26753f 100644
--- a/apps/web/ce/components/gantt-chart/blocks/block-row-list.tsx
+++ b/apps/web/ce/components/gantt-chart/blocks/block-row-list.tsx
@@ -18,7 +18,7 @@ export type GanttChartBlocksProps = {
   ganttContainerRef: React.RefObject<HTMLDivElement>;
 };
 
-export const GanttChartRowList: FC<GanttChartBlocksProps> = (props) => {
+export function GanttChartRowList(props: GanttChartBlocksProps) {
   const {
     blockIds,
     blockUpdateHandler,
@@ -56,4 +56,4 @@ export const GanttChartRowList: FC<GanttChartBlocksProps> = (props) => {
       ))}
     </div>
   );
-};
+}
diff --git a/apps/web/ce/components/gantt-chart/blocks/blocks-list.tsx b/apps/web/ce/components/gantt-chart/blocks/blocks-list.tsx
index 593e80502..1a14dd2de 100644
--- a/apps/web/ce/components/gantt-chart/blocks/blocks-list.tsx
+++ b/apps/web/ce/components/gantt-chart/blocks/blocks-list.tsx
@@ -15,7 +15,7 @@ export type GanttChartBlocksProps = {
   enableDependency: boolean | ((blockId: string) => boolean);
 };
 
-export const GanttChartBlocksList: FC<GanttChartBlocksProps> = (props) => {
+export function GanttChartBlocksList(props: GanttChartBlocksProps) {
   const {
     blockIds,
     blockToRender,
@@ -50,4 +50,4 @@ export const GanttChartBlocksList: FC<GanttChartBlocksProps> = (props) => {
       ))}
     </>
   );
-};
+}
diff --git a/apps/web/ce/components/gantt-chart/dependency/blockDraggables/left-draggable.tsx b/apps/web/ce/components/gantt-chart/dependency/blockDraggables/left-draggable.tsx
index a68118b6c..5257bacec 100644
--- a/apps/web/ce/components/gantt-chart/dependency/blockDraggables/left-draggable.tsx
+++ b/apps/web/ce/components/gantt-chart/dependency/blockDraggables/left-draggable.tsx
@@ -6,4 +6,6 @@ type LeftDependencyDraggableProps = {
   ganttContainerRef: RefObject<HTMLDivElement>;
 };
 
-export const LeftDependencyDraggable = (props: LeftDependencyDraggableProps) => <></>;
+export function LeftDependencyDraggable(props: LeftDependencyDraggableProps) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/gantt-chart/dependency/blockDraggables/right-draggable.tsx b/apps/web/ce/components/gantt-chart/dependency/blockDraggables/right-draggable.tsx
index 7a36ec9b3..a8388d4f4 100644
--- a/apps/web/ce/components/gantt-chart/dependency/blockDraggables/right-draggable.tsx
+++ b/apps/web/ce/components/gantt-chart/dependency/blockDraggables/right-draggable.tsx
@@ -5,4 +5,6 @@ type RightDependencyDraggableProps = {
   block: IGanttBlock;
   ganttContainerRef: RefObject<HTMLDivElement>;
 };
-export const RightDependencyDraggable = (props: RightDependencyDraggableProps) => <></>;
+export function RightDependencyDraggable(props: RightDependencyDraggableProps) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/gantt-chart/dependency/dependency-paths.tsx b/apps/web/ce/components/gantt-chart/dependency/dependency-paths.tsx
index e52805e17..d88f5206d 100644
--- a/apps/web/ce/components/gantt-chart/dependency/dependency-paths.tsx
+++ b/apps/web/ce/components/gantt-chart/dependency/dependency-paths.tsx
@@ -3,7 +3,7 @@ import type { FC } from "react";
 type Props = {
   isEpic?: boolean;
 };
-export const TimelineDependencyPaths: FC<Props> = (props) => {
+export function TimelineDependencyPaths(props: Props) {
   const { isEpic = false } = props;
   return <></>;
-};
+}
diff --git a/apps/web/ce/components/gantt-chart/dependency/draggable-dependency-path.tsx b/apps/web/ce/components/gantt-chart/dependency/draggable-dependency-path.tsx
index 3b4aa350d..d37b2f550 100644
--- a/apps/web/ce/components/gantt-chart/dependency/draggable-dependency-path.tsx
+++ b/apps/web/ce/components/gantt-chart/dependency/draggable-dependency-path.tsx
@@ -1 +1,3 @@
-export const TimelineDraggablePath = () => <></>;
+export function TimelineDraggablePath() {
+  return <></>;
+}
diff --git a/apps/web/ce/components/global/product-updates-header.tsx b/apps/web/ce/components/global/product-updates-header.tsx
index 26d4ebbde..83e2c489c 100644
--- a/apps/web/ce/components/global/product-updates-header.tsx
+++ b/apps/web/ce/components/global/product-updates-header.tsx
@@ -6,7 +6,7 @@ import { cn } from "@plane/utils";
 // package.json
 import packageJson from "package.json";
 
-export const ProductUpdatesHeader = observer(() => {
+export const ProductUpdatesHeader = observer(function ProductUpdatesHeader() {
   const { t } = useTranslation();
   return (
     <div className="flex gap-2 mx-6 my-4 items-center justify-between flex-shrink-0">
diff --git a/apps/web/ce/components/global/version-number.tsx b/apps/web/ce/components/global/version-number.tsx
index f75bb10b1..b04ae581e 100644
--- a/apps/web/ce/components/global/version-number.tsx
+++ b/apps/web/ce/components/global/version-number.tsx
@@ -2,11 +2,11 @@
 import { useTranslation } from "@plane/i18n";
 import packageJson from "package.json";
 
-export const PlaneVersionNumber: React.FC = () => {
+export function PlaneVersionNumber() {
   const { t } = useTranslation();
   return (
     <span>
       {t("version")}: v{packageJson.version}
     </span>
   );
-};
+}
diff --git a/apps/web/ce/components/home/header.tsx b/apps/web/ce/components/home/header.tsx
index c95736c9e..ac905596e 100644
--- a/apps/web/ce/components/home/header.tsx
+++ b/apps/web/ce/components/home/header.tsx
@@ -1 +1,3 @@
-export const HomePageHeader = () => <></>;
+export function HomePageHeader() {
+  return <></>;
+}
diff --git a/apps/web/ce/components/home/peek-overviews.tsx b/apps/web/ce/components/home/peek-overviews.tsx
index 05544302d..042fa6382 100644
--- a/apps/web/ce/components/home/peek-overviews.tsx
+++ b/apps/web/ce/components/home/peek-overviews.tsx
@@ -2,8 +2,10 @@
 
 import { IssuePeekOverview } from "@/components/issues/peek-overview";
 
-export const HomePeekOverviewsRoot = () => (
-  <>
-    <IssuePeekOverview />
-  </>
-);
+export function HomePeekOverviewsRoot() {
+  return (
+    <>
+      <IssuePeekOverview />
+    </>
+  );
+}
diff --git a/apps/web/ce/components/inbox/source-pill.tsx b/apps/web/ce/components/inbox/source-pill.tsx
index 77d3038cb..1d8bc06ea 100644
--- a/apps/web/ce/components/inbox/source-pill.tsx
+++ b/apps/web/ce/components/inbox/source-pill.tsx
@@ -4,4 +4,6 @@ export type TInboxSourcePill = {
   source: EInboxIssueSource;
 };
 
-export const InboxSourcePill = (props: TInboxSourcePill) => <></>;
+export function InboxSourcePill(props: TInboxSourcePill) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/instance/maintenance-message.tsx b/apps/web/ce/components/instance/maintenance-message.tsx
index 067c95f5e..660ebe4a5 100644
--- a/apps/web/ce/components/instance/maintenance-message.tsx
+++ b/apps/web/ce/components/instance/maintenance-message.tsx
@@ -1,4 +1,4 @@
-export const MaintenanceMessage = () => {
+export function MaintenanceMessage() {
   const linkMap = [
     {
       key: "mail_to",
@@ -34,4 +34,4 @@ export const MaintenanceMessage = () => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/web/ce/components/issues/bulk-operations/root.tsx b/apps/web/ce/components/issues/bulk-operations/root.tsx
index fe7fcfe1b..fef3b7220 100644
--- a/apps/web/ce/components/issues/bulk-operations/root.tsx
+++ b/apps/web/ce/components/issues/bulk-operations/root.tsx
@@ -10,7 +10,7 @@ type Props = {
   selectionHelpers: TSelectionHelper;
 };
 
-export const IssueBulkOperationsRoot: React.FC<Props> = observer((props) => {
+export const IssueBulkOperationsRoot = observer(function IssueBulkOperationsRoot(props: Props) {
   const { className, selectionHelpers } = props;
   // store hooks
   const { isSelectionActive } = useMultipleSelectStore();
diff --git a/apps/web/ce/components/issues/filters/applied-filters/issue-types.tsx b/apps/web/ce/components/issues/filters/applied-filters/issue-types.tsx
index fd2daf9c8..6479b4dd6 100644
--- a/apps/web/ce/components/issues/filters/applied-filters/issue-types.tsx
+++ b/apps/web/ce/components/issues/filters/applied-filters/issue-types.tsx
@@ -8,4 +8,6 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedIssueTypeFilters: React.FC<Props> = observer(() => null);
+export const AppliedIssueTypeFilters = observer(function AppliedIssueTypeFilters(_props: Props) {
+  return null;
+});
diff --git a/apps/web/ce/components/issues/filters/issue-types.tsx b/apps/web/ce/components/issues/filters/issue-types.tsx
index 4d983bb7d..e262b7912 100644
--- a/apps/web/ce/components/issues/filters/issue-types.tsx
+++ b/apps/web/ce/components/issues/filters/issue-types.tsx
@@ -9,4 +9,6 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterIssueTypes: React.FC<Props> = observer(() => null);
+export const FilterIssueTypes = observer(function FilterIssueTypes(_props: Props) {
+  return null;
+});
diff --git a/apps/web/ce/components/issues/filters/team-project.tsx b/apps/web/ce/components/issues/filters/team-project.tsx
index c8975deb4..b96ea9bd7 100644
--- a/apps/web/ce/components/issues/filters/team-project.tsx
+++ b/apps/web/ce/components/issues/filters/team-project.tsx
@@ -9,4 +9,6 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterTeamProjects: React.FC<Props> = observer(() => null);
+export const FilterTeamProjects = observer(function FilterTeamProjects(_props: Props) {
+  return null;
+});
diff --git a/apps/web/ce/components/issues/header.tsx b/apps/web/ce/components/issues/header.tsx
index 58f699be5..c4628ebb7 100644
--- a/apps/web/ce/components/issues/header.tsx
+++ b/apps/web/ce/components/issues/header.tsx
@@ -33,7 +33,7 @@ import { usePlatformOS } from "@/hooks/use-platform-os";
 // plane web
 import { CommonProjectBreadcrumbs } from "../breadcrumbs/common";
 
-export const IssuesHeader = observer(() => {
+export const IssuesHeader = observer(function IssuesHeader() {
   // router
   const router = useAppRouter();
   const { workspaceSlug, projectId } = useParams() as { workspaceSlug: string; projectId: string };
diff --git a/apps/web/ce/components/issues/issue-detail-widgets/action-buttons.tsx b/apps/web/ce/components/issues/issue-detail-widgets/action-buttons.tsx
index b0f33932f..bac610826 100644
--- a/apps/web/ce/components/issues/issue-detail-widgets/action-buttons.tsx
+++ b/apps/web/ce/components/issues/issue-detail-widgets/action-buttons.tsx
@@ -11,4 +11,6 @@ export type TWorkItemAdditionalWidgetActionButtonsProps = {
   workspaceSlug: string;
 };
 
-export const WorkItemAdditionalWidgetActionButtons: FC<TWorkItemAdditionalWidgetActionButtonsProps> = () => null;
+export function WorkItemAdditionalWidgetActionButtons(_props: TWorkItemAdditionalWidgetActionButtonsProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/issues/issue-detail-widgets/collapsibles.tsx b/apps/web/ce/components/issues/issue-detail-widgets/collapsibles.tsx
index 2632987f8..092663d90 100644
--- a/apps/web/ce/components/issues/issue-detail-widgets/collapsibles.tsx
+++ b/apps/web/ce/components/issues/issue-detail-widgets/collapsibles.tsx
@@ -11,4 +11,6 @@ export type TWorkItemAdditionalWidgetCollapsiblesProps = {
   workspaceSlug: string;
 };
 
-export const WorkItemAdditionalWidgetCollapsibles: FC<TWorkItemAdditionalWidgetCollapsiblesProps> = () => null;
+export function WorkItemAdditionalWidgetCollapsibles(_props: TWorkItemAdditionalWidgetCollapsiblesProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/issues/issue-detail-widgets/modals.tsx b/apps/web/ce/components/issues/issue-detail-widgets/modals.tsx
index b478cf898..07327c44c 100644
--- a/apps/web/ce/components/issues/issue-detail-widgets/modals.tsx
+++ b/apps/web/ce/components/issues/issue-detail-widgets/modals.tsx
@@ -10,4 +10,6 @@ export type TWorkItemAdditionalWidgetModalsProps = {
   workspaceSlug: string;
 };
 
-export const WorkItemAdditionalWidgetModals: FC<TWorkItemAdditionalWidgetModalsProps> = () => null;
+export function WorkItemAdditionalWidgetModals(_props: TWorkItemAdditionalWidgetModalsProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/issues/issue-details/additional-activity-root.tsx b/apps/web/ce/components/issues/issue-details/additional-activity-root.tsx
index 448deabc8..f7da8c57f 100644
--- a/apps/web/ce/components/issues/issue-details/additional-activity-root.tsx
+++ b/apps/web/ce/components/issues/issue-details/additional-activity-root.tsx
@@ -10,4 +10,6 @@ export type TAdditionalActivityRoot = {
   field: string | undefined;
 };
 
-export const AdditionalActivityRoot: FC<TAdditionalActivityRoot> = observer(() => <></>);
+export const AdditionalActivityRoot = observer(function AdditionalActivityRoot(_props: TAdditionalActivityRoot) {
+  return <></>;
+});
diff --git a/apps/web/ce/components/issues/issue-details/additional-properties.tsx b/apps/web/ce/components/issues/issue-details/additional-properties.tsx
index 2e0a14707..69602593e 100644
--- a/apps/web/ce/components/issues/issue-details/additional-properties.tsx
+++ b/apps/web/ce/components/issues/issue-details/additional-properties.tsx
@@ -11,4 +11,6 @@ export type TWorkItemAdditionalSidebarProperties = {
   isPeekView?: boolean;
 };
 
-export const WorkItemAdditionalSidebarProperties: FC<TWorkItemAdditionalSidebarProperties> = () => <></>;
+export function WorkItemAdditionalSidebarProperties(_props: TWorkItemAdditionalSidebarProperties) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/issue-details/issue-creator.tsx b/apps/web/ce/components/issues/issue-details/issue-creator.tsx
index f3435e288..19c1fd20a 100644
--- a/apps/web/ce/components/issues/issue-details/issue-creator.tsx
+++ b/apps/web/ce/components/issues/issue-details/issue-creator.tsx
@@ -8,7 +8,7 @@ type TIssueUser = {
   customUserName?: string;
 };
 
-export const IssueCreatorDisplay: FC<TIssueUser> = (props) => {
+export function IssueCreatorDisplay(props: TIssueUser) {
   const { activityId, customUserName } = props;
   // hooks
   const {
@@ -33,4 +33,4 @@ export const IssueCreatorDisplay: FC<TIssueUser> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/apps/web/ce/components/issues/issue-details/issue-identifier.tsx b/apps/web/ce/components/issues/issue-details/issue-identifier.tsx
index d734ddb70..f6843015b 100644
--- a/apps/web/ce/components/issues/issue-details/issue-identifier.tsx
+++ b/apps/web/ce/components/issues/issue-details/issue-identifier.tsx
@@ -36,7 +36,9 @@ type TIssueTypeIdentifier = {
   size?: "xs" | "sm" | "md" | "lg";
 };
 
-export const IssueTypeIdentifier: FC<TIssueTypeIdentifier> = observer((_props) => <></>);
+export const IssueTypeIdentifier = observer(function IssueTypeIdentifier(_props: TIssueTypeIdentifier) {
+  return <></>;
+});
 
 type TIdentifierTextProps = {
   identifier: string;
@@ -44,7 +46,7 @@ type TIdentifierTextProps = {
   textContainerClassName?: string;
 };
 
-export const IdentifierText: React.FC<TIdentifierTextProps> = (props) => {
+export function IdentifierText(props: TIdentifierTextProps) {
   const { identifier, enableClickToCopyIdentifier = false, textContainerClassName } = props;
   // handlers
   const handleCopyIssueIdentifier = () => {
@@ -74,9 +76,9 @@ export const IdentifierText: React.FC<TIdentifierTextProps> = (props) => {
       </span>
     </Tooltip>
   );
-};
+}
 
-export const IssueIdentifier: React.FC<TIssueIdentifierProps> = observer((props) => {
+export const IssueIdentifier = observer(function IssueIdentifier(props: TIssueIdentifierProps) {
   const { projectId, textContainerClassName, displayProperties, enableClickToCopyIdentifier = false } = props;
   // store hooks
   const { getProjectIdentifierById } = useProject();
diff --git a/apps/web/ce/components/issues/issue-details/issue-properties-activity/root.tsx b/apps/web/ce/components/issues/issue-details/issue-properties-activity/root.tsx
index 6aeb6eda0..43ad4d3aa 100644
--- a/apps/web/ce/components/issues/issue-details/issue-properties-activity/root.tsx
+++ b/apps/web/ce/components/issues/issue-details/issue-properties-activity/root.tsx
@@ -5,4 +5,6 @@ type TIssueAdditionalPropertiesActivity = {
   ends: "top" | "bottom" | undefined;
 };
 
-export const IssueAdditionalPropertiesActivity: FC<TIssueAdditionalPropertiesActivity> = () => <></>;
+export function IssueAdditionalPropertiesActivity(_props: TIssueAdditionalPropertiesActivity) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/issue-details/issue-type-activity.tsx b/apps/web/ce/components/issues/issue-details/issue-type-activity.tsx
index 5796555ce..536885549 100644
--- a/apps/web/ce/components/issues/issue-details/issue-type-activity.tsx
+++ b/apps/web/ce/components/issues/issue-details/issue-type-activity.tsx
@@ -5,4 +5,6 @@ import { observer } from "mobx-react";
 
 export type TIssueTypeActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueTypeActivity: FC<TIssueTypeActivity> = observer(() => <></>);
+export const IssueTypeActivity = observer(function IssueTypeActivity(_props: TIssueTypeActivity) {
+  return <></>;
+});
diff --git a/apps/web/ce/components/issues/issue-details/issue-type-switcher.tsx b/apps/web/ce/components/issues/issue-details/issue-type-switcher.tsx
index 09245289f..b46ebe03d 100644
--- a/apps/web/ce/components/issues/issue-details/issue-type-switcher.tsx
+++ b/apps/web/ce/components/issues/issue-details/issue-type-switcher.tsx
@@ -9,7 +9,7 @@ export type TIssueTypeSwitcherProps = {
   disabled: boolean;
 };
 
-export const IssueTypeSwitcher: React.FC<TIssueTypeSwitcherProps> = observer((props) => {
+export const IssueTypeSwitcher = observer(function IssueTypeSwitcher(props: TIssueTypeSwitcherProps) {
   const { issueId } = props;
   // store hooks
   const {
diff --git a/apps/web/ce/components/issues/issue-details/parent-select-root.tsx b/apps/web/ce/components/issues/issue-details/parent-select-root.tsx
index 54ae11689..b673d3889 100644
--- a/apps/web/ce/components/issues/issue-details/parent-select-root.tsx
+++ b/apps/web/ce/components/issues/issue-details/parent-select-root.tsx
@@ -20,7 +20,7 @@ type TIssueParentSelect = {
   workspaceSlug: string;
 };
 
-export const IssueParentSelectRoot: React.FC<TIssueParentSelect> = observer((props) => {
+export const IssueParentSelectRoot = observer(function IssueParentSelectRoot(props: TIssueParentSelect) {
   const { issueId, issueOperations, projectId, workspaceSlug } = props;
   const { t } = useTranslation();
   // store hooks
diff --git a/apps/web/ce/components/issues/issue-details/sidebar.tsx/date-alert.tsx b/apps/web/ce/components/issues/issue-details/sidebar.tsx/date-alert.tsx
index 930d45949..a0f3afed4 100644
--- a/apps/web/ce/components/issues/issue-details/sidebar.tsx/date-alert.tsx
+++ b/apps/web/ce/components/issues/issue-details/sidebar.tsx/date-alert.tsx
@@ -6,4 +6,6 @@ export type TDateAlertProps = {
   projectId: string;
 };
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const DateAlert = (props: TDateAlertProps) => <></>;
+export function DateAlert(props: TDateAlertProps) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/issue-details/sidebar/transfer-hop-info.tsx b/apps/web/ce/components/issues/issue-details/sidebar/transfer-hop-info.tsx
index 581698e12..51f616680 100644
--- a/apps/web/ce/components/issues/issue-details/sidebar/transfer-hop-info.tsx
+++ b/apps/web/ce/components/issues/issue-details/sidebar/transfer-hop-info.tsx
@@ -1,3 +1,5 @@
 import type { TIssue } from "@plane/types";
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const TransferHopInfo = ({ workItem }: { workItem: TIssue }) => <></>;
+export function TransferHopInfo({ workItem }: { workItem: TIssue }) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/issue-layouts/additional-properties.tsx b/apps/web/ce/components/issues/issue-layouts/additional-properties.tsx
index 1c397c572..2d10001ee 100644
--- a/apps/web/ce/components/issues/issue-layouts/additional-properties.tsx
+++ b/apps/web/ce/components/issues/issue-layouts/additional-properties.tsx
@@ -7,4 +7,6 @@ export type TWorkItemLayoutAdditionalProperties = {
   issue: TIssue;
 };
 
-export const WorkItemLayoutAdditionalProperties: FC<TWorkItemLayoutAdditionalProperties> = (props) => <></>;
+export function WorkItemLayoutAdditionalProperties(props: TWorkItemLayoutAdditionalProperties) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/issue-layouts/empty-states/team-issues.tsx b/apps/web/ce/components/issues/issue-layouts/empty-states/team-issues.tsx
index 1e05f40cb..8f267503c 100644
--- a/apps/web/ce/components/issues/issue-layouts/empty-states/team-issues.tsx
+++ b/apps/web/ce/components/issues/issue-layouts/empty-states/team-issues.tsx
@@ -1,3 +1,5 @@
 import { observer } from "mobx-react";
 
-export const TeamEmptyState: React.FC = observer(() => <></>);
+export const TeamEmptyState = observer(function TeamEmptyState() {
+  return <></>;
+});
diff --git a/apps/web/ce/components/issues/issue-layouts/empty-states/team-project.tsx b/apps/web/ce/components/issues/issue-layouts/empty-states/team-project.tsx
index 95adbf9a0..ab15463a0 100644
--- a/apps/web/ce/components/issues/issue-layouts/empty-states/team-project.tsx
+++ b/apps/web/ce/components/issues/issue-layouts/empty-states/team-project.tsx
@@ -1,3 +1,5 @@
 import { observer } from "mobx-react";
 
-export const TeamProjectWorkItemEmptyState: React.FC = observer(() => <></>);
+export const TeamProjectWorkItemEmptyState = observer(function TeamProjectWorkItemEmptyState() {
+  return <></>;
+});
diff --git a/apps/web/ce/components/issues/issue-layouts/empty-states/team-view-issues.tsx b/apps/web/ce/components/issues/issue-layouts/empty-states/team-view-issues.tsx
index 03b546be5..c8e741243 100644
--- a/apps/web/ce/components/issues/issue-layouts/empty-states/team-view-issues.tsx
+++ b/apps/web/ce/components/issues/issue-layouts/empty-states/team-view-issues.tsx
@@ -1,3 +1,5 @@
 import { observer } from "mobx-react";
 
-export const TeamViewEmptyState: React.FC = observer(() => <></>);
+export const TeamViewEmptyState = observer(function TeamViewEmptyState() {
+  return <></>;
+});
diff --git a/apps/web/ce/components/issues/issue-layouts/issue-stats.tsx b/apps/web/ce/components/issues/issue-layouts/issue-stats.tsx
index b6e80910c..005783df3 100644
--- a/apps/web/ce/components/issues/issue-layouts/issue-stats.tsx
+++ b/apps/web/ce/components/issues/issue-layouts/issue-stats.tsx
@@ -11,4 +11,6 @@ type Props = {
   showLabel?: boolean;
 };
 
-export const IssueStats: FC<Props> = (props) => <></>;
+export function IssueStats(props: Props) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/issue-layouts/quick-action-dropdowns/duplicate-modal.tsx b/apps/web/ce/components/issues/issue-layouts/quick-action-dropdowns/duplicate-modal.tsx
index 761317a01..c186c77e3 100644
--- a/apps/web/ce/components/issues/issue-layouts/quick-action-dropdowns/duplicate-modal.tsx
+++ b/apps/web/ce/components/issues/issue-layouts/quick-action-dropdowns/duplicate-modal.tsx
@@ -8,4 +8,6 @@ type TDuplicateWorkItemModalProps = {
   projectId: string;
 };
 
-export const DuplicateWorkItemModal: FC<TDuplicateWorkItemModalProps> = () => <></>;
+export function DuplicateWorkItemModal(_props: TDuplicateWorkItemModalProps) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/issue-modal/issue-type-select.tsx b/apps/web/ce/components/issues/issue-modal/issue-type-select.tsx
index ab73750ed..2a02e1367 100644
--- a/apps/web/ce/components/issues/issue-modal/issue-type-select.tsx
+++ b/apps/web/ce/components/issues/issue-modal/issue-type-select.tsx
@@ -23,4 +23,6 @@ export type TIssueTypeSelectProps<T extends Partial<TIssueFields>> = {
 };
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const IssueTypeSelect = <T extends Partial<TIssueFields>>(props: TIssueTypeSelectProps<T>) => <></>;
+export function IssueTypeSelect<T extends Partial<TIssueFields>>(props: TIssueTypeSelectProps<T>) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/issue-modal/modal-additional-properties.tsx b/apps/web/ce/components/issues/issue-modal/modal-additional-properties.tsx
index 091d0c7ae..c0011d51a 100644
--- a/apps/web/ce/components/issues/issue-modal/modal-additional-properties.tsx
+++ b/apps/web/ce/components/issues/issue-modal/modal-additional-properties.tsx
@@ -7,4 +7,6 @@ export type TWorkItemModalAdditionalPropertiesProps = {
   workspaceSlug: string;
 };
 
-export const WorkItemModalAdditionalProperties: React.FC<TWorkItemModalAdditionalPropertiesProps> = () => null;
+export function WorkItemModalAdditionalProperties(_props: TWorkItemModalAdditionalPropertiesProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/issues/issue-modal/provider.tsx b/apps/web/ce/components/issues/issue-modal/provider.tsx
index bd623cdda..82763907f 100644
--- a/apps/web/ce/components/issues/issue-modal/provider.tsx
+++ b/apps/web/ce/components/issues/issue-modal/provider.tsx
@@ -14,7 +14,7 @@ export type TIssueModalProviderProps = {
   children: React.ReactNode;
 };
 
-export const IssueModalProvider = observer((props: TIssueModalProviderProps) => {
+export const IssueModalProvider = observer(function IssueModalProvider(props: TIssueModalProviderProps) {
   const { children, allowedProjectIds } = props;
   // states
   const [selectedParentIssue, setSelectedParentIssue] = useState<ISearchIssueResponse | null>(null);
diff --git a/apps/web/ce/components/issues/issue-modal/template-select.tsx b/apps/web/ce/components/issues/issue-modal/template-select.tsx
index 6d58bb33c..7cad3debb 100644
--- a/apps/web/ce/components/issues/issue-modal/template-select.tsx
+++ b/apps/web/ce/components/issues/issue-modal/template-select.tsx
@@ -13,4 +13,6 @@ export type TWorkItemTemplateSelect = {
 };
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const WorkItemTemplateSelect = (props: TWorkItemTemplateSelect) => <></>;
+export function WorkItemTemplateSelect(props: TWorkItemTemplateSelect) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/quick-add/root.tsx b/apps/web/ce/components/issues/quick-add/root.tsx
index e01d4bd21..4857d8bb1 100644
--- a/apps/web/ce/components/issues/quick-add/root.tsx
+++ b/apps/web/ce/components/issues/quick-add/root.tsx
@@ -34,7 +34,7 @@ export type TQuickAddIssueFormRoot = {
   isEpic: boolean;
 };
 
-export const QuickAddIssueFormRoot: FC<TQuickAddIssueFormRoot> = observer((props) => {
+export const QuickAddIssueFormRoot = observer(function QuickAddIssueFormRoot(props: TQuickAddIssueFormRoot) {
   const { isOpen, layout, projectId, hasError = false, setFocus, register, onSubmit, onClose, isEpic } = props;
   // store hooks
   const { getProjectById } = useProject();
diff --git a/apps/web/ce/components/issues/worklog/activity/filter-root.tsx b/apps/web/ce/components/issues/worklog/activity/filter-root.tsx
index cbc4607fb..cb0a3ba4f 100644
--- a/apps/web/ce/components/issues/worklog/activity/filter-root.tsx
+++ b/apps/web/ce/components/issues/worklog/activity/filter-root.tsx
@@ -14,7 +14,7 @@ export type TActivityFilterRoot = {
   isIntakeIssue?: boolean;
 };
 
-export const ActivityFilterRoot: FC<TActivityFilterRoot> = (props) => {
+export function ActivityFilterRoot(props: TActivityFilterRoot) {
   const { selectedFilters, toggleFilter } = props;
 
   const filters: TActivityFilterOption[] = Object.entries(ACTIVITY_FILTER_TYPE_OPTIONS).map(([key, value]) => {
@@ -28,4 +28,4 @@ export const ActivityFilterRoot: FC<TActivityFilterRoot> = (props) => {
   });
 
   return <ActivityFilter selectedFilters={selectedFilters} filterOptions={filters} />;
-};
+}
diff --git a/apps/web/ce/components/issues/worklog/activity/root.tsx b/apps/web/ce/components/issues/worklog/activity/root.tsx
index 42a0a28eb..5708ac19a 100644
--- a/apps/web/ce/components/issues/worklog/activity/root.tsx
+++ b/apps/web/ce/components/issues/worklog/activity/root.tsx
@@ -11,4 +11,6 @@ type TIssueActivityWorklog = {
   ends?: "top" | "bottom";
 };
 
-export const IssueActivityWorklog: FC<TIssueActivityWorklog> = () => <></>;
+export function IssueActivityWorklog(_props: TIssueActivityWorklog) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/worklog/activity/worklog-create-button.tsx b/apps/web/ce/components/issues/worklog/activity/worklog-create-button.tsx
index 17acfb2f4..c9a0098f0 100644
--- a/apps/web/ce/components/issues/worklog/activity/worklog-create-button.tsx
+++ b/apps/web/ce/components/issues/worklog/activity/worklog-create-button.tsx
@@ -9,4 +9,6 @@ type TIssueActivityWorklogCreateButton = {
   disabled: boolean;
 };
 
-export const IssueActivityWorklogCreateButton: FC<TIssueActivityWorklogCreateButton> = () => <></>;
+export function IssueActivityWorklogCreateButton(_props: TIssueActivityWorklogCreateButton) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/issues/worklog/property/root.tsx b/apps/web/ce/components/issues/worklog/property/root.tsx
index a0a4d2899..5692557dd 100644
--- a/apps/web/ce/components/issues/worklog/property/root.tsx
+++ b/apps/web/ce/components/issues/worklog/property/root.tsx
@@ -9,4 +9,6 @@ type TIssueWorklogProperty = {
   disabled: boolean;
 };
 
-export const IssueWorklogProperty: FC<TIssueWorklogProperty> = () => <></>;
+export function IssueWorklogProperty(_props: TIssueWorklogProperty) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/license/modal/upgrade-modal.tsx b/apps/web/ce/components/license/modal/upgrade-modal.tsx
index 5917fc764..584d8b6ab 100644
--- a/apps/web/ce/components/license/modal/upgrade-modal.tsx
+++ b/apps/web/ce/components/license/modal/upgrade-modal.tsx
@@ -28,7 +28,7 @@ export type PaidPlanUpgradeModalProps = {
   handleClose: () => void;
 };
 
-export const PaidPlanUpgradeModal: FC<PaidPlanUpgradeModalProps> = observer((props) => {
+export const PaidPlanUpgradeModal = observer(function PaidPlanUpgradeModal(props: PaidPlanUpgradeModalProps) {
   const { isOpen, handleClose } = props;
   // derived values
   const isSelfHosted = true;
diff --git a/apps/web/ce/components/pages/editor/ai/ask-pi-menu.tsx b/apps/web/ce/components/pages/editor/ai/ask-pi-menu.tsx
index adeab2da9..7e2e70a31 100644
--- a/apps/web/ce/components/pages/editor/ai/ask-pi-menu.tsx
+++ b/apps/web/ce/components/pages/editor/ai/ask-pi-menu.tsx
@@ -17,7 +17,7 @@ type Props = {
   workspaceSlug: string;
 };
 
-export const AskPiMenu: React.FC<Props> = (props) => {
+export function AskPiMenu(props: Props) {
   const { handleInsertText, handleRegenerate, isRegenerating, response, workspaceSlug } = props;
   // states
   const [query, setQuery] = useState("");
@@ -110,4 +110,4 @@ export const AskPiMenu: React.FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/web/ce/components/pages/editor/ai/menu.tsx b/apps/web/ce/components/pages/editor/ai/menu.tsx
index 033c8ff88..2088d0b77 100644
--- a/apps/web/ce/components/pages/editor/ai/menu.tsx
+++ b/apps/web/ce/components/pages/editor/ai/menu.tsx
@@ -60,7 +60,7 @@ const TONES_LIST = [
   },
 ];
 
-export const EditorAIMenu: React.FC<Props> = (props) => {
+export function EditorAIMenu(props: Props) {
   const { editorRef, isOpen, onClose, workspaceId, workspaceSlug } = props;
   // states
   const [activeTask, setActiveTask] = useState<AI_EDITOR_TASKS | null>(null);
@@ -302,4 +302,4 @@ export const EditorAIMenu: React.FC<Props> = (props) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx b/apps/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx
index bd61ceaa8..8f7b6f8b6 100644
--- a/apps/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx
+++ b/apps/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx
@@ -4,28 +4,30 @@ import { cn } from "@plane/utils";
 // components
 import { ProIcon } from "@/components/common/pro-icon";
 
-export const IssueEmbedUpgradeCard: React.FC<any> = (props) => (
-  <div
-    className={cn(
-      "w-full bg-custom-background-80 rounded-md border-[0.5px] border-custom-border-200 shadow-custom-shadow-2xs flex items-center justify-between gap-5 px-5 py-2 max-md:flex-wrap",
-      {
-        "border-2": props.selected,
-      }
-    )}
-  >
-    <div className="flex items-center gap-4">
-      <ProIcon className="flex-shrink-0 size-4" />
-      <p className="text-custom-text !text-base">
-        Embed and access issues in pages seamlessly, upgrade to Plane Pro now.
-      </p>
-    </div>
-    <a
-      href="https://plane.so/pro"
-      target="_blank"
-      rel="noopener noreferrer"
-      className={cn(getButtonStyling("primary", "md"), "no-underline")}
+export function IssueEmbedUpgradeCard(props: any) {
+  return (
+    <div
+      className={cn(
+        "w-full bg-custom-background-80 rounded-md border-[0.5px] border-custom-border-200 shadow-custom-shadow-2xs flex items-center justify-between gap-5 px-5 py-2 max-md:flex-wrap",
+        {
+          "border-2": props.selected,
+        }
+      )}
     >
-      Upgrade
-    </a>
-  </div>
-);
+      <div className="flex items-center gap-4">
+        <ProIcon className="flex-shrink-0 size-4" />
+        <p className="text-custom-text !text-base">
+          Embed and access issues in pages seamlessly, upgrade to Plane Pro now.
+        </p>
+      </div>
+      <a
+        href="https://plane.so/pro"
+        target="_blank"
+        rel="noopener noreferrer"
+        className={cn(getButtonStyling("primary", "md"), "no-underline")}
+      >
+        Upgrade
+      </a>
+    </div>
+  );
+}
diff --git a/apps/web/ce/components/pages/extra-actions.tsx b/apps/web/ce/components/pages/extra-actions.tsx
index 9e70d8d87..28ebe1537 100644
--- a/apps/web/ce/components/pages/extra-actions.tsx
+++ b/apps/web/ce/components/pages/extra-actions.tsx
@@ -7,4 +7,6 @@ export type TPageHeaderExtraActionsProps = {
   storeType: EPageStoreType;
 };
 
-export const PageDetailsHeaderExtraActions: React.FC<TPageHeaderExtraActionsProps> = () => null;
+export function PageDetailsHeaderExtraActions(_props: TPageHeaderExtraActionsProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/pages/header/collaborators-list.tsx b/apps/web/ce/components/pages/header/collaborators-list.tsx
index eefc533e9..f4e8f0bfd 100644
--- a/apps/web/ce/components/pages/header/collaborators-list.tsx
+++ b/apps/web/ce/components/pages/header/collaborators-list.tsx
@@ -7,4 +7,6 @@ export type TPageCollaboratorsListProps = {
   page: TPageInstance;
 };
 
-export const PageCollaboratorsList = ({}: TPageCollaboratorsListProps) => null;
+export function PageCollaboratorsList({}: TPageCollaboratorsListProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/pages/header/lock-control.tsx b/apps/web/ce/components/pages/header/lock-control.tsx
index 2403b6889..013f3eef9 100644
--- a/apps/web/ce/components/pages/header/lock-control.tsx
+++ b/apps/web/ce/components/pages/header/lock-control.tsx
@@ -20,7 +20,7 @@ type Props = {
   page: TPageInstance;
 };
 
-export const PageLockControl = observer(({ page }: Props) => {
+export const PageLockControl = observer(function PageLockControl({ page }: Props) {
   // Initial state: if locked, then "locked", otherwise default to "neutral"
   const [displayState, setDisplayState] = useState<LockDisplayState>(page.is_locked ? "locked" : "neutral");
   // derived values
diff --git a/apps/web/ce/components/pages/header/move-control.tsx b/apps/web/ce/components/pages/header/move-control.tsx
index 40376d7e3..c6aedfb34 100644
--- a/apps/web/ce/components/pages/header/move-control.tsx
+++ b/apps/web/ce/components/pages/header/move-control.tsx
@@ -7,4 +7,6 @@ export type TPageMoveControlProps = {
   page: TPageInstance;
 };
 
-export const PageMoveControl = ({}: TPageMoveControlProps) => null;
+export function PageMoveControl({}: TPageMoveControlProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/pages/header/share-control.tsx b/apps/web/ce/components/pages/header/share-control.tsx
index 4a79e0397..7e094adc3 100644
--- a/apps/web/ce/components/pages/header/share-control.tsx
+++ b/apps/web/ce/components/pages/header/share-control.tsx
@@ -9,4 +9,6 @@ export type TPageShareControlProps = {
   storeType: EPageStoreType;
 };
 
-export const PageShareControl = ({}: TPageShareControlProps) => null;
+export function PageShareControl({}: TPageShareControlProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/pages/modals/modals.tsx b/apps/web/ce/components/pages/modals/modals.tsx
index d47dbae32..da59eba89 100644
--- a/apps/web/ce/components/pages/modals/modals.tsx
+++ b/apps/web/ce/components/pages/modals/modals.tsx
@@ -12,4 +12,6 @@ export type TPageModalsProps = {
   storeType: EPageStoreType;
 };
 
-export const PageModals: React.FC<TPageModalsProps> = observer((props) => null);
+export const PageModals = observer(function PageModals(props: TPageModalsProps) {
+  return null;
+});
diff --git a/apps/web/ce/components/pages/modals/move-page-modal.tsx b/apps/web/ce/components/pages/modals/move-page-modal.tsx
index b8726a421..9abe0e4ec 100644
--- a/apps/web/ce/components/pages/modals/move-page-modal.tsx
+++ b/apps/web/ce/components/pages/modals/move-page-modal.tsx
@@ -7,4 +7,6 @@ export type TMovePageModalProps = {
   page: TPageInstance;
 };
 
-export const MovePageModal: React.FC<TMovePageModalProps> = () => null;
+export function MovePageModal(_props: TMovePageModalProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/pages/navigation-pane/tab-panels/assets.tsx b/apps/web/ce/components/pages/navigation-pane/tab-panels/assets.tsx
index 0e3cc49c7..45d606286 100644
--- a/apps/web/ce/components/pages/navigation-pane/tab-panels/assets.tsx
+++ b/apps/web/ce/components/pages/navigation-pane/tab-panels/assets.tsx
@@ -10,4 +10,6 @@ export type TAdditionalPageNavigationPaneAssetItemProps = {
   page: TPageInstance;
 };
 
-export const AdditionalPageNavigationPaneAssetItem: React.FC<TAdditionalPageNavigationPaneAssetItemProps> = () => null;
+export function AdditionalPageNavigationPaneAssetItem(_props: TAdditionalPageNavigationPaneAssetItemProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/assets.tsx b/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/assets.tsx
index b5f3fd83f..9754f1463 100644
--- a/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/assets.tsx
+++ b/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/assets.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from "@plane/i18n";
 import darkAssetsAsset from "@/app/assets/empty-state/wiki/navigation-pane/assets-dark.webp?url";
 import lightAssetsAsset from "@/app/assets/empty-state/wiki/navigation-pane/assets-light.webp?url";
 
-export const PageNavigationPaneAssetsTabEmptyState = () => {
+export function PageNavigationPaneAssetsTabEmptyState() {
   // theme hook
   const { resolvedTheme } = useTheme();
   // asset resolved path
@@ -30,4 +30,4 @@ export const PageNavigationPaneAssetsTabEmptyState = () => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx b/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx
index d53843571..43299c7e0 100644
--- a/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx
+++ b/apps/web/ce/components/pages/navigation-pane/tab-panels/empty-states/outline.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from "@plane/i18n";
 import darkOutlineAsset from "@/app/assets/empty-state/wiki/navigation-pane/outline-dark.webp?url";
 import lightOutlineAsset from "@/app/assets/empty-state/wiki/navigation-pane/outline-light.webp?url";
 
-export const PageNavigationPaneOutlineTabEmptyState = () => {
+export function PageNavigationPaneOutlineTabEmptyState() {
   // theme hook
   const { resolvedTheme } = useTheme();
   // asset resolved path
@@ -30,4 +30,4 @@ export const PageNavigationPaneOutlineTabEmptyState = () => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/ce/components/pages/navigation-pane/tab-panels/root.tsx b/apps/web/ce/components/pages/navigation-pane/tab-panels/root.tsx
index 1581b4948..a12d26be4 100644
--- a/apps/web/ce/components/pages/navigation-pane/tab-panels/root.tsx
+++ b/apps/web/ce/components/pages/navigation-pane/tab-panels/root.tsx
@@ -8,6 +8,6 @@ export type TPageNavigationPaneAdditionalTabPanelsRootProps = {
   page: TPageInstance;
 };
 
-export const PageNavigationPaneAdditionalTabPanelsRoot: React.FC<
-  TPageNavigationPaneAdditionalTabPanelsRootProps
-> = () => null;
+export function PageNavigationPaneAdditionalTabPanelsRoot(_props: TPageNavigationPaneAdditionalTabPanelsRootProps) {
+  return null;
+}
diff --git a/apps/web/ce/components/preferences/theme-switcher.tsx b/apps/web/ce/components/preferences/theme-switcher.tsx
index 0460fbcaf..8e3348f17 100644
--- a/apps/web/ce/components/preferences/theme-switcher.tsx
+++ b/apps/web/ce/components/preferences/theme-switcher.tsx
@@ -18,90 +18,88 @@ import { PreferencesSection } from "@/components/preferences/section";
 // hooks
 import { useUserProfile } from "@/hooks/store/user";
 
-export const ThemeSwitcher = observer(
-  (props: {
-    option: {
-      id: string;
-      title: string;
-      description: string;
-    };
-  }) => {
-    // hooks
-    const { setTheme } = useTheme();
-    const { data: userProfile, updateUserTheme } = useUserProfile();
+export const ThemeSwitcher = observer(function ThemeSwitcher(props: {
+  option: {
+    id: string;
+    title: string;
+    description: string;
+  };
+}) {
+  // hooks
+  const { setTheme } = useTheme();
+  const { data: userProfile, updateUserTheme } = useUserProfile();
 
-    // states
-    const [currentTheme, setCurrentTheme] = useState<I_THEME_OPTION | null>(null);
+  // states
+  const [currentTheme, setCurrentTheme] = useState<I_THEME_OPTION | null>(null);
 
-    const { t } = useTranslation();
+  const { t } = useTranslation();
 
-    // initialize theme
-    useEffect(() => {
-      if (!userProfile?.theme?.theme) return;
+  // initialize theme
+  useEffect(() => {
+    if (!userProfile?.theme?.theme) return;
 
-      const userThemeOption = THEME_OPTIONS.find((t) => t.value === userProfile.theme.theme);
+    const userThemeOption = THEME_OPTIONS.find((t) => t.value === userProfile.theme.theme);
 
-      if (userThemeOption) {
-        setCurrentTheme(userThemeOption);
+    if (userThemeOption) {
+      setCurrentTheme(userThemeOption);
+    }
+  }, [userProfile?.theme?.theme]);
+
+  // handlers
+  const applyThemeChange = useCallback(
+    (theme: Partial<IUserTheme>) => {
+      const themeValue = theme?.theme || "system";
+      setTheme(themeValue);
+
+      if (theme?.theme === "custom" && theme?.palette) {
+        const defaultPalette = "#0d101b,#c5c5c5,#3f76ff,#0d101b,#c5c5c5";
+        const palette = theme.palette !== ",,,," ? theme.palette : defaultPalette;
+        applyTheme(palette, false);
+      } else {
+        unsetCustomCssVariables();
       }
-    }, [userProfile?.theme?.theme]);
+    },
+    [setTheme]
+  );
 
-    // handlers
-    const applyThemeChange = useCallback(
-      (theme: Partial<IUserTheme>) => {
-        const themeValue = theme?.theme || "system";
-        setTheme(themeValue);
+  const handleThemeChange = useCallback(
+    async (themeOption: I_THEME_OPTION) => {
+      try {
+        applyThemeChange({ theme: themeOption.value });
 
-        if (theme?.theme === "custom" && theme?.palette) {
-          const defaultPalette = "#0d101b,#c5c5c5,#3f76ff,#0d101b,#c5c5c5";
-          const palette = theme.palette !== ",,,," ? theme.palette : defaultPalette;
-          applyTheme(palette, false);
-        } else {
-          unsetCustomCssVariables();
+        const updatePromise = updateUserTheme({ theme: themeOption.value });
+        setPromiseToast(updatePromise, {
+          loading: "Updating theme...",
+          success: {
+            title: "Success!",
+            message: () => "Theme updated successfully!",
+          },
+          error: {
+            title: "Error!",
+            message: () => "Failed to update the theme",
+          },
+        });
+      } catch (error) {
+        console.error("Error updating theme:", error);
+      }
+    },
+    [applyThemeChange, updateUserTheme]
+  );
+
+  if (!userProfile) return null;
+
+  return (
+    <>
+      <PreferencesSection
+        title={t(props.option.title)}
+        description={t(props.option.description)}
+        control={
+          <div className="">
+            <ThemeSwitch value={currentTheme} onChange={handleThemeChange} />
+          </div>
         }
-      },
-      [setTheme]
-    );
-
-    const handleThemeChange = useCallback(
-      async (themeOption: I_THEME_OPTION) => {
-        try {
-          applyThemeChange({ theme: themeOption.value });
-
-          const updatePromise = updateUserTheme({ theme: themeOption.value });
-          setPromiseToast(updatePromise, {
-            loading: "Updating theme...",
-            success: {
-              title: "Success!",
-              message: () => "Theme updated successfully!",
-            },
-            error: {
-              title: "Error!",
-              message: () => "Failed to update the theme",
-            },
-          });
-        } catch (error) {
-          console.error("Error updating theme:", error);
-        }
-      },
-      [applyThemeChange, updateUserTheme]
-    );
-
-    if (!userProfile) return null;
-
-    return (
-      <>
-        <PreferencesSection
-          title={t(props.option.title)}
-          description={t(props.option.description)}
-          control={
-            <div className="">
-              <ThemeSwitch value={currentTheme} onChange={handleThemeChange} />
-            </div>
-          }
-        />
-        {userProfile.theme?.theme === "custom" && <CustomThemeSelector applyThemeChange={applyThemeChange} />}
-      </>
-    );
-  }
-);
+      />
+      {userProfile.theme?.theme === "custom" && <CustomThemeSelector applyThemeChange={applyThemeChange} />}
+    </>
+  );
+});
diff --git a/apps/web/ce/components/projects/create/attributes.tsx b/apps/web/ce/components/projects/create/attributes.tsx
index e1119f052..013492087 100644
--- a/apps/web/ce/components/projects/create/attributes.tsx
+++ b/apps/web/ce/components/projects/create/attributes.tsx
@@ -15,7 +15,7 @@ type Props = {
   isMobile?: boolean;
 };
 
-const ProjectAttributes: FC<Props> = (props) => {
+function ProjectAttributes(props: Props) {
   const { isMobile = false } = props;
   const { t } = useTranslation();
   const { control } = useFormContext<IProject>();
@@ -89,6 +89,6 @@ const ProjectAttributes: FC<Props> = (props) => {
       />
     </div>
   );
-};
+}
 
 export default ProjectAttributes;
diff --git a/apps/web/ce/components/projects/create/root.tsx b/apps/web/ce/components/projects/create/root.tsx
index 27abe7aad..5363500c0 100644
--- a/apps/web/ce/components/projects/create/root.tsx
+++ b/apps/web/ce/components/projects/create/root.tsx
@@ -30,7 +30,7 @@ export type TCreateProjectFormProps = {
   updateCoverImageStatus: (projectId: string, coverImage: string) => Promise<void>;
 };
 
-export const CreateProjectForm: FC<TCreateProjectFormProps> = observer((props) => {
+export const CreateProjectForm = observer(function CreateProjectForm(props: TCreateProjectFormProps) {
   const { setToFavorite, workspaceSlug, data, onClose, handleNextStep, updateCoverImageStatus } = props;
   // store
   const { t } = useTranslation();
diff --git a/apps/web/ce/components/projects/create/template-select.tsx b/apps/web/ce/components/projects/create/template-select.tsx
index e304af835..b41232852 100644
--- a/apps/web/ce/components/projects/create/template-select.tsx
+++ b/apps/web/ce/components/projects/create/template-select.tsx
@@ -9,4 +9,6 @@ export type TProjectTemplateSelect = {
 };
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const ProjectTemplateSelect = (props: TProjectTemplateSelect) => <></>;
+export function ProjectTemplateSelect(props: TProjectTemplateSelect) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/projects/header.tsx b/apps/web/ce/components/projects/header.tsx
index 08871ec9b..39d46b4b8 100644
--- a/apps/web/ce/components/projects/header.tsx
+++ b/apps/web/ce/components/projects/header.tsx
@@ -2,4 +2,6 @@
 
 import { ProjectsBaseHeader } from "@/components/project/header";
 
-export const ProjectsListHeader = () => <ProjectsBaseHeader />;
+export function ProjectsListHeader() {
+  return <ProjectsBaseHeader />;
+}
diff --git a/apps/web/ce/components/projects/mobile-header.tsx b/apps/web/ce/components/projects/mobile-header.tsx
index 855ea2d8f..8f9b9e23b 100644
--- a/apps/web/ce/components/projects/mobile-header.tsx
+++ b/apps/web/ce/components/projects/mobile-header.tsx
@@ -16,7 +16,7 @@ import { ProjectOrderByDropdown } from "@/components/project/dropdowns/order-by"
 import { useMember } from "@/hooks/store/use-member";
 import { useProjectFilter } from "@/hooks/store/use-project-filter";
 
-export const ProjectsListMobileHeader = observer(() => {
+export const ProjectsListMobileHeader = observer(function ProjectsListMobileHeader() {
   // i18n
   const { t } = useTranslation();
   // router
diff --git a/apps/web/ce/components/projects/page.tsx b/apps/web/ce/components/projects/page.tsx
index 65151def4..ea7d2815c 100644
--- a/apps/web/ce/components/projects/page.tsx
+++ b/apps/web/ce/components/projects/page.tsx
@@ -9,7 +9,7 @@ import { ProjectRoot } from "@/components/project/root";
 import { useProject } from "@/hooks/store/use-project";
 import { useWorkspace } from "@/hooks/store/use-workspace";
 
-export const ProjectPageRoot = observer(() => {
+export const ProjectPageRoot = observer(function ProjectPageRoot() {
   // router
   const { workspaceSlug } = useParams();
   // store
diff --git a/apps/web/ce/components/projects/settings/intake/header.tsx b/apps/web/ce/components/projects/settings/intake/header.tsx
index 692eecd14..c00312267 100644
--- a/apps/web/ce/components/projects/settings/intake/header.tsx
+++ b/apps/web/ce/components/projects/settings/intake/header.tsx
@@ -19,7 +19,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 // plane web
 import { CommonProjectBreadcrumbs } from "@/plane-web/components/breadcrumbs/common";
 
-export const ProjectInboxHeader: FC = observer(() => {
+export const ProjectInboxHeader = observer(function ProjectInboxHeader() {
   // states
   const [createIssueModal, setCreateIssueModal] = useState(false);
   // router
diff --git a/apps/web/ce/components/projects/teamspaces/teamspace-list.tsx b/apps/web/ce/components/projects/teamspaces/teamspace-list.tsx
index 05d401c57..137e962ac 100644
--- a/apps/web/ce/components/projects/teamspaces/teamspace-list.tsx
+++ b/apps/web/ce/components/projects/teamspaces/teamspace-list.tsx
@@ -3,4 +3,6 @@ export type TProjectTeamspaceList = {
   projectId: string;
 };
 
-export const ProjectTeamspaceList: React.FC<TProjectTeamspaceList> = () => null;
+export function ProjectTeamspaceList(_props: TProjectTeamspaceList) {
+  return null;
+}
diff --git a/apps/web/ce/components/rich-filters/filter-value-input/root.tsx b/apps/web/ce/components/rich-filters/filter-value-input/root.tsx
index f2ef9aba4..ae7310846 100644
--- a/apps/web/ce/components/rich-filters/filter-value-input/root.tsx
+++ b/apps/web/ce/components/rich-filters/filter-value-input/root.tsx
@@ -5,11 +5,14 @@ import type { TFilterValue, TFilterProperty } from "@plane/types";
 // local imports
 import type { TFilterValueInputProps } from "@/components/rich-filters/shared";
 
-export const AdditionalFilterValueInput = observer(
-  <P extends TFilterProperty, V extends TFilterValue>(_props: TFilterValueInputProps<P, V>) => (
+export const AdditionalFilterValueInput = observer(function AdditionalFilterValueInput<
+  P extends TFilterProperty,
+  V extends TFilterValue,
+>(_props: TFilterValueInputProps<P, V>) {
+  return (
     // Fallback
     <div className="h-full flex items-center px-4 text-xs text-custom-text-400 transition-opacity duration-200 cursor-not-allowed">
       Filter type not supported
     </div>
-  )
-);
+  );
+});
diff --git a/apps/web/ce/components/sidebar/app-switcher.tsx b/apps/web/ce/components/sidebar/app-switcher.tsx
index 1344211b0..9bd2d21db 100644
--- a/apps/web/ce/components/sidebar/app-switcher.tsx
+++ b/apps/web/ce/components/sidebar/app-switcher.tsx
@@ -1 +1,3 @@
-export const SidebarAppSwitcher = () => null;
+export function SidebarAppSwitcher() {
+  return null;
+}
diff --git a/apps/web/ce/components/sidebar/project-navigation-root.tsx b/apps/web/ce/components/sidebar/project-navigation-root.tsx
index d4ca7bc32..6ee972d3e 100644
--- a/apps/web/ce/components/sidebar/project-navigation-root.tsx
+++ b/apps/web/ce/components/sidebar/project-navigation-root.tsx
@@ -9,7 +9,7 @@ type TProjectItemsRootProps = {
   projectId: string;
 };
 
-export const ProjectNavigationRoot: FC<TProjectItemsRootProps> = (props) => {
+export function ProjectNavigationRoot(props: TProjectItemsRootProps) {
   const { workspaceSlug, projectId } = props;
   return <ProjectNavigation workspaceSlug={workspaceSlug} projectId={projectId} />;
-};
+}
diff --git a/apps/web/ce/components/views/access-controller.tsx b/apps/web/ce/components/views/access-controller.tsx
index 8eefff027..56b59a021 100644
--- a/apps/web/ce/components/views/access-controller.tsx
+++ b/apps/web/ce/components/views/access-controller.tsx
@@ -1,2 +1,4 @@
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const AccessController = (props: any) => <></>;
+export function AccessController(props: any) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/views/filters/access-filter.tsx b/apps/web/ce/components/views/filters/access-filter.tsx
index 8c3232d47..ebc8c3ef8 100644
--- a/apps/web/ce/components/views/filters/access-filter.tsx
+++ b/apps/web/ce/components/views/filters/access-filter.tsx
@@ -1,2 +1,4 @@
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const FilterByAccess = (props: any) => <></>;
+export function FilterByAccess(props: any) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/views/helper.tsx b/apps/web/ce/components/views/helper.tsx
index d2932ddac..47a7d3594 100644
--- a/apps/web/ce/components/views/helper.tsx
+++ b/apps/web/ce/components/views/helper.tsx
@@ -10,9 +10,13 @@ export type TLayoutSelectionProps = {
   workspaceSlug: string;
 };
 
-export const GlobalViewLayoutSelection = (props: TLayoutSelectionProps) => <></>;
+export function GlobalViewLayoutSelection(props: TLayoutSelectionProps) {
+  return <></>;
+}
 
-export const WorkspaceAdditionalLayouts = (props: TWorkspaceLayoutProps) => <></>;
+export function WorkspaceAdditionalLayouts(props: TWorkspaceLayoutProps) {
+  return <></>;
+}
 
 export type TMenuItemsFactoryProps = {
   isOwner: boolean;
@@ -77,4 +81,6 @@ export const useViewMenuItems = (props: TMenuItemsFactoryProps): TContextMenuIte
 };
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const AdditionalHeaderItems = (view: IProjectView) => <></>;
+export function AdditionalHeaderItems(view: IProjectView) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/views/publish/modal.tsx b/apps/web/ce/components/views/publish/modal.tsx
index f92b3138d..036d0b114 100644
--- a/apps/web/ce/components/views/publish/modal.tsx
+++ b/apps/web/ce/components/views/publish/modal.tsx
@@ -9,4 +9,6 @@ type Props = {
 };
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const PublishViewModal = (props: Props) => <></>;
+export function PublishViewModal(props: Props) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/workflow/state-option.tsx b/apps/web/ce/components/workflow/state-option.tsx
index d9d911a9c..9516e00d5 100644
--- a/apps/web/ce/components/workflow/state-option.tsx
+++ b/apps/web/ce/components/workflow/state-option.tsx
@@ -16,7 +16,7 @@ export type TStateOptionProps = {
   alwaysAllowStateChange?: boolean;
 };
 
-export const StateOption = observer((props: TStateOptionProps) => {
+export const StateOption = observer(function StateOption(props: TStateOptionProps) {
   const { option, className = "" } = props;
 
   return (
diff --git a/apps/web/ce/components/workflow/workflow-disabled-message.tsx b/apps/web/ce/components/workflow/workflow-disabled-message.tsx
index af3489556..87f2c0408 100644
--- a/apps/web/ce/components/workflow/workflow-disabled-message.tsx
+++ b/apps/web/ce/components/workflow/workflow-disabled-message.tsx
@@ -4,4 +4,6 @@ type Props = {
   className?: string;
 };
 
-export const WorkFlowDisabledMessage = (props: Props) => <></>;
+export function WorkFlowDisabledMessage(props: Props) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/workflow/workflow-disabled-overlay.tsx b/apps/web/ce/components/workflow/workflow-disabled-overlay.tsx
index 5ec69f432..197a808a2 100644
--- a/apps/web/ce/components/workflow/workflow-disabled-overlay.tsx
+++ b/apps/web/ce/components/workflow/workflow-disabled-overlay.tsx
@@ -7,4 +7,6 @@ export type TWorkflowDisabledOverlayProps = {
 };
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const WorkFlowDisabledOverlay = observer((props: TWorkflowDisabledOverlayProps) => <></>);
+export const WorkFlowDisabledOverlay = observer(function WorkFlowDisabledOverlay(props: TWorkflowDisabledOverlayProps) {
+  return <></>;
+});
diff --git a/apps/web/ce/components/workflow/workflow-group-tree.tsx b/apps/web/ce/components/workflow/workflow-group-tree.tsx
index bc4cf9b1c..3f0e7300a 100644
--- a/apps/web/ce/components/workflow/workflow-group-tree.tsx
+++ b/apps/web/ce/components/workflow/workflow-group-tree.tsx
@@ -6,4 +6,6 @@ type Props = {
   groupId: string | undefined;
 };
 
-export const WorkFlowGroupTree = (props: Props) => <></>;
+export function WorkFlowGroupTree(props: Props) {
+  return <></>;
+}
diff --git a/apps/web/ce/components/workspace-notifications/list-root.tsx b/apps/web/ce/components/workspace-notifications/list-root.tsx
index 55fd68c3f..cad9c438b 100644
--- a/apps/web/ce/components/workspace-notifications/list-root.tsx
+++ b/apps/web/ce/components/workspace-notifications/list-root.tsx
@@ -5,4 +5,6 @@ export type TNotificationListRoot = {
   workspaceId: string;
 };
 
-export const NotificationListRoot = (props: TNotificationListRoot) => <NotificationCardListRoot {...props} />;
+export function NotificationListRoot(props: TNotificationListRoot) {
+  return <NotificationCardListRoot {...props} />;
+}
diff --git a/apps/web/ce/components/workspace-notifications/notification-card/root.tsx b/apps/web/ce/components/workspace-notifications/notification-card/root.tsx
index 214b0fb9c..37e132354 100644
--- a/apps/web/ce/components/workspace-notifications/notification-card/root.tsx
+++ b/apps/web/ce/components/workspace-notifications/notification-card/root.tsx
@@ -15,7 +15,7 @@ type TNotificationCardListRoot = {
   workspaceId: string;
 };
 
-export const NotificationCardListRoot: FC<TNotificationCardListRoot> = observer((props) => {
+export const NotificationCardListRoot = observer(function NotificationCardListRoot(props: TNotificationCardListRoot) {
   const { workspaceSlug, workspaceId } = props;
   // hooks
   const { loader, paginationInfo, getNotifications, notificationIdsByWorkspaceId } = useWorkspaceNotifications();
diff --git a/apps/web/ce/components/workspace/app-switcher.tsx b/apps/web/ce/components/workspace/app-switcher.tsx
index 8650d2a56..a40f3f027 100644
--- a/apps/web/ce/components/workspace/app-switcher.tsx
+++ b/apps/web/ce/components/workspace/app-switcher.tsx
@@ -2,4 +2,6 @@
 
 import React from "react";
 
-export const WorkspaceAppSwitcher = () => <></>;
+export function WorkspaceAppSwitcher() {
+  return <></>;
+}
diff --git a/apps/web/ce/components/workspace/billing/billing-actions-button.tsx b/apps/web/ce/components/workspace/billing/billing-actions-button.tsx
index b15d67b91..edfebb31a 100644
--- a/apps/web/ce/components/workspace/billing/billing-actions-button.tsx
+++ b/apps/web/ce/components/workspace/billing/billing-actions-button.tsx
@@ -7,4 +7,6 @@ export type TBillingActionsButtonProps = {
 };
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const BillingActionsButton = observer((props: TBillingActionsButtonProps) => <></>);
+export const BillingActionsButton = observer(function BillingActionsButton(props: TBillingActionsButtonProps) {
+  return <></>;
+});
diff --git a/apps/web/ce/components/workspace/billing/comparison/frequency-toggle.tsx b/apps/web/ce/components/workspace/billing/comparison/frequency-toggle.tsx
index 2993f3292..363621612 100644
--- a/apps/web/ce/components/workspace/billing/comparison/frequency-toggle.tsx
+++ b/apps/web/ce/components/workspace/billing/comparison/frequency-toggle.tsx
@@ -13,7 +13,7 @@ type TPlanFrequencyToggleProps = {
   setSelectedFrequency: (frequency: TBillingFrequency) => void;
 };
 
-export const PlanFrequencyToggle: FC<TPlanFrequencyToggleProps> = observer((props) => {
+export const PlanFrequencyToggle = observer(function PlanFrequencyToggle(props: TPlanFrequencyToggleProps) {
   const { subscriptionType, monthlyPrice, yearlyPrice, selectedFrequency, setSelectedFrequency } = props;
   // derived values
   const yearlyDiscount = calculateYearlyDiscount(monthlyPrice, yearlyPrice);
diff --git a/apps/web/ce/components/workspace/billing/comparison/plan-detail.tsx b/apps/web/ce/components/workspace/billing/comparison/plan-detail.tsx
index 03af2fa32..96e6d4c91 100644
--- a/apps/web/ce/components/workspace/billing/comparison/plan-detail.tsx
+++ b/apps/web/ce/components/workspace/billing/comparison/plan-detail.tsx
@@ -31,7 +31,7 @@ type TPlanDetailProps = {
 const COMMON_BUTTON_STYLE =
   "relative inline-flex items-center justify-center w-full px-4 py-1.5 text-xs font-medium rounded-lg focus:outline-none transition-all duration-300 animate-slide-up";
 
-export const PlanDetail: FC<TPlanDetailProps> = observer((props) => {
+export const PlanDetail = observer(function PlanDetail(props: TPlanDetailProps) {
   const { subscriptionType, planDetail, billingFrequency, setBillingFrequency } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/ce/components/workspace/billing/comparison/root.tsx b/apps/web/ce/components/workspace/billing/comparison/root.tsx
index 3c0958275..109667c21 100644
--- a/apps/web/ce/components/workspace/billing/comparison/root.tsx
+++ b/apps/web/ce/components/workspace/billing/comparison/root.tsx
@@ -15,7 +15,7 @@ type TPlansComparisonProps = {
   setIsCompareAllFeaturesSectionOpen: React.Dispatch<React.SetStateAction<boolean>>;
 };
 
-export const PlansComparison = observer((props: TPlansComparisonProps) => {
+export const PlansComparison = observer(function PlansComparison(props: TPlansComparisonProps) {
   const {
     isCompareAllFeaturesSectionOpen,
     getBillingFrequency,
diff --git a/apps/web/ce/components/workspace/billing/root.tsx b/apps/web/ce/components/workspace/billing/root.tsx
index e9ac6e189..085513cc7 100644
--- a/apps/web/ce/components/workspace/billing/root.tsx
+++ b/apps/web/ce/components/workspace/billing/root.tsx
@@ -12,7 +12,7 @@ import { SettingsHeading } from "@/components/settings/heading";
 // local imports
 import { PlansComparison } from "./comparison/root";
 
-export const BillingRoot = observer(() => {
+export const BillingRoot = observer(function BillingRoot() {
   const [isCompareAllFeaturesSectionOpen, setIsCompareAllFeaturesSectionOpen] = useState(false);
   const [productBillingFrequency, setProductBillingFrequency] = useState<TProductBillingFrequency>(
     DEFAULT_PRODUCT_BILLING_FREQUENCY
diff --git a/apps/web/ce/components/workspace/content-wrapper.tsx b/apps/web/ce/components/workspace/content-wrapper.tsx
index 79a74f56f..5d0b111b3 100644
--- a/apps/web/ce/components/workspace/content-wrapper.tsx
+++ b/apps/web/ce/components/workspace/content-wrapper.tsx
@@ -2,8 +2,14 @@
 import React from "react";
 import { observer } from "mobx-react";
 
-export const WorkspaceContentWrapper = observer(({ children }: { children: React.ReactNode }) => (
-  <div className="flex relative size-full overflow-hidden bg-custom-background-90 rounded-lg transition-all ease-in-out duration-300">
-    <div className="size-full p-2 flex-grow transition-all ease-in-out duration-300 overflow-hidden">{children}</div>
-  </div>
-));
+export const WorkspaceContentWrapper = observer(function WorkspaceContentWrapper({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <div className="flex relative size-full overflow-hidden bg-custom-background-90 rounded-lg transition-all ease-in-out duration-300">
+      <div className="size-full p-2 flex-grow transition-all ease-in-out duration-300 overflow-hidden">{children}</div>
+    </div>
+  );
+});
diff --git a/apps/web/ce/components/workspace/delete-workspace-modal.tsx b/apps/web/ce/components/workspace/delete-workspace-modal.tsx
index cccee781f..5d0892c2b 100644
--- a/apps/web/ce/components/workspace/delete-workspace-modal.tsx
+++ b/apps/web/ce/components/workspace/delete-workspace-modal.tsx
@@ -16,7 +16,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const DeleteWorkspaceModal: React.FC<Props> = observer((props) => {
+export const DeleteWorkspaceModal = observer(function DeleteWorkspaceModal(props: Props) {
   const { isOpen, data, onClose } = props;
 
   return (
diff --git a/apps/web/ce/components/workspace/delete-workspace-section.tsx b/apps/web/ce/components/workspace/delete-workspace-section.tsx
index a9975b8f5..d25025c28 100644
--- a/apps/web/ce/components/workspace/delete-workspace-section.tsx
+++ b/apps/web/ce/components/workspace/delete-workspace-section.tsx
@@ -16,7 +16,7 @@ type TDeleteWorkspace = {
   workspace: IWorkspace | null;
 };
 
-export const DeleteWorkspaceSection: FC<TDeleteWorkspace> = observer((props) => {
+export const DeleteWorkspaceSection = observer(function DeleteWorkspaceSection(props: TDeleteWorkspace) {
   const { workspace } = props;
   // states
   const [isOpen, setIsOpen] = useState(false);
diff --git a/apps/web/ce/components/workspace/edition-badge.tsx b/apps/web/ce/components/workspace/edition-badge.tsx
index bd846c932..0ca1116df 100644
--- a/apps/web/ce/components/workspace/edition-badge.tsx
+++ b/apps/web/ce/components/workspace/edition-badge.tsx
@@ -10,7 +10,7 @@ import packageJson from "package.json";
 // local components
 import { PaidPlanUpgradeModal } from "../license";
 
-export const WorkspaceEditionBadge = observer(() => {
+export const WorkspaceEditionBadge = observer(function WorkspaceEditionBadge() {
   // states
   const [isPaidPlanPurchaseModalOpen, setIsPaidPlanPurchaseModalOpen] = useState(false);
   // translation
diff --git a/apps/web/ce/components/workspace/members/invite-modal.tsx b/apps/web/ce/components/workspace/members/invite-modal.tsx
index f83234e21..65ec047ab 100644
--- a/apps/web/ce/components/workspace/members/invite-modal.tsx
+++ b/apps/web/ce/components/workspace/members/invite-modal.tsx
@@ -20,7 +20,9 @@ export type TSendWorkspaceInvitationModalProps = {
   onSubmit: (data: IWorkspaceBulkInviteFormData) => Promise<void> | undefined;
 };
 
-export const SendWorkspaceInvitationModal: React.FC<TSendWorkspaceInvitationModalProps> = observer((props) => {
+export const SendWorkspaceInvitationModal = observer(function SendWorkspaceInvitationModal(
+  props: TSendWorkspaceInvitationModalProps
+) {
   const { isOpen, onClose, onSubmit } = props;
   // store hooks
   const { t } = useTranslation();
diff --git a/apps/web/ce/components/workspace/sidebar/app-search.tsx b/apps/web/ce/components/workspace/sidebar/app-search.tsx
index 89d2607cf..54fe9528f 100644
--- a/apps/web/ce/components/workspace/sidebar/app-search.tsx
+++ b/apps/web/ce/components/workspace/sidebar/app-search.tsx
@@ -6,7 +6,7 @@ import { SidebarSearchButton } from "@/components/sidebar/search-button";
 // hooks
 import { usePowerK } from "@/hooks/store/use-power-k";
 
-export const AppSearch = observer(() => {
+export const AppSearch = observer(function AppSearch() {
   // store hooks
   const { togglePowerKModal } = usePowerK();
   // translation
diff --git a/apps/web/ce/components/workspace/sidebar/extended-sidebar-item.tsx b/apps/web/ce/components/workspace/sidebar/extended-sidebar-item.tsx
index 44b47c706..aae6baf6b 100644
--- a/apps/web/ce/components/workspace/sidebar/extended-sidebar-item.tsx
+++ b/apps/web/ce/components/workspace/sidebar/extended-sidebar-item.tsx
@@ -37,7 +37,7 @@ type TExtendedSidebarItemProps = {
   isLastChild: boolean;
 };
 
-export const ExtendedSidebarItem: FC<TExtendedSidebarItemProps> = observer((props) => {
+export const ExtendedSidebarItem = observer(function ExtendedSidebarItem(props: TExtendedSidebarItemProps) {
   const { item, handleOnNavigationItemDrop, disableDrag = false, disableDrop = false, isLastChild } = props;
   const { t } = useTranslation();
   // states
diff --git a/apps/web/ce/components/workspace/sidebar/sidebar-item.tsx b/apps/web/ce/components/workspace/sidebar/sidebar-item.tsx
index 3fbc8d0a2..b497cb458 100644
--- a/apps/web/ce/components/workspace/sidebar/sidebar-item.tsx
+++ b/apps/web/ce/components/workspace/sidebar/sidebar-item.tsx
@@ -6,4 +6,6 @@ type Props = {
   item: IWorkspaceSidebarNavigationItem;
 };
 
-export const SidebarItem: FC<Props> = ({ item }) => <SidebarItemBase item={item} />;
+export function SidebarItem({ item }: Props) {
+  return <SidebarItemBase item={item} />;
+}
diff --git a/apps/web/ce/components/workspace/sidebar/teams-sidebar-list.tsx b/apps/web/ce/components/workspace/sidebar/teams-sidebar-list.tsx
index 92cbdfc5f..fd8ca8be9 100644
--- a/apps/web/ce/components/workspace/sidebar/teams-sidebar-list.tsx
+++ b/apps/web/ce/components/workspace/sidebar/teams-sidebar-list.tsx
@@ -1 +1,3 @@
-export const SidebarTeamsList = () => null;
+export function SidebarTeamsList() {
+  return null;
+}
diff --git a/apps/web/ce/components/workspace/upgrade-badge.tsx b/apps/web/ce/components/workspace/upgrade-badge.tsx
index 17efeb015..cd267e464 100644
--- a/apps/web/ce/components/workspace/upgrade-badge.tsx
+++ b/apps/web/ce/components/workspace/upgrade-badge.tsx
@@ -8,7 +8,7 @@ type TUpgradeBadge = {
   size?: "sm" | "md";
 };
 
-export const UpgradeBadge: FC<TUpgradeBadge> = (props) => {
+export function UpgradeBadge(props: TUpgradeBadge) {
   const { className, size = "sm" } = props;
 
   const { t } = useTranslation();
@@ -27,4 +27,4 @@ export const UpgradeBadge: FC<TUpgradeBadge> = (props) => {
       {t("sidebar.pro")}
     </div>
   );
-};
+}
diff --git a/apps/web/ce/layouts/project-wrapper.tsx b/apps/web/ce/layouts/project-wrapper.tsx
index d2e2b1a99..73f596358 100644
--- a/apps/web/ce/layouts/project-wrapper.tsx
+++ b/apps/web/ce/layouts/project-wrapper.tsx
@@ -9,7 +9,7 @@ export type IProjectAuthWrapper = {
   children: React.ReactNode;
 };
 
-export const ProjectAuthWrapper: FC<IProjectAuthWrapper> = observer((props) => {
+export const ProjectAuthWrapper = observer(function ProjectAuthWrapper(props: IProjectAuthWrapper) {
   // props
   const { workspaceSlug, projectId, children } = props;
 
diff --git a/apps/web/ce/layouts/workspace-wrapper.tsx b/apps/web/ce/layouts/workspace-wrapper.tsx
index 47a272d63..1eaba348d 100644
--- a/apps/web/ce/layouts/workspace-wrapper.tsx
+++ b/apps/web/ce/layouts/workspace-wrapper.tsx
@@ -7,7 +7,7 @@ export type IWorkspaceAuthWrapper = {
   children: React.ReactNode;
 };
 
-export const WorkspaceAuthWrapper: FC<IWorkspaceAuthWrapper> = observer((props) => {
+export const WorkspaceAuthWrapper = observer(function WorkspaceAuthWrapper(props: IWorkspaceAuthWrapper) {
   // props
   const { children } = props;
 
diff --git a/apps/web/core/components/account/auth-forms/auth-banner.tsx b/apps/web/core/components/account/auth-forms/auth-banner.tsx
index 555d179af..01f531690 100644
--- a/apps/web/core/components/account/auth-forms/auth-banner.tsx
+++ b/apps/web/core/components/account/auth-forms/auth-banner.tsx
@@ -11,7 +11,7 @@ type TAuthBanner = {
   handleBannerData?: (bannerData: TAuthErrorInfo | undefined) => void;
 };
 
-export const AuthBanner: FC<TAuthBanner> = (props) => {
+export function AuthBanner(props: TAuthBanner) {
   const { bannerData, handleBannerData } = props;
   // translation
   const { t } = useTranslation();
@@ -37,4 +37,4 @@ export const AuthBanner: FC<TAuthBanner> = (props) => {
       </button>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/account/auth-forms/auth-header.tsx b/apps/web/core/components/account/auth-forms/auth-header.tsx
index 3ca9c38b6..c5cb9775d 100644
--- a/apps/web/core/components/account/auth-forms/auth-header.tsx
+++ b/apps/web/core/components/account/auth-forms/auth-header.tsx
@@ -52,7 +52,7 @@ const Titles = {
 
 const workSpaceService = new WorkspaceService();
 
-export const AuthHeader: FC<TAuthHeader> = observer((props) => {
+export const AuthHeader = observer(function AuthHeader(props: TAuthHeader) {
   const { workspaceSlug, invitationId, invitationEmail, authMode, currentAuthStep } = props;
   // plane imports
   const { t } = useTranslation();
diff --git a/apps/web/core/components/account/auth-forms/auth-root.tsx b/apps/web/core/components/account/auth-forms/auth-root.tsx
index 54122ae5b..bb7600310 100644
--- a/apps/web/core/components/account/auth-forms/auth-root.tsx
+++ b/apps/web/core/components/account/auth-forms/auth-root.tsx
@@ -32,7 +32,7 @@ type TAuthRoot = {
   authMode: EAuthModes;
 };
 
-export const AuthRoot: FC<TAuthRoot> = observer((props) => {
+export const AuthRoot = observer(function AuthRoot(props: TAuthRoot) {
   //router
   const searchParams = useSearchParams();
   // query params
diff --git a/apps/web/core/components/account/auth-forms/common/container.tsx b/apps/web/core/components/account/auth-forms/common/container.tsx
index ccdb3e52d..91e471b1a 100644
--- a/apps/web/core/components/account/auth-forms/common/container.tsx
+++ b/apps/web/core/components/account/auth-forms/common/container.tsx
@@ -1,7 +1,9 @@
 "use client";
 
-export const FormContainer = ({ children }: { children: React.ReactNode }) => (
-  <div className="flex flex-col justify-center items-center flex-grow w-full py-6 mt-10">
-    <div className="relative flex flex-col gap-6 max-w-[22.5rem] w-full">{children}</div>
-  </div>
-);
+export function FormContainer({ children }: { children: React.ReactNode }) {
+  return (
+    <div className="flex flex-col justify-center items-center flex-grow w-full py-6 mt-10">
+      <div className="relative flex flex-col gap-6 max-w-[22.5rem] w-full">{children}</div>
+    </div>
+  );
+}
diff --git a/apps/web/core/components/account/auth-forms/common/header.tsx b/apps/web/core/components/account/auth-forms/common/header.tsx
index b8da31ddf..338c3693e 100644
--- a/apps/web/core/components/account/auth-forms/common/header.tsx
+++ b/apps/web/core/components/account/auth-forms/common/header.tsx
@@ -1,8 +1,10 @@
 "use client";
 
-export const AuthFormHeader = ({ title, description }: { title: string; description: string }) => (
-  <div className="flex flex-col gap-1">
-    <span className="text-2xl font-semibold text-custom-text-100">{title}</span>
-    <span className="text-2xl font-semibold text-custom-text-400">{description}</span>
-  </div>
-);
+export function AuthFormHeader({ title, description }: { title: string; description: string }) {
+  return (
+    <div className="flex flex-col gap-1">
+      <span className="text-2xl font-semibold text-custom-text-100">{title}</span>
+      <span className="text-2xl font-semibold text-custom-text-400">{description}</span>
+    </div>
+  );
+}
diff --git a/apps/web/core/components/account/auth-forms/email.tsx b/apps/web/core/components/account/auth-forms/email.tsx
index 97a01dfba..0a98a5c9c 100644
--- a/apps/web/core/components/account/auth-forms/email.tsx
+++ b/apps/web/core/components/account/auth-forms/email.tsx
@@ -17,7 +17,7 @@ type TAuthEmailForm = {
   onSubmit: (data: IEmailCheckData) => Promise<void>;
 };
 
-export const AuthEmailForm: FC<TAuthEmailForm> = observer((props) => {
+export const AuthEmailForm = observer(function AuthEmailForm(props: TAuthEmailForm) {
   const { onSubmit, defaultEmail } = props;
   // states
   const [isSubmitting, setIsSubmitting] = useState(false);
diff --git a/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx b/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx
index 3e47dbe1c..bfbe82073 100644
--- a/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx
+++ b/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx
@@ -5,7 +5,7 @@ import { Popover } from "@headlessui/react";
 import { useTranslation } from "@plane/i18n";
 import { CloseIcon } from "@plane/propel/icons";
 
-export const ForgotPasswordPopover = () => {
+export function ForgotPasswordPopover() {
   // popper-js refs
   const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);
   const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);
@@ -58,4 +58,4 @@ export const ForgotPasswordPopover = () => {
       </Popover.Panel>
     </Popover>
   );
-};
+}
diff --git a/apps/web/core/components/account/auth-forms/forgot-password.tsx b/apps/web/core/components/account/auth-forms/forgot-password.tsx
index 018ff9514..5a557f2ab 100644
--- a/apps/web/core/components/account/auth-forms/forgot-password.tsx
+++ b/apps/web/core/components/account/auth-forms/forgot-password.tsx
@@ -34,7 +34,7 @@ const defaultValues: TForgotPasswordFormValues = {
 // services
 const authService = new AuthService();
 
-export const ForgotPasswordForm = observer(() => {
+export const ForgotPasswordForm = observer(function ForgotPasswordForm() {
   // search params
   const searchParams = useSearchParams();
   const email = searchParams.get("email");
diff --git a/apps/web/core/components/account/auth-forms/form-root.tsx b/apps/web/core/components/account/auth-forms/form-root.tsx
index 4edbcc045..a5964a255 100644
--- a/apps/web/core/components/account/auth-forms/form-root.tsx
+++ b/apps/web/core/components/account/auth-forms/form-root.tsx
@@ -31,7 +31,7 @@ type TAuthFormRoot = {
 
 const authService = new AuthService();
 
-export const AuthFormRoot = observer((props: TAuthFormRoot) => {
+export const AuthFormRoot = observer(function AuthFormRoot(props: TAuthFormRoot) {
   const { authStep, authMode, email, setEmail, setAuthMode, setAuthStep, setErrorInfo, currentAuthMode } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/account/auth-forms/password.tsx b/apps/web/core/components/account/auth-forms/password.tsx
index 5fb6a4276..da8981a0a 100644
--- a/apps/web/core/components/account/auth-forms/password.tsx
+++ b/apps/web/core/components/account/auth-forms/password.tsx
@@ -44,7 +44,7 @@ const defaultValues: TPasswordFormValues = {
 
 const authService = new AuthService();
 
-export const AuthPasswordForm: React.FC<Props> = observer((props: Props) => {
+export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props) {
   const { email, isSMTPConfigured, handleAuthStep, handleEmailClear, mode, nextPath } = props;
   // plane imports
   const { t } = useTranslation();
diff --git a/apps/web/core/components/account/auth-forms/reset-password.tsx b/apps/web/core/components/account/auth-forms/reset-password.tsx
index ffe40d7e6..71ea222f5 100644
--- a/apps/web/core/components/account/auth-forms/reset-password.tsx
+++ b/apps/web/core/components/account/auth-forms/reset-password.tsx
@@ -36,7 +36,7 @@ const defaultValues: TResetPasswordFormValues = {
 // services
 const authService = new AuthService();
 
-export const ResetPasswordForm = observer(() => {
+export const ResetPasswordForm = observer(function ResetPasswordForm() {
   // search params
   const searchParams = useSearchParams();
   const uidb64 = searchParams.get("uidb64");
diff --git a/apps/web/core/components/account/auth-forms/set-password.tsx b/apps/web/core/components/account/auth-forms/set-password.tsx
index a84ee913d..7d090bfcb 100644
--- a/apps/web/core/components/account/auth-forms/set-password.tsx
+++ b/apps/web/core/components/account/auth-forms/set-password.tsx
@@ -39,7 +39,7 @@ const defaultValues: TResetPasswordFormValues = {
 // services
 const authService = new AuthService();
 
-export const SetPasswordForm = observer(() => {
+export const SetPasswordForm = observer(function SetPasswordForm() {
   // router
   const router = useAppRouter();
   // search params
diff --git a/apps/web/core/components/account/auth-forms/unique-code.tsx b/apps/web/core/components/account/auth-forms/unique-code.tsx
index c009fdf17..dde4dd9e9 100644
--- a/apps/web/core/components/account/auth-forms/unique-code.tsx
+++ b/apps/web/core/components/account/auth-forms/unique-code.tsx
@@ -37,7 +37,7 @@ const defaultValues: TUniqueCodeFormValues = {
   code: "",
 };
 
-export const AuthUniqueCodeForm: React.FC<TAuthUniqueCodeForm> = (props) => {
+export function AuthUniqueCodeForm(props: TAuthUniqueCodeForm) {
   const { mode, email, handleEmailClear, generateEmailUniqueCode, isExistingEmail, nextPath } = props;
   // derived values
   const defaultResetTimerValue = 5;
@@ -205,4 +205,4 @@ export const AuthUniqueCodeForm: React.FC<TAuthUniqueCodeForm> = (props) => {
       </div>
     </form>
   );
-};
+}
diff --git a/apps/web/core/components/account/deactivate-account-modal.tsx b/apps/web/core/components/account/deactivate-account-modal.tsx
index 548434ddc..c757f08f6 100644
--- a/apps/web/core/components/account/deactivate-account-modal.tsx
+++ b/apps/web/core/components/account/deactivate-account-modal.tsx
@@ -18,7 +18,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const DeactivateAccountModal: React.FC<Props> = (props) => {
+export function DeactivateAccountModal(props: Props) {
   const router = useAppRouter();
   const { isOpen, onClose } = props;
   // hooks
@@ -125,4 +125,4 @@ export const DeactivateAccountModal: React.FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/account/terms-and-conditions.tsx b/apps/web/core/components/account/terms-and-conditions.tsx
index 64bb0fa2a..32cd3f38d 100644
--- a/apps/web/core/components/account/terms-and-conditions.tsx
+++ b/apps/web/core/components/account/terms-and-conditions.tsx
@@ -18,18 +18,22 @@ const MESSAGES = {
 } as const;
 
 // Reusable link component to reduce duplication
-const LegalLink: React.FC<{ href: string; children: React.ReactNode }> = ({ href, children }) => (
-  <Link href={href} className="text-custom-text-200" target="_blank" rel="noopener noreferrer">
-    <span className="text-sm font-medium underline hover:cursor-pointer">{children}</span>
-  </Link>
-);
+function LegalLink({ href, children }: { href: string; children: React.ReactNode }) {
+  return (
+    <Link href={href} className="text-custom-text-200" target="_blank" rel="noopener noreferrer">
+      <span className="text-sm font-medium underline hover:cursor-pointer">{children}</span>
+    </Link>
+  );
+}
 
-export const TermsAndConditions: React.FC<TermsAndConditionsProps> = ({ authType = EAuthModes.SIGN_IN }) => (
-  <div className="flex items-center justify-center">
-    <p className="text-center text-sm text-custom-text-300 whitespace-pre-line">
-      {`${MESSAGES[authType]}, you understand and agree to \n our `}
-      <LegalLink href={LEGAL_LINKS.termsOfService}>Terms of Service</LegalLink> and{" "}
-      <LegalLink href={LEGAL_LINKS.privacyPolicy}>Privacy Policy</LegalLink>.
-    </p>
-  </div>
-);
+export function TermsAndConditions({ authType = EAuthModes.SIGN_IN }: TermsAndConditionsProps) {
+  return (
+    <div className="flex items-center justify-center">
+      <p className="text-center text-sm text-custom-text-300 whitespace-pre-line">
+        {`${MESSAGES[authType]}, you understand and agree to \n our `}
+        <LegalLink href={LEGAL_LINKS.termsOfService}>Terms of Service</LegalLink> and{" "}
+        <LegalLink href={LEGAL_LINKS.privacyPolicy}>Privacy Policy</LegalLink>.
+      </p>
+    </div>
+  );
+}
diff --git a/apps/web/core/components/analytics/analytics-filter-actions.tsx b/apps/web/core/components/analytics/analytics-filter-actions.tsx
index e2ed91f88..dad42c0a0 100644
--- a/apps/web/core/components/analytics/analytics-filter-actions.tsx
+++ b/apps/web/core/components/analytics/analytics-filter-actions.tsx
@@ -7,7 +7,7 @@ import { useProject } from "@/hooks/store/use-project";
 import DurationDropdown from "./select/duration";
 import { ProjectSelect } from "./select/project";
 
-const AnalyticsFilterActions = observer(() => {
+const AnalyticsFilterActions = observer(function AnalyticsFilterActions() {
   const { selectedProjects, selectedDuration, updateSelectedProjects, updateSelectedDuration } = useAnalytics();
   const { joinedProjectIds } = useProject();
   return (
diff --git a/apps/web/core/components/analytics/analytics-section-wrapper.tsx b/apps/web/core/components/analytics/analytics-section-wrapper.tsx
index 2a3a17f6a..7811db503 100644
--- a/apps/web/core/components/analytics/analytics-section-wrapper.tsx
+++ b/apps/web/core/components/analytics/analytics-section-wrapper.tsx
@@ -9,7 +9,7 @@ type Props = {
   headerClassName?: string;
 };
 
-const AnalyticsSectionWrapper: React.FC<Props> = (props) => {
+function AnalyticsSectionWrapper(props: Props) {
   const { title, children, className, subtitle, actions, headerClassName } = props;
   return (
     <div className={className}>
@@ -25,6 +25,6 @@ const AnalyticsSectionWrapper: React.FC<Props> = (props) => {
       {children}
     </div>
   );
-};
+}
 
 export default AnalyticsSectionWrapper;
diff --git a/apps/web/core/components/analytics/analytics-wrapper.tsx b/apps/web/core/components/analytics/analytics-wrapper.tsx
index c86edb950..619b653a7 100644
--- a/apps/web/core/components/analytics/analytics-wrapper.tsx
+++ b/apps/web/core/components/analytics/analytics-wrapper.tsx
@@ -9,7 +9,7 @@ type Props = {
   className?: string;
 };
 
-const AnalyticsWrapper: React.FC<Props> = (props) => {
+function AnalyticsWrapper(props: Props) {
   const { i18nTitle, children, className } = props;
   const { t } = useTranslation();
   return (
@@ -18,6 +18,6 @@ const AnalyticsWrapper: React.FC<Props> = (props) => {
       {children}
     </div>
   );
-};
+}
 
 export default AnalyticsWrapper;
diff --git a/apps/web/core/components/analytics/empty-state.tsx b/apps/web/core/components/analytics/empty-state.tsx
index d2f0d2b43..e48712b5c 100644
--- a/apps/web/core/components/analytics/empty-state.tsx
+++ b/apps/web/core/components/analytics/empty-state.tsx
@@ -12,7 +12,7 @@ type Props = {
   className?: string;
 };
 
-const AnalyticsEmptyState = ({ title, description, assetPath, className }: Props) => {
+function AnalyticsEmptyState({ title, description, assetPath, className }: Props) {
   // theme hook
   const { resolvedTheme } = useTheme();
   const backgroundReolvedPath = resolvedTheme === "light" ? lightBackgroundAsset : darkBackgroundAsset;
@@ -40,5 +40,6 @@ const AnalyticsEmptyState = ({ title, description, assetPath, className }: Props
       </div>
     </div>
   );
-};
+}
+
 export default AnalyticsEmptyState;
diff --git a/apps/web/core/components/analytics/insight-card.tsx b/apps/web/core/components/analytics/insight-card.tsx
index 115cdd2c6..9cb718485 100644
--- a/apps/web/core/components/analytics/insight-card.tsx
+++ b/apps/web/core/components/analytics/insight-card.tsx
@@ -9,7 +9,7 @@ export type InsightCardProps = {
   isLoading?: boolean;
 };
 
-const InsightCard = (props: InsightCardProps) => {
+function InsightCard(props: InsightCardProps) {
   const { data, label, isLoading = false } = props;
   const count = data?.count ?? 0;
 
@@ -25,6 +25,6 @@ const InsightCard = (props: InsightCardProps) => {
       )}
     </div>
   );
-};
+}
 
 export default InsightCard;
diff --git a/apps/web/core/components/analytics/insight-table/loader.tsx b/apps/web/core/components/analytics/insight-table/loader.tsx
index 0ccff9a9b..ff7ea7a19 100644
--- a/apps/web/core/components/analytics/insight-table/loader.tsx
+++ b/apps/web/core/components/analytics/insight-table/loader.tsx
@@ -8,27 +8,29 @@ interface TableSkeletonProps {
   rows: number;
 }
 
-export const TableLoader: React.FC<TableSkeletonProps> = ({ columns, rows }) => (
-  <Table>
-    <TableHeader>
-      <TableRow>
-        {columns.map((column, index) => (
-          <TableHead key={column.header?.toString() ?? index}>
-            {typeof column.header === "string" ? column.header : ""}
-          </TableHead>
-        ))}
-      </TableRow>
-    </TableHeader>
-    <TableBody>
-      {Array.from({ length: rows }).map((_, rowIndex) => (
-        <TableRow key={rowIndex}>
-          {columns.map((_, colIndex) => (
-            <TableCell key={colIndex}>
-              <Loader.Item height="20px" width="100%" />
-            </TableCell>
+export function TableLoader({ columns, rows }: TableSkeletonProps) {
+  return (
+    <Table>
+      <TableHeader>
+        <TableRow>
+          {columns.map((column, index) => (
+            <TableHead key={column.header?.toString() ?? index}>
+              {typeof column.header === "string" ? column.header : ""}
+            </TableHead>
           ))}
         </TableRow>
-      ))}
-    </TableBody>
-  </Table>
-);
+      </TableHeader>
+      <TableBody>
+        {Array.from({ length: rows }).map((_, rowIndex) => (
+          <TableRow key={rowIndex}>
+            {columns.map((_, colIndex) => (
+              <TableCell key={colIndex}>
+                <Loader.Item height="20px" width="100%" />
+              </TableCell>
+            ))}
+          </TableRow>
+        ))}
+      </TableBody>
+    </Table>
+  );
+}
diff --git a/apps/web/core/components/analytics/insight-table/root.tsx b/apps/web/core/components/analytics/insight-table/root.tsx
index 465353496..7b924fcc0 100644
--- a/apps/web/core/components/analytics/insight-table/root.tsx
+++ b/apps/web/core/components/analytics/insight-table/root.tsx
@@ -15,9 +15,9 @@ interface InsightTableProps<T extends Exclude<TAnalyticsTabsBase, "overview">> {
   onExport?: (rows: Row<AnalyticsTableDataMap[T]>[]) => void;
 }
 
-export const InsightTable = <T extends Exclude<TAnalyticsTabsBase, "overview">>(
+export function InsightTable<T extends Exclude<TAnalyticsTabsBase, "overview">>(
   props: InsightTableProps<T>
-): React.ReactElement => {
+): React.ReactElement {
   const { data, isLoading, columns, headerText, onExport } = props;
   const { t } = useTranslation();
   if (isLoading) {
@@ -42,4 +42,4 @@ export const InsightTable = <T extends Exclude<TAnalyticsTabsBase, "overview">>(
       />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/analytics/loaders.tsx b/apps/web/core/components/analytics/loaders.tsx
index e35d235ce..cd9f19f22 100644
--- a/apps/web/core/components/analytics/loaders.tsx
+++ b/apps/web/core/components/analytics/loaders.tsx
@@ -1,23 +1,27 @@
 import { Loader } from "@plane/ui";
 
-export const ProjectInsightsLoader = () => (
-  <div className="flex h-[200px] gap-1">
-    <Loader className="h-full w-full">
-      <Loader.Item height="100%" width="100%" />
-    </Loader>
-    <div className="flex h-full w-full flex-col gap-1">
-      <Loader className="h-12 w-full">
-        <Loader.Item height="100%" width="100%" />
-      </Loader>
+export function ProjectInsightsLoader() {
+  return (
+    <div className="flex h-[200px] gap-1">
       <Loader className="h-full w-full">
         <Loader.Item height="100%" width="100%" />
       </Loader>
+      <div className="flex h-full w-full flex-col gap-1">
+        <Loader className="h-12 w-full">
+          <Loader.Item height="100%" width="100%" />
+        </Loader>
+        <Loader className="h-full w-full">
+          <Loader.Item height="100%" width="100%" />
+        </Loader>
+      </div>
     </div>
-  </div>
-);
+  );
+}
 
-export const ChartLoader = () => (
-  <Loader className="h-[350px] w-full">
-    <Loader.Item height="100%" width="100%" />
-  </Loader>
-);
+export function ChartLoader() {
+  return (
+    <Loader className="h-[350px] w-full">
+      <Loader.Item height="100%" width="100%" />
+    </Loader>
+  );
+}
diff --git a/apps/web/core/components/analytics/overview/active-project-item.tsx b/apps/web/core/components/analytics/overview/active-project-item.tsx
index 4737a8d81..e579f8de5 100644
--- a/apps/web/core/components/analytics/overview/active-project-item.tsx
+++ b/apps/web/core/components/analytics/overview/active-project-item.tsx
@@ -13,16 +13,17 @@ type Props = {
   };
   isLoading?: boolean;
 };
-const CompletionPercentage = ({ percentage }: { percentage: number }) => {
+
+function CompletionPercentage({ percentage }: { percentage: number }) {
   const percentageColor = percentage > 50 ? "bg-green-500/30 text-green-500" : "bg-red-500/30 text-red-500";
   return (
     <div className={cn("flex items-center gap-2 rounded p-1 text-xs", percentageColor)}>
       <span>{percentage}%</span>
     </div>
   );
-};
+}
 
-const ActiveProjectItem = (props: Props) => {
+function ActiveProjectItem(props: Props) {
   const { project } = props;
   const { getProjectById } = useProject();
   const { id, completed_issues, total_issues } = project;
@@ -52,6 +53,6 @@ const ActiveProjectItem = (props: Props) => {
       />
     </div>
   );
-};
+}
 
 export default ActiveProjectItem;
diff --git a/apps/web/core/components/analytics/overview/active-projects.tsx b/apps/web/core/components/analytics/overview/active-projects.tsx
index 3c7016d1d..7796f0793 100644
--- a/apps/web/core/components/analytics/overview/active-projects.tsx
+++ b/apps/web/core/components/analytics/overview/active-projects.tsx
@@ -12,7 +12,7 @@ import { useProject } from "@/hooks/store/use-project";
 import AnalyticsSectionWrapper from "../analytics-section-wrapper";
 import ActiveProjectItem from "./active-project-item";
 
-const ActiveProjects = observer(() => {
+const ActiveProjects = observer(function ActiveProjects() {
   const { t } = useTranslation();
   const { fetchProjectAnalyticsCount } = useProject();
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/analytics/overview/project-insights.tsx b/apps/web/core/components/analytics/overview/project-insights.tsx
index 56a87b5be..297a113f1 100644
--- a/apps/web/core/components/analytics/overview/project-insights.tsx
+++ b/apps/web/core/components/analytics/overview/project-insights.tsx
@@ -14,15 +14,15 @@ import { AnalyticsService } from "@/services/analytics.service";
 import AnalyticsSectionWrapper from "../analytics-section-wrapper";
 import { ProjectInsightsLoader } from "../loaders";
 
-const RadarChart = lazy(() =>
-  import("@plane/propel/charts/radar-chart").then((mod) => ({
+const RadarChart = lazy(function RadarChart() {
+  return import("@plane/propel/charts/radar-chart").then((mod) => ({
     default: mod.RadarChart,
-  }))
-);
+  }));
+});
 
 const analyticsService = new AnalyticsService();
 
-const ProjectInsights = observer(() => {
+const ProjectInsights = observer(function ProjectInsights() {
   const params = useParams();
   const { t } = useTranslation();
   const workspaceSlug = params.workspaceSlug.toString();
diff --git a/apps/web/core/components/analytics/overview/root.tsx b/apps/web/core/components/analytics/overview/root.tsx
index b10bf32de..7ebb4ed07 100644
--- a/apps/web/core/components/analytics/overview/root.tsx
+++ b/apps/web/core/components/analytics/overview/root.tsx
@@ -4,16 +4,18 @@ import TotalInsights from "../total-insights";
 import ActiveProjects from "./active-projects";
 import ProjectInsights from "./project-insights";
 
-const Overview: React.FC = () => (
-  <AnalyticsWrapper i18nTitle="common.overview">
-    <div className="flex flex-col gap-14">
-      <TotalInsights analyticsType="overview" />
-      <div className="grid grid-cols-1 gap-14 md:grid-cols-5 ">
-        <ProjectInsights />
-        <ActiveProjects />
+function Overview() {
+  return (
+    <AnalyticsWrapper i18nTitle="common.overview">
+      <div className="flex flex-col gap-14">
+        <TotalInsights analyticsType="overview" />
+        <div className="grid grid-cols-1 gap-14 md:grid-cols-5 ">
+          <ProjectInsights />
+          <ActiveProjects />
+        </div>
       </div>
-    </div>
-  </AnalyticsWrapper>
-);
+    </AnalyticsWrapper>
+  );
+}
 
 export { Overview };
diff --git a/apps/web/core/components/analytics/select/analytics-params.tsx b/apps/web/core/components/analytics/select/analytics-params.tsx
index 5e9535da2..957ea2aee 100644
--- a/apps/web/core/components/analytics/select/analytics-params.tsx
+++ b/apps/web/core/components/analytics/select/analytics-params.tsx
@@ -21,7 +21,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const AnalyticsSelectParams: React.FC<Props> = observer((props) => {
+export const AnalyticsSelectParams = observer(function AnalyticsSelectParams(props: Props) {
   const { control, params, classNames, isEpic } = props;
   const xAxisOptions = useMemo(
     () => ANALYTICS_X_AXIS_VALUES.filter((option) => option.value !== params.group_by),
diff --git a/apps/web/core/components/analytics/select/project.tsx b/apps/web/core/components/analytics/select/project.tsx
index b2f77d4ca..a1f46c53e 100644
--- a/apps/web/core/components/analytics/select/project.tsx
+++ b/apps/web/core/components/analytics/select/project.tsx
@@ -14,7 +14,7 @@ type Props = {
   projectIds: string[] | undefined;
 };
 
-export const ProjectSelect: React.FC<Props> = observer((props) => {
+export const ProjectSelect = observer(function ProjectSelect(props: Props) {
   const { value, onChange, projectIds } = props;
   const { getProjectById } = useProject();
 
diff --git a/apps/web/core/components/analytics/select/select-x-axis.tsx b/apps/web/core/components/analytics/select/select-x-axis.tsx
index 041fc8fee..4dc282289 100644
--- a/apps/web/core/components/analytics/select/select-x-axis.tsx
+++ b/apps/web/core/components/analytics/select/select-x-axis.tsx
@@ -13,7 +13,7 @@ type Props = {
   label?: string | React.ReactNode;
 };
 
-export const SelectXAxis: React.FC<Props> = (props) => {
+export function SelectXAxis(props: Props) {
   const { value, onChange, options, hiddenOptions, allowNoValue, label } = props;
   return (
     <CustomSelect value={value} label={label} onChange={onChange} maxHeight="lg">
@@ -28,4 +28,4 @@ export const SelectXAxis: React.FC<Props> = (props) => {
       })}
     </CustomSelect>
   );
-};
+}
diff --git a/apps/web/core/components/analytics/select/select-y-axis.tsx b/apps/web/core/components/analytics/select/select-y-axis.tsx
index 2295f0632..e526ac539 100644
--- a/apps/web/core/components/analytics/select/select-y-axis.tsx
+++ b/apps/web/core/components/analytics/select/select-y-axis.tsx
@@ -17,7 +17,7 @@ type Props = {
   options: { value: ChartYAxisMetric; label: string }[];
 };
 
-export const SelectYAxis: React.FC<Props> = observer(({ value, onChange, hiddenOptions, options }) => {
+export const SelectYAxis = observer(function SelectYAxis({ value, onChange, hiddenOptions, options }: Props) {
   // hooks
   const { projectId } = useParams();
   const { areEstimateEnabledByProjectId, currentActiveEstimateId, estimateById } = useProjectEstimates();
diff --git a/apps/web/core/components/analytics/total-insights.tsx b/apps/web/core/components/analytics/total-insights.tsx
index 5dfc6bb99..8dd996cd4 100644
--- a/apps/web/core/components/analytics/total-insights.tsx
+++ b/apps/web/core/components/analytics/total-insights.tsx
@@ -44,10 +44,13 @@ const getInsightLabel = (
   return `${prefix}${baseTranslation}${suffix}`;
 };
 
-const TotalInsights: React.FC<{
+const TotalInsights = observer(function TotalInsights({
+  analyticsType,
+  peekView,
+}: {
   analyticsType: TAnalyticsTabsBase;
   peekView?: boolean;
-}> = observer(({ analyticsType, peekView }) => {
+}) {
   const params = useParams();
   const workspaceSlug = params.workspaceSlug.toString();
   const { t } = useTranslation();
diff --git a/apps/web/core/components/analytics/trend-piece.tsx b/apps/web/core/components/analytics/trend-piece.tsx
index 60062222a..f55a72f12 100644
--- a/apps/web/core/components/analytics/trend-piece.tsx
+++ b/apps/web/core/components/analytics/trend-piece.tsx
@@ -49,7 +49,7 @@ const variants: Record<NonNullable<Props["variant"]>, Record<"ontrack" | "offtra
   },
 } as const;
 
-const TrendPiece = (props: Props) => {
+function TrendPiece(props: Props) {
   const { percentage, className, trendIconVisible = true, size = "sm", variant = "simple" } = props;
   const isOnTrack = percentage >= 66;
   const isOffTrack = percentage >= 33 && percentage < 66;
@@ -75,6 +75,6 @@ const TrendPiece = (props: Props) => {
       {Math.round(Math.abs(percentage))}%
     </div>
   );
-};
+}
 
 export default TrendPiece;
diff --git a/apps/web/core/components/analytics/work-items/created-vs-resolved.tsx b/apps/web/core/components/analytics/work-items/created-vs-resolved.tsx
index f92c42d04..690218e60 100644
--- a/apps/web/core/components/analytics/work-items/created-vs-resolved.tsx
+++ b/apps/web/core/components/analytics/work-items/created-vs-resolved.tsx
@@ -17,7 +17,7 @@ import AnalyticsSectionWrapper from "../analytics-section-wrapper";
 import { ChartLoader } from "../loaders";
 
 const analyticsService = new AnalyticsService();
-const CreatedVsResolved = observer(() => {
+const CreatedVsResolved = observer(function CreatedVsResolved() {
   const {
     selectedDuration,
     selectedDurationLabel,
diff --git a/apps/web/core/components/analytics/work-items/customized-insights.tsx b/apps/web/core/components/analytics/work-items/customized-insights.tsx
index 22c698b0c..6e8590fd5 100644
--- a/apps/web/core/components/analytics/work-items/customized-insights.tsx
+++ b/apps/web/core/components/analytics/work-items/customized-insights.tsx
@@ -11,7 +11,13 @@ import AnalyticsSectionWrapper from "../analytics-section-wrapper";
 import { AnalyticsSelectParams } from "../select/analytics-params";
 import PriorityChart from "./priority-chart";
 
-const CustomizedInsights = observer(({ peekView, isEpic }: { peekView?: boolean; isEpic?: boolean }) => {
+const CustomizedInsights = observer(function CustomizedInsights({
+  peekView,
+  isEpic,
+}: {
+  peekView?: boolean;
+  isEpic?: boolean;
+}) {
   const { t } = useTranslation();
   const { workspaceSlug } = useParams();
   const { control, watch, setValue } = useForm<IAnalyticsParams>({
diff --git a/apps/web/core/components/analytics/work-items/modal/content.tsx b/apps/web/core/components/analytics/work-items/modal/content.tsx
index d13de2a78..082b9266d 100644
--- a/apps/web/core/components/analytics/work-items/modal/content.tsx
+++ b/apps/web/core/components/analytics/work-items/modal/content.tsx
@@ -20,7 +20,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const WorkItemsModalMainContent: React.FC<Props> = observer((props) => {
+export const WorkItemsModalMainContent = observer(function WorkItemsModalMainContent(props: Props) {
   const { projectDetails, cycleDetails, moduleDetails, fullScreen, isEpic } = props;
   const { updateSelectedProjects, updateSelectedCycle, updateSelectedModule, updateIsPeekView } = useAnalytics();
   const [isModalConfigured, setIsModalConfigured] = useState(false);
diff --git a/apps/web/core/components/analytics/work-items/modal/header.tsx b/apps/web/core/components/analytics/work-items/modal/header.tsx
index 22f1a14c3..f0ec91342 100644
--- a/apps/web/core/components/analytics/work-items/modal/header.tsx
+++ b/apps/web/core/components/analytics/work-items/modal/header.tsx
@@ -14,7 +14,7 @@ type Props = {
   module?: IModule;
 };
 
-export const WorkItemsModalHeader: React.FC<Props> = observer((props) => {
+export const WorkItemsModalHeader = observer(function WorkItemsModalHeader(props: Props) {
   const { fullScreen, handleClose, setFullScreen, title, cycle, module } = props;
 
   return (
diff --git a/apps/web/core/components/analytics/work-items/modal/index.tsx b/apps/web/core/components/analytics/work-items/modal/index.tsx
index 129dd5f5e..0b57d50e8 100644
--- a/apps/web/core/components/analytics/work-items/modal/index.tsx
+++ b/apps/web/core/components/analytics/work-items/modal/index.tsx
@@ -17,7 +17,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const WorkItemsModal: React.FC<Props> = observer((props) => {
+export const WorkItemsModal = observer(function WorkItemsModal(props: Props) {
   const { isOpen, onClose, projectDetails, moduleDetails, cycleDetails, isEpic } = props;
   const { updateIsEpic, isPeekView } = useAnalytics();
   const [fullScreen, setFullScreen] = useState(false);
diff --git a/apps/web/core/components/analytics/work-items/priority-chart.tsx b/apps/web/core/components/analytics/work-items/priority-chart.tsx
index 4fb0304d6..b7d4ba222 100644
--- a/apps/web/core/components/analytics/work-items/priority-chart.tsx
+++ b/apps/web/core/components/analytics/work-items/priority-chart.tsx
@@ -42,7 +42,7 @@ interface Props {
 }
 
 const analyticsService = new AnalyticsService();
-const PriorityChart = observer((props: Props) => {
+const PriorityChart = observer(function PriorityChart(props: Props) {
   const { x_axis, y_axis, group_by } = props;
   const { t } = useTranslation();
   // store hooks
diff --git a/apps/web/core/components/analytics/work-items/root.tsx b/apps/web/core/components/analytics/work-items/root.tsx
index c30a36d59..94ddfbace 100644
--- a/apps/web/core/components/analytics/work-items/root.tsx
+++ b/apps/web/core/components/analytics/work-items/root.tsx
@@ -5,15 +5,17 @@ import CreatedVsResolved from "./created-vs-resolved";
 import CustomizedInsights from "./customized-insights";
 import WorkItemsInsightTable from "./workitems-insight-table";
 
-const WorkItems: React.FC = () => (
-  <AnalyticsWrapper i18nTitle="sidebar.work_items">
-    <div className="flex flex-col gap-14">
-      <TotalInsights analyticsType="work-items" />
-      <CreatedVsResolved />
-      <CustomizedInsights />
-      <WorkItemsInsightTable />
-    </div>
-  </AnalyticsWrapper>
-);
+function WorkItems() {
+  return (
+    <AnalyticsWrapper i18nTitle="sidebar.work_items">
+      <div className="flex flex-col gap-14">
+        <TotalInsights analyticsType="work-items" />
+        <CreatedVsResolved />
+        <CustomizedInsights />
+        <WorkItemsInsightTable />
+      </div>
+    </AnalyticsWrapper>
+  );
+}
 
 export { WorkItems };
diff --git a/apps/web/core/components/analytics/work-items/workitems-insight-table.tsx b/apps/web/core/components/analytics/work-items/workitems-insight-table.tsx
index 5de027268..347c2e5f4 100644
--- a/apps/web/core/components/analytics/work-items/workitems-insight-table.tsx
+++ b/apps/web/core/components/analytics/work-items/workitems-insight-table.tsx
@@ -32,7 +32,7 @@ declare module "@tanstack/react-table" {
   }
 }
 
-const WorkItemsInsightTable = observer(() => {
+const WorkItemsInsightTable = observer(function WorkItemsInsightTable() {
   // router
   const params = useParams();
   const workspaceSlug = params.workspaceSlug.toString();
diff --git a/apps/web/core/components/api-token/delete-token-modal.tsx b/apps/web/core/components/api-token/delete-token-modal.tsx
index 22b5f5dd6..a452aaad6 100644
--- a/apps/web/core/components/api-token/delete-token-modal.tsx
+++ b/apps/web/core/components/api-token/delete-token-modal.tsx
@@ -23,7 +23,7 @@ type Props = {
 
 const apiTokenService = new APITokenService();
 
-export const DeleteApiTokenModal: FC<Props> = (props) => {
+export function DeleteApiTokenModal(props: Props) {
   const { isOpen, onClose, tokenId } = props;
   // states
   const [deleteLoading, setDeleteLoading] = useState<boolean>(false);
@@ -90,4 +90,4 @@ export const DeleteApiTokenModal: FC<Props> = (props) => {
       content={<>{t("workspace_settings.settings.api_tokens.delete.description")} </>}
     />
   );
-};
+}
diff --git a/apps/web/core/components/api-token/empty-state.tsx b/apps/web/core/components/api-token/empty-state.tsx
index 8efa264e7..7ea05713d 100644
--- a/apps/web/core/components/api-token/empty-state.tsx
+++ b/apps/web/core/components/api-token/empty-state.tsx
@@ -10,7 +10,7 @@ type Props = {
   onClick: () => void;
 };
 
-export const ApiTokenEmptyState: React.FC<Props> = (props) => {
+export function ApiTokenEmptyState(props: Props) {
   const { onClick } = props;
 
   return (
@@ -29,4 +29,4 @@ export const ApiTokenEmptyState: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/api-token/modal/create-token-modal.tsx b/apps/web/core/components/api-token/modal/create-token-modal.tsx
index ac27873e9..a2961100c 100644
--- a/apps/web/core/components/api-token/modal/create-token-modal.tsx
+++ b/apps/web/core/components/api-token/modal/create-token-modal.tsx
@@ -25,7 +25,7 @@ type Props = {
 // services
 const apiTokenService = new APITokenService();
 
-export const CreateApiTokenModal: React.FC<Props> = (props) => {
+export function CreateApiTokenModal(props: Props) {
   const { isOpen, onClose } = props;
   // states
   const [neverExpires, setNeverExpires] = useState<boolean>(false);
@@ -104,4 +104,4 @@ export const CreateApiTokenModal: React.FC<Props> = (props) => {
       )}
     </ModalCore>
   );
-};
+}
diff --git a/apps/web/core/components/api-token/modal/form.tsx b/apps/web/core/components/api-token/modal/form.tsx
index a39636e90..e797e1733 100644
--- a/apps/web/core/components/api-token/modal/form.tsx
+++ b/apps/web/core/components/api-token/modal/form.tsx
@@ -66,7 +66,7 @@ const getFormattedDate = (date: Date): Date => {
   return add(date, { hours, minutes, seconds });
 };
 
-export const CreateApiTokenForm: React.FC<Props> = (props) => {
+export function CreateApiTokenForm(props: Props) {
   const { handleClose, neverExpires, toggleNeverExpires, onSubmit } = props;
   // states
   const [customDate, setCustomDate] = useState<Date | null>(null);
@@ -253,4 +253,4 @@ export const CreateApiTokenForm: React.FC<Props> = (props) => {
       </div>
     </form>
   );
-};
+}
diff --git a/apps/web/core/components/api-token/modal/generated-token-details.tsx b/apps/web/core/components/api-token/modal/generated-token-details.tsx
index a2a4dff78..93f416bff 100644
--- a/apps/web/core/components/api-token/modal/generated-token-details.tsx
+++ b/apps/web/core/components/api-token/modal/generated-token-details.tsx
@@ -18,7 +18,7 @@ type Props = {
   tokenDetails: IApiToken;
 };
 
-export const GeneratedTokenDetails: React.FC<Props> = (props) => {
+export function GeneratedTokenDetails(props: Props) {
   const { handleClose, tokenDetails } = props;
   const { isMobile } = usePlatformOS();
   const { t } = useTranslation();
@@ -60,4 +60,4 @@ export const GeneratedTokenDetails: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/api-token/token-list-item.tsx b/apps/web/core/components/api-token/token-list-item.tsx
index 46ad6d9f1..c3a990b96 100644
--- a/apps/web/core/components/api-token/token-list-item.tsx
+++ b/apps/web/core/components/api-token/token-list-item.tsx
@@ -16,7 +16,7 @@ type Props = {
   token: IApiToken;
 };
 
-export const ApiTokenListItem: React.FC<Props> = (props) => {
+export function ApiTokenListItem(props: Props) {
   const { token } = props;
   // states
   const [deleteModalOpen, setDeleteModalOpen] = useState(false);
@@ -61,4 +61,4 @@ export const ApiTokenListItem: React.FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/web/core/components/archives/archive-tabs-list.tsx b/apps/web/core/components/archives/archive-tabs-list.tsx
index db94d191a..4fc4230d9 100644
--- a/apps/web/core/components/archives/archive-tabs-list.tsx
+++ b/apps/web/core/components/archives/archive-tabs-list.tsx
@@ -29,7 +29,7 @@ const ARCHIVES_TAB_LIST: {
   },
 ];
 
-export const ArchiveTabsList: FC = observer(() => {
+export const ArchiveTabsList = observer(function ArchiveTabsList() {
   // router
   const { workspaceSlug, projectId } = useParams();
   const pathname = usePathname();
diff --git a/apps/web/core/components/auth-screens/auth-base.tsx b/apps/web/core/components/auth-screens/auth-base.tsx
index a6bd3d631..12215e42a 100644
--- a/apps/web/core/components/auth-screens/auth-base.tsx
+++ b/apps/web/core/components/auth-screens/auth-base.tsx
@@ -9,10 +9,12 @@ type AuthBaseProps = {
   authType: EAuthModes;
 };
 
-export const AuthBase = ({ authType }: AuthBaseProps) => (
-  <div className="relative z-10 flex flex-col items-center w-screen h-screen overflow-hidden overflow-y-auto pt-6 pb-10 px-8">
-    <AuthHeader type={authType} />
-    <AuthRoot authMode={authType} />
-    <AuthFooter />
-  </div>
-);
+export function AuthBase({ authType }: AuthBaseProps) {
+  return (
+    <div className="relative z-10 flex flex-col items-center w-screen h-screen overflow-hidden overflow-y-auto pt-6 pb-10 px-8">
+      <AuthHeader type={authType} />
+      <AuthRoot authMode={authType} />
+      <AuthFooter />
+    </div>
+  );
+}
diff --git a/apps/web/core/components/auth-screens/footer.tsx b/apps/web/core/components/auth-screens/footer.tsx
index fac043b3b..206af9a96 100644
--- a/apps/web/core/components/auth-screens/footer.tsx
+++ b/apps/web/core/components/auth-screens/footer.tsx
@@ -24,15 +24,17 @@ const BRAND_LOGOS: {
   },
 ];
 
-export const AuthFooter = () => (
-  <div className="flex flex-col items-center gap-6">
-    <span className="text-sm text-custom-text-300 whitespace-nowrap">Join 10,000+ teams building with Plane</span>
-    <div className="flex items-center justify-center gap-x-10 gap-y-4 w-full flex-wrap">
-      {BRAND_LOGOS.map((brand) => (
-        <div className="flex items-center justify-center h-7 flex-1" key={brand.id}>
-          {brand.icon}
-        </div>
-      ))}
+export function AuthFooter() {
+  return (
+    <div className="flex flex-col items-center gap-6">
+      <span className="text-sm text-custom-text-300 whitespace-nowrap">Join 10,000+ teams building with Plane</span>
+      <div className="flex items-center justify-center gap-x-10 gap-y-4 w-full flex-wrap">
+        {BRAND_LOGOS.map((brand) => (
+          <div className="flex items-center justify-center h-7 flex-1" key={brand.id}>
+            {brand.icon}
+          </div>
+        ))}
+      </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/auth-screens/header.tsx b/apps/web/core/components/auth-screens/header.tsx
index c55265235..78c013765 100644
--- a/apps/web/core/components/auth-screens/header.tsx
+++ b/apps/web/core/components/auth-screens/header.tsx
@@ -29,7 +29,7 @@ type AuthHeaderProps = {
   type: EAuthModes;
 };
 
-export const AuthHeader = observer(({ type }: AuthHeaderProps) => {
+export const AuthHeader = observer(function AuthHeader({ type }: AuthHeaderProps) {
   const { t } = useTranslation();
   // store
   const { config } = useInstance();
diff --git a/apps/web/core/components/auth-screens/not-authorized-view.tsx b/apps/web/core/components/auth-screens/not-authorized-view.tsx
index bf1b11558..a824eb209 100644
--- a/apps/web/core/components/auth-screens/not-authorized-view.tsx
+++ b/apps/web/core/components/auth-screens/not-authorized-view.tsx
@@ -14,7 +14,7 @@ type Props = {
   className?: string;
 };
 
-export const NotAuthorizedView: React.FC<Props> = observer((props) => {
+export const NotAuthorizedView = observer(function NotAuthorizedView(props: Props) {
   const { actionButton, section = "general", isProjectView = false, className } = props;
 
   // assets
diff --git a/apps/web/core/components/auth-screens/project/join-project.tsx b/apps/web/core/components/auth-screens/project/join-project.tsx
index b9f52aa88..f883f7692 100644
--- a/apps/web/core/components/auth-screens/project/join-project.tsx
+++ b/apps/web/core/components/auth-screens/project/join-project.tsx
@@ -15,7 +15,7 @@ type Props = {
   isPrivateProject?: boolean;
 };
 
-export const JoinProject: React.FC<Props> = (props) => {
+export function JoinProject(props: Props) {
   const { projectId, isPrivateProject = false } = props;
   // states
   const [isJoiningProject, setIsJoiningProject] = useState(false);
@@ -65,4 +65,4 @@ export const JoinProject: React.FC<Props> = (props) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/auth-screens/workspace/not-a-member.tsx b/apps/web/core/components/auth-screens/workspace/not-a-member.tsx
index 115718d75..ebaf57c2a 100644
--- a/apps/web/core/components/auth-screens/workspace/not-a-member.tsx
+++ b/apps/web/core/components/auth-screens/workspace/not-a-member.tsx
@@ -6,30 +6,32 @@ import { Button } from "@plane/propel/button";
 // layouts
 import DefaultLayout from "@/layouts/default-layout";
 
-export const NotAWorkspaceMember = () => (
-  <DefaultLayout>
-    <div className="grid h-full place-items-center p-4">
-      <div className="space-y-8 text-center">
-        <div className="space-y-2">
-          <h3 className="text-lg font-semibold">Not Authorized!</h3>
-          <p className="mx-auto w-1/2 text-sm text-custom-text-200">
-            You{"'"}re not a member of this workspace. Please contact the workspace admin to get an invitation or check
-            your pending invitations.
-          </p>
-        </div>
-        <div className="flex items-center justify-center gap-2">
-          <Link href="/invitations">
-            <span>
-              <Button variant="neutral-primary">Check pending invites</Button>
-            </span>
-          </Link>
-          <Link href="/create-workspace">
-            <span>
-              <Button variant="primary">Create new workspace</Button>
-            </span>
-          </Link>
+export function NotAWorkspaceMember() {
+  return (
+    <DefaultLayout>
+      <div className="grid h-full place-items-center p-4">
+        <div className="space-y-8 text-center">
+          <div className="space-y-2">
+            <h3 className="text-lg font-semibold">Not Authorized!</h3>
+            <p className="mx-auto w-1/2 text-sm text-custom-text-200">
+              You{"'"}re not a member of this workspace. Please contact the workspace admin to get an invitation or
+              check your pending invitations.
+            </p>
+          </div>
+          <div className="flex items-center justify-center gap-2">
+            <Link href="/invitations">
+              <span>
+                <Button variant="neutral-primary">Check pending invites</Button>
+              </span>
+            </Link>
+            <Link href="/create-workspace">
+              <span>
+                <Button variant="primary">Create new workspace</Button>
+              </span>
+            </Link>
+          </div>
         </div>
       </div>
-    </div>
-  </DefaultLayout>
-);
+    </DefaultLayout>
+  );
+}
diff --git a/apps/web/core/components/automation/auto-archive-automation.tsx b/apps/web/core/components/automation/auto-archive-automation.tsx
index 445a9d8d0..511a3ed5f 100644
--- a/apps/web/core/components/automation/auto-archive-automation.tsx
+++ b/apps/web/core/components/automation/auto-archive-automation.tsx
@@ -30,7 +30,7 @@ type Props = {
 
 const initialValues: Partial<IProject> = { archive_in: 1 };
 
-export const AutoArchiveAutomation: React.FC<Props> = observer((props) => {
+export const AutoArchiveAutomation = observer(function AutoArchiveAutomation(props: Props) {
   const { handleChange } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/automation/auto-close-automation.tsx b/apps/web/core/components/automation/auto-close-automation.tsx
index 19e294a22..30ff9f15a 100644
--- a/apps/web/core/components/automation/auto-close-automation.tsx
+++ b/apps/web/core/components/automation/auto-close-automation.tsx
@@ -32,7 +32,7 @@ type Props = {
   handleChange: (formData: Partial<IProject>) => Promise<void>;
 };
 
-export const AutoCloseAutomation: React.FC<Props> = observer((props) => {
+export const AutoCloseAutomation = observer(function AutoCloseAutomation(props: Props) {
   const { handleChange } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/automation/select-month-modal.tsx b/apps/web/core/components/automation/select-month-modal.tsx
index 4ed121e10..544e40b72 100644
--- a/apps/web/core/components/automation/select-month-modal.tsx
+++ b/apps/web/core/components/automation/select-month-modal.tsx
@@ -21,7 +21,7 @@ type Props = {
   handleChange: (formData: Partial<IProject>) => Promise<void>;
 };
 
-export const SelectMonthModal: React.FC<Props> = ({ type, initialValues, isOpen, handleClose, handleChange }) => {
+export function SelectMonthModal({ type, initialValues, isOpen, handleClose, handleChange }: Props) {
   const { workspaceSlug, projectId } = useParams();
 
   const {
@@ -165,4 +165,4 @@ export const SelectMonthModal: React.FC<Props> = ({ type, initialValues, isOpen,
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/base-layouts/gantt/layout.tsx b/apps/web/core/components/base-layouts/gantt/layout.tsx
index 0bc91fb9c..dd2af12e6 100644
--- a/apps/web/core/components/base-layouts/gantt/layout.tsx
+++ b/apps/web/core/components/base-layouts/gantt/layout.tsx
@@ -14,7 +14,9 @@ import { TimeLineTypeContext } from "@/components/gantt-chart/contexts";
 import { GanttChartRoot } from "@/components/gantt-chart/root";
 import { BaseGanttSidebar } from "./sidebar";
 
-export const BaseGanttLayout = observer(<T extends IBaseLayoutsGanttItem>(props: IBaseLayoutsGanttProps<T>) => {
+export const BaseGanttLayout = observer(function BaseGanttLayout<T extends IBaseLayoutsGanttItem>(
+  props: IBaseLayoutsGanttProps<T>
+) {
   const {
     items,
     groupedItemIds,
diff --git a/apps/web/core/components/base-layouts/gantt/sidebar.tsx b/apps/web/core/components/base-layouts/gantt/sidebar.tsx
index f26f59a41..635f1d329 100644
--- a/apps/web/core/components/base-layouts/gantt/sidebar.tsx
+++ b/apps/web/core/components/base-layouts/gantt/sidebar.tsx
@@ -26,7 +26,7 @@ type Props<T extends IBaseLayoutsBaseItem> = {
   renderItem: (item: T) => React.ReactNode;
 };
 
-export const BaseGanttSidebar = observer(<T extends IBaseLayoutsBaseItem>(props: Props<T>) => {
+export const BaseGanttSidebar = observer(function BaseGanttSidebar<T extends IBaseLayoutsBaseItem>(props: Props<T>) {
   const {
     blockUpdateHandler,
     blockIds,
diff --git a/apps/web/core/components/base-layouts/kanban/group-header.tsx b/apps/web/core/components/base-layouts/kanban/group-header.tsx
index be8487995..c678839bc 100644
--- a/apps/web/core/components/base-layouts/kanban/group-header.tsx
+++ b/apps/web/core/components/base-layouts/kanban/group-header.tsx
@@ -1,14 +1,16 @@
 import type { IGroupHeaderProps } from "@plane/types";
 
-export const GroupHeader = ({ group, itemCount, onToggleGroup }: IGroupHeaderProps) => (
-  <button
-    onClick={() => onToggleGroup(group.id)}
-    className="flex w-full items-center gap-2 text-sm font-medium text-custom-text-200"
-  >
-    <div className="flex items-center gap-2">
-      {group.icon}
-      <span>{group.name}</span>
-    </div>
-    <span className="text-xs text-custom-text-300">{itemCount}</span>
-  </button>
-);
+export function GroupHeader({ group, itemCount, onToggleGroup }: IGroupHeaderProps) {
+  return (
+    <button
+      onClick={() => onToggleGroup(group.id)}
+      className="flex w-full items-center gap-2 text-sm font-medium text-custom-text-200"
+    >
+      <div className="flex items-center gap-2">
+        {group.icon}
+        <span>{group.name}</span>
+      </div>
+      <span className="text-xs text-custom-text-300">{itemCount}</span>
+    </button>
+  );
+}
diff --git a/apps/web/core/components/base-layouts/kanban/group.tsx b/apps/web/core/components/base-layouts/kanban/group.tsx
index 2cd291897..a82849bd9 100644
--- a/apps/web/core/components/base-layouts/kanban/group.tsx
+++ b/apps/web/core/components/base-layouts/kanban/group.tsx
@@ -6,7 +6,9 @@ import { useGroupDropTarget } from "../hooks/use-group-drop-target";
 import { GroupHeader } from "./group-header";
 import { BaseKanbanItem } from "./item";
 
-export const BaseKanbanGroup = observer(<T extends IBaseLayoutsKanbanItem>(props: IBaseLayoutsKanbanGroupProps<T>) => {
+export const BaseKanbanGroup = observer(function BaseKanbanGroup<T extends IBaseLayoutsKanbanItem>(
+  props: IBaseLayoutsKanbanGroupProps<T>
+) {
   const {
     group,
     itemIds,
diff --git a/apps/web/core/components/base-layouts/kanban/item.tsx b/apps/web/core/components/base-layouts/kanban/item.tsx
index 325e6f0d6..1bc560943 100644
--- a/apps/web/core/components/base-layouts/kanban/item.tsx
+++ b/apps/web/core/components/base-layouts/kanban/item.tsx
@@ -4,7 +4,9 @@ import { draggable, dropTargetForElements } from "@atlaskit/pragmatic-drag-and-d
 import { observer } from "mobx-react";
 import type { IBaseLayoutsKanbanItem, IBaseLayoutsKanbanItemProps } from "@plane/types";
 
-export const BaseKanbanItem = observer(<T extends IBaseLayoutsKanbanItem>(props: IBaseLayoutsKanbanItemProps<T>) => {
+export const BaseKanbanItem = observer(function BaseKanbanItem<T extends IBaseLayoutsKanbanItem>(
+  props: IBaseLayoutsKanbanItemProps<T>
+) {
   const { item, groupId, renderItem, enableDragDrop, canDrag } = props;
 
   const itemRef = useRef<HTMLDivElement | null>(null);
diff --git a/apps/web/core/components/base-layouts/kanban/layout.tsx b/apps/web/core/components/base-layouts/kanban/layout.tsx
index 7ef47f811..e0000a866 100644
--- a/apps/web/core/components/base-layouts/kanban/layout.tsx
+++ b/apps/web/core/components/base-layouts/kanban/layout.tsx
@@ -6,7 +6,9 @@ import { cn } from "@plane/utils";
 import { useLayoutState } from "../hooks/use-layout-state";
 import { BaseKanbanGroup } from "./group";
 
-export const BaseKanbanLayout = observer(<T extends IBaseLayoutsKanbanItem>(props: IBaseLayoutsKanbanProps<T>) => {
+export const BaseKanbanLayout = observer(function BaseKanbanLayout<T extends IBaseLayoutsKanbanItem>(
+  props: IBaseLayoutsKanbanProps<T>
+) {
   const {
     items,
     groups,
diff --git a/apps/web/core/components/base-layouts/layout-switcher.tsx b/apps/web/core/components/base-layouts/layout-switcher.tsx
index 0f6d39626..a51d2de9b 100644
--- a/apps/web/core/components/base-layouts/layout-switcher.tsx
+++ b/apps/web/core/components/base-layouts/layout-switcher.tsx
@@ -12,7 +12,7 @@ type Props = {
   selectedLayout: TBaseLayoutType;
 };
 
-export const LayoutSwitcher: React.FC<Props> = (props) => {
+export function LayoutSwitcher(props: Props) {
   const { layouts, onChange, selectedLayout } = props;
   const { isMobile } = usePlatformOS();
 
@@ -47,4 +47,4 @@ export const LayoutSwitcher: React.FC<Props> = (props) => {
       })}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/base-layouts/list/group-header.tsx b/apps/web/core/components/base-layouts/list/group-header.tsx
index cbdca7fad..916958293 100644
--- a/apps/web/core/components/base-layouts/list/group-header.tsx
+++ b/apps/web/core/components/base-layouts/list/group-header.tsx
@@ -1,12 +1,14 @@
 import type { IGroupHeaderProps } from "@plane/types";
 
-export const GroupHeader = ({ group, itemCount, onToggleGroup }: IGroupHeaderProps) => (
-  <button
-    onClick={() => onToggleGroup(group.id)}
-    className="flex w-full items-center gap-2 py-2 text-sm font-medium text-custom-text-200"
-  >
-    {group.icon}
-    <span>{group.name}</span>
-    <span className="text-xs text-custom-text-300">{itemCount}</span>
-  </button>
-);
+export function GroupHeader({ group, itemCount, onToggleGroup }: IGroupHeaderProps) {
+  return (
+    <button
+      onClick={() => onToggleGroup(group.id)}
+      className="flex w-full items-center gap-2 py-2 text-sm font-medium text-custom-text-200"
+    >
+      {group.icon}
+      <span>{group.name}</span>
+      <span className="text-xs text-custom-text-300">{itemCount}</span>
+    </button>
+  );
+}
diff --git a/apps/web/core/components/base-layouts/list/group.tsx b/apps/web/core/components/base-layouts/list/group.tsx
index 15a8079aa..769e14c65 100644
--- a/apps/web/core/components/base-layouts/list/group.tsx
+++ b/apps/web/core/components/base-layouts/list/group.tsx
@@ -6,7 +6,9 @@ import { useGroupDropTarget } from "../hooks/use-group-drop-target";
 import { GroupHeader } from "./group-header";
 import { BaseListItem } from "./item";
 
-export const BaseListGroup = observer(<T extends IBaseLayoutsListItem>(props: IBaseLayoutsListGroupProps<T>) => {
+export const BaseListGroup = observer(function BaseListGroup<T extends IBaseLayoutsListItem>(
+  props: IBaseLayoutsListGroupProps<T>
+) {
   const {
     group,
     itemIds,
diff --git a/apps/web/core/components/base-layouts/list/item.tsx b/apps/web/core/components/base-layouts/list/item.tsx
index cfaa74502..22f808b8c 100644
--- a/apps/web/core/components/base-layouts/list/item.tsx
+++ b/apps/web/core/components/base-layouts/list/item.tsx
@@ -4,7 +4,9 @@ import { draggable, dropTargetForElements } from "@atlaskit/pragmatic-drag-and-d
 import { observer } from "mobx-react";
 import type { IBaseLayoutsListItem, IBaseLayoutsListItemProps } from "@plane/types";
 
-export const BaseListItem = observer(<T extends IBaseLayoutsListItem>(props: IBaseLayoutsListItemProps<T>) => {
+export const BaseListItem = observer(function BaseListItem<T extends IBaseLayoutsListItem>(
+  props: IBaseLayoutsListItemProps<T>
+) {
   const { item, groupId, renderItem, enableDragDrop, canDrag, isLast: _isLast, index: _index } = props;
   const itemRef = useRef<HTMLDivElement | null>(null);
 
diff --git a/apps/web/core/components/base-layouts/list/layout.tsx b/apps/web/core/components/base-layouts/list/layout.tsx
index 59a012007..ddde0b149 100644
--- a/apps/web/core/components/base-layouts/list/layout.tsx
+++ b/apps/web/core/components/base-layouts/list/layout.tsx
@@ -6,7 +6,9 @@ import { cn } from "@plane/ui";
 import { useLayoutState } from "../hooks/use-layout-state";
 import { BaseListGroup } from "./group";
 
-export const BaseListLayout = observer(<T extends IBaseLayoutsListItem>(props: IBaseLayoutsListProps<T>) => {
+export const BaseListLayout = observer(function BaseListLayout<T extends IBaseLayoutsListItem>(
+  props: IBaseLayoutsListProps<T>
+) {
   const {
     items,
     groupedItemIds,
diff --git a/apps/web/core/components/base-layouts/loaders/layout-loader.tsx b/apps/web/core/components/base-layouts/loaders/layout-loader.tsx
index d81d6718d..894c8cafd 100644
--- a/apps/web/core/components/base-layouts/loaders/layout-loader.tsx
+++ b/apps/web/core/components/base-layouts/loaders/layout-loader.tsx
@@ -8,7 +8,7 @@ interface GenericLayoutLoaderProps {
   customLoaders?: Partial<Record<TBaseLayoutType, React.ComponentType>>;
 }
 
-export const GenericLayoutLoader = ({ layout, customLoaders }: GenericLayoutLoaderProps) => {
+export function GenericLayoutLoader({ layout, customLoaders }: GenericLayoutLoaderProps) {
   const CustomLoader = customLoaders?.[layout];
   if (CustomLoader) return <CustomLoader />;
 
@@ -21,4 +21,4 @@ export const GenericLayoutLoader = ({ layout, customLoaders }: GenericLayoutLoad
       console.warn(`Unknown layout: ${layout}`);
       return null;
   }
-};
+}
diff --git a/apps/web/core/components/comments/card/display.tsx b/apps/web/core/components/comments/card/display.tsx
index 16ea26378..1fc081bf6 100644
--- a/apps/web/core/components/comments/card/display.tsx
+++ b/apps/web/core/components/comments/card/display.tsx
@@ -24,7 +24,7 @@ type Props = {
   workspaceSlug: string;
 };
 
-export const CommentCardDisplay: React.FC<Props> = observer((props) => {
+export const CommentCardDisplay = observer(function CommentCardDisplay(props: Props) {
   const {
     activityOperations,
     comment,
diff --git a/apps/web/core/components/comments/card/edit-form.tsx b/apps/web/core/components/comments/card/edit-form.tsx
index 9927f54a7..ca0be549c 100644
--- a/apps/web/core/components/comments/card/edit-form.tsx
+++ b/apps/web/core/components/comments/card/edit-form.tsx
@@ -21,7 +21,7 @@ type Props = {
   workspaceSlug: string;
 };
 
-export const CommentCardEditForm: React.FC<Props> = observer((props) => {
+export const CommentCardEditForm = observer(function CommentCardEditForm(props: Props) {
   const {
     activityOperations,
     comment,
diff --git a/apps/web/core/components/comments/card/root.tsx b/apps/web/core/components/comments/card/root.tsx
index f55d3fd17..313a68c7e 100644
--- a/apps/web/core/components/comments/card/root.tsx
+++ b/apps/web/core/components/comments/card/root.tsx
@@ -24,7 +24,7 @@ type TCommentCard = {
   projectId?: string;
 };
 
-export const CommentCard: FC<TCommentCard> = observer((props) => {
+export const CommentCard = observer(function CommentCard(props: TCommentCard) {
   const {
     workspaceSlug,
     comment,
diff --git a/apps/web/core/components/comments/comment-create.tsx b/apps/web/core/components/comments/comment-create.tsx
index 584867c42..652bb60d8 100644
--- a/apps/web/core/components/comments/comment-create.tsx
+++ b/apps/web/core/components/comments/comment-create.tsx
@@ -26,7 +26,7 @@ type TCommentCreate = {
 // services
 const fileService = new FileService();
 
-export const CommentCreate: FC<TCommentCreate> = observer((props) => {
+export const CommentCreate = observer(function CommentCreate(props: TCommentCreate) {
   const {
     workspaceSlug,
     entityId,
diff --git a/apps/web/core/components/comments/comment-reaction.tsx b/apps/web/core/components/comments/comment-reaction.tsx
index 181f7a072..f657193f3 100644
--- a/apps/web/core/components/comments/comment-reaction.tsx
+++ b/apps/web/core/components/comments/comment-reaction.tsx
@@ -18,7 +18,7 @@ export type TProps = {
   activityOperations: TCommentsOperations;
 };
 
-export const CommentReactions: FC<TProps> = observer((props) => {
+export const CommentReactions = observer(function CommentReactions(props: TProps) {
   const { comment, activityOperations, disabled = false } = props;
   // state
   const [isPickerOpen, setIsPickerOpen] = useState(false);
diff --git a/apps/web/core/components/comments/comments.tsx b/apps/web/core/components/comments/comments.tsx
index 9f2cfc6c5..e3a10c2b0 100644
--- a/apps/web/core/components/comments/comments.tsx
+++ b/apps/web/core/components/comments/comments.tsx
@@ -23,7 +23,7 @@ type TCommentsWrapper = {
   showCopyLinkOption?: boolean;
 };
 
-export const CommentsWrapper: FC<TCommentsWrapper> = observer((props) => {
+export const CommentsWrapper = observer(function CommentsWrapper(props: TCommentsWrapper) {
   const {
     entityId,
     activityOperations,
diff --git a/apps/web/core/components/comments/quick-actions.tsx b/apps/web/core/components/comments/quick-actions.tsx
index 32f176544..864202045 100644
--- a/apps/web/core/components/comments/quick-actions.tsx
+++ b/apps/web/core/components/comments/quick-actions.tsx
@@ -22,7 +22,7 @@ type TCommentCard = {
   showCopyLinkOption: boolean;
 };
 
-export const CommentQuickActions: FC<TCommentCard> = observer((props) => {
+export const CommentQuickActions = observer(function CommentQuickActions(props: TCommentCard) {
   const { activityOperations, comment, setEditMode, showAccessSpecifier, showCopyLinkOption } = props;
   // store hooks
   const { data: currentUser } = useUser();
@@ -33,8 +33,8 @@ export const CommentQuickActions: FC<TCommentCard> = observer((props) => {
   // translation
   const { t } = useTranslation();
 
-  const MENU_ITEMS: TContextMenuItem[] = useMemo(
-    () => [
+  const MENU_ITEMS = useMemo(function MENU_ITEMS() {
+    return [
       {
         key: "edit",
         action: setEditMode,
@@ -72,9 +72,8 @@ export const CommentQuickActions: FC<TCommentCard> = observer((props) => {
         icon: Trash2,
         shouldRender: canDelete,
       },
-    ],
-    [activityOperations, canDelete, canEdit, comment, setEditMode, showAccessSpecifier, showCopyLinkOption]
-  );
+    ];
+  });
 
   return (
     <CustomMenu ellipsis closeOnSelect>
diff --git a/apps/web/core/components/common/access-field.tsx b/apps/web/core/components/common/access-field.tsx
index 42006e9f7..3c93d8c85 100644
--- a/apps/web/core/components/common/access-field.tsx
+++ b/apps/web/core/components/common/access-field.tsx
@@ -18,7 +18,7 @@ type Props = {
 };
 
 // TODO: Remove label once i18n is done
-export const AccessField = (props: Props) => {
+export function AccessField(props: Props) {
   const { onChange, value, accessSpecifiers, isMobile = false } = props;
   const { t } = useTranslation();
 
@@ -50,4 +50,4 @@ export const AccessField = (props: Props) => {
       })}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/common/activity/activity-block.tsx b/apps/web/core/components/common/activity/activity-block.tsx
index caf48975f..bb4631b5d 100644
--- a/apps/web/core/components/common/activity/activity-block.tsx
+++ b/apps/web/core/components/common/activity/activity-block.tsx
@@ -21,7 +21,7 @@ type TActivityBlockComponent = {
   customUserName?: string;
 };
 
-export const ActivityBlockComponent: FC<TActivityBlockComponent> = (props) => {
+export function ActivityBlockComponent(props: TActivityBlockComponent) {
   const { icon, activity, ends, children, customUserName } = props;
   // hooks
   const { isMobile } = usePlatformOS();
@@ -53,4 +53,4 @@ export const ActivityBlockComponent: FC<TActivityBlockComponent> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/common/activity/activity-item.tsx b/apps/web/core/components/common/activity/activity-item.tsx
index 6df28e1d8..264b08e65 100644
--- a/apps/web/core/components/common/activity/activity-item.tsx
+++ b/apps/web/core/components/common/activity/activity-item.tsx
@@ -13,7 +13,7 @@ type TActivityItem = {
   ends?: "top" | "bottom" | undefined;
 };
 
-export const ActivityItem: FC<TActivityItem> = observer((props) => {
+export const ActivityItem = observer(function ActivityItem(props: TActivityItem) {
   const { activity, showProject = true, ends } = props;
 
   if (!activity) return null;
diff --git a/apps/web/core/components/common/activity/user.tsx b/apps/web/core/components/common/activity/user.tsx
index 5da5b305f..7ae48b512 100644
--- a/apps/web/core/components/common/activity/user.tsx
+++ b/apps/web/core/components/common/activity/user.tsx
@@ -12,7 +12,7 @@ type TUser = {
   customUserName?: string;
 };
 
-export const User: FC<TUser> = observer((props) => {
+export const User = observer(function User(props: TUser) {
   const { activity, customUserName } = props;
   // store hooks
   const { getUserDetails } = useMember();
diff --git a/apps/web/core/components/common/applied-filters/date.tsx b/apps/web/core/components/common/applied-filters/date.tsx
index 3d8d94cf8..b070c355f 100644
--- a/apps/web/core/components/common/applied-filters/date.tsx
+++ b/apps/web/core/components/common/applied-filters/date.tsx
@@ -11,7 +11,7 @@ type Props = {
   values: string[];
 };
 
-export const AppliedDateFilters: React.FC<Props> = observer((props) => {
+export const AppliedDateFilters = observer(function AppliedDateFilters(props: Props) {
   const { editable, handleRemove, values } = props;
 
   const getDateLabel = (value: string): string => {
diff --git a/apps/web/core/components/common/applied-filters/members.tsx b/apps/web/core/components/common/applied-filters/members.tsx
index a1823132f..c0c5ecb36 100644
--- a/apps/web/core/components/common/applied-filters/members.tsx
+++ b/apps/web/core/components/common/applied-filters/members.tsx
@@ -15,7 +15,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
+export const AppliedMembersFilters = observer(function AppliedMembersFilters(props: Props) {
   const { handleRemove, values, editable } = props;
   // store hooks
   const {
diff --git a/apps/web/core/components/common/breadcrumb-link.tsx b/apps/web/core/components/common/breadcrumb-link.tsx
index 25ee4ee1c..0b7f576e3 100644
--- a/apps/web/core/components/common/breadcrumb-link.tsx
+++ b/apps/web/core/components/common/breadcrumb-link.tsx
@@ -15,19 +15,25 @@ type Props = {
   isLast?: boolean;
 };
 
-const IconWrapper = React.memo(({ icon }: { icon: React.ReactNode }) => (
-  <div className="flex size-4 items-center justify-center overflow-hidden !text-[1rem]">{icon}</div>
-));
+const IconWrapper = React.memo(function IconWrapper({ icon }: { icon: React.ReactNode }) {
+  return <div className="flex size-4 items-center justify-center overflow-hidden !text-[1rem]">{icon}</div>;
+});
 
 IconWrapper.displayName = "IconWrapper";
 
-const LabelWrapper = React.memo(({ label }: { label: ReactNode }) => (
-  <div className="relative line-clamp-1 block max-w-[150px] overflow-hidden truncate">{label}</div>
-));
+const LabelWrapper = React.memo(function LabelWrapper({ label }: { label: ReactNode }) {
+  return <div className="relative line-clamp-1 block max-w-[150px] overflow-hidden truncate">{label}</div>;
+});
 
 LabelWrapper.displayName = "LabelWrapper";
 
-const BreadcrumbContent = React.memo(({ icon, label }: { icon?: React.ReactNode; label?: ReactNode }) => {
+const BreadcrumbContent = React.memo(function BreadcrumbContent({
+  icon,
+  label,
+}: {
+  icon?: React.ReactNode;
+  label?: ReactNode;
+}) {
   if (!icon && !label) return null;
 
   return (
@@ -40,13 +46,16 @@ const BreadcrumbContent = React.memo(({ icon, label }: { icon?: React.ReactNode;
 
 BreadcrumbContent.displayName = "BreadcrumbContent";
 
-const ItemWrapper = React.memo(({ children, ...props }: React.ComponentProps<typeof Breadcrumbs.ItemWrapper>) => (
-  <Breadcrumbs.ItemWrapper {...props}>{children}</Breadcrumbs.ItemWrapper>
-));
+const ItemWrapper = React.memo(function ItemWrapper({
+  children,
+  ...props
+}: React.ComponentProps<typeof Breadcrumbs.ItemWrapper>) {
+  return <Breadcrumbs.ItemWrapper {...props}>{children}</Breadcrumbs.ItemWrapper>;
+});
 
 ItemWrapper.displayName = "ItemWrapper";
 
-export const BreadcrumbLink: FC<Props> = observer((props) => {
+export const BreadcrumbLink = observer(function BreadcrumbLink(props: Props) {
   const { href, label, icon, disableTooltip = false, isLast = false } = props;
   const { isMobile } = usePlatformOS();
 
diff --git a/apps/web/core/components/common/count-chip.tsx b/apps/web/core/components/common/count-chip.tsx
index ff15e5011..db41451c7 100644
--- a/apps/web/core/components/common/count-chip.tsx
+++ b/apps/web/core/components/common/count-chip.tsx
@@ -9,7 +9,7 @@ type TCountChip = {
   className?: string;
 };
 
-export const CountChip: FC<TCountChip> = (props) => {
+export function CountChip(props: TCountChip) {
   const { count, className = "" } = props;
 
   return (
@@ -22,4 +22,4 @@ export const CountChip: FC<TCountChip> = (props) => {
       {count}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/common/empty-state.tsx b/apps/web/core/components/common/empty-state.tsx
index 64a7ba7cb..c71dd7f69 100644
--- a/apps/web/core/components/common/empty-state.tsx
+++ b/apps/web/core/components/common/empty-state.tsx
@@ -17,32 +17,27 @@ type Props = {
   disabled?: boolean;
 };
 
-export const EmptyState: React.FC<Props> = ({
-  title,
-  description,
-  image,
-  primaryButton,
-  secondaryButton,
-  disabled = false,
-}) => (
-  <div className={`flex h-full w-full items-center justify-center`}>
-    <div className="flex w-full flex-col items-center text-center">
-      <img src={image} className="w-52 sm:w-60 object-contain" alt={primaryButton?.text || "button image"} />
-      <h6 className="mb-3 mt-6 text-xl font-semibold sm:mt-8">{title}</h6>
-      {description && <p className="mb-7 px-5 text-custom-text-300 sm:mb-8">{description}</p>}
-      <div className="flex items-center gap-4">
-        {primaryButton && (
-          <Button
-            variant="primary"
-            prependIcon={primaryButton.icon}
-            onClick={primaryButton.onClick}
-            disabled={disabled}
-          >
-            {primaryButton.text}
-          </Button>
-        )}
-        {secondaryButton}
+export function EmptyState({ title, description, image, primaryButton, secondaryButton, disabled = false }: Props) {
+  return (
+    <div className={`flex h-full w-full items-center justify-center`}>
+      <div className="flex w-full flex-col items-center text-center">
+        <img src={image} className="w-52 sm:w-60 object-contain" alt={primaryButton?.text || "button image"} />
+        <h6 className="mb-3 mt-6 text-xl font-semibold sm:mt-8">{title}</h6>
+        {description && <p className="mb-7 px-5 text-custom-text-300 sm:mb-8">{description}</p>}
+        <div className="flex items-center gap-4">
+          {primaryButton && (
+            <Button
+              variant="primary"
+              prependIcon={primaryButton.icon}
+              onClick={primaryButton.onClick}
+              disabled={disabled}
+            >
+              {primaryButton.text}
+            </Button>
+          )}
+          {secondaryButton}
+        </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/common/filters/created-at.tsx b/apps/web/core/components/common/filters/created-at.tsx
index 77bd3efbd..f3518bd14 100644
--- a/apps/web/core/components/common/filters/created-at.tsx
+++ b/apps/web/core/components/common/filters/created-at.tsx
@@ -13,7 +13,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterCreatedDate: React.FC<Props> = observer((props) => {
+export const FilterCreatedDate = observer(function FilterCreatedDate(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
 
   const [previewEnabled, setPreviewEnabled] = useState(true);
diff --git a/apps/web/core/components/common/filters/created-by.tsx b/apps/web/core/components/common/filters/created-by.tsx
index bd39056c8..bf574a0c6 100644
--- a/apps/web/core/components/common/filters/created-by.tsx
+++ b/apps/web/core/components/common/filters/created-by.tsx
@@ -20,7 +20,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterCreatedBy: React.FC<Props> = observer((props: Props) => {
+export const FilterCreatedBy = observer(function FilterCreatedBy(props: Props) {
   const { appliedFilters, handleUpdate, memberIds, searchQuery } = props;
   // states
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/common/latest-feature-block.tsx b/apps/web/core/components/common/latest-feature-block.tsx
index 3f9eac4ea..acf6ecbcd 100644
--- a/apps/web/core/components/common/latest-feature-block.tsx
+++ b/apps/web/core/components/common/latest-feature-block.tsx
@@ -5,7 +5,7 @@ import { Lightbulb } from "lucide-react";
 // images
 import latestFeatures from "@/app/assets/onboarding/onboarding-pages.webp?url";
 
-export const LatestFeatureBlock = () => {
+export function LatestFeatureBlock() {
   const { resolvedTheme } = useTheme();
 
   return (
@@ -36,4 +36,4 @@ export const LatestFeatureBlock = () => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/web/core/components/common/logo-spinner.tsx b/apps/web/core/components/common/logo-spinner.tsx
index 5a5393f4d..0d08b77e5 100644
--- a/apps/web/core/components/common/logo-spinner.tsx
+++ b/apps/web/core/components/common/logo-spinner.tsx
@@ -3,7 +3,7 @@ import { useTheme } from "next-themes";
 import LogoSpinnerDark from "@/app/assets/images/logo-spinner-dark.gif?url";
 import LogoSpinnerLight from "@/app/assets/images/logo-spinner-light.gif?url";
 
-export const LogoSpinner = () => {
+export function LogoSpinner() {
   const { resolvedTheme } = useTheme();
 
   const logoSrc = resolvedTheme === "dark" ? LogoSpinnerDark : LogoSpinnerLight;
@@ -13,4 +13,4 @@ export const LogoSpinner = () => {
       <img src={logoSrc} alt="logo" className="h-6 w-auto sm:h-11 object-contain" />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/common/new-empty-state.tsx b/apps/web/core/components/common/new-empty-state.tsx
index be7cbe9c7..43c250e94 100644
--- a/apps/web/core/components/common/new-empty-state.tsx
+++ b/apps/web/core/components/common/new-empty-state.tsx
@@ -22,14 +22,7 @@ type Props = {
   disabled?: boolean;
 };
 
-export const NewEmptyState: React.FC<Props> = ({
-  title,
-  description,
-  image,
-  primaryButton,
-  disabled = false,
-  comicBox,
-}) => {
+export function NewEmptyState({ title, description, image, primaryButton, disabled = false, comicBox }: Props) {
   const [isHovered, setIsHovered] = useState(false);
 
   const handleMouseEnter = () => {
@@ -109,4 +102,4 @@ export const NewEmptyState: React.FC<Props> = ({
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/common/page-access-icon.tsx b/apps/web/core/components/common/page-access-icon.tsx
index bb61dc62b..856901322 100644
--- a/apps/web/core/components/common/page-access-icon.tsx
+++ b/apps/web/core/components/common/page-access-icon.tsx
@@ -2,14 +2,16 @@ import { ArchiveIcon, Earth, Lock } from "lucide-react";
 import { EPageAccess } from "@plane/constants";
 import type { TPage } from "@plane/types";
 
-export const PageAccessIcon = (page: TPage) => (
-  <div>
-    {page.archived_at ? (
-      <ArchiveIcon className="h-2.5 w-2.5 text-custom-text-300" />
-    ) : page.access === EPageAccess.PUBLIC ? (
-      <Earth className="h-2.5 w-2.5 text-custom-text-300" />
-    ) : (
-      <Lock className="h-2.5 w-2.5 text-custom-text-300" />
-    )}
-  </div>
-);
+export function PageAccessIcon(page: TPage) {
+  return (
+    <div>
+      {page.archived_at ? (
+        <ArchiveIcon className="h-2.5 w-2.5 text-custom-text-300" />
+      ) : page.access === EPageAccess.PUBLIC ? (
+        <Earth className="h-2.5 w-2.5 text-custom-text-300" />
+      ) : (
+        <Lock className="h-2.5 w-2.5 text-custom-text-300" />
+      )}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/common/pro-icon.tsx b/apps/web/core/components/common/pro-icon.tsx
index 45f3a698c..1e7856b36 100644
--- a/apps/web/core/components/common/pro-icon.tsx
+++ b/apps/web/core/components/common/pro-icon.tsx
@@ -9,8 +9,8 @@ type TProIcon = {
   className?: string;
 };
 
-export const ProIcon: FC<TProIcon> = (props) => {
+export function ProIcon(props: TProIcon) {
   const { className } = props;
 
   return <Crown className={cn("inline-block h-3.5 w-3.5 text-amber-400", className)} />;
-};
+}
diff --git a/apps/web/core/components/common/switcher-label.tsx b/apps/web/core/components/common/switcher-label.tsx
index 0e9375da6..149fc18e9 100644
--- a/apps/web/core/components/common/switcher-label.tsx
+++ b/apps/web/core/components/common/switcher-label.tsx
@@ -12,13 +12,7 @@ type TSwitcherIconProps = {
   type?: "lucide" | "material";
 };
 
-export const SwitcherIcon: FC<TSwitcherIconProps> = ({
-  logo_props,
-  logo_url,
-  LabelIcon,
-  size = 12,
-  type = "lucide",
-}) => {
+export function SwitcherIcon({ logo_props, logo_url, LabelIcon, size = 12, type = "lucide" }: TSwitcherIconProps) {
   if (logo_props?.in_use) {
     return <Logo logo={logo_props} size={size} type={type} />;
   }
@@ -34,7 +28,7 @@ export const SwitcherIcon: FC<TSwitcherIconProps> = ({
     );
   }
   return <LabelIcon height={size} width={size} />;
-};
+}
 
 type TSwitcherLabelProps = {
   logo_props?: TLogoProps;
@@ -44,7 +38,7 @@ type TSwitcherLabelProps = {
   type?: "lucide" | "material";
 };
 
-export const SwitcherLabel: FC<TSwitcherLabelProps> = (props) => {
+export function SwitcherLabel(props: TSwitcherLabelProps) {
   const { logo_props, name, LabelIcon, logo_url, type = "lucide" } = props;
   return (
     <div className="flex items-center gap-1 text-custom-text-200">
@@ -52,4 +46,4 @@ export const SwitcherLabel: FC<TSwitcherLabelProps> = (props) => {
       {truncateText(name ?? "", 40)}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/core/activity.tsx b/apps/web/core/components/core/activity.tsx
index d50a565e5..dd05e20ca 100644
--- a/apps/web/core/components/core/activity.tsx
+++ b/apps/web/core/components/core/activity.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import { useEffect } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
@@ -37,7 +36,7 @@ import { useLabel } from "@/hooks/store/use-label";
 import { usePlatformOS } from "@/hooks/use-platform-os";
 // types
 
-export const IssueLink = ({ activity }: { activity: IIssueActivity }) => {
+export function IssueLink({ activity }: { activity: IIssueActivity }) {
   // router params
   const { workspaceSlug } = useParams();
   const { isMobile } = usePlatformOS();
@@ -73,9 +72,9 @@ export const IssueLink = ({ activity }: { activity: IIssueActivity }) => {
       )}
     </Tooltip>
   );
-};
+}
 
-const UserLink = ({ activity }: { activity: IIssueActivity }) => {
+function UserLink({ activity }: { activity: IIssueActivity }) {
   // router params
   const { workspaceSlug } = useParams();
 
@@ -91,9 +90,9 @@ const UserLink = ({ activity }: { activity: IIssueActivity }) => {
       {activity.new_value && activity.new_value !== "" ? activity.new_value : activity.old_value}
     </a>
   );
-};
+}
 
-const LabelPill = observer(({ labelId, workspaceSlug }: { labelId: string; workspaceSlug: string }) => {
+const LabelPill = observer(function LabelPill({ labelId, workspaceSlug }: { labelId: string; workspaceSlug: string }) {
   // store hooks
   const { workspaceLabels, fetchWorkspaceLabels } = useLabel();
 
@@ -751,16 +750,16 @@ const activityDetails: {
   },
 };
 
-export const ActivityIcon = ({ activity }: { activity: IIssueActivity }) => (
-  <>{activityDetails[activity.field as keyof typeof activityDetails]?.icon}</>
-);
+export function ActivityIcon({ activity }: { activity: IIssueActivity }) {
+  return <>{activityDetails[activity.field as keyof typeof activityDetails]?.icon}</>;
+}
 
 type ActivityMessageProps = {
   activity: IIssueActivity;
   showIssue?: boolean;
 };
 
-export const ActivityMessage = ({ activity, showIssue = false }: ActivityMessageProps) => {
+export function ActivityMessage({ activity, showIssue = false }: ActivityMessageProps) {
   // router params
   const { workspaceSlug } = useParams();
   const activityField = activity.field ?? "issue";
@@ -774,4 +773,4 @@ export const ActivityMessage = ({ activity, showIssue = false }: ActivityMessage
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/core/app-header.tsx b/apps/web/core/components/core/app-header.tsx
index f5f7efab4..3c363867f 100644
--- a/apps/web/core/components/core/app-header.tsx
+++ b/apps/web/core/components/core/app-header.tsx
@@ -12,7 +12,7 @@ export interface AppHeaderProps {
   mobileHeader?: ReactNode;
 }
 
-export const AppHeader = observer((props: AppHeaderProps) => {
+export const AppHeader = observer(function AppHeader(props: AppHeaderProps) {
   const { header, mobileHeader } = props;
 
   return (
diff --git a/apps/web/core/components/core/content-overflow-HOC.tsx b/apps/web/core/components/core/content-overflow-HOC.tsx
index 1bbd5896a..02725f73f 100644
--- a/apps/web/core/components/core/content-overflow-HOC.tsx
+++ b/apps/web/core/components/core/content-overflow-HOC.tsx
@@ -14,7 +14,7 @@ interface IContentOverflowWrapper {
   customButton?: ReactNode;
 }
 
-export const ContentOverflowWrapper = observer((props: IContentOverflowWrapper) => {
+export const ContentOverflowWrapper = observer(function ContentOverflowWrapper(props: IContentOverflowWrapper) {
   const {
     children,
     maxHeight = 625,
diff --git a/apps/web/core/components/core/content-wrapper.tsx b/apps/web/core/components/core/content-wrapper.tsx
index 6aa98c9db..394ca84b5 100644
--- a/apps/web/core/components/core/content-wrapper.tsx
+++ b/apps/web/core/components/core/content-wrapper.tsx
@@ -9,8 +9,10 @@ export interface ContentWrapperProps {
   children: ReactNode;
 }
 
-export const ContentWrapper = ({ className, children }: ContentWrapperProps) => (
-  <div className="h-full w-full overflow-hidden">
-    <div className={cn("relative h-full w-full overflow-x-hidden overflow-y-scroll", className)}>{children}</div>
-  </div>
-);
+export function ContentWrapper({ className, children }: ContentWrapperProps) {
+  return (
+    <div className="h-full w-full overflow-hidden">
+      <div className={cn("relative h-full w-full overflow-x-hidden overflow-y-scroll", className)}>{children}</div>
+    </div>
+  );
+}
diff --git a/apps/web/core/components/core/description-versions/dropdown-item.tsx b/apps/web/core/components/core/description-versions/dropdown-item.tsx
index e94e36cf7..3595853d7 100644
--- a/apps/web/core/components/core/description-versions/dropdown-item.tsx
+++ b/apps/web/core/components/core/description-versions/dropdown-item.tsx
@@ -12,7 +12,7 @@ type Props = {
   version: TDescriptionVersion;
 };
 
-export const DescriptionVersionsDropdownItem: React.FC<Props> = observer((props) => {
+export const DescriptionVersionsDropdownItem = observer(function DescriptionVersionsDropdownItem(props: Props) {
   const { onClick, version } = props;
   // store hooks
   const { getUserDetails } = useMember();
diff --git a/apps/web/core/components/core/description-versions/dropdown.tsx b/apps/web/core/components/core/description-versions/dropdown.tsx
index dc54e47be..d048050cb 100644
--- a/apps/web/core/components/core/description-versions/dropdown.tsx
+++ b/apps/web/core/components/core/description-versions/dropdown.tsx
@@ -18,7 +18,7 @@ type Props = {
   versions: TDescriptionVersion[] | undefined;
 };
 
-export const DescriptionVersionsDropdown: React.FC<Props> = observer((props) => {
+export const DescriptionVersionsDropdown = observer(function DescriptionVersionsDropdown(props: Props) {
   const { disabled, entityInformation, onVersionClick, versions } = props;
   // store hooks
   const { getUserDetails } = useMember();
diff --git a/apps/web/core/components/core/description-versions/modal.tsx b/apps/web/core/components/core/description-versions/modal.tsx
index 15e291494..fbb04b5c0 100644
--- a/apps/web/core/components/core/description-versions/modal.tsx
+++ b/apps/web/core/components/core/description-versions/modal.tsx
@@ -31,7 +31,7 @@ type Props = {
   workspaceSlug: string;
 };
 
-export const DescriptionVersionsModal: React.FC<Props> = observer((props) => {
+export const DescriptionVersionsModal = observer(function DescriptionVersionsModal(props: Props) {
   const {
     activeVersionDescription,
     activeVersionDetails,
diff --git a/apps/web/core/components/core/description-versions/root.tsx b/apps/web/core/components/core/description-versions/root.tsx
index 681350827..e46529351 100644
--- a/apps/web/core/components/core/description-versions/root.tsx
+++ b/apps/web/core/components/core/description-versions/root.tsx
@@ -27,7 +27,7 @@ type Props = {
   workspaceSlug: string;
 };
 
-export const DescriptionVersionsRoot: React.FC<Props> = observer((props) => {
+export const DescriptionVersionsRoot = observer(function DescriptionVersionsRoot(props: Props) {
   const { className, entityInformation, fetchHandlers, handleRestore, projectId, workspaceSlug } = props;
   // states
   const [isModalOpen, setIsModalOpen] = useState(false);
diff --git a/apps/web/core/components/core/filters/date-filter-modal.tsx b/apps/web/core/components/core/filters/date-filter-modal.tsx
index 32a407414..ecd6c6858 100644
--- a/apps/web/core/components/core/filters/date-filter-modal.tsx
+++ b/apps/web/core/components/core/filters/date-filter-modal.tsx
@@ -29,7 +29,7 @@ const defaultValues: TFormValues = {
   date2: new Date(new Date().getFullYear(), new Date().getMonth() + 1, new Date().getDate()),
 };
 
-export const DateFilterModal: React.FC<Props> = ({ title, handleClose, isOpen, onSelect }) => {
+export function DateFilterModal({ title, handleClose, isOpen, onSelect }: Props) {
   const { handleSubmit, watch, control } = useForm<TFormValues>({
     defaultValues,
   });
@@ -164,4 +164,4 @@ export const DateFilterModal: React.FC<Props> = ({ title, handleClose, isOpen, o
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/core/filters/date-filter-select.tsx b/apps/web/core/components/core/filters/date-filter-select.tsx
index b3955d4ea..dea40215d 100644
--- a/apps/web/core/components/core/filters/date-filter-select.tsx
+++ b/apps/web/core/components/core/filters/date-filter-select.tsx
@@ -35,26 +35,28 @@ const dueDateRange: DueDate[] = [
   },
 ];
 
-export const DateFilterSelect: React.FC<Props> = ({ title, value, onChange }) => (
-  <CustomSelect
-    value={value}
-    label={
-      <div className="flex items-center gap-2 text-xs">
-        {dueDateRange.find((item) => item.value === value)?.icon}
-        <span>
-          {title} {dueDateRange.find((item) => item.value === value)?.name}
-        </span>
-      </div>
-    }
-    onChange={onChange}
-  >
-    {dueDateRange.map((option, index) => (
-      <CustomSelect.Option key={index} value={option.value}>
-        <div className="flex items-center gap-2">
-          <span>{option.icon}</span>
-          {title} {option.name}
+export function DateFilterSelect({ title, value, onChange }: Props) {
+  return (
+    <CustomSelect
+      value={value}
+      label={
+        <div className="flex items-center gap-2 text-xs">
+          {dueDateRange.find((item) => item.value === value)?.icon}
+          <span>
+            {title} {dueDateRange.find((item) => item.value === value)?.name}
+          </span>
         </div>
-      </CustomSelect.Option>
-    ))}
-  </CustomSelect>
-);
+      }
+      onChange={onChange}
+    >
+      {dueDateRange.map((option, index) => (
+        <CustomSelect.Option key={index} value={option.value}>
+          <div className="flex items-center gap-2">
+            <span>{option.icon}</span>
+            {title} {option.name}
+          </div>
+        </CustomSelect.Option>
+      ))}
+    </CustomSelect>
+  );
+}
diff --git a/apps/web/core/components/core/image-picker-popover.tsx b/apps/web/core/components/core/image-picker-popover.tsx
index 2c5f8a820..ffbbc8bcc 100644
--- a/apps/web/core/components/core/image-picker-popover.tsx
+++ b/apps/web/core/components/core/image-picker-popover.tsx
@@ -51,7 +51,7 @@ type Props = {
 // services
 const fileService = new FileService();
 
-export const ImagePickerPopover: React.FC<Props> = observer((props) => {
+export const ImagePickerPopover = observer(function ImagePickerPopover(props: Props) {
   const { label, value, control, onChange, disabled = false, tabIndex, isProfileCover = false, projectId } = props;
   // states
   const [image, setImage] = useState<File | null>(null);
diff --git a/apps/web/core/components/core/list/list-item.tsx b/apps/web/core/components/core/list/list-item.tsx
index f8c1717dc..e1a8cc6cf 100644
--- a/apps/web/core/components/core/list/list-item.tsx
+++ b/apps/web/core/components/core/list/list-item.tsx
@@ -30,7 +30,7 @@ interface IListItemProps {
   rightElementClassName?: string;
 }
 
-export const ListItem: FC<IListItemProps> = (props) => {
+export function ListItem(props: IListItemProps) {
   const {
     id,
     title,
@@ -109,4 +109,4 @@ export const ListItem: FC<IListItemProps> = (props) => {
       </Row>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/core/list/list-root.tsx b/apps/web/core/components/core/list/list-root.tsx
index f8ee3a5f8..391ca2964 100644
--- a/apps/web/core/components/core/list/list-root.tsx
+++ b/apps/web/core/components/core/list/list-root.tsx
@@ -6,7 +6,7 @@ interface IListContainer {
   children: React.ReactNode;
 }
 
-export const ListLayout: FC<IListContainer> = (props) => {
+export function ListLayout(props: IListContainer) {
   const { children } = props;
   return (
     <Row
@@ -16,4 +16,4 @@ export const ListLayout: FC<IListContainer> = (props) => {
       {children}
     </Row>
   );
-};
+}
diff --git a/apps/web/core/components/core/modals/bulk-delete-issues-modal-item.tsx b/apps/web/core/components/core/modals/bulk-delete-issues-modal-item.tsx
index 8874c97b9..91347a043 100644
--- a/apps/web/core/components/core/modals/bulk-delete-issues-modal-item.tsx
+++ b/apps/web/core/components/core/modals/bulk-delete-issues-modal-item.tsx
@@ -10,7 +10,7 @@ interface Props {
   canDeleteIssueIds: boolean;
 }
 
-export const BulkDeleteIssuesModalItem: React.FC<Props> = observer((props: Props) => {
+export const BulkDeleteIssuesModalItem = observer(function BulkDeleteIssuesModalItem(props: Props) {
   const { issue, canDeleteIssueIds } = props;
 
   const color = issue.state__color;
diff --git a/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx b/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx
index 3a9420105..8bed93c16 100644
--- a/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx
+++ b/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx
@@ -42,7 +42,7 @@ type Props = {
 
 const projectService = new ProjectService();
 
-export const BulkDeleteIssuesModal: React.FC<Props> = observer((props) => {
+export const BulkDeleteIssuesModal = observer(function BulkDeleteIssuesModal(props: Props) {
   const { isOpen, onClose } = props;
   // router params
   const { workspaceSlug, projectId } = useParams();
diff --git a/apps/web/core/components/core/modals/existing-issues-list-modal.tsx b/apps/web/core/components/core/modals/existing-issues-list-modal.tsx
index 09e12fb16..8883cbf5d 100644
--- a/apps/web/core/components/core/modals/existing-issues-list-modal.tsx
+++ b/apps/web/core/components/core/modals/existing-issues-list-modal.tsx
@@ -40,7 +40,7 @@ type Props = {
 
 const projectService = new ProjectService();
 
-export const ExistingIssuesListModal: React.FC<Props> = (props) => {
+export function ExistingIssuesListModal(props: Props) {
   const { t } = useTranslation();
 
   const {
@@ -361,4 +361,4 @@ export const ExistingIssuesListModal: React.FC<Props> = (props) => {
       </Transition.Root>
     </>
   );
-};
+}
diff --git a/apps/web/core/components/core/modals/gpt-assistant-popover.tsx b/apps/web/core/components/core/modals/gpt-assistant-popover.tsx
index d157be3d7..71c3fe6e4 100644
--- a/apps/web/core/components/core/modals/gpt-assistant-popover.tsx
+++ b/apps/web/core/components/core/modals/gpt-assistant-popover.tsx
@@ -37,7 +37,7 @@ type FormData = {
   task: string;
 };
 
-export const GptAssistantPopover: React.FC<Props> = (props) => {
+export function GptAssistantPopover(props: Props) {
   const {
     isOpen,
     handleClose,
@@ -295,4 +295,4 @@ export const GptAssistantPopover: React.FC<Props> = (props) => {
       </Transition>
     </Popover>
   );
-};
+}
diff --git a/apps/web/core/components/core/modals/issue-search-modal-empty-state.tsx b/apps/web/core/components/core/modals/issue-search-modal-empty-state.tsx
index ede002b53..b3269fdbf 100644
--- a/apps/web/core/components/core/modals/issue-search-modal-empty-state.tsx
+++ b/apps/web/core/components/core/modals/issue-search-modal-empty-state.tsx
@@ -18,12 +18,7 @@ interface EmptyStateProps {
   isSearching: boolean;
 }
 
-export const IssueSearchModalEmptyState: React.FC<EmptyStateProps> = ({
-  issues,
-  searchTerm,
-  debouncedSearchTerm,
-  isSearching,
-}) => {
+export function IssueSearchModalEmptyState({ issues, searchTerm, debouncedSearchTerm, isSearching }: EmptyStateProps) {
   // theme hook
   const { resolvedTheme } = useTheme();
   // plane hooks
@@ -32,9 +27,9 @@ export const IssueSearchModalEmptyState: React.FC<EmptyStateProps> = ({
   const searchResolvedPath = resolvedTheme === "light" ? lightSearchAsset : darkSearchAsset;
   const issuesResolvedPath = resolvedTheme === "light" ? lightIssuesAsset : darkIssuesAsset;
 
-  const EmptyStateContainer = ({ children }: { children: React.ReactNode }) => (
-    <div className="flex flex-col items-center justify-center px-3 py-8 text-center">{children}</div>
-  );
+  function EmptyStateContainer({ children }: { children: React.ReactNode }) {
+    return <div className="flex flex-col items-center justify-center px-3 py-8 text-center">{children}</div>;
+  }
 
   if (issues.length === 0 && searchTerm !== "" && debouncedSearchTerm !== "" && !isSearching) {
     return (
@@ -50,4 +45,4 @@ export const IssueSearchModalEmptyState: React.FC<EmptyStateProps> = ({
     );
   }
   return null;
-};
+}
diff --git a/apps/web/core/components/core/modals/user-image-upload-modal.tsx b/apps/web/core/components/core/modals/user-image-upload-modal.tsx
index e12ca566e..1bd2c3557 100644
--- a/apps/web/core/components/core/modals/user-image-upload-modal.tsx
+++ b/apps/web/core/components/core/modals/user-image-upload-modal.tsx
@@ -23,7 +23,7 @@ type Props = {
   value: string | null;
 };
 
-export const UserImageUploadModal: React.FC<Props> = observer((props) => {
+export const UserImageUploadModal = observer(function UserImageUploadModal(props: Props) {
   const { handleRemove, isOpen, onClose, onSuccess, value } = props;
   // states
   const [image, setImage] = useState<File | null>(null);
diff --git a/apps/web/core/components/core/modals/workspace-image-upload-modal.tsx b/apps/web/core/components/core/modals/workspace-image-upload-modal.tsx
index decf80470..20d896f9f 100644
--- a/apps/web/core/components/core/modals/workspace-image-upload-modal.tsx
+++ b/apps/web/core/components/core/modals/workspace-image-upload-modal.tsx
@@ -27,7 +27,7 @@ type Props = {
 // services
 const fileService = new FileService();
 
-export const WorkspaceImageUploadModal: React.FC<Props> = observer((props) => {
+export const WorkspaceImageUploadModal = observer(function WorkspaceImageUploadModal(props: Props) {
   const { handleRemove, isOpen, onClose, onSuccess, value } = props;
   // states
   const [image, setImage] = useState<File | null>(null);
diff --git a/apps/web/core/components/core/multiple-select/entity-select-action.tsx b/apps/web/core/components/core/multiple-select/entity-select-action.tsx
index 9fc45cc50..5a1b446f3 100644
--- a/apps/web/core/components/core/multiple-select/entity-select-action.tsx
+++ b/apps/web/core/components/core/multiple-select/entity-select-action.tsx
@@ -16,7 +16,7 @@ type Props = {
   selectionHelpers: TSelectionHelper;
 };
 
-export const MultipleSelectEntityAction: React.FC<Props> = observer((props) => {
+export const MultipleSelectEntityAction = observer(function MultipleSelectEntityAction(props: Props) {
   const { className, disabled = false, groupId, id, selectionHelpers } = props;
   // derived values
   const isSelected = selectionHelpers.getIsEntitySelected(id);
diff --git a/apps/web/core/components/core/multiple-select/group-select-action.tsx b/apps/web/core/components/core/multiple-select/group-select-action.tsx
index 78b106d0f..0a343cfbe 100644
--- a/apps/web/core/components/core/multiple-select/group-select-action.tsx
+++ b/apps/web/core/components/core/multiple-select/group-select-action.tsx
@@ -13,7 +13,7 @@ type Props = {
   selectionHelpers: TSelectionHelper;
 };
 
-export const MultipleSelectGroupAction: React.FC<Props> = (props) => {
+export function MultipleSelectGroupAction(props: Props) {
   const { className, disabled = false, groupID, selectionHelpers } = props;
   // derived values
   const groupSelectionStatus = selectionHelpers.isGroupSelected(groupID);
@@ -30,4 +30,4 @@ export const MultipleSelectGroupAction: React.FC<Props> = (props) => {
       disabled={disabled}
     />
   );
-};
+}
diff --git a/apps/web/core/components/core/multiple-select/select-group.tsx b/apps/web/core/components/core/multiple-select/select-group.tsx
index 7f3aec71e..3e1d4da6b 100644
--- a/apps/web/core/components/core/multiple-select/select-group.tsx
+++ b/apps/web/core/components/core/multiple-select/select-group.tsx
@@ -10,7 +10,7 @@ type Props = {
   entities: Record<string, string[]>; // { groupID: entityIds[] }
 };
 
-export const MultipleSelectGroup: React.FC<Props> = observer((props) => {
+export const MultipleSelectGroup = observer(function MultipleSelectGroup(props: Props) {
   const { children, containerRef, disabled = false, entities } = props;
 
   const helpers = useMultipleSelect({
diff --git a/apps/web/core/components/core/page-title.tsx b/apps/web/core/components/core/page-title.tsx
index fe0a05f7d..cd5198645 100644
--- a/apps/web/core/components/core/page-title.tsx
+++ b/apps/web/core/components/core/page-title.tsx
@@ -5,7 +5,7 @@ type PageHeadTitleProps = {
   description?: string;
 };
 
-export const PageHead: React.FC<PageHeadTitleProps> = (props) => {
+export function PageHead(props: PageHeadTitleProps) {
   const { title } = props;
 
   useEffect(() => {
@@ -15,4 +15,4 @@ export const PageHead: React.FC<PageHeadTitleProps> = (props) => {
   }, [title]);
 
   return null;
-};
+}
diff --git a/apps/web/core/components/core/render-if-visible-HOC.tsx b/apps/web/core/components/core/render-if-visible-HOC.tsx
index 9e77113a8..13f809982 100644
--- a/apps/web/core/components/core/render-if-visible-HOC.tsx
+++ b/apps/web/core/components/core/render-if-visible-HOC.tsx
@@ -17,7 +17,7 @@ type Props = {
   forceRender?: boolean;
 };
 
-const RenderIfVisible: React.FC<Props> = (props) => {
+function RenderIfVisible(props: Props) {
   const {
     defaultHeight = "300px",
     root,
@@ -82,6 +82,6 @@ const RenderIfVisible: React.FC<Props> = (props) => {
   const className = isVisible || placeholderChildren ? classNames : cn(classNames, "bg-custom-background-80");
 
   return React.createElement(as, { ref: intersectionRef, style, className }, child);
-};
+}
 
 export default RenderIfVisible;
diff --git a/apps/web/core/components/core/sidebar/progress-chart.tsx b/apps/web/core/components/core/sidebar/progress-chart.tsx
index 135454cf4..190a8cc8c 100644
--- a/apps/web/core/components/core/sidebar/progress-chart.tsx
+++ b/apps/web/core/components/core/sidebar/progress-chart.tsx
@@ -11,7 +11,7 @@ type Props = {
   plotTitle?: string;
 };
 
-const ProgressChart: React.FC<Props> = ({ distribution, totalIssues, className = "", plotTitle = "work items" }) => {
+function ProgressChart({ distribution, totalIssues, className = "", plotTitle = "work items" }: Props) {
   const chartData: TChartData<string, string>[] = Object.keys(distribution ?? []).map((key, index) => ({
     name: renderFormattedDateWithoutYear(key),
     current: distribution[key] ?? 0,
@@ -65,6 +65,6 @@ const ProgressChart: React.FC<Props> = ({ distribution, totalIssues, className =
       />
     </div>
   );
-};
+}
 
 export default ProgressChart;
diff --git a/apps/web/core/components/core/sidebar/progress-stats/assignee.tsx b/apps/web/core/components/core/sidebar/progress-stats/assignee.tsx
index af36fd2c0..71fafb752 100644
--- a/apps/web/core/components/core/sidebar/progress-stats/assignee.tsx
+++ b/apps/web/core/components/core/sidebar/progress-stats/assignee.tsx
@@ -24,7 +24,7 @@ type TAssigneeStatComponent = {
   isEditable?: boolean;
 };
 
-export const AssigneeStatComponent = observer((props: TAssigneeStatComponent) => {
+export const AssigneeStatComponent = observer(function AssigneeStatComponent(props: TAssigneeStatComponent) {
   const { distribution, isEditable, selectedAssigneeIds, handleAssigneeFiltersUpdate } = props;
   const { t } = useTranslation();
   return (
diff --git a/apps/web/core/components/core/sidebar/progress-stats/label.tsx b/apps/web/core/components/core/sidebar/progress-stats/label.tsx
index 89a30ed4b..fb5b57571 100644
--- a/apps/web/core/components/core/sidebar/progress-stats/label.tsx
+++ b/apps/web/core/components/core/sidebar/progress-stats/label.tsx
@@ -21,7 +21,7 @@ type TLabelStatComponent = {
   isEditable?: boolean;
 };
 
-export const LabelStatComponent = observer((props: TLabelStatComponent) => {
+export const LabelStatComponent = observer(function LabelStatComponent(props: TLabelStatComponent) {
   const { distribution, isEditable, selectedLabelIds, handleLabelFiltersUpdate } = props;
   const { t } = useTranslation();
   return (
diff --git a/apps/web/core/components/core/sidebar/progress-stats/state_group.tsx b/apps/web/core/components/core/sidebar/progress-stats/state_group.tsx
index 317d426d6..3714c615b 100644
--- a/apps/web/core/components/core/sidebar/progress-stats/state_group.tsx
+++ b/apps/web/core/components/core/sidebar/progress-stats/state_group.tsx
@@ -19,7 +19,7 @@ type TStateGroupStatComponent = {
   isEditable?: boolean;
 };
 
-export const StateGroupStatComponent = observer((props: TStateGroupStatComponent) => {
+export const StateGroupStatComponent = observer(function StateGroupStatComponent(props: TStateGroupStatComponent) {
   const { distribution, isEditable, totalIssuesCount, selectedStateGroups, handleStateGroupFiltersUpdate } = props;
 
   return (
diff --git a/apps/web/core/components/core/sidebar/sidebar-menu-hamburger-toggle.tsx b/apps/web/core/components/core/sidebar/sidebar-menu-hamburger-toggle.tsx
index 6b0a564ad..862160a48 100644
--- a/apps/web/core/components/core/sidebar/sidebar-menu-hamburger-toggle.tsx
+++ b/apps/web/core/components/core/sidebar/sidebar-menu-hamburger-toggle.tsx
@@ -4,7 +4,7 @@ import { observer } from "mobx-react";
 import { PanelRight } from "lucide-react";
 import { useAppTheme } from "@/hooks/store/use-app-theme";
 
-export const SidebarHamburgerToggle = observer(() => {
+export const SidebarHamburgerToggle = observer(function SidebarHamburgerToggle() {
   // store hooks
   const { toggleSidebar } = useAppTheme();
 
diff --git a/apps/web/core/components/core/sidebar/single-progress-stats.tsx b/apps/web/core/components/core/sidebar/single-progress-stats.tsx
index a0443f06e..f5eacec1b 100644
--- a/apps/web/core/components/core/sidebar/single-progress-stats.tsx
+++ b/apps/web/core/components/core/sidebar/single-progress-stats.tsx
@@ -8,27 +8,23 @@ type TSingleProgressStatsProps = {
   selected?: boolean;
 };
 
-export const SingleProgressStats: React.FC<TSingleProgressStatsProps> = ({
-  title,
-  completed,
-  total,
-  onClick,
-  selected = false,
-}) => (
-  <div
-    className={`flex w-full items-center justify-between gap-4 rounded-sm p-1 text-xs ${
-      onClick ? "cursor-pointer hover:bg-custom-background-90" : ""
-    } ${selected ? "bg-custom-background-80" : ""}`}
-    onClick={onClick}
-  >
-    <div className="w-4/6">{title}</div>
-    <div className="flex w-2/6 items-center justify-end gap-1 px-2">
-      <div className="flex h-5 items-center justify-center gap-1">
-        <span className="w-8 text-right">
-          {isNaN(Math.round((completed / total) * 100)) ? "0" : Math.round((completed / total) * 100)}%
-        </span>
+export function SingleProgressStats({ title, completed, total, onClick, selected = false }: TSingleProgressStatsProps) {
+  return (
+    <div
+      className={`flex w-full items-center justify-between gap-4 rounded-sm p-1 text-xs ${
+        onClick ? "cursor-pointer hover:bg-custom-background-90" : ""
+      } ${selected ? "bg-custom-background-80" : ""}`}
+      onClick={onClick}
+    >
+      <div className="w-4/6">{title}</div>
+      <div className="flex w-2/6 items-center justify-end gap-1 px-2">
+        <div className="flex h-5 items-center justify-center gap-1">
+          <span className="w-8 text-right">
+            {isNaN(Math.round((completed / total) * 100)) ? "0" : Math.round((completed / total) * 100)}%
+          </span>
+        </div>
+        <span>of {total}</span>
       </div>
-      <span>of {total}</span>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/core/theme/color-picker-input.tsx b/apps/web/core/components/core/theme/color-picker-input.tsx
index be9bab9d5..eee05fbb7 100644
--- a/apps/web/core/components/core/theme/color-picker-input.tsx
+++ b/apps/web/core/components/core/theme/color-picker-input.tsx
@@ -33,7 +33,7 @@ type Props = {
   register: UseFormRegister<any>;
 };
 
-export const ColorPickerInput: FC<Props> = (props) => {
+export function ColorPickerInput(props: Props) {
   const { name, position = "left", watch, setValue, error, control } = props;
 
   const handleColorChange = (newColor: ColorResult) => {
@@ -128,4 +128,4 @@ export const ColorPickerInput: FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/core/theme/custom-theme-selector.tsx b/apps/web/core/components/core/theme/custom-theme-selector.tsx
index c9284755e..7224cc7b7 100644
--- a/apps/web/core/components/core/theme/custom-theme-selector.tsx
+++ b/apps/web/core/components/core/theme/custom-theme-selector.tsx
@@ -19,7 +19,7 @@ type TCustomThemeSelector = {
   applyThemeChange: (theme: Partial<IUserTheme>) => void;
 };
 
-export const CustomThemeSelector: React.FC<TCustomThemeSelector> = observer((props) => {
+export const CustomThemeSelector = observer(function CustomThemeSelector(props: TCustomThemeSelector) {
   const { applyThemeChange } = props;
   // hooks
   const { data: userProfile, updateUserTheme } = useUserProfile();
diff --git a/apps/web/core/components/core/theme/theme-switch.tsx b/apps/web/core/components/core/theme/theme-switch.tsx
index 29a2efe96..c361d7123 100644
--- a/apps/web/core/components/core/theme/theme-switch.tsx
+++ b/apps/web/core/components/core/theme/theme-switch.tsx
@@ -14,7 +14,7 @@ type Props = {
   onChange: (value: I_THEME_OPTION) => void;
 };
 
-export const ThemeSwitch: FC<Props> = (props) => {
+export function ThemeSwitch(props: Props) {
   const { value, onChange } = props;
   const { t } = useTranslation();
   return (
@@ -81,4 +81,4 @@ export const ThemeSwitch: FC<Props> = (props) => {
       ))}
     </CustomSelect>
   );
-};
+}
diff --git a/apps/web/core/components/cycles/active-cycle/cycle-stats.tsx b/apps/web/core/components/cycles/active-cycle/cycle-stats.tsx
index 4f6ffe725..e050b370a 100644
--- a/apps/web/core/components/cycles/active-cycle/cycle-stats.tsx
+++ b/apps/web/core/components/cycles/active-cycle/cycle-stats.tsx
@@ -49,7 +49,7 @@ export type ActiveCycleStatsProps = {
   cycleIssueDetails: ActiveCycleIssueDetails;
 };
 
-export const ActiveCycleStats: FC<ActiveCycleStatsProps> = observer((props) => {
+export const ActiveCycleStats = observer(function ActiveCycleStats(props: ActiveCycleStatsProps) {
   const { workspaceSlug, projectId, cycle, cycleId, handleFiltersUpdate, cycleIssueDetails } = props;
   // local storage
   const { storedValue: tab, setValue: setTab } = useLocalStorage("activeCycleTab", "Assignees");
diff --git a/apps/web/core/components/cycles/active-cycle/productivity.tsx b/apps/web/core/components/cycles/active-cycle/productivity.tsx
index 5663ff9e6..af552d06d 100644
--- a/apps/web/core/components/cycles/active-cycle/productivity.tsx
+++ b/apps/web/core/components/cycles/active-cycle/productivity.tsx
@@ -23,7 +23,7 @@ export type ActiveCycleProductivityProps = {
   cycle: ICycle | null;
 };
 
-export const ActiveCycleProductivity: FC<ActiveCycleProductivityProps> = observer((props) => {
+export const ActiveCycleProductivity = observer(function ActiveCycleProductivity(props: ActiveCycleProductivityProps) {
   const { workspaceSlug, projectId, cycle } = props;
   // theme hook
   const { resolvedTheme } = useTheme();
diff --git a/apps/web/core/components/cycles/active-cycle/progress.tsx b/apps/web/core/components/cycles/active-cycle/progress.tsx
index 1e2812d60..eb07ab42e 100644
--- a/apps/web/core/components/cycles/active-cycle/progress.tsx
+++ b/apps/web/core/components/cycles/active-cycle/progress.tsx
@@ -22,7 +22,7 @@ export type ActiveCycleProgressProps = {
   handleFiltersUpdate: (conditions: TWorkItemFilterCondition[]) => void;
 };
 
-export const ActiveCycleProgress: FC<ActiveCycleProgressProps> = observer((props) => {
+export const ActiveCycleProgress = observer(function ActiveCycleProgress(props: ActiveCycleProgressProps) {
   const { handleFiltersUpdate, cycle } = props;
   // theme hook
   const { resolvedTheme } = useTheme();
diff --git a/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx b/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx
index 100311e78..bee54e9ca 100644
--- a/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx
+++ b/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx
@@ -54,7 +54,7 @@ export const validateCycleSnapshot = (cycleDetails: ICycle | null): ICycle | nul
   return updatedCycleDetails;
 };
 
-export const CycleAnalyticsProgress: FC<TCycleAnalyticsProgress> = observer((props) => {
+export const CycleAnalyticsProgress = observer(function CycleAnalyticsProgress(props: TCycleAnalyticsProgress) {
   // props
   const { workspaceSlug, projectId, cycleId } = props;
   // router
diff --git a/apps/web/core/components/cycles/analytics-sidebar/progress-stats.tsx b/apps/web/core/components/cycles/analytics-sidebar/progress-stats.tsx
index 2072a30df..1a83379b0 100644
--- a/apps/web/core/components/cycles/analytics-sidebar/progress-stats.tsx
+++ b/apps/web/core/components/cycles/analytics-sidebar/progress-stats.tsx
@@ -35,7 +35,7 @@ type TCycleProgressStats = {
   totalIssuesCount: number;
 };
 
-export const CycleProgressStats: FC<TCycleProgressStats> = observer((props) => {
+export const CycleProgressStats = observer(function CycleProgressStats(props: TCycleProgressStats) {
   const {
     cycleId,
     distribution,
diff --git a/apps/web/core/components/cycles/analytics-sidebar/root.tsx b/apps/web/core/components/cycles/analytics-sidebar/root.tsx
index ebe3711f2..3b81c056b 100644
--- a/apps/web/core/components/cycles/analytics-sidebar/root.tsx
+++ b/apps/web/core/components/cycles/analytics-sidebar/root.tsx
@@ -18,7 +18,7 @@ type Props = {
   workspaceSlug: string;
 };
 
-export const CycleDetailsSidebar: React.FC<Props> = observer((props) => {
+export const CycleDetailsSidebar = observer(function CycleDetailsSidebar(props: Props) {
   const { handleClose, isArchived, projectId, workspaceSlug, cycleId } = props;
 
   // store hooks
diff --git a/apps/web/core/components/cycles/analytics-sidebar/sidebar-details.tsx b/apps/web/core/components/cycles/analytics-sidebar/sidebar-details.tsx
index 7c6e6b4ed..ba990b3c3 100644
--- a/apps/web/core/components/cycles/analytics-sidebar/sidebar-details.tsx
+++ b/apps/web/core/components/cycles/analytics-sidebar/sidebar-details.tsx
@@ -23,7 +23,7 @@ type Props = {
   cycleDetails: ICycle;
 };
 
-export const CycleSidebarDetails: FC<Props> = observer((props) => {
+export const CycleSidebarDetails = observer(function CycleSidebarDetails(props: Props) {
   const { projectId, cycleDetails } = props;
   // hooks
   const { getUserDetails } = useMember();
diff --git a/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx b/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx
index 41129e9c0..7b1632904 100644
--- a/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx
+++ b/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx
@@ -43,7 +43,7 @@ const defaultValues: Partial<ICycle> = {
 
 const cycleService = new CycleService();
 
-export const CycleSidebarHeader: FC<Props> = observer((props) => {
+export const CycleSidebarHeader = observer(function CycleSidebarHeader(props: Props) {
   const { workspaceSlug, projectId, cycleDetails, handleClose, isArchived = false } = props;
   // hooks
   const { allowPermissions } = useUserPermissions();
diff --git a/apps/web/core/components/cycles/applied-filters/date.tsx b/apps/web/core/components/cycles/applied-filters/date.tsx
index e8156fafc..055073993 100644
--- a/apps/web/core/components/cycles/applied-filters/date.tsx
+++ b/apps/web/core/components/cycles/applied-filters/date.tsx
@@ -11,7 +11,7 @@ type Props = {
   values: string[];
 };
 
-export const AppliedDateFilters: React.FC<Props> = observer((props) => {
+export const AppliedDateFilters = observer(function AppliedDateFilters(props: Props) {
   const { editable, handleRemove, values } = props;
 
   const getDateLabel = (value: string): string => {
diff --git a/apps/web/core/components/cycles/applied-filters/root.tsx b/apps/web/core/components/cycles/applied-filters/root.tsx
index 59ebf55cb..98f73b67b 100644
--- a/apps/web/core/components/cycles/applied-filters/root.tsx
+++ b/apps/web/core/components/cycles/applied-filters/root.tsx
@@ -21,7 +21,7 @@ type Props = {
 
 const DATE_FILTERS = ["start_date", "end_date"];
 
-export const CycleAppliedFiltersList: React.FC<Props> = observer((props) => {
+export const CycleAppliedFiltersList = observer(function CycleAppliedFiltersList(props: Props) {
   const { appliedFilters, handleClearAllFilters, handleRemoveFilter, alwaysAllowEditing } = props;
   // store hooks
   const { allowPermissions } = useUserPermissions();
diff --git a/apps/web/core/components/cycles/applied-filters/status.tsx b/apps/web/core/components/cycles/applied-filters/status.tsx
index e54edf6b7..b0df0382d 100644
--- a/apps/web/core/components/cycles/applied-filters/status.tsx
+++ b/apps/web/core/components/cycles/applied-filters/status.tsx
@@ -10,7 +10,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedStatusFilters: React.FC<Props> = observer((props) => {
+export const AppliedStatusFilters = observer(function AppliedStatusFilters(props: Props) {
   const { handleRemove, values, editable } = props;
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/cycles/archived-cycles/header.tsx b/apps/web/core/components/cycles/archived-cycles/header.tsx
index 50e8fd67a..89bae48aa 100644
--- a/apps/web/core/components/cycles/archived-cycles/header.tsx
+++ b/apps/web/core/components/cycles/archived-cycles/header.tsx
@@ -18,7 +18,7 @@ import { useCycleFilter } from "@/hooks/store/use-cycle-filter";
 // local imports
 import { CycleFiltersSelection } from "../dropdowns";
 
-export const ArchivedCyclesHeader: FC = observer(() => {
+export const ArchivedCyclesHeader = observer(function ArchivedCyclesHeader() {
   // router
   const { projectId } = useParams();
   // refs
diff --git a/apps/web/core/components/cycles/archived-cycles/modal.tsx b/apps/web/core/components/cycles/archived-cycles/modal.tsx
index 3f83ad540..9f7affca8 100644
--- a/apps/web/core/components/cycles/archived-cycles/modal.tsx
+++ b/apps/web/core/components/cycles/archived-cycles/modal.tsx
@@ -20,7 +20,7 @@ type Props = {
   onSubmit?: () => Promise<void>;
 };
 
-export const ArchiveCycleModal: React.FC<Props> = (props) => {
+export function ArchiveCycleModal(props: Props) {
   const { workspaceSlug, projectId, cycleId, isOpen, handleClose } = props;
   // router
   const router = useAppRouter();
@@ -118,4 +118,4 @@ export const ArchiveCycleModal: React.FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/cycles/archived-cycles/root.tsx b/apps/web/core/components/cycles/archived-cycles/root.tsx
index a171b9aa5..5df6a512e 100644
--- a/apps/web/core/components/cycles/archived-cycles/root.tsx
+++ b/apps/web/core/components/cycles/archived-cycles/root.tsx
@@ -16,7 +16,7 @@ import { useCycleFilter } from "@/hooks/store/use-cycle-filter";
 import { CycleAppliedFiltersList } from "../applied-filters";
 import { ArchivedCyclesView } from "./view";
 
-export const ArchivedCycleLayoutRoot: React.FC = observer(() => {
+export const ArchivedCycleLayoutRoot = observer(function ArchivedCycleLayoutRoot() {
   // router
   const { workspaceSlug, projectId } = useParams();
   // plane hooks
diff --git a/apps/web/core/components/cycles/archived-cycles/view.tsx b/apps/web/core/components/cycles/archived-cycles/view.tsx
index db6dc8327..1ed1650b0 100644
--- a/apps/web/core/components/cycles/archived-cycles/view.tsx
+++ b/apps/web/core/components/cycles/archived-cycles/view.tsx
@@ -16,7 +16,7 @@ export interface IArchivedCyclesView {
   projectId: string;
 }
 
-export const ArchivedCyclesView: FC<IArchivedCyclesView> = observer((props) => {
+export const ArchivedCyclesView = observer(function ArchivedCyclesView(props: IArchivedCyclesView) {
   const { workspaceSlug, projectId } = props;
   // store hooks
   const { getFilteredArchivedCycleIds, loader } = useCycle();
diff --git a/apps/web/core/components/cycles/cycle-peek-overview.tsx b/apps/web/core/components/cycles/cycle-peek-overview.tsx
index 817a6a283..07e21acd3 100644
--- a/apps/web/core/components/cycles/cycle-peek-overview.tsx
+++ b/apps/web/core/components/cycles/cycle-peek-overview.tsx
@@ -14,7 +14,7 @@ type Props = {
   isArchived?: boolean;
 };
 
-export const CyclePeekOverview: React.FC<Props> = observer((props) => {
+export const CyclePeekOverview = observer(function CyclePeekOverview(props: Props) {
   const { projectId: propsProjectId, workspaceSlug, isArchived } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/cycles/cycles-view-header.tsx b/apps/web/core/components/cycles/cycles-view-header.tsx
index 1cc782f59..8b7f0a7bd 100644
--- a/apps/web/core/components/cycles/cycles-view-header.tsx
+++ b/apps/web/core/components/cycles/cycles-view-header.tsx
@@ -20,7 +20,7 @@ type Props = {
   projectId: string;
 };
 
-export const CyclesViewHeader: React.FC<Props> = observer((props) => {
+export const CyclesViewHeader = observer(function CyclesViewHeader(props: Props) {
   const { projectId } = props;
   // refs
   const inputRef = useRef<HTMLInputElement>(null);
diff --git a/apps/web/core/components/cycles/cycles-view.tsx b/apps/web/core/components/cycles/cycles-view.tsx
index 17fff9dcd..e957df68f 100644
--- a/apps/web/core/components/cycles/cycles-view.tsx
+++ b/apps/web/core/components/cycles/cycles-view.tsx
@@ -17,7 +17,7 @@ export interface ICyclesView {
   projectId: string;
 }
 
-export const CyclesView: FC<ICyclesView> = observer((props) => {
+export const CyclesView = observer(function CyclesView(props: ICyclesView) {
   const { workspaceSlug, projectId } = props;
   // store hooks
   const { getFilteredCycleIds, getFilteredCompletedCycleIds, loader, currentProjectActiveCycleId } = useCycle();
diff --git a/apps/web/core/components/cycles/delete-modal.tsx b/apps/web/core/components/cycles/delete-modal.tsx
index 2a4067252..bddd5eaac 100644
--- a/apps/web/core/components/cycles/delete-modal.tsx
+++ b/apps/web/core/components/cycles/delete-modal.tsx
@@ -24,7 +24,7 @@ interface ICycleDelete {
   projectId: string;
 }
 
-export const CycleDeleteModal: React.FC<ICycleDelete> = observer((props) => {
+export const CycleDeleteModal = observer(function CycleDeleteModal(props: ICycleDelete) {
   const { isOpen, handleClose, cycle, workspaceSlug, projectId } = props;
   // states
   const [loader, setLoader] = useState(false);
diff --git a/apps/web/core/components/cycles/dropdowns/estimate-type-dropdown.tsx b/apps/web/core/components/cycles/dropdowns/estimate-type-dropdown.tsx
index 56761b3ee..c5b596db7 100644
--- a/apps/web/core/components/cycles/dropdowns/estimate-type-dropdown.tsx
+++ b/apps/web/core/components/cycles/dropdowns/estimate-type-dropdown.tsx
@@ -16,7 +16,7 @@ type TProps = {
   cycleId: string;
 };
 
-export const EstimateTypeDropdown = observer((props: TProps) => {
+export const EstimateTypeDropdown = observer(function EstimateTypeDropdown(props: TProps) {
   const { value, onChange, projectId, cycleId, showDefault = false } = props;
   const { getIsPointsDataAvailable } = useCycle();
   const { areEstimateEnabledByProjectId, currentProjectEstimateType } = useProjectEstimates();
diff --git a/apps/web/core/components/cycles/dropdowns/filters/end-date.tsx b/apps/web/core/components/cycles/dropdowns/filters/end-date.tsx
index 1dbf1a3d9..2f9457404 100644
--- a/apps/web/core/components/cycles/dropdowns/filters/end-date.tsx
+++ b/apps/web/core/components/cycles/dropdowns/filters/end-date.tsx
@@ -13,7 +13,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterEndDate: React.FC<Props> = observer((props) => {
+export const FilterEndDate = observer(function FilterEndDate(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
 
   const [previewEnabled, setPreviewEnabled] = useState(true);
diff --git a/apps/web/core/components/cycles/dropdowns/filters/root.tsx b/apps/web/core/components/cycles/dropdowns/filters/root.tsx
index 148de9946..c87992235 100644
--- a/apps/web/core/components/cycles/dropdowns/filters/root.tsx
+++ b/apps/web/core/components/cycles/dropdowns/filters/root.tsx
@@ -17,7 +17,7 @@ type Props = {
   isArchived?: boolean;
 };
 
-export const CycleFiltersSelection: React.FC<Props> = observer((props) => {
+export const CycleFiltersSelection = observer(function CycleFiltersSelection(props: Props) {
   const { filters, handleFiltersUpdate, isArchived = false } = props;
   // states
   const [filtersSearchQuery, setFiltersSearchQuery] = useState("");
diff --git a/apps/web/core/components/cycles/dropdowns/filters/start-date.tsx b/apps/web/core/components/cycles/dropdowns/filters/start-date.tsx
index 8ac3aa676..dd420c138 100644
--- a/apps/web/core/components/cycles/dropdowns/filters/start-date.tsx
+++ b/apps/web/core/components/cycles/dropdowns/filters/start-date.tsx
@@ -15,7 +15,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterStartDate: React.FC<Props> = observer((props) => {
+export const FilterStartDate = observer(function FilterStartDate(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
   const [previewEnabled, setPreviewEnabled] = useState(true);
   const [isDateFilterModalOpen, setIsDateFilterModalOpen] = useState(false);
diff --git a/apps/web/core/components/cycles/dropdowns/filters/status.tsx b/apps/web/core/components/cycles/dropdowns/filters/status.tsx
index 482aaabd6..bb30bafbd 100644
--- a/apps/web/core/components/cycles/dropdowns/filters/status.tsx
+++ b/apps/web/core/components/cycles/dropdowns/filters/status.tsx
@@ -14,7 +14,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterStatus: React.FC<Props> = observer((props) => {
+export const FilterStatus = observer(function FilterStatus(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
   // states
   const [previewEnabled, setPreviewEnabled] = useState(true);
diff --git a/apps/web/core/components/cycles/form.tsx b/apps/web/core/components/cycles/form.tsx
index 8206501c9..34855763b 100644
--- a/apps/web/core/components/cycles/form.tsx
+++ b/apps/web/core/components/cycles/form.tsx
@@ -34,7 +34,7 @@ const defaultValues: Partial<ICycle> = {
   end_date: null,
 };
 
-export const CycleForm: React.FC<Props> = (props) => {
+export function CycleForm(props: Props) {
   const { handleFormSubmit, handleClose, status, projectId, setActiveProject, data, isMobile = false } = props;
   // plane hooks
   const { t } = useTranslation();
@@ -195,4 +195,4 @@ export const CycleForm: React.FC<Props> = (props) => {
       </div>
     </form>
   );
-};
+}
diff --git a/apps/web/core/components/cycles/list/cycle-list-group-header.tsx b/apps/web/core/components/cycles/list/cycle-list-group-header.tsx
index 074bc500c..7df122b2d 100644
--- a/apps/web/core/components/cycles/list/cycle-list-group-header.tsx
+++ b/apps/web/core/components/cycles/list/cycle-list-group-header.tsx
@@ -18,7 +18,7 @@ type Props = {
   isExpanded?: boolean;
 };
 
-export const CycleListGroupHeader: FC<Props> = (props) => {
+export function CycleListGroupHeader(props: Props) {
   const { type, title, count, showCount = false, isExpanded = false } = props;
   return (
     <Row className="flex items-center justify-between py-2.5">
@@ -39,4 +39,4 @@ export const CycleListGroupHeader: FC<Props> = (props) => {
       />
     </Row>
   );
-};
+}
diff --git a/apps/web/core/components/cycles/list/cycle-list-item-action.tsx b/apps/web/core/components/cycles/list/cycle-list-item-action.tsx
index 8b78e5790..6317732d8 100644
--- a/apps/web/core/components/cycles/list/cycle-list-item-action.tsx
+++ b/apps/web/core/components/cycles/list/cycle-list-item-action.tsx
@@ -54,7 +54,7 @@ const defaultValues: Partial<ICycle> = {
   end_date: null,
 };
 
-export const CycleListItemAction: FC<Props> = observer((props) => {
+export const CycleListItemAction = observer(function CycleListItemAction(props: Props) {
   const { workspaceSlug, projectId, cycleId, cycleDetails, parentRef, isActive = false } = props;
   // router
   const { projectId: routerProjectId } = useParams();
diff --git a/apps/web/core/components/cycles/list/cycle-list-project-group-header.tsx b/apps/web/core/components/cycles/list/cycle-list-project-group-header.tsx
index eddfee582..c5fe15fad 100644
--- a/apps/web/core/components/cycles/list/cycle-list-project-group-header.tsx
+++ b/apps/web/core/components/cycles/list/cycle-list-project-group-header.tsx
@@ -18,7 +18,7 @@ type Props = {
   isExpanded?: boolean;
 };
 
-export const CycleListProjectGroupHeader: FC<Props> = observer((props) => {
+export const CycleListProjectGroupHeader = observer(function CycleListProjectGroupHeader(props: Props) {
   const { projectId, count, showCount = false, isExpanded = false } = props;
   // store hooks
   const { getProjectById } = useProject();
diff --git a/apps/web/core/components/cycles/list/cycles-list-item.tsx b/apps/web/core/components/cycles/list/cycles-list-item.tsx
index 2b1f827fb..1149ae8ca 100644
--- a/apps/web/core/components/cycles/list/cycles-list-item.tsx
+++ b/apps/web/core/components/cycles/list/cycles-list-item.tsx
@@ -29,7 +29,7 @@ type TCyclesListItem = {
   className?: string;
 };
 
-export const CyclesListItem: FC<TCyclesListItem> = observer((props) => {
+export const CyclesListItem = observer(function CyclesListItem(props: TCyclesListItem) {
   const { cycleId, workspaceSlug, projectId, className = "" } = props;
   // refs
   const parentRef = useRef(null);
diff --git a/apps/web/core/components/cycles/list/cycles-list-map.tsx b/apps/web/core/components/cycles/list/cycles-list-map.tsx
index 52954b2bb..887f026c8 100644
--- a/apps/web/core/components/cycles/list/cycles-list-map.tsx
+++ b/apps/web/core/components/cycles/list/cycles-list-map.tsx
@@ -7,7 +7,7 @@ type Props = {
   workspaceSlug: string;
 };
 
-export const CyclesListMap: React.FC<Props> = (props) => {
+export function CyclesListMap(props: Props) {
   const { cycleIds, projectId, workspaceSlug } = props;
 
   return (
@@ -17,4 +17,4 @@ export const CyclesListMap: React.FC<Props> = (props) => {
       ))}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/cycles/list/root.tsx b/apps/web/core/components/cycles/list/root.tsx
index f50363e24..f0f479b7a 100644
--- a/apps/web/core/components/cycles/list/root.tsx
+++ b/apps/web/core/components/cycles/list/root.tsx
@@ -21,7 +21,7 @@ export interface ICyclesList {
   isArchived?: boolean;
 }
 
-export const CyclesList: FC<ICyclesList> = observer((props) => {
+export const CyclesList = observer(function CyclesList(props: ICyclesList) {
   const { completedCycleIds, upcomingCycleIds, cycleIds, workspaceSlug, projectId, isArchived = false } = props;
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/cycles/modal.tsx b/apps/web/core/components/cycles/modal.tsx
index 4a6d3cbe2..1e3819633 100644
--- a/apps/web/core/components/cycles/modal.tsx
+++ b/apps/web/core/components/cycles/modal.tsx
@@ -31,7 +31,7 @@ type CycleModalProps = {
 // services
 const cycleService = new CycleService();
 
-export const CycleCreateUpdateModal: React.FC<CycleModalProps> = (props) => {
+export function CycleCreateUpdateModal(props: CycleModalProps) {
   const { isOpen, handleClose, data, workspaceSlug, projectId } = props;
   // states
   const [activeProject, setActiveProject] = useState<string | null>(null);
@@ -206,4 +206,4 @@ export const CycleCreateUpdateModal: React.FC<CycleModalProps> = (props) => {
       />
     </ModalCore>
   );
-};
+}
diff --git a/apps/web/core/components/cycles/quick-actions.tsx b/apps/web/core/components/cycles/quick-actions.tsx
index 242e91eca..128a302bb 100644
--- a/apps/web/core/components/cycles/quick-actions.tsx
+++ b/apps/web/core/components/cycles/quick-actions.tsx
@@ -38,7 +38,7 @@ type Props = {
   customClassName?: string;
 };
 
-export const CycleQuickActions: React.FC<Props> = observer((props) => {
+export const CycleQuickActions = observer(function CycleQuickActions(props: Props) {
   const { parentRef, cycleId, projectId, workspaceSlug, customClassName } = props;
   // router
   const router = useAppRouter();
@@ -170,15 +170,18 @@ export const CycleQuickActions: React.FC<Props> = observer((props) => {
 
   if (endCycleContextMenu) MENU_ITEMS.splice(3, 0, endCycleContextMenu);
 
-  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map((item) => ({
-    ...item,
-    action: () => {
-      captureClick({
-        elementName: CYCLE_TRACKER_ELEMENTS.CONTEXT_MENU,
-      });
-      item.action();
-    },
-  }));
+  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map(function CONTEXT_MENU_ITEMS(item) {
+    return {
+      ...item,
+
+      action: () => {
+        captureClick({
+          elementName: CYCLE_TRACKER_ELEMENTS.CONTEXT_MENU,
+        });
+        item.action();
+      },
+    };
+  });
 
   return (
     <>
diff --git a/apps/web/core/components/cycles/transfer-issues-modal.tsx b/apps/web/core/components/cycles/transfer-issues-modal.tsx
index 71e93237d..e03d83d29 100644
--- a/apps/web/core/components/cycles/transfer-issues-modal.tsx
+++ b/apps/web/core/components/cycles/transfer-issues-modal.tsx
@@ -19,7 +19,7 @@ type Props = {
   cycleId: string;
 };
 
-export const TransferIssuesModal: React.FC<Props> = observer((props) => {
+export const TransferIssuesModal = observer(function TransferIssuesModal(props: Props) {
   const { isOpen, handleClose, cycleId } = props;
   // states
   const [query, setQuery] = useState("");
diff --git a/apps/web/core/components/cycles/transfer-issues.tsx b/apps/web/core/components/cycles/transfer-issues.tsx
index bcc1b7615..e612e6584 100644
--- a/apps/web/core/components/cycles/transfer-issues.tsx
+++ b/apps/web/core/components/cycles/transfer-issues.tsx
@@ -11,7 +11,7 @@ type Props = {
   disabled?: boolean;
 };
 
-export const TransferIssues: React.FC<Props> = (props) => {
+export function TransferIssues(props: Props) {
   const { handleClick, canTransferIssues = false, disabled = false } = props;
   return (
     <div className="-mt-2 mb-4 flex items-center justify-between px-4 pt-6">
@@ -34,4 +34,4 @@ export const TransferIssues: React.FC<Props> = (props) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/dropdowns/buttons.tsx b/apps/web/core/components/dropdowns/buttons.tsx
index b3d5355bd..f77ad8ca6 100644
--- a/apps/web/core/components/dropdowns/buttons.tsx
+++ b/apps/web/core/components/dropdowns/buttons.tsx
@@ -29,7 +29,7 @@ type ButtonProps = {
   renderToolTipByDefault?: boolean;
 };
 
-export const DropdownButton: React.FC<DropdownButtonProps> = (props) => {
+export function DropdownButton(props: DropdownButtonProps) {
   const {
     children,
     className,
@@ -58,9 +58,9 @@ export const DropdownButton: React.FC<DropdownButtonProps> = (props) => {
       {children}
     </ButtonToRender>
   );
-};
+}
 
-const BorderButton: React.FC<ButtonProps> = (props) => {
+function BorderButton(props: ButtonProps) {
   const { children, className, isActive, tooltipContent, renderToolTipByDefault, tooltipHeading, showTooltip } = props;
   const { isMobile } = usePlatformOS();
 
@@ -83,9 +83,9 @@ const BorderButton: React.FC<ButtonProps> = (props) => {
       </div>
     </Tooltip>
   );
-};
+}
 
-const BackgroundButton: React.FC<ButtonProps> = (props) => {
+function BackgroundButton(props: ButtonProps) {
   const { children, className, tooltipContent, tooltipHeading, renderToolTipByDefault, showTooltip } = props;
   const { isMobile } = usePlatformOS();
   return (
@@ -106,9 +106,9 @@ const BackgroundButton: React.FC<ButtonProps> = (props) => {
       </div>
     </Tooltip>
   );
-};
+}
 
-const TransparentButton: React.FC<ButtonProps> = (props) => {
+function TransparentButton(props: ButtonProps) {
   const { children, className, isActive, tooltipContent, tooltipHeading, renderToolTipByDefault, showTooltip } = props;
   const { isMobile } = usePlatformOS();
   return (
@@ -130,4 +130,4 @@ const TransparentButton: React.FC<ButtonProps> = (props) => {
       </div>
     </Tooltip>
   );
-};
+}
diff --git a/apps/web/core/components/dropdowns/cycle/cycle-options.tsx b/apps/web/core/components/dropdowns/cycle/cycle-options.tsx
index 3bde0dfca..dcbb80c54 100644
--- a/apps/web/core/components/dropdowns/cycle/cycle-options.tsx
+++ b/apps/web/core/components/dropdowns/cycle/cycle-options.tsx
@@ -37,7 +37,7 @@ type CycleOptionsProps = {
   currentCycleId?: string;
 };
 
-export const CycleOptions: FC<CycleOptionsProps> = observer((props) => {
+export const CycleOptions = observer(function CycleOptions(props: CycleOptionsProps) {
   const { projectId, isOpen, referenceElement, placement, canRemoveCycle, currentCycleId } = props;
   // i18n
   const { t } = useTranslation();
diff --git a/apps/web/core/components/dropdowns/cycle/index.tsx b/apps/web/core/components/dropdowns/cycle/index.tsx
index cb2df4683..fbfe654e9 100644
--- a/apps/web/core/components/dropdowns/cycle/index.tsx
+++ b/apps/web/core/components/dropdowns/cycle/index.tsx
@@ -31,7 +31,7 @@ type Props = TDropdownProps & {
   currentCycleId?: string;
 };
 
-export const CycleDropdown: React.FC<Props> = observer((props) => {
+export const CycleDropdown = observer(function CycleDropdown(props: Props) {
   const {
     button,
     buttonClassName,
diff --git a/apps/web/core/components/dropdowns/date-range.tsx b/apps/web/core/components/dropdowns/date-range.tsx
index 222698042..bc579b9e4 100644
--- a/apps/web/core/components/dropdowns/date-range.tsx
+++ b/apps/web/core/components/dropdowns/date-range.tsx
@@ -66,7 +66,7 @@ type Props = {
   renderInPortal?: boolean;
 };
 
-export const DateRangeDropdown: React.FC<Props> = observer((props) => {
+export const DateRangeDropdown = observer(function DateRangeDropdown(props: Props) {
   const { t } = useTranslation();
   const {
     buttonClassName,
diff --git a/apps/web/core/components/dropdowns/date.tsx b/apps/web/core/components/dropdowns/date.tsx
index a8272dd4b..6bc0553d1 100644
--- a/apps/web/core/components/dropdowns/date.tsx
+++ b/apps/web/core/components/dropdowns/date.tsx
@@ -39,7 +39,7 @@ type Props = TDropdownProps & {
   renderByDefault?: boolean;
 };
 
-export const DateDropdown: React.FC<Props> = observer((props) => {
+export const DateDropdown = observer(function DateDropdown(props: Props) {
   const {
     buttonClassName = "",
     buttonContainerClassName,
diff --git a/apps/web/core/components/dropdowns/estimate.tsx b/apps/web/core/components/dropdowns/estimate.tsx
index ea7c59b6e..03a8ff6b7 100644
--- a/apps/web/core/components/dropdowns/estimate.tsx
+++ b/apps/web/core/components/dropdowns/estimate.tsx
@@ -40,7 +40,7 @@ type DropdownOptions =
     }[]
   | undefined;
 
-export const EstimateDropdown: React.FC<Props> = observer((props) => {
+export const EstimateDropdown = observer(function EstimateDropdown(props: Props) {
   const {
     button,
     buttonClassName,
diff --git a/apps/web/core/components/dropdowns/layout.tsx b/apps/web/core/components/dropdowns/layout.tsx
index 56a8a7a94..07f581711 100644
--- a/apps/web/core/components/dropdowns/layout.tsx
+++ b/apps/web/core/components/dropdowns/layout.tsx
@@ -16,7 +16,7 @@ type TLayoutDropDown = {
   disabledLayouts?: EIssueLayoutTypes[];
 };
 
-export const LayoutDropDown = observer((props: TLayoutDropDown) => {
+export const LayoutDropDown = observer(function LayoutDropDown(props: TLayoutDropDown) {
   const { onChange, value = EIssueLayoutTypes.LIST, disabledLayouts = [] } = props;
   // plane i18n
   const { t } = useTranslation();
diff --git a/apps/web/core/components/dropdowns/member/avatar.tsx b/apps/web/core/components/dropdowns/member/avatar.tsx
index 826369abb..f406d386b 100644
--- a/apps/web/core/components/dropdowns/member/avatar.tsx
+++ b/apps/web/core/components/dropdowns/member/avatar.tsx
@@ -18,7 +18,7 @@ type AvatarProps = {
   size?: "sm" | "md" | "base" | "lg" | number;
 };
 
-export const ButtonAvatars: React.FC<AvatarProps> = observer((props) => {
+export const ButtonAvatars = observer(function ButtonAvatars(props: AvatarProps) {
   const { showTooltip, userIds, icon: Icon, size = "md" } = props;
   // store hooks
   const { getUserDetails } = useMember();
diff --git a/apps/web/core/components/dropdowns/member/base.tsx b/apps/web/core/components/dropdowns/member/base.tsx
index 779b89310..b783ff396 100644
--- a/apps/web/core/components/dropdowns/member/base.tsx
+++ b/apps/web/core/components/dropdowns/member/base.tsx
@@ -27,7 +27,7 @@ type TMemberDropdownBaseProps = {
   renderByDefault?: boolean;
 } & MemberDropdownProps;
 
-export const MemberDropdownBase: React.FC<TMemberDropdownBaseProps> = observer((props) => {
+export const MemberDropdownBase = observer(function MemberDropdownBase(props: TMemberDropdownBaseProps) {
   const { t } = useTranslation();
   const {
     button,
diff --git a/apps/web/core/components/dropdowns/member/dropdown.tsx b/apps/web/core/components/dropdowns/member/dropdown.tsx
index 8708b880c..b573bc074 100644
--- a/apps/web/core/components/dropdowns/member/dropdown.tsx
+++ b/apps/web/core/components/dropdowns/member/dropdown.tsx
@@ -16,7 +16,7 @@ type TMemberDropdownProps = {
   renderByDefault?: boolean;
 } & MemberDropdownProps;
 
-export const MemberDropdown: React.FC<TMemberDropdownProps> = observer((props) => {
+export const MemberDropdown = observer(function MemberDropdown(props: TMemberDropdownProps) {
   const { memberIds: propsMemberIds, projectId } = props;
   // router params
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/dropdowns/member/member-options.tsx b/apps/web/core/components/dropdowns/member/member-options.tsx
index f89396225..1c4af7eee 100644
--- a/apps/web/core/components/dropdowns/member/member-options.tsx
+++ b/apps/web/core/components/dropdowns/member/member-options.tsx
@@ -31,7 +31,7 @@ interface Props {
   referenceElement: HTMLButtonElement | null;
 }
 
-export const MemberOptions: React.FC<Props> = observer((props: Props) => {
+export const MemberOptions = observer(function MemberOptions(props: Props) {
   const {
     getUserDetails,
     isOpen,
diff --git a/apps/web/core/components/dropdowns/merged-date.tsx b/apps/web/core/components/dropdowns/merged-date.tsx
index 92a3d1e82..bbf337ac7 100644
--- a/apps/web/core/components/dropdowns/merged-date.tsx
+++ b/apps/web/core/components/dropdowns/merged-date.tsx
@@ -16,7 +16,7 @@ type Props = {
  * - Same year, different month: "Jan 24 - Feb 6, 2025"
  * - Different year: "Dec 28, 2024 - Jan 4, 2025"
  */
-export const MergedDateDisplay: React.FC<Props> = observer((props) => {
+export const MergedDateDisplay = observer(function MergedDateDisplay(props: Props) {
   const { startDate, endDate, className = "" } = props;
 
   // Parse dates
diff --git a/apps/web/core/components/dropdowns/module/base.tsx b/apps/web/core/components/dropdowns/module/base.tsx
index 7743c28ea..886f98d2a 100644
--- a/apps/web/core/components/dropdowns/module/base.tsx
+++ b/apps/web/core/components/dropdowns/module/base.tsx
@@ -43,7 +43,7 @@ type TModuleDropdownBaseProps = TDropdownProps & {
       }
   );
 
-export const ModuleDropdownBase: React.FC<TModuleDropdownBaseProps> = observer((props) => {
+export const ModuleDropdownBase = observer(function ModuleDropdownBase(props: TModuleDropdownBaseProps) {
   const {
     button,
     buttonClassName,
diff --git a/apps/web/core/components/dropdowns/module/button-content.tsx b/apps/web/core/components/dropdowns/module/button-content.tsx
index 0aa2940d8..cdcb1745d 100644
--- a/apps/web/core/components/dropdowns/module/button-content.tsx
+++ b/apps/web/core/components/dropdowns/module/button-content.tsx
@@ -22,7 +22,7 @@ type ModuleButtonContentProps = {
   className?: string;
 };
 
-export const ModuleButtonContent: React.FC<ModuleButtonContentProps> = (props) => {
+export function ModuleButtonContent(props: ModuleButtonContentProps) {
   const {
     disabled,
     dropdownArrow,
@@ -126,4 +126,4 @@ export const ModuleButtonContent: React.FC<ModuleButtonContentProps> = (props) =
         )}
       </>
     );
-};
+}
diff --git a/apps/web/core/components/dropdowns/module/dropdown.tsx b/apps/web/core/components/dropdowns/module/dropdown.tsx
index 8465765a0..3e73545f4 100644
--- a/apps/web/core/components/dropdowns/module/dropdown.tsx
+++ b/apps/web/core/components/dropdowns/module/dropdown.tsx
@@ -32,7 +32,7 @@ type TModuleDropdownProps = TDropdownProps & {
       }
   );
 
-export const ModuleDropdown: React.FC<TModuleDropdownProps> = observer((props) => {
+export const ModuleDropdown = observer(function ModuleDropdown(props: TModuleDropdownProps) {
   const { projectId } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/dropdowns/module/module-options.tsx b/apps/web/core/components/dropdowns/module/module-options.tsx
index 6cc629012..da9f39ad1 100644
--- a/apps/web/core/components/dropdowns/module/module-options.tsx
+++ b/apps/web/core/components/dropdowns/module/module-options.tsx
@@ -32,7 +32,7 @@ interface Props {
   referenceElement: HTMLButtonElement | null;
 }
 
-export const ModuleOptions = observer((props: Props) => {
+export const ModuleOptions = observer(function ModuleOptions(props: Props) {
   const { getModuleById, isOpen, moduleIds, multiple, onDropdownOpen, placement, referenceElement } = props;
   // refs
   const inputRef = useRef<HTMLInputElement | null>(null);
diff --git a/apps/web/core/components/dropdowns/priority.tsx b/apps/web/core/components/dropdowns/priority.tsx
index e987821fd..0608f94bd 100644
--- a/apps/web/core/components/dropdowns/priority.tsx
+++ b/apps/web/core/components/dropdowns/priority.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import type { ReactNode } from "react";
 import { Fragment, useRef, useState } from "react";
 import { useTheme } from "next-themes";
@@ -49,7 +48,7 @@ type ButtonProps = {
   renderToolTipByDefault?: boolean;
 };
 
-const BorderButton = (props: ButtonProps) => {
+function BorderButton(props: ButtonProps) {
   const {
     className,
     dropdownArrow,
@@ -130,9 +129,9 @@ const BorderButton = (props: ButtonProps) => {
       </div>
     </Tooltip>
   );
-};
+}
 
-const BackgroundButton = (props: ButtonProps) => {
+function BackgroundButton(props: ButtonProps) {
   const {
     className,
     dropdownArrow,
@@ -215,9 +214,9 @@ const BackgroundButton = (props: ButtonProps) => {
       </div>
     </Tooltip>
   );
-};
+}
 
-const TransparentButton = (props: ButtonProps) => {
+function TransparentButton(props: ButtonProps) {
   const {
     className,
     dropdownArrow,
@@ -302,9 +301,9 @@ const TransparentButton = (props: ButtonProps) => {
       </div>
     </Tooltip>
   );
-};
+}
 
-export const PriorityDropdown: React.FC<Props> = (props) => {
+export function PriorityDropdown(props: Props) {
   //hooks
   const { t } = useTranslation();
   const {
@@ -504,4 +503,4 @@ export const PriorityDropdown: React.FC<Props> = (props) => {
       )}
     </ComboDropDown>
   );
-};
+}
diff --git a/apps/web/core/components/dropdowns/project/base.tsx b/apps/web/core/components/dropdowns/project/base.tsx
index 2027f22fc..2488a3784 100644
--- a/apps/web/core/components/dropdowns/project/base.tsx
+++ b/apps/web/core/components/dropdowns/project/base.tsx
@@ -43,7 +43,7 @@ type Props = TDropdownProps & {
       }
   );
 
-export const ProjectDropdownBase: React.FC<Props> = observer((props) => {
+export const ProjectDropdownBase = observer(function ProjectDropdownBase(props: Props) {
   const {
     button,
     buttonClassName,
diff --git a/apps/web/core/components/dropdowns/project/dropdown.tsx b/apps/web/core/components/dropdowns/project/dropdown.tsx
index 61a6d58a8..1d5933052 100644
--- a/apps/web/core/components/dropdowns/project/dropdown.tsx
+++ b/apps/web/core/components/dropdowns/project/dropdown.tsx
@@ -27,7 +27,7 @@ type Props = TDropdownProps & {
       }
   );
 
-export const ProjectDropdown: React.FC<Props> = observer((props) => {
+export const ProjectDropdown = observer(function ProjectDropdown(props: Props) {
   // store hooks
   const { joinedProjectIds, getProjectById } = useProject();
 
diff --git a/apps/web/core/components/dropdowns/state/base.tsx b/apps/web/core/components/dropdowns/state/base.tsx
index d7ab1f808..fbe05a3ec 100644
--- a/apps/web/core/components/dropdowns/state/base.tsx
+++ b/apps/web/core/components/dropdowns/state/base.tsx
@@ -41,7 +41,9 @@ export type TWorkItemStateDropdownBaseProps = TDropdownProps & {
   value: string | undefined | null;
 };
 
-export const WorkItemStateDropdownBase: React.FC<TWorkItemStateDropdownBaseProps> = observer((props) => {
+export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdownBase(
+  props: TWorkItemStateDropdownBaseProps
+) {
   const {
     button,
     buttonClassName,
diff --git a/apps/web/core/components/dropdowns/state/dropdown.tsx b/apps/web/core/components/dropdowns/state/dropdown.tsx
index b119a20ad..c51b2a633 100644
--- a/apps/web/core/components/dropdowns/state/dropdown.tsx
+++ b/apps/web/core/components/dropdowns/state/dropdown.tsx
@@ -16,7 +16,7 @@ type TWorkItemStateDropdownProps = Omit<
   stateIds?: string[];
 };
 
-export const StateDropdown: React.FC<TWorkItemStateDropdownProps> = observer((props) => {
+export const StateDropdown = observer(function StateDropdown(props: TWorkItemStateDropdownProps) {
   const { projectId, stateIds: propsStateIds } = props;
   // router params
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/editor/document/editor.tsx b/apps/web/core/components/editor/document/editor.tsx
index bbb7a54e0..e6a5f1895 100644
--- a/apps/web/core/components/editor/document/editor.tsx
+++ b/apps/web/core/components/editor/document/editor.tsx
@@ -33,7 +33,10 @@ type DocumentEditorWrapperProps = MakeOptional<
       }
   );
 
-export const DocumentEditor = forwardRef<EditorRefApi, DocumentEditorWrapperProps>((props, ref) => {
+export const DocumentEditor = forwardRef(function DocumentEditor(
+  props: DocumentEditorWrapperProps,
+  ref: React.ForwardedRef<EditorRefApi>
+) {
   const {
     containerClassName,
     editable,
diff --git a/apps/web/core/components/editor/embeds/mentions/root.tsx b/apps/web/core/components/editor/embeds/mentions/root.tsx
index bc27dd82f..6f83f064f 100644
--- a/apps/web/core/components/editor/embeds/mentions/root.tsx
+++ b/apps/web/core/components/editor/embeds/mentions/root.tsx
@@ -4,7 +4,7 @@ import { EditorAdditionalMentionsRoot } from "@/plane-web/components/editor/embe
 // local imports
 import { EditorUserMention } from "./user";
 
-export const EditorMentionsRoot: React.FC<TEditorMentionComponentProps> = (props) => {
+export function EditorMentionsRoot(props: TEditorMentionComponentProps) {
   const { entity_identifier, entity_name } = props;
 
   switch (entity_name) {
@@ -13,4 +13,4 @@ export const EditorMentionsRoot: React.FC<TEditorMentionComponentProps> = (props
     default:
       return <EditorAdditionalMentionsRoot {...props} />;
   }
-};
+}
diff --git a/apps/web/core/components/editor/embeds/mentions/user.tsx b/apps/web/core/components/editor/embeds/mentions/user.tsx
index 206682fba..9be7b5173 100644
--- a/apps/web/core/components/editor/embeds/mentions/user.tsx
+++ b/apps/web/core/components/editor/embeds/mentions/user.tsx
@@ -14,7 +14,7 @@ type Props = {
   id: string;
 };
 
-export const EditorUserMention: React.FC<Props> = observer((props) => {
+export const EditorUserMention = observer(function EditorUserMention(props: Props) {
   const { id } = props;
   // router
   const { projectId } = useParams();
diff --git a/apps/web/core/components/editor/lite-text/editor.tsx b/apps/web/core/components/editor/lite-text/editor.tsx
index e352849ba..b260fce72 100644
--- a/apps/web/core/components/editor/lite-text/editor.tsx
+++ b/apps/web/core/components/editor/lite-text/editor.tsx
@@ -49,7 +49,10 @@ type LiteTextEditorWrapperProps = MakeOptional<
       }
   );
 
-export const LiteTextEditor = React.forwardRef<EditorRefApi, LiteTextEditorWrapperProps>((props, ref) => {
+export const LiteTextEditor = React.forwardRef(function LiteTextEditor(
+  props: LiteTextEditorWrapperProps,
+  ref: React.ForwardedRef<EditorRefApi>
+) {
   const { t } = useTranslation();
   const {
     containerClassName,
diff --git a/apps/web/core/components/editor/lite-text/lite-toolbar.tsx b/apps/web/core/components/editor/lite-text/lite-toolbar.tsx
index 970a7f4f4..362142eca 100644
--- a/apps/web/core/components/editor/lite-text/lite-toolbar.tsx
+++ b/apps/web/core/components/editor/lite-text/lite-toolbar.tsx
@@ -11,24 +11,26 @@ type LiteToolbarProps = {
   executeCommand: (item: ToolbarMenuItem) => void;
 };
 
-export const LiteToolbar = ({ onSubmit, isSubmitting, isEmpty, executeCommand }: LiteToolbarProps) => (
-  <div className="flex items-center gap-2 pb-1">
-    <button
-      onClick={() => executeCommand(IMAGE_ITEM)}
-      type="button"
-      className="p-1 text-custom-text-300 hover:text-custom-text-200 transition-colors"
-    >
-      <Paperclip className="size-3" />
-    </button>
-    <button
-      type="button"
-      onClick={(e) => onSubmit(e)}
-      disabled={isEmpty || isSubmitting}
-      className="p-1 bg-custom-primary-100 hover:bg-custom-primary-200 disabled:bg-custom-text-400 disabled:text-custom-text-200 text-custom-text-100 rounded transition-colors"
-    >
-      <ArrowUp className="size-3" />
-    </button>
-  </div>
-);
+export function LiteToolbar({ onSubmit, isSubmitting, isEmpty, executeCommand }: LiteToolbarProps) {
+  return (
+    <div className="flex items-center gap-2 pb-1">
+      <button
+        onClick={() => executeCommand(IMAGE_ITEM)}
+        type="button"
+        className="p-1 text-custom-text-300 hover:text-custom-text-200 transition-colors"
+      >
+        <Paperclip className="size-3" />
+      </button>
+      <button
+        type="button"
+        onClick={(e) => onSubmit(e)}
+        disabled={isEmpty || isSubmitting}
+        className="p-1 bg-custom-primary-100 hover:bg-custom-primary-200 disabled:bg-custom-text-400 disabled:text-custom-text-200 text-custom-text-100 rounded transition-colors"
+      >
+        <ArrowUp className="size-3" />
+      </button>
+    </div>
+  );
+}
 
 export type { LiteToolbarProps };
diff --git a/apps/web/core/components/editor/lite-text/toolbar.tsx b/apps/web/core/components/editor/lite-text/toolbar.tsx
index 3d1b11df7..c6941c6e6 100644
--- a/apps/web/core/components/editor/lite-text/toolbar.tsx
+++ b/apps/web/core/components/editor/lite-text/toolbar.tsx
@@ -50,7 +50,7 @@ const COMMENT_ACCESS_SPECIFIERS: TCommentAccessType[] = [
 
 const toolbarItems = TOOLBAR_ITEMS.lite;
 
-export const IssueCommentToolbar: React.FC<Props> = (props) => {
+export function IssueCommentToolbar(props: Props) {
   const { t } = useTranslation();
   const {
     accessSpecifier,
@@ -184,4 +184,4 @@ export const IssueCommentToolbar: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/editor/pdf/document.tsx b/apps/web/core/components/editor/pdf/document.tsx
index 6887c3f63..4a1a9ea42 100644
--- a/apps/web/core/components/editor/pdf/document.tsx
+++ b/apps/web/core/components/editor/pdf/document.tsx
@@ -45,7 +45,7 @@ type Props = {
   pageFormat: PageProps["size"];
 };
 
-export const PDFDocument: React.FC<Props> = (props) => {
+export function PDFDocument(props: Props) {
   const { content, pageFormat } = props;
 
   return (
@@ -61,4 +61,4 @@ export const PDFDocument: React.FC<Props> = (props) => {
       </Page>
     </Document>
   );
-};
+}
diff --git a/apps/web/core/components/editor/rich-text/description-input/loader.tsx b/apps/web/core/components/editor/rich-text/description-input/loader.tsx
index 47bd597e3..2d3a068ee 100644
--- a/apps/web/core/components/editor/rich-text/description-input/loader.tsx
+++ b/apps/web/core/components/editor/rich-text/description-input/loader.tsx
@@ -6,7 +6,7 @@ type Props = {
   className?: string;
 };
 
-export const DescriptionInputLoader: React.FC<Props> = (props) => {
+export function DescriptionInputLoader(props: Props) {
   const { className } = props;
 
   return (
@@ -30,4 +30,4 @@ export const DescriptionInputLoader: React.FC<Props> = (props) => {
       </div>
     </Loader>
   );
-};
+}
diff --git a/apps/web/core/components/editor/rich-text/description-input/root.tsx b/apps/web/core/components/editor/rich-text/description-input/root.tsx
index f098b9616..dc865aaf1 100644
--- a/apps/web/core/components/editor/rich-text/description-input/root.tsx
+++ b/apps/web/core/components/editor/rich-text/description-input/root.tsx
@@ -89,7 +89,7 @@ type Props = {
  * @description DescriptionInput component for rich text editor with autosave functionality using debounce
  * The component also makes an API call to save the description on unmount
  */
-export const DescriptionInput: React.FC<Props> = observer((props) => {
+export const DescriptionInput = observer(function DescriptionInput(props: Props) {
   const {
     containerClassName,
     disabled,
diff --git a/apps/web/core/components/editor/rich-text/editor.tsx b/apps/web/core/components/editor/rich-text/editor.tsx
index 271c46d8c..4164ef643 100644
--- a/apps/web/core/components/editor/rich-text/editor.tsx
+++ b/apps/web/core/components/editor/rich-text/editor.tsx
@@ -33,7 +33,10 @@ type RichTextEditorWrapperProps = MakeOptional<
       }
   );
 
-export const RichTextEditor = forwardRef<EditorRefApi, RichTextEditorWrapperProps>((props, ref) => {
+export const RichTextEditor = forwardRef(function RichTextEditor(
+  props: RichTextEditorWrapperProps,
+  ref: React.ForwardedRef<EditorRefApi>
+) {
   const {
     containerClassName,
     editable,
diff --git a/apps/web/core/components/editor/sticky-editor/color-palette.tsx b/apps/web/core/components/editor/sticky-editor/color-palette.tsx
index 0403d41b5..45c79e073 100644
--- a/apps/web/core/components/editor/sticky-editor/color-palette.tsx
+++ b/apps/web/core/components/editor/sticky-editor/color-palette.tsx
@@ -51,7 +51,7 @@ type TProps = {
   handleUpdate: (data: Partial<TSticky>) => Promise<void>;
 };
 
-export const ColorPalette = (props: TProps) => {
+export function ColorPalette(props: TProps) {
   const { handleUpdate } = props;
   return (
     <div className="absolute z-10 bottom-5 left-0 w-56 shadow p-2 rounded-md bg-custom-background-100 mb-2">
@@ -75,4 +75,4 @@ export const ColorPalette = (props: TProps) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/editor/sticky-editor/editor.tsx b/apps/web/core/components/editor/sticky-editor/editor.tsx
index 502cad20e..0f927731d 100644
--- a/apps/web/core/components/editor/sticky-editor/editor.tsx
+++ b/apps/web/core/components/editor/sticky-editor/editor.tsx
@@ -37,7 +37,10 @@ interface StickyEditorWrapperProps
   handleDelete: () => void;
 }
 
-export const StickyEditor = React.forwardRef<EditorRefApi, StickyEditorWrapperProps>((props, ref) => {
+export const StickyEditor = React.forwardRef(function StickyEditor(
+  props: StickyEditorWrapperProps,
+  ref: React.ForwardedRef<EditorRefApi>
+) {
   const {
     containerClassName,
     workspaceSlug,
diff --git a/apps/web/core/components/editor/sticky-editor/toolbar.tsx b/apps/web/core/components/editor/sticky-editor/toolbar.tsx
index 0a41515a0..25ba27e30 100644
--- a/apps/web/core/components/editor/sticky-editor/toolbar.tsx
+++ b/apps/web/core/components/editor/sticky-editor/toolbar.tsx
@@ -24,7 +24,7 @@ type Props = {
 
 const toolbarItems = TOOLBAR_ITEMS.sticky;
 
-export const StickyEditorToolbar: React.FC<Props> = (props) => {
+export function StickyEditorToolbar(props: Props) {
   const { executeCommand, editorRef, handleColorChange, handleDelete } = props;
 
   // State to manage active states of toolbar items
@@ -133,4 +133,4 @@ export const StickyEditorToolbar: React.FC<Props> = (props) => {
       </Tooltip>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/empty-state/comic-box-button.tsx b/apps/web/core/components/empty-state/comic-box-button.tsx
index 1ef4ef312..a61f30e80 100644
--- a/apps/web/core/components/empty-state/comic-box-button.tsx
+++ b/apps/web/core/components/empty-state/comic-box-button.tsx
@@ -17,7 +17,7 @@ type Props = {
   disabled?: boolean;
 };
 
-export const ComicBoxButton: React.FC<Props> = (props) => {
+export function ComicBoxButton(props: Props) {
   const { label, icon, title, description, onClick, disabled = false } = props;
   const [isHovered, setIsHovered] = useState(false);
 
@@ -77,4 +77,4 @@ export const ComicBoxButton: React.FC<Props> = (props) => {
       )}
     </Popover>
   );
-};
+}
diff --git a/apps/web/core/components/empty-state/detailed-empty-state-root.tsx b/apps/web/core/components/empty-state/detailed-empty-state-root.tsx
index 69252650f..e32323ef6 100644
--- a/apps/web/core/components/empty-state/detailed-empty-state-root.tsx
+++ b/apps/web/core/components/empty-state/detailed-empty-state-root.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import React from "react";
 import { observer } from "mobx-react";
 // ui
@@ -35,7 +34,7 @@ const sizeClasses = {
   lg: "md:min-w-[30rem] max-w-[60rem]",
 } as const;
 
-const CustomButton = ({
+function CustomButton({
   config,
   variant,
   size,
@@ -43,20 +42,22 @@ const CustomButton = ({
   config: ButtonConfig;
   variant: "primary" | "neutral-primary";
   size: EmptyStateSize;
-}) => (
-  <Button
-    variant={variant}
-    size={size}
-    onClick={config.onClick}
-    prependIcon={config.prependIcon}
-    appendIcon={config.appendIcon}
-    disabled={config.disabled}
-  >
-    {config.text}
-  </Button>
-);
+}) {
+  return (
+    <Button
+      variant={variant}
+      size={size}
+      onClick={config.onClick}
+      prependIcon={config.prependIcon}
+      appendIcon={config.appendIcon}
+      disabled={config.disabled}
+    >
+      {config.text}
+    </Button>
+  );
+}
 
-export const DetailedEmptyState: React.FC<Props> = observer((props) => {
+export const DetailedEmptyState = observer(function DetailedEmptyState(props: Props) {
   const {
     title,
     description,
diff --git a/apps/web/core/components/empty-state/section-empty-state-root.tsx b/apps/web/core/components/empty-state/section-empty-state-root.tsx
index 164663f07..5a414ec5a 100644
--- a/apps/web/core/components/empty-state/section-empty-state-root.tsx
+++ b/apps/web/core/components/empty-state/section-empty-state-root.tsx
@@ -11,7 +11,7 @@ type Props = {
   customClassName?: string;
 };
 
-export const SectionEmptyState: FC<Props> = (props) => {
+export function SectionEmptyState(props: Props) {
   const { title, description, icon, actionElement, customClassName } = props;
   return (
     <div
@@ -28,4 +28,4 @@ export const SectionEmptyState: FC<Props> = (props) => {
       {actionElement && <>{actionElement}</>}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/empty-state/simple-empty-state-root.tsx b/apps/web/core/components/empty-state/simple-empty-state-root.tsx
index 03fc838cf..50f6723d9 100644
--- a/apps/web/core/components/empty-state/simple-empty-state-root.tsx
+++ b/apps/web/core/components/empty-state/simple-empty-state-root.tsx
@@ -30,7 +30,7 @@ const getTitleClassName = (hasDescription: boolean) =>
     "text-lg text-custom-text-300": hasDescription,
   });
 
-export const SimpleEmptyState = observer((props: Props) => {
+export const SimpleEmptyState = observer(function SimpleEmptyState(props: Props) {
   const { title, description, size = "sm", assetPath } = props;
 
   return (
diff --git a/apps/web/core/components/estimates/create/modal.tsx b/apps/web/core/components/estimates/create/modal.tsx
index aac52c1f7..ae16dc7d7 100644
--- a/apps/web/core/components/estimates/create/modal.tsx
+++ b/apps/web/core/components/estimates/create/modal.tsx
@@ -24,7 +24,7 @@ type TCreateEstimateModal = {
   handleClose: () => void;
 };
 
-export const CreateEstimateModal: FC<TCreateEstimateModal> = observer((props) => {
+export const CreateEstimateModal = observer(function CreateEstimateModal(props: TCreateEstimateModal) {
   // props
   const { workspaceSlug, projectId, isOpen, handleClose } = props;
   // hooks
diff --git a/apps/web/core/components/estimates/create/stage-one.tsx b/apps/web/core/components/estimates/create/stage-one.tsx
index 94fc26463..7a9631662 100644
--- a/apps/web/core/components/estimates/create/stage-one.tsx
+++ b/apps/web/core/components/estimates/create/stage-one.tsx
@@ -21,7 +21,7 @@ type TEstimateCreateStageOne = {
   handleEstimatePoints: (value: string) => void;
 };
 
-export const EstimateCreateStageOne: FC<TEstimateCreateStageOne> = (props) => {
+export function EstimateCreateStageOne(props: TEstimateCreateStageOne) {
   const { estimateSystem, handleEstimateSystem, handleEstimatePoints } = props;
 
   // i18n
@@ -116,6 +116,6 @@ export const EstimateCreateStageOne: FC<TEstimateCreateStageOne> = (props) => {
       )}
     </div>
   );
-};
+}
 
 //
diff --git a/apps/web/core/components/estimates/delete/modal.tsx b/apps/web/core/components/estimates/delete/modal.tsx
index ea38b3f36..69b00adbc 100644
--- a/apps/web/core/components/estimates/delete/modal.tsx
+++ b/apps/web/core/components/estimates/delete/modal.tsx
@@ -22,7 +22,7 @@ type TDeleteEstimateModal = {
   handleClose: () => void;
 };
 
-export const DeleteEstimateModal: FC<TDeleteEstimateModal> = observer((props) => {
+export const DeleteEstimateModal = observer(function DeleteEstimateModal(props: TDeleteEstimateModal) {
   // props
   const { workspaceSlug, projectId, estimateId, isOpen, handleClose } = props;
   // hooks
diff --git a/apps/web/core/components/estimates/empty-screen.tsx b/apps/web/core/components/estimates/empty-screen.tsx
index 706888ce0..6ca8205dd 100644
--- a/apps/web/core/components/estimates/empty-screen.tsx
+++ b/apps/web/core/components/estimates/empty-screen.tsx
@@ -14,7 +14,7 @@ type TEstimateEmptyScreen = {
   onButtonClick: () => void;
 };
 
-export const EstimateEmptyScreen: FC<TEstimateEmptyScreen> = (props) => {
+export function EstimateEmptyScreen(props: TEstimateEmptyScreen) {
   // props
   const { onButtonClick } = props;
   const { resolvedTheme } = useTheme();
@@ -45,4 +45,4 @@ export const EstimateEmptyScreen: FC<TEstimateEmptyScreen> = (props) => {
       }}
     />
   );
-};
+}
diff --git a/apps/web/core/components/estimates/estimate-disable-switch.tsx b/apps/web/core/components/estimates/estimate-disable-switch.tsx
index 31bcb369c..10ed72dd4 100644
--- a/apps/web/core/components/estimates/estimate-disable-switch.tsx
+++ b/apps/web/core/components/estimates/estimate-disable-switch.tsx
@@ -17,7 +17,7 @@ type TEstimateDisableSwitch = {
   isAdmin: boolean;
 };
 
-export const EstimateDisableSwitch: FC<TEstimateDisableSwitch> = observer((props) => {
+export const EstimateDisableSwitch = observer(function EstimateDisableSwitch(props: TEstimateDisableSwitch) {
   const { workspaceSlug, projectId, isAdmin } = props;
   // i18n
   const { t } = useTranslation();
diff --git a/apps/web/core/components/estimates/estimate-list-item.tsx b/apps/web/core/components/estimates/estimate-list-item.tsx
index aa8c06a69..d46dbc076 100644
--- a/apps/web/core/components/estimates/estimate-list-item.tsx
+++ b/apps/web/core/components/estimates/estimate-list-item.tsx
@@ -18,7 +18,7 @@ type TEstimateListItem = {
   onDeleteClick?: (estimateId: string) => void;
 };
 
-export const EstimateListItem: FC<TEstimateListItem> = observer((props) => {
+export const EstimateListItem = observer(function EstimateListItem(props: TEstimateListItem) {
   const { estimateId, isAdmin, isEstimateEnabled, isEditable } = props;
   // hooks
   const { estimateById } = useProjectEstimates();
diff --git a/apps/web/core/components/estimates/estimate-list.tsx b/apps/web/core/components/estimates/estimate-list.tsx
index 699e6a685..f52055e76 100644
--- a/apps/web/core/components/estimates/estimate-list.tsx
+++ b/apps/web/core/components/estimates/estimate-list.tsx
@@ -12,7 +12,7 @@ type TEstimateList = {
   onDeleteClick?: (estimateId: string) => void;
 };
 
-export const EstimateList: FC<TEstimateList> = observer((props) => {
+export const EstimateList = observer(function EstimateList(props: TEstimateList) {
   const { estimateIds, isAdmin, isEstimateEnabled = false, isEditable = false, onEditClick, onDeleteClick } = props;
 
   if (!estimateIds || estimateIds?.length <= 0) return <></>;
diff --git a/apps/web/core/components/estimates/estimate-search.tsx b/apps/web/core/components/estimates/estimate-search.tsx
index 78e22237f..d67403c9d 100644
--- a/apps/web/core/components/estimates/estimate-search.tsx
+++ b/apps/web/core/components/estimates/estimate-search.tsx
@@ -1,7 +1,7 @@
 import type { FC } from "react";
 import { observer } from "mobx-react";
 
-export const EstimateSearch: FC = observer(() => {
+export const EstimateSearch = observer(function EstimateSearch() {
   // hooks
   const {} = {};
 
diff --git a/apps/web/core/components/estimates/inputs/number-input.tsx b/apps/web/core/components/estimates/inputs/number-input.tsx
index 63f4d2118..fec63a73d 100644
--- a/apps/web/core/components/estimates/inputs/number-input.tsx
+++ b/apps/web/core/components/estimates/inputs/number-input.tsx
@@ -5,7 +5,7 @@ type TEstimateNumberInputProps = {
   handleEstimateInputValue: (value: string) => void;
 };
 
-export const EstimateNumberInput: FC<TEstimateNumberInputProps> = (props) => {
+export function EstimateNumberInput(props: TEstimateNumberInputProps) {
   const { value, handleEstimateInputValue } = props;
 
   // i18n
@@ -21,4 +21,4 @@ export const EstimateNumberInput: FC<TEstimateNumberInputProps> = (props) => {
       type="number"
     />
   );
-};
+}
diff --git a/apps/web/core/components/estimates/inputs/root.tsx b/apps/web/core/components/estimates/inputs/root.tsx
index bd32c2e29..117f68fe7 100644
--- a/apps/web/core/components/estimates/inputs/root.tsx
+++ b/apps/web/core/components/estimates/inputs/root.tsx
@@ -14,7 +14,7 @@ type TEstimateInputRootProps = {
   value?: string;
 };
 
-export const EstimateInputRoot: FC<TEstimateInputRootProps> = (props) => {
+export function EstimateInputRoot(props: TEstimateInputRootProps) {
   const { estimateType, handleEstimateInputValue, value } = props;
 
   switch (estimateType) {
@@ -37,4 +37,4 @@ export const EstimateInputRoot: FC<TEstimateInputRootProps> = (props) => {
     default:
       return null;
   }
-};
+}
diff --git a/apps/web/core/components/estimates/inputs/text-input.tsx b/apps/web/core/components/estimates/inputs/text-input.tsx
index 989798ea4..2e6d6552c 100644
--- a/apps/web/core/components/estimates/inputs/text-input.tsx
+++ b/apps/web/core/components/estimates/inputs/text-input.tsx
@@ -5,7 +5,7 @@ type TEstimateTextInputProps = {
   handleEstimateInputValue: (value: string) => void;
 };
 
-export const EstimateTextInput: FC<TEstimateTextInputProps> = (props) => {
+export function EstimateTextInput(props: TEstimateTextInputProps) {
   const { value, handleEstimateInputValue } = props;
 
   // i18n
@@ -21,4 +21,4 @@ export const EstimateTextInput: FC<TEstimateTextInputProps> = (props) => {
       type="text"
     />
   );
-};
+}
diff --git a/apps/web/core/components/estimates/loader-screen.tsx b/apps/web/core/components/estimates/loader-screen.tsx
index 6e1fc5c21..3dc159ed1 100644
--- a/apps/web/core/components/estimates/loader-screen.tsx
+++ b/apps/web/core/components/estimates/loader-screen.tsx
@@ -3,11 +3,13 @@
 import type { FC } from "react";
 import { Loader } from "@plane/ui";
 
-export const EstimateLoaderScreen: FC = () => (
-  <Loader className="mt-5 space-y-5">
-    <Loader.Item height="40px" />
-    <Loader.Item height="40px" />
-    <Loader.Item height="40px" />
-    <Loader.Item height="40px" />
-  </Loader>
-);
+export function EstimateLoaderScreen() {
+  return (
+    <Loader className="mt-5 space-y-5">
+      <Loader.Item height="40px" />
+      <Loader.Item height="40px" />
+      <Loader.Item height="40px" />
+      <Loader.Item height="40px" />
+    </Loader>
+  );
+}
diff --git a/apps/web/core/components/estimates/points/create-root.tsx b/apps/web/core/components/estimates/points/create-root.tsx
index 99958c8d1..2a736d260 100644
--- a/apps/web/core/components/estimates/points/create-root.tsx
+++ b/apps/web/core/components/estimates/points/create-root.tsx
@@ -30,7 +30,7 @@ type TEstimatePointCreateRoot = {
   ) => void;
 };
 
-export const EstimatePointCreateRoot: FC<TEstimatePointCreateRoot> = observer((props) => {
+export const EstimatePointCreateRoot = observer(function EstimatePointCreateRoot(props: TEstimatePointCreateRoot) {
   // props
   const {
     workspaceSlug,
diff --git a/apps/web/core/components/estimates/points/create.tsx b/apps/web/core/components/estimates/points/create.tsx
index 0ab88fc9d..9b585293f 100644
--- a/apps/web/core/components/estimates/points/create.tsx
+++ b/apps/web/core/components/estimates/points/create.tsx
@@ -31,7 +31,7 @@ type TEstimatePointCreate = {
   handleEstimatePointError?: (newValue: string, message: string | undefined, mode?: "add" | "delete") => void;
 };
 
-export const EstimatePointCreate: FC<TEstimatePointCreate> = observer((props) => {
+export const EstimatePointCreate = observer(function EstimatePointCreate(props: TEstimatePointCreate) {
   const {
     workspaceSlug,
     projectId,
diff --git a/apps/web/core/components/estimates/points/preview.tsx b/apps/web/core/components/estimates/points/preview.tsx
index 6c21bea05..9f2c03e0f 100644
--- a/apps/web/core/components/estimates/points/preview.tsx
+++ b/apps/web/core/components/estimates/points/preview.tsx
@@ -26,7 +26,7 @@ type TEstimatePointItemPreview = {
   handleEstimatePointError?: (newValue: string, message: string | undefined) => void;
 };
 
-export const EstimatePointItemPreview: FC<TEstimatePointItemPreview> = observer((props) => {
+export const EstimatePointItemPreview = observer(function EstimatePointItemPreview(props: TEstimatePointItemPreview) {
   const {
     workspaceSlug,
     projectId,
diff --git a/apps/web/core/components/estimates/points/update.tsx b/apps/web/core/components/estimates/points/update.tsx
index 381969fa1..0c682512a 100644
--- a/apps/web/core/components/estimates/points/update.tsx
+++ b/apps/web/core/components/estimates/points/update.tsx
@@ -32,7 +32,7 @@ type TEstimatePointUpdate = {
   handleEstimatePointError?: (newValue: string, message: string | undefined, mode?: "add" | "delete") => void;
 };
 
-export const EstimatePointUpdate: FC<TEstimatePointUpdate> = observer((props) => {
+export const EstimatePointUpdate = observer(function EstimatePointUpdate(props: TEstimatePointUpdate) {
   const {
     workspaceSlug,
     projectId,
diff --git a/apps/web/core/components/estimates/radio-select.tsx b/apps/web/core/components/estimates/radio-select.tsx
index ffc36a6b6..7077a1182 100644
--- a/apps/web/core/components/estimates/radio-select.tsx
+++ b/apps/web/core/components/estimates/radio-select.tsx
@@ -17,7 +17,7 @@ type RadioInputProps = {
   className?: string;
 };
 
-export const RadioInput = ({
+export function RadioInput({
   name = "radio-input",
   label: inputLabel,
   labelClassName: inputLabelClassName = "",
@@ -30,7 +30,7 @@ export const RadioInput = ({
   ariaLabel,
   onChange,
   className,
-}: RadioInputProps) => {
+}: RadioInputProps) {
   const wrapperClass = vertical ? "flex flex-col gap-1" : "flex gap-2";
 
   const setSelected = (value: string) => {
@@ -80,4 +80,4 @@ export const RadioInput = ({
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/estimates/root.tsx b/apps/web/core/components/estimates/root.tsx
index 9e6f9bd7b..b3dd0c798 100644
--- a/apps/web/core/components/estimates/root.tsx
+++ b/apps/web/core/components/estimates/root.tsx
@@ -24,7 +24,7 @@ type TEstimateRoot = {
   isAdmin: boolean;
 };
 
-export const EstimateRoot: FC<TEstimateRoot> = observer((props) => {
+export const EstimateRoot = observer(function EstimateRoot(props: TEstimateRoot) {
   const { workspaceSlug, projectId, isAdmin } = props;
   // hooks
   const { currentProjectDetails } = useProject();
diff --git a/apps/web/core/components/exporter/export-form.tsx b/apps/web/core/components/exporter/export-form.tsx
index ecb88e9a5..d7138f43f 100644
--- a/apps/web/core/components/exporter/export-form.tsx
+++ b/apps/web/core/components/exporter/export-form.tsx
@@ -49,7 +49,7 @@ const initialWorkItemFilters = {
 
 const projectExportService = new ProjectExportService();
 
-export const ExportForm = observer((props: Props) => {
+export const ExportForm = observer(function ExportForm(props: Props) {
   // props
   const { workspaceSlug, mutateServices } = props;
   // states
@@ -92,7 +92,7 @@ export const ExportForm = observer((props: Props) => {
   });
 
   // handlers
-  const ExportCSVToMail = async (formData: FormData) => {
+  async function ExportCSVToMail(formData: FormData) {
     setExportLoading(true);
     if (workspaceSlug && user) {
       const payload = {
@@ -143,7 +143,8 @@ export const ExportForm = observer((props: Props) => {
           });
         });
     }
-  };
+  }
+
   return (
     <form onSubmit={handleSubmit(ExportCSVToMail)} className="flex flex-col gap-4 mt-4">
       <div className="flex gap-4">
diff --git a/apps/web/core/components/exporter/export-modal.tsx b/apps/web/core/components/exporter/export-modal.tsx
index 73cb92ad8..b06181c4c 100644
--- a/apps/web/core/components/exporter/export-modal.tsx
+++ b/apps/web/core/components/exporter/export-modal.tsx
@@ -29,7 +29,7 @@ type Props = {
 
 const projectExportService = new ProjectExportService();
 
-export const Exporter: React.FC<Props> = observer((props) => {
+export const Exporter = observer(function Exporter(props: Props) {
   const { isOpen, handleClose, user, provider, mutateServices } = props;
   // states
   const [exportLoading, setExportLoading] = useState(false);
@@ -66,7 +66,8 @@ export const Exporter: React.FC<Props> = observer((props) => {
   const onChange = (val: any) => {
     setValue(val);
   };
-  const ExportCSVToMail = async () => {
+
+  async function ExportCSVToMail() {
     setExportLoading(true);
     if (workspaceSlug && user && typeof provider === "string") {
       const payload = {
@@ -97,7 +98,7 @@ export const Exporter: React.FC<Props> = observer((props) => {
           });
         });
     }
-  };
+  }
 
   return (
     <Transition.Root show={isOpen} as={React.Fragment}>
diff --git a/apps/web/core/components/exporter/guide.tsx b/apps/web/core/components/exporter/guide.tsx
index 024cd059e..c3bcf8d37 100644
--- a/apps/web/core/components/exporter/guide.tsx
+++ b/apps/web/core/components/exporter/guide.tsx
@@ -8,7 +8,7 @@ import { EXPORT_SERVICES_LIST } from "@/constants/fetch-keys";
 import { ExportForm } from "./export-form";
 import { PrevExports } from "./prev-exports";
 
-const IntegrationGuide = observer(() => {
+const IntegrationGuide = observer(function IntegrationGuide() {
   // router
   const { workspaceSlug } = useParams();
   const searchParams = useSearchParams();
diff --git a/apps/web/core/components/exporter/prev-exports.tsx b/apps/web/core/components/exporter/prev-exports.tsx
index c7a7b3bee..01d948a69 100644
--- a/apps/web/core/components/exporter/prev-exports.tsx
+++ b/apps/web/core/components/exporter/prev-exports.tsx
@@ -25,7 +25,7 @@ type Props = {
   setCursor: (cursor: string) => void;
 };
 type RowData = IExportData;
-export const PrevExports = observer((props: Props) => {
+export const PrevExports = observer(function PrevExports(props: Props) {
   // props
   const { workspaceSlug, cursor, per_page, setCursor } = props;
   // state
diff --git a/apps/web/core/components/exporter/single-export.tsx b/apps/web/core/components/exporter/single-export.tsx
index 0731bc47a..e34f7fcf0 100644
--- a/apps/web/core/components/exporter/single-export.tsx
+++ b/apps/web/core/components/exporter/single-export.tsx
@@ -14,7 +14,7 @@ type Props = {
   refreshing: boolean;
 };
 
-export const SingleExport: FC<Props> = ({ service, refreshing }) => {
+export function SingleExport({ service, refreshing }: Props) {
   const provider = service.provider;
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const [isLoading] = useState(false);
@@ -75,4 +75,4 @@ export const SingleExport: FC<Props> = ({ service, refreshing }) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/gantt-chart/blocks/block-row.tsx b/apps/web/core/components/gantt-chart/blocks/block-row.tsx
index d281c062f..1e0c688d5 100644
--- a/apps/web/core/components/gantt-chart/blocks/block-row.tsx
+++ b/apps/web/core/components/gantt-chart/blocks/block-row.tsx
@@ -22,7 +22,7 @@ type Props = {
   ganttContainerRef: React.RefObject<HTMLDivElement>;
 };
 
-export const BlockRow: React.FC<Props> = observer((props) => {
+export const BlockRow = observer(function BlockRow(props: Props) {
   const { blockId, showAllBlocks, blockUpdateHandler, handleScrollToBlock, enableAddBlock, selectionHelpers } = props;
   // states
   const [isHidden, setIsHidden] = useState(false);
diff --git a/apps/web/core/components/gantt-chart/blocks/block.tsx b/apps/web/core/components/gantt-chart/blocks/block.tsx
index 7be9e9c27..18e0b446b 100644
--- a/apps/web/core/components/gantt-chart/blocks/block.tsx
+++ b/apps/web/core/components/gantt-chart/blocks/block.tsx
@@ -26,7 +26,7 @@ type Props = {
   updateBlockDates?: (updates: IBlockUpdateDependencyData[]) => Promise<void>;
 };
 
-export const GanttChartBlock: React.FC<Props> = observer((props) => {
+export const GanttChartBlock = observer(function GanttChartBlock(props: Props) {
   const {
     blockId,
     showAllBlocks,
diff --git a/apps/web/core/components/gantt-chart/chart/header.tsx b/apps/web/core/components/gantt-chart/chart/header.tsx
index cc5bd9a3b..f2687b571 100644
--- a/apps/web/core/components/gantt-chart/chart/header.tsx
+++ b/apps/web/core/components/gantt-chart/chart/header.tsx
@@ -23,7 +23,7 @@ type Props = {
   showToday: boolean;
 };
 
-export const GanttChartHeader: React.FC<Props> = observer((props) => {
+export const GanttChartHeader = observer(function GanttChartHeader(props: Props) {
   const { t } = useTranslation();
   const { blockIds, fullScreenMode, handleChartView, handleToday, loaderTitle, toggleFullScreenMode, showToday } =
     props;
diff --git a/apps/web/core/components/gantt-chart/chart/main-content.tsx b/apps/web/core/components/gantt-chart/chart/main-content.tsx
index e95e4b0eb..f555f90ab 100644
--- a/apps/web/core/components/gantt-chart/chart/main-content.tsx
+++ b/apps/web/core/components/gantt-chart/chart/main-content.tsx
@@ -56,7 +56,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const GanttChartMainContent: React.FC<Props> = observer((props) => {
+export const GanttChartMainContent = observer(function GanttChartMainContent(props: Props) {
   const {
     blockIds,
     loadMoreBlocks,
diff --git a/apps/web/core/components/gantt-chart/chart/root.tsx b/apps/web/core/components/gantt-chart/chart/root.tsx
index 8231507d5..114799e5e 100644
--- a/apps/web/core/components/gantt-chart/chart/root.tsx
+++ b/apps/web/core/components/gantt-chart/chart/root.tsx
@@ -48,7 +48,7 @@ const timelineViewHelpers = {
   quarter: quarterView,
 };
 
-export const ChartViewRoot: FC<ChartViewRootProps> = observer((props) => {
+export const ChartViewRoot = observer(function ChartViewRoot(props: ChartViewRootProps) {
   const {
     border,
     title,
diff --git a/apps/web/core/components/gantt-chart/chart/timeline-drag-helper.tsx b/apps/web/core/components/gantt-chart/chart/timeline-drag-helper.tsx
index 68e77741d..12441f924 100644
--- a/apps/web/core/components/gantt-chart/chart/timeline-drag-helper.tsx
+++ b/apps/web/core/components/gantt-chart/chart/timeline-drag-helper.tsx
@@ -9,7 +9,7 @@ import { HEADER_HEIGHT, SIDEBAR_WIDTH } from "../constants";
 type Props = {
   ganttContainerRef: RefObject<HTMLDivElement>;
 };
-export const TimelineDragHelper = observer((props: Props) => {
+export const TimelineDragHelper = observer(function TimelineDragHelper(props: Props) {
   const { ganttContainerRef } = props;
   const { isDragging } = useTimeLineChartStore();
 
diff --git a/apps/web/core/components/gantt-chart/chart/views/month.tsx b/apps/web/core/components/gantt-chart/chart/views/month.tsx
index ad87337fb..80232f80b 100644
--- a/apps/web/core/components/gantt-chart/chart/views/month.tsx
+++ b/apps/web/core/components/gantt-chart/chart/views/month.tsx
@@ -10,7 +10,7 @@ import { useTimeLineChartStore } from "@/hooks/use-timeline-chart";
 import type { IMonthView } from "../../views";
 import { getNumberOfDaysBetweenTwoDates } from "../../views/helpers";
 
-export const MonthChartView: FC<any> = observer(() => {
+export const MonthChartView = observer(function MonthChartView(_props: any) {
   // chart hook
   const { currentViewData, renderView } = useTimeLineChartStore();
   const monthView: IMonthView = renderView;
diff --git a/apps/web/core/components/gantt-chart/chart/views/quarter.tsx b/apps/web/core/components/gantt-chart/chart/views/quarter.tsx
index aed12a74a..f402abb3a 100644
--- a/apps/web/core/components/gantt-chart/chart/views/quarter.tsx
+++ b/apps/web/core/components/gantt-chart/chart/views/quarter.tsx
@@ -9,7 +9,7 @@ import { HEADER_HEIGHT, SIDEBAR_WIDTH } from "../../constants";
 import type { IMonthBlock, IQuarterMonthBlock } from "../../views";
 import { groupMonthsToQuarters } from "../../views";
 
-export const QuarterChartView: FC<any> = observer(() => {
+export const QuarterChartView = observer(function QuarterChartView(_props: any) {
   const { currentViewData, renderView } = useTimeLineChartStore();
   const monthBlocks: IMonthBlock[] = renderView;
 
diff --git a/apps/web/core/components/gantt-chart/chart/views/week.tsx b/apps/web/core/components/gantt-chart/chart/views/week.tsx
index 2a6e64ba0..fda913f29 100644
--- a/apps/web/core/components/gantt-chart/chart/views/week.tsx
+++ b/apps/web/core/components/gantt-chart/chart/views/week.tsx
@@ -8,7 +8,7 @@ import { useTimeLineChartStore } from "@/hooks/use-timeline-chart";
 import { HEADER_HEIGHT, SIDEBAR_WIDTH } from "../../constants";
 import type { IWeekBlock } from "../../views";
 
-export const WeekChartView: FC<any> = observer(() => {
+export const WeekChartView = observer(function WeekChartView(_props: any) {
   const { currentViewData, renderView } = useTimeLineChartStore();
   const weekBlocks: IWeekBlock[] = renderView;
 
diff --git a/apps/web/core/components/gantt-chart/helpers/add-block.tsx b/apps/web/core/components/gantt-chart/helpers/add-block.tsx
index 841a0ab6d..10d179c7a 100644
--- a/apps/web/core/components/gantt-chart/helpers/add-block.tsx
+++ b/apps/web/core/components/gantt-chart/helpers/add-block.tsx
@@ -19,7 +19,7 @@ type Props = {
   blockUpdateHandler: (block: any, payload: IBlockUpdateData) => void;
 };
 
-export const ChartAddBlock: React.FC<Props> = observer((props) => {
+export const ChartAddBlock = observer(function ChartAddBlock(props: Props) {
   const { block, blockUpdateHandler } = props;
   // states
   const [isButtonVisible, setIsButtonVisible] = useState(false);
diff --git a/apps/web/core/components/gantt-chart/helpers/blockResizables/left-resizable.tsx b/apps/web/core/components/gantt-chart/helpers/blockResizables/left-resizable.tsx
index 48e7277c3..81491f4c7 100644
--- a/apps/web/core/components/gantt-chart/helpers/blockResizables/left-resizable.tsx
+++ b/apps/web/core/components/gantt-chart/helpers/blockResizables/left-resizable.tsx
@@ -16,7 +16,7 @@ type LeftResizableProps = {
     width: number;
   };
 };
-export const LeftResizable = observer((props: LeftResizableProps) => {
+export const LeftResizable = observer(function LeftResizable(props: LeftResizableProps) {
   const { enableBlockLeftResize, isMoving, handleBlockDrag, position } = props;
   const [isHovering, setIsHovering] = useState(false);
 
diff --git a/apps/web/core/components/gantt-chart/helpers/blockResizables/right-resizable.tsx b/apps/web/core/components/gantt-chart/helpers/blockResizables/right-resizable.tsx
index 8b4f0ea49..e41ff36a2 100644
--- a/apps/web/core/components/gantt-chart/helpers/blockResizables/right-resizable.tsx
+++ b/apps/web/core/components/gantt-chart/helpers/blockResizables/right-resizable.tsx
@@ -16,7 +16,7 @@ type RightResizableProps = {
     width: number;
   };
 };
-export const RightResizable = observer((props: RightResizableProps) => {
+export const RightResizable = observer(function RightResizable(props: RightResizableProps) {
   const { enableBlockRightResize, handleBlockDrag, isMoving, position } = props;
   const [isHovering, setIsHovering] = useState(false);
 
diff --git a/apps/web/core/components/gantt-chart/helpers/draggable.tsx b/apps/web/core/components/gantt-chart/helpers/draggable.tsx
index f365903e0..c93032479 100644
--- a/apps/web/core/components/gantt-chart/helpers/draggable.tsx
+++ b/apps/web/core/components/gantt-chart/helpers/draggable.tsx
@@ -23,7 +23,7 @@ type Props = {
   ganttContainerRef: RefObject<HTMLDivElement>;
 };
 
-export const ChartDraggable: React.FC<Props> = observer((props) => {
+export const ChartDraggable = observer(function ChartDraggable(props: Props) {
   const {
     block,
     blockToRender,
diff --git a/apps/web/core/components/gantt-chart/root.tsx b/apps/web/core/components/gantt-chart/root.tsx
index e59edfede..18bedc87f 100644
--- a/apps/web/core/components/gantt-chart/root.tsx
+++ b/apps/web/core/components/gantt-chart/root.tsx
@@ -32,7 +32,7 @@ type GanttChartRootProps = {
   isEpic?: boolean;
 };
 
-export const GanttChartRoot: FC<GanttChartRootProps> = observer((props) => {
+export const GanttChartRoot = observer(function GanttChartRoot(props: GanttChartRootProps) {
   const {
     border = true,
     title,
diff --git a/apps/web/core/components/gantt-chart/sidebar/gantt-dnd-HOC.tsx b/apps/web/core/components/gantt-chart/sidebar/gantt-dnd-HOC.tsx
index a83c07850..3341fcb87 100644
--- a/apps/web/core/components/gantt-chart/sidebar/gantt-dnd-HOC.tsx
+++ b/apps/web/core/components/gantt-chart/sidebar/gantt-dnd-HOC.tsx
@@ -18,7 +18,7 @@ type Props = {
   onDrop: (draggingBlockId: string | undefined, droppedBlockId: string | undefined, dropAtEndOfList: boolean) => void;
 };
 
-export const GanttDnDHOC = observer((props: Props) => {
+export const GanttDnDHOC = observer(function GanttDnDHOC(props: Props) {
   const { id, isLastChild, children, onDrop, isDragEnabled } = props;
   // states
   const [isDragging, setIsDragging] = useState(false);
diff --git a/apps/web/core/components/gantt-chart/sidebar/issues/block.tsx b/apps/web/core/components/gantt-chart/sidebar/issues/block.tsx
index b5e3a11ea..1b87d9909 100644
--- a/apps/web/core/components/gantt-chart/sidebar/issues/block.tsx
+++ b/apps/web/core/components/gantt-chart/sidebar/issues/block.tsx
@@ -21,7 +21,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const IssuesSidebarBlock = observer((props: Props) => {
+export const IssuesSidebarBlock = observer(function IssuesSidebarBlock(props: Props) {
   const { block, enableSelection, isDragging, selectionHelpers, isEpic = false } = props;
   // store hooks
   const { updateActiveBlockId, isBlockActive, getNumberOfDaysFromPosition } = useTimeLineChartStore();
diff --git a/apps/web/core/components/gantt-chart/sidebar/issues/sidebar.tsx b/apps/web/core/components/gantt-chart/sidebar/issues/sidebar.tsx
index ca5686ffd..39e862862 100644
--- a/apps/web/core/components/gantt-chart/sidebar/issues/sidebar.tsx
+++ b/apps/web/core/components/gantt-chart/sidebar/issues/sidebar.tsx
@@ -33,7 +33,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const IssueGanttSidebar: React.FC<Props> = observer((props) => {
+export const IssueGanttSidebar = observer(function IssueGanttSidebar(props: Props) {
   const {
     blockUpdateHandler,
     blockIds,
diff --git a/apps/web/core/components/gantt-chart/sidebar/modules/block.tsx b/apps/web/core/components/gantt-chart/sidebar/modules/block.tsx
index 04563db61..e1685d29c 100644
--- a/apps/web/core/components/gantt-chart/sidebar/modules/block.tsx
+++ b/apps/web/core/components/gantt-chart/sidebar/modules/block.tsx
@@ -14,7 +14,7 @@ type Props = {
   isDragging: boolean;
 };
 
-export const ModulesSidebarBlock: React.FC<Props> = observer((props) => {
+export const ModulesSidebarBlock = observer(function ModulesSidebarBlock(props: Props) {
   const { blockId, isDragging } = props;
   // store hooks
   const { getBlockById, updateActiveBlockId, isBlockActive, getNumberOfDaysFromPosition } = useTimeLineChartStore();
diff --git a/apps/web/core/components/gantt-chart/sidebar/modules/sidebar.tsx b/apps/web/core/components/gantt-chart/sidebar/modules/sidebar.tsx
index e3adf776b..c24066e36 100644
--- a/apps/web/core/components/gantt-chart/sidebar/modules/sidebar.tsx
+++ b/apps/web/core/components/gantt-chart/sidebar/modules/sidebar.tsx
@@ -20,7 +20,7 @@ type Props = {
   enableReorder: boolean;
 };
 
-export const ModuleGanttSidebar: React.FC<Props> = observer((props) => {
+export const ModuleGanttSidebar = observer(function ModuleGanttSidebar(props: Props) {
   const { blockUpdateHandler, blockIds, enableReorder } = props;
 
   const { getBlockById } = useTimeLineChart(GANTT_TIMELINE_TYPE.MODULE);
diff --git a/apps/web/core/components/gantt-chart/sidebar/root.tsx b/apps/web/core/components/gantt-chart/sidebar/root.tsx
index 15af6287d..4df3977d5 100644
--- a/apps/web/core/components/gantt-chart/sidebar/root.tsx
+++ b/apps/web/core/components/gantt-chart/sidebar/root.tsx
@@ -28,7 +28,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const GanttChartSidebar: React.FC<Props> = observer((props) => {
+export const GanttChartSidebar = observer(function GanttChartSidebar(props: Props) {
   const { t } = useTranslation();
   const {
     blockIds,
diff --git a/apps/web/core/components/global/product-updates/footer.tsx b/apps/web/core/components/global/product-updates/footer.tsx
index 9c21ea785..1dbc0a1c0 100644
--- a/apps/web/core/components/global/product-updates/footer.tsx
+++ b/apps/web/core/components/global/product-updates/footer.tsx
@@ -6,7 +6,7 @@ import { PlaneLogo } from "@plane/propel/icons";
 // helpers
 import { cn } from "@plane/utils";
 
-export const ProductUpdatesFooter = () => {
+export function ProductUpdatesFooter() {
   const { t } = useTranslation();
   return (
     <div className="flex items-center justify-between flex-shrink-0 gap-4 m-6 mb-4">
@@ -63,4 +63,4 @@ export const ProductUpdatesFooter = () => {
       </a>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/global/product-updates/modal.tsx b/apps/web/core/components/global/product-updates/modal.tsx
index 45b2781e1..7b9fde3e3 100644
--- a/apps/web/core/components/global/product-updates/modal.tsx
+++ b/apps/web/core/components/global/product-updates/modal.tsx
@@ -19,7 +19,7 @@ export type ProductUpdatesModalProps = {
   handleClose: () => void;
 };
 
-export const ProductUpdatesModal: FC<ProductUpdatesModalProps> = observer((props) => {
+export const ProductUpdatesModal = observer(function ProductUpdatesModal(props: ProductUpdatesModalProps) {
   const { isOpen, handleClose } = props;
   const { t } = useTranslation();
   const { config } = useInstance();
diff --git a/apps/web/core/components/global/timezone-select.tsx b/apps/web/core/components/global/timezone-select.tsx
index 73817cc0d..1be8a08be 100644
--- a/apps/web/core/components/global/timezone-select.tsx
+++ b/apps/web/core/components/global/timezone-select.tsx
@@ -18,7 +18,7 @@ type TTimezoneSelect = {
   disabled?: boolean;
 };
 
-export const TimezoneSelect: FC<TTimezoneSelect> = observer((props) => {
+export const TimezoneSelect = observer(function TimezoneSelect(props: TTimezoneSelect) {
   // props
   const {
     value,
diff --git a/apps/web/core/components/home/home-dashboard-widgets.tsx b/apps/web/core/components/home/home-dashboard-widgets.tsx
index 362c64d11..0ed4cfcae 100644
--- a/apps/web/core/components/home/home-dashboard-widgets.tsx
+++ b/apps/web/core/components/home/home-dashboard-widgets.tsx
@@ -54,7 +54,7 @@ export const HOME_WIDGETS_LIST: {
   },
 };
 
-export const DashboardWidgets = observer(() => {
+export const DashboardWidgets = observer(function DashboardWidgets() {
   // router
   const { workspaceSlug } = useParams();
   // navigation
diff --git a/apps/web/core/components/home/root.tsx b/apps/web/core/components/home/root.tsx
index 5a0e6188f..b0d4b32f9 100644
--- a/apps/web/core/components/home/root.tsx
+++ b/apps/web/core/components/home/root.tsx
@@ -18,7 +18,7 @@ import { HomePeekOverviewsRoot } from "@/plane-web/components/home";
 import { DashboardWidgets } from "./home-dashboard-widgets";
 import { UserGreetingsView } from "./user-greetings";
 
-export const WorkspaceHomeView = observer(() => {
+export const WorkspaceHomeView = observer(function WorkspaceHomeView() {
   // store hooks
   const { workspaceSlug } = useParams();
   const { data: currentUser } = useUser();
diff --git a/apps/web/core/components/home/user-greetings.tsx b/apps/web/core/components/home/user-greetings.tsx
index de935ea98..4ed331b4e 100644
--- a/apps/web/core/components/home/user-greetings.tsx
+++ b/apps/web/core/components/home/user-greetings.tsx
@@ -10,7 +10,7 @@ export interface IUserGreetingsView {
   user: IUser;
 }
 
-export const UserGreetingsView: FC<IUserGreetingsView> = (props) => {
+export function UserGreetingsView(props: IUserGreetingsView) {
   const { user } = props;
   // current time hook
   const { currentTime } = useCurrentTime();
@@ -53,4 +53,4 @@ export const UserGreetingsView: FC<IUserGreetingsView> = (props) => {
       </h5>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/home/widgets/empty-states/links.tsx b/apps/web/core/components/home/widgets/empty-states/links.tsx
index d375d5d87..5f7b48b38 100644
--- a/apps/web/core/components/home/widgets/empty-states/links.tsx
+++ b/apps/web/core/components/home/widgets/empty-states/links.tsx
@@ -1,7 +1,7 @@
 import { useTranslation } from "@plane/i18n";
 import { EmptyStateCompact } from "@plane/propel/empty-state";
 
-export const LinksEmptyState = () => {
+export function LinksEmptyState() {
   const { t } = useTranslation();
   return (
     <div className="flex items-center justify-center py-10 bg-custom-background-90 w-full">
@@ -12,4 +12,4 @@ export const LinksEmptyState = () => {
       />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/home/widgets/empty-states/no-projects.tsx b/apps/web/core/components/home/widgets/empty-states/no-projects.tsx
index e6f59952b..2a93c3383 100644
--- a/apps/web/core/components/home/widgets/empty-states/no-projects.tsx
+++ b/apps/web/core/components/home/widgets/empty-states/no-projects.tsx
@@ -19,7 +19,7 @@ import { useWorkspace } from "@/hooks/store/use-workspace";
 import { useUser, useUserPermissions } from "@/hooks/store/user";
 // plane web constants
 
-export const NoProjectsEmptyState = observer(() => {
+export const NoProjectsEmptyState = observer(function NoProjectsEmptyState() {
   // navigation
   const { workspaceSlug } = useParams();
   // store hooks
diff --git a/apps/web/core/components/home/widgets/empty-states/recents.tsx b/apps/web/core/components/home/widgets/empty-states/recents.tsx
index bca5bf603..3f358d8c3 100644
--- a/apps/web/core/components/home/widgets/empty-states/recents.tsx
+++ b/apps/web/core/components/home/widgets/empty-states/recents.tsx
@@ -27,7 +27,7 @@ const getDisplayContent = (type: string): { assetKey: CompactAssetType; text: st
   }
 };
 
-export const RecentsEmptyState = ({ type }: { type: string }) => {
+export function RecentsEmptyState({ type }: { type: string }) {
   const { t } = useTranslation();
 
   const { assetKey, text } = getDisplayContent(type);
@@ -37,4 +37,4 @@ export const RecentsEmptyState = ({ type }: { type: string }) => {
       <EmptyStateCompact assetKey={assetKey} assetClassName="size-20" title={t(text)} />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/home/widgets/empty-states/stickies.tsx b/apps/web/core/components/home/widgets/empty-states/stickies.tsx
index 37a3299da..0a934cfd5 100644
--- a/apps/web/core/components/home/widgets/empty-states/stickies.tsx
+++ b/apps/web/core/components/home/widgets/empty-states/stickies.tsx
@@ -1,11 +1,11 @@
 import { useTranslation } from "@plane/i18n";
 import { EmptyStateCompact } from "@plane/propel/empty-state";
 
-export const StickiesEmptyState = () => {
+export function StickiesEmptyState() {
   const { t } = useTranslation();
   return (
     <div className="flex items-center justify-center py-10 bg-custom-background-90 w-full">
       <EmptyStateCompact assetKey="note" assetClassName="size-20" title={t("stickies.empty_state.simple")} />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/home/widgets/links/action.tsx b/apps/web/core/components/home/widgets/links/action.tsx
index 5199b7d4d..0c5430c64 100644
--- a/apps/web/core/components/home/widgets/links/action.tsx
+++ b/apps/web/core/components/home/widgets/links/action.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from "@plane/i18n";
 type TProps = {
   onClick: () => void;
 };
-export const AddLink = (props: TProps) => {
+export function AddLink(props: TProps) {
   const { onClick } = props;
   const { t } = useTranslation();
 
@@ -19,4 +19,4 @@ export const AddLink = (props: TProps) => {
       <div className="text-sm font-medium my-auto">{t("home.quick_links.add")}</div>
     </button>
   );
-};
+}
diff --git a/apps/web/core/components/home/widgets/links/create-update-link-modal.tsx b/apps/web/core/components/home/widgets/links/create-update-link-modal.tsx
index bdebc8c93..6ac53d99f 100644
--- a/apps/web/core/components/home/widgets/links/create-update-link-modal.tsx
+++ b/apps/web/core/components/home/widgets/links/create-update-link-modal.tsx
@@ -30,7 +30,7 @@ const defaultValues: TLinkCreateFormFieldOptions = {
   url: "",
 };
 
-export const LinkCreateUpdateModal: FC<TLinkCreateEditModal> = observer((props) => {
+export const LinkCreateUpdateModal = observer(function LinkCreateUpdateModal(props: TLinkCreateEditModal) {
   // props
   const { isModalOpen, handleOnClose, linkOperations, preloadedData } = props;
   // react hook form
diff --git a/apps/web/core/components/home/widgets/links/link-detail.tsx b/apps/web/core/components/home/widgets/links/link-detail.tsx
index 2a47a12d2..200b5f8c9 100644
--- a/apps/web/core/components/home/widgets/links/link-detail.tsx
+++ b/apps/web/core/components/home/widgets/links/link-detail.tsx
@@ -20,7 +20,7 @@ export type TProjectLinkDetail = {
   linkOperations: TLinkOperations;
 };
 
-export const ProjectLinkDetail: FC<TProjectLinkDetail> = observer((props) => {
+export const ProjectLinkDetail = observer(function ProjectLinkDetail(props: TProjectLinkDetail) {
   // props
   const { linkId, linkOperations } = props;
   // hooks
diff --git a/apps/web/core/components/home/widgets/links/links.tsx b/apps/web/core/components/home/widgets/links/links.tsx
index 1abeba10f..0d272e0a3 100644
--- a/apps/web/core/components/home/widgets/links/links.tsx
+++ b/apps/web/core/components/home/widgets/links/links.tsx
@@ -15,7 +15,7 @@ export type TProjectLinkList = {
   workspaceSlug: string;
 };
 
-export const ProjectLinkList: FC<TProjectLinkList> = observer((props) => {
+export const ProjectLinkList = observer(function ProjectLinkList(props: TProjectLinkList) {
   // props
   const { linkOperations, workspaceSlug } = props;
   // hooks
diff --git a/apps/web/core/components/home/widgets/links/root.tsx b/apps/web/core/components/home/widgets/links/root.tsx
index de8f6e612..f05700b0b 100644
--- a/apps/web/core/components/home/widgets/links/root.tsx
+++ b/apps/web/core/components/home/widgets/links/root.tsx
@@ -9,7 +9,7 @@ import { LinkCreateUpdateModal } from "./create-update-link-modal";
 import { ProjectLinkList } from "./links";
 import { useLinks } from "./use-links";
 
-export const DashboardQuickLinks = observer((props: THomeWidgetProps) => {
+export const DashboardQuickLinks = observer(function DashboardQuickLinks(props: THomeWidgetProps) {
   const { workspaceSlug } = props;
   const { linkOperations } = useLinks(workspaceSlug);
   const {
diff --git a/apps/web/core/components/home/widgets/loaders/home-loader.tsx b/apps/web/core/components/home/widgets/loaders/home-loader.tsx
index 579d7497f..38b234da2 100644
--- a/apps/web/core/components/home/widgets/loaders/home-loader.tsx
+++ b/apps/web/core/components/home/widgets/loaders/home-loader.tsx
@@ -4,19 +4,21 @@ import { range } from "lodash-es";
 // ui
 import { Loader } from "@plane/ui";
 
-export const HomeLoader = () => (
-  <>
-    {range(3).map((index) => (
-      <div key={index}>
-        <div className="mb-2">
-          <div className="text-base font-semibold text-custom-text-350 mb-4">
-            <Loader.Item height="20px" width="100px" />
+export function HomeLoader() {
+  return (
+    <>
+      {range(3).map((index) => (
+        <div key={index}>
+          <div className="mb-2">
+            <div className="text-base font-semibold text-custom-text-350 mb-4">
+              <Loader.Item height="20px" width="100px" />
+            </div>
+            <Loader className="h-[110px] w-full flex items-center justify-center gap-2 text-custom-text-400 rounded">
+              <Loader.Item height="100%" width="100%" />
+            </Loader>
           </div>
-          <Loader className="h-[110px] w-full flex items-center justify-center gap-2 text-custom-text-400 rounded">
-            <Loader.Item height="100%" width="100%" />
-          </Loader>
         </div>
-      </div>
-    ))}
-  </>
-);
+      ))}
+    </>
+  );
+}
diff --git a/apps/web/core/components/home/widgets/loaders/loader.tsx b/apps/web/core/components/home/widgets/loaders/loader.tsx
index 9fed9cafa..75b87daf0 100644
--- a/apps/web/core/components/home/widgets/loaders/loader.tsx
+++ b/apps/web/core/components/home/widgets/loaders/loader.tsx
@@ -13,7 +13,7 @@ export enum EWidgetKeys {
   QUICK_LINKS = "quick_links",
 }
 
-export const WidgetLoader: React.FC<Props> = (props) => {
+export function WidgetLoader(props: Props) {
   const { widgetKey } = props;
 
   const loaders = {
@@ -22,4 +22,4 @@ export const WidgetLoader: React.FC<Props> = (props) => {
   };
 
   return loaders[widgetKey];
-};
+}
diff --git a/apps/web/core/components/home/widgets/loaders/quick-links.tsx b/apps/web/core/components/home/widgets/loaders/quick-links.tsx
index 67e4b4cf6..bfe46d1fd 100644
--- a/apps/web/core/components/home/widgets/loaders/quick-links.tsx
+++ b/apps/web/core/components/home/widgets/loaders/quick-links.tsx
@@ -4,10 +4,12 @@ import { range } from "lodash-es";
 // ui
 import { Loader } from "@plane/ui";
 
-export const QuickLinksWidgetLoader = () => (
-  <Loader className="bg-custom-background-100 rounded-xl gap-2 flex flex-wrap">
-    {range(4).map((index) => (
-      <Loader.Item key={index} height="56px" width="230px" />
-    ))}
-  </Loader>
-);
+export function QuickLinksWidgetLoader() {
+  return (
+    <Loader className="bg-custom-background-100 rounded-xl gap-2 flex flex-wrap">
+      {range(4).map((index) => (
+        <Loader.Item key={index} height="56px" width="230px" />
+      ))}
+    </Loader>
+  );
+}
diff --git a/apps/web/core/components/home/widgets/loaders/recent-activity.tsx b/apps/web/core/components/home/widgets/loaders/recent-activity.tsx
index 9dc7a6fa0..5c275a9a6 100644
--- a/apps/web/core/components/home/widgets/loaders/recent-activity.tsx
+++ b/apps/web/core/components/home/widgets/loaders/recent-activity.tsx
@@ -4,17 +4,19 @@ import { range } from "lodash-es";
 // ui
 import { Loader } from "@plane/ui";
 
-export const RecentActivityWidgetLoader = () => (
-  <Loader className="bg-custom-background-100 rounded-xl px-2 space-y-6">
-    {range(5).map((index) => (
-      <div key={index} className="flex items-start gap-3.5">
-        <div className="flex-shrink-0">
-          <Loader.Item height="32px" width="32px" />
+export function RecentActivityWidgetLoader() {
+  return (
+    <Loader className="bg-custom-background-100 rounded-xl px-2 space-y-6">
+      {range(5).map((index) => (
+        <div key={index} className="flex items-start gap-3.5">
+          <div className="flex-shrink-0">
+            <Loader.Item height="32px" width="32px" />
+          </div>
+          <div className="space-y-3 flex-shrink-0 w-full my-auto">
+            <Loader.Item height="15px" width="70%" />
+          </div>
         </div>
-        <div className="space-y-3 flex-shrink-0 w-full my-auto">
-          <Loader.Item height="15px" width="70%" />
-        </div>
-      </div>
-    ))}
-  </Loader>
-);
+      ))}
+    </Loader>
+  );
+}
diff --git a/apps/web/core/components/home/widgets/manage/index.tsx b/apps/web/core/components/home/widgets/manage/index.tsx
index 1c4eb4543..3cddd456d 100644
--- a/apps/web/core/components/home/widgets/manage/index.tsx
+++ b/apps/web/core/components/home/widgets/manage/index.tsx
@@ -14,7 +14,7 @@ export type TProps = {
   handleOnClose?: () => void;
 };
 
-export const ManageWidgetsModal: FC<TProps> = observer((props) => {
+export const ManageWidgetsModal = observer(function ManageWidgetsModal(props: TProps) {
   // props
   const { workspaceSlug, isModalOpen, handleOnClose } = props;
   const { t } = useTranslation();
diff --git a/apps/web/core/components/home/widgets/manage/widget-item-drag-handle.tsx b/apps/web/core/components/home/widgets/manage/widget-item-drag-handle.tsx
index 7caf82da9..0a6dfa6a8 100644
--- a/apps/web/core/components/home/widgets/manage/widget-item-drag-handle.tsx
+++ b/apps/web/core/components/home/widgets/manage/widget-item-drag-handle.tsx
@@ -12,7 +12,7 @@ type Props = {
   isDragging: boolean;
 };
 
-export const WidgetItemDragHandle: FC<Props> = observer((props) => {
+export const WidgetItemDragHandle = observer(function WidgetItemDragHandle(props: Props) {
   const { isDragging } = props;
 
   return (
diff --git a/apps/web/core/components/home/widgets/manage/widget-item.tsx b/apps/web/core/components/home/widgets/manage/widget-item.tsx
index 1979d52fa..d8613762c 100644
--- a/apps/web/core/components/home/widgets/manage/widget-item.tsx
+++ b/apps/web/core/components/home/widgets/manage/widget-item.tsx
@@ -35,7 +35,7 @@ type Props = {
   handleToggle: (workspaceSlug: string, widgetKey: string, is_enabled: boolean) => void;
 };
 
-export const WidgetItem: FC<Props> = observer((props) => {
+export const WidgetItem = observer(function WidgetItem(props: Props) {
   // props
   const { widgetId, isLastChild, handleDrop, handleToggle } = props;
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/home/widgets/manage/widget-list.tsx b/apps/web/core/components/home/widgets/manage/widget-list.tsx
index 7312fc47c..0fdec3a53 100644
--- a/apps/web/core/components/home/widgets/manage/widget-list.tsx
+++ b/apps/web/core/components/home/widgets/manage/widget-list.tsx
@@ -11,7 +11,7 @@ import { WidgetItem } from "./widget-item";
 import type { TargetData } from "./widget.helpers";
 import { getInstructionFromPayload } from "./widget.helpers";
 
-export const WidgetList = observer(({ workspaceSlug }: { workspaceSlug: string }) => {
+export const WidgetList = observer(function WidgetList({ workspaceSlug }: { workspaceSlug: string }) {
   const { orderedWidgets, reorderWidget, toggleWidget } = useHome();
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/home/widgets/recents/filters.tsx b/apps/web/core/components/home/widgets/recents/filters.tsx
index adb67b3a5..bdbc4da0c 100644
--- a/apps/web/core/components/home/widgets/recents/filters.tsx
+++ b/apps/web/core/components/home/widgets/recents/filters.tsx
@@ -15,12 +15,12 @@ export type TFiltersDropdown = {
   filters: { name: TRecentActivityFilterKeys; icon?: React.ReactNode; i18n_key: string }[];
 };
 
-export const FiltersDropdown: FC<TFiltersDropdown> = observer((props) => {
+export const FiltersDropdown = observer(function FiltersDropdown(props: TFiltersDropdown) {
   const { className, activeFilter, setActiveFilter, filters } = props;
   const { t } = useTranslation();
 
-  const DropdownOptions = () =>
-    filters?.map((filter) => (
+  function DropdownOptions() {
+    return filters?.map((filter) => (
       <CustomMenu.MenuItem
         key={filter.name}
         className="flex items-center gap-2 truncate text-custom-text-200"
@@ -31,6 +31,7 @@ export const FiltersDropdown: FC<TFiltersDropdown> = observer((props) => {
         <div className="truncate font-medium text-xs capitalize">{t(filter.i18n_key)}</div>
       </CustomMenu.MenuItem>
     ));
+  }
 
   const title = activeFilter ? filters?.find((filter) => filter.name === activeFilter)?.i18n_key : "";
   return (
diff --git a/apps/web/core/components/home/widgets/recents/index.tsx b/apps/web/core/components/home/widgets/recents/index.tsx
index c10b715fc..3493ae5f3 100644
--- a/apps/web/core/components/home/widgets/recents/index.tsx
+++ b/apps/web/core/components/home/widgets/recents/index.tsx
@@ -33,7 +33,7 @@ type TRecentWidgetProps = THomeWidgetProps & {
   showFilterSelect?: boolean;
 };
 
-export const RecentActivityWidget: React.FC<TRecentWidgetProps> = observer((props) => {
+export const RecentActivityWidget = observer(function RecentActivityWidget(props: TRecentWidgetProps) {
   const { presetFilter, showFilterSelect = true, workspaceSlug } = props;
   // states
   const [filter, setFilter] = useState<TRecentActivityFilterKeys>(presetFilter ?? filters[0].name);
diff --git a/apps/web/core/components/home/widgets/recents/issue.tsx b/apps/web/core/components/home/widgets/recents/issue.tsx
index 9b9191358..af90d4037 100644
--- a/apps/web/core/components/home/widgets/recents/issue.tsx
+++ b/apps/web/core/components/home/widgets/recents/issue.tsx
@@ -22,7 +22,7 @@ type BlockProps = {
   ref: React.RefObject<HTMLDivElement>;
   workspaceSlug: string;
 };
-export const RecentIssue = observer((props: BlockProps) => {
+export const RecentIssue = observer(function RecentIssue(props: BlockProps) {
   const { activity, ref, workspaceSlug } = props;
   // hooks
   const { getStateById } = useProjectState();
diff --git a/apps/web/core/components/home/widgets/recents/page.tsx b/apps/web/core/components/home/widgets/recents/page.tsx
index 4c7151e2c..2738e7a76 100644
--- a/apps/web/core/components/home/widgets/recents/page.tsx
+++ b/apps/web/core/components/home/widgets/recents/page.tsx
@@ -15,7 +15,7 @@ type BlockProps = {
   workspaceSlug: string;
 };
 
-export const RecentPage = (props: BlockProps) => {
+export function RecentPage(props: BlockProps) {
   const { activity, ref, workspaceSlug } = props;
   // router
   const router = useRouter();
@@ -73,4 +73,4 @@ export const RecentPage = (props: BlockProps) => {
       }}
     />
   );
-};
+}
diff --git a/apps/web/core/components/home/widgets/recents/project.tsx b/apps/web/core/components/home/widgets/recents/project.tsx
index f8a36de12..d1587af2f 100644
--- a/apps/web/core/components/home/widgets/recents/project.tsx
+++ b/apps/web/core/components/home/widgets/recents/project.tsx
@@ -13,7 +13,7 @@ type BlockProps = {
   ref: React.RefObject<HTMLDivElement>;
   workspaceSlug: string;
 };
-export const RecentProject = (props: BlockProps) => {
+export function RecentProject(props: BlockProps) {
   const { activity, ref, workspaceSlug } = props;
   // router
   const router = useRouter();
@@ -76,4 +76,4 @@ export const RecentProject = (props: BlockProps) => {
       }}
     />
   );
-};
+}
diff --git a/apps/web/core/components/icons/attachment/audio-file-icon.tsx b/apps/web/core/components/icons/attachment/audio-file-icon.tsx
index 67b50f342..d8e893b8c 100644
--- a/apps/web/core/components/icons/attachment/audio-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/audio-file-icon.tsx
@@ -7,6 +7,6 @@ export type AudioIconProps = {
   height?: number;
 };
 
-export const AudioIcon: React.FC<AudioIconProps> = ({ width, height }) => (
-  <img src={AudioFileIcon} width={width} height={height} alt="AudioFileIcon" />
-);
+export function AudioIcon({ width, height }: AudioIconProps) {
+  return <img src={AudioFileIcon} width={width} height={height} alt="AudioFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/css-file-icon.tsx b/apps/web/core/components/icons/attachment/css-file-icon.tsx
index 78e07be54..7f6f27c16 100644
--- a/apps/web/core/components/icons/attachment/css-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/css-file-icon.tsx
@@ -4,6 +4,6 @@ import CssFileIcon from "@/app/assets/attachment/css-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const CssIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={CssFileIcon} width={width} height={height} alt="CssFileIcon" />
-);
+export function CssIcon({ width, height }: ImageIconPros) {
+  return <img src={CssFileIcon} width={width} height={height} alt="CssFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/csv-file-icon.tsx b/apps/web/core/components/icons/attachment/csv-file-icon.tsx
index f050c92a2..2856575b1 100644
--- a/apps/web/core/components/icons/attachment/csv-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/csv-file-icon.tsx
@@ -4,6 +4,6 @@ import CSVFileIcon from "@/app/assets/attachment/csv-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const CsvIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={CSVFileIcon} width={width} height={height} alt="CSVFileIcon" />
-);
+export function CsvIcon({ width, height }: ImageIconPros) {
+  return <img src={CSVFileIcon} width={width} height={height} alt="CSVFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/default-file-icon.tsx b/apps/web/core/components/icons/attachment/default-file-icon.tsx
index ee8c33c42..fac931af9 100644
--- a/apps/web/core/components/icons/attachment/default-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/default-file-icon.tsx
@@ -4,6 +4,6 @@ import DefaultFileIcon from "@/app/assets/attachment/default-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const DefaultIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={DefaultFileIcon} width={width} height={height} alt="DefaultFileIcon" />
-);
+export function DefaultIcon({ width, height }: ImageIconPros) {
+  return <img src={DefaultFileIcon} width={width} height={height} alt="DefaultFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/doc-file-icon.tsx b/apps/web/core/components/icons/attachment/doc-file-icon.tsx
index f60c7097a..2f8c174ee 100644
--- a/apps/web/core/components/icons/attachment/doc-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/doc-file-icon.tsx
@@ -4,6 +4,6 @@ import DocFileIcon from "@/app/assets/attachment/doc-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const DocIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={DocFileIcon} width={width} height={height} alt="DocFileIcon" />
-);
+export function DocIcon({ width, height }: ImageIconPros) {
+  return <img src={DocFileIcon} width={width} height={height} alt="DocFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/document-icon.tsx b/apps/web/core/components/icons/attachment/document-icon.tsx
index 73cd3418d..aeccb9f64 100644
--- a/apps/web/core/components/icons/attachment/document-icon.tsx
+++ b/apps/web/core/components/icons/attachment/document-icon.tsx
@@ -2,18 +2,20 @@ import React from "react";
 
 import type { Props } from "../types";
 
-export const DocumentIcon: React.FC<Props> = ({ width = "24", height = "24", className, color }) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 24 24"
-    fill="currentColor"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      fill={color}
-      d="M7.27051 14.792H12.7288C12.9094 14.792 13.0587 14.733 13.1768 14.6149C13.2948 14.4969 13.3538 14.3475 13.3538 14.167C13.3538 13.9864 13.2948 13.8371 13.1768 13.7191C13.0587 13.601 12.9094 13.542 12.7288 13.542H7.27051C7.08995 13.542 6.94065 13.601 6.82259 13.7191C6.70454 13.8371 6.64551 13.9864 6.64551 14.167C6.64551 14.3475 6.70454 14.4969 6.82259 14.6149C6.94065 14.733 7.08995 14.792 7.27051 14.792ZM7.27051 11.2503H12.7288C12.9094 11.2503 13.0587 11.1913 13.1768 11.0732C13.2948 10.9552 13.3538 10.8059 13.3538 10.6253C13.3538 10.4448 13.2948 10.2955 13.1768 10.1774C13.0587 10.0594 12.9094 10.0003 12.7288 10.0003H7.27051C7.08995 10.0003 6.94065 10.0594 6.82259 10.1774C6.70454 10.2955 6.64551 10.4448 6.64551 10.6253C6.64551 10.8059 6.70454 10.9552 6.82259 11.0732C6.94065 11.1913 7.08995 11.2503 7.27051 11.2503ZM4.58301 18.3337C4.24967 18.3337 3.95801 18.2087 3.70801 17.9587C3.45801 17.7087 3.33301 17.417 3.33301 17.0837V2.91699C3.33301 2.58366 3.45801 2.29199 3.70801 2.04199C3.95801 1.79199 4.24967 1.66699 4.58301 1.66699H11.583C11.7497 1.66699 11.9129 1.70171 12.0726 1.77116C12.2323 1.8406 12.3677 1.93088 12.4788 2.04199L16.2913 5.85449C16.4025 5.9656 16.4927 6.10102 16.5622 6.26074C16.6316 6.42046 16.6663 6.58366 16.6663 6.75033V17.0837C16.6663 17.417 16.5413 17.7087 16.2913 17.9587C16.0413 18.2087 15.7497 18.3337 15.4163 18.3337H4.58301ZM11.4788 6.16699V2.91699H4.58301V17.0837H15.4163V6.79199H12.1038C11.9233 6.79199 11.774 6.73296 11.6559 6.61491C11.5379 6.49685 11.4788 6.34755 11.4788 6.16699ZM4.58301 2.91699V6.79199V2.91699V17.0837V2.91699Z"
-    />
-  </svg>
-);
+export function DocumentIcon({ width = "24", height = "24", className, color }: Props) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 24 24"
+      fill="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill={color}
+        d="M7.27051 14.792H12.7288C12.9094 14.792 13.0587 14.733 13.1768 14.6149C13.2948 14.4969 13.3538 14.3475 13.3538 14.167C13.3538 13.9864 13.2948 13.8371 13.1768 13.7191C13.0587 13.601 12.9094 13.542 12.7288 13.542H7.27051C7.08995 13.542 6.94065 13.601 6.82259 13.7191C6.70454 13.8371 6.64551 13.9864 6.64551 14.167C6.64551 14.3475 6.70454 14.4969 6.82259 14.6149C6.94065 14.733 7.08995 14.792 7.27051 14.792ZM7.27051 11.2503H12.7288C12.9094 11.2503 13.0587 11.1913 13.1768 11.0732C13.2948 10.9552 13.3538 10.8059 13.3538 10.6253C13.3538 10.4448 13.2948 10.2955 13.1768 10.1774C13.0587 10.0594 12.9094 10.0003 12.7288 10.0003H7.27051C7.08995 10.0003 6.94065 10.0594 6.82259 10.1774C6.70454 10.2955 6.64551 10.4448 6.64551 10.6253C6.64551 10.8059 6.70454 10.9552 6.82259 11.0732C6.94065 11.1913 7.08995 11.2503 7.27051 11.2503ZM4.58301 18.3337C4.24967 18.3337 3.95801 18.2087 3.70801 17.9587C3.45801 17.7087 3.33301 17.417 3.33301 17.0837V2.91699C3.33301 2.58366 3.45801 2.29199 3.70801 2.04199C3.95801 1.79199 4.24967 1.66699 4.58301 1.66699H11.583C11.7497 1.66699 11.9129 1.70171 12.0726 1.77116C12.2323 1.8406 12.3677 1.93088 12.4788 2.04199L16.2913 5.85449C16.4025 5.9656 16.4927 6.10102 16.5622 6.26074C16.6316 6.42046 16.6663 6.58366 16.6663 6.75033V17.0837C16.6663 17.417 16.5413 17.7087 16.2913 17.9587C16.0413 18.2087 15.7497 18.3337 15.4163 18.3337H4.58301ZM11.4788 6.16699V2.91699H4.58301V17.0837H15.4163V6.79199H12.1038C11.9233 6.79199 11.774 6.73296 11.6559 6.61491C11.5379 6.49685 11.4788 6.34755 11.4788 6.16699ZM4.58301 2.91699V6.79199V2.91699V17.0837V2.91699Z"
+      />
+    </svg>
+  );
+}
diff --git a/apps/web/core/components/icons/attachment/figma-file-icon.tsx b/apps/web/core/components/icons/attachment/figma-file-icon.tsx
index 17c132829..a88fb8e60 100644
--- a/apps/web/core/components/icons/attachment/figma-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/figma-file-icon.tsx
@@ -4,6 +4,6 @@ import FigmaFileIcon from "@/app/assets/attachment/figma-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const FigmaIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={FigmaFileIcon} width={width} height={height} alt="FigmaFileIcon" />
-);
+export function FigmaIcon({ width, height }: ImageIconPros) {
+  return <img src={FigmaFileIcon} width={width} height={height} alt="FigmaFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/html-file-icon.tsx b/apps/web/core/components/icons/attachment/html-file-icon.tsx
index e2d4dd9ed..1f82f0761 100644
--- a/apps/web/core/components/icons/attachment/html-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/html-file-icon.tsx
@@ -4,6 +4,6 @@ import HtmlFileIcon from "@/app/assets/attachment/html-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const HtmlIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={HtmlFileIcon} width={width} height={height} alt="HtmlFileIcon" />
-);
+export function HtmlIcon({ width, height }: ImageIconPros) {
+  return <img src={HtmlFileIcon} width={width} height={height} alt="HtmlFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/img-file-icon.tsx b/apps/web/core/components/icons/attachment/img-file-icon.tsx
index e70399584..93055cd8a 100644
--- a/apps/web/core/components/icons/attachment/img-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/img-file-icon.tsx
@@ -4,6 +4,6 @@ import ImgFileIcon from "@/app/assets/attachment/img-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const ImgIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={ImgFileIcon} width={width} height={height} alt="ImgFileIcon" />
-);
+export function ImgIcon({ width, height }: ImageIconPros) {
+  return <img src={ImgFileIcon} width={width} height={height} alt="ImgFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/jpg-file-icon.tsx b/apps/web/core/components/icons/attachment/jpg-file-icon.tsx
index e3815612a..88118585a 100644
--- a/apps/web/core/components/icons/attachment/jpg-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/jpg-file-icon.tsx
@@ -4,6 +4,6 @@ import JpgFileIcon from "@/app/assets/attachment/jpg-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const JpgIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={JpgFileIcon} width={width} height={height} alt="JpgFileIcon" />
-);
+export function JpgIcon({ width, height }: ImageIconPros) {
+  return <img src={JpgFileIcon} width={width} height={height} alt="JpgFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/js-file-icon.tsx b/apps/web/core/components/icons/attachment/js-file-icon.tsx
index 7104579a0..5bfadeee3 100644
--- a/apps/web/core/components/icons/attachment/js-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/js-file-icon.tsx
@@ -4,6 +4,6 @@ import JsFileIcon from "@/app/assets/attachment/js-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const JavaScriptIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={JsFileIcon} width={width} height={height} alt="JsFileIcon" />
-);
+export function JavaScriptIcon({ width, height }: ImageIconPros) {
+  return <img src={JsFileIcon} width={width} height={height} alt="JsFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/pdf-file-icon.tsx b/apps/web/core/components/icons/attachment/pdf-file-icon.tsx
index c21b987da..84ef4cff2 100644
--- a/apps/web/core/components/icons/attachment/pdf-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/pdf-file-icon.tsx
@@ -4,6 +4,6 @@ import PDFFileIcon from "@/app/assets/attachment/pdf-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const PdfIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={PDFFileIcon} width={width} height={height} alt="PDFFileIcon" />
-);
+export function PdfIcon({ width, height }: ImageIconPros) {
+  return <img src={PDFFileIcon} width={width} height={height} alt="PDFFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/png-file-icon.tsx b/apps/web/core/components/icons/attachment/png-file-icon.tsx
index 621cabf1e..fd294adda 100644
--- a/apps/web/core/components/icons/attachment/png-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/png-file-icon.tsx
@@ -4,6 +4,6 @@ import PngFileIcon from "@/app/assets/attachment/png-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const PngIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={PngFileIcon} width={width} height={height} alt="PngFileIcon" />
-);
+export function PngIcon({ width, height }: ImageIconPros) {
+  return <img src={PngFileIcon} width={width} height={height} alt="PngFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/rar-file-icon.tsx b/apps/web/core/components/icons/attachment/rar-file-icon.tsx
index 611758c74..6e813520b 100644
--- a/apps/web/core/components/icons/attachment/rar-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/rar-file-icon.tsx
@@ -4,6 +4,6 @@ import RarFileIcon from "@/app/assets/attachment/rar-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const RarIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={RarFileIcon} width={width} height={height} alt="RarFileIcon" />
-);
+export function RarIcon({ width, height }: ImageIconPros) {
+  return <img src={RarFileIcon} width={width} height={height} alt="RarFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/setting-icon.tsx b/apps/web/core/components/icons/attachment/setting-icon.tsx
index 66606c673..dee77f934 100644
--- a/apps/web/core/components/icons/attachment/setting-icon.tsx
+++ b/apps/web/core/components/icons/attachment/setting-icon.tsx
@@ -2,23 +2,20 @@ import React from "react";
 
 import type { Props } from "../types";
 
-export const SettingIcon: React.FC<Props> = ({
-  width = "24",
-  height = "24",
-  color = "rgb(var(--color-text-200))",
-  className,
-}) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 24 24"
-    fill="currentColor"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      fill={color}
-      d="M12.9062 1.375C13.0518 1.375 13.1936 1.42121 13.3112 1.50695C13.4288 1.59269 13.5162 1.71355 13.5607 1.85212L14.317 4.202C14.6346 4.35737 14.9385 4.532 15.2286 4.72862L17.6431 4.20888C17.7854 4.17848 17.9338 4.19406 18.0667 4.25336C18.1997 4.31267 18.3103 4.41264 18.3828 4.53888L20.2886 7.8375C20.3614 7.96366 20.3922 8.10968 20.3766 8.2545C20.361 8.39931 20.2999 8.53544 20.202 8.64325L18.5451 10.472C18.5692 10.8227 18.5692 11.1746 18.5451 11.5252L20.202 13.3567C20.2999 13.4646 20.361 13.6007 20.3766 13.7455C20.3922 13.8903 20.3614 14.0363 20.2886 14.1625L18.3828 17.4625C18.3101 17.5885 18.1994 17.6882 18.0664 17.7472C17.9335 17.8063 17.7853 17.8216 17.6431 17.7911L15.2286 17.2714C14.9398 17.4666 14.6346 17.6426 14.3183 17.798L13.5607 20.1479C13.5162 20.2864 13.4288 20.4073 13.3112 20.4931C13.1936 20.5788 13.0518 20.625 12.9062 20.625H9.0947C8.94915 20.625 8.80735 20.5788 8.68973 20.4931C8.57211 20.4073 8.48474 20.2864 8.4402 20.1479L7.68533 17.7994C7.36856 17.6445 7.06302 17.4676 6.77095 17.27L4.35783 17.7911C4.21547 17.8215 4.06713 17.8059 3.93419 17.7466C3.80125 17.6873 3.69057 17.5874 3.61808 17.4611L1.71233 14.1625C1.63956 14.0363 1.60873 13.8903 1.6243 13.7455C1.63987 13.6007 1.70103 13.4646 1.79895 13.3567L3.45583 11.5252C3.43183 11.1755 3.43183 10.8245 3.45583 10.4748L1.79895 8.64325C1.70103 8.53544 1.63987 8.39931 1.6243 8.2545C1.60873 8.10968 1.63956 7.96366 1.71233 7.8375L3.61808 4.5375C3.69077 4.41151 3.80154 4.31183 3.93446 4.25278C4.06739 4.19373 4.21562 4.17836 4.35783 4.20888L6.77095 4.73C7.06245 4.53338 7.3677 4.356 7.68533 4.20063L8.44158 1.85212C8.48597 1.714 8.57293 1.59346 8.69 1.50776C8.80706 1.42205 8.94824 1.37559 9.09333 1.375H12.9048H12.9062ZM12.403 2.75H9.59795L8.81695 5.17963L8.29033 5.43675C8.03144 5.56344 7.78152 5.70769 7.54233 5.8685L7.05558 6.1985L4.55858 5.6595L3.15608 8.0905L4.86795 9.98525L4.8267 10.5682C4.80695 10.8557 4.80695 11.1443 4.8267 11.4318L4.86795 12.0147L3.15333 13.9095L4.5572 16.3405L7.0542 15.8029L7.54095 16.1315C7.78015 16.2923 8.03007 16.4366 8.28895 16.5632L8.81558 16.8204L9.59795 19.25H12.4057L13.1895 16.819L13.7147 16.5632C13.9733 16.4369 14.2228 16.2926 14.4613 16.1315L14.9467 15.8029L17.4451 16.3405L18.8476 13.9095L17.1343 12.0147L17.1756 11.4318C17.1954 11.1438 17.1954 10.8548 17.1756 10.5669L17.1343 9.98388L18.849 8.0905L17.4451 5.6595L14.9467 6.19575L14.4613 5.8685C14.2228 5.70737 13.9733 5.5631 13.7147 5.43675L13.1895 5.181L12.4043 2.75H12.403ZM11.0005 6.875C12.0945 6.875 13.1437 7.3096 13.9173 8.08318C14.6909 8.85677 15.1255 9.90598 15.1255 11C15.1255 12.094 14.6909 13.1432 13.9173 13.9168C13.1437 14.6904 12.0945 15.125 11.0005 15.125C9.90644 15.125 8.85723 14.6904 8.08364 13.9168C7.31005 13.1432 6.87545 12.094 6.87545 11C6.87545 9.90598 7.31005 8.85677 8.08364 8.08318C8.85723 7.3096 9.90644 6.875 11.0005 6.875ZM11.0005 8.25C10.2711 8.25 9.57164 8.53973 9.05591 9.05546C8.54018 9.57118 8.25045 10.2707 8.25045 11C8.25045 11.7293 8.54018 12.4288 9.05591 12.9445C9.57164 13.4603 10.2711 13.75 11.0005 13.75C11.7298 13.75 12.4293 13.4603 12.945 12.9445C13.4607 12.4288 13.7505 11.7293 13.7505 11C13.7505 10.2707 13.4607 9.57118 12.945 9.05546C12.4293 8.53973 11.7298 8.25 11.0005 8.25Z"
-    />
-  </svg>
-);
+export function SettingIcon({ width = "24", height = "24", color = "rgb(var(--color-text-200))", className }: Props) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 24 24"
+      fill="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill={color}
+        d="M12.9062 1.375C13.0518 1.375 13.1936 1.42121 13.3112 1.50695C13.4288 1.59269 13.5162 1.71355 13.5607 1.85212L14.317 4.202C14.6346 4.35737 14.9385 4.532 15.2286 4.72862L17.6431 4.20888C17.7854 4.17848 17.9338 4.19406 18.0667 4.25336C18.1997 4.31267 18.3103 4.41264 18.3828 4.53888L20.2886 7.8375C20.3614 7.96366 20.3922 8.10968 20.3766 8.2545C20.361 8.39931 20.2999 8.53544 20.202 8.64325L18.5451 10.472C18.5692 10.8227 18.5692 11.1746 18.5451 11.5252L20.202 13.3567C20.2999 13.4646 20.361 13.6007 20.3766 13.7455C20.3922 13.8903 20.3614 14.0363 20.2886 14.1625L18.3828 17.4625C18.3101 17.5885 18.1994 17.6882 18.0664 17.7472C17.9335 17.8063 17.7853 17.8216 17.6431 17.7911L15.2286 17.2714C14.9398 17.4666 14.6346 17.6426 14.3183 17.798L13.5607 20.1479C13.5162 20.2864 13.4288 20.4073 13.3112 20.4931C13.1936 20.5788 13.0518 20.625 12.9062 20.625H9.0947C8.94915 20.625 8.80735 20.5788 8.68973 20.4931C8.57211 20.4073 8.48474 20.2864 8.4402 20.1479L7.68533 17.7994C7.36856 17.6445 7.06302 17.4676 6.77095 17.27L4.35783 17.7911C4.21547 17.8215 4.06713 17.8059 3.93419 17.7466C3.80125 17.6873 3.69057 17.5874 3.61808 17.4611L1.71233 14.1625C1.63956 14.0363 1.60873 13.8903 1.6243 13.7455C1.63987 13.6007 1.70103 13.4646 1.79895 13.3567L3.45583 11.5252C3.43183 11.1755 3.43183 10.8245 3.45583 10.4748L1.79895 8.64325C1.70103 8.53544 1.63987 8.39931 1.6243 8.2545C1.60873 8.10968 1.63956 7.96366 1.71233 7.8375L3.61808 4.5375C3.69077 4.41151 3.80154 4.31183 3.93446 4.25278C4.06739 4.19373 4.21562 4.17836 4.35783 4.20888L6.77095 4.73C7.06245 4.53338 7.3677 4.356 7.68533 4.20063L8.44158 1.85212C8.48597 1.714 8.57293 1.59346 8.69 1.50776C8.80706 1.42205 8.94824 1.37559 9.09333 1.375H12.9048H12.9062ZM12.403 2.75H9.59795L8.81695 5.17963L8.29033 5.43675C8.03144 5.56344 7.78152 5.70769 7.54233 5.8685L7.05558 6.1985L4.55858 5.6595L3.15608 8.0905L4.86795 9.98525L4.8267 10.5682C4.80695 10.8557 4.80695 11.1443 4.8267 11.4318L4.86795 12.0147L3.15333 13.9095L4.5572 16.3405L7.0542 15.8029L7.54095 16.1315C7.78015 16.2923 8.03007 16.4366 8.28895 16.5632L8.81558 16.8204L9.59795 19.25H12.4057L13.1895 16.819L13.7147 16.5632C13.9733 16.4369 14.2228 16.2926 14.4613 16.1315L14.9467 15.8029L17.4451 16.3405L18.8476 13.9095L17.1343 12.0147L17.1756 11.4318C17.1954 11.1438 17.1954 10.8548 17.1756 10.5669L17.1343 9.98388L18.849 8.0905L17.4451 5.6595L14.9467 6.19575L14.4613 5.8685C14.2228 5.70737 13.9733 5.5631 13.7147 5.43675L13.1895 5.181L12.4043 2.75H12.403ZM11.0005 6.875C12.0945 6.875 13.1437 7.3096 13.9173 8.08318C14.6909 8.85677 15.1255 9.90598 15.1255 11C15.1255 12.094 14.6909 13.1432 13.9173 13.9168C13.1437 14.6904 12.0945 15.125 11.0005 15.125C9.90644 15.125 8.85723 14.6904 8.08364 13.9168C7.31005 13.1432 6.87545 12.094 6.87545 11C6.87545 9.90598 7.31005 8.85677 8.08364 8.08318C8.85723 7.3096 9.90644 6.875 11.0005 6.875ZM11.0005 8.25C10.2711 8.25 9.57164 8.53973 9.05591 9.05546C8.54018 9.57118 8.25045 10.2707 8.25045 11C8.25045 11.7293 8.54018 12.4288 9.05591 12.9445C9.57164 13.4603 10.2711 13.75 11.0005 13.75C11.7298 13.75 12.4293 13.4603 12.945 12.9445C13.4607 12.4288 13.7505 11.7293 13.7505 11C13.7505 10.2707 13.4607 9.57118 12.945 9.05546C12.4293 8.53973 11.7298 8.25 11.0005 8.25Z"
+      />
+    </svg>
+  );
+}
diff --git a/apps/web/core/components/icons/attachment/sheet-file-icon.tsx b/apps/web/core/components/icons/attachment/sheet-file-icon.tsx
index 3c86a4721..e78beb1df 100644
--- a/apps/web/core/components/icons/attachment/sheet-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/sheet-file-icon.tsx
@@ -4,6 +4,6 @@ import SheetFileIcon from "@/app/assets/attachment/excel-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const SheetIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={SheetFileIcon} width={width} height={height} alt="SheetFileIcon" />
-);
+export function SheetIcon({ width, height }: ImageIconPros) {
+  return <img src={SheetFileIcon} width={width} height={height} alt="SheetFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/svg-file-icon.tsx b/apps/web/core/components/icons/attachment/svg-file-icon.tsx
index 8f610b8ff..56541e525 100644
--- a/apps/web/core/components/icons/attachment/svg-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/svg-file-icon.tsx
@@ -4,6 +4,6 @@ import SvgFileIcon from "@/app/assets/attachment/svg-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const SvgIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={SvgFileIcon} width={width} height={height} alt="SvgFileIcon" />
-);
+export function SvgIcon({ width, height }: ImageIconPros) {
+  return <img src={SvgFileIcon} width={width} height={height} alt="SvgFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/tune-icon.tsx b/apps/web/core/components/icons/attachment/tune-icon.tsx
index f7711b4d9..ef3d439d6 100644
--- a/apps/web/core/components/icons/attachment/tune-icon.tsx
+++ b/apps/web/core/components/icons/attachment/tune-icon.tsx
@@ -2,18 +2,20 @@ import React from "react";
 
 import type { Props } from "../types";
 
-export const TuneIcon: React.FC<Props> = ({ width = "24", height = "24", className }) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 24 24"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      d="M3.75 18.95C3.53333 18.95 3.35417 18.8792 3.2125 18.7375C3.07083 18.5958 3 18.4167 3 18.2C3 17.9833 3.07083 17.8042 3.2125 17.6625C3.35417 17.5208 3.53333 17.45 3.75 17.45H8.425C8.64167 17.45 8.82083 17.5208 8.9625 17.6625C9.10417 17.8042 9.175 17.9833 9.175 18.2C9.175 18.4167 9.10417 18.5958 8.9625 18.7375C8.82083 18.8792 8.64167 18.95 8.425 18.95H3.75ZM3.75 6.55C3.53333 6.55 3.35417 6.47917 3.2125 6.3375C3.07083 6.19583 3 6.01667 3 5.8C3 5.58333 3.07083 5.40417 3.2125 5.2625C3.35417 5.12083 3.53333 5.05 3.75 5.05H12.575C12.7917 5.05 12.9708 5.12083 13.1125 5.2625C13.2542 5.40417 13.325 5.58333 13.325 5.8C13.325 6.01667 13.2542 6.19583 13.1125 6.3375C12.9708 6.47917 12.7917 6.55 12.575 6.55H3.75ZM11.425 21C11.2083 21 11.0292 20.9292 10.8875 20.7875C10.7458 20.6458 10.675 20.4667 10.675 20.25V16.125C10.675 15.9083 10.7458 15.7292 10.8875 15.5875C11.0292 15.4458 11.2083 15.375 11.425 15.375C11.6417 15.375 11.8208 15.4458 11.9625 15.5875C12.1042 15.7292 12.175 15.9083 12.175 16.125V17.45H20.25C20.4667 17.45 20.6458 17.5208 20.7875 17.6625C20.9292 17.8042 21 17.9833 21 18.2C21 18.4167 20.9292 18.5958 20.7875 18.7375C20.6458 18.8792 20.4667 18.95 20.25 18.95H12.175V20.25C12.175 20.4667 12.1042 20.6458 11.9625 20.7875C11.8208 20.9292 11.6417 21 11.425 21ZM8.425 14.8C8.20833 14.8 8.02917 14.7292 7.8875 14.5875C7.74583 14.4458 7.675 14.2667 7.675 14.05V12.75H3.75C3.53333 12.75 3.35417 12.6792 3.2125 12.5375C3.07083 12.3958 3 12.2167 3 12C3 11.7833 3.07083 11.6042 3.2125 11.4625C3.35417 11.3208 3.53333 11.25 3.75 11.25H7.675V9.9C7.675 9.68333 7.74583 9.50417 7.8875 9.3625C8.02917 9.22083 8.20833 9.15 8.425 9.15C8.64167 9.15 8.82083 9.22083 8.9625 9.3625C9.10417 9.50417 9.175 9.68333 9.175 9.9V14.05C9.175 14.2667 9.10417 14.4458 8.9625 14.5875C8.82083 14.7292 8.64167 14.8 8.425 14.8ZM11.425 12.75C11.2083 12.75 11.0292 12.6792 10.8875 12.5375C10.7458 12.3958 10.675 12.2167 10.675 12C10.675 11.7833 10.7458 11.6042 10.8875 11.4625C11.0292 11.3208 11.2083 11.25 11.425 11.25H20.25C20.4667 11.25 20.6458 11.3208 20.7875 11.4625C20.9292 11.6042 21 11.7833 21 12C21 12.2167 20.9292 12.3958 20.7875 12.5375C20.6458 12.6792 20.4667 12.75 20.25 12.75H11.425ZM15.575 8.625C15.3583 8.625 15.1792 8.55417 15.0375 8.4125C14.8958 8.27083 14.825 8.09167 14.825 7.875V3.75C14.825 3.53333 14.8958 3.35417 15.0375 3.2125C15.1792 3.07083 15.3583 3 15.575 3C15.7917 3 15.9708 3.07083 16.1125 3.2125C16.2542 3.35417 16.325 3.53333 16.325 3.75V5.05H20.25C20.4667 5.05 20.6458 5.12083 20.7875 5.2625C20.9292 5.40417 21 5.58333 21 5.8C21 6.01667 20.9292 6.19583 20.7875 6.3375C20.6458 6.47917 20.4667 6.55 20.25 6.55H16.325V7.875C16.325 8.09167 16.2542 8.27083 16.1125 8.4125C15.9708 8.55417 15.7917 8.625 15.575 8.625Z"
-      fill="#212529"
-    />
-  </svg>
-);
+export function TuneIcon({ width = "24", height = "24", className }: Props) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M3.75 18.95C3.53333 18.95 3.35417 18.8792 3.2125 18.7375C3.07083 18.5958 3 18.4167 3 18.2C3 17.9833 3.07083 17.8042 3.2125 17.6625C3.35417 17.5208 3.53333 17.45 3.75 17.45H8.425C8.64167 17.45 8.82083 17.5208 8.9625 17.6625C9.10417 17.8042 9.175 17.9833 9.175 18.2C9.175 18.4167 9.10417 18.5958 8.9625 18.7375C8.82083 18.8792 8.64167 18.95 8.425 18.95H3.75ZM3.75 6.55C3.53333 6.55 3.35417 6.47917 3.2125 6.3375C3.07083 6.19583 3 6.01667 3 5.8C3 5.58333 3.07083 5.40417 3.2125 5.2625C3.35417 5.12083 3.53333 5.05 3.75 5.05H12.575C12.7917 5.05 12.9708 5.12083 13.1125 5.2625C13.2542 5.40417 13.325 5.58333 13.325 5.8C13.325 6.01667 13.2542 6.19583 13.1125 6.3375C12.9708 6.47917 12.7917 6.55 12.575 6.55H3.75ZM11.425 21C11.2083 21 11.0292 20.9292 10.8875 20.7875C10.7458 20.6458 10.675 20.4667 10.675 20.25V16.125C10.675 15.9083 10.7458 15.7292 10.8875 15.5875C11.0292 15.4458 11.2083 15.375 11.425 15.375C11.6417 15.375 11.8208 15.4458 11.9625 15.5875C12.1042 15.7292 12.175 15.9083 12.175 16.125V17.45H20.25C20.4667 17.45 20.6458 17.5208 20.7875 17.6625C20.9292 17.8042 21 17.9833 21 18.2C21 18.4167 20.9292 18.5958 20.7875 18.7375C20.6458 18.8792 20.4667 18.95 20.25 18.95H12.175V20.25C12.175 20.4667 12.1042 20.6458 11.9625 20.7875C11.8208 20.9292 11.6417 21 11.425 21ZM8.425 14.8C8.20833 14.8 8.02917 14.7292 7.8875 14.5875C7.74583 14.4458 7.675 14.2667 7.675 14.05V12.75H3.75C3.53333 12.75 3.35417 12.6792 3.2125 12.5375C3.07083 12.3958 3 12.2167 3 12C3 11.7833 3.07083 11.6042 3.2125 11.4625C3.35417 11.3208 3.53333 11.25 3.75 11.25H7.675V9.9C7.675 9.68333 7.74583 9.50417 7.8875 9.3625C8.02917 9.22083 8.20833 9.15 8.425 9.15C8.64167 9.15 8.82083 9.22083 8.9625 9.3625C9.10417 9.50417 9.175 9.68333 9.175 9.9V14.05C9.175 14.2667 9.10417 14.4458 8.9625 14.5875C8.82083 14.7292 8.64167 14.8 8.425 14.8ZM11.425 12.75C11.2083 12.75 11.0292 12.6792 10.8875 12.5375C10.7458 12.3958 10.675 12.2167 10.675 12C10.675 11.7833 10.7458 11.6042 10.8875 11.4625C11.0292 11.3208 11.2083 11.25 11.425 11.25H20.25C20.4667 11.25 20.6458 11.3208 20.7875 11.4625C20.9292 11.6042 21 11.7833 21 12C21 12.2167 20.9292 12.3958 20.7875 12.5375C20.6458 12.6792 20.4667 12.75 20.25 12.75H11.425ZM15.575 8.625C15.3583 8.625 15.1792 8.55417 15.0375 8.4125C14.8958 8.27083 14.825 8.09167 14.825 7.875V3.75C14.825 3.53333 14.8958 3.35417 15.0375 3.2125C15.1792 3.07083 15.3583 3 15.575 3C15.7917 3 15.9708 3.07083 16.1125 3.2125C16.2542 3.35417 16.325 3.53333 16.325 3.75V5.05H20.25C20.4667 5.05 20.6458 5.12083 20.7875 5.2625C20.9292 5.40417 21 5.58333 21 5.8C21 6.01667 20.9292 6.19583 20.7875 6.3375C20.6458 6.47917 20.4667 6.55 20.25 6.55H16.325V7.875C16.325 8.09167 16.2542 8.27083 16.1125 8.4125C15.9708 8.55417 15.7917 8.625 15.575 8.625Z"
+        fill="#212529"
+      />
+    </svg>
+  );
+}
diff --git a/apps/web/core/components/icons/attachment/txt-file-icon.tsx b/apps/web/core/components/icons/attachment/txt-file-icon.tsx
index 687ad54e0..c1b203367 100644
--- a/apps/web/core/components/icons/attachment/txt-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/txt-file-icon.tsx
@@ -4,6 +4,6 @@ import TxtFileIcon from "@/app/assets/attachment/txt-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const TxtIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={TxtFileIcon} width={width} height={height} alt="TxtFileIcon" />
-);
+export function TxtIcon({ width, height }: ImageIconPros) {
+  return <img src={TxtFileIcon} width={width} height={height} alt="TxtFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/video-file-icon.tsx b/apps/web/core/components/icons/attachment/video-file-icon.tsx
index 892bcac54..9d201ae08 100644
--- a/apps/web/core/components/icons/attachment/video-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/video-file-icon.tsx
@@ -4,6 +4,6 @@ import VideoFileIcon from "@/app/assets/attachment/video-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const VideoIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={VideoFileIcon} width={width} height={height} alt="VideoFileIcon" />
-);
+export function VideoIcon({ width, height }: ImageIconPros) {
+  return <img src={VideoFileIcon} width={width} height={height} alt="VideoFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/attachment/zip-file-icon.tsx b/apps/web/core/components/icons/attachment/zip-file-icon.tsx
index 5830d719e..787eede55 100644
--- a/apps/web/core/components/icons/attachment/zip-file-icon.tsx
+++ b/apps/web/core/components/icons/attachment/zip-file-icon.tsx
@@ -4,6 +4,6 @@ import ZipFileIcon from "@/app/assets/attachment/zip-icon.png?url";
 // type
 import type { ImageIconPros } from "../types";
 
-export const ZipIcon: React.FC<ImageIconPros> = ({ width, height }) => (
-  <img src={ZipFileIcon} width={width} height={height} alt="ZipFileIcon" />
-);
+export function ZipIcon({ width, height }: ImageIconPros) {
+  return <img src={ZipFileIcon} width={width} height={height} alt="ZipFileIcon" />;
+}
diff --git a/apps/web/core/components/icons/locked-component.tsx b/apps/web/core/components/icons/locked-component.tsx
index 1fcd48680..dc44e415d 100644
--- a/apps/web/core/components/icons/locked-component.tsx
+++ b/apps/web/core/components/icons/locked-component.tsx
@@ -1,7 +1,7 @@
 import { Lock } from "lucide-react";
 import { Tooltip } from "@plane/propel/tooltip";
 
-export const LockedComponent = (props: { toolTipContent?: string }) => {
+export function LockedComponent(props: { toolTipContent?: string }) {
   const { toolTipContent } = props;
   const lockedComponent = (
     <div className="flex-shrink-0 flex h-7 items-center gap-2 rounded-full bg-custom-background-80 px-3 py-0.5 text-xs font-medium text-custom-text-300">
@@ -15,4 +15,4 @@ export const LockedComponent = (props: { toolTipContent?: string }) => {
       {toolTipContent ? <Tooltip tooltipContent={toolTipContent}>{lockedComponent}</Tooltip> : <>{lockedComponent}</>}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/inbox/content/inbox-issue-header.tsx b/apps/web/core/components/inbox/content/inbox-issue-header.tsx
index 21b59ddcf..26e0debf2 100644
--- a/apps/web/core/components/inbox/content/inbox-issue-header.tsx
+++ b/apps/web/core/components/inbox/content/inbox-issue-header.tsx
@@ -43,7 +43,7 @@ type TInboxIssueActionsHeader = {
   embedRemoveCurrentNotification?: () => void;
 };
 
-export const InboxIssueActionsHeader: FC<TInboxIssueActionsHeader> = observer((props) => {
+export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader(props: TInboxIssueActionsHeader) {
   const {
     workspaceSlug,
     projectId,
diff --git a/apps/web/core/components/inbox/content/inbox-issue-mobile-header.tsx b/apps/web/core/components/inbox/content/inbox-issue-mobile-header.tsx
index 79e71bbc3..ad679d743 100644
--- a/apps/web/core/components/inbox/content/inbox-issue-mobile-header.tsx
+++ b/apps/web/core/components/inbox/content/inbox-issue-mobile-header.tsx
@@ -41,7 +41,7 @@ type Props = {
   handleActionWithPermission: (isAdmin: boolean, action: () => void, errorMessage: string) => void;
 };
 
-export const InboxIssueActionsMobileHeader: React.FC<Props> = observer((props) => {
+export const InboxIssueActionsMobileHeader = observer(function InboxIssueActionsMobileHeader(props: Props) {
   const {
     inboxIssue,
     isSubmitting,
diff --git a/apps/web/core/components/inbox/content/issue-properties.tsx b/apps/web/core/components/inbox/content/issue-properties.tsx
index c1df42157..589bf503b 100644
--- a/apps/web/core/components/inbox/content/issue-properties.tsx
+++ b/apps/web/core/components/inbox/content/issue-properties.tsx
@@ -34,7 +34,7 @@ type Props = {
   duplicateIssueDetails: TInboxDuplicateIssueDetails | undefined;
 };
 
-export const InboxIssueContentProperties: React.FC<Props> = observer((props) => {
+export const InboxIssueContentProperties = observer(function InboxIssueContentProperties(props: Props) {
   const { workspaceSlug, projectId, issue, issueOperations, isEditable, duplicateIssueDetails } = props;
 
   const router = useAppRouter();
diff --git a/apps/web/core/components/inbox/content/issue-root.tsx b/apps/web/core/components/inbox/content/issue-root.tsx
index f1f7c7d9d..84a8028d0 100644
--- a/apps/web/core/components/inbox/content/issue-root.tsx
+++ b/apps/web/core/components/inbox/content/issue-root.tsx
@@ -49,7 +49,7 @@ type Props = {
   setIsSubmitting: Dispatch<SetStateAction<TNameDescriptionLoader>>;
 };
 
-export const InboxIssueMainContent: React.FC<Props> = observer((props) => {
+export const InboxIssueMainContent = observer(function InboxIssueMainContent(props: Props) {
   const { workspaceSlug, projectId, inboxIssue, isEditable, isSubmitting, setIsSubmitting } = props;
   // refs
   const editorRef = useRef<EditorRefApi>(null);
diff --git a/apps/web/core/components/inbox/content/root.tsx b/apps/web/core/components/inbox/content/root.tsx
index 696af4afb..e54a391e9 100644
--- a/apps/web/core/components/inbox/content/root.tsx
+++ b/apps/web/core/components/inbox/content/root.tsx
@@ -24,7 +24,7 @@ type TInboxContentRoot = {
   embedRemoveCurrentNotification?: () => void;
 };
 
-export const InboxContentRoot: FC<TInboxContentRoot> = observer((props) => {
+export const InboxContentRoot = observer(function InboxContentRoot(props: TInboxContentRoot) {
   const {
     workspaceSlug,
     projectId,
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/date.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/date.tsx
index 6b85e0115..3f548e048 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/date.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/date.tsx
@@ -15,7 +15,9 @@ type InboxIssueAppliedFiltersDate = {
   label: string;
 };
 
-export const InboxIssueAppliedFiltersDate: FC<InboxIssueAppliedFiltersDate> = observer((props) => {
+export const InboxIssueAppliedFiltersDate = observer(function InboxIssueAppliedFiltersDate(
+  props: InboxIssueAppliedFiltersDate
+) {
   const { filterKey, label } = props;
   // hooks
   const { inboxFilters, handleInboxIssueFilters } = useProjectInbox();
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/label.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/label.tsx
index 64b624a62..d750913cc 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/label.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/label.tsx
@@ -6,11 +6,11 @@ import { Tag } from "@plane/ui";
 import { useLabel } from "@/hooks/store/use-label";
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
 
-const LabelIcons = ({ color }: { color: string }) => (
-  <span className="h-2.5 w-2.5 rounded-full" style={{ backgroundColor: color }} />
-);
+function LabelIcons({ color }: { color: string }) {
+  return <span className="h-2.5 w-2.5 rounded-full" style={{ backgroundColor: color }} />;
+}
 
-export const InboxIssueAppliedFiltersLabel: FC = observer(() => {
+export const InboxIssueAppliedFiltersLabel = observer(function InboxIssueAppliedFiltersLabel() {
   // hooks
   const { inboxFilters, handleInboxIssueFilters } = useProjectInbox();
   const { getLabelById } = useLabel();
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/member.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/member.tsx
index 4b16af6e7..9e04f9d2f 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/member.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/member.tsx
@@ -19,7 +19,9 @@ type InboxIssueAppliedFiltersMember = {
   label: string;
 };
 
-export const InboxIssueAppliedFiltersMember: FC<InboxIssueAppliedFiltersMember> = observer((props) => {
+export const InboxIssueAppliedFiltersMember = observer(function InboxIssueAppliedFiltersMember(
+  props: InboxIssueAppliedFiltersMember
+) {
   const { filterKey, label } = props;
   // hooks
   const { inboxFilters, handleInboxIssueFilters } = useProjectInbox();
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/priority.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/priority.tsx
index 162317e71..ff806bffb 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/priority.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/priority.tsx
@@ -10,7 +10,7 @@ import { Tag } from "@plane/ui";
 // hooks
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
 
-export const InboxIssueAppliedFiltersPriority: FC = observer(() => {
+export const InboxIssueAppliedFiltersPriority = observer(function InboxIssueAppliedFiltersPriority() {
   // hooks
   const { t } = useTranslation();
   const { inboxFilters, handleInboxIssueFilters } = useProjectInbox();
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/root.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/root.tsx
index 8ae9e17e0..bf33b282e 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/root.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/root.tsx
@@ -12,7 +12,7 @@ import { InboxIssueAppliedFiltersPriority } from "./priority";
 import { InboxIssueAppliedFiltersState } from "./state";
 import { InboxIssueAppliedFiltersStatus } from "./status";
 
-export const InboxIssueAppliedFilters: FC = observer(() => {
+export const InboxIssueAppliedFilters = observer(function InboxIssueAppliedFilters() {
   const { getAppliedFiltersCount } = useProjectInbox();
 
   if (getAppliedFiltersCount === 0) return <></>;
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/state.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/state.tsx
index 64ccd16b7..75aac595a 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/state.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/state.tsx
@@ -9,7 +9,7 @@ import { Tag } from "@plane/ui";
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
 import { useProjectState } from "@/hooks/store/use-project-state";
 
-export const InboxIssueAppliedFiltersState: FC = observer(() => {
+export const InboxIssueAppliedFiltersState = observer(function InboxIssueAppliedFiltersState() {
   // hooks
   const { inboxFilters, handleInboxIssueFilters } = useProjectInbox();
   const { getStateById } = useProjectState();
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/status.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/status.tsx
index 0e8487511..f4e045c35 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/status.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/status.tsx
@@ -10,7 +10,7 @@ import { Tag } from "@plane/ui";
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
 import { InboxStatusIcon } from "../../inbox-status-icon";
 
-export const InboxIssueAppliedFiltersStatus: FC = observer(() => {
+export const InboxIssueAppliedFiltersStatus = observer(function InboxIssueAppliedFiltersStatus() {
   // hooks
   const { inboxFilters, handleInboxIssueFilters } = useProjectInbox();
   const { t } = useTranslation();
diff --git a/apps/web/core/components/inbox/inbox-filter/filters/date.tsx b/apps/web/core/components/inbox/inbox-filter/filters/date.tsx
index 4e1dd286b..56a105d8d 100644
--- a/apps/web/core/components/inbox/inbox-filter/filters/date.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/filters/date.tsx
@@ -22,7 +22,7 @@ const isDate = (date: string) => {
   return datePattern.test(date);
 };
 
-export const FilterDate: FC<Props> = observer((props) => {
+export const FilterDate = observer(function FilterDate(props: Props) {
   const { filterKey, label, searchQuery } = props;
   // hooks
   const { inboxFilters, handleInboxIssueFilters } = useProjectInbox();
diff --git a/apps/web/core/components/inbox/inbox-filter/filters/filter-selection.tsx b/apps/web/core/components/inbox/inbox-filter/filters/filter-selection.tsx
index e53c423b3..f989be259 100644
--- a/apps/web/core/components/inbox/inbox-filter/filters/filter-selection.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/filters/filter-selection.tsx
@@ -16,7 +16,7 @@ import { FilterPriority } from "./priority";
 import { FilterState } from "./state";
 import { FilterStatus } from "./status";
 
-export const InboxIssueFilterSelection: FC = observer(() => {
+export const InboxIssueFilterSelection = observer(function InboxIssueFilterSelection() {
   // hooks
   const { isMobile } = usePlatformOS();
   const {
diff --git a/apps/web/core/components/inbox/inbox-filter/filters/labels.tsx b/apps/web/core/components/inbox/inbox-filter/filters/labels.tsx
index eddfbf6f8..0baf74895 100644
--- a/apps/web/core/components/inbox/inbox-filter/filters/labels.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/filters/labels.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import type { FC } from "react";
 import { useState } from "react";
 import { observer } from "mobx-react";
@@ -10,16 +9,16 @@ import { FilterHeader, FilterOption } from "@/components/issues/issue-layouts/fi
 // hooks
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
 
-const LabelIcons = ({ color }: { color: string }) => (
-  <span className="h-2.5 w-2.5 rounded-full" style={{ backgroundColor: color }} />
-);
+function LabelIcons({ color }: { color: string }) {
+  return <span className="h-2.5 w-2.5 rounded-full" style={{ backgroundColor: color }} />;
+}
 
 type Props = {
   labels: IIssueLabel[] | undefined;
   searchQuery: string;
 };
 
-export const FilterLabels: FC<Props> = observer((props) => {
+export const FilterLabels = observer(function FilterLabels(props: Props) {
   const { labels, searchQuery } = props;
 
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/inbox/inbox-filter/filters/members.tsx b/apps/web/core/components/inbox/inbox-filter/filters/members.tsx
index 80566808b..59f008073 100644
--- a/apps/web/core/components/inbox/inbox-filter/filters/members.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/filters/members.tsx
@@ -24,7 +24,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterMember: FC<Props> = observer((props: Props) => {
+export const FilterMember = observer(function FilterMember(props: Props) {
   const { filterKey, label = "Members", memberIds, searchQuery } = props;
   // hooks
   const { inboxFilters, handleInboxIssueFilters } = useProjectInbox();
diff --git a/apps/web/core/components/inbox/inbox-filter/filters/priority.tsx b/apps/web/core/components/inbox/inbox-filter/filters/priority.tsx
index aa2608ff2..edcfcc674 100644
--- a/apps/web/core/components/inbox/inbox-filter/filters/priority.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/filters/priority.tsx
@@ -17,7 +17,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterPriority: FC<Props> = observer((props) => {
+export const FilterPriority = observer(function FilterPriority(props: Props) {
   const { searchQuery } = props;
   // hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/inbox/inbox-filter/filters/state.tsx b/apps/web/core/components/inbox/inbox-filter/filters/state.tsx
index 3fb6586f3..e29af9a32 100644
--- a/apps/web/core/components/inbox/inbox-filter/filters/state.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/filters/state.tsx
@@ -17,7 +17,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterState: FC<Props> = observer((props) => {
+export const FilterState = observer(function FilterState(props: Props) {
   const { states, searchQuery } = props;
 
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/inbox/inbox-filter/filters/status.tsx b/apps/web/core/components/inbox/inbox-filter/filters/status.tsx
index b0d9217e1..d814cd71e 100644
--- a/apps/web/core/components/inbox/inbox-filter/filters/status.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/filters/status.tsx
@@ -16,7 +16,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterStatus: FC<Props> = observer((props) => {
+export const FilterStatus = observer(function FilterStatus(props: Props) {
   const { searchQuery } = props;
   // hooks
   const { currentTab, inboxFilters, handleInboxIssueFilters } = useProjectInbox();
diff --git a/apps/web/core/components/inbox/inbox-filter/root.tsx b/apps/web/core/components/inbox/inbox-filter/root.tsx
index 02501d560..523b75818 100644
--- a/apps/web/core/components/inbox/inbox-filter/root.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/root.tsx
@@ -21,7 +21,7 @@ const largeButton = (
     <ChevronDownIcon className="size-3" strokeWidth={2} />
   </div>
 );
-export const FiltersRoot: FC = () => {
+export function FiltersRoot() {
   const windowSize = useSize();
 
   return (
@@ -36,4 +36,4 @@ export const FiltersRoot: FC = () => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/inbox/inbox-filter/sorting/order-by.tsx b/apps/web/core/components/inbox/inbox-filter/sorting/order-by.tsx
index bde31a218..ad43c9ef5 100644
--- a/apps/web/core/components/inbox/inbox-filter/sorting/order-by.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/sorting/order-by.tsx
@@ -16,7 +16,7 @@ import { cn } from "@plane/utils";
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
 import useSize from "@/hooks/use-window-size";
 
-export const InboxIssueOrderByDropdown: FC = observer(() => {
+export const InboxIssueOrderByDropdown = observer(function InboxIssueOrderByDropdown() {
   // hooks
   const { t } = useTranslation();
   const windowSize = useSize();
diff --git a/apps/web/core/components/inbox/inbox-issue-status.tsx b/apps/web/core/components/inbox/inbox-issue-status.tsx
index fbafb6af5..86a425473 100644
--- a/apps/web/core/components/inbox/inbox-issue-status.tsx
+++ b/apps/web/core/components/inbox/inbox-issue-status.tsx
@@ -15,7 +15,7 @@ type Props = {
   showDescription?: boolean;
 };
 
-export const InboxIssueStatus: React.FC<Props> = observer((props) => {
+export const InboxIssueStatus = observer(function InboxIssueStatus(props: Props) {
   const { inboxIssue, iconSize = 16, showDescription = false } = props;
   //hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/inbox/inbox-status-icon.tsx b/apps/web/core/components/inbox/inbox-status-icon.tsx
index 7235b32e7..4a0350314 100644
--- a/apps/web/core/components/inbox/inbox-status-icon.tsx
+++ b/apps/web/core/components/inbox/inbox-status-icon.tsx
@@ -30,7 +30,7 @@ export const ICON_PROPERTIES = {
     bgColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "" : "bg-gray-500/10"),
   },
 };
-export const InboxStatusIcon = ({
+export function InboxStatusIcon({
   type,
   size,
   className,
@@ -40,9 +40,9 @@ export const InboxStatusIcon = ({
   size?: number;
   className?: string;
   renderColor?: boolean;
-}) => {
+}) {
   if (type === undefined) return null;
   const Icon = ICON_PROPERTIES[type];
   if (!Icon) return null;
   return <Icon.icon size={size} className={cn(`w-3 h-3 ${renderColor && Icon?.textColor(false)}`, className)} />;
-};
+}
diff --git a/apps/web/core/components/inbox/modals/create-modal/create-root.tsx b/apps/web/core/components/inbox/modals/create-modal/create-root.tsx
index d10094fa2..878489fdf 100644
--- a/apps/web/core/components/inbox/modals/create-modal/create-root.tsx
+++ b/apps/web/core/components/inbox/modals/create-modal/create-root.tsx
@@ -54,7 +54,7 @@ export const defaultIssueData: Partial<TIssue> = {
   target_date: "",
 };
 
-export const InboxIssueCreateRoot: FC<TInboxIssueCreateRoot> = observer((props) => {
+export const InboxIssueCreateRoot = observer(function InboxIssueCreateRoot(props: TInboxIssueCreateRoot) {
   const { workspaceSlug, projectId, handleModalClose, isDuplicateModalOpen, handleDuplicateIssueModal } = props;
   // states
   const [uploadedAssetIds, setUploadedAssetIds] = useState<string[]>([]);
diff --git a/apps/web/core/components/inbox/modals/create-modal/issue-description.tsx b/apps/web/core/components/inbox/modals/create-modal/issue-description.tsx
index 4e88b9589..144fa1089 100644
--- a/apps/web/core/components/inbox/modals/create-modal/issue-description.tsx
+++ b/apps/web/core/components/inbox/modals/create-modal/issue-description.tsx
@@ -34,7 +34,7 @@ type TInboxIssueDescription = {
 };
 
 // TODO: have to implement GPT Assistance
-export const InboxIssueDescription: FC<TInboxIssueDescription> = observer((props) => {
+export const InboxIssueDescription = observer(function InboxIssueDescription(props: TInboxIssueDescription) {
   const {
     containerClassName,
     workspaceSlug,
diff --git a/apps/web/core/components/inbox/modals/create-modal/issue-properties.tsx b/apps/web/core/components/inbox/modals/create-modal/issue-properties.tsx
index 3d7c5abba..ac6992afb 100644
--- a/apps/web/core/components/inbox/modals/create-modal/issue-properties.tsx
+++ b/apps/web/core/components/inbox/modals/create-modal/issue-properties.tsx
@@ -28,7 +28,7 @@ type TInboxIssueProperties = {
   isVisible?: boolean;
 };
 
-export const InboxIssueProperties: FC<TInboxIssueProperties> = observer((props) => {
+export const InboxIssueProperties = observer(function InboxIssueProperties(props: TInboxIssueProperties) {
   const { projectId, data, handleData, isVisible = false } = props;
   // hooks
   const { areEstimateEnabledByProjectId } = useProjectEstimates();
diff --git a/apps/web/core/components/inbox/modals/create-modal/issue-title.tsx b/apps/web/core/components/inbox/modals/create-modal/issue-title.tsx
index 711efdfd7..4e06be991 100644
--- a/apps/web/core/components/inbox/modals/create-modal/issue-title.tsx
+++ b/apps/web/core/components/inbox/modals/create-modal/issue-title.tsx
@@ -18,7 +18,7 @@ type TInboxIssueTitle = {
   isTitleLengthMoreThan255Character?: boolean;
 };
 
-export const InboxIssueTitle: FC<TInboxIssueTitle> = observer((props) => {
+export const InboxIssueTitle = observer(function InboxIssueTitle(props: TInboxIssueTitle) {
   const { data, handleData, isTitleLengthMoreThan255Character } = props;
   // hooks
   const { isMobile } = usePlatformOS();
diff --git a/apps/web/core/components/inbox/modals/create-modal/modal.tsx b/apps/web/core/components/inbox/modals/create-modal/modal.tsx
index acce369bb..80347958e 100644
--- a/apps/web/core/components/inbox/modals/create-modal/modal.tsx
+++ b/apps/web/core/components/inbox/modals/create-modal/modal.tsx
@@ -16,7 +16,7 @@ type TInboxIssueCreateModalRoot = {
   handleModalClose: () => void;
 };
 
-export const InboxIssueCreateModalRoot: FC<TInboxIssueCreateModalRoot> = (props) => {
+export function InboxIssueCreateModalRoot(props: TInboxIssueCreateModalRoot) {
   const { workspaceSlug, projectId, modalState, handleModalClose } = props;
   // states
   const [isDuplicateModalOpen, setIsDuplicateModalOpen] = useState(false);
@@ -46,4 +46,4 @@ export const InboxIssueCreateModalRoot: FC<TInboxIssueCreateModalRoot> = (props)
       />
     </ModalCore>
   );
-};
+}
diff --git a/apps/web/core/components/inbox/modals/decline-issue-modal.tsx b/apps/web/core/components/inbox/modals/decline-issue-modal.tsx
index 56749cc55..fbd3aba4d 100644
--- a/apps/web/core/components/inbox/modals/decline-issue-modal.tsx
+++ b/apps/web/core/components/inbox/modals/decline-issue-modal.tsx
@@ -14,7 +14,7 @@ type Props = {
   onSubmit: () => Promise<void>;
 };
 
-export const DeclineIssueModal: React.FC<Props> = (props) => {
+export function DeclineIssueModal(props: Props) {
   const { isOpen, onClose, data, onSubmit } = props;
   // states
   const [isDeclining, setIsDeclining] = useState(false);
@@ -57,4 +57,4 @@ export const DeclineIssueModal: React.FC<Props> = (props) => {
       }}
     />
   );
-};
+}
diff --git a/apps/web/core/components/inbox/modals/delete-issue-modal.tsx b/apps/web/core/components/inbox/modals/delete-issue-modal.tsx
index 0b3538fd0..90d893db2 100644
--- a/apps/web/core/components/inbox/modals/delete-issue-modal.tsx
+++ b/apps/web/core/components/inbox/modals/delete-issue-modal.tsx
@@ -18,7 +18,12 @@ type Props = {
   onSubmit: () => Promise<void>;
 };
 
-export const DeleteInboxIssueModal: React.FC<Props> = observer(({ isOpen, onClose, onSubmit, data }) => {
+export const DeleteInboxIssueModal = observer(function DeleteInboxIssueModal({
+  isOpen,
+  onClose,
+  onSubmit,
+  data,
+}: Props) {
   // states
   const [isDeleting, setIsDeleting] = useState(false);
   // store hooks
diff --git a/apps/web/core/components/inbox/modals/select-duplicate.tsx b/apps/web/core/components/inbox/modals/select-duplicate.tsx
index a44b7e48f..983757af7 100644
--- a/apps/web/core/components/inbox/modals/select-duplicate.tsx
+++ b/apps/web/core/components/inbox/modals/select-duplicate.tsx
@@ -32,7 +32,7 @@ type Props = {
 
 const projectService = new ProjectService();
 
-export const SelectDuplicateInboxIssueModal: React.FC<Props> = (props) => {
+export function SelectDuplicateInboxIssueModal(props: Props) {
   const { isOpen, onClose, onSubmit, value } = props;
   // router
   const { workspaceSlug, projectId, issueId } = useParams();
@@ -193,4 +193,4 @@ export const SelectDuplicateInboxIssueModal: React.FC<Props> = (props) => {
       </div>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/inbox/modals/snooze-issue-modal.tsx b/apps/web/core/components/inbox/modals/snooze-issue-modal.tsx
index 513bb0f13..cf6e5d65a 100644
--- a/apps/web/core/components/inbox/modals/snooze-issue-modal.tsx
+++ b/apps/web/core/components/inbox/modals/snooze-issue-modal.tsx
@@ -15,7 +15,7 @@ export type InboxIssueSnoozeModalProps = {
   handleClose: () => void;
 };
 
-export const InboxIssueSnoozeModal: FC<InboxIssueSnoozeModalProps> = (props) => {
+export function InboxIssueSnoozeModal(props: InboxIssueSnoozeModalProps) {
   const { isOpen, handleClose, value, onConfirm } = props;
   // states
   const [date, setDate] = useState(value || new Date());
@@ -82,4 +82,4 @@ export const InboxIssueSnoozeModal: FC<InboxIssueSnoozeModalProps> = (props) =>
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/inbox/root.tsx b/apps/web/core/components/inbox/root.tsx
index fec25cede..429918f67 100644
--- a/apps/web/core/components/inbox/root.tsx
+++ b/apps/web/core/components/inbox/root.tsx
@@ -23,7 +23,7 @@ type TInboxIssueRoot = {
   navigationTab?: EInboxIssueCurrentTab | undefined;
 };
 
-export const InboxIssueRoot: FC<TInboxIssueRoot> = observer((props) => {
+export const InboxIssueRoot = observer(function InboxIssueRoot(props: TInboxIssueRoot) {
   const { workspaceSlug, projectId, inboxIssueId, inboxAccessible, navigationTab } = props;
   // states
   const [isMobileSidebar, setIsMobileSidebar] = useState(true);
diff --git a/apps/web/core/components/inbox/sidebar/inbox-list-item.tsx b/apps/web/core/components/inbox/sidebar/inbox-list-item.tsx
index 2326824c9..eda8c0e28 100644
--- a/apps/web/core/components/inbox/sidebar/inbox-list-item.tsx
+++ b/apps/web/core/components/inbox/sidebar/inbox-list-item.tsx
@@ -29,7 +29,7 @@ type InboxIssueListItemProps = {
   setIsMobileSidebar: (value: boolean) => void;
 };
 
-export const InboxIssueListItem: FC<InboxIssueListItemProps> = observer((props) => {
+export const InboxIssueListItem = observer(function InboxIssueListItem(props: InboxIssueListItemProps) {
   const { workspaceSlug, projectId, inboxIssueId, projectIdentifier, setIsMobileSidebar } = props;
   // router
   const searchParams = useSearchParams();
diff --git a/apps/web/core/components/inbox/sidebar/inbox-list.tsx b/apps/web/core/components/inbox/sidebar/inbox-list.tsx
index 808ffdadb..7cace3d50 100644
--- a/apps/web/core/components/inbox/sidebar/inbox-list.tsx
+++ b/apps/web/core/components/inbox/sidebar/inbox-list.tsx
@@ -12,7 +12,7 @@ export type InboxIssueListProps = {
   setIsMobileSidebar: (value: boolean) => void;
 };
 
-export const InboxIssueList: FC<InboxIssueListProps> = observer((props) => {
+export const InboxIssueList = observer(function InboxIssueList(props: InboxIssueListProps) {
   const { workspaceSlug, projectId, projectIdentifier, inboxIssueIds, setIsMobileSidebar } = props;
 
   return (
diff --git a/apps/web/core/components/inbox/sidebar/root.tsx b/apps/web/core/components/inbox/sidebar/root.tsx
index 16558d2ff..b91e3118c 100644
--- a/apps/web/core/components/inbox/sidebar/root.tsx
+++ b/apps/web/core/components/inbox/sidebar/root.tsx
@@ -40,7 +40,7 @@ const tabNavigationOptions: { key: TInboxIssueCurrentTab; i18n_label: string }[]
   },
 ];
 
-export const InboxSidebar: FC<IInboxSidebarProps> = observer((props) => {
+export const InboxSidebar = observer(function InboxSidebar(props: IInboxSidebarProps) {
   const { workspaceSlug, projectId, inboxIssueId, setIsMobileSidebar } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/instance/maintenance-view.tsx b/apps/web/core/components/instance/maintenance-view.tsx
index 3c6e12f30..830ae4739 100644
--- a/apps/web/core/components/instance/maintenance-view.tsx
+++ b/apps/web/core/components/instance/maintenance-view.tsx
@@ -10,7 +10,7 @@ import DefaultLayout from "@/layouts/default-layout";
 // components
 import { MaintenanceMessage } from "@/plane-web/components/instance";
 
-export const MaintenanceView: FC = () => {
+export function MaintenanceView() {
   // hooks
   const { resolvedTheme } = useTheme();
   // derived values
@@ -33,4 +33,4 @@ export const MaintenanceView: FC = () => {
       </div>
     </DefaultLayout>
   );
-};
+}
diff --git a/apps/web/core/components/instance/not-ready-view.tsx b/apps/web/core/components/instance/not-ready-view.tsx
index 69f278102..1b3c6938b 100644
--- a/apps/web/core/components/instance/not-ready-view.tsx
+++ b/apps/web/core/components/instance/not-ready-view.tsx
@@ -11,7 +11,7 @@ import PlaneBackgroundPatternDark from "@/app/assets/auth/background-pattern-dar
 import PlaneBackgroundPattern from "@/app/assets/auth/background-pattern.svg?url";
 import PlaneTakeOffImage from "@/app/assets/plane-takeoff.png?url";
 
-export const InstanceNotReady: FC = () => {
+export function InstanceNotReady() {
   const { resolvedTheme } = useTheme();
   const patternBackground = resolvedTheme === "dark" ? PlaneBackgroundPatternDark : PlaneBackgroundPattern;
 
@@ -53,4 +53,4 @@ export const InstanceNotReady: FC = () => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/integration/delete-import-modal.tsx b/apps/web/core/components/integration/delete-import-modal.tsx
index 04b06b77a..289a7732e 100644
--- a/apps/web/core/components/integration/delete-import-modal.tsx
+++ b/apps/web/core/components/integration/delete-import-modal.tsx
@@ -31,7 +31,7 @@ type Props = {
 // services
 const integrationService = new IntegrationService();
 
-export const DeleteImportModal: React.FC<Props> = ({ isOpen, handleClose, data }) => {
+export function DeleteImportModal({ isOpen, handleClose, data }: Props) {
   const [deleteLoading, setDeleteLoading] = useState(false);
   const [confirmDeleteImport, setConfirmDeleteImport] = useState(false);
 
@@ -147,4 +147,4 @@ export const DeleteImportModal: React.FC<Props> = ({ isOpen, handleClose, data }
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/integration/github/auth.tsx b/apps/web/core/components/integration/github/auth.tsx
index 6706e6aa0..7a8ab9312 100644
--- a/apps/web/core/components/integration/github/auth.tsx
+++ b/apps/web/core/components/integration/github/auth.tsx
@@ -14,7 +14,7 @@ type Props = {
   provider: string | undefined;
 };
 
-export const GithubAuth: React.FC<Props> = observer(({ workspaceIntegration, provider }) => {
+export const GithubAuth = observer(function GithubAuth({ workspaceIntegration, provider }: Props) {
   // store hooks
   const { config } = useInstance();
   // hooks
diff --git a/apps/web/core/components/integration/github/import-configure.tsx b/apps/web/core/components/integration/github/import-configure.tsx
index 28a9e30bf..d880cd653 100644
--- a/apps/web/core/components/integration/github/import-configure.tsx
+++ b/apps/web/core/components/integration/github/import-configure.tsx
@@ -14,12 +14,7 @@ type Props = {
   workspaceIntegrations: IWorkspaceIntegration[] | undefined;
 };
 
-export const GithubImportConfigure: React.FC<Props> = ({
-  handleStepChange,
-  provider,
-  appIntegrations,
-  workspaceIntegrations,
-}) => {
+export function GithubImportConfigure({ handleStepChange, provider, appIntegrations, workspaceIntegrations }: Props) {
   // current integration from all the integrations available
   const integration =
     appIntegrations && appIntegrations.length > 0 && appIntegrations.find((i) => i.provider === provider);
@@ -54,4 +49,4 @@ export const GithubImportConfigure: React.FC<Props> = ({
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/integration/github/import-confirm.tsx b/apps/web/core/components/integration/github/import-confirm.tsx
index 7ee58f70a..ce8e80d1b 100644
--- a/apps/web/core/components/integration/github/import-confirm.tsx
+++ b/apps/web/core/components/integration/github/import-confirm.tsx
@@ -14,19 +14,21 @@ type Props = {
   watch: UseFormWatch<TFormValues>;
 };
 
-export const GithubImportConfirm: FC<Props> = ({ handleStepChange, watch }) => (
-  <div className="mt-6">
-    <h4 className="font-medium text-custom-text-200">
-      You are about to import work items from {watch("github").full_name}. Click on {'"'}Confirm & Import{'" '}
-      to complete the process.
-    </h4>
-    <div className="mt-6 flex items-center justify-between">
-      <Button variant="neutral-primary" onClick={() => handleStepChange("import-users")}>
-        Back
-      </Button>
-      <Button variant="primary" type="submit">
-        Confirm & Import
-      </Button>
+export function GithubImportConfirm({ handleStepChange, watch }: Props) {
+  return (
+    <div className="mt-6">
+      <h4 className="font-medium text-custom-text-200">
+        You are about to import work items from {watch("github").full_name}. Click on {'"'}Confirm & Import{'" '}
+        to complete the process.
+      </h4>
+      <div className="mt-6 flex items-center justify-between">
+        <Button variant="neutral-primary" onClick={() => handleStepChange("import-users")}>
+          Back
+        </Button>
+        <Button variant="primary" type="submit">
+          Confirm & Import
+        </Button>
+      </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/integration/github/import-data.tsx b/apps/web/core/components/integration/github/import-data.tsx
index a5f72f9ea..e98837096 100644
--- a/apps/web/core/components/integration/github/import-data.tsx
+++ b/apps/web/core/components/integration/github/import-data.tsx
@@ -24,7 +24,7 @@ type Props = {
   watch: UseFormWatch<TFormValues>;
 };
 
-export const GithubImportData: FC<Props> = observer((props) => {
+export const GithubImportData = observer(function GithubImportData(props: Props) {
   const { handleStepChange, integration, control, watch } = props;
   // store hooks
   const { workspaceProjectIds, getProjectById } = useProject();
diff --git a/apps/web/core/components/integration/github/import-users.tsx b/apps/web/core/components/integration/github/import-users.tsx
index 2057af739..c915ea525 100644
--- a/apps/web/core/components/integration/github/import-users.tsx
+++ b/apps/web/core/components/integration/github/import-users.tsx
@@ -17,7 +17,7 @@ type Props = {
   watch: UseFormWatch<TFormValues>;
 };
 
-export const GithubImportUsers: FC<Props> = ({ handleStepChange, users, setUsers, watch }) => {
+export function GithubImportUsers({ handleStepChange, users, setUsers, watch }: Props) {
   const isInvalid = users.filter((u) => u.import !== false && u.email === "").length > 0;
 
   return (
@@ -50,4 +50,4 @@ export const GithubImportUsers: FC<Props> = ({ handleStepChange, users, setUsers
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/integration/github/repo-details.tsx b/apps/web/core/components/integration/github/repo-details.tsx
index 73ae1dae8..f7595ec78 100644
--- a/apps/web/core/components/integration/github/repo-details.tsx
+++ b/apps/web/core/components/integration/github/repo-details.tsx
@@ -28,7 +28,7 @@ type Props = {
 // services
 const githubIntegrationService = new GithubIntegrationService();
 
-export const GithubRepoDetails: FC<Props> = ({ selectedRepo, handleStepChange, setUsers, setValue }) => {
+export function GithubRepoDetails({ selectedRepo, handleStepChange, setUsers, setValue }: Props) {
   const { workspaceSlug } = useParams();
 
   const { data: repoInfo } = useSWR(
@@ -103,4 +103,4 @@ export const GithubRepoDetails: FC<Props> = ({ selectedRepo, handleStepChange, s
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/integration/github/root.tsx b/apps/web/core/components/integration/github/root.tsx
index fdb1cfd43..544defd25 100644
--- a/apps/web/core/components/integration/github/root.tsx
+++ b/apps/web/core/components/integration/github/root.tsx
@@ -80,7 +80,7 @@ const integrationWorkflowData = [
 const integrationService = new IntegrationService();
 const githubIntegrationService = new GithubIntegrationService();
 
-export const GithubImporterRoot: React.FC = () => {
+export function GithubImporterRoot() {
   const [currentStep, setCurrentStep] = useState<IIntegrationData>({
     state: "import-configure",
   });
@@ -245,4 +245,4 @@ export const GithubImporterRoot: React.FC = () => {
       </div>
     </form>
   );
-};
+}
diff --git a/apps/web/core/components/integration/github/select-repository.tsx b/apps/web/core/components/integration/github/select-repository.tsx
index 45f21fc8e..09535aa25 100644
--- a/apps/web/core/components/integration/github/select-repository.tsx
+++ b/apps/web/core/components/integration/github/select-repository.tsx
@@ -22,7 +22,7 @@ type Props = {
 
 const projectService = new ProjectService();
 
-export const SelectRepository: React.FC<Props> = (props) => {
+export function SelectRepository(props: Props) {
   const { integration, value, label, onChange, characterLimit = 25 } = props;
   // router
   const { workspaceSlug } = useParams();
@@ -84,4 +84,4 @@ export const SelectRepository: React.FC<Props> = (props) => {
       optionsClassName="w-48"
     />
   );
-};
+}
diff --git a/apps/web/core/components/integration/github/single-user-select.tsx b/apps/web/core/components/integration/github/single-user-select.tsx
index 04212ccdd..4afe792c5 100644
--- a/apps/web/core/components/integration/github/single-user-select.tsx
+++ b/apps/web/core/components/integration/github/single-user-select.tsx
@@ -40,7 +40,7 @@ const importOptions = [
 // services
 const workspaceService = new WorkspaceService();
 
-export const SingleUserSelect: React.FC<Props> = ({ collaborator, index, users, setUsers }) => {
+export function SingleUserSelect({ collaborator, index, users, setUsers }: Props) {
   const { workspaceSlug } = useParams();
 
   const { data: members } = useSWR(
@@ -131,4 +131,4 @@ export const SingleUserSelect: React.FC<Props> = ({ collaborator, index, users,
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/integration/guide.tsx b/apps/web/core/components/integration/guide.tsx
index 13a2c7ac5..68ee29562 100644
--- a/apps/web/core/components/integration/guide.tsx
+++ b/apps/web/core/components/integration/guide.tsx
@@ -41,7 +41,7 @@ const getImporterLogo = (provider: string) => {
 };
 
 // FIXME: [Deprecated] Remove this component
-const IntegrationGuide = observer(() => {
+const IntegrationGuide = observer(function IntegrationGuide() {
   // states
   const [refreshing, setRefreshing] = useState(false);
   const [deleteImportModal, setDeleteImportModal] = useState(false);
diff --git a/apps/web/core/components/integration/jira/confirm-import.tsx b/apps/web/core/components/integration/jira/confirm-import.tsx
index a2f493db0..e424d9292 100644
--- a/apps/web/core/components/integration/jira/confirm-import.tsx
+++ b/apps/web/core/components/integration/jira/confirm-import.tsx
@@ -6,7 +6,7 @@ import type { IJiraImporterForm } from "@plane/types";
 
 // types
 
-export const JiraConfirmImport: React.FC = () => {
+export function JiraConfirmImport() {
   const { watch } = useFormContext<IJiraImporterForm>();
 
   return (
@@ -44,4 +44,4 @@ export const JiraConfirmImport: React.FC = () => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/integration/jira/give-details.tsx b/apps/web/core/components/integration/jira/give-details.tsx
index 5067dc816..2b1a51a63 100644
--- a/apps/web/core/components/integration/jira/give-details.tsx
+++ b/apps/web/core/components/integration/jira/give-details.tsx
@@ -17,7 +17,7 @@ import { useCommandPalette } from "@/hooks/store/use-command-palette";
 import { useProject } from "@/hooks/store/use-project";
 // types
 
-export const JiraGetImportDetail: React.FC = observer(() => {
+export const JiraGetImportDetail = observer(function JiraGetImportDetail() {
   // store hooks
   const { toggleCreateProjectModal } = useCommandPalette();
   const { workspaceProjectIds, getProjectById } = useProject();
@@ -64,7 +64,6 @@ export const JiraGetImportDetail: React.FC = observer(() => {
           {errors.metadata?.api_token && <p className="text-xs text-red-500">{errors.metadata.api_token.message}</p>}
         </div>
       </div>
-
       <div className="grid grid-cols-1 gap-10 md:grid-cols-2">
         <div className="col-span-1">
           <h3 className="font-semibold">Jira Project Key</h3>
@@ -95,7 +94,6 @@ export const JiraGetImportDetail: React.FC = observer(() => {
           )}
         </div>
       </div>
-
       <div className="grid grid-cols-1 gap-10 md:grid-cols-2">
         <div className="col-span-1">
           <h3 className="font-semibold">Jira Email Address</h3>
@@ -125,7 +123,6 @@ export const JiraGetImportDetail: React.FC = observer(() => {
           {errors.metadata?.email && <p className="text-xs text-red-500">{errors.metadata.email.message}</p>}
         </div>
       </div>
-
       <div className="grid grid-cols-1 gap-10 md:grid-cols-2">
         <div className="col-span-1">
           <h3 className="font-semibold">Jira Installation or Cloud Host Name</h3>
@@ -156,7 +153,6 @@ export const JiraGetImportDetail: React.FC = observer(() => {
           )}
         </div>
       </div>
-
       <div className="grid grid-cols-1 gap-10 md:grid-cols-2">
         <div className="col-span-1">
           <h3 className="font-semibold">Import to project</h3>
diff --git a/apps/web/core/components/integration/jira/import-users.tsx b/apps/web/core/components/integration/jira/import-users.tsx
index f9c543646..7c0589799 100644
--- a/apps/web/core/components/integration/jira/import-users.tsx
+++ b/apps/web/core/components/integration/jira/import-users.tsx
@@ -17,7 +17,7 @@ import { WorkspaceService } from "@/plane-web/services";
 
 const workspaceService = new WorkspaceService();
 
-export const JiraImportUsers: FC = () => {
+export function JiraImportUsers() {
   const { workspaceSlug } = useParams();
   // form info
   const {
@@ -151,4 +151,4 @@ export const JiraImportUsers: FC = () => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/integration/jira/jira-project-detail.tsx b/apps/web/core/components/integration/jira/jira-project-detail.tsx
index 56384276f..8f42caf70 100644
--- a/apps/web/core/components/integration/jira/jira-project-detail.tsx
+++ b/apps/web/core/components/integration/jira/jira-project-detail.tsx
@@ -31,7 +31,7 @@ type Props = {
 // services
 const jiraImporterService = new JiraImporterService();
 
-export const JiraProjectDetail: React.FC<Props> = (props) => {
+export function JiraProjectDetail(props: Props) {
   const { setCurrentStep, setDisableTopBarAfter } = props;
 
   const {
@@ -166,4 +166,4 @@ export const JiraProjectDetail: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/integration/jira/root.tsx b/apps/web/core/components/integration/jira/root.tsx
index 01b17b2e3..40e932e0c 100644
--- a/apps/web/core/components/integration/jira/root.tsx
+++ b/apps/web/core/components/integration/jira/root.tsx
@@ -53,7 +53,7 @@ const integrationWorkflowData: Array<{
 // services
 const jiraImporterService = new JiraImporterService();
 
-export const JiraImporterRoot: React.FC = () => {
+export function JiraImporterRoot() {
   const [currentStep, setCurrentStep] = useState<IJiraIntegrationData>({
     state: "import-configure",
   });
@@ -199,4 +199,4 @@ export const JiraImporterRoot: React.FC = () => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/integration/single-import.tsx b/apps/web/core/components/integration/single-import.tsx
index ae8c6b01b..0d4508368 100644
--- a/apps/web/core/components/integration/single-import.tsx
+++ b/apps/web/core/components/integration/single-import.tsx
@@ -20,7 +20,7 @@ type Props = {
   handleDelete: () => void;
 };
 
-export const SingleImport: React.FC<Props> = observer(({ service, refreshing, handleDelete }) => {
+export const SingleImport = observer(function SingleImport({ service, refreshing, handleDelete }: Props) {
   const { t } = useTranslation();
 
   const importer = IMPORTERS_LIST.find((i) => i.provider === service.service);
diff --git a/apps/web/core/components/integration/single-integration-card.tsx b/apps/web/core/components/integration/single-integration-card.tsx
index b72849b4f..909597696 100644
--- a/apps/web/core/components/integration/single-integration-card.tsx
+++ b/apps/web/core/components/integration/single-integration-card.tsx
@@ -45,7 +45,7 @@ const integrationDetails: { [key: string]: any } = {
 // services
 const integrationService = new IntegrationService();
 
-export const SingleIntegrationCard: React.FC<Props> = observer(({ integration }) => {
+export const SingleIntegrationCard = observer(function SingleIntegrationCard({ integration }: Props) {
   // states
   const [deletingIntegration, setDeletingIntegration] = useState(false);
   // router
diff --git a/apps/web/core/components/integration/slack/select-channel.tsx b/apps/web/core/components/integration/slack/select-channel.tsx
index fb51f4a1b..eb52129a6 100644
--- a/apps/web/core/components/integration/slack/select-channel.tsx
+++ b/apps/web/core/components/integration/slack/select-channel.tsx
@@ -22,7 +22,7 @@ type Props = {
 
 const appInstallationService = new AppInstallationService();
 
-export const SelectChannel: React.FC<Props> = observer(({ integration }) => {
+export const SelectChannel = observer(function SelectChannel({ integration }: Props) {
   // store hooks
   const { config } = useInstance();
   // states
diff --git a/apps/web/core/components/issues/archive-issue-modal.tsx b/apps/web/core/components/issues/archive-issue-modal.tsx
index 98204aa18..66ab1f8d8 100644
--- a/apps/web/core/components/issues/archive-issue-modal.tsx
+++ b/apps/web/core/components/issues/archive-issue-modal.tsx
@@ -20,7 +20,7 @@ type Props = {
   onSubmit?: () => Promise<void>;
 };
 
-export const ArchiveIssueModal: React.FC<Props> = (props) => {
+export function ArchiveIssueModal(props: Props) {
   const { dataId, data, isOpen, handleClose, onSubmit } = props;
   const { t } = useTranslation();
   // states
@@ -110,4 +110,4 @@ export const ArchiveIssueModal: React.FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/issues/archived-issues-header.tsx b/apps/web/core/components/issues/archived-issues-header.tsx
index 324130573..e6db99444 100644
--- a/apps/web/core/components/issues/archived-issues-header.tsx
+++ b/apps/web/core/components/issues/archived-issues-header.tsx
@@ -15,7 +15,7 @@ import { WorkItemFiltersToggle } from "@/components/work-item-filters/filters-to
 import { useIssues } from "@/hooks/store/use-issues";
 import { useProject } from "@/hooks/store/use-project";
 
-export const ArchivedIssuesHeader: FC = observer(() => {
+export const ArchivedIssuesHeader = observer(function ArchivedIssuesHeader() {
   // router
   const { workspaceSlug: routerWorkspaceSlug, projectId: routerProjectId } = useParams();
   const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined;
diff --git a/apps/web/core/components/issues/attachment/attachment-detail.tsx b/apps/web/core/components/issues/attachment/attachment-detail.tsx
index f7ca525bf..c1dfb3703 100644
--- a/apps/web/core/components/issues/attachment/attachment-detail.tsx
+++ b/apps/web/core/components/issues/attachment/attachment-detail.tsx
@@ -37,7 +37,7 @@ type TIssueAttachmentsDetail = {
   disabled?: boolean;
 };
 
-export const IssueAttachmentsDetail: FC<TIssueAttachmentsDetail> = observer((props) => {
+export const IssueAttachmentsDetail = observer(function IssueAttachmentsDetail(props: TIssueAttachmentsDetail) {
   // props
   const { attachmentId, attachmentHelpers, disabled } = props;
   // store hooks
diff --git a/apps/web/core/components/issues/attachment/attachment-item-list.tsx b/apps/web/core/components/issues/attachment/attachment-item-list.tsx
index 25da16388..6651616f3 100644
--- a/apps/web/core/components/issues/attachment/attachment-item-list.tsx
+++ b/apps/web/core/components/issues/attachment/attachment-item-list.tsx
@@ -29,7 +29,7 @@ type TIssueAttachmentItemList = {
   issueServiceType?: TIssueServiceType;
 };
 
-export const IssueAttachmentItemList: FC<TIssueAttachmentItemList> = observer((props) => {
+export const IssueAttachmentItemList = observer(function IssueAttachmentItemList(props: TIssueAttachmentItemList) {
   const {
     workspaceSlug,
     projectId,
diff --git a/apps/web/core/components/issues/attachment/attachment-list-item.tsx b/apps/web/core/components/issues/attachment/attachment-list-item.tsx
index d4610ff0a..b72ed0325 100644
--- a/apps/web/core/components/issues/attachment/attachment-list-item.tsx
+++ b/apps/web/core/components/issues/attachment/attachment-list-item.tsx
@@ -26,7 +26,7 @@ type TIssueAttachmentsListItem = {
   issueServiceType?: TIssueServiceType;
 };
 
-export const IssueAttachmentsListItem: FC<TIssueAttachmentsListItem> = observer((props) => {
+export const IssueAttachmentsListItem = observer(function IssueAttachmentsListItem(props: TIssueAttachmentsListItem) {
   const { t } = useTranslation();
   // props
   const { attachmentId, disabled, issueServiceType = EIssueServiceType.ISSUES } = props;
diff --git a/apps/web/core/components/issues/attachment/attachment-list-upload-item.tsx b/apps/web/core/components/issues/attachment/attachment-list-upload-item.tsx
index af7b092e1..5e322def6 100644
--- a/apps/web/core/components/issues/attachment/attachment-list-upload-item.tsx
+++ b/apps/web/core/components/issues/attachment/attachment-list-upload-item.tsx
@@ -17,7 +17,7 @@ type Props = {
   uploadStatus: TAttachmentUploadStatus;
 };
 
-export const IssueAttachmentsUploadItem: React.FC<Props> = observer((props) => {
+export const IssueAttachmentsUploadItem = observer(function IssueAttachmentsUploadItem(props: Props) {
   // props
   const { uploadStatus } = props;
   // derived values
diff --git a/apps/web/core/components/issues/attachment/attachment-upload-details.tsx b/apps/web/core/components/issues/attachment/attachment-upload-details.tsx
index adee71737..701035b98 100644
--- a/apps/web/core/components/issues/attachment/attachment-upload-details.tsx
+++ b/apps/web/core/components/issues/attachment/attachment-upload-details.tsx
@@ -17,7 +17,7 @@ type Props = {
   uploadStatus: TAttachmentUploadStatus;
 };
 
-export const IssueAttachmentsUploadDetails: React.FC<Props> = observer((props) => {
+export const IssueAttachmentsUploadDetails = observer(function IssueAttachmentsUploadDetails(props: Props) {
   // props
   const { uploadStatus } = props;
   // derived values
diff --git a/apps/web/core/components/issues/attachment/attachment-upload.tsx b/apps/web/core/components/issues/attachment/attachment-upload.tsx
index 959a07d5d..a2e078a94 100644
--- a/apps/web/core/components/issues/attachment/attachment-upload.tsx
+++ b/apps/web/core/components/issues/attachment/attachment-upload.tsx
@@ -14,7 +14,7 @@ type Props = {
   attachmentOperations: TAttachmentOperationsModal;
 };
 
-export const IssueAttachmentUpload: React.FC<Props> = observer((props) => {
+export const IssueAttachmentUpload = observer(function IssueAttachmentUpload(props: Props) {
   const { workspaceSlug, disabled = false, attachmentOperations } = props;
   // states
   const [isLoading, setIsLoading] = useState(false);
diff --git a/apps/web/core/components/issues/attachment/attachments-list.tsx b/apps/web/core/components/issues/attachment/attachments-list.tsx
index 3ce00e0e1..6cd0636ba 100644
--- a/apps/web/core/components/issues/attachment/attachments-list.tsx
+++ b/apps/web/core/components/issues/attachment/attachments-list.tsx
@@ -14,7 +14,7 @@ type TIssueAttachmentsList = {
   disabled?: boolean;
 };
 
-export const IssueAttachmentsList: FC<TIssueAttachmentsList> = observer((props) => {
+export const IssueAttachmentsList = observer(function IssueAttachmentsList(props: TIssueAttachmentsList) {
   const { issueId, attachmentHelpers, disabled } = props;
   // store hooks
   const {
diff --git a/apps/web/core/components/issues/attachment/delete-attachment-modal.tsx b/apps/web/core/components/issues/attachment/delete-attachment-modal.tsx
index 4eb79fc39..5ea7225d9 100644
--- a/apps/web/core/components/issues/attachment/delete-attachment-modal.tsx
+++ b/apps/web/core/components/issues/attachment/delete-attachment-modal.tsx
@@ -25,7 +25,7 @@ type Props = {
   issueServiceType?: TIssueServiceType;
 };
 
-export const IssueAttachmentDeleteModal: FC<Props> = observer((props) => {
+export const IssueAttachmentDeleteModal = observer(function IssueAttachmentDeleteModal(props: Props) {
   const { t } = useTranslation();
   const { isOpen, onClose, attachmentId, attachmentOperations, issueServiceType = EIssueServiceType.ISSUES } = props;
   // states
diff --git a/apps/web/core/components/issues/attachment/root.tsx b/apps/web/core/components/issues/attachment/root.tsx
index a0bc00241..ad60259f8 100644
--- a/apps/web/core/components/issues/attachment/root.tsx
+++ b/apps/web/core/components/issues/attachment/root.tsx
@@ -15,7 +15,7 @@ export type TIssueAttachmentRoot = {
   disabled?: boolean;
 };
 
-export const IssueAttachmentRoot: FC<TIssueAttachmentRoot> = observer((props) => {
+export const IssueAttachmentRoot = observer(function IssueAttachmentRoot(props: TIssueAttachmentRoot) {
   // props
   const { workspaceSlug, projectId, issueId, disabled = false } = props;
   // hooks
diff --git a/apps/web/core/components/issues/bulk-operations/upgrade-banner.tsx b/apps/web/core/components/issues/bulk-operations/upgrade-banner.tsx
index d53da7dfb..edd2fa1d6 100644
--- a/apps/web/core/components/issues/bulk-operations/upgrade-banner.tsx
+++ b/apps/web/core/components/issues/bulk-operations/upgrade-banner.tsx
@@ -8,7 +8,7 @@ type Props = {
   className?: string;
 };
 
-export const BulkOperationsUpgradeBanner: React.FC<Props> = (props) => {
+export function BulkOperationsUpgradeBanner(props: Props) {
   const { className } = props;
 
   return (
@@ -29,4 +29,4 @@ export const BulkOperationsUpgradeBanner: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/confirm-issue-discard.tsx b/apps/web/core/components/issues/confirm-issue-discard.tsx
index d5bb1bcac..66d5a66f3 100644
--- a/apps/web/core/components/issues/confirm-issue-discard.tsx
+++ b/apps/web/core/components/issues/confirm-issue-discard.tsx
@@ -14,7 +14,7 @@ type Props = {
   onConfirm: () => Promise<void>;
 };
 
-export const ConfirmIssueDiscard: React.FC<Props> = (props) => {
+export function ConfirmIssueDiscard(props: Props) {
   const { isOpen, handleClose, onDiscard, onConfirm } = props;
 
   const [isLoading, setIsLoading] = useState(false);
@@ -93,4 +93,4 @@ export const ConfirmIssueDiscard: React.FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/issues/create-issue-toast-action-items.tsx b/apps/web/core/components/issues/create-issue-toast-action-items.tsx
index 4c2d05163..34d1ff65a 100644
--- a/apps/web/core/components/issues/create-issue-toast-action-items.tsx
+++ b/apps/web/core/components/issues/create-issue-toast-action-items.tsx
@@ -16,7 +16,9 @@ type TCreateIssueToastActionItems = {
   isEpic?: boolean;
 };
 
-export const CreateIssueToastActionItems: FC<TCreateIssueToastActionItems> = observer((props) => {
+export const CreateIssueToastActionItems = observer(function CreateIssueToastActionItems(
+  props: TCreateIssueToastActionItems
+) {
   const { workspaceSlug, projectId, issueId, isEpic = false } = props;
   // state
   const [copied, setCopied] = useState(false);
diff --git a/apps/web/core/components/issues/delete-issue-modal.tsx b/apps/web/core/components/issues/delete-issue-modal.tsx
index b23fd0d6b..77c0c85ee 100644
--- a/apps/web/core/components/issues/delete-issue-modal.tsx
+++ b/apps/web/core/components/issues/delete-issue-modal.tsx
@@ -27,7 +27,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const DeleteIssueModal: React.FC<Props> = observer((props) => {
+export const DeleteIssueModal = observer(function DeleteIssueModal(props: Props) {
   const { dataId, data, isOpen, handleClose, isSubIssue = false, onSubmit, isEpic = false } = props;
   // states
   const [isDeleting, setIsDeleting] = useState(false);
diff --git a/apps/web/core/components/issues/filters.tsx b/apps/web/core/components/issues/filters.tsx
index 55abf99df..56bfef0fe 100644
--- a/apps/web/core/components/issues/filters.tsx
+++ b/apps/web/core/components/issues/filters.tsx
@@ -38,7 +38,7 @@ const LAYOUTS = [
   EIssueLayoutTypes.GANTT,
 ];
 
-export const HeaderFilters = observer((props: Props) => {
+export const HeaderFilters = observer(function HeaderFilters(props: Props) {
   const {
     currentProjectDetails,
     projectId,
diff --git a/apps/web/core/components/issues/issue-detail-widgets/action-buttons.tsx b/apps/web/core/components/issues/issue-detail-widgets/action-buttons.tsx
index ec4cba9aa..f6ff8c533 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/action-buttons.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/action-buttons.tsx
@@ -25,7 +25,7 @@ type Props = {
   hideWidgets?: TWorkItemWidgets[];
 };
 
-export const IssueDetailWidgetActionButtons: FC<Props> = (props) => {
+export function IssueDetailWidgetActionButtons(props: Props) {
   const { workspaceSlug, projectId, issueId, disabled, issueServiceType, hideWidgets } = props;
   // translation
   const { t } = useTranslation();
@@ -99,4 +99,4 @@ export const IssueDetailWidgetActionButtons: FC<Props> = (props) => {
       />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail-widgets/attachments/content.tsx b/apps/web/core/components/issues/issue-detail-widgets/attachments/content.tsx
index ff986df04..9670be148 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/attachments/content.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/attachments/content.tsx
@@ -16,7 +16,7 @@ type Props = {
   issueServiceType?: TIssueServiceType;
 };
 
-export const IssueAttachmentsCollapsibleContent: FC<Props> = observer((props) => {
+export const IssueAttachmentsCollapsibleContent = observer(function IssueAttachmentsCollapsibleContent(props: Props) {
   const { workspaceSlug, projectId, issueId, disabled, issueServiceType = EIssueServiceType.ISSUES } = props;
   // helper
   const attachmentHelpers = useAttachmentOperations(workspaceSlug, projectId, issueId, issueServiceType);
diff --git a/apps/web/core/components/issues/issue-detail-widgets/attachments/quick-action-button.tsx b/apps/web/core/components/issues/issue-detail-widgets/attachments/quick-action-button.tsx
index 423045df7..ca41e86ca 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/attachments/quick-action-button.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/attachments/quick-action-button.tsx
@@ -25,7 +25,7 @@ type Props = {
   issueServiceType: TIssueServiceType;
 };
 
-export const IssueAttachmentActionButton: FC<Props> = observer((props) => {
+export const IssueAttachmentActionButton = observer(function IssueAttachmentActionButton(props: Props) {
   const { workspaceSlug, projectId, issueId, customButton, disabled = false, issueServiceType } = props;
   // state
   const [isLoading, setIsLoading] = useState(false);
diff --git a/apps/web/core/components/issues/issue-detail-widgets/attachments/root.tsx b/apps/web/core/components/issues/issue-detail-widgets/attachments/root.tsx
index a40fc909e..43ff80123 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/attachments/root.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/attachments/root.tsx
@@ -19,7 +19,7 @@ type Props = {
   issueServiceType: TIssueServiceType;
 };
 
-export const AttachmentsCollapsible: FC<Props> = observer((props) => {
+export const AttachmentsCollapsible = observer(function AttachmentsCollapsible(props: Props) {
   const { workspaceSlug, projectId, issueId, disabled = false, issueServiceType } = props;
   // store hooks
   const { openWidgets, toggleOpenWidget } = useIssueDetail(issueServiceType);
diff --git a/apps/web/core/components/issues/issue-detail-widgets/attachments/title.tsx b/apps/web/core/components/issues/issue-detail-widgets/attachments/title.tsx
index fc3a03030..8ef0383e0 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/attachments/title.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/attachments/title.tsx
@@ -20,7 +20,7 @@ type Props = {
   issueServiceType?: TIssueServiceType;
 };
 
-export const IssueAttachmentsCollapsibleTitle: FC<Props> = observer((props) => {
+export const IssueAttachmentsCollapsibleTitle = observer(function IssueAttachmentsCollapsibleTitle(props: Props) {
   const { isOpen, workspaceSlug, projectId, issueId, disabled, issueServiceType = EIssueServiceType.ISSUES } = props;
   const { t } = useTranslation();
   // store hooks
diff --git a/apps/web/core/components/issues/issue-detail-widgets/issue-detail-widget-collapsibles.tsx b/apps/web/core/components/issues/issue-detail-widgets/issue-detail-widget-collapsibles.tsx
index 1e138f854..49c1070be 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/issue-detail-widget-collapsibles.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/issue-detail-widget-collapsibles.tsx
@@ -24,7 +24,7 @@ type Props = {
   hideWidgets?: TWorkItemWidgets[];
 };
 
-export const IssueDetailWidgetCollapsibles: FC<Props> = observer((props) => {
+export const IssueDetailWidgetCollapsibles = observer(function IssueDetailWidgetCollapsibles(props: Props) {
   const { workspaceSlug, projectId, issueId, disabled, issueServiceType, hideWidgets } = props;
   // store hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail-widgets/issue-detail-widget-modals.tsx b/apps/web/core/components/issues/issue-detail-widgets/issue-detail-widget-modals.tsx
index c2cdc0c57..c13ec4088 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/issue-detail-widget-modals.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/issue-detail-widget-modals.tsx
@@ -24,7 +24,7 @@ type Props = {
   hideWidgets?: TWorkItemWidgets[];
 };
 
-export const IssueDetailWidgetModals: FC<Props> = observer((props) => {
+export const IssueDetailWidgetModals = observer(function IssueDetailWidgetModals(props: Props) {
   const { workspaceSlug, projectId, issueId, issueServiceType, hideWidgets } = props;
   // store hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail-widgets/links/content.tsx b/apps/web/core/components/issues/issue-detail-widgets/links/content.tsx
index 3b1bc20bb..33eaaf3c9 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/links/content.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/links/content.tsx
@@ -15,7 +15,7 @@ type Props = {
   issueServiceType: TIssueServiceType;
 };
 
-export const IssueLinksCollapsibleContent: FC<Props> = (props) => {
+export function IssueLinksCollapsibleContent(props: Props) {
   const { workspaceSlug, projectId, issueId, disabled, issueServiceType } = props;
 
   // helper
@@ -29,4 +29,4 @@ export const IssueLinksCollapsibleContent: FC<Props> = (props) => {
       issueServiceType={issueServiceType}
     />
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail-widgets/links/quick-action-button.tsx b/apps/web/core/components/issues/issue-detail-widgets/links/quick-action-button.tsx
index ee068640d..900c1ef06 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/links/quick-action-button.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/links/quick-action-button.tsx
@@ -14,7 +14,7 @@ type Props = {
   issueServiceType: TIssueServiceType;
 };
 
-export const IssueLinksActionButton: FC<Props> = observer((props) => {
+export const IssueLinksActionButton = observer(function IssueLinksActionButton(props: Props) {
   const { customButton, disabled = false, issueServiceType } = props;
   // store hooks
   const { toggleIssueLinkModal } = useIssueDetail(issueServiceType);
diff --git a/apps/web/core/components/issues/issue-detail-widgets/links/root.tsx b/apps/web/core/components/issues/issue-detail-widgets/links/root.tsx
index 8fb3cc069..054f9d31d 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/links/root.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/links/root.tsx
@@ -19,7 +19,7 @@ type Props = {
   issueServiceType: TIssueServiceType;
 };
 
-export const LinksCollapsible: FC<Props> = observer((props) => {
+export const LinksCollapsible = observer(function LinksCollapsible(props: Props) {
   const { workspaceSlug, projectId, issueId, disabled = false, issueServiceType } = props;
   // store hooks
   const { openWidgets, toggleOpenWidget } = useIssueDetail(issueServiceType);
diff --git a/apps/web/core/components/issues/issue-detail-widgets/links/title.tsx b/apps/web/core/components/issues/issue-detail-widgets/links/title.tsx
index 0e9eec1f5..604c0bab8 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/links/title.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/links/title.tsx
@@ -18,7 +18,7 @@ type Props = {
   issueServiceType: TIssueServiceType;
 };
 
-export const IssueLinksCollapsibleTitle: FC<Props> = observer((props) => {
+export const IssueLinksCollapsibleTitle = observer(function IssueLinksCollapsibleTitle(props: Props) {
   const { isOpen, issueId, disabled, issueServiceType } = props;
   // translation
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-detail-widgets/relations/content.tsx b/apps/web/core/components/issues/issue-detail-widgets/relations/content.tsx
index 01fea1d60..4c9f017c1 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/relations/content.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/relations/content.tsx
@@ -37,7 +37,7 @@ export type TRelationObject = {
   placeholder: string;
 };
 
-export const RelationsCollapsibleContent: FC<Props> = observer((props) => {
+export const RelationsCollapsibleContent = observer(function RelationsCollapsibleContent(props: Props) {
   const { workspaceSlug, issueId, disabled = false, issueServiceType = EIssueServiceType.ISSUES } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx b/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx
index 8de45b38e..d2bb3a8f1 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx
@@ -20,7 +20,7 @@ type Props = {
   issueServiceType: TIssueServiceType;
 };
 
-export const RelationActionButton: FC<Props> = observer((props) => {
+export const RelationActionButton = observer(function RelationActionButton(props: Props) {
   const { customButton, issueId, disabled = false, issueServiceType } = props;
   const { t } = useTranslation();
   // store hooks
diff --git a/apps/web/core/components/issues/issue-detail-widgets/relations/root.tsx b/apps/web/core/components/issues/issue-detail-widgets/relations/root.tsx
index 3305cff94..3137254a6 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/relations/root.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/relations/root.tsx
@@ -18,7 +18,7 @@ type Props = {
   issueServiceType: TIssueServiceType;
 };
 
-export const RelationsCollapsible: FC<Props> = observer((props) => {
+export const RelationsCollapsible = observer(function RelationsCollapsible(props: Props) {
   const { workspaceSlug, issueId, disabled = false, issueServiceType } = props;
   // store hooks
   const { openWidgets, toggleOpenWidget } = useIssueDetail(issueServiceType);
diff --git a/apps/web/core/components/issues/issue-detail-widgets/relations/title.tsx b/apps/web/core/components/issues/issue-detail-widgets/relations/title.tsx
index abe06701f..2fdd88c85 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/relations/title.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/relations/title.tsx
@@ -20,7 +20,7 @@ type Props = {
   issueServiceType?: TIssueServiceType;
 };
 
-export const RelationsCollapsibleTitle: FC<Props> = observer((props) => {
+export const RelationsCollapsibleTitle = observer(function RelationsCollapsibleTitle(props: Props) {
   const { isOpen, issueId, disabled, issueServiceType = EIssueServiceType.ISSUES } = props;
   const { t } = useTranslation();
   // store hook
diff --git a/apps/web/core/components/issues/issue-detail-widgets/root.tsx b/apps/web/core/components/issues/issue-detail-widgets/root.tsx
index 12ac49744..36f503134 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/root.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/root.tsx
@@ -19,7 +19,7 @@ type Props = {
   hideWidgets?: TWorkItemWidgets[];
 };
 
-export const IssueDetailWidgets: FC<Props> = (props) => {
+export function IssueDetailWidgets(props: Props) {
   const {
     workspaceSlug,
     projectId,
@@ -61,4 +61,4 @@ export const IssueDetailWidgets: FC<Props> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/content.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/content.tsx
index ad76e6fe2..c715fb002 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/content.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/content.tsx
@@ -23,7 +23,7 @@ type Props = {
 
 type TIssueCrudState = { toggle: boolean; parentIssueId: string | undefined; issue: TIssue | undefined };
 
-export const SubIssuesCollapsibleContent: FC<Props> = observer((props) => {
+export const SubIssuesCollapsibleContent = observer(function SubIssuesCollapsibleContent(props: Props) {
   const { workspaceSlug, projectId, parentIssueId, disabled, issueServiceType = EIssueServiceType.ISSUES } = props;
   // state
   const [issueCrudState, setIssueCrudState] = useState<{
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/display-filters.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/display-filters.tsx
index a1c15187f..63c1ba415 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/display-filters.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/display-filters.tsx
@@ -23,7 +23,7 @@ type TSubIssueDisplayFiltersProps = {
   isEpic?: boolean;
 };
 
-export const SubIssueDisplayFilters: FC<TSubIssueDisplayFiltersProps> = observer((props) => {
+export const SubIssueDisplayFilters = observer(function SubIssueDisplayFilters(props: TSubIssueDisplayFiltersProps) {
   const {
     isEpic = false,
     displayProperties,
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/filters.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/filters.tsx
index de1a6658c..a3690ba69 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/filters.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/filters.tsx
@@ -26,7 +26,7 @@ type TSubIssueFiltersProps = {
   availableFilters: (keyof IIssueFilterOptions)[];
 };
 
-export const SubIssueFilters: FC<TSubIssueFiltersProps> = observer((props) => {
+export const SubIssueFilters = observer(function SubIssueFilters(props: TSubIssueFiltersProps) {
   const { handleFiltersUpdate, filters, memberIds, states, availableFilters } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-group.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-group.tsx
index 4025b67c1..57cf2c63a 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-group.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-group.tsx
@@ -29,7 +29,7 @@ interface TSubIssuesListGroupProps {
   spacingLeft?: number;
 }
 
-export const SubIssuesListGroup: FC<TSubIssuesListGroupProps> = observer((props) => {
+export const SubIssuesListGroup = observer(function SubIssuesListGroup(props: TSubIssuesListGroupProps) {
   const {
     group,
     serviceType,
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-item.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-item.tsx
index 00bdbbd29..4c8090b61 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-item.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-item.tsx
@@ -42,7 +42,7 @@ type Props = {
   storeType?: EIssuesStoreType;
 };
 
-export const SubIssuesListItem: React.FC<Props> = observer((props) => {
+export const SubIssuesListItem = observer(function SubIssuesListItem(props: Props) {
   const {
     workspaceSlug,
     projectId,
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/properties.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/properties.tsx
index 35097a298..2ee9e2df7 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/properties.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/properties.tsx
@@ -33,7 +33,7 @@ type Props = {
   issue: TIssue;
 };
 
-export const SubIssuesListItemProperties: React.FC<Props> = observer((props) => {
+export const SubIssuesListItemProperties = observer(function SubIssuesListItemProperties(props: Props) {
   const { workspaceSlug, parentIssueId, issueId, canEdit, updateSubIssue, displayProperties, issue } = props;
   const { t } = useTranslation();
   const { getStateById } = useProjectState();
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/root.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/root.tsx
index aa1b152cb..899cfa592 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/root.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/root.tsx
@@ -29,7 +29,7 @@ type Props = {
   storeType: EIssuesStoreType;
 };
 
-export const SubIssuesListRoot: React.FC<Props> = observer((props) => {
+export const SubIssuesListRoot = observer(function SubIssuesListRoot(props: Props) {
   const {
     workspaceSlug,
     projectId,
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/quick-action-button.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/quick-action-button.tsx
index e8a64735d..faa281289 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/quick-action-button.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/quick-action-button.tsx
@@ -20,7 +20,7 @@ type Props = {
   issueServiceType: TIssueServiceType;
 };
 
-export const SubIssuesActionButton: FC<Props> = observer((props) => {
+export const SubIssuesActionButton = observer(function SubIssuesActionButton(props: Props) {
   const { issueId, customButton, disabled = false, issueServiceType } = props;
   // translation
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/root.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/root.tsx
index 8830750e5..023676e72 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/root.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/root.tsx
@@ -19,7 +19,7 @@ type Props = {
   issueServiceType: TIssueServiceType;
 };
 
-export const SubIssuesCollapsible: FC<Props> = observer((props) => {
+export const SubIssuesCollapsible = observer(function SubIssuesCollapsible(props: Props) {
   const { workspaceSlug, projectId, issueId, disabled = false, issueServiceType } = props;
   // store hooks
   const { openWidgets, toggleOpenWidget } = useIssueDetail(issueServiceType);
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/title-actions.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/title-actions.tsx
index b5d4e7ea0..de6c8ccd0 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/title-actions.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/title-actions.tsx
@@ -28,7 +28,7 @@ type TSubWorkItemTitleActionsProps = {
   projectId: string;
 };
 
-export const SubWorkItemTitleActions: FC<TSubWorkItemTitleActionsProps> = observer((props) => {
+export const SubWorkItemTitleActions = observer(function SubWorkItemTitleActions(props: TSubWorkItemTitleActionsProps) {
   const { disabled, issueServiceType = EIssueServiceType.ISSUES, parentId, projectId } = props;
 
   // store hooks
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/title.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/title.tsx
index c3e57dea8..c07b6b59a 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/title.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/title.tsx
@@ -20,7 +20,7 @@ type Props = {
   workspaceSlug: string;
 };
 
-export const SubIssuesCollapsibleTitle: FC<Props> = observer((props) => {
+export const SubIssuesCollapsibleTitle = observer(function SubIssuesCollapsibleTitle(props: Props) {
   const {
     isOpen,
     parentIssueId,
diff --git a/apps/web/core/components/issues/issue-detail-widgets/widget-button.tsx b/apps/web/core/components/issues/issue-detail-widgets/widget-button.tsx
index 725ab475f..8325a0f42 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/widget-button.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/widget-button.tsx
@@ -10,7 +10,7 @@ type Props = {
   disabled?: boolean;
 };
 
-export const IssueDetailWidgetButton: FC<Props> = (props) => {
+export function IssueDetailWidgetButton(props: Props) {
   const { icon, title, disabled = false } = props;
   return (
     <div
@@ -26,4 +26,4 @@ export const IssueDetailWidgetButton: FC<Props> = (props) => {
       <span className="text-sm font-medium">{title}</span>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail/cycle-select.tsx b/apps/web/core/components/issues/issue-detail/cycle-select.tsx
index 7c7f27da0..09440ace2 100644
--- a/apps/web/core/components/issues/issue-detail/cycle-select.tsx
+++ b/apps/web/core/components/issues/issue-detail/cycle-select.tsx
@@ -20,7 +20,7 @@ type TIssueCycleSelect = {
   disabled?: boolean;
 };
 
-export const IssueCycleSelect: React.FC<TIssueCycleSelect> = observer((props) => {
+export const IssueCycleSelect = observer(function IssueCycleSelect(props: TIssueCycleSelect) {
   const { className = "", workspaceSlug, projectId, issueId, issueOperations, disabled = false } = props;
   const { t } = useTranslation();
   // states
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity-comment-root.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity-comment-root.tsx
index 24b762788..5943127db 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity-comment-root.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity-comment-root.tsx
@@ -27,7 +27,7 @@ type TIssueActivityCommentRoot = {
   sortOrder: E_SORT_ORDER;
 };
 
-export const IssueActivityCommentRoot: FC<TIssueActivityCommentRoot> = observer((props) => {
+export const IssueActivityCommentRoot = observer(function IssueActivityCommentRoot(props: TIssueActivityCommentRoot) {
   const {
     workspaceSlug,
     isIntakeIssue,
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity-filter.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity-filter.tsx
index 6b7657eff..14f1a3478 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity-filter.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity-filter.tsx
@@ -15,7 +15,7 @@ type TActivityFilter = {
   filterOptions: TActivityFilterOption[];
 };
 
-export const ActivityFilter: FC<TActivityFilter> = observer((props) => {
+export const ActivityFilter = observer(function ActivityFilter(props: TActivityFilter) {
   const { selectedFilters = [], filterOptions } = props;
 
   // hooks
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/archived-at.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/archived-at.tsx
index a722bcbe2..7e193dfb3 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/archived-at.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/archived-at.tsx
@@ -12,7 +12,7 @@ import { IssueActivityBlockComponent } from "./";
 
 type TIssueArchivedAtActivity = { activityId: string; ends: "top" | "bottom" | undefined };
 
-export const IssueArchivedAtActivity: FC<TIssueArchivedAtActivity> = observer((props) => {
+export const IssueArchivedAtActivity = observer(function IssueArchivedAtActivity(props: TIssueArchivedAtActivity) {
   const { activityId, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/assignee.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/assignee.tsx
index 5c4466f8a..bec2d0150 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/assignee.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/assignee.tsx
@@ -9,7 +9,7 @@ import { IssueActivityBlockComponent, IssueLink } from "./";
 
 type TIssueAssigneeActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueAssigneeActivity: FC<TIssueAssigneeActivity> = observer((props) => {
+export const IssueAssigneeActivity = observer(function IssueAssigneeActivity(props: TIssueAssigneeActivity) {
   const { activityId, ends, showIssue = true } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/attachment.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/attachment.tsx
index f1b363159..145b090ac 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/attachment.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/attachment.tsx
@@ -8,7 +8,7 @@ import { IssueActivityBlockComponent, IssueLink } from "./";
 
 type TIssueAttachmentActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueAttachmentActivity: FC<TIssueAttachmentActivity> = observer((props) => {
+export const IssueAttachmentActivity = observer(function IssueAttachmentActivity(props: TIssueAttachmentActivity) {
   const { activityId, showIssue = true, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/cycle.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/cycle.tsx
index 657611f14..d256225d5 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/cycle.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/cycle.tsx
@@ -11,7 +11,7 @@ import { IssueActivityBlockComponent } from "./";
 
 type TIssueCycleActivity = { activityId: string; ends: "top" | "bottom" | undefined };
 
-export const IssueCycleActivity: FC<TIssueCycleActivity> = observer((props) => {
+export const IssueCycleActivity = observer(function IssueCycleActivity(props: TIssueCycleActivity) {
   const { activityId, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/default.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/default.tsx
index bdc52e482..85f568cbc 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/default.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/default.tsx
@@ -13,7 +13,7 @@ import { IssueActivityBlockComponent } from "./";
 
 type TIssueDefaultActivity = { activityId: string; ends: "top" | "bottom" | undefined };
 
-export const IssueDefaultActivity: FC<TIssueDefaultActivity> = observer((props) => {
+export const IssueDefaultActivity = observer(function IssueDefaultActivity(props: TIssueDefaultActivity) {
   const { activityId, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/description.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/description.tsx
index 919c00132..888ad3e64 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/description.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/description.tsx
@@ -8,7 +8,7 @@ import { IssueActivityBlockComponent, IssueLink } from "./";
 
 type TIssueDescriptionActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueDescriptionActivity: FC<TIssueDescriptionActivity> = observer((props) => {
+export const IssueDescriptionActivity = observer(function IssueDescriptionActivity(props: TIssueDescriptionActivity) {
   const { activityId, showIssue = true, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/estimate.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/estimate.tsx
index ada9b5237..42660dcb8 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/estimate.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/estimate.tsx
@@ -8,7 +8,7 @@ import { IssueActivityBlockComponent, IssueLink } from "./";
 
 type TIssueEstimateActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueEstimateActivity: FC<TIssueEstimateActivity> = observer((props) => {
+export const IssueEstimateActivity = observer(function IssueEstimateActivity(props: TIssueEstimateActivity) {
   const { activityId, showIssue = true, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/activity-block.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/activity-block.tsx
index 1b780c577..82ab2a0df 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/activity-block.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/activity-block.tsx
@@ -20,7 +20,7 @@ type TIssueActivityBlockComponent = {
   customUserName?: string;
 };
 
-export const IssueActivityBlockComponent: FC<TIssueActivityBlockComponent> = (props) => {
+export function IssueActivityBlockComponent(props: TIssueActivityBlockComponent) {
   const { icon, activityId, ends, children, customUserName } = props;
   // hooks
   const {
@@ -58,4 +58,4 @@ export const IssueActivityBlockComponent: FC<TIssueActivityBlockComponent> = (pr
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/issue-link.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/issue-link.tsx
index 42bc60021..3be51f4be 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/issue-link.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/issue-link.tsx
@@ -12,7 +12,7 @@ type TIssueLink = {
   activityId: string;
 };
 
-export const IssueLink: FC<TIssueLink> = (props) => {
+export function IssueLink(props: TIssueLink) {
   const { activityId } = props;
   // hooks
   const {
@@ -49,4 +49,4 @@ export const IssueLink: FC<TIssueLink> = (props) => {
       </a>
     </Tooltip>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/issue-user.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/issue-user.tsx
index 022d5aa50..29dcf177d 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/issue-user.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/issue-user.tsx
@@ -8,7 +8,7 @@ type TIssueUser = {
   customUserName?: string;
 };
 
-export const IssueUser: FC<TIssueUser> = (props) => {
+export function IssueUser(props: TIssueUser) {
   const { activityId, customUserName } = props;
   // hooks
   const {
@@ -33,4 +33,4 @@ export const IssueUser: FC<TIssueUser> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/inbox.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/inbox.tsx
index 74785c276..68b448f82 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/inbox.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/inbox.tsx
@@ -9,7 +9,7 @@ import { IssueActivityBlockComponent } from "./";
 
 type TIssueInboxActivity = { activityId: string; ends: "top" | "bottom" | undefined };
 
-export const IssueInboxActivity: FC<TIssueInboxActivity> = observer((props) => {
+export const IssueInboxActivity = observer(function IssueInboxActivity(props: TIssueInboxActivity) {
   const { activityId, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label-activity-chip.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label-activity-chip.tsx
index 53eed215f..347363b92 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label-activity-chip.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label-activity-chip.tsx
@@ -3,7 +3,7 @@ import { Tooltip } from "@plane/propel/tooltip";
 
 type TIssueLabelPill = { name?: string; color?: string };
 
-export const LabelActivityChip: FC<TIssueLabelPill> = (props) => {
+export function LabelActivityChip(props: TIssueLabelPill) {
   const { name, color } = props;
   return (
     <Tooltip tooltipContent={name}>
@@ -19,4 +19,4 @@ export const LabelActivityChip: FC<TIssueLabelPill> = (props) => {
       </span>
     </Tooltip>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label.tsx
index 8b39428d3..bff5564a4 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label.tsx
@@ -9,7 +9,7 @@ import { IssueActivityBlockComponent, IssueLink, LabelActivityChip } from "./";
 
 type TIssueLabelActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueLabelActivity: FC<TIssueLabelActivity> = observer((props) => {
+export const IssueLabelActivity = observer(function IssueLabelActivity(props: TIssueLabelActivity) {
   const { activityId, showIssue = true, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/link.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/link.tsx
index 36a2ff98d..847a42efd 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/link.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/link.tsx
@@ -8,7 +8,7 @@ import { IssueActivityBlockComponent, IssueLink } from "./";
 
 type TIssueLinkActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueLinkActivity: FC<TIssueLinkActivity> = observer((props) => {
+export const IssueLinkActivity = observer(function IssueLinkActivity(props: TIssueLinkActivity) {
   const { activityId, showIssue = false, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/module.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/module.tsx
index 149b6516d..4d65a6c2d 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/module.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/module.tsx
@@ -11,7 +11,7 @@ import { IssueActivityBlockComponent } from "./";
 
 type TIssueModuleActivity = { activityId: string; ends: "top" | "bottom" | undefined };
 
-export const IssueModuleActivity: FC<TIssueModuleActivity> = observer((props) => {
+export const IssueModuleActivity = observer(function IssueModuleActivity(props: TIssueModuleActivity) {
   const { activityId, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/name.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/name.tsx
index ebccf2824..69f5a3d63 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/name.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/name.tsx
@@ -8,7 +8,7 @@ import { IssueActivityBlockComponent } from "./";
 
 type TIssueNameActivity = { activityId: string; ends: "top" | "bottom" | undefined };
 
-export const IssueNameActivity: FC<TIssueNameActivity> = observer((props) => {
+export const IssueNameActivity = observer(function IssueNameActivity(props: TIssueNameActivity) {
   const { activityId, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/parent.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/parent.tsx
index 935cffcae..e4bd8915b 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/parent.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/parent.tsx
@@ -8,7 +8,7 @@ import { IssueActivityBlockComponent, IssueLink } from "./";
 
 type TIssueParentActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueParentActivity: FC<TIssueParentActivity> = observer((props) => {
+export const IssueParentActivity = observer(function IssueParentActivity(props: TIssueParentActivity) {
   const { activityId, showIssue = true, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/priority.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/priority.tsx
index fc48091c4..577e9ddff 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/priority.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/priority.tsx
@@ -8,7 +8,7 @@ import { IssueActivityBlockComponent, IssueLink } from "./";
 
 type TIssuePriorityActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssuePriorityActivity: FC<TIssuePriorityActivity> = observer((props) => {
+export const IssuePriorityActivity = observer(function IssuePriorityActivity(props: TIssuePriorityActivity) {
   const { activityId, showIssue = true, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/relation.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/relation.tsx
index b9c429fbe..921d325ce 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/relation.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/relation.tsx
@@ -10,7 +10,7 @@ import { IssueActivityBlockComponent } from "./";
 
 type TIssueRelationActivity = { activityId: string; ends: "top" | "bottom" | undefined };
 
-export const IssueRelationActivity: FC<TIssueRelationActivity> = observer((props) => {
+export const IssueRelationActivity = observer(function IssueRelationActivity(props: TIssueRelationActivity) {
   const { activityId, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/start_date.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/start_date.tsx
index 2b1ed27ac..52428286f 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/start_date.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/start_date.tsx
@@ -10,7 +10,7 @@ import { IssueActivityBlockComponent, IssueLink } from "./";
 
 type TIssueStartDateActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueStartDateActivity: FC<TIssueStartDateActivity> = observer((props) => {
+export const IssueStartDateActivity = observer(function IssueStartDateActivity(props: TIssueStartDateActivity) {
   const { activityId, showIssue = true, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/state.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/state.tsx
index de1037e38..9839f4a9c 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/state.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/state.tsx
@@ -11,7 +11,7 @@ import { IssueActivityBlockComponent, IssueLink } from "./";
 
 type TIssueStateActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueStateActivity: FC<TIssueStateActivity> = observer((props) => {
+export const IssueStateActivity = observer(function IssueStateActivity(props: TIssueStateActivity) {
   const { activityId, showIssue = true, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/target_date.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/target_date.tsx
index 9d51f9fdd..e27d42d3b 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/target_date.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/target_date.tsx
@@ -10,7 +10,7 @@ import { IssueActivityBlockComponent, IssueLink } from "./";
 
 type TIssueTargetDateActivity = { activityId: string; showIssue?: boolean; ends: "top" | "bottom" | undefined };
 
-export const IssueTargetDateActivity: FC<TIssueTargetDateActivity> = observer((props) => {
+export const IssueTargetDateActivity = observer(function IssueTargetDateActivity(props: TIssueTargetDateActivity) {
   const { activityId, showIssue = true, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/activity-list.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/activity-list.tsx
index e41d6bdf9..0eddf2ce4 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/activity-list.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/activity-list.tsx
@@ -34,7 +34,7 @@ type TIssueActivityItem = {
   ends: "top" | "bottom" | undefined;
 };
 
-export const IssueActivityItem: FC<TIssueActivityItem> = observer((props) => {
+export const IssueActivityItem = observer(function IssueActivityItem(props: TIssueActivityItem) {
   const { activityId, ends } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/loader.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/loader.tsx
index 915b5b207..e0fa46f4b 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/loader.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/loader.tsx
@@ -1,31 +1,33 @@
 // plane imports
 import { Loader } from "@plane/ui";
 
-export const IssueActivityLoader = () => (
-  <Loader className="space-y-8">
-    <div className="flex items-start gap-3">
-      <Loader.Item className="shrink-0" height="28px" width="28px" />
-      <div className="space-y-2 w-full">
-        <Loader.Item height="8px" width="60%" />
-        <Loader.Item height="8px" width="40%" />
-        <Loader.Item height="10px" width="100%" />
+export function IssueActivityLoader() {
+  return (
+    <Loader className="space-y-8">
+      <div className="flex items-start gap-3">
+        <Loader.Item className="shrink-0" height="28px" width="28px" />
+        <div className="space-y-2 w-full">
+          <Loader.Item height="8px" width="60%" />
+          <Loader.Item height="8px" width="40%" />
+          <Loader.Item height="10px" width="100%" />
+        </div>
       </div>
-    </div>
-    <div className="flex items-start gap-3">
-      <Loader.Item className="shrink-0" height="28px" width="28px" />
-      <div className="space-y-2 w-full">
-        <Loader.Item height="8px" width="40%" />
-        <Loader.Item height="8px" width="60%" />
-        <Loader.Item height="10px" width="80%" />
+      <div className="flex items-start gap-3">
+        <Loader.Item className="shrink-0" height="28px" width="28px" />
+        <div className="space-y-2 w-full">
+          <Loader.Item height="8px" width="40%" />
+          <Loader.Item height="8px" width="60%" />
+          <Loader.Item height="10px" width="80%" />
+        </div>
       </div>
-    </div>
-    <div className="flex items-start gap-3">
-      <Loader.Item className="shrink-0" height="28px" width="28px" />
-      <div className="space-y-2 w-full">
-        <Loader.Item height="8px" width="60%" />
-        <Loader.Item height="8px" width="40%" />
-        <Loader.Item height="10px" width="100%" />
+      <div className="flex items-start gap-3">
+        <Loader.Item className="shrink-0" height="28px" width="28px" />
+        <div className="space-y-2 w-full">
+          <Loader.Item height="8px" width="60%" />
+          <Loader.Item height="8px" width="40%" />
+          <Loader.Item height="10px" width="100%" />
+        </div>
       </div>
-    </div>
-  </Loader>
-);
+    </Loader>
+  );
+}
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/root.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/root.tsx
index 5060136a8..e7cb7f276 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/root.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/root.tsx
@@ -40,7 +40,7 @@ export type TActivityOperations = {
   uploadCommentAsset: (blockId: string, file: File, commentId?: string) => Promise<TFileSignedURLResponse>;
 };
 
-export const IssueActivity: FC<TIssueActivity> = observer((props) => {
+export const IssueActivity = observer(function IssueActivity(props: TIssueActivity) {
   const { workspaceSlug, projectId, issueId, disabled = false, isIntakeIssue = false } = props;
   // i18n
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/sort-root.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/sort-root.tsx
index 8a06e2ef6..551c1f877 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/sort-root.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/sort-root.tsx
@@ -14,23 +14,25 @@ export type TActivitySortRoot = {
   className?: string;
   iconClassName?: string;
 };
-export const ActivitySortRoot: FC<TActivitySortRoot> = memo((props) => (
-  <div
-    className={cn(
-      getButtonStyling("neutral-primary", "sm"),
-      "px-2 text-custom-text-300 cursor-pointer",
-      props.className
-    )}
-    onClick={() => {
-      props.toggleSort();
-    }}
-  >
-    {props.sortOrder === "asc" ? (
-      <ArrowUpWideNarrow className={cn("size-4", props.iconClassName)} />
-    ) : (
-      <ArrowDownWideNarrow className={cn("size-4", props.iconClassName)} />
-    )}
-  </div>
-));
+export const ActivitySortRoot = memo(function ActivitySortRoot(props: TActivitySortRoot) {
+  return (
+    <div
+      className={cn(
+        getButtonStyling("neutral-primary", "sm"),
+        "px-2 text-custom-text-300 cursor-pointer",
+        props.className
+      )}
+      onClick={() => {
+        props.toggleSort();
+      }}
+    >
+      {props.sortOrder === "asc" ? (
+        <ArrowUpWideNarrow className={cn("size-4", props.iconClassName)} />
+      ) : (
+        <ArrowDownWideNarrow className={cn("size-4", props.iconClassName)} />
+      )}
+    </div>
+  );
+});
 
 ActivitySortRoot.displayName = "ActivitySortRoot";
diff --git a/apps/web/core/components/issues/issue-detail/issue-detail-quick-actions.tsx b/apps/web/core/components/issues/issue-detail/issue-detail-quick-actions.tsx
index 42a1ca327..6fdfd1a74 100644
--- a/apps/web/core/components/issues/issue-detail/issue-detail-quick-actions.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-detail-quick-actions.tsx
@@ -30,7 +30,7 @@ type Props = {
   issueId: string;
 };
 
-export const IssueDetailQuickActions: FC<Props> = observer((props) => {
+export const IssueDetailQuickActions = observer(function IssueDetailQuickActions(props: Props) {
   const { workspaceSlug, projectId, issueId } = props;
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/issues/issue-detail/label/create-label.tsx b/apps/web/core/components/issues/issue-detail/label/create-label.tsx
index ff7e6ac9f..485b628c0 100644
--- a/apps/web/core/components/issues/issue-detail/label/create-label.tsx
+++ b/apps/web/core/components/issues/issue-detail/label/create-label.tsx
@@ -29,7 +29,7 @@ const defaultValues: Partial<IIssueLabel> = {
   color: "#ff0000",
 };
 
-export const LabelCreate: FC<ILabelCreate> = (props) => {
+export function LabelCreate(props: ILabelCreate) {
   const { workspaceSlug, projectId, issueId, values, labelOperations, disabled = false } = props;
   // state
   const [isCreateToggle, setIsCreateToggle] = useState(false);
@@ -164,4 +164,4 @@ export const LabelCreate: FC<ILabelCreate> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail/label/label-list-item.tsx b/apps/web/core/components/issues/issue-detail/label/label-list-item.tsx
index f3cef9955..423e750cc 100644
--- a/apps/web/core/components/issues/issue-detail/label/label-list-item.tsx
+++ b/apps/web/core/components/issues/issue-detail/label/label-list-item.tsx
@@ -15,7 +15,7 @@ type TLabelListItem = {
   disabled: boolean;
 };
 
-export const LabelListItem: FC<TLabelListItem> = observer((props) => {
+export const LabelListItem = observer(function LabelListItem(props: TLabelListItem) {
   const { workspaceSlug, projectId, issueId, labelId, values, labelOperations, disabled } = props;
   // hooks
   const { getLabelById } = useLabel();
diff --git a/apps/web/core/components/issues/issue-detail/label/label-list.tsx b/apps/web/core/components/issues/issue-detail/label/label-list.tsx
index f2091ecd2..4dcf27160 100644
--- a/apps/web/core/components/issues/issue-detail/label/label-list.tsx
+++ b/apps/web/core/components/issues/issue-detail/label/label-list.tsx
@@ -14,7 +14,7 @@ type TLabelList = {
   disabled: boolean;
 };
 
-export const LabelList: FC<TLabelList> = observer((props) => {
+export const LabelList = observer(function LabelList(props: TLabelList) {
   const { workspaceSlug, projectId, issueId, values, labelOperations, disabled } = props;
   const issueLabels = values || undefined;
 
diff --git a/apps/web/core/components/issues/issue-detail/label/root.tsx b/apps/web/core/components/issues/issue-detail/label/root.tsx
index 5511eb0a6..d10794082 100644
--- a/apps/web/core/components/issues/issue-detail/label/root.tsx
+++ b/apps/web/core/components/issues/issue-detail/label/root.tsx
@@ -33,7 +33,7 @@ export type TLabelOperations = {
   createLabel: (workspaceSlug: string, projectId: string, data: Partial<IIssueLabel>) => Promise<any>;
 };
 
-export const IssueLabel: FC<TIssueLabel> = observer((props) => {
+export const IssueLabel = observer(function IssueLabel(props: TIssueLabel) {
   const {
     workspaceSlug,
     projectId,
diff --git a/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx b/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx
index e115e0dd3..52e7095cf 100644
--- a/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx
+++ b/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx
@@ -25,7 +25,7 @@ export interface IIssueLabelSelect {
   onAddLabel: (workspaceSlug: string, projectId: string, data: Partial<IIssueLabel>) => Promise<any>;
 }
 
-export const IssueLabelSelect: React.FC<IIssueLabelSelect> = observer((props) => {
+export const IssueLabelSelect = observer(function IssueLabelSelect(props: IIssueLabelSelect) {
   const { workspaceSlug, projectId, issueId, values, onSelect, onAddLabel } = props;
   const { t } = useTranslation();
   // store hooks
diff --git a/apps/web/core/components/issues/issue-detail/label/select/root.tsx b/apps/web/core/components/issues/issue-detail/label/select/root.tsx
index 3393e8cc5..dbfeb4fce 100644
--- a/apps/web/core/components/issues/issue-detail/label/select/root.tsx
+++ b/apps/web/core/components/issues/issue-detail/label/select/root.tsx
@@ -12,7 +12,7 @@ type TIssueLabelSelectRoot = {
   labelOperations: TLabelOperations;
 };
 
-export const IssueLabelSelectRoot: FC<TIssueLabelSelectRoot> = (props) => {
+export function IssueLabelSelectRoot(props: TIssueLabelSelectRoot) {
   const { workspaceSlug, projectId, issueId, values, labelOperations } = props;
 
   const handleLabel = async (_labelIds: string[]) => {
@@ -29,4 +29,4 @@ export const IssueLabelSelectRoot: FC<TIssueLabelSelectRoot> = (props) => {
       onAddLabel={labelOperations.createLabel}
     />
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail/links/create-update-link-modal.tsx b/apps/web/core/components/issues/issue-detail/links/create-update-link-modal.tsx
index d19b11458..75fd26081 100644
--- a/apps/web/core/components/issues/issue-detail/links/create-update-link-modal.tsx
+++ b/apps/web/core/components/issues/issue-detail/links/create-update-link-modal.tsx
@@ -33,7 +33,9 @@ const defaultValues: TIssueLinkCreateFormFieldOptions = {
   url: "",
 };
 
-export const IssueLinkCreateUpdateModal: FC<TIssueLinkCreateEditModal> = observer((props) => {
+export const IssueLinkCreateUpdateModal = observer(function IssueLinkCreateUpdateModal(
+  props: TIssueLinkCreateEditModal
+) {
   const { isModalOpen, handleOnClose, linkOperations, issueServiceType } = props;
   // i18n
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-detail/links/link-detail.tsx b/apps/web/core/components/issues/issue-detail/links/link-detail.tsx
index 0db28e8be..c02de7963 100644
--- a/apps/web/core/components/issues/issue-detail/links/link-detail.tsx
+++ b/apps/web/core/components/issues/issue-detail/links/link-detail.tsx
@@ -22,7 +22,7 @@ export type TIssueLinkDetail = {
   isNotAllowed: boolean;
 };
 
-export const IssueLinkDetail: FC<TIssueLinkDetail> = (props) => {
+export function IssueLinkDetail(props: TIssueLinkDetail) {
   // props
   const { linkId, linkOperations, isNotAllowed } = props;
   // hooks
@@ -123,4 +123,4 @@ export const IssueLinkDetail: FC<TIssueLinkDetail> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail/links/link-item.tsx b/apps/web/core/components/issues/issue-detail/links/link-item.tsx
index 182b7bca4..a9348283a 100644
--- a/apps/web/core/components/issues/issue-detail/links/link-item.tsx
+++ b/apps/web/core/components/issues/issue-detail/links/link-item.tsx
@@ -24,7 +24,7 @@ type TIssueLinkItem = {
   issueServiceType?: TIssueServiceType;
 };
 
-export const IssueLinkItem: FC<TIssueLinkItem> = observer((props) => {
+export const IssueLinkItem = observer(function IssueLinkItem(props: TIssueLinkItem) {
   // props
   const { linkId, linkOperations, isNotAllowed, issueServiceType = EIssueServiceType.ISSUES } = props;
   // hooks
diff --git a/apps/web/core/components/issues/issue-detail/links/link-list.tsx b/apps/web/core/components/issues/issue-detail/links/link-list.tsx
index 8a6230dc0..4fd57bdb9 100644
--- a/apps/web/core/components/issues/issue-detail/links/link-list.tsx
+++ b/apps/web/core/components/issues/issue-detail/links/link-list.tsx
@@ -17,7 +17,7 @@ type TLinkList = {
   issueServiceType: TIssueServiceType;
 };
 
-export const LinkList: FC<TLinkList> = observer((props) => {
+export const LinkList = observer(function LinkList(props: TLinkList) {
   // props
   const { issueId, linkOperations, disabled = false, issueServiceType } = props;
   // hooks
diff --git a/apps/web/core/components/issues/issue-detail/links/links.tsx b/apps/web/core/components/issues/issue-detail/links/links.tsx
index db85a9eb0..90d192e9e 100644
--- a/apps/web/core/components/issues/issue-detail/links/links.tsx
+++ b/apps/web/core/components/issues/issue-detail/links/links.tsx
@@ -14,7 +14,7 @@ export type TIssueLinkList = {
   disabled?: boolean;
 };
 
-export const IssueLinkList: FC<TIssueLinkList> = observer((props) => {
+export const IssueLinkList = observer(function IssueLinkList(props: TIssueLinkList) {
   // props
   const { issueId, linkOperations, disabled = false } = props;
   // hooks
diff --git a/apps/web/core/components/issues/issue-detail/links/root.tsx b/apps/web/core/components/issues/issue-detail/links/root.tsx
index 6223ecbae..f79d58972 100644
--- a/apps/web/core/components/issues/issue-detail/links/root.tsx
+++ b/apps/web/core/components/issues/issue-detail/links/root.tsx
@@ -26,7 +26,7 @@ export type TIssueLinkRoot = {
   disabled?: boolean;
 };
 
-export const IssueLinkRoot: FC<TIssueLinkRoot> = (props) => {
+export function IssueLinkRoot(props: TIssueLinkRoot) {
   // props
   const { workspaceSlug, projectId, issueId, disabled = false } = props;
   // hooks
@@ -139,4 +139,4 @@ export const IssueLinkRoot: FC<TIssueLinkRoot> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-detail/main-content.tsx b/apps/web/core/components/issues/issue-detail/main-content.tsx
index 97c8c6dc6..0dff287c5 100644
--- a/apps/web/core/components/issues/issue-detail/main-content.tsx
+++ b/apps/web/core/components/issues/issue-detail/main-content.tsx
@@ -44,7 +44,7 @@ type Props = {
   isArchived: boolean;
 };
 
-export const IssueMainContent: React.FC<Props> = observer((props) => {
+export const IssueMainContent = observer(function IssueMainContent(props: Props) {
   const { workspaceSlug, projectId, issueId, issueOperations, isEditable, isArchived } = props;
   // refs
   const editorRef = useRef<EditorRefApi>(null);
diff --git a/apps/web/core/components/issues/issue-detail/module-select.tsx b/apps/web/core/components/issues/issue-detail/module-select.tsx
index a877d97ee..af292fcc2 100644
--- a/apps/web/core/components/issues/issue-detail/module-select.tsx
+++ b/apps/web/core/components/issues/issue-detail/module-select.tsx
@@ -21,7 +21,7 @@ type TIssueModuleSelect = {
   disabled?: boolean;
 };
 
-export const IssueModuleSelect: React.FC<TIssueModuleSelect> = observer((props) => {
+export const IssueModuleSelect = observer(function IssueModuleSelect(props: TIssueModuleSelect) {
   const { className = "", workspaceSlug, projectId, issueId, issueOperations, disabled = false } = props;
   const { t } = useTranslation();
   // states
diff --git a/apps/web/core/components/issues/issue-detail/parent-select.tsx b/apps/web/core/components/issues/issue-detail/parent-select.tsx
index c248d5bfe..4cfa95884 100644
--- a/apps/web/core/components/issues/issue-detail/parent-select.tsx
+++ b/apps/web/core/components/issues/issue-detail/parent-select.tsx
@@ -34,7 +34,7 @@ type TIssueParentSelect = {
   workItemLink: string;
 };
 
-export const IssueParentSelect: React.FC<TIssueParentSelect> = observer((props) => {
+export const IssueParentSelect = observer(function IssueParentSelect(props: TIssueParentSelect) {
   const {
     className = "",
     disabled = false,
diff --git a/apps/web/core/components/issues/issue-detail/parent/root.tsx b/apps/web/core/components/issues/issue-detail/parent/root.tsx
index 24a84d06c..5a5e5936f 100644
--- a/apps/web/core/components/issues/issue-detail/parent/root.tsx
+++ b/apps/web/core/components/issues/issue-detail/parent/root.tsx
@@ -31,7 +31,7 @@ export type TIssueParentDetail = {
   issueOperations: TIssueOperations;
 };
 
-export const IssueParentDetail: FC<TIssueParentDetail> = observer((props) => {
+export const IssueParentDetail = observer(function IssueParentDetail(props: TIssueParentDetail) {
   const { workspaceSlug, projectId, issueId, issue, issueOperations } = props;
   // router
   const router = useRouter();
diff --git a/apps/web/core/components/issues/issue-detail/parent/sibling-item.tsx b/apps/web/core/components/issues/issue-detail/parent/sibling-item.tsx
index 8e8f20e3d..95648138d 100644
--- a/apps/web/core/components/issues/issue-detail/parent/sibling-item.tsx
+++ b/apps/web/core/components/issues/issue-detail/parent/sibling-item.tsx
@@ -17,7 +17,7 @@ type TIssueParentSiblingItem = {
   issueId: string;
 };
 
-export const IssueParentSiblingItem: FC<TIssueParentSiblingItem> = observer((props) => {
+export const IssueParentSiblingItem = observer(function IssueParentSiblingItem(props: TIssueParentSiblingItem) {
   const { workspaceSlug, issueId } = props;
   // hooks
   const { getProjectById } = useProject();
diff --git a/apps/web/core/components/issues/issue-detail/parent/siblings.tsx b/apps/web/core/components/issues/issue-detail/parent/siblings.tsx
index 0784a8b32..741d318d5 100644
--- a/apps/web/core/components/issues/issue-detail/parent/siblings.tsx
+++ b/apps/web/core/components/issues/issue-detail/parent/siblings.tsx
@@ -14,7 +14,7 @@ export type TIssueParentSiblings = {
   parentIssue: TIssue;
 };
 
-export const IssueParentSiblings: FC<TIssueParentSiblings> = observer((props) => {
+export const IssueParentSiblings = observer(function IssueParentSiblings(props: TIssueParentSiblings) {
   const { workspaceSlug, currentIssue, parentIssue } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/issue-detail/reactions/issue-comment.tsx b/apps/web/core/components/issues/issue-detail/reactions/issue-comment.tsx
index 7e7b6d870..f4c03dc67 100644
--- a/apps/web/core/components/issues/issue-detail/reactions/issue-comment.tsx
+++ b/apps/web/core/components/issues/issue-detail/reactions/issue-comment.tsx
@@ -24,7 +24,7 @@ export type TIssueCommentReaction = {
   disabled?: boolean;
 };
 
-export const IssueCommentReaction: FC<TIssueCommentReaction> = observer((props) => {
+export const IssueCommentReaction = observer(function IssueCommentReaction(props: TIssueCommentReaction) {
   const { workspaceSlug, projectId, commentId, currentUser, disabled = false } = props;
   // state
   const [isPickerOpen, setIsPickerOpen] = useState(false);
diff --git a/apps/web/core/components/issues/issue-detail/reactions/issue.tsx b/apps/web/core/components/issues/issue-detail/reactions/issue.tsx
index 804e816c2..6fc4b6190 100644
--- a/apps/web/core/components/issues/issue-detail/reactions/issue.tsx
+++ b/apps/web/core/components/issues/issue-detail/reactions/issue.tsx
@@ -25,7 +25,7 @@ export type TIssueReaction = {
   className?: string;
 };
 
-export const IssueReaction: FC<TIssueReaction> = observer((props) => {
+export const IssueReaction = observer(function IssueReaction(props: TIssueReaction) {
   const { workspaceSlug, projectId, issueId, currentUser, disabled = false, className = "" } = props;
   // state
   const [isPickerOpen, setIsPickerOpen] = useState(false);
diff --git a/apps/web/core/components/issues/issue-detail/relation-select.tsx b/apps/web/core/components/issues/issue-detail/relation-select.tsx
index db8e0822c..eee49e09f 100644
--- a/apps/web/core/components/issues/issue-detail/relation-select.tsx
+++ b/apps/web/core/components/issues/issue-detail/relation-select.tsx
@@ -31,7 +31,7 @@ type TIssueRelationSelect = {
   disabled?: boolean;
 };
 
-export const IssueRelationSelect: React.FC<TIssueRelationSelect> = observer((props) => {
+export const IssueRelationSelect = observer(function IssueRelationSelect(props: TIssueRelationSelect) {
   const { className = "", workspaceSlug, projectId, issueId, relationKey, disabled = false } = props;
   // hooks
   const { getProjectById } = useProject();
diff --git a/apps/web/core/components/issues/issue-detail/root.tsx b/apps/web/core/components/issues/issue-detail/root.tsx
index 7ed13f584..a73bbc77a 100644
--- a/apps/web/core/components/issues/issue-detail/root.tsx
+++ b/apps/web/core/components/issues/issue-detail/root.tsx
@@ -56,7 +56,7 @@ export type TIssueDetailRoot = {
   is_archived?: boolean;
 };
 
-export const IssueDetailRoot: FC<TIssueDetailRoot> = observer((props) => {
+export const IssueDetailRoot = observer(function IssueDetailRoot(props: TIssueDetailRoot) {
   const { t } = useTranslation();
   const { workspaceSlug, projectId, issueId, is_archived = false } = props;
   // router
diff --git a/apps/web/core/components/issues/issue-detail/sidebar.tsx b/apps/web/core/components/issues/issue-detail/sidebar.tsx
index 7347941f6..421d01919 100644
--- a/apps/web/core/components/issues/issue-detail/sidebar.tsx
+++ b/apps/web/core/components/issues/issue-detail/sidebar.tsx
@@ -52,7 +52,7 @@ type Props = {
   isEditable: boolean;
 };
 
-export const IssueDetailsSidebar: React.FC<Props> = observer((props) => {
+export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props: Props) {
   const { t } = useTranslation();
   const { workspaceSlug, projectId, issueId, issueOperations, isEditable } = props;
   // store hooks
diff --git a/apps/web/core/components/issues/issue-detail/subscription.tsx b/apps/web/core/components/issues/issue-detail/subscription.tsx
index d98e1b17a..d2dfb7a48 100644
--- a/apps/web/core/components/issues/issue-detail/subscription.tsx
+++ b/apps/web/core/components/issues/issue-detail/subscription.tsx
@@ -24,7 +24,7 @@ export type TIssueSubscription = {
   serviceType?: EIssueServiceType;
 };
 
-export const IssueSubscription: FC<TIssueSubscription> = observer((props) => {
+export const IssueSubscription = observer(function IssueSubscription(props: TIssueSubscription) {
   const { workspaceSlug, projectId, issueId, serviceType = EIssueServiceType.ISSUES } = props;
   const { t } = useTranslation();
   // hooks
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/base-calendar-root.tsx b/apps/web/core/components/issues/issue-layouts/calendar/base-calendar-root.tsx
index d9d31d31e..e10b14017 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/base-calendar-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/base-calendar-root.tsx
@@ -38,7 +38,7 @@ interface IBaseCalendarRoot {
   canEditPropertiesBasedOnProject?: (projectId: string) => boolean;
 }
 
-export const BaseCalendarRoot = observer((props: IBaseCalendarRoot) => {
+export const BaseCalendarRoot = observer(function BaseCalendarRoot(props: IBaseCalendarRoot) {
   const {
     QuickActions,
     addIssuesToView,
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/calendar.tsx b/apps/web/core/components/issues/issue-layouts/calendar/calendar.tsx
index 347d2252b..be7831d07 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/calendar.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/calendar.tsx
@@ -74,7 +74,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const CalendarChart: React.FC<Props> = observer((props) => {
+export const CalendarChart = observer(function CalendarChart(props: Props) {
   const {
     issuesFilterStore,
     issues,
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/day-tile.tsx b/apps/web/core/components/issues/issue-layouts/calendar/day-tile.tsx
index 52ccf37e4..c835dd200 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/day-tile.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/day-tile.tsx
@@ -55,7 +55,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const CalendarDayTile: React.FC<Props> = observer((props) => {
+export const CalendarDayTile = observer(function CalendarDayTile(props: Props) {
   const {
     issuesFilterStore,
     date,
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx
index 553e0d2d5..2dacf1960 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx
@@ -24,7 +24,7 @@ interface Props {
     | IProjectViewIssuesFilter
     | IProjectEpicsFilter;
 }
-export const CalendarMonthsDropdown: React.FC<Props> = observer((props: Props) => {
+export const CalendarMonthsDropdown = observer(function CalendarMonthsDropdown(props: Props) {
   const { issuesFilterStore } = props;
 
   const issueCalendarView = useCalendarView();
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx
index b0284dfff..d4d2f706a 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx
@@ -40,7 +40,7 @@ interface ICalendarHeader {
   ) => Promise<void>;
 }
 
-export const CalendarOptionsDropdown: React.FC<ICalendarHeader> = observer((props) => {
+export const CalendarOptionsDropdown = observer(function CalendarOptionsDropdown(props: ICalendarHeader) {
   const { issuesFilterStore, updateFilters } = props;
 
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/header.tsx b/apps/web/core/components/issues/issue-layouts/calendar/header.tsx
index 3bf90241c..c985211a9 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/header.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/header.tsx
@@ -30,7 +30,7 @@ interface ICalendarHeader {
   setSelectedDate: (date: Date) => void;
 }
 
-export const CalendarHeader: React.FC<ICalendarHeader> = observer((props) => {
+export const CalendarHeader = observer(function CalendarHeader(props: ICalendarHeader) {
   const { issuesFilterStore, updateFilters, setSelectedDate } = props;
 
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/issue-block-root.tsx b/apps/web/core/components/issues/issue-layouts/calendar/issue-block-root.tsx
index d2c1c927f..fbc5177ac 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/issue-block-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/issue-block-root.tsx
@@ -19,7 +19,7 @@ type Props = {
   canEditProperties: (projectId: string | undefined) => boolean;
 };
 
-export const CalendarIssueBlockRoot: React.FC<Props> = observer((props) => {
+export const CalendarIssueBlockRoot = observer(function CalendarIssueBlockRoot(props: Props) {
   const { issueId, quickActions, isDragDisabled, isEpic = false, canEditProperties } = props;
 
   const issueRef = useRef<HTMLAnchorElement | null>(null);
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/issue-blocks.tsx b/apps/web/core/components/issues/issue-layouts/calendar/issue-blocks.tsx
index b4af6296a..211c8189b 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/issue-blocks.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/issue-blocks.tsx
@@ -28,7 +28,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const CalendarIssueBlocks: React.FC<Props> = observer((props) => {
+export const CalendarIssueBlocks = observer(function CalendarIssueBlocks(props: Props) {
   const {
     date,
     issueIdList,
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/quick-add-issue-actions.tsx b/apps/web/core/components/issues/issue-layouts/calendar/quick-add-issue-actions.tsx
index 3b8d7660a..1427bdef0 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/quick-add-issue-actions.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/quick-add-issue-actions.tsx
@@ -27,7 +27,9 @@ type TCalendarQuickAddIssueActions = {
   isEpic?: boolean;
 };
 
-export const CalendarQuickAddIssueActions: FC<TCalendarQuickAddIssueActions> = observer((props) => {
+export const CalendarQuickAddIssueActions = observer(function CalendarQuickAddIssueActions(
+  props: TCalendarQuickAddIssueActions
+) {
   const { prePopulatedData, quickAddCallback, addIssuesToView, onOpen, isEpic = false } = props;
   const { t } = useTranslation();
   // router
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/roots/cycle-root.tsx b/apps/web/core/components/issues/issue-layouts/calendar/roots/cycle-root.tsx
index 0a2696b20..fc7566d7e 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/roots/cycle-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/roots/cycle-root.tsx
@@ -9,7 +9,7 @@ import { useIssues } from "@/hooks/store/use-issues";
 import { CycleIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseCalendarRoot } from "../base-calendar-root";
 
-export const CycleCalendarLayout: React.FC = observer(() => {
+export const CycleCalendarLayout = observer(function CycleCalendarLayout() {
   const { currentProjectCompletedCycleIds } = useCycle();
   const { workspaceSlug, projectId, cycleId } = useParams();
 
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/roots/module-root.tsx b/apps/web/core/components/issues/issue-layouts/calendar/roots/module-root.tsx
index 075d395a3..2ff698298 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/roots/module-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/roots/module-root.tsx
@@ -9,7 +9,7 @@ import { useIssues } from "@/hooks/store/use-issues";
 import { ModuleIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseCalendarRoot } from "../base-calendar-root";
 
-export const ModuleCalendarLayout: React.FC = observer(() => {
+export const ModuleCalendarLayout = observer(function ModuleCalendarLayout() {
   const { workspaceSlug, projectId, moduleId } = useParams();
 
   const { issues } = useIssues(EIssuesStoreType.MODULE);
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/roots/project-root.tsx b/apps/web/core/components/issues/issue-layouts/calendar/roots/project-root.tsx
index 6cf681fc7..0214473a1 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/roots/project-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/roots/project-root.tsx
@@ -8,7 +8,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { ProjectIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseCalendarRoot } from "../base-calendar-root";
 
-export const CalendarLayout: React.FC = observer(() => {
+export const CalendarLayout = observer(function CalendarLayout() {
   // router
   const { workspaceSlug } = useParams();
   // hooks
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/roots/project-view-root.tsx b/apps/web/core/components/issues/issue-layouts/calendar/roots/project-view-root.tsx
index 72ab231fb..0cb8915b7 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/roots/project-view-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/roots/project-view-root.tsx
@@ -4,7 +4,7 @@ import { useParams } from "next/navigation";
 import { ProjectIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseCalendarRoot } from "../base-calendar-root";
 
-export const ProjectViewCalendarLayout: React.FC = observer(() => {
+export const ProjectViewCalendarLayout = observer(function ProjectViewCalendarLayout() {
   const { viewId } = useParams();
 
   return <BaseCalendarRoot QuickActions={ProjectIssueQuickActions} viewId={viewId.toString()} />;
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/week-days.tsx b/apps/web/core/components/issues/issue-layouts/calendar/week-days.tsx
index f234e0987..bd22f7fa1 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/week-days.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/week-days.tsx
@@ -44,7 +44,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const CalendarWeekDays: React.FC<Props> = observer((props) => {
+export const CalendarWeekDays = observer(function CalendarWeekDays(props: Props) {
   const {
     issuesFilterStore,
     issues,
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/week-header.tsx b/apps/web/core/components/issues/issue-layouts/calendar/week-header.tsx
index b289c9798..0840c2500 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/week-header.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/week-header.tsx
@@ -11,7 +11,7 @@ type Props = {
   showWeekends: boolean;
 };
 
-export const CalendarWeekHeader: React.FC<Props> = observer((props) => {
+export const CalendarWeekHeader = observer(function CalendarWeekHeader(props: Props) {
   const { isLoading, showWeekends } = props;
   // hooks
   const { data } = useUserProfile();
diff --git a/apps/web/core/components/issues/issue-layouts/empty-states/archived-issues.tsx b/apps/web/core/components/issues/issue-layouts/empty-states/archived-issues.tsx
index e8889a4a0..a2d576d4d 100644
--- a/apps/web/core/components/issues/issue-layouts/empty-states/archived-issues.tsx
+++ b/apps/web/core/components/issues/issue-layouts/empty-states/archived-issues.tsx
@@ -10,7 +10,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { useWorkItemFilterInstance } from "@/hooks/store/work-item-filters/use-work-item-filter-instance";
 import { useAppRouter } from "@/hooks/use-app-router";
 
-export const ProjectArchivedEmptyState: React.FC = observer(() => {
+export const ProjectArchivedEmptyState = observer(function ProjectArchivedEmptyState() {
   // router
   const router = useAppRouter();
   const { workspaceSlug: routerWorkspaceSlug, projectId: routerProjectId } = useParams();
diff --git a/apps/web/core/components/issues/issue-layouts/empty-states/cycle.tsx b/apps/web/core/components/issues/issue-layouts/empty-states/cycle.tsx
index 4c322ca41..3ca1651c6 100644
--- a/apps/web/core/components/issues/issue-layouts/empty-states/cycle.tsx
+++ b/apps/web/core/components/issues/issue-layouts/empty-states/cycle.tsx
@@ -20,7 +20,7 @@ import { useIssues } from "@/hooks/store/use-issues";
 import { useUserPermissions } from "@/hooks/store/user";
 import { useWorkItemFilterInstance } from "@/hooks/store/work-item-filters/use-work-item-filter-instance";
 
-export const CycleEmptyState: React.FC = observer(() => {
+export const CycleEmptyState = observer(function CycleEmptyState() {
   // router
   const { workspaceSlug: routerWorkspaceSlug, projectId: routerProjectId, cycleId: routerCycleId } = useParams();
   const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined;
diff --git a/apps/web/core/components/issues/issue-layouts/empty-states/global-view.tsx b/apps/web/core/components/issues/issue-layouts/empty-states/global-view.tsx
index 0114128ea..87ac70cca 100644
--- a/apps/web/core/components/issues/issue-layouts/empty-states/global-view.tsx
+++ b/apps/web/core/components/issues/issue-layouts/empty-states/global-view.tsx
@@ -10,7 +10,7 @@ import { useCommandPalette } from "@/hooks/store/use-command-palette";
 import { useProject } from "@/hooks/store/use-project";
 import { useUserPermissions } from "@/hooks/store/user";
 
-export const GlobalViewEmptyState: React.FC = observer(() => {
+export const GlobalViewEmptyState = observer(function GlobalViewEmptyState() {
   // plane imports
   const { t } = useTranslation();
   // store hooks
diff --git a/apps/web/core/components/issues/issue-layouts/empty-states/index.tsx b/apps/web/core/components/issues/issue-layouts/empty-states/index.tsx
index 0dd8d3c39..44573f94d 100644
--- a/apps/web/core/components/issues/issue-layouts/empty-states/index.tsx
+++ b/apps/web/core/components/issues/issue-layouts/empty-states/index.tsx
@@ -17,7 +17,7 @@ interface Props {
   storeType: EIssuesStoreType;
 }
 
-export const IssueLayoutEmptyState = (props: Props) => {
+export function IssueLayoutEmptyState(props: Props) {
   switch (props.storeType) {
     case EIssuesStoreType.PROJECT:
       return <ProjectEmptyState />;
@@ -44,4 +44,4 @@ export const IssueLayoutEmptyState = (props: Props) => {
     default:
       return null;
   }
-};
+}
diff --git a/apps/web/core/components/issues/issue-layouts/empty-states/module.tsx b/apps/web/core/components/issues/issue-layouts/empty-states/module.tsx
index 2a9d872db..6ad9b55e6 100644
--- a/apps/web/core/components/issues/issue-layouts/empty-states/module.tsx
+++ b/apps/web/core/components/issues/issue-layouts/empty-states/module.tsx
@@ -19,7 +19,7 @@ import { useIssues } from "@/hooks/store/use-issues";
 import { useUserPermissions } from "@/hooks/store/user";
 import { useWorkItemFilterInstance } from "@/hooks/store/work-item-filters/use-work-item-filter-instance";
 
-export const ModuleEmptyState: React.FC = observer(() => {
+export const ModuleEmptyState = observer(function ModuleEmptyState() {
   // router
   const { workspaceSlug: routerWorkspaceSlug, projectId: routerProjectId, moduleId: routerModuleId } = useParams();
   const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined;
diff --git a/apps/web/core/components/issues/issue-layouts/empty-states/profile-view.tsx b/apps/web/core/components/issues/issue-layouts/empty-states/profile-view.tsx
index b714855de..26c90e698 100644
--- a/apps/web/core/components/issues/issue-layouts/empty-states/profile-view.tsx
+++ b/apps/web/core/components/issues/issue-layouts/empty-states/profile-view.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from "@plane/i18n";
 import { EmptyStateDetailed } from "@plane/propel/empty-state";
 
 // TODO: If projectViewId changes, everything breaks. Figure out a better way to handle this.
-export const ProfileViewEmptyState: React.FC = observer(() => {
+export const ProfileViewEmptyState = observer(function ProfileViewEmptyState() {
   // plane hooks
   const { t } = useTranslation();
   // store hooks
diff --git a/apps/web/core/components/issues/issue-layouts/empty-states/project-epic.tsx b/apps/web/core/components/issues/issue-layouts/empty-states/project-epic.tsx
index e8bf3a9d5..d2249c683 100644
--- a/apps/web/core/components/issues/issue-layouts/empty-states/project-epic.tsx
+++ b/apps/web/core/components/issues/issue-layouts/empty-states/project-epic.tsx
@@ -1 +1,3 @@
-export const ProjectEpicsEmptyState: React.FC = () => <></>;
+export function ProjectEpicsEmptyState() {
+  return <></>;
+}
diff --git a/apps/web/core/components/issues/issue-layouts/empty-states/project-issues.tsx b/apps/web/core/components/issues/issue-layouts/empty-states/project-issues.tsx
index 56602cd9c..57f35b019 100644
--- a/apps/web/core/components/issues/issue-layouts/empty-states/project-issues.tsx
+++ b/apps/web/core/components/issues/issue-layouts/empty-states/project-issues.tsx
@@ -12,7 +12,7 @@ import { useCommandPalette } from "@/hooks/store/use-command-palette";
 import { useUserPermissions } from "@/hooks/store/user";
 import { useWorkItemFilterInstance } from "@/hooks/store/work-item-filters/use-work-item-filter-instance";
 
-export const ProjectEmptyState: React.FC = observer(() => {
+export const ProjectEmptyState = observer(function ProjectEmptyState() {
   // router
   const { projectId: routerProjectId } = useParams();
   const projectId = routerProjectId ? routerProjectId.toString() : undefined;
diff --git a/apps/web/core/components/issues/issue-layouts/empty-states/project-view.tsx b/apps/web/core/components/issues/issue-layouts/empty-states/project-view.tsx
index e89b31f9e..4ea0dcd4b 100644
--- a/apps/web/core/components/issues/issue-layouts/empty-states/project-view.tsx
+++ b/apps/web/core/components/issues/issue-layouts/empty-states/project-view.tsx
@@ -9,7 +9,7 @@ import { captureClick } from "@/helpers/event-tracker.helper";
 import { useCommandPalette } from "@/hooks/store/use-command-palette";
 import { useUserPermissions } from "@/hooks/store/user";
 
-export const ProjectViewEmptyState: React.FC = observer(() => {
+export const ProjectViewEmptyState = observer(function ProjectViewEmptyState() {
   // store hooks
   const { toggleCreateIssueModal } = useCommandPalette();
   const { allowPermissions } = useUserPermissions();
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/cycle.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/cycle.tsx
index 5d7495f95..ab246d15d 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/cycle.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/cycle.tsx
@@ -14,7 +14,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedCycleFilters: React.FC<Props> = observer((props) => {
+export const AppliedCycleFilters = observer(function AppliedCycleFilters(props: Props) {
   const { handleRemove, values, editable } = props;
   // store hooks
   const { getCycleById } = useCycle();
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/date.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/date.tsx
index 6a1604265..f6d8cef12 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/date.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/date.tsx
@@ -11,7 +11,7 @@ type Props = {
   values: string[];
 };
 
-export const AppliedDateFilters: React.FC<Props> = observer((props) => {
+export const AppliedDateFilters = observer(function AppliedDateFilters(props: Props) {
   const { handleRemove, values } = props;
 
   const getDateLabel = (value: string): string => {
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/label.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/label.tsx
index 3a9f0b03a..2cd0d3778 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/label.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/label.tsx
@@ -12,7 +12,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedLabelsFilters: React.FC<Props> = observer((props) => {
+export const AppliedLabelsFilters = observer(function AppliedLabelsFilters(props: Props) {
   const { handleRemove, labels, values, editable } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/members.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/members.tsx
index 63de17670..b0fa8a472 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/members.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/members.tsx
@@ -15,7 +15,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
+export const AppliedMembersFilters = observer(function AppliedMembersFilters(props: Props) {
   const { handleRemove, values, editable } = props;
 
   const {
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/module.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/module.tsx
index c3518d584..09aab7de2 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/module.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/module.tsx
@@ -12,7 +12,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedModuleFilters: React.FC<Props> = observer((props) => {
+export const AppliedModuleFilters = observer(function AppliedModuleFilters(props: Props) {
   const { handleRemove, values, editable } = props;
   // store hooks
   const { getModuleById } = useModule();
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/priority.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/priority.tsx
index 3da99980f..4f2137bd6 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/priority.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/priority.tsx
@@ -13,7 +13,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedPriorityFilters: React.FC<Props> = observer((props) => {
+export const AppliedPriorityFilters = observer(function AppliedPriorityFilters(props: Props) {
   const { handleRemove, values, editable } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/project.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/project.tsx
index fc9616309..bfd0f1b97 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/project.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/project.tsx
@@ -10,7 +10,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedProjectFilters: React.FC<Props> = observer((props) => {
+export const AppliedProjectFilters = observer(function AppliedProjectFilters(props: Props) {
   const { handleRemove, values, editable } = props;
   // store hooks
   const { projectMap } = useProject();
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state-group.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
index 8d8b64563..fb83e7847 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
@@ -12,7 +12,7 @@ type Props = {
   values: string[];
 };
 
-export const AppliedStateGroupFilters: React.FC<Props> = observer((props) => {
+export const AppliedStateGroupFilters = observer(function AppliedStateGroupFilters(props: Props) {
   const { handleRemove, values } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state.tsx
index 851bb953d..0667df59e 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state.tsx
@@ -14,7 +14,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedStateFilters: React.FC<Props> = observer((props) => {
+export const AppliedStateFilters = observer(function AppliedStateFilters(props: Props) {
   const { handleRemove, states, values, editable } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-filters-selection.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-filters-selection.tsx
index 7625914db..99d44aeef 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-filters-selection.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-filters-selection.tsx
@@ -28,7 +28,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const DisplayFiltersSelection: React.FC<Props> = observer((props) => {
+export const DisplayFiltersSelection = observer(function DisplayFiltersSelection(props: Props) {
   const {
     displayFilters,
     displayProperties,
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx
index c6a75c3df..a933d4831 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx
@@ -21,7 +21,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const FilterDisplayProperties: React.FC<Props> = observer((props) => {
+export const FilterDisplayProperties = observer(function FilterDisplayProperties(props: Props) {
   const {
     displayProperties,
     displayPropertiesToRender,
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/extra-options.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/extra-options.tsx
index a495c732c..5ff566c86 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/extra-options.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/extra-options.tsx
@@ -29,7 +29,7 @@ type Props = {
   enabledExtraOptions: TIssueExtraOptions[];
 };
 
-export const FilterExtraOptions: React.FC<Props> = observer((props) => {
+export const FilterExtraOptions = observer(function FilterExtraOptions(props: Props) {
   const { selectedExtraOptions, handleUpdate, enabledExtraOptions } = props;
   // hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/group-by.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/group-by.tsx
index c5a0838d8..4e6077238 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/group-by.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/group-by.tsx
@@ -13,7 +13,7 @@ type Props = {
   ignoreGroupedFilters: Partial<TIssueGroupByOptions>[];
 };
 
-export const FilterGroupBy: React.FC<Props> = observer((props) => {
+export const FilterGroupBy = observer(function FilterGroupBy(props: Props) {
   const { displayFilters, groupByOptions, handleUpdate, ignoreGroupedFilters } = props;
   // hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/order-by.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/order-by.tsx
index 1d13a00de..98eab6633 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/order-by.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/order-by.tsx
@@ -13,7 +13,7 @@ type Props = {
   orderByOptions: TIssueOrderByOptions[];
 };
 
-export const FilterOrderBy: React.FC<Props> = observer((props) => {
+export const FilterOrderBy = observer(function FilterOrderBy(props: Props) {
   const { selectedOrderBy, handleUpdate, orderByOptions } = props;
   // hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/sub-group-by.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/sub-group-by.tsx
index 427e50cb2..0ce1eebf9 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/sub-group-by.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/display-filters/sub-group-by.tsx
@@ -14,7 +14,7 @@ type Props = {
   ignoreGroupedFilters: Partial<TIssueGroupByOptions>[];
 };
 
-export const FilterSubGroupBy: React.FC<Props> = observer((props) => {
+export const FilterSubGroupBy = observer(function FilterSubGroupBy(props: Props) {
   // hooks
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/assignee.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/assignee.tsx
index f26a9bd26..1d7cd8a2b 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/assignee.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/assignee.tsx
@@ -20,7 +20,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterAssignees: React.FC<Props> = observer((props: Props) => {
+export const FilterAssignees = observer(function FilterAssignees(props: Props) {
   const { appliedFilters, handleUpdate, memberIds, searchQuery } = props;
   // states
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/created-by.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/created-by.tsx
index 56847644c..08d658aff 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/created-by.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/created-by.tsx
@@ -20,7 +20,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterCreatedBy: React.FC<Props> = observer((props: Props) => {
+export const FilterCreatedBy = observer(function FilterCreatedBy(props: Props) {
   const { appliedFilters, handleUpdate, memberIds, searchQuery } = props;
   // states
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/cycle.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/cycle.tsx
index b20c7e166..3359d3787 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/cycle.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/cycle.tsx
@@ -19,7 +19,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterCycle: React.FC<Props> = observer((props) => {
+export const FilterCycle = observer(function FilterCycle(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
 
   // hooks
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/due-date.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/due-date.tsx
index a5e815ed4..732a10e1e 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/due-date.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/due-date.tsx
@@ -12,7 +12,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterDueDate: React.FC<Props> = observer((props) => {
+export const FilterDueDate = observer(function FilterDueDate(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
 
   const [previewEnabled, setPreviewEnabled] = useState(true);
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/labels.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/labels.tsx
index bd152097c..26b4d2dd3 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/labels.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/labels.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import React, { useMemo, useState } from "react";
 import { sortBy } from "lodash-es";
 import { observer } from "mobx-react";
@@ -7,12 +6,13 @@ import type { IIssueLabel } from "@plane/types";
 // components
 import { Loader } from "@plane/ui";
 import { FilterHeader, FilterOption } from "@/components/issues/issue-layouts/filters";
+
 // ui
 // types
 
-const LabelIcons = ({ color }: { color: string }) => (
-  <span className="h-2.5 w-2.5 rounded-full" style={{ backgroundColor: color }} />
-);
+function LabelIcons({ color }: { color: string }) {
+  return <span className="h-2.5 w-2.5 rounded-full" style={{ backgroundColor: color }} />;
+}
 
 type Props = {
   appliedFilters: string[] | null;
@@ -21,7 +21,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterLabels: React.FC<Props> = observer((props) => {
+export const FilterLabels = observer(function FilterLabels(props: Props) {
   const { appliedFilters, handleUpdate, labels, searchQuery } = props;
 
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/mentions.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/mentions.tsx
index 8220a43d1..d072f6cd1 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/mentions.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/mentions.tsx
@@ -20,7 +20,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterMentions: React.FC<Props> = observer((props: Props) => {
+export const FilterMentions = observer(function FilterMentions(props: Props) {
   const { appliedFilters, handleUpdate, memberIds, searchQuery } = props;
   // states
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/module.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/module.tsx
index cc47a1e13..781b98e23 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/module.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/module.tsx
@@ -17,7 +17,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterModule: React.FC<Props> = observer((props) => {
+export const FilterModule = observer(function FilterModule(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
   // hooks
   const { projectId } = useParams();
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/priority.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/priority.tsx
index 36bb16991..3f11ba2fa 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/priority.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/priority.tsx
@@ -16,7 +16,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterPriority: React.FC<Props> = observer((props) => {
+export const FilterPriority = observer(function FilterPriority(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
   // hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/project.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/project.tsx
index f95a7d996..64277c912 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/project.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/project.tsx
@@ -17,7 +17,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterProjects: React.FC<Props> = observer((props) => {
+export const FilterProjects = observer(function FilterProjects(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
   // states
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/start-date.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/start-date.tsx
index d747ef8e1..f9097db4c 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/start-date.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/start-date.tsx
@@ -12,7 +12,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterStartDate: React.FC<Props> = observer((props) => {
+export const FilterStartDate = observer(function FilterStartDate(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
   const [previewEnabled, setPreviewEnabled] = useState(true);
   const [isDateFilterModalOpen, setIsDateFilterModalOpen] = useState(false);
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/state-group.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/state-group.tsx
index 4896b0d72..26a32c11f 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/state-group.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/state-group.tsx
@@ -14,7 +14,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterStateGroup: React.FC<Props> = observer((props) => {
+export const FilterStateGroup = observer(function FilterStateGroup(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
 
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/state.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/state.tsx
index 5d1ac42d7..64a95090a 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/state.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/state.tsx
@@ -19,7 +19,7 @@ type Props = {
   states: IState[] | undefined;
 };
 
-export const FilterState: React.FC<Props> = observer((props) => {
+export const FilterState = observer(function FilterState(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery, states } = props;
 
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/helpers/dropdown.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/helpers/dropdown.tsx
index dafd652ad..29f76a793 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/helpers/dropdown.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/helpers/dropdown.tsx
@@ -21,7 +21,7 @@ type Props = {
   isFiltersApplied?: boolean;
 };
 
-export const FiltersDropdown: React.FC<Props> = (props) => {
+export function FiltersDropdown(props: Props) {
   const {
     children,
     miniIcon,
@@ -125,4 +125,4 @@ export const FiltersDropdown: React.FC<Props> = (props) => {
       }}
     </Popover>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-header.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-header.tsx
index 41d75cf7f..718a64c99 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-header.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-header.tsx
@@ -8,15 +8,17 @@ interface IFilterHeader {
   handleIsPreviewEnabled: () => void;
 }
 
-export const FilterHeader = ({ title, isPreviewEnabled, handleIsPreviewEnabled }: IFilterHeader) => (
-  <div className="sticky top-0 flex items-center justify-between gap-2 bg-custom-background-100">
-    <div className="flex-grow truncate text-xs font-medium text-custom-text-400">{title}</div>
-    <button
-      type="button"
-      className="grid h-5 w-5 flex-shrink-0 place-items-center rounded hover:bg-custom-background-80"
-      onClick={handleIsPreviewEnabled}
-    >
-      {isPreviewEnabled ? <ChevronUpIcon height={14} width={14} /> : <ChevronDownIcon height={14} width={14} />}
-    </button>
-  </div>
-);
+export function FilterHeader({ title, isPreviewEnabled, handleIsPreviewEnabled }: IFilterHeader) {
+  return (
+    <div className="sticky top-0 flex items-center justify-between gap-2 bg-custom-background-100">
+      <div className="flex-grow truncate text-xs font-medium text-custom-text-400">{title}</div>
+      <button
+        type="button"
+        className="grid h-5 w-5 flex-shrink-0 place-items-center rounded hover:bg-custom-background-80"
+        onClick={handleIsPreviewEnabled}
+      >
+        {isPreviewEnabled ? <ChevronUpIcon height={14} width={14} /> : <ChevronDownIcon height={14} width={14} />}
+      </button>
+    </div>
+  );
+}
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-option.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-option.tsx
index 26c7bfaf5..f05e80faa 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-option.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-option.tsx
@@ -11,7 +11,7 @@ type Props = {
   activePulse?: boolean;
 };
 
-export const FilterOption: React.FC<Props> = (props) => {
+export function FilterOption(props: Props) {
   const { icon, isChecked, multiple = true, onClick, title, activePulse = false } = props;
 
   return (
@@ -36,4 +36,4 @@ export const FilterOption: React.FC<Props> = (props) => {
       )}
     </button>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/layout-selection.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/layout-selection.tsx
index 36c024e14..9a097da75 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/layout-selection.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/layout-selection.tsx
@@ -18,7 +18,7 @@ type Props = {
   selectedLayout: EIssueLayoutTypes | undefined;
 };
 
-export const LayoutSelection: React.FC<Props> = (props) => {
+export function LayoutSelection(props: Props) {
   const { layouts, onChange, selectedLayout } = props;
   const { isMobile } = usePlatformOS();
   const { t } = useTranslation();
@@ -52,4 +52,4 @@ export const LayoutSelection: React.FC<Props> = (props) => {
       ))}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/mobile-layout-selection.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/mobile-layout-selection.tsx
index 5af61ca29..29b830460 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/mobile-layout-selection.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/mobile-layout-selection.tsx
@@ -6,7 +6,7 @@ import type { EIssueLayoutTypes } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
 import { IssueLayoutIcon } from "../../layout-icon";
 
-export const MobileLayoutSelection = ({
+export function MobileLayoutSelection({
   layouts,
   onChange,
   activeLayout,
@@ -15,7 +15,7 @@ export const MobileLayoutSelection = ({
   onChange: (layout: EIssueLayoutTypes) => void;
   activeLayout?: EIssueLayoutTypes;
   isMobile?: boolean;
-}) => {
+}) {
   const { t } = useTranslation();
   return (
     <CustomMenu
@@ -47,4 +47,4 @@ export const MobileLayoutSelection = ({
       ))}
     </CustomMenu>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-layouts/gantt/base-gantt-root.tsx b/apps/web/core/components/issues/issue-layouts/gantt/base-gantt-root.tsx
index 58dda7d00..5d45e4286 100644
--- a/apps/web/core/components/issues/issue-layouts/gantt/base-gantt-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/gantt/base-gantt-root.tsx
@@ -38,7 +38,7 @@ export type GanttStoreType =
   | EIssuesStoreType.PROJECT_VIEW
   | EIssuesStoreType.EPIC;
 
-export const BaseGanttRoot: React.FC<IBaseGanttRoot> = observer((props: IBaseGanttRoot) => {
+export const BaseGanttRoot = observer(function BaseGanttRoot(props: IBaseGanttRoot) {
   const { viewId, isCompletedCycle = false, isEpic = false } = props;
   const { t } = useTranslation();
   // router
diff --git a/apps/web/core/components/issues/issue-layouts/gantt/blocks.tsx b/apps/web/core/components/issues/issue-layouts/gantt/blocks.tsx
index 79524f9d1..605f36a46 100644
--- a/apps/web/core/components/issues/issue-layouts/gantt/blocks.tsx
+++ b/apps/web/core/components/issues/issue-layouts/gantt/blocks.tsx
@@ -30,7 +30,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const IssueGanttBlock: React.FC<Props> = observer((props) => {
+export const IssueGanttBlock = observer(function IssueGanttBlock(props: Props) {
   const { issueId, isEpic } = props;
   // router
   const { workspaceSlug: routerWorkspaceSlug } = useParams();
@@ -101,7 +101,7 @@ export const IssueGanttBlock: React.FC<Props> = observer((props) => {
 });
 
 // rendering issues on gantt sidebar
-export const IssueGanttSidebarBlock: React.FC<Props> = observer((props) => {
+export const IssueGanttSidebarBlock = observer(function IssueGanttSidebarBlock(props: Props) {
   const { issueId, isEpic = false } = props;
   // router
   const { workspaceSlug: routerWorkspaceSlug } = useParams();
diff --git a/apps/web/core/components/issues/issue-layouts/group-drag-overlay.tsx b/apps/web/core/components/issues/issue-layouts/group-drag-overlay.tsx
index 25540f2dd..aa7964f2d 100644
--- a/apps/web/core/components/issues/issue-layouts/group-drag-overlay.tsx
+++ b/apps/web/core/components/issues/issue-layouts/group-drag-overlay.tsx
@@ -20,7 +20,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const GroupDragOverlay = (props: Props) => {
+export function GroupDragOverlay(props: Props) {
   const {
     dragColumnOrientation,
     canOverlayBeVisible,
@@ -85,4 +85,4 @@ export const GroupDragOverlay = (props: Props) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-layouts/issue-layout-HOC.tsx b/apps/web/core/components/issues/issue-layouts/issue-layout-HOC.tsx
index 916a91388..a83860482 100644
--- a/apps/web/core/components/issues/issue-layouts/issue-layout-HOC.tsx
+++ b/apps/web/core/components/issues/issue-layouts/issue-layout-HOC.tsx
@@ -13,7 +13,7 @@ import { useIssueStoreType } from "@/hooks/use-issue-layout-store";
 // local imports
 import { IssueLayoutEmptyState } from "./empty-states";
 
-const ActiveLoader = (props: { layout: EIssueLayoutTypes }) => {
+function ActiveLoader(props: { layout: EIssueLayoutTypes }) {
   const { layout } = props;
   switch (layout) {
     case EIssueLayoutTypes.LIST:
@@ -29,14 +29,14 @@ const ActiveLoader = (props: { layout: EIssueLayoutTypes }) => {
     default:
       return null;
   }
-};
+}
 
 interface Props {
   children: string | React.ReactNode | React.ReactNode[];
   layout: EIssueLayoutTypes;
 }
 
-export const IssueLayoutHOC = observer((props: Props) => {
+export const IssueLayoutHOC = observer(function IssueLayoutHOC(props: Props) {
   const { layout } = props;
 
   const storeType = useIssueStoreType();
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/base-kanban-root.tsx b/apps/web/core/components/issues/issue-layouts/kanban/base-kanban-root.tsx
index 2d27abc82..fd77c6226 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/base-kanban-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/base-kanban-root.tsx
@@ -50,7 +50,7 @@ export interface IBaseKanBanLayout {
   isEpic?: boolean;
 }
 
-export const BaseKanBanRoot: React.FC<IBaseKanBanLayout> = observer((props: IBaseKanBanLayout) => {
+export const BaseKanBanRoot = observer(function BaseKanBanRoot(props: IBaseKanBanLayout) {
   const {
     QuickActions,
     addIssuesToView,
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/block.tsx b/apps/web/core/components/issues/issue-layouts/kanban/block.tsx
index 94b4a8d61..47890fb14 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/block.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/block.tsx
@@ -62,7 +62,7 @@ interface IssueDetailsBlockProps {
   isEpic?: boolean;
 }
 
-const KanbanIssueDetailsBlock: React.FC<IssueDetailsBlockProps> = observer((props) => {
+const KanbanIssueDetailsBlock = observer(function KanbanIssueDetailsBlock(props: IssueDetailsBlockProps) {
   const { cardRef, issue, updateIssue, quickActions, isReadOnly, displayProperties, isEpic = false } = props;
   // refs
   const menuActionRef = useRef<HTMLDivElement | null>(null);
@@ -148,7 +148,7 @@ const KanbanIssueDetailsBlock: React.FC<IssueDetailsBlockProps> = observer((prop
   );
 });
 
-export const KanbanIssueBlock: React.FC<IssueBlockProps> = observer((props) => {
+export const KanbanIssueBlock = observer(function KanbanIssueBlock(props: IssueBlockProps) {
   const {
     issueId,
     groupId,
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/blocks-list.tsx b/apps/web/core/components/issues/issue-layouts/kanban/blocks-list.tsx
index 401516d4c..e4357ce33 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/blocks-list.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/blocks-list.tsx
@@ -21,7 +21,7 @@ interface IssueBlocksListProps {
   isEpic?: boolean;
 }
 
-export const KanbanIssueBlocksList: React.FC<IssueBlocksListProps> = observer((props) => {
+export const KanbanIssueBlocksList = observer(function KanbanIssueBlocksList(props: IssueBlocksListProps) {
   const {
     sub_group_id,
     groupId,
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/default.tsx b/apps/web/core/components/issues/issue-layouts/kanban/default.tsx
index 7aa468c3d..b3c6651fc 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/default.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/default.tsx
@@ -65,7 +65,7 @@ export interface IKanBan {
   isEpic?: boolean;
 }
 
-export const KanBan: React.FC<IKanBan> = observer((props) => {
+export const KanBan = observer(function KanBan(props: IKanBan) {
   const {
     issuesMap,
     groupedIssueIds,
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx b/apps/web/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
index 666473d80..efe8cc8a2 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
@@ -37,7 +37,7 @@ interface IHeaderGroupByCard {
   isEpic?: boolean;
 }
 
-export const HeaderGroupByCard: FC<IHeaderGroupByCard> = observer((props) => {
+export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHeaderGroupByCard) {
   const {
     group_by,
     sub_group_by,
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx b/apps/web/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx
index 0e6f1378b..cc5df5a08 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx
@@ -19,7 +19,7 @@ interface IHeaderSubGroupByCard {
   handleCollapsedGroups: (toggle: "group_by" | "sub_group_by", value: string) => void;
 }
 
-export const HeaderSubGroupByCard: FC<IHeaderSubGroupByCard> = observer((props) => {
+export const HeaderSubGroupByCard = observer(function HeaderSubGroupByCard(props: IHeaderSubGroupByCard) {
   const { icon, title, count, column_id, collapsedGroups, sub_group_by, handleCollapsedGroups } = props;
   return (
     <div
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/kanban-group.tsx b/apps/web/core/components/issues/issue-layouts/kanban/kanban-group.tsx
index b94227c93..9b1ea5d2f 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/kanban-group.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/kanban-group.tsx
@@ -68,7 +68,7 @@ interface IKanbanGroup {
   isEpic?: boolean;
 }
 
-export const KanbanGroup = observer((props: IKanbanGroup) => {
+export const KanbanGroup = observer(function KanbanGroup(props: IKanbanGroup) {
   const {
     groupId,
     sub_group_id,
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/roots/cycle-root.tsx b/apps/web/core/components/issues/issue-layouts/kanban/roots/cycle-root.tsx
index 7ba5b2371..a766ebad1 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/roots/cycle-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/roots/cycle-root.tsx
@@ -12,7 +12,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { CycleIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseKanBanRoot } from "../base-kanban-root";
 
-export const CycleKanBanLayout: React.FC = observer(() => {
+export const CycleKanBanLayout = observer(function CycleKanBanLayout() {
   const { workspaceSlug, projectId, cycleId } = useParams();
 
   // store
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/roots/module-root.tsx b/apps/web/core/components/issues/issue-layouts/kanban/roots/module-root.tsx
index 8587a509f..26f3e4e31 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/roots/module-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/roots/module-root.tsx
@@ -9,7 +9,7 @@ import { useIssues } from "@/hooks/store/use-issues";
 import { ModuleIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseKanBanRoot } from "../base-kanban-root";
 
-export const ModuleKanBanLayout: React.FC = observer(() => {
+export const ModuleKanBanLayout = observer(function ModuleKanBanLayout() {
   const { workspaceSlug, projectId, moduleId } = useParams();
 
   // store
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/roots/profile-issues-root.tsx b/apps/web/core/components/issues/issue-layouts/kanban/roots/profile-issues-root.tsx
index be1e43361..db6eb6418 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/roots/profile-issues-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/roots/profile-issues-root.tsx
@@ -8,7 +8,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { ProjectIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseKanBanRoot } from "../base-kanban-root";
 
-export const ProfileIssuesKanBanLayout: React.FC = observer(() => {
+export const ProfileIssuesKanBanLayout = observer(function ProfileIssuesKanBanLayout() {
   // router
   const { workspaceSlug, profileViewId } = useParams();
   const { allowPermissions } = useUserPermissions();
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/roots/project-root.tsx b/apps/web/core/components/issues/issue-layouts/kanban/roots/project-root.tsx
index bcb3a596a..22250fd81 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/roots/project-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/roots/project-root.tsx
@@ -8,7 +8,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { ProjectIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseKanBanRoot } from "../base-kanban-root";
 
-export const KanBanLayout: React.FC = observer(() => {
+export const KanBanLayout = observer(function KanBanLayout() {
   // router
   const { workspaceSlug } = useParams();
   // hooks
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/roots/project-view-root.tsx b/apps/web/core/components/issues/issue-layouts/kanban/roots/project-view-root.tsx
index 051351444..ef4239fd8 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/roots/project-view-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/roots/project-view-root.tsx
@@ -8,7 +8,7 @@ import { ProjectIssueQuickActions } from "../../quick-action-dropdowns";
 // components
 import { BaseKanBanRoot } from "../base-kanban-root";
 
-export const ProjectViewKanBanLayout: React.FC = observer(() => {
+export const ProjectViewKanBanLayout = observer(function ProjectViewKanBanLayout() {
   const { viewId } = useParams();
 
   return <BaseKanBanRoot QuickActions={ProjectIssueQuickActions} viewId={viewId.toString()} />;
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/swimlanes.tsx b/apps/web/core/components/issues/issue-layouts/kanban/swimlanes.tsx
index 5892ea3dd..a55f212e8 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/swimlanes.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/swimlanes.tsx
@@ -53,42 +53,48 @@ const visibilitySubGroupByGroupCount = (subGroupIssueCount: number, showEmptyGro
   return subGroupHeaderVisibility;
 };
 
-const SubGroupSwimlaneHeader: React.FC<ISubGroupSwimlaneHeader> = observer(
-  ({ getGroupIssueCount, sub_group_by, group_by, list, collapsedGroups, handleCollapsedGroups, showEmptyGroup }) => {
-    const { getIsWorkflowWorkItemCreationDisabled } = useWorkFlowFDragNDrop(group_by, sub_group_by);
+const SubGroupSwimlaneHeader = observer(function SubGroupSwimlaneHeader({
+  getGroupIssueCount,
+  sub_group_by,
+  group_by,
+  list,
+  collapsedGroups,
+  handleCollapsedGroups,
+  showEmptyGroup,
+}: ISubGroupSwimlaneHeader) {
+  const { getIsWorkflowWorkItemCreationDisabled } = useWorkFlowFDragNDrop(group_by, sub_group_by);
 
-    return (
-      <div className="relative flex h-max min-h-full w-full items-center gap-4">
-        {list &&
-          list.length > 0 &&
-          list.map((_list: IGroupByColumn) => {
-            const groupCount = getGroupIssueCount(_list?.id, undefined, false) ?? 0;
+  return (
+    <div className="relative flex h-max min-h-full w-full items-center gap-4">
+      {list &&
+        list.length > 0 &&
+        list.map((_list: IGroupByColumn) => {
+          const groupCount = getGroupIssueCount(_list?.id, undefined, false) ?? 0;
 
-            const subGroupByVisibilityToggle = visibilitySubGroupByGroupCount(groupCount, showEmptyGroup);
+          const subGroupByVisibilityToggle = visibilitySubGroupByGroupCount(groupCount, showEmptyGroup);
 
-            if (subGroupByVisibilityToggle === false) return <></>;
+          if (subGroupByVisibilityToggle === false) return <></>;
 
-            return (
-              <div key={`${sub_group_by}_${_list.id}`} className="flex w-[350px] flex-shrink-0 flex-col">
-                <HeaderGroupByCard
-                  sub_group_by={sub_group_by}
-                  group_by={group_by}
-                  column_id={_list.id}
-                  icon={_list.icon}
-                  title={_list.name}
-                  count={groupCount}
-                  collapsedGroups={collapsedGroups}
-                  handleCollapsedGroups={handleCollapsedGroups}
-                  issuePayload={_list.payload}
-                  disableIssueCreation={getIsWorkflowWorkItemCreationDisabled(_list.id)}
-                />
-              </div>
-            );
-          })}
-      </div>
-    );
-  }
-);
+          return (
+            <div key={`${sub_group_by}_${_list.id}`} className="flex w-[350px] flex-shrink-0 flex-col">
+              <HeaderGroupByCard
+                sub_group_by={sub_group_by}
+                group_by={group_by}
+                column_id={_list.id}
+                icon={_list.icon}
+                title={_list.name}
+                count={groupCount}
+                collapsedGroups={collapsedGroups}
+                handleCollapsedGroups={handleCollapsedGroups}
+                issuePayload={_list.payload}
+                disableIssueCreation={getIsWorkflowWorkItemCreationDisabled(_list.id)}
+              />
+            </div>
+          );
+        })}
+    </div>
+  );
+});
 
 interface ISubGroupSwimlane extends ISubGroupSwimlaneHeader {
   issuesMap: IIssueMap;
@@ -115,7 +121,7 @@ interface ISubGroupSwimlane extends ISubGroupSwimlaneHeader {
   loadMoreIssues: (groupId?: string, subGroupId?: string) => void;
 }
 
-const SubGroupSwimlane: React.FC<ISubGroupSwimlane> = observer((props) => {
+const SubGroupSwimlane = observer(function SubGroupSwimlane(props: ISubGroupSwimlane) {
   const {
     issuesMap,
     groupedIssueIds,
@@ -245,7 +251,7 @@ export interface IKanBanSwimLanes {
   orderBy: TIssueOrderByOptions | undefined;
 }
 
-export const KanBanSwimLanes: React.FC<IKanBanSwimLanes> = observer((props) => {
+export const KanBanSwimLanes = observer(function KanBanSwimLanes(props: IKanBanSwimLanes) {
   const {
     issuesMap,
     groupedIssueIds,
diff --git a/apps/web/core/components/issues/issue-layouts/layout-icon.tsx b/apps/web/core/components/issues/issue-layouts/layout-icon.tsx
index c55669c68..6788a8aea 100644
--- a/apps/web/core/components/issues/issue-layouts/layout-icon.tsx
+++ b/apps/web/core/components/issues/issue-layouts/layout-icon.tsx
@@ -8,11 +8,11 @@ import {
 import type { ISvgIcons } from "@plane/propel/icons";
 import { EIssueLayoutTypes } from "@plane/types";
 
-export const IssueLayoutIcon = ({
+export function IssueLayoutIcon({
   layout,
   size,
   ...props
-}: { layout: EIssueLayoutTypes; size?: number } & Omit<ISvgIcons, "width" | "height">) => {
+}: { layout: EIssueLayoutTypes; size?: number } & Omit<ISvgIcons, "width" | "height">) {
   const iconProps = {
     ...props,
     ...(size && { width: size, height: size }),
@@ -32,4 +32,4 @@ export const IssueLayoutIcon = ({
     default:
       return null;
   }
-};
+}
diff --git a/apps/web/core/components/issues/issue-layouts/list/base-list-root.tsx b/apps/web/core/components/issues/issue-layouts/list/base-list-root.tsx
index 19d548186..60f85f3f0 100644
--- a/apps/web/core/components/issues/issue-layouts/list/base-list-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/base-list-root.tsx
@@ -41,7 +41,7 @@ interface IBaseListRoot {
   isCompletedCycle?: boolean;
   isEpic?: boolean;
 }
-export const BaseListRoot = observer((props: IBaseListRoot) => {
+export const BaseListRoot = observer(function BaseListRoot(props: IBaseListRoot) {
   const {
     QuickActions,
     viewId,
diff --git a/apps/web/core/components/issues/issue-layouts/list/block-root.tsx b/apps/web/core/components/issues/issue-layouts/list/block-root.tsx
index 62942731b..87686a344 100644
--- a/apps/web/core/components/issues/issue-layouts/list/block-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/block-root.tsx
@@ -44,7 +44,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const IssueBlockRoot: FC<Props> = observer((props) => {
+export const IssueBlockRoot = observer(function IssueBlockRoot(props: Props) {
   const {
     issueId,
     issuesMap,
diff --git a/apps/web/core/components/issues/issue-layouts/list/block.tsx b/apps/web/core/components/issues/issue-layouts/list/block.tsx
index 98ff75007..4f5b0d83d 100644
--- a/apps/web/core/components/issues/issue-layouts/list/block.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/block.tsx
@@ -51,7 +51,7 @@ interface IssueBlockProps {
   isEpic?: boolean;
 }
 
-export const IssueBlock = observer((props: IssueBlockProps) => {
+export const IssueBlock = observer(function IssueBlock(props: IssueBlockProps) {
   const {
     issuesMap,
     issueId,
diff --git a/apps/web/core/components/issues/issue-layouts/list/blocks-list.tsx b/apps/web/core/components/issues/issue-layouts/list/blocks-list.tsx
index 090e988ca..72be4c66b 100644
--- a/apps/web/core/components/issues/issue-layouts/list/blocks-list.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/blocks-list.tsx
@@ -22,7 +22,7 @@ interface Props {
   isEpic?: boolean;
 }
 
-export const IssueBlocksList: FC<Props> = (props) => {
+export function IssueBlocksList(props: Props) {
   const {
     issueIds,
     issuesMap,
@@ -64,4 +64,4 @@ export const IssueBlocksList: FC<Props> = (props) => {
         ))}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-layouts/list/default.tsx b/apps/web/core/components/issues/issue-layouts/list/default.tsx
index 4d1411212..330d7af91 100644
--- a/apps/web/core/components/issues/issue-layouts/list/default.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/default.tsx
@@ -52,7 +52,7 @@ export interface IList {
   isEpic?: boolean;
 }
 
-export const List: React.FC<IList> = observer((props) => {
+export const List = observer(function List(props: IList) {
   const {
     groupedIssueIds,
     issuesMap,
diff --git a/apps/web/core/components/issues/issue-layouts/list/headers/group-by-card.tsx b/apps/web/core/components/issues/issue-layouts/list/headers/group-by-card.tsx
index 9853c03b8..8602848dc 100644
--- a/apps/web/core/components/issues/issue-layouts/list/headers/group-by-card.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/headers/group-by-card.tsx
@@ -39,7 +39,7 @@ interface IHeaderGroupByCard {
   isEpic?: boolean;
 }
 
-export const HeaderGroupByCard = observer((props: IHeaderGroupByCard) => {
+export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHeaderGroupByCard) {
   const {
     groupID,
     groupBy,
diff --git a/apps/web/core/components/issues/issue-layouts/list/list-group.tsx b/apps/web/core/components/issues/issue-layouts/list/list-group.tsx
index 19acd3b92..821db6e7a 100644
--- a/apps/web/core/components/issues/issue-layouts/list/list-group.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/list-group.tsx
@@ -70,7 +70,7 @@ interface Props {
   isEpic?: boolean;
 }
 
-export const ListGroup = observer((props: Props) => {
+export const ListGroup = observer(function ListGroup(props: Props) {
   const {
     groupIssueIds = [],
     group,
diff --git a/apps/web/core/components/issues/issue-layouts/list/roots/archived-issue-root.tsx b/apps/web/core/components/issues/issue-layouts/list/roots/archived-issue-root.tsx
index 17f68d8b4..21f85da30 100644
--- a/apps/web/core/components/issues/issue-layouts/list/roots/archived-issue-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/roots/archived-issue-root.tsx
@@ -4,7 +4,7 @@ import { observer } from "mobx-react";
 import { ArchivedIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseListRoot } from "../base-list-root";
 
-export const ArchivedIssueListLayout: FC = observer(() => {
+export const ArchivedIssueListLayout = observer(function ArchivedIssueListLayout() {
   const canEditPropertiesBasedOnProject = () => false;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/list/roots/cycle-root.tsx b/apps/web/core/components/issues/issue-layouts/list/roots/cycle-root.tsx
index f0ef5299b..65f66b185 100644
--- a/apps/web/core/components/issues/issue-layouts/list/roots/cycle-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/roots/cycle-root.tsx
@@ -12,7 +12,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { CycleIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseListRoot } from "../base-list-root";
 
-export const CycleListLayout: React.FC = observer(() => {
+export const CycleListLayout = observer(function CycleListLayout() {
   const { workspaceSlug, projectId, cycleId } = useParams();
   // store
   const { issues } = useIssues(EIssuesStoreType.CYCLE);
diff --git a/apps/web/core/components/issues/issue-layouts/list/roots/module-root.tsx b/apps/web/core/components/issues/issue-layouts/list/roots/module-root.tsx
index fa7b514d0..bd1dd7b48 100644
--- a/apps/web/core/components/issues/issue-layouts/list/roots/module-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/roots/module-root.tsx
@@ -9,7 +9,7 @@ import { useIssues } from "@/hooks/store/use-issues";
 import { ModuleIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseListRoot } from "../base-list-root";
 
-export const ModuleListLayout: React.FC = observer(() => {
+export const ModuleListLayout = observer(function ModuleListLayout() {
   const { workspaceSlug, projectId, moduleId } = useParams();
 
   const { issues } = useIssues(EIssuesStoreType.MODULE);
diff --git a/apps/web/core/components/issues/issue-layouts/list/roots/profile-issues-root.tsx b/apps/web/core/components/issues/issue-layouts/list/roots/profile-issues-root.tsx
index afc212d3e..4affe0076 100644
--- a/apps/web/core/components/issues/issue-layouts/list/roots/profile-issues-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/roots/profile-issues-root.tsx
@@ -8,7 +8,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { ProjectIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseListRoot } from "../base-list-root";
 
-export const ProfileIssuesListLayout: FC = observer(() => {
+export const ProfileIssuesListLayout = observer(function ProfileIssuesListLayout() {
   // router
   const { workspaceSlug, profileViewId } = useParams();
   // store
diff --git a/apps/web/core/components/issues/issue-layouts/list/roots/project-root.tsx b/apps/web/core/components/issues/issue-layouts/list/roots/project-root.tsx
index 39d5c0e4e..8819433ae 100644
--- a/apps/web/core/components/issues/issue-layouts/list/roots/project-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/roots/project-root.tsx
@@ -9,7 +9,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { ProjectIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseListRoot } from "../base-list-root";
 
-export const ListLayout: FC = observer(() => {
+export const ListLayout = observer(function ListLayout() {
   // router
   const { workspaceSlug } = useParams();
   // hooks
diff --git a/apps/web/core/components/issues/issue-layouts/list/roots/project-view-root.tsx b/apps/web/core/components/issues/issue-layouts/list/roots/project-view-root.tsx
index 9f7a07331..0c1112364 100644
--- a/apps/web/core/components/issues/issue-layouts/list/roots/project-view-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/roots/project-view-root.tsx
@@ -8,7 +8,7 @@ import { ProjectIssueQuickActions } from "../../quick-action-dropdowns";
 // components
 import { BaseListRoot } from "../base-list-root";
 
-export const ProjectViewListLayout: React.FC = observer(() => {
+export const ProjectViewListLayout = observer(function ProjectViewListLayout() {
   const { viewId } = useParams();
 
   return <BaseListRoot QuickActions={ProjectIssueQuickActions} viewId={viewId.toString()} />;
diff --git a/apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx b/apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx
index a61d6ccf4..e637749e0 100644
--- a/apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx
+++ b/apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx
@@ -58,7 +58,7 @@ export interface IIssueProperties {
   isEpic?: boolean;
 }
 
-export const IssueProperties: React.FC<IIssueProperties> = observer((props) => {
+export const IssueProperties = observer(function IssueProperties(props: IIssueProperties) {
   const { issue, updateIssue, displayProperties, isReadOnly, className, isEpic = false } = props;
   // i18n
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/issue-layouts/properties/label-dropdown.tsx b/apps/web/core/components/issues/issue-layouts/properties/label-dropdown.tsx
index a71306d42..5b5769bcb 100644
--- a/apps/web/core/components/issues/issue-layouts/properties/label-dropdown.tsx
+++ b/apps/web/core/components/issues/issue-layouts/properties/label-dropdown.tsx
@@ -39,7 +39,7 @@ export interface ILabelDropdownProps {
   label: React.ReactNode;
 }
 
-export const LabelDropdown = (props: ILabelDropdownProps) => {
+export function LabelDropdown(props: ILabelDropdownProps) {
   const {
     projectId,
     value,
@@ -307,4 +307,4 @@ export const LabelDropdown = (props: ILabelDropdownProps) => {
       </ComboDropDown>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-layouts/properties/labels.tsx b/apps/web/core/components/issues/issue-layouts/properties/labels.tsx
index ecb856a0c..4fb577a1a 100644
--- a/apps/web/core/components/issues/issue-layouts/properties/labels.tsx
+++ b/apps/web/core/components/issues/issue-layouts/properties/labels.tsx
@@ -38,7 +38,7 @@ export interface IIssuePropertyLabels {
   fullHeight?: boolean;
 }
 
-export const IssuePropertyLabels: React.FC<IIssuePropertyLabels> = observer((props) => {
+export const IssuePropertyLabels = observer(function IssuePropertyLabels(props: IIssuePropertyLabels) {
   const {
     projectId,
     value,
@@ -85,8 +85,8 @@ export const IssuePropertyLabels: React.FC<IIssuePropertyLabels> = observer((pro
   let projectLabels: IIssueLabel[] = defaultOptions as IIssueLabel[];
   if (storeLabels && storeLabels.length > 0) projectLabels = storeLabels;
 
-  const NoLabel = useMemo(
-    () => (
+  const NoLabel = useMemo(function NoLabel() {
+    return (
       <Tooltip
         position="top"
         tooltipHeading={t("common.labels")}
@@ -105,12 +105,11 @@ export const IssuePropertyLabels: React.FC<IIssuePropertyLabels> = observer((pro
           {placeholderText}
         </div>
       </Tooltip>
-    ),
-    [placeholderText, fullWidth, noLabelBorder, isMobile]
-  );
+    );
+  });
 
-  const LabelSummary = useMemo(
-    () => (
+  const LabelSummary = useMemo(function LabelSummary() {
+    return (
       <div
         className={cn(
           "flex h-5 flex-shrink-0 items-center justify-center rounded px-2.5 text-xs",
@@ -135,12 +134,11 @@ export const IssuePropertyLabels: React.FC<IIssuePropertyLabels> = observer((pro
           </div>
         </Tooltip>
       </div>
-    ),
-    [fullWidth, disabled, noLabelBorder, isMobile, projectLabels, value]
-  );
+    );
+  });
 
-  const LabelItem = useCallback(
-    ({ label }: { label: IIssueLabel }) => (
+  const LabelItem = useCallback(function LabelItem({ label }: { label: IIssueLabel }) {
+    return (
       <Tooltip
         key={label.id}
         position="top"
@@ -169,9 +167,8 @@ export const IssuePropertyLabels: React.FC<IIssuePropertyLabels> = observer((pro
           </div>
         </div>
       </Tooltip>
-    ),
-    [disabled, fullWidth, isMobile, noLabelBorder, renderByDefault]
-  );
+    );
+  });
 
   return (
     <>
diff --git a/apps/web/core/components/issues/issue-layouts/properties/with-display-properties-HOC.tsx b/apps/web/core/components/issues/issue-layouts/properties/with-display-properties-HOC.tsx
index 24896f960..4745942e1 100644
--- a/apps/web/core/components/issues/issue-layouts/properties/with-display-properties-HOC.tsx
+++ b/apps/web/core/components/issues/issue-layouts/properties/with-display-properties-HOC.tsx
@@ -9,18 +9,21 @@ interface IWithDisplayPropertiesHOC {
   children: ReactNode;
 }
 
-export const WithDisplayPropertiesHOC = observer(
-  ({ displayProperties, shouldRenderProperty, displayPropertyKey, children }: IWithDisplayPropertiesHOC) => {
-    let shouldDisplayPropertyFromFilters = false;
-    if (Array.isArray(displayPropertyKey))
-      shouldDisplayPropertyFromFilters = displayPropertyKey.every((key) => !!displayProperties[key]);
-    else shouldDisplayPropertyFromFilters = !!displayProperties[displayPropertyKey];
+export const WithDisplayPropertiesHOC = observer(function WithDisplayPropertiesHOC({
+  displayProperties,
+  shouldRenderProperty,
+  displayPropertyKey,
+  children,
+}: IWithDisplayPropertiesHOC) {
+  let shouldDisplayPropertyFromFilters = false;
+  if (Array.isArray(displayPropertyKey))
+    shouldDisplayPropertyFromFilters = displayPropertyKey.every((key) => !!displayProperties[key]);
+  else shouldDisplayPropertyFromFilters = !!displayProperties[displayPropertyKey];
 
-    const renderProperty =
-      shouldDisplayPropertyFromFilters && (shouldRenderProperty ? shouldRenderProperty(displayProperties) : true);
+  const renderProperty =
+    shouldDisplayPropertyFromFilters && (shouldRenderProperty ? shouldRenderProperty(displayProperties) : true);
 
-    if (!renderProperty) return null;
+  if (!renderProperty) return null;
 
-    return <>{children}</>;
-  }
-);
+  return <>{children}</>;
+});
diff --git a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/all-issue.tsx b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/all-issue.tsx
index 5d8ab87be..2e894df37 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/all-issue.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/all-issue.tsx
@@ -25,7 +25,7 @@ import type { IQuickActionProps } from "../list/list-view-types";
 import type { MenuItemFactoryProps } from "./helper";
 import { useAllIssueMenuItems } from "./helper";
 
-export const AllIssueQuickActions: React.FC<IQuickActionProps> = observer((props) => {
+export const AllIssueQuickActions = observer(function AllIssueQuickActions(props: IQuickActionProps) {
   const {
     issue,
     handleDelete,
@@ -87,13 +87,16 @@ export const AllIssueQuickActions: React.FC<IQuickActionProps> = observer((props
 
   const MENU_ITEMS = useAllIssueMenuItems(menuItemProps);
 
-  const CONTEXT_MENU_ITEMS: TContextMenuItem[] = MENU_ITEMS.map((item) => ({
-    ...item,
-    onClick: () => {
-      captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.GLOBAL_VIEW });
-      item.action();
-    },
-  }));
+  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map(function CONTEXT_MENU_ITEMS(item) {
+    return {
+      ...item,
+
+      onClick: () => {
+        captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.GLOBAL_VIEW });
+        item.action();
+      },
+    };
+  });
 
   return (
     <>
diff --git a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/archived-issue.tsx b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/archived-issue.tsx
index 43102767b..8de0ff321 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/archived-issue.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/archived-issue.tsx
@@ -19,7 +19,7 @@ import type { IQuickActionProps } from "../list/list-view-types";
 import type { MenuItemFactoryProps } from "./helper";
 import { useArchivedIssueMenuItems } from "./helper";
 
-export const ArchivedIssueQuickActions: React.FC<IQuickActionProps> = observer((props) => {
+export const ArchivedIssueQuickActions = observer(function ArchivedIssueQuickActions(props: IQuickActionProps) {
   const {
     issue,
     handleDelete,
@@ -63,13 +63,16 @@ export const ArchivedIssueQuickActions: React.FC<IQuickActionProps> = observer((
 
   const MENU_ITEMS = useArchivedIssueMenuItems(menuItemProps);
 
-  const CONTEXT_MENU_ITEMS: TContextMenuItem[] = MENU_ITEMS.map((item) => ({
-    ...item,
-    onClick: () => {
-      captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.ARCHIVED });
-      item.action();
-    },
-  }));
+  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map(function CONTEXT_MENU_ITEMS(item) {
+    return {
+      ...item,
+
+      onClick: () => {
+        captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.ARCHIVED });
+        item.action();
+      },
+    };
+  });
   return (
     <>
       {/* Modals */}
diff --git a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/cycle-issue.tsx b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/cycle-issue.tsx
index 17bd91556..827bf7d20 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/cycle-issue.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/cycle-issue.tsx
@@ -33,7 +33,7 @@ import type { IQuickActionProps } from "../list/list-view-types";
 import type { MenuItemFactoryProps } from "./helper";
 import { useCycleIssueMenuItems } from "./helper";
 
-export const CycleIssueQuickActions: React.FC<IQuickActionProps> = observer((props) => {
+export const CycleIssueQuickActions = observer(function CycleIssueQuickActions(props: IQuickActionProps) {
   const {
     issue,
     handleDelete,
@@ -104,13 +104,16 @@ export const CycleIssueQuickActions: React.FC<IQuickActionProps> = observer((pro
 
   const MENU_ITEMS = useCycleIssueMenuItems(menuItemProps);
 
-  const CONTEXT_MENU_ITEMS: TContextMenuItem[] = MENU_ITEMS.map((item) => ({
-    ...item,
-    onClick: () => {
-      captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.CYCLE });
-      item.action();
-    },
-  }));
+  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map(function CONTEXT_MENU_ITEMS(item) {
+    return {
+      ...item,
+
+      onClick: () => {
+        captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.CYCLE });
+        item.action();
+      },
+    };
+  });
 
   return (
     <>
diff --git a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/issue-detail.tsx b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/issue-detail.tsx
index b90ed2d10..edaa463e4 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/issue-detail.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/issue-detail.tsx
@@ -40,7 +40,9 @@ type TWorkItemDetailQuickActionProps = IQuickActionProps & {
   isPeekMode?: boolean;
 };
 
-export const WorkItemDetailQuickActions: React.FC<TWorkItemDetailQuickActionProps> = observer((props) => {
+export const WorkItemDetailQuickActions = observer(function WorkItemDetailQuickActions(
+  props: TWorkItemDetailQuickActionProps
+) {
   const {
     issue,
     handleDelete,
@@ -176,15 +178,20 @@ export const WorkItemDetailQuickActions: React.FC<TWorkItemDetailQuickActionProp
       }
       return item;
     })
-    .filter((item) => item.shouldRender !== false);
+    .filter(function MENU_ITEMS(item) {
+      return item.shouldRender !== false;
+    });
 
-  const CONTEXT_MENU_ITEMS: TContextMenuItem[] = MENU_ITEMS.map((item) => ({
-    ...item,
-    onClick: () => {
-      captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.PROJECT_VIEW });
-      item.action();
-    },
-  }));
+  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map(function CONTEXT_MENU_ITEMS(item) {
+    return {
+      ...item,
+
+      onClick: () => {
+        captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.PROJECT_VIEW });
+        item.action();
+      },
+    };
+  });
 
   return (
     <>
diff --git a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/module-issue.tsx b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/module-issue.tsx
index c0ce09751..6eb1f8cfe 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/module-issue.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/module-issue.tsx
@@ -32,7 +32,7 @@ import type { IQuickActionProps } from "../list/list-view-types";
 import type { MenuItemFactoryProps } from "./helper";
 import { useModuleIssueMenuItems } from "./helper";
 
-export const ModuleIssueQuickActions: React.FC<IQuickActionProps> = observer((props) => {
+export const ModuleIssueQuickActions = observer(function ModuleIssueQuickActions(props: IQuickActionProps) {
   const {
     issue,
     handleDelete,
@@ -104,13 +104,16 @@ export const ModuleIssueQuickActions: React.FC<IQuickActionProps> = observer((pr
 
   const MENU_ITEMS = useModuleIssueMenuItems(menuItemProps);
 
-  const CONTEXT_MENU_ITEMS: TContextMenuItem[] = MENU_ITEMS.map((item) => ({
-    ...item,
-    onClick: () => {
-      captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.MODULE });
-      item.action();
-    },
-  }));
+  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map(function CONTEXT_MENU_ITEMS(item) {
+    return {
+      ...item,
+
+      onClick: () => {
+        captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.MODULE });
+        item.action();
+      },
+    };
+  });
   return (
     <>
       {/* Modals */}
diff --git a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/project-issue.tsx b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/project-issue.tsx
index 978d77291..493468586 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/project-issue.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/project-issue.tsx
@@ -32,7 +32,7 @@ import type { IQuickActionProps } from "../list/list-view-types";
 import type { MenuItemFactoryProps } from "./helper";
 import { useProjectIssueMenuItems } from "./helper";
 
-export const ProjectIssueQuickActions: React.FC<IQuickActionProps> = observer((props) => {
+export const ProjectIssueQuickActions = observer(function ProjectIssueQuickActions(props: IQuickActionProps) {
   const {
     issue,
     handleDelete,
@@ -105,13 +105,16 @@ export const ProjectIssueQuickActions: React.FC<IQuickActionProps> = observer((p
 
   const MENU_ITEMS = useProjectIssueMenuItems(menuItemProps);
 
-  const CONTEXT_MENU_ITEMS: TContextMenuItem[] = MENU_ITEMS.map((item) => ({
-    ...item,
-    onClick: () => {
-      captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.PROJECT_VIEW });
-      item.action();
-    },
-  }));
+  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map(function CONTEXT_MENU_ITEMS(item) {
+    return {
+      ...item,
+
+      onClick: () => {
+        captureClick({ elementName: WORK_ITEM_TRACKER_ELEMENTS.QUICK_ACTIONS.PROJECT_VIEW });
+        item.action();
+      },
+    };
+  });
 
   return (
     <>
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/button/gantt.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/button/gantt.tsx
index bd57939c2..44d5498ee 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/button/gantt.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/button/gantt.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from "@plane/i18n";
 import { Row } from "@plane/ui";
 import type { TQuickAddIssueButton } from "../root";
 
-export const GanttQuickAddIssueButton: FC<TQuickAddIssueButton> = observer((props) => {
+export const GanttQuickAddIssueButton = observer(function GanttQuickAddIssueButton(props: TQuickAddIssueButton) {
   const { onClick, isEpic = false } = props;
   const { t } = useTranslation();
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/button/kanban.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/button/kanban.tsx
index 7565ea4b9..66092fd39 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/button/kanban.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/button/kanban.tsx
@@ -4,7 +4,7 @@ import { PlusIcon } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
 import type { TQuickAddIssueButton } from "../root";
 
-export const KanbanQuickAddIssueButton: FC<TQuickAddIssueButton> = observer((props) => {
+export const KanbanQuickAddIssueButton = observer(function KanbanQuickAddIssueButton(props: TQuickAddIssueButton) {
   const { onClick, isEpic = false } = props;
   const { t } = useTranslation();
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/button/list.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/button/list.tsx
index 3f77cd47c..24195b176 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/button/list.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/button/list.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from "@plane/i18n";
 import { Row } from "@plane/ui";
 import type { TQuickAddIssueButton } from "../root";
 
-export const ListQuickAddIssueButton: FC<TQuickAddIssueButton> = observer((props) => {
+export const ListQuickAddIssueButton = observer(function ListQuickAddIssueButton(props: TQuickAddIssueButton) {
   const { onClick, isEpic = false } = props;
   const { t } = useTranslation();
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/button/spreadsheet.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/button/spreadsheet.tsx
index accd23c7a..5e5ba93db 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/button/spreadsheet.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/button/spreadsheet.tsx
@@ -4,7 +4,7 @@ import { PlusIcon } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
 import type { TQuickAddIssueButton } from "../root";
 
-export const SpreadsheetAddIssueButton: FC<TQuickAddIssueButton> = observer((props) => {
+export const SpreadsheetAddIssueButton = observer(function SpreadsheetAddIssueButton(props: TQuickAddIssueButton) {
   const { onClick, isEpic = false } = props;
   const { t } = useTranslation();
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/form/calendar.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/form/calendar.tsx
index bba1a5f77..ff95ffcaf 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/form/calendar.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/form/calendar.tsx
@@ -2,7 +2,7 @@ import type { FC } from "react";
 import { observer } from "mobx-react";
 import type { TQuickAddIssueForm } from "../root";
 
-export const CalendarQuickAddIssueForm: FC<TQuickAddIssueForm> = observer((props) => {
+export const CalendarQuickAddIssueForm = observer(function CalendarQuickAddIssueForm(props: TQuickAddIssueForm) {
   const { ref, isOpen, projectDetail, register, onSubmit, isEpic } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/form/gantt.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/form/gantt.tsx
index c09bae8e1..54949b687 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/form/gantt.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/form/gantt.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from "@plane/i18n";
 import { cn } from "@plane/utils";
 import type { TQuickAddIssueForm } from "../root";
 
-export const GanttQuickAddIssueForm: FC<TQuickAddIssueForm> = observer((props) => {
+export const GanttQuickAddIssueForm = observer(function GanttQuickAddIssueForm(props: TQuickAddIssueForm) {
   const { ref, projectDetail, hasError, register, onSubmit, isEpic } = props;
   const { t } = useTranslation();
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/form/kanban.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/form/kanban.tsx
index c81c36f38..3ad902b6d 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/form/kanban.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/form/kanban.tsx
@@ -3,7 +3,7 @@ import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 import type { TQuickAddIssueForm } from "../root";
 
-export const KanbanQuickAddIssueForm: FC<TQuickAddIssueForm> = observer((props) => {
+export const KanbanQuickAddIssueForm = observer(function KanbanQuickAddIssueForm(props: TQuickAddIssueForm) {
   const { ref, projectDetail, register, onSubmit, isEpic } = props;
   const { t } = useTranslation();
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/form/list.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/form/list.tsx
index 1187f2764..c8a0920d0 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/form/list.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/form/list.tsx
@@ -3,7 +3,7 @@ import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 import type { TQuickAddIssueForm } from "../root";
 
-export const ListQuickAddIssueForm: FC<TQuickAddIssueForm> = observer((props) => {
+export const ListQuickAddIssueForm = observer(function ListQuickAddIssueForm(props: TQuickAddIssueForm) {
   const { ref, projectDetail, register, onSubmit, isEpic } = props;
   const { t } = useTranslation();
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/form/spreadsheet.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/form/spreadsheet.tsx
index abb735b0e..a83a120f6 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/form/spreadsheet.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/form/spreadsheet.tsx
@@ -3,7 +3,7 @@ import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 import type { TQuickAddIssueForm } from "../root";
 
-export const SpreadsheetQuickAddIssueForm: FC<TQuickAddIssueForm> = observer((props) => {
+export const SpreadsheetQuickAddIssueForm = observer(function SpreadsheetQuickAddIssueForm(props: TQuickAddIssueForm) {
   const { ref, projectDetail, register, onSubmit, isEpic } = props;
   const { t } = useTranslation();
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/root.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/root.tsx
index f26a3f4fe..4eba12d0e 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/root.tsx
@@ -51,7 +51,7 @@ const defaultValues: Partial<TIssue> = {
   name: "",
 };
 
-export const QuickAddIssueRoot: FC<TQuickAddIssueRoot> = observer((props) => {
+export const QuickAddIssueRoot = observer(function QuickAddIssueRoot(props: TQuickAddIssueRoot) {
   const {
     isQuickAddOpen,
     layout,
diff --git a/apps/web/core/components/issues/issue-layouts/roots/all-issue-layout-root.tsx b/apps/web/core/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
index 10702ea09..12ffbe887 100644
--- a/apps/web/core/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
@@ -27,7 +27,7 @@ type Props = {
   toggleLoading: (value: boolean) => void;
 };
 
-export const AllIssueLayoutRoot: React.FC<Props> = observer((props: Props) => {
+export const AllIssueLayoutRoot = observer(function AllIssueLayoutRoot(props: Props) {
   const { isDefaultView, isLoading = false, toggleLoading } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/issues/issue-layouts/roots/archived-issue-layout-root.tsx b/apps/web/core/components/issues/issue-layouts/roots/archived-issue-layout-root.tsx
index 858b9130b..0a85e76c6 100644
--- a/apps/web/core/components/issues/issue-layouts/roots/archived-issue-layout-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/roots/archived-issue-layout-root.tsx
@@ -16,7 +16,7 @@ import { IssuesStoreContext } from "@/hooks/use-issue-layout-store";
 import { IssuePeekOverview } from "../../peek-overview";
 import { ArchivedIssueListLayout } from "../list/roots/archived-issue-root";
 
-export const ArchivedIssueLayoutRoot: React.FC = observer(() => {
+export const ArchivedIssueLayoutRoot = observer(function ArchivedIssueLayoutRoot() {
   // router
   const { workspaceSlug: routerWorkspaceSlug, projectId: routerProjectId } = useParams();
   const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined;
diff --git a/apps/web/core/components/issues/issue-layouts/roots/cycle-layout-root.tsx b/apps/web/core/components/issues/issue-layouts/roots/cycle-layout-root.tsx
index a34e10673..caca93fcf 100644
--- a/apps/web/core/components/issues/issue-layouts/roots/cycle-layout-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/roots/cycle-layout-root.tsx
@@ -24,11 +24,11 @@ import { CycleKanBanLayout } from "../kanban/roots/cycle-root";
 import { CycleListLayout } from "../list/roots/cycle-root";
 import { CycleSpreadsheetLayout } from "../spreadsheet/roots/cycle-root";
 
-const CycleIssueLayout = (props: {
+function CycleIssueLayout(props: {
   activeLayout: EIssueLayoutTypes | undefined;
   cycleId: string;
   isCompletedCycle: boolean;
-}) => {
+}) {
   switch (props.activeLayout) {
     case EIssueLayoutTypes.LIST:
       return <CycleListLayout />;
@@ -43,9 +43,9 @@ const CycleIssueLayout = (props: {
     default:
       return null;
   }
-};
+}
 
-export const CycleLayoutRoot: React.FC = observer(() => {
+export const CycleLayoutRoot = observer(function CycleLayoutRoot() {
   const { workspaceSlug: routerWorkspaceSlug, projectId: routerProjectId, cycleId: routerCycleId } = useParams();
   const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined;
   const projectId = routerProjectId ? routerProjectId.toString() : undefined;
diff --git a/apps/web/core/components/issues/issue-layouts/roots/module-layout-root.tsx b/apps/web/core/components/issues/issue-layouts/roots/module-layout-root.tsx
index e4790add1..fc1fe978a 100644
--- a/apps/web/core/components/issues/issue-layouts/roots/module-layout-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/roots/module-layout-root.tsx
@@ -21,7 +21,7 @@ import { ModuleKanBanLayout } from "../kanban/roots/module-root";
 import { ModuleListLayout } from "../list/roots/module-root";
 import { ModuleSpreadsheetLayout } from "../spreadsheet/roots/module-root";
 
-const ModuleIssueLayout = (props: { activeLayout: EIssueLayoutTypes | undefined; moduleId: string }) => {
+function ModuleIssueLayout(props: { activeLayout: EIssueLayoutTypes | undefined; moduleId: string }) {
   switch (props.activeLayout) {
     case EIssueLayoutTypes.LIST:
       return <ModuleListLayout />;
@@ -36,9 +36,9 @@ const ModuleIssueLayout = (props: { activeLayout: EIssueLayoutTypes | undefined;
     default:
       return null;
   }
-};
+}
 
-export const ModuleLayoutRoot: React.FC = observer(() => {
+export const ModuleLayoutRoot = observer(function ModuleLayoutRoot() {
   // router
   const { workspaceSlug: routerWorkspaceSlug, projectId: routerProjectId, moduleId: routerModuleId } = useParams();
   const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined;
diff --git a/apps/web/core/components/issues/issue-layouts/roots/project-layout-root.tsx b/apps/web/core/components/issues/issue-layouts/roots/project-layout-root.tsx
index 7705a2a2f..82e1a9813 100644
--- a/apps/web/core/components/issues/issue-layouts/roots/project-layout-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/roots/project-layout-root.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import type { FC } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
@@ -23,7 +22,7 @@ import { KanBanLayout } from "../kanban/roots/project-root";
 import { ListLayout } from "../list/roots/project-root";
 import { ProjectSpreadsheetLayout } from "../spreadsheet/roots/project-root";
 
-const ProjectIssueLayout = (props: { activeLayout: EIssueLayoutTypes | undefined }) => {
+function ProjectIssueLayout(props: { activeLayout: EIssueLayoutTypes | undefined }) {
   switch (props.activeLayout) {
     case EIssueLayoutTypes.LIST:
       return <ListLayout />;
@@ -38,9 +37,9 @@ const ProjectIssueLayout = (props: { activeLayout: EIssueLayoutTypes | undefined
     default:
       return null;
   }
-};
+}
 
-export const ProjectLayoutRoot: FC = observer(() => {
+export const ProjectLayoutRoot = observer(function ProjectLayoutRoot() {
   // router
   const { workspaceSlug: routerWorkspaceSlug, projectId: routerProjectId } = useParams();
   const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug.toString() : undefined;
diff --git a/apps/web/core/components/issues/issue-layouts/roots/project-view-layout-root.tsx b/apps/web/core/components/issues/issue-layouts/roots/project-view-layout-root.tsx
index 15fecb9a1..17fe10e05 100644
--- a/apps/web/core/components/issues/issue-layouts/roots/project-view-layout-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/roots/project-view-layout-root.tsx
@@ -21,7 +21,7 @@ import { ProjectViewKanBanLayout } from "../kanban/roots/project-view-root";
 import { ProjectViewListLayout } from "../list/roots/project-view-root";
 import { ProjectViewSpreadsheetLayout } from "../spreadsheet/roots/project-view-root";
 
-const ProjectViewIssueLayout = (props: { activeLayout: EIssueLayoutTypes | undefined; viewId: string }) => {
+function ProjectViewIssueLayout(props: { activeLayout: EIssueLayoutTypes | undefined; viewId: string }) {
   switch (props.activeLayout) {
     case EIssueLayoutTypes.LIST:
       return <ProjectViewListLayout />;
@@ -36,9 +36,9 @@ const ProjectViewIssueLayout = (props: { activeLayout: EIssueLayoutTypes | undef
     default:
       return null;
   }
-};
+}
 
-export const ProjectViewLayoutRoot: React.FC = observer(() => {
+export const ProjectViewLayoutRoot = observer(function ProjectViewLayoutRoot() {
   // router
   const { workspaceSlug: routerWorkspaceSlug, projectId: routerProjectId, viewId: routerViewId } = useParams();
   const workspaceSlug = routerWorkspaceSlug ? routerWorkspaceSlug?.toString() : undefined;
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/base-spreadsheet-root.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/base-spreadsheet-root.tsx
index c91fb02ec..1fb1edff8 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/base-spreadsheet-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/base-spreadsheet-root.tsx
@@ -33,7 +33,7 @@ interface IBaseSpreadsheetRoot {
   isEpic?: boolean;
 }
 
-export const BaseSpreadsheetRoot = observer((props: IBaseSpreadsheetRoot) => {
+export const BaseSpreadsheetRoot = observer(function BaseSpreadsheetRoot(props: IBaseSpreadsheetRoot) {
   const { QuickActions, canEditPropertiesBasedOnProject, isCompletedCycle = false, viewId, isEpic = false } = props;
   // router
   const { projectId } = useParams();
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/assignee-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/assignee-column.tsx
index c99d0b7dc..a555a4834 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/assignee-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/assignee-column.tsx
@@ -12,7 +12,7 @@ type Props = {
   disabled: boolean;
 };
 
-export const SpreadsheetAssigneeColumn: React.FC<Props> = observer((props: Props) => {
+export const SpreadsheetAssigneeColumn = observer(function SpreadsheetAssigneeColumn(props: Props) {
   const { issue, onChange, disabled, onClose } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/attachment-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/attachment-column.tsx
index 610c7528f..6077dc8b0 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/attachment-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/attachment-column.tsx
@@ -8,7 +8,7 @@ type Props = {
   issue: TIssue;
 };
 
-export const SpreadsheetAttachmentColumn: React.FC<Props> = observer((props) => {
+export const SpreadsheetAttachmentColumn = observer(function SpreadsheetAttachmentColumn(props: Props) {
   const { issue } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/created-on-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/created-on-column.tsx
index d7713d26f..f4b8ffcdf 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/created-on-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/created-on-column.tsx
@@ -10,7 +10,7 @@ type Props = {
   issue: TIssue;
 };
 
-export const SpreadsheetCreatedOnColumn: React.FC<Props> = observer((props: Props) => {
+export const SpreadsheetCreatedOnColumn = observer(function SpreadsheetCreatedOnColumn(props: Props) {
   const { issue } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/cycle-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/cycle-column.tsx
index 5c7445bc6..9c2a3a307 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/cycle-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/cycle-column.tsx
@@ -16,7 +16,7 @@ type Props = {
   disabled: boolean;
 };
 
-export const SpreadsheetCycleColumn: React.FC<Props> = observer((props) => {
+export const SpreadsheetCycleColumn = observer(function SpreadsheetCycleColumn(props: Props) {
   const { issue, disabled, onClose } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/due-date-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/due-date-column.tsx
index 087e349b6..af477208c 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/due-date-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/due-date-column.tsx
@@ -17,7 +17,7 @@ type Props = {
   disabled: boolean;
 };
 
-export const SpreadsheetDueDateColumn: React.FC<Props> = observer((props: Props) => {
+export const SpreadsheetDueDateColumn = observer(function SpreadsheetDueDateColumn(props: Props) {
   const { issue, onChange, disabled, onClose } = props;
   // store hooks
   const { getStateById } = useProjectState();
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/estimate-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/estimate-column.tsx
index b324f105a..b46b0649f 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/estimate-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/estimate-column.tsx
@@ -11,7 +11,7 @@ type Props = {
   disabled: boolean;
 };
 
-export const SpreadsheetEstimateColumn: React.FC<Props> = observer((props: Props) => {
+export const SpreadsheetEstimateColumn = observer(function SpreadsheetEstimateColumn(props: Props) {
   const { issue, onChange, disabled, onClose } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/header-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/header-column.tsx
index 52807a313..c2047b521 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/header-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/header-column.tsx
@@ -19,7 +19,7 @@ interface Props {
   isEpic?: boolean;
 }
 
-export const HeaderColumn = (props: Props) => {
+export function HeaderColumn(props: Props) {
   const { displayFilters, handleDisplayFilterUpdate, property, onClose, isEpic = false } = props;
   // i18n
   const { t } = useTranslation();
@@ -126,4 +126,4 @@ export const HeaderColumn = (props: Props) => {
         )}
     </CustomMenu>
   );
-};
+}
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/label-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/label-column.tsx
index 9f1a5c007..df54bba8f 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/label-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/label-column.tsx
@@ -14,7 +14,7 @@ type Props = {
   disabled: boolean;
 };
 
-export const SpreadsheetLabelColumn: React.FC<Props> = observer((props: Props) => {
+export const SpreadsheetLabelColumn = observer(function SpreadsheetLabelColumn(props: Props) {
   const { issue, onChange, disabled, onClose } = props;
   // hooks
   const { labelMap } = useLabel();
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/link-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/link-column.tsx
index 09fd881c9..421d5184d 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/link-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/link-column.tsx
@@ -8,7 +8,7 @@ type Props = {
   issue: TIssue;
 };
 
-export const SpreadsheetLinkColumn: React.FC<Props> = observer((props: Props) => {
+export const SpreadsheetLinkColumn = observer(function SpreadsheetLinkColumn(props: Props) {
   const { issue } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/module-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/module-column.tsx
index 518b644f6..5b9784349 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/module-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/module-column.tsx
@@ -18,7 +18,7 @@ type Props = {
   disabled: boolean;
 };
 
-export const SpreadsheetModuleColumn: React.FC<Props> = observer((props) => {
+export const SpreadsheetModuleColumn = observer(function SpreadsheetModuleColumn(props: Props) {
   const { issue, disabled, onClose } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/priority-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/priority-column.tsx
index d2385cdd2..595877e28 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/priority-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/priority-column.tsx
@@ -12,7 +12,7 @@ type Props = {
   disabled: boolean;
 };
 
-export const SpreadsheetPriorityColumn: React.FC<Props> = observer((props: Props) => {
+export const SpreadsheetPriorityColumn = observer(function SpreadsheetPriorityColumn(props: Props) {
   const { issue, onChange, disabled, onClose } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/start-date-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/start-date-column.tsx
index bcdc01a1d..f44a26835 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/start-date-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/start-date-column.tsx
@@ -15,7 +15,7 @@ type Props = {
   disabled: boolean;
 };
 
-export const SpreadsheetStartDateColumn: React.FC<Props> = observer((props: Props) => {
+export const SpreadsheetStartDateColumn = observer(function SpreadsheetStartDateColumn(props: Props) {
   const { issue, onChange, disabled, onClose } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/state-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/state-column.tsx
index 9a772eb07..06b1fea3b 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/state-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/state-column.tsx
@@ -12,7 +12,7 @@ type Props = {
   disabled: boolean;
 };
 
-export const SpreadsheetStateColumn: React.FC<Props> = observer((props) => {
+export const SpreadsheetStateColumn = observer(function SpreadsheetStateColumn(props: Props) {
   const { issue, onChange, disabled, onClose } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/sub-issue-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/sub-issue-column.tsx
index 9f0f8a46d..095738075 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/sub-issue-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/sub-issue-column.tsx
@@ -14,7 +14,7 @@ type Props = {
   issue: TIssue;
 };
 
-export const SpreadsheetSubIssueColumn: React.FC<Props> = observer((props: Props) => {
+export const SpreadsheetSubIssueColumn = observer(function SpreadsheetSubIssueColumn(props: Props) {
   const { issue } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/updated-on-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/updated-on-column.tsx
index c25329e9c..ffa799fd8 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/updated-on-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/updated-on-column.tsx
@@ -10,7 +10,7 @@ type Props = {
   issue: TIssue;
 };
 
-export const SpreadsheetUpdatedOnColumn: React.FC<Props> = observer((props: Props) => {
+export const SpreadsheetUpdatedOnColumn = observer(function SpreadsheetUpdatedOnColumn(props: Props) {
   const { issue } = props;
 
   return (
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-column.tsx
index 851bef4c7..a983a1525 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-column.tsx
@@ -19,7 +19,7 @@ type Props = {
   isEstimateEnabled: boolean;
 };
 
-export const IssueColumn = observer((props: Props) => {
+export const IssueColumn = observer(function IssueColumn(props: Props) {
   const { displayProperties, issueDetail, disableUserActions, property, updateIssue } = props;
   // router
   const tableCellRef = useRef<HTMLTableCellElement | null>(null);
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-row.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-row.tsx
index c79e69a09..7e607a3ec 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-row.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-row.tsx
@@ -52,7 +52,7 @@ interface Props {
   isEpic?: boolean;
 }
 
-export const SpreadsheetIssueRow = observer((props: Props) => {
+export const SpreadsheetIssueRow = observer(function SpreadsheetIssueRow(props: Props) {
   const {
     displayProperties,
     issueId,
@@ -164,7 +164,7 @@ interface IssueRowDetailsProps {
   isEpic?: boolean;
 }
 
-const IssueRowDetails = observer((props: IssueRowDetailsProps) => {
+const IssueRowDetails = observer(function IssueRowDetails(props: IssueRowDetailsProps) {
   const {
     displayProperties,
     issueId,
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/cycle-root.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/cycle-root.tsx
index b8c3c4f28..d5e2c3744 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/cycle-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/cycle-root.tsx
@@ -9,7 +9,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { CycleIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseSpreadsheetRoot } from "../base-spreadsheet-root";
 
-export const CycleSpreadsheetLayout: React.FC = observer(() => {
+export const CycleSpreadsheetLayout = observer(function CycleSpreadsheetLayout() {
   // router
   const { cycleId } = useParams();
   // store hooks
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/module-root.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/module-root.tsx
index 8c37ea8eb..7c95fd3a8 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/module-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/module-root.tsx
@@ -6,7 +6,7 @@ import { useParams } from "next/navigation";
 import { ModuleIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseSpreadsheetRoot } from "../base-spreadsheet-root";
 
-export const ModuleSpreadsheetLayout: React.FC = observer(() => {
+export const ModuleSpreadsheetLayout = observer(function ModuleSpreadsheetLayout() {
   const { moduleId } = useParams();
 
   return <BaseSpreadsheetRoot QuickActions={ModuleIssueQuickActions} viewId={moduleId?.toString()} />;
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/project-root.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/project-root.tsx
index b949cc542..1b3f17ff9 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/project-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/project-root.tsx
@@ -9,7 +9,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import { ProjectIssueQuickActions } from "../../quick-action-dropdowns";
 import { BaseSpreadsheetRoot } from "../base-spreadsheet-root";
 
-export const ProjectSpreadsheetLayout: React.FC = observer(() => {
+export const ProjectSpreadsheetLayout = observer(function ProjectSpreadsheetLayout() {
   // router
   const { workspaceSlug } = useParams();
   // hooks
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/project-view-root.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/project-view-root.tsx
index 78cf20bfb..ec798f5f1 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/project-view-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/project-view-root.tsx
@@ -8,7 +8,7 @@ import { BaseSpreadsheetRoot } from "../base-spreadsheet-root";
 // types
 // constants
 
-export const ProjectViewSpreadsheetLayout: React.FC = observer(() => {
+export const ProjectViewSpreadsheetLayout = observer(function ProjectViewSpreadsheetLayout() {
   const { viewId } = useParams();
 
   return <BaseSpreadsheetRoot QuickActions={ProjectIssueQuickActions} viewId={viewId.toString()} />;
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/workspace-root.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/workspace-root.tsx
index 8f9311713..73bac5508 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/workspace-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/roots/workspace-root.tsx
@@ -31,7 +31,7 @@ type Props = {
   issuesLoading: boolean;
 };
 
-export const WorkspaceSpreadsheetRoot: React.FC<Props> = observer((props: Props) => {
+export const WorkspaceSpreadsheetRoot = observer(function WorkspaceSpreadsheetRoot(props: Props) {
   const { isLoading = false, workspaceSlug, globalViewId, fetchNextPages, issuesLoading } = props;
 
   // Custom hooks
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-header-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-header-column.tsx
index 94bdbdf42..0cb2c840e 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-header-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-header-column.tsx
@@ -15,7 +15,7 @@ interface Props {
   handleDisplayFilterUpdate: (data: Partial<IIssueDisplayFilterOptions>) => void;
   isEpic?: boolean;
 }
-export const SpreadsheetHeaderColumn = observer((props: Props) => {
+export const SpreadsheetHeaderColumn = observer(function SpreadsheetHeaderColumn(props: Props) {
   const { displayProperties, displayFilters, property, handleDisplayFilterUpdate, isEpic = false } = props;
 
   //hooks
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-header.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-header.tsx
index 9c3e7242f..342d94d1f 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-header.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-header.tsx
@@ -23,7 +23,7 @@ interface Props {
   isEpic?: boolean;
 }
 
-export const SpreadsheetHeader = observer((props: Props) => {
+export const SpreadsheetHeader = observer(function SpreadsheetHeader(props: Props) {
   const {
     displayProperties,
     displayFilters,
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-table.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-table.tsx
index dfd3c1347..43040f874 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-table.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-table.tsx
@@ -34,7 +34,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const SpreadsheetTable = observer((props: Props) => {
+export const SpreadsheetTable = observer(function SpreadsheetTable(props: Props) {
   const {
     displayProperties,
     displayFilters,
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-view.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-view.tsx
index 3b3696980..68e6b5d71 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-view.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/spreadsheet-view.tsx
@@ -37,7 +37,7 @@ type Props = {
   isEpic?: boolean;
 };
 
-export const SpreadsheetView: React.FC<Props> = observer((props) => {
+export const SpreadsheetView = observer(function SpreadsheetView(props: Props) {
   const {
     displayProperties,
     displayFilters,
diff --git a/apps/web/core/components/issues/issue-layouts/utils.tsx b/apps/web/core/components/issues/issue-layouts/utils.tsx
index a7bb471e4..23d0a10e6 100644
--- a/apps/web/core/components/issues/issue-layouts/utils.tsx
+++ b/apps/web/core/components/issues/issue-layouts/utils.tsx
@@ -713,12 +713,12 @@ export const getBlockViewDetails = (
  * This method returns the icon for Spreadsheet column headers
  * @param iconKey
  */
-export const SpreadSheetPropertyIcon: FC<ISvgIcons & { iconKey: string }> = (props) => {
+export function SpreadSheetPropertyIcon(props: ISvgIcons & { iconKey: string }) {
   const { iconKey } = props;
   const Icon = SpreadSheetPropertyIconMap[iconKey];
   if (!Icon) return null;
   return <Icon {...props} />;
-};
+}
 
 /**
  * This method returns if the filters are applied
diff --git a/apps/web/core/components/issues/issue-modal/base.tsx b/apps/web/core/components/issues/issue-modal/base.tsx
index 381948123..64db4919d 100644
--- a/apps/web/core/components/issues/issue-modal/base.tsx
+++ b/apps/web/core/components/issues/issue-modal/base.tsx
@@ -31,7 +31,7 @@ import { IssueFormRoot } from "./form";
 import type { IssueFormProps } from "./form";
 import type { IssuesModalProps } from "./modal";
 
-export const CreateUpdateIssueModalBase: React.FC<IssuesModalProps> = observer((props) => {
+export const CreateUpdateIssueModalBase = observer(function CreateUpdateIssueModalBase(props: IssuesModalProps) {
   const {
     data,
     isOpen,
diff --git a/apps/web/core/components/issues/issue-modal/components/default-properties.tsx b/apps/web/core/components/issues/issue-modal/components/default-properties.tsx
index e9def41c6..8999f5fe6 100644
--- a/apps/web/core/components/issues/issue-modal/components/default-properties.tsx
+++ b/apps/web/core/components/issues/issue-modal/components/default-properties.tsx
@@ -45,7 +45,7 @@ type TIssueDefaultPropertiesProps = {
   setSelectedParentIssue: (issue: ISearchIssueResponse) => void;
 };
 
-export const IssueDefaultProperties: React.FC<TIssueDefaultPropertiesProps> = observer((props) => {
+export const IssueDefaultProperties = observer(function IssueDefaultProperties(props: TIssueDefaultPropertiesProps) {
   const {
     control,
     id,
diff --git a/apps/web/core/components/issues/issue-modal/components/description-editor.tsx b/apps/web/core/components/issues/issue-modal/components/description-editor.tsx
index 0cd316126..9b05e4764 100644
--- a/apps/web/core/components/issues/issue-modal/components/description-editor.tsx
+++ b/apps/web/core/components/issues/issue-modal/components/description-editor.tsx
@@ -50,7 +50,7 @@ type TIssueDescriptionEditorProps = {
   onClose: () => void;
 };
 
-export const IssueDescriptionEditor: React.FC<TIssueDescriptionEditorProps> = observer((props) => {
+export const IssueDescriptionEditor = observer(function IssueDescriptionEditor(props: TIssueDescriptionEditorProps) {
   const {
     control,
     isDraft,
diff --git a/apps/web/core/components/issues/issue-modal/components/parent-tag.tsx b/apps/web/core/components/issues/issue-modal/components/parent-tag.tsx
index 499972e48..9234a5f28 100644
--- a/apps/web/core/components/issues/issue-modal/components/parent-tag.tsx
+++ b/apps/web/core/components/issues/issue-modal/components/parent-tag.tsx
@@ -23,7 +23,7 @@ type TIssueParentTagProps = {
   setSelectedParentIssue: (issue: ISearchIssueResponse | null) => void;
 };
 
-export const IssueParentTag: React.FC<TIssueParentTagProps> = observer((props) => {
+export const IssueParentTag = observer(function IssueParentTag(props: TIssueParentTagProps) {
   const { control, selectedParentIssue, handleFormChange, setSelectedParentIssue } = props;
   // store hooks
   const { isMobile } = usePlatformOS();
diff --git a/apps/web/core/components/issues/issue-modal/components/project-select.tsx b/apps/web/core/components/issues/issue-modal/components/project-select.tsx
index 13849b93e..b59776424 100644
--- a/apps/web/core/components/issues/issue-modal/components/project-select.tsx
+++ b/apps/web/core/components/issues/issue-modal/components/project-select.tsx
@@ -21,7 +21,7 @@ type TIssueProjectSelectProps = {
   handleFormChange: () => void;
 };
 
-export const IssueProjectSelect: React.FC<TIssueProjectSelectProps> = observer((props) => {
+export const IssueProjectSelect = observer(function IssueProjectSelect(props: TIssueProjectSelectProps) {
   const { control, disabled = false, handleFormChange } = props;
   // store hooks
   const { isMobile } = usePlatformOS();
diff --git a/apps/web/core/components/issues/issue-modal/components/title-input.tsx b/apps/web/core/components/issues/issue-modal/components/title-input.tsx
index b60df5947..43309e19b 100644
--- a/apps/web/core/components/issues/issue-modal/components/title-input.tsx
+++ b/apps/web/core/components/issues/issue-modal/components/title-input.tsx
@@ -23,7 +23,7 @@ type TIssueTitleInputProps = {
   handleFormChange: () => void;
 };
 
-export const IssueTitleInput: React.FC<TIssueTitleInputProps> = observer((props) => {
+export const IssueTitleInput = observer(function IssueTitleInput(props: TIssueTitleInputProps) {
   const {
     control,
     issueTitleRef,
diff --git a/apps/web/core/components/issues/issue-modal/draft-issue-layout.tsx b/apps/web/core/components/issues/issue-modal/draft-issue-layout.tsx
index 3a232b563..20c1e475f 100644
--- a/apps/web/core/components/issues/issue-modal/draft-issue-layout.tsx
+++ b/apps/web/core/components/issues/issue-modal/draft-issue-layout.tsx
@@ -27,7 +27,7 @@ export interface DraftIssueProps extends IssueFormProps {
   onChange: (formData: Partial<TIssue> | null) => void;
 }
 
-export const DraftIssueLayout: React.FC<DraftIssueProps> = observer((props) => {
+export const DraftIssueLayout = observer(function DraftIssueLayout(props: DraftIssueProps) {
   const { changesMade, data, onChange, onClose, projectId } = props;
   // states
   const [issueDiscardModal, setIssueDiscardModal] = useState(false);
diff --git a/apps/web/core/components/issues/issue-modal/form.tsx b/apps/web/core/components/issues/issue-modal/form.tsx
index 2d8e81f24..7be97b2b1 100644
--- a/apps/web/core/components/issues/issue-modal/form.tsx
+++ b/apps/web/core/components/issues/issue-modal/form.tsx
@@ -73,7 +73,7 @@ export interface IssueFormProps {
   dataResetProperties?: any[];
 }
 
-export const IssueFormRoot: FC<IssueFormProps> = observer((props) => {
+export const IssueFormRoot = observer(function IssueFormRoot(props: IssueFormProps) {
   const { t } = useTranslation();
   const {
     data,
diff --git a/apps/web/core/components/issues/issue-modal/modal.tsx b/apps/web/core/components/issues/issue-modal/modal.tsx
index 9366d8d09..92747ab7b 100644
--- a/apps/web/core/components/issues/issue-modal/modal.tsx
+++ b/apps/web/core/components/issues/issue-modal/modal.tsx
@@ -30,7 +30,7 @@ export interface IssuesModalProps {
   allowedProjectIds?: string[];
 }
 
-export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = observer((props) => {
+export const CreateUpdateIssueModal = observer(function CreateUpdateIssueModal(props: IssuesModalProps) {
   // router params
   const { cycleId, moduleId } = useParams();
   // derived values
diff --git a/apps/web/core/components/issues/issue-update-status.tsx b/apps/web/core/components/issues/issue-update-status.tsx
index 66bdbe8cb..76d355010 100644
--- a/apps/web/core/components/issues/issue-update-status.tsx
+++ b/apps/web/core/components/issues/issue-update-status.tsx
@@ -8,7 +8,7 @@ type Props = {
   isSubmitting: TNameDescriptionLoader;
 };
 
-export const NameDescriptionUpdateStatus: React.FC<Props> = observer((props) => {
+export const NameDescriptionUpdateStatus = observer(function NameDescriptionUpdateStatus(props: Props) {
   const { isSubmitting } = props;
 
   return (
diff --git a/apps/web/core/components/issues/label.tsx b/apps/web/core/components/issues/label.tsx
index c88c9a0b4..7f8733564 100644
--- a/apps/web/core/components/issues/label.tsx
+++ b/apps/web/core/components/issues/label.tsx
@@ -9,7 +9,7 @@ type Props = {
   maxRender?: number;
 };
 
-export const ViewIssueLabel: React.FC<Props> = ({ labelDetails, maxRender = 1 }) => {
+export function ViewIssueLabel({ labelDetails, maxRender = 1 }: Props) {
   const { isMobile } = usePlatformOS();
   return (
     <>
@@ -55,4 +55,4 @@ export const ViewIssueLabel: React.FC<Props> = ({ labelDetails, maxRender = 1 })
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/issues/parent-issues-list-modal.tsx b/apps/web/core/components/issues/parent-issues-list-modal.tsx
index 988c72d10..97c8ff68f 100644
--- a/apps/web/core/components/issues/parent-issues-list-modal.tsx
+++ b/apps/web/core/components/issues/parent-issues-list-modal.tsx
@@ -37,7 +37,7 @@ type Props = {
 // services
 const projectService = new ProjectService();
 
-export const ParentIssuesListModal: React.FC<Props> = ({
+export function ParentIssuesListModal({
   isOpen,
   handleClose: onClose,
   value,
@@ -45,7 +45,7 @@ export const ParentIssuesListModal: React.FC<Props> = ({
   projectId,
   issueId,
   searchEpic = false,
-}) => {
+}: Props) {
   // i18n
   const { t } = useTranslation();
 
@@ -226,4 +226,4 @@ export const ParentIssuesListModal: React.FC<Props> = ({
       </Transition.Root>
     </>
   );
-};
+}
diff --git a/apps/web/core/components/issues/peek-overview/error.tsx b/apps/web/core/components/issues/peek-overview/error.tsx
index 59f901a86..c05cc2c95 100644
--- a/apps/web/core/components/issues/peek-overview/error.tsx
+++ b/apps/web/core/components/issues/peek-overview/error.tsx
@@ -14,7 +14,7 @@ type TIssuePeekOverviewError = {
   removeRoutePeekId: () => void;
 };
 
-export const IssuePeekOverviewError: FC<TIssuePeekOverviewError> = (props) => {
+export function IssuePeekOverviewError(props: TIssuePeekOverviewError) {
   const { removeRoutePeekId } = props;
   // hooks
   const { isMobile } = usePlatformOS();
@@ -38,4 +38,4 @@ export const IssuePeekOverviewError: FC<TIssuePeekOverviewError> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/peek-overview/header.tsx b/apps/web/core/components/issues/peek-overview/header.tsx
index 101605a73..e2a9b055a 100644
--- a/apps/web/core/components/issues/peek-overview/header.tsx
+++ b/apps/web/core/components/issues/peek-overview/header.tsx
@@ -66,7 +66,7 @@ export type PeekOverviewHeaderProps = {
   isSubmitting: TNameDescriptionLoader;
 };
 
-export const IssuePeekOverviewHeader: FC<PeekOverviewHeaderProps> = observer((props) => {
+export const IssuePeekOverviewHeader = observer(function IssuePeekOverviewHeader(props: PeekOverviewHeaderProps) {
   const {
     peekMode,
     setPeekMode,
diff --git a/apps/web/core/components/issues/peek-overview/issue-detail.tsx b/apps/web/core/components/issues/peek-overview/issue-detail.tsx
index fcda11d1d..ea121f68f 100644
--- a/apps/web/core/components/issues/peek-overview/issue-detail.tsx
+++ b/apps/web/core/components/issues/peek-overview/issue-detail.tsx
@@ -44,7 +44,7 @@ type Props = {
   setIsSubmitting: (value: TNameDescriptionLoader) => void;
 };
 
-export const PeekOverviewIssueDetails: FC<Props> = observer((props) => {
+export const PeekOverviewIssueDetails = observer(function PeekOverviewIssueDetails(props: Props) {
   const { editorRef, workspaceSlug, issueId, issueOperations, disabled, isArchived, isSubmitting, setIsSubmitting } =
     props;
   // store hooks
diff --git a/apps/web/core/components/issues/peek-overview/loader.tsx b/apps/web/core/components/issues/peek-overview/loader.tsx
index e16479e39..d3240144b 100644
--- a/apps/web/core/components/issues/peek-overview/loader.tsx
+++ b/apps/web/core/components/issues/peek-overview/loader.tsx
@@ -11,7 +11,7 @@ type TIssuePeekOverviewLoader = {
   removeRoutePeekId: () => void;
 };
 
-export const IssuePeekOverviewLoader: FC<TIssuePeekOverviewLoader> = (props) => {
+export function IssuePeekOverviewLoader(props: TIssuePeekOverviewLoader) {
   const { removeRoutePeekId } = props;
   // hooks
   const { isMobile } = usePlatformOS();
@@ -104,4 +104,4 @@ export const IssuePeekOverviewLoader: FC<TIssuePeekOverviewLoader> = (props) =>
       </div>
     </Loader>
   );
-};
+}
diff --git a/apps/web/core/components/issues/peek-overview/properties.tsx b/apps/web/core/components/issues/peek-overview/properties.tsx
index 68728e9a3..25f39ffb2 100644
--- a/apps/web/core/components/issues/peek-overview/properties.tsx
+++ b/apps/web/core/components/issues/peek-overview/properties.tsx
@@ -50,7 +50,7 @@ interface IPeekOverviewProperties {
   issueOperations: TIssueOperations;
 }
 
-export const PeekOverviewProperties: FC<IPeekOverviewProperties> = observer((props) => {
+export const PeekOverviewProperties = observer(function PeekOverviewProperties(props: IPeekOverviewProperties) {
   const { workspaceSlug, projectId, issueId, issueOperations, disabled } = props;
   const { t } = useTranslation();
   // store hooks
diff --git a/apps/web/core/components/issues/peek-overview/root.tsx b/apps/web/core/components/issues/peek-overview/root.tsx
index a13a7ac58..f1d6636e3 100644
--- a/apps/web/core/components/issues/peek-overview/root.tsx
+++ b/apps/web/core/components/issues/peek-overview/root.tsx
@@ -22,7 +22,7 @@ import { useWorkItemProperties } from "@/plane-web/hooks/use-issue-properties";
 import type { TIssueOperations } from "../issue-detail";
 import { IssueView } from "./view";
 
-export const IssuePeekOverview: FC<IWorkItemPeekOverview> = observer((props) => {
+export const IssuePeekOverview = observer(function IssuePeekOverview(props: IWorkItemPeekOverview) {
   const {
     embedIssue = false,
     embedRemoveCurrentNotification,
diff --git a/apps/web/core/components/issues/peek-overview/view.tsx b/apps/web/core/components/issues/peek-overview/view.tsx
index d9febc7a1..a5fd4f484 100644
--- a/apps/web/core/components/issues/peek-overview/view.tsx
+++ b/apps/web/core/components/issues/peek-overview/view.tsx
@@ -35,7 +35,7 @@ interface IIssueView {
   issueOperations: TIssueOperations;
 }
 
-export const IssueView: FC<IIssueView> = observer((props) => {
+export const IssueView = observer(function IssueView(props: IIssueView) {
   const {
     workspaceSlug,
     projectId,
diff --git a/apps/web/core/components/issues/preview-card/date.tsx b/apps/web/core/components/issues/preview-card/date.tsx
index 38f08b500..7de4cf4ed 100644
--- a/apps/web/core/components/issues/preview-card/date.tsx
+++ b/apps/web/core/components/issues/preview-card/date.tsx
@@ -10,7 +10,7 @@ type Props = {
   targetDate: string | null;
 };
 
-export const WorkItemPreviewCardDate: React.FC<Props> = (props) => {
+export function WorkItemPreviewCardDate(props: Props) {
   const { startDate, stateGroup, targetDate } = props;
   // derived values
   const isDateRangeEnabled = Boolean(startDate && targetDate);
@@ -48,4 +48,4 @@ export const WorkItemPreviewCardDate: React.FC<Props> = (props) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/preview-card/root.tsx b/apps/web/core/components/issues/preview-card/root.tsx
index 90432e7cc..e038733b0 100644
--- a/apps/web/core/components/issues/preview-card/root.tsx
+++ b/apps/web/core/components/issues/preview-card/root.tsx
@@ -20,7 +20,7 @@ type Props = {
   workItem: Pick<TIssue, "id" | "name" | "sequence_id" | "priority" | "start_date" | "target_date" | "type_id">;
 };
 
-export const WorkItemPreviewCard: React.FC<Props> = observer((props) => {
+export const WorkItemPreviewCard = observer(function WorkItemPreviewCard(props: Props) {
   const { projectId, stateDetails, workItem } = props;
   // store hooks
   const { getProjectIdentifierById } = useProject();
diff --git a/apps/web/core/components/issues/relations/issue-list-item.tsx b/apps/web/core/components/issues/relations/issue-list-item.tsx
index 853cd754c..5969434ca 100644
--- a/apps/web/core/components/issues/relations/issue-list-item.tsx
+++ b/apps/web/core/components/issues/relations/issue-list-item.tsx
@@ -40,7 +40,7 @@ type Props = {
   issueServiceType?: TIssueServiceType;
 };
 
-export const RelationIssueListItem: FC<Props> = observer((props) => {
+export const RelationIssueListItem = observer(function RelationIssueListItem(props: Props) {
   const {
     workspaceSlug,
     issueId,
diff --git a/apps/web/core/components/issues/relations/issue-list.tsx b/apps/web/core/components/issues/relations/issue-list.tsx
index 3b30cdb98..5a587a710 100644
--- a/apps/web/core/components/issues/relations/issue-list.tsx
+++ b/apps/web/core/components/issues/relations/issue-list.tsx
@@ -26,7 +26,7 @@ type Props = {
   issueServiceType?: TIssueServiceType;
 };
 
-export const RelationIssueList: FC<Props> = observer((props) => {
+export const RelationIssueList = observer(function RelationIssueList(props: Props) {
   const {
     workspaceSlug,
     issueId,
diff --git a/apps/web/core/components/issues/relations/properties.tsx b/apps/web/core/components/issues/relations/properties.tsx
index 686b2e2c2..854ff32ff 100644
--- a/apps/web/core/components/issues/relations/properties.tsx
+++ b/apps/web/core/components/issues/relations/properties.tsx
@@ -21,7 +21,7 @@ type Props = {
   issueServiceType?: TIssueServiceType;
 };
 
-export const RelationIssueProperty: FC<Props> = observer((props) => {
+export const RelationIssueProperty = observer(function RelationIssueProperty(props: Props) {
   const { workspaceSlug, issueId, disabled, issueOperations, issueServiceType = EIssueServiceType.ISSUES } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/issues/select/base.tsx b/apps/web/core/components/issues/select/base.tsx
index a81eebcd9..d7fa20779 100644
--- a/apps/web/core/components/issues/select/base.tsx
+++ b/apps/web/core/components/issues/select/base.tsx
@@ -33,7 +33,7 @@ export type TWorkItemLabelSelectBaseProps = {
   value: string[];
 };
 
-export const WorkItemLabelSelectBase: React.FC<TWorkItemLabelSelectBaseProps> = observer((props) => {
+export const WorkItemLabelSelectBase = observer(function WorkItemLabelSelectBase(props: TWorkItemLabelSelectBaseProps) {
   const {
     buttonClassName,
     buttonContainerClassName,
diff --git a/apps/web/core/components/issues/select/dropdown.tsx b/apps/web/core/components/issues/select/dropdown.tsx
index 2606a563b..ea0d803c7 100644
--- a/apps/web/core/components/issues/select/dropdown.tsx
+++ b/apps/web/core/components/issues/select/dropdown.tsx
@@ -15,7 +15,7 @@ type TWorkItemLabelSelectProps = Omit<TWorkItemLabelSelectBaseProps, "labelIds"
   projectId: string | undefined;
 };
 
-export const IssueLabelSelect: React.FC<TWorkItemLabelSelectProps> = observer((props) => {
+export const IssueLabelSelect = observer(function IssueLabelSelect(props: TWorkItemLabelSelectProps) {
   const { projectId } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/issues/title-input.tsx b/apps/web/core/components/issues/title-input.tsx
index 30d555517..cc64a5b12 100644
--- a/apps/web/core/components/issues/title-input.tsx
+++ b/apps/web/core/components/issues/title-input.tsx
@@ -26,7 +26,7 @@ export type IssueTitleInputProps = {
   containerClassName?: string;
 };
 
-export const IssueTitleInput: FC<IssueTitleInputProps> = observer((props) => {
+export const IssueTitleInput = observer(function IssueTitleInput(props: IssueTitleInputProps) {
   const {
     disabled,
     value,
diff --git a/apps/web/core/components/issues/workspace-draft/delete-modal.tsx b/apps/web/core/components/issues/workspace-draft/delete-modal.tsx
index fee797304..f2856c811 100644
--- a/apps/web/core/components/issues/workspace-draft/delete-modal.tsx
+++ b/apps/web/core/components/issues/workspace-draft/delete-modal.tsx
@@ -21,7 +21,7 @@ type Props = {
   onSubmit?: () => Promise<void>;
 };
 
-export const WorkspaceDraftIssueDeleteIssueModal: React.FC<Props> = (props) => {
+export function WorkspaceDraftIssueDeleteIssueModal(props: Props) {
   const { dataId, data, isOpen, handleClose, onSubmit } = props;
   // states
   const [isDeleting, setIsDeleting] = useState(false);
@@ -102,4 +102,4 @@ export const WorkspaceDraftIssueDeleteIssueModal: React.FC<Props> = (props) => {
       secondaryButtonText={t("cancel")}
     />
   );
-};
+}
diff --git a/apps/web/core/components/issues/workspace-draft/draft-issue-block.tsx b/apps/web/core/components/issues/workspace-draft/draft-issue-block.tsx
index 137767953..71a30712a 100644
--- a/apps/web/core/components/issues/workspace-draft/draft-issue-block.tsx
+++ b/apps/web/core/components/issues/workspace-draft/draft-issue-block.tsx
@@ -28,7 +28,7 @@ type Props = {
   issueId: string;
 };
 
-export const DraftIssueBlock: FC<Props> = observer((props) => {
+export const DraftIssueBlock = observer(function DraftIssueBlock(props: Props) {
   // props
   const { workspaceSlug, issueId } = props;
   // states
diff --git a/apps/web/core/components/issues/workspace-draft/draft-issue-properties.tsx b/apps/web/core/components/issues/workspace-draft/draft-issue-properties.tsx
index e931bd25c..b5670aeb1 100644
--- a/apps/web/core/components/issues/workspace-draft/draft-issue-properties.tsx
+++ b/apps/web/core/components/issues/workspace-draft/draft-issue-properties.tsx
@@ -35,7 +35,7 @@ export interface IIssueProperties {
   className: string;
 }
 
-export const DraftIssueProperties: React.FC<IIssueProperties> = observer((props) => {
+export const DraftIssueProperties = observer(function DraftIssueProperties(props: IIssueProperties) {
   const { issue, updateIssue, className } = props;
   // store hooks
   const { getProjectById } = useProject();
diff --git a/apps/web/core/components/issues/workspace-draft/empty-state.tsx b/apps/web/core/components/issues/workspace-draft/empty-state.tsx
index 37e19ca4c..4ac44d648 100644
--- a/apps/web/core/components/issues/workspace-draft/empty-state.tsx
+++ b/apps/web/core/components/issues/workspace-draft/empty-state.tsx
@@ -12,7 +12,7 @@ import { CreateUpdateIssueModal } from "@/components/issues/issue-modal/modal";
 // constants
 import { useUserPermissions } from "@/hooks/store/user";
 
-export const WorkspaceDraftEmptyState: FC = observer(() => {
+export const WorkspaceDraftEmptyState = observer(function WorkspaceDraftEmptyState() {
   // state
   const [isDraftIssueModalOpen, setIsDraftIssueModalOpen] = useState(false);
   // store hooks
diff --git a/apps/web/core/components/issues/workspace-draft/loader.tsx b/apps/web/core/components/issues/workspace-draft/loader.tsx
index 95aa0a2a1..fdfc42f37 100644
--- a/apps/web/core/components/issues/workspace-draft/loader.tsx
+++ b/apps/web/core/components/issues/workspace-draft/loader.tsx
@@ -9,7 +9,7 @@ type TWorkspaceDraftIssuesLoader = {
   items?: number;
 };
 
-export const WorkspaceDraftIssuesLoader: FC<TWorkspaceDraftIssuesLoader> = (props) => {
+export function WorkspaceDraftIssuesLoader(props: TWorkspaceDraftIssuesLoader) {
   const { items = 14 } = props;
   return (
     <div className="relative h-full w-full">
@@ -18,4 +18,4 @@ export const WorkspaceDraftIssuesLoader: FC<TWorkspaceDraftIssuesLoader> = (prop
       ))}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/issues/workspace-draft/quick-action.tsx b/apps/web/core/components/issues/workspace-draft/quick-action.tsx
index 2f5697522..ef3fc5177 100644
--- a/apps/web/core/components/issues/workspace-draft/quick-action.tsx
+++ b/apps/web/core/components/issues/workspace-draft/quick-action.tsx
@@ -13,7 +13,7 @@ export interface Props {
   MENU_ITEMS: TContextMenuItem[];
 }
 
-export const WorkspaceDraftIssueQuickActions: React.FC<Props> = observer((props) => {
+export const WorkspaceDraftIssueQuickActions = observer(function WorkspaceDraftIssueQuickActions(props: Props) {
   const { parentRef, MENU_ITEMS } = props;
 
   const { t } = useTranslation();
diff --git a/apps/web/core/components/issues/workspace-draft/root.tsx b/apps/web/core/components/issues/workspace-draft/root.tsx
index e35d9ec3f..381f84da1 100644
--- a/apps/web/core/components/issues/workspace-draft/root.tsx
+++ b/apps/web/core/components/issues/workspace-draft/root.tsx
@@ -27,7 +27,7 @@ type TWorkspaceDraftIssuesRoot = {
   workspaceSlug: string;
 };
 
-export const WorkspaceDraftIssuesRoot: FC<TWorkspaceDraftIssuesRoot> = observer((props) => {
+export const WorkspaceDraftIssuesRoot = observer(function WorkspaceDraftIssuesRoot(props: TWorkspaceDraftIssuesRoot) {
   const { workspaceSlug } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/labels/delete-label-modal.tsx b/apps/web/core/components/labels/delete-label-modal.tsx
index 49a104eb3..42058f707 100644
--- a/apps/web/core/components/labels/delete-label-modal.tsx
+++ b/apps/web/core/components/labels/delete-label-modal.tsx
@@ -19,7 +19,7 @@ type Props = {
   data: IIssueLabel | null;
 };
 
-export const DeleteLabelModal: React.FC<Props> = observer((props) => {
+export const DeleteLabelModal = observer(function DeleteLabelModal(props: Props) {
   const { isOpen, onClose, data } = props;
   // router
   const { workspaceSlug, projectId } = useParams();
diff --git a/apps/web/core/components/labels/label-block/label-item-block.tsx b/apps/web/core/components/labels/label-block/label-item-block.tsx
index ec5b5f39b..8ca58d0f5 100644
--- a/apps/web/core/components/labels/label-block/label-item-block.tsx
+++ b/apps/web/core/components/labels/label-block/label-item-block.tsx
@@ -36,7 +36,7 @@ interface ILabelItemBlock {
   draggable?: boolean;
 }
 
-export const LabelItemBlock = (props: ILabelItemBlock) => {
+export function LabelItemBlock(props: ILabelItemBlock) {
   const {
     label,
     isDragging,
@@ -107,4 +107,4 @@ export const LabelItemBlock = (props: ILabelItemBlock) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/labels/label-block/label-name.tsx b/apps/web/core/components/labels/label-block/label-name.tsx
index 1eaf28498..a29bcc339 100644
--- a/apps/web/core/components/labels/label-block/label-name.tsx
+++ b/apps/web/core/components/labels/label-block/label-name.tsx
@@ -6,7 +6,7 @@ interface ILabelName {
   isGroup: boolean;
 }
 
-export const LabelName = (props: ILabelName) => {
+export function LabelName(props: ILabelName) {
   const { name, color, isGroup } = props;
 
   return (
@@ -24,4 +24,4 @@ export const LabelName = (props: ILabelName) => {
       <h6 className="text-sm">{name}</h6>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/labels/label-drag-n-drop-HOC.tsx b/apps/web/core/components/labels/label-drag-n-drop-HOC.tsx
index 624675f26..f02f29b23 100644
--- a/apps/web/core/components/labels/label-drag-n-drop-HOC.tsx
+++ b/apps/web/core/components/labels/label-drag-n-drop-HOC.tsx
@@ -25,7 +25,7 @@ type LabelDragPreviewProps = {
   isGroup: boolean;
 };
 
-export const LabelDragPreview = (props: LabelDragPreviewProps) => {
+export function LabelDragPreview(props: LabelDragPreviewProps) {
   const { label, isGroup } = props;
 
   return (
@@ -33,7 +33,7 @@ export const LabelDragPreview = (props: LabelDragPreviewProps) => {
       <LabelName name={label.name} color={label.color} isGroup={isGroup} />
     </div>
   );
-};
+}
 
 type Props = {
   label: IIssueLabel;
@@ -53,7 +53,7 @@ type Props = {
   ) => void;
 };
 
-export const LabelDndHOC = observer((props: Props) => {
+export const LabelDndHOC = observer(function LabelDndHOC(props: Props) {
   const { label, isGroup, isChild, isLastChild, children, onDrop } = props;
 
   const [isDragging, setIsDragging] = useState(false);
diff --git a/apps/web/core/components/labels/project-setting-label-group.tsx b/apps/web/core/components/labels/project-setting-label-group.tsx
index 8abbd67cf..e972e6407 100644
--- a/apps/web/core/components/labels/project-setting-label-group.tsx
+++ b/apps/web/core/components/labels/project-setting-label-group.tsx
@@ -35,7 +35,7 @@ type Props = {
   isEditable?: boolean;
 };
 
-export const ProjectSettingLabelGroup: React.FC<Props> = observer((props) => {
+export const ProjectSettingLabelGroup = observer(function ProjectSettingLabelGroup(props: Props) {
   const {
     label,
     labelChildren,
diff --git a/apps/web/core/components/labels/project-setting-label-item.tsx b/apps/web/core/components/labels/project-setting-label-item.tsx
index 71aa6da9f..e517a655c 100644
--- a/apps/web/core/components/labels/project-setting-label-item.tsx
+++ b/apps/web/core/components/labels/project-setting-label-item.tsx
@@ -33,7 +33,7 @@ type Props = {
   isEditable?: boolean;
 };
 
-export const ProjectSettingLabelItem: React.FC<Props> = (props) => {
+export function ProjectSettingLabelItem(props: Props) {
   const {
     label,
     setIsUpdating,
@@ -121,4 +121,4 @@ export const ProjectSettingLabelItem: React.FC<Props> = (props) => {
       )}
     </LabelDndHOC>
   );
-};
+}
diff --git a/apps/web/core/components/labels/project-setting-label-list.tsx b/apps/web/core/components/labels/project-setting-label-list.tsx
index bf4c13693..4b5e02327 100644
--- a/apps/web/core/components/labels/project-setting-label-list.tsx
+++ b/apps/web/core/components/labels/project-setting-label-list.tsx
@@ -23,7 +23,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 // local imports
 import { SettingsHeading } from "../settings/heading";
 
-export const ProjectSettingsLabelList: React.FC = observer(() => {
+export const ProjectSettingsLabelList = observer(function ProjectSettingsLabelList() {
   // router
   const { workspaceSlug, projectId } = useParams();
   // refs
diff --git a/apps/web/core/components/license/modal/card/base-paid-plan-card.tsx b/apps/web/core/components/license/modal/card/base-paid-plan-card.tsx
index 4c151d9f0..1d52503e3 100644
--- a/apps/web/core/components/license/modal/card/base-paid-plan-card.tsx
+++ b/apps/web/core/components/license/modal/card/base-paid-plan-card.tsx
@@ -22,7 +22,7 @@ export type TBasePaidPlanCardProps = {
   renderActionButton: (price: TSubscriptionPrice) => React.ReactNode;
 };
 
-export const BasePaidPlanCard: FC<TBasePaidPlanCardProps> = observer((props) => {
+export const BasePaidPlanCard = observer(function BasePaidPlanCard(props: TBasePaidPlanCardProps) {
   const {
     planVariant,
     features,
diff --git a/apps/web/core/components/license/modal/card/checkout-button.tsx b/apps/web/core/components/license/modal/card/checkout-button.tsx
index 7976e14c5..d9ef73cd7 100644
--- a/apps/web/core/components/license/modal/card/checkout-button.tsx
+++ b/apps/web/core/components/license/modal/card/checkout-button.tsx
@@ -29,7 +29,7 @@ type Props = {
   isTrialAllowed: boolean;
 };
 
-export const PlanCheckoutButton: FC<Props> = observer((props) => {
+export const PlanCheckoutButton = observer(function PlanCheckoutButton(props: Props) {
   const {
     planeName,
     planVariant,
diff --git a/apps/web/core/components/license/modal/card/discount-info.tsx b/apps/web/core/components/license/modal/card/discount-info.tsx
index 8ac259454..7ce7c90b2 100644
--- a/apps/web/core/components/license/modal/card/discount-info.tsx
+++ b/apps/web/core/components/license/modal/card/discount-info.tsx
@@ -23,7 +23,7 @@ const getActualPrice = (frequency: TBillingFrequency, subscriptionType: EProduct
   }
 };
 
-export const DiscountInfo = ({ className, currency, frequency, price, subscriptionType }: TDiscountInfoProps) => {
+export function DiscountInfo({ className, currency, frequency, price, subscriptionType }: TDiscountInfoProps) {
   const { resolvedTheme } = useTheme();
   // derived values
   const actualPrice = getActualPrice(frequency, subscriptionType);
@@ -58,4 +58,4 @@ export const DiscountInfo = ({ className, currency, frequency, price, subscripti
       {price}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/license/modal/card/free-plan.tsx b/apps/web/core/components/license/modal/card/free-plan.tsx
index 250ac4164..b275853b4 100644
--- a/apps/web/core/components/license/modal/card/free-plan.tsx
+++ b/apps/web/core/components/license/modal/card/free-plan.tsx
@@ -11,7 +11,7 @@ type FreePlanCardProps = {
   isOnFreePlan: boolean;
 };
 
-export const FreePlanCard = observer((props: FreePlanCardProps) => {
+export const FreePlanCard = observer(function FreePlanCard(props: FreePlanCardProps) {
   const { isOnFreePlan } = props;
   return (
     <div className="py-4 px-2 border border-custom-border-200 rounded-xl">
diff --git a/apps/web/core/components/license/modal/card/plan-upgrade.tsx b/apps/web/core/components/license/modal/card/plan-upgrade.tsx
index 623afd22f..bb0b0d55e 100644
--- a/apps/web/core/components/license/modal/card/plan-upgrade.tsx
+++ b/apps/web/core/components/license/modal/card/plan-upgrade.tsx
@@ -28,7 +28,7 @@ export type PlanUpgradeCardProps = {
   isTrialAllowed: boolean;
 };
 
-export const PlanUpgradeCard: FC<PlanUpgradeCardProps> = observer((props) => {
+export const PlanUpgradeCard = observer(function PlanUpgradeCard(props: PlanUpgradeCardProps) {
   const {
     planVariant,
     features,
diff --git a/apps/web/core/components/license/modal/card/talk-to-sales.tsx b/apps/web/core/components/license/modal/card/talk-to-sales.tsx
index e77606ae6..12711fe65 100644
--- a/apps/web/core/components/license/modal/card/talk-to-sales.tsx
+++ b/apps/web/core/components/license/modal/card/talk-to-sales.tsx
@@ -26,7 +26,7 @@ export type TalkToSalesCardProps = {
   renderTrialButton?: (props: { productId: string | undefined; priceId: string | undefined }) => React.ReactNode;
 };
 
-export const TalkToSalesCard: FC<TalkToSalesCardProps> = observer((props) => {
+export const TalkToSalesCard = observer(function TalkToSalesCard(props: TalkToSalesCardProps) {
   const {
     planVariant,
     href,
diff --git a/apps/web/core/components/modules/analytics-sidebar/issue-progress.tsx b/apps/web/core/components/modules/analytics-sidebar/issue-progress.tsx
index 87ea34adb..9107f9bbf 100644
--- a/apps/web/core/components/modules/analytics-sidebar/issue-progress.tsx
+++ b/apps/web/core/components/modules/analytics-sidebar/issue-progress.tsx
@@ -34,7 +34,7 @@ const moduleBurnDownChartOptions = [
   { value: "points", i18n_label: "points" },
 ];
 
-export const ModuleAnalyticsProgress: FC<TModuleAnalyticsProgress> = observer((props) => {
+export const ModuleAnalyticsProgress = observer(function ModuleAnalyticsProgress(props: TModuleAnalyticsProgress) {
   // props
   const { workspaceSlug, projectId, moduleId } = props;
   // router
diff --git a/apps/web/core/components/modules/analytics-sidebar/progress-stats.tsx b/apps/web/core/components/modules/analytics-sidebar/progress-stats.tsx
index 7ef16ae02..fb240d5ab 100644
--- a/apps/web/core/components/modules/analytics-sidebar/progress-stats.tsx
+++ b/apps/web/core/components/modules/analytics-sidebar/progress-stats.tsx
@@ -33,7 +33,7 @@ type TModuleProgressStats = {
   totalIssuesCount: number;
 };
 
-export const ModuleProgressStats: FC<TModuleProgressStats> = observer((props) => {
+export const ModuleProgressStats = observer(function ModuleProgressStats(props: TModuleProgressStats) {
   const {
     distribution,
     groupedIssues,
diff --git a/apps/web/core/components/modules/analytics-sidebar/root.tsx b/apps/web/core/components/modules/analytics-sidebar/root.tsx
index 3026f2e2e..06b16a406 100644
--- a/apps/web/core/components/modules/analytics-sidebar/root.tsx
+++ b/apps/web/core/components/modules/analytics-sidebar/root.tsx
@@ -55,7 +55,7 @@ type Props = {
 };
 
 // TODO: refactor this component
-export const ModuleAnalyticsSidebar: React.FC<Props> = observer((props) => {
+export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(props: Props) {
   const { moduleId, handleClose, isArchived } = props;
   // states
   const [moduleLinkModal, setModuleLinkModal] = useState(false);
diff --git a/apps/web/core/components/modules/applied-filters/date.tsx b/apps/web/core/components/modules/applied-filters/date.tsx
index 115176c42..e134a2cc8 100644
--- a/apps/web/core/components/modules/applied-filters/date.tsx
+++ b/apps/web/core/components/modules/applied-filters/date.tsx
@@ -12,7 +12,7 @@ type Props = {
   values: string[];
 };
 
-export const AppliedDateFilters: React.FC<Props> = observer((props) => {
+export const AppliedDateFilters = observer(function AppliedDateFilters(props: Props) {
   const { editable, handleRemove, values } = props;
 
   const getDateLabel = (value: string): string => {
diff --git a/apps/web/core/components/modules/applied-filters/members.tsx b/apps/web/core/components/modules/applied-filters/members.tsx
index baa58d622..613de7fff 100644
--- a/apps/web/core/components/modules/applied-filters/members.tsx
+++ b/apps/web/core/components/modules/applied-filters/members.tsx
@@ -15,7 +15,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
+export const AppliedMembersFilters = observer(function AppliedMembersFilters(props: Props) {
   const { handleRemove, values, editable } = props;
   // store hooks
   const {
diff --git a/apps/web/core/components/modules/applied-filters/root.tsx b/apps/web/core/components/modules/applied-filters/root.tsx
index 03f01432a..2996e2bcb 100644
--- a/apps/web/core/components/modules/applied-filters/root.tsx
+++ b/apps/web/core/components/modules/applied-filters/root.tsx
@@ -21,7 +21,7 @@ type Props = {
 const MEMBERS_FILTERS = ["lead", "members"];
 const DATE_FILTERS = ["start_date", "target_date"];
 
-export const ModuleAppliedFiltersList: React.FC<Props> = (props) => {
+export function ModuleAppliedFiltersList(props: Props) {
   const {
     appliedFilters,
     isFavoriteFilterApplied,
@@ -123,4 +123,4 @@ export const ModuleAppliedFiltersList: React.FC<Props> = (props) => {
       </div>
     </Header>
   );
-};
+}
diff --git a/apps/web/core/components/modules/applied-filters/status.tsx b/apps/web/core/components/modules/applied-filters/status.tsx
index a25e1b9f0..98c3df22e 100644
--- a/apps/web/core/components/modules/applied-filters/status.tsx
+++ b/apps/web/core/components/modules/applied-filters/status.tsx
@@ -13,7 +13,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedStatusFilters: React.FC<Props> = observer((props) => {
+export const AppliedStatusFilters = observer(function AppliedStatusFilters(props: Props) {
   const { handleRemove, values, editable } = props;
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/modules/archived-modules/header.tsx b/apps/web/core/components/modules/archived-modules/header.tsx
index 7e2469253..c69a3f37c 100644
--- a/apps/web/core/components/modules/archived-modules/header.tsx
+++ b/apps/web/core/components/modules/archived-modules/header.tsx
@@ -19,7 +19,7 @@ import { ModuleFiltersSelection, ModuleOrderByDropdown } from "@/components/modu
 import { useMember } from "@/hooks/store/use-member";
 import { useModuleFilter } from "@/hooks/store/use-module-filter";
 
-export const ArchivedModulesHeader: FC = observer(() => {
+export const ArchivedModulesHeader = observer(function ArchivedModulesHeader() {
   // router
   const { projectId } = useParams();
   // refs
diff --git a/apps/web/core/components/modules/archived-modules/modal.tsx b/apps/web/core/components/modules/archived-modules/modal.tsx
index 340b44979..9c52a708c 100644
--- a/apps/web/core/components/modules/archived-modules/modal.tsx
+++ b/apps/web/core/components/modules/archived-modules/modal.tsx
@@ -18,7 +18,7 @@ type Props = {
   onSubmit?: () => Promise<void>;
 };
 
-export const ArchiveModuleModal: React.FC<Props> = (props) => {
+export function ArchiveModuleModal(props: Props) {
   const { workspaceSlug, projectId, moduleId, isOpen, handleClose } = props;
   // router
   const router = useAppRouter();
@@ -104,4 +104,4 @@ export const ArchiveModuleModal: React.FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/modules/archived-modules/root.tsx b/apps/web/core/components/modules/archived-modules/root.tsx
index 6598458ad..7b6a054ca 100644
--- a/apps/web/core/components/modules/archived-modules/root.tsx
+++ b/apps/web/core/components/modules/archived-modules/root.tsx
@@ -15,7 +15,7 @@ import { CycleModuleListLayoutLoader } from "@/components/ui/loader/cycle-module
 import { useModule } from "@/hooks/store/use-module";
 import { useModuleFilter } from "@/hooks/store/use-module-filter";
 
-export const ArchivedModuleLayoutRoot: React.FC = observer(() => {
+export const ArchivedModuleLayoutRoot = observer(function ArchivedModuleLayoutRoot() {
   // router
   const { workspaceSlug, projectId } = useParams();
   // plane hooks
diff --git a/apps/web/core/components/modules/archived-modules/view.tsx b/apps/web/core/components/modules/archived-modules/view.tsx
index c66a09764..c2debe3d9 100644
--- a/apps/web/core/components/modules/archived-modules/view.tsx
+++ b/apps/web/core/components/modules/archived-modules/view.tsx
@@ -16,7 +16,7 @@ export interface IArchivedModulesView {
   projectId: string;
 }
 
-export const ArchivedModulesView: FC<IArchivedModulesView> = observer((props) => {
+export const ArchivedModulesView = observer(function ArchivedModulesView(props: IArchivedModulesView) {
   const { workspaceSlug, projectId } = props;
   // store hooks
   const { getFilteredArchivedModuleIds, loader } = useModule();
diff --git a/apps/web/core/components/modules/delete-module-modal.tsx b/apps/web/core/components/modules/delete-module-modal.tsx
index 67be03b34..35294d8a9 100644
--- a/apps/web/core/components/modules/delete-module-modal.tsx
+++ b/apps/web/core/components/modules/delete-module-modal.tsx
@@ -23,7 +23,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const DeleteModuleModal: React.FC<Props> = observer((props) => {
+export const DeleteModuleModal = observer(function DeleteModuleModal(props: Props) {
   const { data, isOpen, onClose } = props;
   // states
   const [isDeleteLoading, setIsDeleteLoading] = useState(false);
diff --git a/apps/web/core/components/modules/dropdowns/filters/lead.tsx b/apps/web/core/components/modules/dropdowns/filters/lead.tsx
index c067e1757..72e24a37c 100644
--- a/apps/web/core/components/modules/dropdowns/filters/lead.tsx
+++ b/apps/web/core/components/modules/dropdowns/filters/lead.tsx
@@ -20,7 +20,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterLead: React.FC<Props> = observer((props: Props) => {
+export const FilterLead = observer(function FilterLead(props: Props) {
   const { appliedFilters, handleUpdate, memberIds, searchQuery } = props;
   // states
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/modules/dropdowns/filters/members.tsx b/apps/web/core/components/modules/dropdowns/filters/members.tsx
index 7f92ef45a..910856741 100644
--- a/apps/web/core/components/modules/dropdowns/filters/members.tsx
+++ b/apps/web/core/components/modules/dropdowns/filters/members.tsx
@@ -20,7 +20,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterMembers: React.FC<Props> = observer((props: Props) => {
+export const FilterMembers = observer(function FilterMembers(props: Props) {
   const { appliedFilters, handleUpdate, memberIds, searchQuery } = props;
   // states
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/modules/dropdowns/filters/root.tsx b/apps/web/core/components/modules/dropdowns/filters/root.tsx
index 510eedac8..615404507 100644
--- a/apps/web/core/components/modules/dropdowns/filters/root.tsx
+++ b/apps/web/core/components/modules/dropdowns/filters/root.tsx
@@ -22,7 +22,7 @@ type Props = {
   isArchived?: boolean;
 };
 
-export const ModuleFiltersSelection: React.FC<Props> = observer((props) => {
+export const ModuleFiltersSelection = observer(function ModuleFiltersSelection(props: Props) {
   const {
     displayFilters,
     filters,
diff --git a/apps/web/core/components/modules/dropdowns/filters/start-date.tsx b/apps/web/core/components/modules/dropdowns/filters/start-date.tsx
index 9d44fb336..8d21cfdeb 100644
--- a/apps/web/core/components/modules/dropdowns/filters/start-date.tsx
+++ b/apps/web/core/components/modules/dropdowns/filters/start-date.tsx
@@ -15,7 +15,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterStartDate: React.FC<Props> = observer((props) => {
+export const FilterStartDate = observer(function FilterStartDate(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
 
   const [previewEnabled, setPreviewEnabled] = useState(true);
diff --git a/apps/web/core/components/modules/dropdowns/filters/status.tsx b/apps/web/core/components/modules/dropdowns/filters/status.tsx
index 50df70673..d6c4f702c 100644
--- a/apps/web/core/components/modules/dropdowns/filters/status.tsx
+++ b/apps/web/core/components/modules/dropdowns/filters/status.tsx
@@ -15,7 +15,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterStatus: React.FC<Props> = observer((props) => {
+export const FilterStatus = observer(function FilterStatus(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
   // states
   const [previewEnabled, setPreviewEnabled] = useState(true);
diff --git a/apps/web/core/components/modules/dropdowns/filters/target-date.tsx b/apps/web/core/components/modules/dropdowns/filters/target-date.tsx
index c3baa8d72..85639c8b2 100644
--- a/apps/web/core/components/modules/dropdowns/filters/target-date.tsx
+++ b/apps/web/core/components/modules/dropdowns/filters/target-date.tsx
@@ -14,7 +14,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterTargetDate: React.FC<Props> = observer((props) => {
+export const FilterTargetDate = observer(function FilterTargetDate(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
 
   const [previewEnabled, setPreviewEnabled] = useState(true);
diff --git a/apps/web/core/components/modules/dropdowns/order-by.tsx b/apps/web/core/components/modules/dropdowns/order-by.tsx
index 5e0b35cd7..32722d991 100644
--- a/apps/web/core/components/modules/dropdowns/order-by.tsx
+++ b/apps/web/core/components/modules/dropdowns/order-by.tsx
@@ -18,7 +18,7 @@ type Props = {
   value: TModuleOrderByOptions | undefined;
 };
 
-export const ModuleOrderByDropdown: React.FC<Props> = (props) => {
+export function ModuleOrderByDropdown(props: Props) {
   const { onChange, value } = props;
   // hooks
   const { t } = useTranslation();
@@ -79,4 +79,4 @@ export const ModuleOrderByDropdown: React.FC<Props> = (props) => {
       )}
     </CustomMenu>
   );
-};
+}
diff --git a/apps/web/core/components/modules/form.tsx b/apps/web/core/components/modules/form.tsx
index 4be31cbb2..2b6452e58 100644
--- a/apps/web/core/components/modules/form.tsx
+++ b/apps/web/core/components/modules/form.tsx
@@ -36,7 +36,7 @@ const defaultValues: Partial<IModule> = {
   member_ids: [],
 };
 
-export const ModuleForm: React.FC<Props> = (props) => {
+export function ModuleForm(props: Props) {
   const { handleFormSubmit, handleClose, status, projectId, setActiveProject, data, isMobile = false } = props;
   // store hooks
   const { projectsWithCreatePermissions } = useUser();
@@ -244,4 +244,4 @@ export const ModuleForm: React.FC<Props> = (props) => {
       </div>
     </form>
   );
-};
+}
diff --git a/apps/web/core/components/modules/gantt-chart/blocks.tsx b/apps/web/core/components/modules/gantt-chart/blocks.tsx
index 6fc10df6d..7acb690c1 100644
--- a/apps/web/core/components/modules/gantt-chart/blocks.tsx
+++ b/apps/web/core/components/modules/gantt-chart/blocks.tsx
@@ -20,7 +20,7 @@ type Props = {
   moduleId: string;
 };
 
-export const ModuleGanttBlock: React.FC<Props> = observer((props) => {
+export const ModuleGanttBlock = observer(function ModuleGanttBlock(props: Props) {
   const { moduleId } = props;
   // router
   const router = useAppRouter();
@@ -69,7 +69,7 @@ export const ModuleGanttBlock: React.FC<Props> = observer((props) => {
   );
 });
 
-export const ModuleGanttSidebarBlock: React.FC<Props> = observer((props) => {
+export const ModuleGanttSidebarBlock = observer(function ModuleGanttSidebarBlock(props: Props) {
   const { moduleId } = props;
   const { workspaceSlug } = useParams();
   // store hooks
diff --git a/apps/web/core/components/modules/gantt-chart/modules-list-layout.tsx b/apps/web/core/components/modules/gantt-chart/modules-list-layout.tsx
index 6e4702ec7..468385239 100644
--- a/apps/web/core/components/modules/gantt-chart/modules-list-layout.tsx
+++ b/apps/web/core/components/modules/gantt-chart/modules-list-layout.tsx
@@ -12,7 +12,7 @@ import { useModule } from "@/hooks/store/use-module";
 import { useModuleFilter } from "@/hooks/store/use-module-filter";
 import { useProject } from "@/hooks/store/use-project";
 
-export const ModulesListGanttChartView: React.FC = observer(() => {
+export const ModulesListGanttChartView = observer(function ModulesListGanttChartView() {
   // router
   const { workspaceSlug, projectId } = useParams();
   // store
diff --git a/apps/web/core/components/modules/links/create-update-modal.tsx b/apps/web/core/components/modules/links/create-update-modal.tsx
index 102b79d74..4733e424d 100644
--- a/apps/web/core/components/modules/links/create-update-modal.tsx
+++ b/apps/web/core/components/modules/links/create-update-modal.tsx
@@ -23,7 +23,7 @@ const defaultValues: ModuleLink = {
   url: "",
 };
 
-export const CreateUpdateModuleLinkModal: FC<Props> = (props) => {
+export function CreateUpdateModuleLinkModal(props: Props) {
   const { isOpen, handleClose, createLink, updateLink, data } = props;
   // form info
   const {
@@ -144,4 +144,4 @@ export const CreateUpdateModuleLinkModal: FC<Props> = (props) => {
       </form>
     </ModalCore>
   );
-};
+}
diff --git a/apps/web/core/components/modules/links/list-item.tsx b/apps/web/core/components/modules/links/list-item.tsx
index 3db6d8498..e31812699 100644
--- a/apps/web/core/components/modules/links/list-item.tsx
+++ b/apps/web/core/components/modules/links/list-item.tsx
@@ -20,7 +20,7 @@ type Props = {
   link: ILinkDetails;
 };
 
-export const ModulesLinksListItem: React.FC<Props> = observer((props) => {
+export const ModulesLinksListItem = observer(function ModulesLinksListItem(props: Props) {
   const { handleDeleteLink, handleEditLink, isEditingAllowed, link } = props;
   // store hooks
   const { getUserDetails } = useMember();
diff --git a/apps/web/core/components/modules/links/list.tsx b/apps/web/core/components/modules/links/list.tsx
index fac215e59..d84fa7c66 100644
--- a/apps/web/core/components/modules/links/list.tsx
+++ b/apps/web/core/components/modules/links/list.tsx
@@ -15,7 +15,7 @@ type Props = {
   moduleId: string;
 };
 
-export const ModuleLinksList: React.FC<Props> = observer((props) => {
+export const ModuleLinksList = observer(function ModuleLinksList(props: Props) {
   const { moduleId, handleDeleteLink, handleEditLink, disabled } = props;
   // store hooks
   const { getModuleById } = useModule();
diff --git a/apps/web/core/components/modules/modal.tsx b/apps/web/core/components/modules/modal.tsx
index d344f472e..33491acb5 100644
--- a/apps/web/core/components/modules/modal.tsx
+++ b/apps/web/core/components/modules/modal.tsx
@@ -36,7 +36,7 @@ const defaultValues: Partial<IModule> = {
   member_ids: [],
 };
 
-export const CreateUpdateModuleModal: React.FC<Props> = observer((props) => {
+export const CreateUpdateModuleModal = observer(function CreateUpdateModuleModal(props: Props) {
   const { isOpen, onClose, data, workspaceSlug, projectId } = props;
   // states
   const [activeProject, setActiveProject] = useState<string | null>(null);
diff --git a/apps/web/core/components/modules/module-card-item.tsx b/apps/web/core/components/modules/module-card-item.tsx
index 6318fb759..baf686ea9 100644
--- a/apps/web/core/components/modules/module-card-item.tsx
+++ b/apps/web/core/components/modules/module-card-item.tsx
@@ -41,7 +41,7 @@ type Props = {
   moduleId: string;
 };
 
-export const ModuleCardItem: React.FC<Props> = observer((props) => {
+export const ModuleCardItem = observer(function ModuleCardItem(props: Props) {
   const { moduleId } = props;
   // refs
   const parentRef = useRef(null);
diff --git a/apps/web/core/components/modules/module-layout-icon.tsx b/apps/web/core/components/modules/module-layout-icon.tsx
index f07d5638b..6b4b83c49 100644
--- a/apps/web/core/components/modules/module-layout-icon.tsx
+++ b/apps/web/core/components/modules/module-layout-icon.tsx
@@ -11,7 +11,7 @@ interface ILayoutIcon {
   withContainer?: boolean;
 }
 
-export const ModuleLayoutIcon: React.FC<ILayoutIcon> = (props) => {
+export function ModuleLayoutIcon(props: ILayoutIcon) {
   const { layoutType, className = "", containerClassName = "", size = 14, withContainer = false } = props;
 
   // get Layout icon
@@ -35,4 +35,4 @@ export const ModuleLayoutIcon: React.FC<ILayoutIcon> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/modules/module-list-item-action.tsx b/apps/web/core/components/modules/module-list-item-action.tsx
index a6a0b34eb..e339676c7 100644
--- a/apps/web/core/components/modules/module-list-item-action.tsx
+++ b/apps/web/core/components/modules/module-list-item-action.tsx
@@ -42,7 +42,7 @@ type Props = {
   parentRef: React.RefObject<HTMLDivElement>;
 };
 
-export const ModuleListItemAction: FC<Props> = observer((props) => {
+export const ModuleListItemAction = observer(function ModuleListItemAction(props: Props) {
   const { moduleId, moduleDetails, parentRef } = props;
   // router
   const { workspaceSlug, projectId } = useParams();
diff --git a/apps/web/core/components/modules/module-list-item.tsx b/apps/web/core/components/modules/module-list-item.tsx
index 705aa8e8a..bd2c40601 100644
--- a/apps/web/core/components/modules/module-list-item.tsx
+++ b/apps/web/core/components/modules/module-list-item.tsx
@@ -21,7 +21,7 @@ type Props = {
   moduleId: string;
 };
 
-export const ModuleListItem: React.FC<Props> = observer((props) => {
+export const ModuleListItem = observer(function ModuleListItem(props: Props) {
   const { moduleId } = props;
   // refs
   const parentRef = useRef(null);
diff --git a/apps/web/core/components/modules/module-peek-overview.tsx b/apps/web/core/components/modules/module-peek-overview.tsx
index 8b54546e1..9c55eb4af 100644
--- a/apps/web/core/components/modules/module-peek-overview.tsx
+++ b/apps/web/core/components/modules/module-peek-overview.tsx
@@ -14,7 +14,11 @@ type Props = {
   isArchived?: boolean;
 };
 
-export const ModulePeekOverview: React.FC<Props> = observer(({ projectId, workspaceSlug, isArchived = false }) => {
+export const ModulePeekOverview = observer(function ModulePeekOverview({
+  projectId,
+  workspaceSlug,
+  isArchived = false,
+}: Props) {
   // router
   const router = useAppRouter();
   const pathname = usePathname();
diff --git a/apps/web/core/components/modules/module-status-dropdown.tsx b/apps/web/core/components/modules/module-status-dropdown.tsx
index c0f193073..f4cb3fcd1 100644
--- a/apps/web/core/components/modules/module-status-dropdown.tsx
+++ b/apps/web/core/components/modules/module-status-dropdown.tsx
@@ -14,7 +14,7 @@ type Props = {
   handleModuleDetailsChange: (payload: Partial<IModule>) => Promise<void>;
 };
 
-export const ModuleStatusDropdown: FC<Props> = observer((props: Props) => {
+export const ModuleStatusDropdown = observer(function ModuleStatusDropdown(props: Props) {
   const { isDisabled, moduleDetails, handleModuleDetailsChange } = props;
   const { t } = useTranslation();
   const moduleStatus = MODULE_STATUS.find((status) => status.value === moduleDetails.status);
diff --git a/apps/web/core/components/modules/module-view-header.tsx b/apps/web/core/components/modules/module-view-header.tsx
index d6b9d652a..81e105c7c 100644
--- a/apps/web/core/components/modules/module-view-header.tsx
+++ b/apps/web/core/components/modules/module-view-header.tsx
@@ -28,7 +28,7 @@ import { usePlatformOS } from "@/hooks/use-platform-os";
 import { ModuleLayoutIcon } from "./module-layout-icon";
 // i18n
 
-export const ModuleViewHeader: FC = observer(() => {
+export const ModuleViewHeader = observer(function ModuleViewHeader() {
   // refs
   const inputRef = useRef<HTMLInputElement>(null);
   // router
diff --git a/apps/web/core/components/modules/modules-list-view.tsx b/apps/web/core/components/modules/modules-list-view.tsx
index 75f83f281..3da71dcc7 100644
--- a/apps/web/core/components/modules/modules-list-view.tsx
+++ b/apps/web/core/components/modules/modules-list-view.tsx
@@ -18,7 +18,7 @@ import { useModule } from "@/hooks/store/use-module";
 import { useModuleFilter } from "@/hooks/store/use-module-filter";
 import { useUserPermissions } from "@/hooks/store/user";
 
-export const ModulesListView: React.FC = observer(() => {
+export const ModulesListView = observer(function ModulesListView() {
   // router
   const { workspaceSlug, projectId } = useParams();
   const searchParams = useSearchParams();
diff --git a/apps/web/core/components/modules/quick-actions.tsx b/apps/web/core/components/modules/quick-actions.tsx
index cc7c470a5..85a8b0175 100644
--- a/apps/web/core/components/modules/quick-actions.tsx
+++ b/apps/web/core/components/modules/quick-actions.tsx
@@ -36,7 +36,7 @@ type Props = {
   customClassName?: string;
 };
 
-export const ModuleQuickActions: React.FC<Props> = observer((props) => {
+export const ModuleQuickActions = observer(function ModuleQuickActions(props: Props) {
   const { parentRef, moduleId, projectId, workspaceSlug, customClassName } = props;
   // router
   const router = useAppRouter();
@@ -161,15 +161,18 @@ export const ModuleQuickActions: React.FC<Props> = observer((props) => {
     },
   ];
 
-  const CONTEXT_MENU_ITEMS: TContextMenuItem[] = MENU_ITEMS.map((item) => ({
-    ...item,
-    onClick: () => {
-      captureClick({
-        elementName: MODULE_TRACKER_ELEMENTS.CONTEXT_MENU,
-      });
-      item.action();
-    },
-  }));
+  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map(function CONTEXT_MENU_ITEMS(item) {
+    return {
+      ...item,
+
+      onClick: () => {
+        captureClick({
+          elementName: MODULE_TRACKER_ELEMENTS.CONTEXT_MENU,
+        });
+        item.action();
+      },
+    };
+  });
 
   return (
     <>
diff --git a/apps/web/core/components/modules/select/status.tsx b/apps/web/core/components/modules/select/status.tsx
index e89fe2f7b..a445c1ca4 100644
--- a/apps/web/core/components/modules/select/status.tsx
+++ b/apps/web/core/components/modules/select/status.tsx
@@ -20,7 +20,7 @@ type Props = {
   tabIndex?: number;
 };
 
-export const ModuleStatusSelect: React.FC<Props> = ({ control, error, tabIndex }) => {
+export function ModuleStatusSelect({ control, error, tabIndex }: Props) {
   const { t } = useTranslation();
   return (
     <Controller
@@ -61,4 +61,4 @@ export const ModuleStatusSelect: React.FC<Props> = ({ control, error, tabIndex }
       }}
     />
   );
-};
+}
diff --git a/apps/web/core/components/modules/sidebar-select/select-status.tsx b/apps/web/core/components/modules/sidebar-select/select-status.tsx
index 83e6cf6dd..0f6083761 100644
--- a/apps/web/core/components/modules/sidebar-select/select-status.tsx
+++ b/apps/web/core/components/modules/sidebar-select/select-status.tsx
@@ -21,7 +21,7 @@ type Props = {
   watch: UseFormWatch<Partial<IModule>>;
 };
 
-export const SidebarStatusSelect: React.FC<Props> = ({ control, submitChanges, watch }) => {
+export function SidebarStatusSelect({ control, submitChanges, watch }: Props) {
   const { t } = useTranslation();
   return (
     <div className="flex flex-wrap items-center py-2">
@@ -65,4 +65,4 @@ export const SidebarStatusSelect: React.FC<Props> = ({ control, submitChanges, w
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/onboarding/create-or-join-workspaces.tsx b/apps/web/core/components/onboarding/create-or-join-workspaces.tsx
index 1472fb087..bd6ece861 100644
--- a/apps/web/core/components/onboarding/create-or-join-workspaces.tsx
+++ b/apps/web/core/components/onboarding/create-or-join-workspaces.tsx
@@ -26,7 +26,7 @@ type Props = {
   finishOnboarding: () => Promise<void>;
 };
 
-export const CreateOrJoinWorkspaces: React.FC<Props> = observer((props) => {
+export const CreateOrJoinWorkspaces = observer(function CreateOrJoinWorkspaces(props: Props) {
   const { invitations, totalSteps, stepChange, finishOnboarding } = props;
   // states
   const [currentView, setCurrentView] = useState<ECreateOrJoinWorkspaceViews | null>(null);
diff --git a/apps/web/core/components/onboarding/create-workspace.tsx b/apps/web/core/components/onboarding/create-workspace.tsx
index 31863a7aa..0c3f1bf49 100644
--- a/apps/web/core/components/onboarding/create-workspace.tsx
+++ b/apps/web/core/components/onboarding/create-workspace.tsx
@@ -34,7 +34,7 @@ type Props = {
 // services
 const workspaceService = new WorkspaceService();
 
-export const CreateWorkspace: React.FC<Props> = observer((props) => {
+export const CreateWorkspace = observer(function CreateWorkspace(props: Props) {
   const { stepChange, user, invitedWorkspaces, handleCurrentViewChange } = props;
   // states
   const [slugError, setSlugError] = useState(false);
diff --git a/apps/web/core/components/onboarding/header.tsx b/apps/web/core/components/onboarding/header.tsx
index fc752e9ce..7ab8bdca2 100644
--- a/apps/web/core/components/onboarding/header.tsx
+++ b/apps/web/core/components/onboarding/header.tsx
@@ -19,7 +19,7 @@ type OnboardingHeaderProps = {
   hasInvitations: boolean;
 };
 
-export const OnboardingHeader: FC<OnboardingHeaderProps> = observer((props) => {
+export const OnboardingHeader = observer(function OnboardingHeader(props: OnboardingHeaderProps) {
   const { currentStep, updateCurrentStep, hasInvitations } = props;
   // store hooks
   const { data: user } = useUser();
diff --git a/apps/web/core/components/onboarding/invitations.tsx b/apps/web/core/components/onboarding/invitations.tsx
index d66af6c39..2a9140ab2 100644
--- a/apps/web/core/components/onboarding/invitations.tsx
+++ b/apps/web/core/components/onboarding/invitations.tsx
@@ -26,7 +26,7 @@ type Props = {
 };
 const workspaceService = new WorkspaceService();
 
-export const Invitations: React.FC<Props> = (props) => {
+export function Invitations(props: Props) {
   const { invitations, handleNextStep, handleCurrentViewChange } = props;
   // states
   const [isJoiningWorkspaces, setIsJoiningWorkspaces] = useState(false);
@@ -138,4 +138,4 @@ export const Invitations: React.FC<Props> = (props) => {
   ) : (
     <div>No Invitations found</div>
   );
-};
+}
diff --git a/apps/web/core/components/onboarding/invite-members.tsx b/apps/web/core/components/onboarding/invite-members.tsx
index 73a734042..a54fb8f23 100644
--- a/apps/web/core/components/onboarding/invite-members.tsx
+++ b/apps/web/core/components/onboarding/invite-members.tsx
@@ -80,7 +80,7 @@ const placeholderEmails = [
   "thomas.selfridge@frstflt.com",
   "albert.zahm@frstflt.com",
 ];
-const InviteMemberInput: React.FC<InviteMemberFormProps> = observer((props) => {
+const InviteMemberInput = observer(function InviteMemberInput(props: InviteMemberFormProps) {
   const {
     control,
     index,
@@ -261,7 +261,7 @@ const InviteMemberInput: React.FC<InviteMemberFormProps> = observer((props) => {
   );
 });
 
-export const InviteMembers: React.FC<Props> = (props) => {
+export function InviteMembers(props: Props) {
   const { finishOnboarding, totalSteps, workspace } = props;
 
   const [isInvitationDisabled, setIsInvitationDisabled] = useState(true);
@@ -417,4 +417,4 @@ export const InviteMembers: React.FC<Props> = (props) => {
       <SwitchAccountDropdown />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/onboarding/profile-setup.tsx b/apps/web/core/components/onboarding/profile-setup.tsx
index 1dc8c716c..088ec6939 100644
--- a/apps/web/core/components/onboarding/profile-setup.tsx
+++ b/apps/web/core/components/onboarding/profile-setup.tsx
@@ -78,7 +78,7 @@ const USER_DOMAIN = [
 
 const authService = new AuthService();
 
-export const ProfileSetup: React.FC<Props> = observer((props) => {
+export const ProfileSetup = observer(function ProfileSetup(props: Props) {
   const { user, totalSteps, stepChange, finishOnboarding } = props;
   // states
   const [profileSetupStep, setProfileSetupStep] = useState<EProfileSetupSteps>(
diff --git a/apps/web/core/components/onboarding/root.tsx b/apps/web/core/components/onboarding/root.tsx
index 37fa6a518..d6c122b5b 100644
--- a/apps/web/core/components/onboarding/root.tsx
+++ b/apps/web/core/components/onboarding/root.tsx
@@ -21,7 +21,7 @@ type Props = {
   invitations?: IWorkspaceMemberInvitation[];
 };
 
-export const OnboardingRoot: FC<Props> = observer(({ invitations = [] }) => {
+export const OnboardingRoot = observer(function OnboardingRoot({ invitations = [] }: Props) {
   const [currentStep, setCurrentStep] = useState<TOnboardingStep>(EOnboardingSteps.PROFILE_SETUP);
   // store hooks
   const { data: user } = useUser();
diff --git a/apps/web/core/components/onboarding/step-indicator.tsx b/apps/web/core/components/onboarding/step-indicator.tsx
index 14533984e..e81b146d0 100644
--- a/apps/web/core/components/onboarding/step-indicator.tsx
+++ b/apps/web/core/components/onboarding/step-indicator.tsx
@@ -7,7 +7,7 @@ interface OnboardingStepIndicatorProps {
   totalSteps: number;
 }
 
-export const OnboardingStepIndicator: React.FC<OnboardingStepIndicatorProps> = ({ currentStep, totalSteps }) => {
+export function OnboardingStepIndicator({ currentStep, totalSteps }: OnboardingStepIndicatorProps) {
   const renderIndicators = () => {
     const indicators = [];
 
@@ -42,4 +42,4 @@ export const OnboardingStepIndicator: React.FC<OnboardingStepIndicatorProps> = (
       <div className="flex items-center justify-center my-0.5 mx-1 w-40 lg:w-52">{renderIndicators()}</div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/onboarding/steps/common/header.tsx b/apps/web/core/components/onboarding/steps/common/header.tsx
index 429becddb..bdee90d6b 100644
--- a/apps/web/core/components/onboarding/steps/common/header.tsx
+++ b/apps/web/core/components/onboarding/steps/common/header.tsx
@@ -7,9 +7,11 @@ type Props = {
   description: string;
 };
 
-export const CommonOnboardingHeader: FC<Props> = ({ title, description }) => (
-  <div className="text-left space-y-2">
-    <h1 className="text-2xl font-semibold text-custom-text-200">{title}</h1>
-    <p className="text-base text-custom-text-300">{description}</p>
-  </div>
-);
+export function CommonOnboardingHeader({ title, description }: Props) {
+  return (
+    <div className="text-left space-y-2">
+      <h1 className="text-2xl font-semibold text-custom-text-200">{title}</h1>
+      <p className="text-base text-custom-text-300">{description}</p>
+    </div>
+  );
+}
diff --git a/apps/web/core/components/onboarding/steps/profile/consent.tsx b/apps/web/core/components/onboarding/steps/profile/consent.tsx
index c66298590..a3531910e 100644
--- a/apps/web/core/components/onboarding/steps/profile/consent.tsx
+++ b/apps/web/core/components/onboarding/steps/profile/consent.tsx
@@ -8,17 +8,19 @@ type Props = {
   handleChange: (checked: boolean) => void;
 };
 
-export const MarketingConsent: FC<Props> = ({ isChecked, handleChange }) => (
-  <div className="flex items-center justify-center gap-1.5">
-    <button
-      type="button"
-      onClick={() => handleChange(!isChecked)}
-      className={`size-4 rounded border-2 flex items-center justify-center ${
-        isChecked ? "bg-custom-primary-100 border-custom-primary-100" : "border-custom-border-300"
-      }`}
-    >
-      {isChecked && <Check className="w-3 h-3 text-white" />}
-    </button>
-    <span className="text-sm text-custom-text-300">I agree to Plane marketing communications</span>
-  </div>
-);
+export function MarketingConsent({ isChecked, handleChange }: Props) {
+  return (
+    <div className="flex items-center justify-center gap-1.5">
+      <button
+        type="button"
+        onClick={() => handleChange(!isChecked)}
+        className={`size-4 rounded border-2 flex items-center justify-center ${
+          isChecked ? "bg-custom-primary-100 border-custom-primary-100" : "border-custom-border-300"
+        }`}
+      >
+        {isChecked && <Check className="w-3 h-3 text-white" />}
+      </button>
+      <span className="text-sm text-custom-text-300">I agree to Plane marketing communications</span>
+    </div>
+  );
+}
diff --git a/apps/web/core/components/onboarding/steps/profile/root.tsx b/apps/web/core/components/onboarding/steps/profile/root.tsx
index e2ad3f3a0..57d19de18 100644
--- a/apps/web/core/components/onboarding/steps/profile/root.tsx
+++ b/apps/web/core/components/onboarding/steps/profile/root.tsx
@@ -51,7 +51,7 @@ const defaultValues: Partial<TProfileSetupFormValues> = {
   has_marketing_email_consent: true,
 };
 
-export const ProfileSetupStep: FC<Props> = observer(({ handleStepChange }) => {
+export const ProfileSetupStep = observer(function ProfileSetupStep({ handleStepChange }: Props) {
   // states
   const [isImageUploadModalOpen, setIsImageUploadModalOpen] = useState(false);
   // store hooks
diff --git a/apps/web/core/components/onboarding/steps/profile/set-password.tsx b/apps/web/core/components/onboarding/steps/profile/set-password.tsx
index ed7a801bb..44305a259 100644
--- a/apps/web/core/components/onboarding/steps/profile/set-password.tsx
+++ b/apps/web/core/components/onboarding/steps/profile/set-password.tsx
@@ -17,11 +17,7 @@ interface SetPasswordRootProps {
   disabled?: boolean;
 }
 
-export const SetPasswordRoot: React.FC<SetPasswordRootProps> = ({
-  onPasswordChange,
-  onConfirmPasswordChange,
-  disabled = false,
-}) => {
+export function SetPasswordRoot({ onPasswordChange, onConfirmPasswordChange, disabled = false }: SetPasswordRootProps) {
   const [isExpanded, setIsExpanded] = useState(false);
   const [passwordState, setPasswordState] = useState<PasswordState>({
     password: "",
@@ -133,4 +129,4 @@ export const SetPasswordRoot: React.FC<SetPasswordRootProps> = ({
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/onboarding/steps/role/root.tsx b/apps/web/core/components/onboarding/steps/role/root.tsx
index 8cf8acb6b..3d86b51b3 100644
--- a/apps/web/core/components/onboarding/steps/role/root.tsx
+++ b/apps/web/core/components/onboarding/steps/role/root.tsx
@@ -37,7 +37,7 @@ const defaultValues = {
   role: "",
 };
 
-export const RoleSetupStep: FC<Props> = observer(({ handleStepChange }) => {
+export const RoleSetupStep = observer(function RoleSetupStep({ handleStepChange }: Props) {
   // store hooks
   const { data: profile, updateUserProfile } = useUserProfile();
   // form info
diff --git a/apps/web/core/components/onboarding/steps/root.tsx b/apps/web/core/components/onboarding/steps/root.tsx
index adb1e80ac..874ac2c30 100644
--- a/apps/web/core/components/onboarding/steps/root.tsx
+++ b/apps/web/core/components/onboarding/steps/root.tsx
@@ -18,7 +18,7 @@ type Props = {
   handleStepChange: (step: EOnboardingSteps, skipInvites?: boolean) => void;
 };
 
-export const OnboardingStepRoot: FC<Props> = (props) => {
+export function OnboardingStepRoot(props: Props) {
   const { currentStep, invitations, handleStepChange } = props;
   // ref for the scrollable container
   const scrollContainerRef = useRef<HTMLDivElement>(null);
@@ -54,4 +54,4 @@ export const OnboardingStepRoot: FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/onboarding/steps/team/root.tsx b/apps/web/core/components/onboarding/steps/team/root.tsx
index ecb880d3a..fb7eee56e 100644
--- a/apps/web/core/components/onboarding/steps/team/root.tsx
+++ b/apps/web/core/components/onboarding/steps/team/root.tsx
@@ -81,7 +81,7 @@ const placeholderEmails = [
   "thomas.selfridge@frstflt.com",
   "albert.zahm@frstflt.com",
 ];
-const InviteMemberInput: React.FC<InviteMemberFormProps> = observer((props) => {
+const InviteMemberInput = observer(function InviteMemberInput(props: InviteMemberFormProps) {
   const {
     control,
     index,
@@ -262,7 +262,7 @@ const InviteMemberInput: React.FC<InviteMemberFormProps> = observer((props) => {
   );
 });
 
-export const InviteTeamStep: React.FC<Props> = observer((props) => {
+export const InviteTeamStep = observer(function InviteTeamStep(props: Props) {
   const { handleStepChange } = props;
 
   const [isInvitationDisabled, setIsInvitationDisabled] = useState(true);
diff --git a/apps/web/core/components/onboarding/steps/usecase/root.tsx b/apps/web/core/components/onboarding/steps/usecase/root.tsx
index 19ba706d0..fd2abd571 100644
--- a/apps/web/core/components/onboarding/steps/usecase/root.tsx
+++ b/apps/web/core/components/onboarding/steps/usecase/root.tsx
@@ -27,7 +27,7 @@ const defaultValues = {
   use_case: "",
 };
 
-export const UseCaseSetupStep: FC<Props> = observer(({ handleStepChange }) => {
+export const UseCaseSetupStep = observer(function UseCaseSetupStep({ handleStepChange }: Props) {
   // store hooks
   const { data: profile, updateUserProfile } = useUserProfile();
   // form info
diff --git a/apps/web/core/components/onboarding/steps/workspace/create.tsx b/apps/web/core/components/onboarding/steps/workspace/create.tsx
index 2419f67ce..7455514cf 100644
--- a/apps/web/core/components/onboarding/steps/workspace/create.tsx
+++ b/apps/web/core/components/onboarding/steps/workspace/create.tsx
@@ -37,282 +37,281 @@ type Props = {
 
 const workspaceService = new WorkspaceService();
 
-export const WorkspaceCreateStep: React.FC<Props> = observer(
-  ({ user, onComplete, handleCurrentViewChange, hasInvitations = false }) => {
-    // states
-    const [slugError, setSlugError] = useState(false);
-    const [invalidSlug, setInvalidSlug] = useState(false);
-    // plane hooks
-    const { t } = useTranslation();
-    // store hooks
-    const { updateUserProfile } = useUserProfile();
-    const { fetchCurrentUserSettings } = useUserSettings();
-    const { createWorkspace, fetchWorkspaces } = useWorkspace();
+export const WorkspaceCreateStep = observer(function WorkspaceCreateStep({
+  user,
+  onComplete,
+  handleCurrentViewChange,
+  hasInvitations = false,
+}: Props) {
+  // states
+  const [slugError, setSlugError] = useState(false);
+  const [invalidSlug, setInvalidSlug] = useState(false);
+  // plane hooks
+  const { t } = useTranslation();
+  // store hooks
+  const { updateUserProfile } = useUserProfile();
+  const { fetchCurrentUserSettings } = useUserSettings();
+  const { createWorkspace, fetchWorkspaces } = useWorkspace();
 
-    const isWorkspaceCreationEnabled = getIsWorkspaceCreationDisabled() === false;
+  const isWorkspaceCreationEnabled = getIsWorkspaceCreationDisabled() === false;
 
-    // form info
-    const {
-      handleSubmit,
-      control,
-      setValue,
-      formState: { errors, isSubmitting, isValid },
-    } = useForm<IWorkspace>({
-      defaultValues: {
-        name: "",
-        slug: "",
-        organization_size: "",
-      },
-      mode: "onChange",
-    });
+  // form info
+  const {
+    handleSubmit,
+    control,
+    setValue,
+    formState: { errors, isSubmitting, isValid },
+  } = useForm<IWorkspace>({
+    defaultValues: {
+      name: "",
+      slug: "",
+      organization_size: "",
+    },
+    mode: "onChange",
+  });
 
-    const handleCreateWorkspace = async (formData: IWorkspace) => {
-      if (isSubmitting) return;
+  const handleCreateWorkspace = async (formData: IWorkspace) => {
+    if (isSubmitting) return;
 
-      await workspaceService
-        .workspaceSlugCheck(formData.slug)
-        .then(async (res) => {
-          if (res.status === true && !RESTRICTED_URLS.includes(formData.slug)) {
-            setSlugError(false);
-            await createWorkspace(formData)
-              .then(async (workspaceResponse) => {
-                setToast({
-                  type: TOAST_TYPE.SUCCESS,
-                  title: t("workspace_creation.toast.success.title"),
-                  message: t("workspace_creation.toast.success.message"),
-                });
-                captureSuccess({
-                  eventName: WORKSPACE_TRACKER_EVENTS.create,
-                  payload: { slug: formData.slug },
-                });
-                await fetchWorkspaces();
-                await completeStep(workspaceResponse.id);
-                onComplete(formData.organization_size === "Just myself");
-              })
-              .catch(() => {
-                captureError({
-                  eventName: WORKSPACE_TRACKER_EVENTS.create,
-                  payload: { slug: formData.slug },
-                  error: new Error("Error creating workspace"),
-                });
-                setToast({
-                  type: TOAST_TYPE.ERROR,
-                  title: t("workspace_creation.toast.error.title"),
-                  message: t("workspace_creation.toast.error.message"),
-                });
+    await workspaceService
+      .workspaceSlugCheck(formData.slug)
+      .then(async (res) => {
+        if (res.status === true && !RESTRICTED_URLS.includes(formData.slug)) {
+          setSlugError(false);
+          await createWorkspace(formData)
+            .then(async (workspaceResponse) => {
+              setToast({
+                type: TOAST_TYPE.SUCCESS,
+                title: t("workspace_creation.toast.success.title"),
+                message: t("workspace_creation.toast.success.message"),
               });
-          } else setSlugError(true);
+              captureSuccess({
+                eventName: WORKSPACE_TRACKER_EVENTS.create,
+                payload: { slug: formData.slug },
+              });
+              await fetchWorkspaces();
+              await completeStep(workspaceResponse.id);
+              onComplete(formData.organization_size === "Just myself");
+            })
+            .catch(() => {
+              captureError({
+                eventName: WORKSPACE_TRACKER_EVENTS.create,
+                payload: { slug: formData.slug },
+                error: new Error("Error creating workspace"),
+              });
+              setToast({
+                type: TOAST_TYPE.ERROR,
+                title: t("workspace_creation.toast.error.title"),
+                message: t("workspace_creation.toast.error.message"),
+              });
+            });
+        } else setSlugError(true);
+      })
+      .catch(() =>
+        setToast({
+          type: TOAST_TYPE.ERROR,
+          title: t("workspace_creation.toast.error.title"),
+          message: t("workspace_creation.toast.error.message"),
         })
-        .catch(() =>
-          setToast({
-            type: TOAST_TYPE.ERROR,
-            title: t("workspace_creation.toast.error.title"),
-            message: t("workspace_creation.toast.error.message"),
-          })
-        );
-    };
-
-    const completeStep = async (workspaceId: string) => {
-      if (!user) return;
-      await updateUserProfile({
-        last_workspace_id: workspaceId,
-      });
-      await fetchCurrentUserSettings();
-    };
-
-    const isButtonDisabled = !isValid || invalidSlug || isSubmitting;
-
-    if (!isWorkspaceCreationEnabled) {
-      return (
-        <div className="flex flex-col gap-10">
-          <span className="text-center text-base text-custom-text-300">
-            You don&apos;t seem to have any invites to a workspace and your instance admin has restricted creation of
-            new workspaces. Please ask a workspace owner or admin to invite you to a workspace first and come back to
-            this screen to join.
-          </span>
-        </div>
       );
-    }
-    return (
-      <form className="flex flex-col gap-10" onSubmit={handleSubmit(handleCreateWorkspace)}>
-        <CommonOnboardingHeader title="Create your workspace" description="All your work — unified." />
+  };
 
-        <div className="flex flex-col gap-8">
-          <div className="flex flex-col gap-2">
-            <label
-              className="text-sm text-custom-text-300 font-medium after:content-['*'] after:ml-0.5 after:text-red-500"
-              htmlFor="name"
-            >
-              {t("workspace_creation.form.name.label")}
-            </label>
-            <Controller
-              control={control}
-              name="name"
-              rules={{
-                required: t("common.errors.required"),
-                validate: (value) =>
-                  /^[\w\s-]*$/.test(value) || t("workspace_creation.errors.validation.name_alphanumeric"),
-                maxLength: {
-                  value: 80,
-                  message: t("workspace_creation.errors.validation.name_length"),
-                },
-              }}
-              render={({ field: { value, ref, onChange } }) => (
-                <div className="relative flex items-center rounded-md">
-                  <input
-                    id="name"
-                    name="name"
-                    type="text"
-                    value={value}
-                    onChange={(event) => {
-                      onChange(event.target.value);
-                      setValue("name", event.target.value);
-                      setValue("slug", event.target.value.toLocaleLowerCase().trim().replace(/ /g, "-"), {
-                        shouldValidate: true,
-                      });
-                    }}
-                    placeholder="Enter workspace name"
-                    ref={ref}
-                    className={cn(
-                      "w-full px-3 py-2 text-custom-text-200 border border-custom-border-300 rounded-md bg-custom-background-100 focus:outline-none focus:ring-2 focus:ring-custom-primary-100 placeholder:text-custom-text-400 focus:border-transparent transition-all duration-200",
-                      {
-                        "border-custom-border-300": !errors.name,
-                        "border-red-500": errors.name,
-                      }
-                    )}
-                    autoFocus
-                  />
-                </div>
-              )}
-            />
-            {errors.name && <span className="text-sm text-red-500">{errors.name.message}</span>}
-          </div>
-          <div className="flex flex-col gap-2">
-            <label
-              className="text-sm text-custom-text-300 font-medium after:content-['*'] after:ml-0.5 after:text-red-500"
-              htmlFor="slug"
-            >
-              {t("workspace_creation.form.url.label")}
-            </label>
-            <Controller
-              control={control}
-              name="slug"
-              rules={{
-                required: t("common.errors.required"),
-                maxLength: {
-                  value: 48,
-                  message: t("workspace_creation.errors.validation.url_length"),
-                },
-              }}
-              render={({ field: { value, ref, onChange } }) => (
-                <div
+  const completeStep = async (workspaceId: string) => {
+    if (!user) return;
+    await updateUserProfile({
+      last_workspace_id: workspaceId,
+    });
+    await fetchCurrentUserSettings();
+  };
+
+  const isButtonDisabled = !isValid || invalidSlug || isSubmitting;
+
+  if (!isWorkspaceCreationEnabled) {
+    return (
+      <div className="flex flex-col gap-10">
+        <span className="text-center text-base text-custom-text-300">
+          You don&apos;t seem to have any invites to a workspace and your instance admin has restricted creation of new
+          workspaces. Please ask a workspace owner or admin to invite you to a workspace first and come back to this
+          screen to join.
+        </span>
+      </div>
+    );
+  }
+  return (
+    <form className="flex flex-col gap-10" onSubmit={handleSubmit(handleCreateWorkspace)}>
+      <CommonOnboardingHeader title="Create your workspace" description="All your work — unified." />
+      <div className="flex flex-col gap-8">
+        <div className="flex flex-col gap-2">
+          <label
+            className="text-sm text-custom-text-300 font-medium after:content-['*'] after:ml-0.5 after:text-red-500"
+            htmlFor="name"
+          >
+            {t("workspace_creation.form.name.label")}
+          </label>
+          <Controller
+            control={control}
+            name="name"
+            rules={{
+              required: t("common.errors.required"),
+              validate: (value) =>
+                /^[\w\s-]*$/.test(value) || t("workspace_creation.errors.validation.name_alphanumeric"),
+              maxLength: {
+                value: 80,
+                message: t("workspace_creation.errors.validation.name_length"),
+              },
+            }}
+            render={({ field: { value, ref, onChange } }) => (
+              <div className="relative flex items-center rounded-md">
+                <input
+                  id="name"
+                  name="name"
+                  type="text"
+                  value={value}
+                  onChange={(event) => {
+                    onChange(event.target.value);
+                    setValue("name", event.target.value);
+                    setValue("slug", event.target.value.toLocaleLowerCase().trim().replace(/ /g, "-"), {
+                      shouldValidate: true,
+                    });
+                  }}
+                  placeholder="Enter workspace name"
+                  ref={ref}
                   className={cn(
-                    "flex items-center w-full px-3 py-2 text-custom-text-200 border border-custom-border-300 rounded-md bg-custom-background-100 focus:outline-none focus:ring-2 focus:ring-custom-primary-100 focus:border-transparent transition-all duration-200",
+                    "w-full px-3 py-2 text-custom-text-200 border border-custom-border-300 rounded-md bg-custom-background-100 focus:outline-none focus:ring-2 focus:ring-custom-primary-100 placeholder:text-custom-text-400 focus:border-transparent transition-all duration-200",
                     {
                       "border-custom-border-300": !errors.name,
                       "border-red-500": errors.name,
                     }
                   )}
-                >
-                  <span className={cn("pr-0 text-custom-text-200 rounded-md whitespace-nowrap")}>
-                    {window && window.location.host}/
-                  </span>
-                  <input
-                    id="slug"
-                    name="slug"
-                    type="text"
-                    value={value.toLocaleLowerCase().trim().replace(/ /g, "-")}
-                    onChange={(e) => {
-                      if (/^[a-zA-Z0-9_-]+$/.test(e.target.value)) setInvalidSlug(false);
-                      else setInvalidSlug(true);
-                      onChange(e.target.value.toLowerCase());
-                    }}
-                    ref={ref}
-                    placeholder={t("workspace_creation.form.url.placeholder")}
-                    className={cn(
-                      "w-full px-3 py-0 pl-0 text-custom-text-200 border-none ring-none outline-none rounded-md bg-custom-background-100 placeholder:text-custom-text-400"
-                    )}
-                  />
+                  autoFocus
+                />
+              </div>
+            )}
+          />
+          {errors.name && <span className="text-sm text-red-500">{errors.name.message}</span>}
+        </div>
+        <div className="flex flex-col gap-2">
+          <label
+            className="text-sm text-custom-text-300 font-medium after:content-['*'] after:ml-0.5 after:text-red-500"
+            htmlFor="slug"
+          >
+            {t("workspace_creation.form.url.label")}
+          </label>
+          <Controller
+            control={control}
+            name="slug"
+            rules={{
+              required: t("common.errors.required"),
+              maxLength: {
+                value: 48,
+                message: t("workspace_creation.errors.validation.url_length"),
+              },
+            }}
+            render={({ field: { value, ref, onChange } }) => (
+              <div
+                className={cn(
+                  "flex items-center w-full px-3 py-2 text-custom-text-200 border border-custom-border-300 rounded-md bg-custom-background-100 focus:outline-none focus:ring-2 focus:ring-custom-primary-100 focus:border-transparent transition-all duration-200",
+                  {
+                    "border-custom-border-300": !errors.name,
+                    "border-red-500": errors.name,
+                  }
+                )}
+              >
+                <span className={cn("pr-0 text-custom-text-200 rounded-md whitespace-nowrap")}>
+                  {window && window.location.host}/
+                </span>
+                <input
+                  id="slug"
+                  name="slug"
+                  type="text"
+                  value={value.toLocaleLowerCase().trim().replace(/ /g, "-")}
+                  onChange={(e) => {
+                    if (/^[a-zA-Z0-9_-]+$/.test(e.target.value)) setInvalidSlug(false);
+                    else setInvalidSlug(true);
+                    onChange(e.target.value.toLowerCase());
+                  }}
+                  ref={ref}
+                  placeholder={t("workspace_creation.form.url.placeholder")}
+                  className={cn(
+                    "w-full px-3 py-0 pl-0 text-custom-text-200 border-none ring-none outline-none rounded-md bg-custom-background-100 placeholder:text-custom-text-400"
+                  )}
+                />
+              </div>
+            )}
+          />
+          <p className="text-sm text-custom-text-300">{t("workspace_creation.form.url.edit_slug")}</p>
+          {slugError && (
+            <p className="-mt-3 text-sm text-red-500">{t("workspace_creation.errors.validation.url_already_taken")}</p>
+          )}
+          {invalidSlug && (
+            <p className="text-sm text-red-500">{t("workspace_creation.errors.validation.url_alphanumeric")}</p>
+          )}
+          {errors.slug && <span className="text-sm text-red-500">{errors.slug.message}</span>}
+        </div>
+        <div className="flex flex-col gap-2">
+          <label
+            className="text-sm text-custom-text-300 font-medium after:content-['*'] after:ml-0.5 after:text-red-500"
+            htmlFor="organization_size"
+          >
+            {t("workspace_creation.form.organization_size.label")}
+          </label>
+          <div className="w-full">
+            <Controller
+              name="organization_size"
+              control={control}
+              rules={{ required: t("common.errors.required") }}
+              render={({ field: { value, onChange } }) => (
+                <div className="flex flex-wrap gap-3">
+                  {ORGANIZATION_SIZE.map((size) => {
+                    const isSelected = value === size;
+                    return (
+                      <button
+                        key={size}
+                        onClick={(e) => {
+                          e.preventDefault();
+                          e.stopPropagation();
+                          onChange(size);
+                        }}
+                        className={`text-sm px-3 py-2 rounded-lg border transition-all duration-200 flex gap-1 items-center justify-between ${
+                          isSelected
+                            ? "border-custom-border-200 bg-custom-background-80 text-custom-text-200"
+                            : "border-custom-border-200 hover:border-custom-border-300 text-custom-text-300"
+                        }`}
+                      >
+                        <CircleCheck
+                          className={cn("size-4 text-custom-text-400", isSelected && "text-custom-text-200")}
+                        />
+
+                        <span className="font-medium">{size}</span>
+                      </button>
+                    );
+                  })}
                 </div>
               )}
             />
-            <p className="text-sm text-custom-text-300">{t("workspace_creation.form.url.edit_slug")}</p>
-            {slugError && (
-              <p className="-mt-3 text-sm text-red-500">
-                {t("workspace_creation.errors.validation.url_already_taken")}
-              </p>
+            {errors.organization_size && (
+              <span className="text-sm text-red-500">{errors.organization_size.message}</span>
             )}
-            {invalidSlug && (
-              <p className="text-sm text-red-500">{t("workspace_creation.errors.validation.url_alphanumeric")}</p>
-            )}
-            {errors.slug && <span className="text-sm text-red-500">{errors.slug.message}</span>}
-          </div>
-          <div className="flex flex-col gap-2">
-            <label
-              className="text-sm text-custom-text-300 font-medium after:content-['*'] after:ml-0.5 after:text-red-500"
-              htmlFor="organization_size"
-            >
-              {t("workspace_creation.form.organization_size.label")}
-            </label>
-            <div className="w-full">
-              <Controller
-                name="organization_size"
-                control={control}
-                rules={{ required: t("common.errors.required") }}
-                render={({ field: { value, onChange } }) => (
-                  <div className="flex flex-wrap gap-3">
-                    {ORGANIZATION_SIZE.map((size) => {
-                      const isSelected = value === size;
-                      return (
-                        <button
-                          key={size}
-                          onClick={(e) => {
-                            e.preventDefault();
-                            e.stopPropagation();
-                            onChange(size);
-                          }}
-                          className={`text-sm px-3 py-2 rounded-lg border transition-all duration-200 flex gap-1 items-center justify-between ${
-                            isSelected
-                              ? "border-custom-border-200 bg-custom-background-80 text-custom-text-200"
-                              : "border-custom-border-200 hover:border-custom-border-300 text-custom-text-300"
-                          }`}
-                        >
-                          <CircleCheck
-                            className={cn("size-4 text-custom-text-400", isSelected && "text-custom-text-200")}
-                          />
-
-                          <span className="font-medium">{size}</span>
-                        </button>
-                      );
-                    })}
-                  </div>
-                )}
-              />
-              {errors.organization_size && (
-                <span className="text-sm text-red-500">{errors.organization_size.message}</span>
-              )}
-            </div>
           </div>
         </div>
-
-        <div className="flex flex-col gap-4">
-          <Button
-            data-ph-element={WORKSPACE_TRACKER_ELEMENTS.ONBOARDING_CREATE_WORKSPACE_BUTTON}
-            variant="primary"
-            type="submit"
-            size="lg"
-            className="w-full"
-            disabled={isButtonDisabled}
-          >
-            {isSubmitting ? <Spinner height="20px" width="20px" /> : t("workspace_creation.button.default")}
+      </div>
+      <div className="flex flex-col gap-4">
+        <Button
+          data-ph-element={WORKSPACE_TRACKER_ELEMENTS.ONBOARDING_CREATE_WORKSPACE_BUTTON}
+          variant="primary"
+          type="submit"
+          size="lg"
+          className="w-full"
+          disabled={isButtonDisabled}
+        >
+          {isSubmitting ? <Spinner height="20px" width="20px" /> : t("workspace_creation.button.default")}
+        </Button>
+        {hasInvitations && (
+          <Button variant="link-neutral" size="lg" className="w-full" onClick={handleCurrentViewChange}>
+            Join existing workspace
           </Button>
-          {hasInvitations && (
-            <Button variant="link-neutral" size="lg" className="w-full" onClick={handleCurrentViewChange}>
-              Join existing workspace
-            </Button>
-          )}
-        </div>
-      </form>
-    );
-  }
-);
+        )}
+      </div>
+    </form>
+  );
+});
diff --git a/apps/web/core/components/onboarding/steps/workspace/join-invites.tsx b/apps/web/core/components/onboarding/steps/workspace/join-invites.tsx
index 70d0c6b61..e9da88f1e 100644
--- a/apps/web/core/components/onboarding/steps/workspace/join-invites.tsx
+++ b/apps/web/core/components/onboarding/steps/workspace/join-invites.tsx
@@ -26,7 +26,7 @@ type Props = {
 };
 const workspaceService = new WorkspaceService();
 
-export const WorkspaceJoinInvitesStep: React.FC<Props> = (props) => {
+export function WorkspaceJoinInvitesStep(props: Props) {
   const { invitations, handleNextStep, handleCurrentViewChange } = props;
   // states
   const [isJoiningWorkspaces, setIsJoiningWorkspaces] = useState(false);
@@ -134,4 +134,4 @@ export const WorkspaceJoinInvitesStep: React.FC<Props> = (props) => {
   ) : (
     <div>No Invitations found</div>
   );
-};
+}
diff --git a/apps/web/core/components/onboarding/steps/workspace/root.tsx b/apps/web/core/components/onboarding/steps/workspace/root.tsx
index 949d84e67..b7cd69749 100644
--- a/apps/web/core/components/onboarding/steps/workspace/root.tsx
+++ b/apps/web/core/components/onboarding/steps/workspace/root.tsx
@@ -15,7 +15,7 @@ type Props = {
   handleStepChange: (step: EOnboardingSteps, skipInvites?: boolean) => void;
 };
 
-export const WorkspaceSetupStep: React.FC<Props> = observer(({ invitations, handleStepChange }) => {
+export const WorkspaceSetupStep = observer(function WorkspaceSetupStep({ invitations, handleStepChange }: Props) {
   // states
   const [currentView, setCurrentView] = useState<ECreateOrJoinWorkspaceViews | null>(null);
   // store hooks
diff --git a/apps/web/core/components/onboarding/switch-account-dropdown.tsx b/apps/web/core/components/onboarding/switch-account-dropdown.tsx
index 48770f135..b6daa46e7 100644
--- a/apps/web/core/components/onboarding/switch-account-dropdown.tsx
+++ b/apps/web/core/components/onboarding/switch-account-dropdown.tsx
@@ -16,7 +16,7 @@ type TSwitchAccountDropdownProps = {
   fullName?: string;
 };
 
-export const SwitchAccountDropdown: FC<TSwitchAccountDropdownProps> = observer((props) => {
+export const SwitchAccountDropdown = observer(function SwitchAccountDropdown(props: TSwitchAccountDropdownProps) {
   const { fullName } = props;
   // states
   const [showSwitchAccountModal, setShowSwitchAccountModal] = useState(false);
diff --git a/apps/web/core/components/onboarding/switch-account-modal.tsx b/apps/web/core/components/onboarding/switch-account-modal.tsx
index 180e2aff2..6f5a20b73 100644
--- a/apps/web/core/components/onboarding/switch-account-modal.tsx
+++ b/apps/web/core/components/onboarding/switch-account-modal.tsx
@@ -17,7 +17,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const SwitchAccountModal: React.FC<Props> = (props) => {
+export function SwitchAccountModal(props: Props) {
   const { isOpen, onClose } = props;
   // states
   const [switchingAccount, setSwitchingAccount] = useState(false);
@@ -111,4 +111,4 @@ export const SwitchAccountModal: React.FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/onboarding/tour/root.tsx b/apps/web/core/components/onboarding/tour/root.tsx
index cd074a168..18fb9adb4 100644
--- a/apps/web/core/components/onboarding/tour/root.tsx
+++ b/apps/web/core/components/onboarding/tour/root.tsx
@@ -77,7 +77,7 @@ const TOUR_STEPS: {
   },
 ];
 
-export const TourRoot: React.FC<Props> = observer((props) => {
+export const TourRoot = observer(function TourRoot(props: Props) {
   const { onComplete } = props;
   // states
   const [step, setStep] = useState<TTourSteps>("welcome");
diff --git a/apps/web/core/components/onboarding/tour/sidebar.tsx b/apps/web/core/components/onboarding/tour/sidebar.tsx
index 61462ea44..f234c7b93 100644
--- a/apps/web/core/components/onboarding/tour/sidebar.tsx
+++ b/apps/web/core/components/onboarding/tour/sidebar.tsx
@@ -42,29 +42,31 @@ type Props = {
   setStep: React.Dispatch<React.SetStateAction<TTourSteps>>;
 };
 
-export const TourSidebar: React.FC<Props> = ({ step, setStep }) => (
-  <div className="col-span-3 hidden bg-custom-background-90 p-8 lg:block">
-    <h3 className="text-lg font-medium">
-      Let{"'"}s get started!
-      <br />
-      Get more out of Plane.
-    </h3>
-    <div className="mt-8 space-y-5">
-      {sidebarOptions.map((option) => (
-        <h5
-          key={option.key}
-          className={`flex cursor-pointer items-center gap-2 border-l-[3px] py-0.5 pl-3 pr-2 text-sm font-medium capitalize ${
-            step === option.key
-              ? "border-custom-primary-100 text-custom-primary-100"
-              : "border-transparent text-custom-text-200"
-          }`}
-          onClick={() => setStep(option.key)}
-          role="button"
-        >
-          <option.Icon className="h-4 w-4" aria-hidden="true" />
-          {option.label}
-        </h5>
-      ))}
+export function TourSidebar({ step, setStep }: Props) {
+  return (
+    <div className="col-span-3 hidden bg-custom-background-90 p-8 lg:block">
+      <h3 className="text-lg font-medium">
+        Let{"'"}s get started!
+        <br />
+        Get more out of Plane.
+      </h3>
+      <div className="mt-8 space-y-5">
+        {sidebarOptions.map((option) => (
+          <h5
+            key={option.key}
+            className={`flex cursor-pointer items-center gap-2 border-l-[3px] py-0.5 pl-3 pr-2 text-sm font-medium capitalize ${
+              step === option.key
+                ? "border-custom-primary-100 text-custom-primary-100"
+                : "border-transparent text-custom-text-200"
+            }`}
+            onClick={() => setStep(option.key)}
+            role="button"
+          >
+            <option.Icon className="h-4 w-4" aria-hidden="true" />
+            {option.label}
+          </h5>
+        ))}
+      </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/pages/dropdowns/actions.tsx b/apps/web/core/components/pages/dropdowns/actions.tsx
index bf71af469..7b1e3006d 100644
--- a/apps/web/core/components/pages/dropdowns/actions.tsx
+++ b/apps/web/core/components/pages/dropdowns/actions.tsx
@@ -61,7 +61,7 @@ type Props = {
   storeType: EPageStoreType;
 };
 
-export const PageActions: React.FC<Props> = observer((props) => {
+export const PageActions = observer(function PageActions(props: Props) {
   const { extraOptions, optionsOrder, page, parentRef, storeType } = props;
   // states
   const [deletePageModal, setDeletePageModal] = useState(false);
@@ -89,7 +89,7 @@ export const PageActions: React.FC<Props> = observer((props) => {
     canCurrentUserMovePage,
   } = page;
   // menu items
-  const MENU_ITEMS: (TContextMenuItem & { key: TPageActions })[] = useMemo(() => {
+  const MENU_ITEMS = useMemo(function MENU_ITEMS() {
     const menuItems: (TContextMenuItem & { key: TPageActions })[] = [
       {
         key: "toggle-lock",
@@ -177,20 +177,7 @@ export const PageActions: React.FC<Props> = observer((props) => {
       menuItems.push(...extraOptions);
     }
     return menuItems;
-  }, [
-    access,
-    archived_at,
-    extraOptions,
-    is_locked,
-    isMovePageEnabled,
-    canCurrentUserArchivePage,
-    canCurrentUserChangeAccess,
-    canCurrentUserDeletePage,
-    canCurrentUserDuplicatePage,
-    canCurrentUserLockPage,
-    canCurrentUserMovePage,
-    pageOperations,
-  ]);
+  });
   // arrange options
   const arrangedOptions = useMemo(
     () =>
diff --git a/apps/web/core/components/pages/editor/editor-body.tsx b/apps/web/core/components/pages/editor/editor-body.tsx
index a69d8c194..3ff6055a4 100644
--- a/apps/web/core/components/pages/editor/editor-body.tsx
+++ b/apps/web/core/components/pages/editor/editor-body.tsx
@@ -64,7 +64,7 @@ type Props = {
   extendedEditorProps: TExtendedEditorExtensionsConfig;
 };
 
-export const PageEditorBody: React.FC<Props> = observer((props) => {
+export const PageEditorBody = observer(function PageEditorBody(props: Props) {
   const {
     config,
     editorForwardRef,
diff --git a/apps/web/core/components/pages/editor/header/logo-picker.tsx b/apps/web/core/components/pages/editor/header/logo-picker.tsx
index 6ad966e0d..11cbc46c0 100644
--- a/apps/web/core/components/pages/editor/header/logo-picker.tsx
+++ b/apps/web/core/components/pages/editor/header/logo-picker.tsx
@@ -11,7 +11,7 @@ type Props = {
   page: TPageInstance;
 };
 
-export const PageEditorHeaderLogoPicker: React.FC<Props> = observer((props) => {
+export const PageEditorHeaderLogoPicker = observer(function PageEditorHeaderLogoPicker(props: Props) {
   const { className, page } = props;
   // states
   const [isLogoPickerOpen, setIsLogoPickerOpen] = useState(false);
diff --git a/apps/web/core/components/pages/editor/header/root.tsx b/apps/web/core/components/pages/editor/header/root.tsx
index 12fb604ac..cbb9b1eb3 100644
--- a/apps/web/core/components/pages/editor/header/root.tsx
+++ b/apps/web/core/components/pages/editor/header/root.tsx
@@ -14,7 +14,7 @@ type Props = {
   projectId?: string;
 };
 
-export const PageEditorHeaderRoot: React.FC<Props> = observer((props) => {
+export const PageEditorHeaderRoot = observer(function PageEditorHeaderRoot(props: Props) {
   const { page } = props;
   // states
   const [isLogoPickerOpen, setIsLogoPickerOpen] = useState(false);
diff --git a/apps/web/core/components/pages/editor/page-root.tsx b/apps/web/core/components/pages/editor/page-root.tsx
index d8ca1ebb2..aa4c9a73d 100644
--- a/apps/web/core/components/pages/editor/page-root.tsx
+++ b/apps/web/core/components/pages/editor/page-root.tsx
@@ -41,7 +41,7 @@ type TPageRootProps = {
   workspaceSlug: string;
 };
 
-export const PageRoot = observer((props: TPageRootProps) => {
+export const PageRoot = observer(function PageRoot(props: TPageRootProps) {
   const { config, handlers, page, projectId, storeType, webhookConnectionParams, workspaceSlug } = props;
   // states
   const [editorReady, setEditorReady] = useState(false);
diff --git a/apps/web/core/components/pages/editor/summary/content-browser.tsx b/apps/web/core/components/pages/editor/summary/content-browser.tsx
index 50aeda7b7..ebfb22bf4 100644
--- a/apps/web/core/components/pages/editor/summary/content-browser.tsx
+++ b/apps/web/core/components/pages/editor/summary/content-browser.tsx
@@ -14,7 +14,7 @@ type Props = {
   showOutline?: boolean;
 };
 
-export const PageContentBrowser: React.FC<Props> = (props) => {
+export function PageContentBrowser(props: Props) {
   const { className, editorRef, emptyState, setSidePeekVisible, showOutline = false } = props;
   // states
   const [headings, setHeadings] = useState<IMarking[]>([]);
@@ -79,4 +79,4 @@ export const PageContentBrowser: React.FC<Props> = (props) => {
       })}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/pages/editor/summary/heading-components.tsx b/apps/web/core/components/pages/editor/summary/heading-components.tsx
index eb99c470b..e02df4100 100644
--- a/apps/web/core/components/pages/editor/summary/heading-components.tsx
+++ b/apps/web/core/components/pages/editor/summary/heading-components.tsx
@@ -10,20 +10,26 @@ export type THeadingComponentProps = {
 const COMMON_CLASSNAME =
   "flex-shrink-0 w-full py-1 text-left font-medium text-custom-text-300 hover:text-custom-primary-100 truncate transition-colors";
 
-export const OutlineHeading1 = ({ marking, onClick }: THeadingComponentProps) => (
-  <button type="button" onClick={onClick} className={cn(COMMON_CLASSNAME, "text-sm pl-1")}>
-    {marking.text}
-  </button>
-);
+export function OutlineHeading1({ marking, onClick }: THeadingComponentProps) {
+  return (
+    <button type="button" onClick={onClick} className={cn(COMMON_CLASSNAME, "text-sm pl-1")}>
+      {marking.text}
+    </button>
+  );
+}
 
-export const OutlineHeading2 = ({ marking, onClick }: THeadingComponentProps) => (
-  <button type="button" onClick={onClick} className={cn(COMMON_CLASSNAME, "text-xs pl-2")}>
-    {marking.text}
-  </button>
-);
+export function OutlineHeading2({ marking, onClick }: THeadingComponentProps) {
+  return (
+    <button type="button" onClick={onClick} className={cn(COMMON_CLASSNAME, "text-xs pl-2")}>
+      {marking.text}
+    </button>
+  );
+}
 
-export const OutlineHeading3 = ({ marking, onClick }: THeadingComponentProps) => (
-  <button type="button" onClick={onClick} className={cn(COMMON_CLASSNAME, "text-xs pl-4")}>
-    {marking.text}
-  </button>
-);
+export function OutlineHeading3({ marking, onClick }: THeadingComponentProps) {
+  return (
+    <button type="button" onClick={onClick} className={cn(COMMON_CLASSNAME, "text-xs pl-4")}>
+      {marking.text}
+    </button>
+  );
+}
diff --git a/apps/web/core/components/pages/editor/title.tsx b/apps/web/core/components/pages/editor/title.tsx
index fc5c7b4ff..7390ef012 100644
--- a/apps/web/core/components/pages/editor/title.tsx
+++ b/apps/web/core/components/pages/editor/title.tsx
@@ -18,7 +18,7 @@ type Props = {
   updateTitle: (title: string) => void;
 };
 
-export const PageEditorTitle: React.FC<Props> = observer((props) => {
+export const PageEditorTitle = observer(function PageEditorTitle(props: Props) {
   const { editorRef, readOnly, title, updateTitle } = props;
   // states
   const [isLengthVisible, setIsLengthVisible] = useState(false);
diff --git a/apps/web/core/components/pages/editor/toolbar/color-dropdown.tsx b/apps/web/core/components/pages/editor/toolbar/color-dropdown.tsx
index e2fbe1bd8..419a76bc1 100644
--- a/apps/web/core/components/pages/editor/toolbar/color-dropdown.tsx
+++ b/apps/web/core/components/pages/editor/toolbar/color-dropdown.tsx
@@ -20,7 +20,7 @@ type Props = {
   ) => boolean;
 };
 
-export const ColorDropdown: React.FC<Props> = memo((props) => {
+export const ColorDropdown = memo(function ColorDropdown(props: Props) {
   const { handleColorSelect, isColorActive } = props;
 
   const activeTextColor = COLORS_LIST.find((c) => isColorActive("text-color", c.key));
diff --git a/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx b/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx
index 6dbe26a2c..077405123 100644
--- a/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx
+++ b/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx
@@ -28,7 +28,7 @@ type Props = {
   storeType: EPageStoreType;
 };
 
-export const PageOptionsDropdown: React.FC<Props> = observer((props) => {
+export const PageOptionsDropdown = observer(function PageOptionsDropdown(props: Props) {
   const { page, storeType } = props;
   // states
   const [isExportModalOpen, setIsExportModalOpen] = useState(false);
@@ -45,8 +45,8 @@ export const PageOptionsDropdown: React.FC<Props> = observer((props) => {
   // query params
   const { updateQueryParams } = useQueryParams();
   // menu items list
-  const EXTRA_MENU_OPTIONS: (TContextMenuItem & { key: TPageActions })[] = useMemo(
-    () => [
+  const EXTRA_MENU_OPTIONS = useMemo(function EXTRA_MENU_OPTIONS() {
+    return [
       {
         key: "full-screen",
         action: () => handleFullWidth(!isFullWidth),
@@ -108,18 +108,8 @@ export const PageOptionsDropdown: React.FC<Props> = observer((props) => {
         icon: ArrowUpToLine,
         shouldRender: true,
       },
-    ],
-    [
-      editorRef,
-      handleFullWidth,
-      handleStickyToolbar,
-      isContentEditable,
-      isFullWidth,
-      isStickyToolbarEnabled,
-      router,
-      updateQueryParams,
-    ]
-  );
+    ];
+  });
 
   return (
     <>
diff --git a/apps/web/core/components/pages/editor/toolbar/root.tsx b/apps/web/core/components/pages/editor/toolbar/root.tsx
index 8bddef805..a7f972961 100644
--- a/apps/web/core/components/pages/editor/toolbar/root.tsx
+++ b/apps/web/core/components/pages/editor/toolbar/root.tsx
@@ -19,7 +19,7 @@ type Props = {
   page: TPageInstance;
 };
 
-export const PageEditorToolbarRoot: React.FC<Props> = observer((props) => {
+export const PageEditorToolbarRoot = observer(function PageEditorToolbarRoot(props: Props) {
   const { handleOpenNavigationPane, isNavigationPaneOpen, page } = props;
   // translation
   const { t } = useTranslation();
diff --git a/apps/web/core/components/pages/editor/toolbar/toolbar.tsx b/apps/web/core/components/pages/editor/toolbar/toolbar.tsx
index 71baffebf..25fca8ec9 100644
--- a/apps/web/core/components/pages/editor/toolbar/toolbar.tsx
+++ b/apps/web/core/components/pages/editor/toolbar/toolbar.tsx
@@ -24,7 +24,7 @@ type ToolbarButtonProps = {
   executeCommand: EditorRefApi["executeMenuItemCommand"];
 };
 
-const ToolbarButton: React.FC<ToolbarButtonProps> = React.memo((props) => {
+const ToolbarButton = React.memo(function ToolbarButton(props: ToolbarButtonProps) {
   const { item, isActive, executeCommand } = props;
 
   return (
@@ -67,7 +67,7 @@ ToolbarButton.displayName = "ToolbarButton";
 
 const toolbarItems = TOOLBAR_ITEMS.document;
 
-export const PageToolbar: React.FC<Props> = (props) => {
+export function PageToolbar(props: Props) {
   const { editorRef } = props;
   // states
   const [activeStates, setActiveStates] = useState<Record<string, boolean>>({});
@@ -165,4 +165,4 @@ export const PageToolbar: React.FC<Props> = (props) => {
       ))}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/pages/header/actions.tsx b/apps/web/core/components/pages/header/actions.tsx
index 6da331520..8d90fc4fb 100644
--- a/apps/web/core/components/pages/header/actions.tsx
+++ b/apps/web/core/components/pages/header/actions.tsx
@@ -21,7 +21,7 @@ type Props = {
   storeType: EPageStoreType;
 };
 
-export const PageHeaderActions: React.FC<Props> = observer((props) => {
+export const PageHeaderActions = observer(function PageHeaderActions(props: Props) {
   const { page, storeType } = props;
 
   return (
diff --git a/apps/web/core/components/pages/header/archived-badge.tsx b/apps/web/core/components/pages/header/archived-badge.tsx
index 34e812eb9..48843c3f3 100644
--- a/apps/web/core/components/pages/header/archived-badge.tsx
+++ b/apps/web/core/components/pages/header/archived-badge.tsx
@@ -9,7 +9,7 @@ type Props = {
   page: TPageInstance;
 };
 
-export const PageArchivedBadge = observer(({ page }: Props) => {
+export const PageArchivedBadge = observer(function PageArchivedBadge({ page }: Props) {
   if (!page.archived_at) return null;
 
   return (
diff --git a/apps/web/core/components/pages/header/copy-link-control.tsx b/apps/web/core/components/pages/header/copy-link-control.tsx
index 50c853cc6..f2d50139d 100644
--- a/apps/web/core/components/pages/header/copy-link-control.tsx
+++ b/apps/web/core/components/pages/header/copy-link-control.tsx
@@ -9,7 +9,7 @@ type Props = {
   page: TPageInstance;
 };
 
-export const PageCopyLinkControl = observer(({ page }: Props) => {
+export const PageCopyLinkControl = observer(function PageCopyLinkControl({ page }: Props) {
   // page operations
   const { pageOperations } = usePageOperations({
     page,
diff --git a/apps/web/core/components/pages/header/favorite-control.tsx b/apps/web/core/components/pages/header/favorite-control.tsx
index 723ee28fc..643278740 100644
--- a/apps/web/core/components/pages/header/favorite-control.tsx
+++ b/apps/web/core/components/pages/header/favorite-control.tsx
@@ -14,7 +14,7 @@ type Props = {
   page: TPageInstance;
 };
 
-export const PageFavoriteControl = observer(({ page }: Props) => {
+export const PageFavoriteControl = observer(function PageFavoriteControl({ page }: Props) {
   // derived values
   const { is_favorite, canCurrentUserFavoritePage } = page;
   // page operations
diff --git a/apps/web/core/components/pages/header/offline-badge.tsx b/apps/web/core/components/pages/header/offline-badge.tsx
index 88cac49a3..7a8728b41 100644
--- a/apps/web/core/components/pages/header/offline-badge.tsx
+++ b/apps/web/core/components/pages/header/offline-badge.tsx
@@ -10,7 +10,7 @@ type Props = {
   page: TPageInstance;
 };
 
-export const PageOfflineBadge = observer(({ page }: Props) => {
+export const PageOfflineBadge = observer(function PageOfflineBadge({ page }: Props) {
   // use online status
   const { isOnline } = useOnlineStatus();
 
diff --git a/apps/web/core/components/pages/header/root.tsx b/apps/web/core/components/pages/header/root.tsx
index 6f9b0c3a6..1dc01cc9b 100644
--- a/apps/web/core/components/pages/header/root.tsx
+++ b/apps/web/core/components/pages/header/root.tsx
@@ -27,7 +27,7 @@ type Props = {
   workspaceSlug: string;
 };
 
-export const PagesListHeaderRoot: React.FC<Props> = observer((props) => {
+export const PagesListHeaderRoot = observer(function PagesListHeaderRoot(props: Props) {
   const { pageType, projectId, storeType, workspaceSlug } = props;
   const { t } = useTranslation();
   // store hooks
diff --git a/apps/web/core/components/pages/list/applied-filters/root.tsx b/apps/web/core/components/pages/list/applied-filters/root.tsx
index 3f71495e7..b65b9af8a 100644
--- a/apps/web/core/components/pages/list/applied-filters/root.tsx
+++ b/apps/web/core/components/pages/list/applied-filters/root.tsx
@@ -18,7 +18,7 @@ type Props = {
 const MEMBERS_FILTERS = ["created_by"];
 const DATE_FILTERS = ["created_at"];
 
-export const PageAppliedFiltersList: React.FC<Props> = (props) => {
+export function PageAppliedFiltersList(props: Props) {
   const { appliedFilters, handleClearAllFilters, handleRemoveFilter, alwaysAllowEditing } = props;
   const { t } = useTranslation();
 
@@ -76,4 +76,4 @@ export const PageAppliedFiltersList: React.FC<Props> = (props) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/pages/list/block-item-action.tsx b/apps/web/core/components/pages/list/block-item-action.tsx
index 3969e7363..9ca7c3e4d 100644
--- a/apps/web/core/components/pages/list/block-item-action.tsx
+++ b/apps/web/core/components/pages/list/block-item-action.tsx
@@ -27,7 +27,7 @@ type Props = {
   storeType: EPageStoreType;
 };
 
-export const BlockItemAction: FC<Props> = observer((props) => {
+export const BlockItemAction = observer(function BlockItemAction(props: Props) {
   const { page, parentRef, storeType } = props;
   // store hooks
   const { getUserDetails } = useMember();
diff --git a/apps/web/core/components/pages/list/block.tsx b/apps/web/core/components/pages/list/block.tsx
index c03d349fd..762c87de4 100644
--- a/apps/web/core/components/pages/list/block.tsx
+++ b/apps/web/core/components/pages/list/block.tsx
@@ -21,7 +21,7 @@ type TPageListBlock = {
   storeType: EPageStoreType;
 };
 
-export const PageListBlock: FC<TPageListBlock> = observer((props) => {
+export const PageListBlock = observer(function PageListBlock(props: TPageListBlock) {
   const { pageId, storeType } = props;
   // refs
   const parentRef = useRef(null);
diff --git a/apps/web/core/components/pages/list/filters/root.tsx b/apps/web/core/components/pages/list/filters/root.tsx
index 7e9c0f3c4..f9c0930bf 100644
--- a/apps/web/core/components/pages/list/filters/root.tsx
+++ b/apps/web/core/components/pages/list/filters/root.tsx
@@ -15,7 +15,7 @@ type Props = {
   memberIds?: string[] | undefined;
 };
 
-export const PageFiltersSelection: React.FC<Props> = observer((props) => {
+export const PageFiltersSelection = observer(function PageFiltersSelection(props: Props) {
   const { filters, handleFiltersUpdate, memberIds } = props;
   // states
   const [filtersSearchQuery, setFiltersSearchQuery] = useState("");
diff --git a/apps/web/core/components/pages/list/order-by.tsx b/apps/web/core/components/pages/list/order-by.tsx
index 0fc883354..54cf87f7d 100644
--- a/apps/web/core/components/pages/list/order-by.tsx
+++ b/apps/web/core/components/pages/list/order-by.tsx
@@ -25,7 +25,7 @@ const PAGE_SORTING_KEY_OPTIONS: {
   { key: "updated_at", label: "Date modified" },
 ];
 
-export const PageOrderByDropdown: React.FC<Props> = (props) => {
+export function PageOrderByDropdown(props: Props) {
   const { onChange, sortBy, sortKey } = props;
 
   const orderByDetails = PAGE_SORTING_KEY_OPTIONS.find((option) => sortKey === option.key);
@@ -85,4 +85,4 @@ export const PageOrderByDropdown: React.FC<Props> = (props) => {
       </CustomMenu.MenuItem>
     </CustomMenu>
   );
-};
+}
diff --git a/apps/web/core/components/pages/list/root.tsx b/apps/web/core/components/pages/list/root.tsx
index 2ed9f6791..28f9e8ca8 100644
--- a/apps/web/core/components/pages/list/root.tsx
+++ b/apps/web/core/components/pages/list/root.tsx
@@ -15,7 +15,7 @@ type TPagesListRoot = {
   storeType: EPageStoreType;
 };
 
-export const PagesListRoot: FC<TPagesListRoot> = observer((props) => {
+export const PagesListRoot = observer(function PagesListRoot(props: TPagesListRoot) {
   const { pageType, storeType } = props;
   // store hooks
   const { getCurrentProjectFilteredPageIdsByTab } = usePageStore(storeType);
diff --git a/apps/web/core/components/pages/list/search-input.tsx b/apps/web/core/components/pages/list/search-input.tsx
index c3c1db6f0..d01155b88 100644
--- a/apps/web/core/components/pages/list/search-input.tsx
+++ b/apps/web/core/components/pages/list/search-input.tsx
@@ -12,7 +12,7 @@ type Props = {
   updateSearchQuery: (val: string) => void;
 };
 
-export const PageSearchInput: FC<Props> = (props) => {
+export function PageSearchInput(props: Props) {
   const { searchQuery, updateSearchQuery } = props;
   // states
   const [isSearchOpen, setIsSearchOpen] = useState(false);
@@ -83,4 +83,4 @@ export const PageSearchInput: FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/pages/list/tab-navigation.tsx b/apps/web/core/components/pages/list/tab-navigation.tsx
index c2cf4bff4..f4e6aff08 100644
--- a/apps/web/core/components/pages/list/tab-navigation.tsx
+++ b/apps/web/core/components/pages/list/tab-navigation.tsx
@@ -27,7 +27,7 @@ const pageTabs: { key: TPageNavigationTabs; label: string }[] = [
   },
 ];
 
-export const PageTabNavigation: FC<TPageTabNavigation> = (props) => {
+export function PageTabNavigation(props: TPageTabNavigation) {
   const { workspaceSlug, projectId, pageType } = props;
 
   const handleTabClick = (e: React.MouseEvent<HTMLAnchorElement>, tabKey: TPageNavigationTabs) => {
@@ -58,4 +58,4 @@ export const PageTabNavigation: FC<TPageTabNavigation> = (props) => {
       ))}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/pages/loaders/page-content-loader.tsx b/apps/web/core/components/pages/loaders/page-content-loader.tsx
index 2e00bdc6a..464ae7014 100644
--- a/apps/web/core/components/pages/loaders/page-content-loader.tsx
+++ b/apps/web/core/components/pages/loaders/page-content-loader.tsx
@@ -8,7 +8,7 @@ type Props = {
   className?: string;
 };
 
-export const PageContentLoader = (props: Props) => {
+export function PageContentLoader(props: Props) {
   const { className } = props;
 
   return (
@@ -82,4 +82,4 @@ export const PageContentLoader = (props: Props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/pages/loaders/page-loader.tsx b/apps/web/core/components/pages/loaders/page-loader.tsx
index 43d8d915d..90bb08a99 100644
--- a/apps/web/core/components/pages/loaders/page-loader.tsx
+++ b/apps/web/core/components/pages/loaders/page-loader.tsx
@@ -3,7 +3,7 @@
 import { range } from "lodash-es";
 import { Loader } from "@plane/ui";
 
-export const PageLoader: React.FC = (props) => {
+export function PageLoader(props) {
   const {} = props;
 
   return (
@@ -32,4 +32,4 @@ export const PageLoader: React.FC = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/pages/modals/create-page-modal.tsx b/apps/web/core/components/pages/modals/create-page-modal.tsx
index 33e547551..f398be341 100644
--- a/apps/web/core/components/pages/modals/create-page-modal.tsx
+++ b/apps/web/core/components/pages/modals/create-page-modal.tsx
@@ -25,7 +25,7 @@ type Props = {
   storeType: EPageStoreType;
 };
 
-export const CreatePageModal: FC<Props> = (props) => {
+export function CreatePageModal(props: Props) {
   const {
     workspaceSlug,
     projectId,
@@ -96,4 +96,4 @@ export const CreatePageModal: FC<Props> = (props) => {
       />
     </ModalCore>
   );
-};
+}
diff --git a/apps/web/core/components/pages/modals/delete-page-modal.tsx b/apps/web/core/components/pages/modals/delete-page-modal.tsx
index c40614dfe..ed92c671b 100644
--- a/apps/web/core/components/pages/modals/delete-page-modal.tsx
+++ b/apps/web/core/components/pages/modals/delete-page-modal.tsx
@@ -24,7 +24,7 @@ type TConfirmPageDeletionProps = {
   storeType: EPageStoreType;
 };
 
-export const DeletePageModal: React.FC<TConfirmPageDeletionProps> = observer((props) => {
+export const DeletePageModal = observer(function DeletePageModal(props: TConfirmPageDeletionProps) {
   const { isOpen, onClose, page, storeType } = props;
   // states
   const [isDeleting, setIsDeleting] = useState(false);
diff --git a/apps/web/core/components/pages/modals/export-page-modal.tsx b/apps/web/core/components/pages/modals/export-page-modal.tsx
index 390bfce1b..d9b0b1e56 100644
--- a/apps/web/core/components/pages/modals/export-page-modal.tsx
+++ b/apps/web/core/components/pages/modals/export-page-modal.tsx
@@ -97,7 +97,7 @@ const defaultValues: TFormValues = {
   content_variety: "everything",
 };
 
-export const ExportPageModal: React.FC<Props> = (props) => {
+export function ExportPageModal(props: Props) {
   const { editorRef, isOpen, onClose, pageTitle } = props;
   // states
   const [isExporting, setIsExporting] = useState(false);
@@ -288,4 +288,4 @@ export const ExportPageModal: React.FC<Props> = (props) => {
       </div>
     </ModalCore>
   );
-};
+}
diff --git a/apps/web/core/components/pages/modals/page-form.tsx b/apps/web/core/components/pages/modals/page-form.tsx
index 5f1d383f8..074128a8c 100644
--- a/apps/web/core/components/pages/modals/page-form.tsx
+++ b/apps/web/core/components/pages/modals/page-form.tsx
@@ -34,7 +34,7 @@ const PAGE_ACCESS_SPECIFIERS: {
   { key: EPageAccess.PRIVATE, i18n_label: "common.access.private", icon: Lock },
 ];
 
-export const PageForm: React.FC<Props> = (props) => {
+export function PageForm(props: Props) {
   const { formData, handleFormData, handleModalClose, handleFormSubmit } = props;
   // hooks
   const { isMobile } = usePlatformOS();
@@ -154,4 +154,4 @@ export const PageForm: React.FC<Props> = (props) => {
       </div>
     </form>
   );
-};
+}
diff --git a/apps/web/core/components/pages/navigation-pane/root.tsx b/apps/web/core/components/pages/navigation-pane/root.tsx
index 29088f832..47f9abdee 100644
--- a/apps/web/core/components/pages/navigation-pane/root.tsx
+++ b/apps/web/core/components/pages/navigation-pane/root.tsx
@@ -36,7 +36,7 @@ type Props = {
   storeType: EPageStoreType;
 };
 
-export const PageNavigationPaneRoot: React.FC<Props> = observer((props) => {
+export const PageNavigationPaneRoot = observer(function PageNavigationPaneRoot(props: Props) {
   const { handleClose, isNavigationPaneOpen, page, versionHistory, extensions = [], storeType } = props;
 
   // navigation
@@ -52,7 +52,7 @@ export const PageNavigationPaneRoot: React.FC<Props> = observer((props) => {
   const selectedIndex = PAGE_NAVIGATION_PANE_TAB_KEYS.indexOf(activeTab);
 
   // Check if any extension is currently active based on query parameters
-  const ActiveExtension = extensions.find((extension) => {
+  const ActiveExtension = extensions.find(function ActiveExtension(extension) {
     const paneTabValue = searchParams.get(PAGE_NAVIGATION_PANE_TABS_QUERY_PARAM);
     const hasVersionParam = searchParams.get(PAGE_NAVIGATION_PANE_VERSION_QUERY_PARAM);
 
diff --git a/apps/web/core/components/pages/navigation-pane/tab-panels/assets.tsx b/apps/web/core/components/pages/navigation-pane/tab-panels/assets.tsx
index aa23e10de..c4279cdfa 100644
--- a/apps/web/core/components/pages/navigation-pane/tab-panels/assets.tsx
+++ b/apps/web/core/components/pages/navigation-pane/tab-panels/assets.tsx
@@ -22,7 +22,7 @@ type AssetItemProps = {
   page: TPageInstance;
 };
 
-const AssetItem = observer((props: AssetItemProps) => {
+const AssetItem = observer(function AssetItem(props: AssetItemProps) {
   const { asset, page } = props;
   // navigation
   const { workspaceSlug } = useParams();
@@ -101,7 +101,7 @@ const AssetItem = observer((props: AssetItemProps) => {
   );
 });
 
-export const PageNavigationPaneAssetsTabPanel: React.FC<Props> = observer((props) => {
+export const PageNavigationPaneAssetsTabPanel = observer(function PageNavigationPaneAssetsTabPanel(props: Props) {
   const { page } = props;
   // derived values
   const {
diff --git a/apps/web/core/components/pages/navigation-pane/tab-panels/info/actors-info.tsx b/apps/web/core/components/pages/navigation-pane/tab-panels/info/actors-info.tsx
index dcd5221ea..ccd5c1c7e 100644
--- a/apps/web/core/components/pages/navigation-pane/tab-panels/info/actors-info.tsx
+++ b/apps/web/core/components/pages/navigation-pane/tab-panels/info/actors-info.tsx
@@ -14,7 +14,7 @@ type Props = {
   page: TPageInstance;
 };
 
-export const PageNavigationPaneInfoTabActorsInfo: React.FC<Props> = observer((props) => {
+export const PageNavigationPaneInfoTabActorsInfo = observer(function PageNavigationPaneInfoTabActorsInfo(props: Props) {
   const { page } = props;
   // navigation
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/pages/navigation-pane/tab-panels/info/document-info.tsx b/apps/web/core/components/pages/navigation-pane/tab-panels/info/document-info.tsx
index dd23835c5..c05b70353 100644
--- a/apps/web/core/components/pages/navigation-pane/tab-panels/info/document-info.tsx
+++ b/apps/web/core/components/pages/navigation-pane/tab-panels/info/document-info.tsx
@@ -17,7 +17,9 @@ const DEFAULT_DOCUMENT_INFO: TDocumentInfo = {
   paragraphs: 0,
 };
 
-export const PageNavigationPaneInfoTabDocumentInfo: React.FC<Props> = observer((props) => {
+export const PageNavigationPaneInfoTabDocumentInfo = observer(function PageNavigationPaneInfoTabDocumentInfo(
+  props: Props
+) {
   const { page } = props;
   // states
   const [documentInfo, setDocumentInfo] = useState<TDocumentInfo>(DEFAULT_DOCUMENT_INFO);
diff --git a/apps/web/core/components/pages/navigation-pane/tab-panels/info/root.tsx b/apps/web/core/components/pages/navigation-pane/tab-panels/info/root.tsx
index 54aaffb6f..dd222c9ea 100644
--- a/apps/web/core/components/pages/navigation-pane/tab-panels/info/root.tsx
+++ b/apps/web/core/components/pages/navigation-pane/tab-panels/info/root.tsx
@@ -13,7 +13,7 @@ type Props = {
   versionHistory: Pick<TPageRootHandlers, "fetchAllVersions" | "fetchVersionDetails">;
 };
 
-export const PageNavigationPaneInfoTabPanel: React.FC<Props> = observer((props) => {
+export const PageNavigationPaneInfoTabPanel = observer(function PageNavigationPaneInfoTabPanel(props: Props) {
   const { page, versionHistory } = props;
 
   return (
diff --git a/apps/web/core/components/pages/navigation-pane/tab-panels/info/version-history.tsx b/apps/web/core/components/pages/navigation-pane/tab-panels/info/version-history.tsx
index c6c6860ab..0231ff022 100644
--- a/apps/web/core/components/pages/navigation-pane/tab-panels/info/version-history.tsx
+++ b/apps/web/core/components/pages/navigation-pane/tab-panels/info/version-history.tsx
@@ -29,7 +29,7 @@ type VersionHistoryItemProps = {
   version: TPageVersion;
 };
 
-const VersionHistoryItem = observer((props: VersionHistoryItemProps) => {
+const VersionHistoryItem = observer(function VersionHistoryItem(props: VersionHistoryItemProps) {
   const { getVersionLink, isVersionActive, version } = props;
   // store hooks
   const { getUserDetails } = useMember();
@@ -68,7 +68,9 @@ const VersionHistoryItem = observer((props: VersionHistoryItemProps) => {
   );
 });
 
-export const PageNavigationPaneInfoTabVersionHistory: React.FC<Props> = observer((props) => {
+export const PageNavigationPaneInfoTabVersionHistory = observer(function PageNavigationPaneInfoTabVersionHistory(
+  props: Props
+) {
   const { page, versionHistory } = props;
   // navigation
   const searchParams = useSearchParams();
diff --git a/apps/web/core/components/pages/navigation-pane/tab-panels/outline.tsx b/apps/web/core/components/pages/navigation-pane/tab-panels/outline.tsx
index eb9a8251a..adae3ab5d 100644
--- a/apps/web/core/components/pages/navigation-pane/tab-panels/outline.tsx
+++ b/apps/web/core/components/pages/navigation-pane/tab-panels/outline.tsx
@@ -9,7 +9,7 @@ type Props = {
   page: TPageInstance;
 };
 
-export const PageNavigationPaneOutlineTabPanel: React.FC<Props> = (props) => {
+export function PageNavigationPaneOutlineTabPanel(props: Props) {
   const { page } = props;
   // derived values
   const {
@@ -25,4 +25,4 @@ export const PageNavigationPaneOutlineTabPanel: React.FC<Props> = (props) => {
       />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/pages/navigation-pane/tab-panels/root.tsx b/apps/web/core/components/pages/navigation-pane/tab-panels/root.tsx
index 6c4b4f28c..aba1a0444 100644
--- a/apps/web/core/components/pages/navigation-pane/tab-panels/root.tsx
+++ b/apps/web/core/components/pages/navigation-pane/tab-panels/root.tsx
@@ -17,7 +17,7 @@ type Props = {
   versionHistory: Pick<TPageRootHandlers, "fetchAllVersions" | "fetchVersionDetails">;
 };
 
-export const PageNavigationPaneTabPanelsRoot: React.FC<Props> = (props) => {
+export function PageNavigationPaneTabPanelsRoot(props: Props) {
   const { page, versionHistory } = props;
 
   return (
@@ -36,4 +36,4 @@ export const PageNavigationPaneTabPanelsRoot: React.FC<Props> = (props) => {
       ))}
     </Tab.Panels>
   );
-};
+}
diff --git a/apps/web/core/components/pages/navigation-pane/tabs-list.tsx b/apps/web/core/components/pages/navigation-pane/tabs-list.tsx
index bf4383216..bbe9b6578 100644
--- a/apps/web/core/components/pages/navigation-pane/tabs-list.tsx
+++ b/apps/web/core/components/pages/navigation-pane/tabs-list.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from "@plane/i18n";
 // plane web components
 import { ORDERED_PAGE_NAVIGATION_TABS_LIST } from "@/plane-web/components/pages/navigation-pane";
 
-export const PageNavigationPaneTabsList = () => {
+export function PageNavigationPaneTabsList() {
   // translation
   const { t } = useTranslation();
 
@@ -34,4 +34,4 @@ export const PageNavigationPaneTabsList = () => {
       )}
     </Tab.List>
   );
-};
+}
diff --git a/apps/web/core/components/pages/pages-list-main-content.tsx b/apps/web/core/components/pages/pages-list-main-content.tsx
index 1746973a9..26112f79b 100644
--- a/apps/web/core/components/pages/pages-list-main-content.tsx
+++ b/apps/web/core/components/pages/pages-list-main-content.tsx
@@ -28,7 +28,7 @@ type Props = {
   storeType: EPageStoreType;
 };
 
-export const PagesListMainContent: React.FC<Props> = observer((props) => {
+export const PagesListMainContent = observer(function PagesListMainContent(props: Props) {
   const { children, pageType, storeType } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/pages/pages-list-view.tsx b/apps/web/core/components/pages/pages-list-view.tsx
index 4223c540a..15f114f46 100644
--- a/apps/web/core/components/pages/pages-list-view.tsx
+++ b/apps/web/core/components/pages/pages-list-view.tsx
@@ -16,7 +16,7 @@ type TPageView = {
   workspaceSlug: string;
 };
 
-export const PagesListView: React.FC<TPageView> = observer((props) => {
+export const PagesListView = observer(function PagesListView(props: TPageView) {
   const { children, pageType, projectId, storeType, workspaceSlug } = props;
   // store hooks
   const { isAnyPageAvailable, fetchPagesList } = usePageStore(storeType);
diff --git a/apps/web/core/components/pages/version/editor.tsx b/apps/web/core/components/pages/version/editor.tsx
index 0bf851b81..27a594566 100644
--- a/apps/web/core/components/pages/version/editor.tsx
+++ b/apps/web/core/components/pages/version/editor.tsx
@@ -19,7 +19,7 @@ export type TVersionEditorProps = {
   storeType: EPageStoreType;
 };
 
-export const PagesVersionEditor: React.FC<TVersionEditorProps> = observer((props) => {
+export const PagesVersionEditor = observer(function PagesVersionEditor(props: TVersionEditorProps) {
   const { activeVersion, versionDetails } = props;
   // params
   const { workspaceSlug, projectId } = useParams();
diff --git a/apps/web/core/components/pages/version/main-content.tsx b/apps/web/core/components/pages/version/main-content.tsx
index 3000960bb..28d1c1901 100644
--- a/apps/web/core/components/pages/version/main-content.tsx
+++ b/apps/web/core/components/pages/version/main-content.tsx
@@ -23,7 +23,7 @@ type Props = {
   storeType: EPageStoreType;
 };
 
-export const PageVersionsMainContent: React.FC<Props> = observer((props) => {
+export const PageVersionsMainContent = observer(function PageVersionsMainContent(props: Props) {
   const {
     activeVersion,
     editorComponent,
diff --git a/apps/web/core/components/pages/version/root.tsx b/apps/web/core/components/pages/version/root.tsx
index 8d0180c90..c6ae300c6 100644
--- a/apps/web/core/components/pages/version/root.tsx
+++ b/apps/web/core/components/pages/version/root.tsx
@@ -22,7 +22,7 @@ type Props = {
   storeType: EPageStoreType;
 };
 
-export const PageVersionsOverlay: React.FC<Props> = observer((props) => {
+export const PageVersionsOverlay = observer(function PageVersionsOverlay(props: Props) {
   const { editorComponent, fetchVersionDetails, handleRestore, pageId, restoreEnabled, storeType } = props;
   // navigation
   const router = useRouter();
diff --git a/apps/web/core/components/power-k/global-shortcuts.tsx b/apps/web/core/components/power-k/global-shortcuts.tsx
index 5eb7e1618..33070c4d4 100644
--- a/apps/web/core/components/power-k/global-shortcuts.tsx
+++ b/apps/web/core/components/power-k/global-shortcuts.tsx
@@ -21,7 +21,7 @@ type GlobalShortcutsProps = {
  * Global shortcuts component - sets up keyboard listeners and context detection
  * Should be mounted once at the app root level
  */
-export const GlobalShortcutsProvider = observer((props: GlobalShortcutsProps) => {
+export const GlobalShortcutsProvider = observer(function GlobalShortcutsProvider(props: GlobalShortcutsProps) {
   const { context, commands } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/power-k/menus/builder.tsx b/apps/web/core/components/power-k/menus/builder.tsx
index 988658ce6..70f549f8d 100644
--- a/apps/web/core/components/power-k/menus/builder.tsx
+++ b/apps/web/core/components/power-k/menus/builder.tsx
@@ -19,7 +19,7 @@ type Props<T> = {
   emptyText?: string;
 };
 
-export const PowerKMenuBuilder = <T,>({
+export function PowerKMenuBuilder<T>({
   heading,
   items,
   onSelect,
@@ -30,7 +30,7 @@ export const PowerKMenuBuilder = <T,>({
   getValue,
   isSelected,
   emptyText,
-}: Props<T>) => {
+}: Props<T>) {
   if (items.length === 0) return <PowerKMenuEmptyState emptyText={emptyText} />;
 
   return (
@@ -48,4 +48,4 @@ export const PowerKMenuBuilder = <T,>({
       ))}
     </Command.Group>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/menus/cycles.tsx b/apps/web/core/components/power-k/menus/cycles.tsx
index 51b2085fb..16878c44f 100644
--- a/apps/web/core/components/power-k/menus/cycles.tsx
+++ b/apps/web/core/components/power-k/menus/cycles.tsx
@@ -14,15 +14,17 @@ type Props = {
   value?: string | null;
 };
 
-export const PowerKCyclesMenu: React.FC<Props> = observer(({ cycles, onSelect, value }) => (
-  <PowerKMenuBuilder
-    items={cycles}
-    getIcon={() => ContrastIcon}
-    getKey={(cycle) => cycle.id}
-    getValue={(cycle) => cycle.name}
-    getLabel={(cycle) => cycle.name}
-    isSelected={(cycle) => value === cycle.id}
-    onSelect={onSelect}
-    emptyText="No cycles found"
-  />
-));
+export const PowerKCyclesMenu = observer(function PowerKCyclesMenu({ cycles, onSelect, value }: Props) {
+  return (
+    <PowerKMenuBuilder
+      items={cycles}
+      getIcon={() => ContrastIcon}
+      getKey={(cycle) => cycle.id}
+      getValue={(cycle) => cycle.name}
+      getLabel={(cycle) => cycle.name}
+      isSelected={(cycle) => value === cycle.id}
+      onSelect={onSelect}
+      emptyText="No cycles found"
+    />
+  );
+});
diff --git a/apps/web/core/components/power-k/menus/empty-state.tsx b/apps/web/core/components/power-k/menus/empty-state.tsx
index 9ee4bd8e6..e6ca8210e 100644
--- a/apps/web/core/components/power-k/menus/empty-state.tsx
+++ b/apps/web/core/components/power-k/menus/empty-state.tsx
@@ -4,6 +4,6 @@ type Props = {
   emptyText?: string;
 };
 
-export const PowerKMenuEmptyState: React.FC<Props> = ({ emptyText = "No results found" }) => (
-  <div className="px-3 py-8 text-center text-sm text-custom-text-300">{emptyText}</div>
-);
+export function PowerKMenuEmptyState({ emptyText = "No results found" }: Props) {
+  return <div className="px-3 py-8 text-center text-sm text-custom-text-300">{emptyText}</div>;
+}
diff --git a/apps/web/core/components/power-k/menus/labels.tsx b/apps/web/core/components/power-k/menus/labels.tsx
index 632507002..be3956157 100644
--- a/apps/web/core/components/power-k/menus/labels.tsx
+++ b/apps/web/core/components/power-k/menus/labels.tsx
@@ -13,19 +13,21 @@ type Props = {
   value?: string[];
 };
 
-export const PowerKLabelsMenu: React.FC<Props> = observer(({ labels, onSelect, value }) => (
-  <PowerKMenuBuilder
-    items={labels}
-    getIconNode={(label) => (
-      <span className="shrink-0 size-3.5 grid place-items-center">
-        <span className="size-2.5 rounded-full" style={{ backgroundColor: label.color }} />
-      </span>
-    )}
-    getKey={(label) => label.id}
-    getValue={(label) => label.name}
-    getLabel={(label) => label.name}
-    isSelected={(label) => !!value?.includes(label.id)}
-    onSelect={onSelect}
-    emptyText="No labels found"
-  />
-));
+export const PowerKLabelsMenu = observer(function PowerKLabelsMenu({ labels, onSelect, value }: Props) {
+  return (
+    <PowerKMenuBuilder
+      items={labels}
+      getIconNode={(label) => (
+        <span className="shrink-0 size-3.5 grid place-items-center">
+          <span className="size-2.5 rounded-full" style={{ backgroundColor: label.color }} />
+        </span>
+      )}
+      getKey={(label) => label.id}
+      getValue={(label) => label.name}
+      getLabel={(label) => label.name}
+      isSelected={(label) => !!value?.includes(label.id)}
+      onSelect={onSelect}
+      emptyText="No labels found"
+    />
+  );
+});
diff --git a/apps/web/core/components/power-k/menus/members.tsx b/apps/web/core/components/power-k/menus/members.tsx
index 54b349898..0e4aa2cfb 100644
--- a/apps/web/core/components/power-k/menus/members.tsx
+++ b/apps/web/core/components/power-k/menus/members.tsx
@@ -17,7 +17,7 @@ type Props = {
   value: string[];
 };
 
-export const PowerKMembersMenu: React.FC<Props> = observer((props) => {
+export const PowerKMembersMenu = observer(function PowerKMembersMenu(props: Props) {
   const { handleSelect, heading, userIds, value } = props;
   // store hooks
   const { getUserDetails } = useMember();
diff --git a/apps/web/core/components/power-k/menus/modules.tsx b/apps/web/core/components/power-k/menus/modules.tsx
index 3abe26758..9b42c72e3 100644
--- a/apps/web/core/components/power-k/menus/modules.tsx
+++ b/apps/web/core/components/power-k/menus/modules.tsx
@@ -14,15 +14,17 @@ type Props = {
   value?: string[];
 };
 
-export const PowerKModulesMenu: React.FC<Props> = observer(({ modules, onSelect, value }) => (
-  <PowerKMenuBuilder
-    items={modules}
-    getKey={(module) => module.id}
-    getIconNode={(module) => <ModuleStatusIcon status={module.status ?? "backlog"} className="shrink-0 size-3.5" />}
-    getValue={(module) => module.name}
-    getLabel={(module) => module.name}
-    isSelected={(module) => !!value?.includes(module.id)}
-    onSelect={onSelect}
-    emptyText="No modules found"
-  />
-));
+export const PowerKModulesMenu = observer(function PowerKModulesMenu({ modules, onSelect, value }: Props) {
+  return (
+    <PowerKMenuBuilder
+      items={modules}
+      getKey={(module) => module.id}
+      getIconNode={(module) => <ModuleStatusIcon status={module.status ?? "backlog"} className="shrink-0 size-3.5" />}
+      getValue={(module) => module.name}
+      getLabel={(module) => module.name}
+      isSelected={(module) => !!value?.includes(module.id)}
+      onSelect={onSelect}
+      emptyText="No modules found"
+    />
+  );
+});
diff --git a/apps/web/core/components/power-k/menus/projects.tsx b/apps/web/core/components/power-k/menus/projects.tsx
index 61ff21e91..1e1be2c51 100644
--- a/apps/web/core/components/power-k/menus/projects.tsx
+++ b/apps/web/core/components/power-k/menus/projects.tsx
@@ -13,18 +13,20 @@ type Props = {
   onSelect: (project: TPartialProject) => void;
 };
 
-export const PowerKProjectsMenu: React.FC<Props> = ({ projects, onSelect }) => (
-  <PowerKMenuBuilder
-    items={projects}
-    getKey={(project) => project.id}
-    getIconNode={(project) => (
-      <span className="shrink-0">
-        <Logo logo={project.logo_props} size={14} />
-      </span>
-    )}
-    getValue={(project) => project.name}
-    getLabel={(project) => project.name}
-    onSelect={onSelect}
-    emptyText="No projects found"
-  />
-);
+export function PowerKProjectsMenu({ projects, onSelect }: Props) {
+  return (
+    <PowerKMenuBuilder
+      items={projects}
+      getKey={(project) => project.id}
+      getIconNode={(project) => (
+        <span className="shrink-0">
+          <Logo logo={project.logo_props} size={14} />
+        </span>
+      )}
+      getValue={(project) => project.name}
+      getLabel={(project) => project.name}
+      onSelect={onSelect}
+      emptyText="No projects found"
+    />
+  );
+}
diff --git a/apps/web/core/components/power-k/menus/settings.tsx b/apps/web/core/components/power-k/menus/settings.tsx
index 7e7cd050a..6eaa0c124 100644
--- a/apps/web/core/components/power-k/menus/settings.tsx
+++ b/apps/web/core/components/power-k/menus/settings.tsx
@@ -17,14 +17,16 @@ type Props = {
   onSelect: (setting: TSettingItem) => void;
 };
 
-export const PowerKSettingsMenu: React.FC<Props> = observer(({ settings, onSelect }) => (
-  <PowerKMenuBuilder
-    items={settings}
-    getKey={(setting) => setting.key}
-    getIcon={(setting) => setting.icon}
-    getValue={(setting) => setting.label}
-    getLabel={(setting) => setting.label}
-    onSelect={onSelect}
-    emptyText="No settings found"
-  />
-));
+export const PowerKSettingsMenu = observer(function PowerKSettingsMenu({ settings, onSelect }: Props) {
+  return (
+    <PowerKMenuBuilder
+      items={settings}
+      getKey={(setting) => setting.key}
+      getIcon={(setting) => setting.icon}
+      getValue={(setting) => setting.label}
+      getLabel={(setting) => setting.label}
+      onSelect={onSelect}
+      emptyText="No settings found"
+    />
+  );
+});
diff --git a/apps/web/core/components/power-k/menus/views.tsx b/apps/web/core/components/power-k/menus/views.tsx
index 51bdc721f..68daeddc5 100644
--- a/apps/web/core/components/power-k/menus/views.tsx
+++ b/apps/web/core/components/power-k/menus/views.tsx
@@ -13,14 +13,16 @@ type Props = {
   onSelect: (view: IProjectView) => void;
 };
 
-export const PowerKViewsMenu: React.FC<Props> = observer(({ views, onSelect }) => (
-  <PowerKMenuBuilder
-    items={views}
-    getKey={(view) => view.id}
-    getIcon={() => Layers}
-    getValue={(view) => view.name}
-    getLabel={(view) => view.name}
-    onSelect={onSelect}
-    emptyText="No views found"
-  />
-));
+export const PowerKViewsMenu = observer(function PowerKViewsMenu({ views, onSelect }: Props) {
+  return (
+    <PowerKMenuBuilder
+      items={views}
+      getKey={(view) => view.id}
+      getIcon={() => Layers}
+      getValue={(view) => view.name}
+      getLabel={(view) => view.name}
+      onSelect={onSelect}
+      emptyText="No views found"
+    />
+  );
+});
diff --git a/apps/web/core/components/power-k/menus/workspaces.tsx b/apps/web/core/components/power-k/menus/workspaces.tsx
index 46302ad2d..49df29979 100644
--- a/apps/web/core/components/power-k/menus/workspaces.tsx
+++ b/apps/web/core/components/power-k/menus/workspaces.tsx
@@ -13,14 +13,18 @@ type Props = {
   onSelect: (workspace: IWorkspace) => void;
 };
 
-export const PowerKWorkspacesMenu: React.FC<Props> = ({ workspaces, onSelect }) => (
-  <PowerKMenuBuilder
-    items={workspaces}
-    getKey={(workspace) => workspace.id}
-    getIconNode={(workspace) => <WorkspaceLogo logo={workspace.logo_url} name={workspace.name} classNames="shrink-0" />}
-    getValue={(workspace) => workspace.name}
-    getLabel={(workspace) => workspace.name}
-    onSelect={onSelect}
-    emptyText="No workspaces found"
-  />
-);
+export function PowerKWorkspacesMenu({ workspaces, onSelect }: Props) {
+  return (
+    <PowerKMenuBuilder
+      items={workspaces}
+      getKey={(workspace) => workspace.id}
+      getIconNode={(workspace) => (
+        <WorkspaceLogo logo={workspace.logo_url} name={workspace.name} classNames="shrink-0" />
+      )}
+      getValue={(workspace) => workspace.name}
+      getLabel={(workspace) => workspace.name}
+      onSelect={onSelect}
+      emptyText="No workspaces found"
+    />
+  );
+}
diff --git a/apps/web/core/components/power-k/projects-app-provider.tsx b/apps/web/core/components/power-k/projects-app-provider.tsx
index 4f0f8ea70..4e3065874 100644
--- a/apps/web/core/components/power-k/projects-app-provider.tsx
+++ b/apps/web/core/components/power-k/projects-app-provider.tsx
@@ -22,7 +22,7 @@ import { ProjectsAppPowerKModalWrapper } from "./ui/modal/wrapper";
 /**
  * Projects App PowerK provider
  */
-export const ProjectsAppPowerKProvider = observer(() => {
+export const ProjectsAppPowerKProvider = observer(function ProjectsAppPowerKProvider() {
   // router
   const router = useAppRouter();
   const params = useParams();
diff --git a/apps/web/core/components/power-k/ui/modal/command-item-shortcut-badge.tsx b/apps/web/core/components/power-k/ui/modal/command-item-shortcut-badge.tsx
index 903c0fdca..2d566f171 100644
--- a/apps/web/core/components/power-k/ui/modal/command-item-shortcut-badge.tsx
+++ b/apps/web/core/components/power-k/ui/modal/command-item-shortcut-badge.tsx
@@ -61,7 +61,7 @@ export const formatShortcutForDisplay = (shortcut: string | undefined): string |
   return parts.join("");
 };
 
-export const ShortcutBadge = ({ shortcut }: { shortcut: string | undefined }) => {
+export function ShortcutBadge({ shortcut }: { shortcut: string | undefined }) {
   if (!shortcut) return null;
 
   const formatted = formatShortcutForDisplay(shortcut);
@@ -77,7 +77,7 @@ export const ShortcutBadge = ({ shortcut }: { shortcut: string | undefined }) =>
       ))}
     </div>
   );
-};
+}
 
 /**
  * Formats key sequence for display (e.g., "gm" -> "G then M")
@@ -89,7 +89,7 @@ export const formatKeySequenceForDisplay = (sequence: string | undefined): strin
   return chars.map((c) => c.toUpperCase()).join(" then ");
 };
 
-export const KeySequenceBadge = ({ sequence }: { sequence: string | undefined }) => {
+export function KeySequenceBadge({ sequence }: { sequence: string | undefined }) {
   if (!sequence) return null;
 
   const chars = sequence.split("");
@@ -106,4 +106,4 @@ export const KeySequenceBadge = ({ sequence }: { sequence: string | undefined })
       ))}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/modal/command-item.tsx b/apps/web/core/components/power-k/ui/modal/command-item.tsx
index 6eb660f7b..870c21e69 100644
--- a/apps/web/core/components/power-k/ui/modal/command-item.tsx
+++ b/apps/web/core/components/power-k/ui/modal/command-item.tsx
@@ -18,7 +18,7 @@ type Props = {
   value?: string;
 };
 
-export const PowerKModalCommandItem: React.FC<Props> = (props) => {
+export function PowerKModalCommandItem(props: Props) {
   const { icon: Icon, iconNode, isDisabled, isSelected, keySequence, label, onSelect, shortcut, value } = props;
 
   return (
@@ -39,4 +39,4 @@ export const PowerKModalCommandItem: React.FC<Props> = (props) => {
       </div>
     </Command.Item>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/modal/commands-list.tsx b/apps/web/core/components/power-k/ui/modal/commands-list.tsx
index 9cd4f2735..392507707 100644
--- a/apps/web/core/components/power-k/ui/modal/commands-list.tsx
+++ b/apps/web/core/components/power-k/ui/modal/commands-list.tsx
@@ -13,7 +13,7 @@ export type TPowerKCommandsListProps = {
   setSearchTerm: (value: string) => void;
 };
 
-export const ProjectsAppPowerKCommandsList: React.FC<TPowerKCommandsListProps> = (props) => {
+export function ProjectsAppPowerKCommandsList(props: TPowerKCommandsListProps) {
   const {
     activePage,
     context,
@@ -46,4 +46,4 @@ export const ProjectsAppPowerKCommandsList: React.FC<TPowerKCommandsListProps> =
       />
     </>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/modal/context-indicator.tsx b/apps/web/core/components/power-k/ui/modal/context-indicator.tsx
index 658d2f426..ca8907171 100644
--- a/apps/web/core/components/power-k/ui/modal/context-indicator.tsx
+++ b/apps/web/core/components/power-k/ui/modal/context-indicator.tsx
@@ -11,7 +11,7 @@ type Props = {
   handleClearContext: () => void;
 };
 
-export const PowerKModalContextIndicator: React.FC<Props> = (props) => {
+export function PowerKModalContextIndicator(props: Props) {
   const { activeContext, handleClearContext } = props;
   // context indicator
   const contextIndicator = useContextIndicator({ activeContext });
@@ -43,4 +43,4 @@ export const PowerKModalContextIndicator: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/modal/footer.tsx b/apps/web/core/components/power-k/ui/modal/footer.tsx
index 0b2dcf4fc..dab5cbccc 100644
--- a/apps/web/core/components/power-k/ui/modal/footer.tsx
+++ b/apps/web/core/components/power-k/ui/modal/footer.tsx
@@ -12,7 +12,7 @@ type Props = {
   onWorkspaceLevelChange: (value: boolean) => void;
 };
 
-export const PowerKModalFooter: React.FC<Props> = observer((props) => {
+export const PowerKModalFooter = observer(function PowerKModalFooter(props: Props) {
   const { isWorkspaceLevel, projectId, onWorkspaceLevelChange } = props;
   // translation
   const { t } = useTranslation();
diff --git a/apps/web/core/components/power-k/ui/modal/header.tsx b/apps/web/core/components/power-k/ui/modal/header.tsx
index b1354ad71..b9063df20 100644
--- a/apps/web/core/components/power-k/ui/modal/header.tsx
+++ b/apps/web/core/components/power-k/ui/modal/header.tsx
@@ -17,7 +17,7 @@ type Props = {
   searchTerm: string;
 };
 
-export const PowerKModalHeader: React.FC<Props> = (props) => {
+export function PowerKModalHeader(props: Props) {
   const { context, searchTerm, onSearchChange, activePage } = props;
   // translation
   const { t } = useTranslation();
@@ -57,4 +57,4 @@ export const PowerKModalHeader: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/modal/search-menu.tsx b/apps/web/core/components/power-k/ui/modal/search-menu.tsx
index 33d4e034b..599702f19 100644
--- a/apps/web/core/components/power-k/ui/modal/search-menu.tsx
+++ b/apps/web/core/components/power-k/ui/modal/search-menu.tsx
@@ -26,7 +26,7 @@ type Props = {
   updateSearchTerm: (value: string) => void;
 };
 
-export const PowerKModalSearchMenu: React.FC<Props> = (props) => {
+export function PowerKModalSearchMenu(props: Props) {
   const { activePage, context, isWorkspaceLevel, searchTerm, updateSearchTerm } = props;
   // states
   const [resultsCount, setResultsCount] = useState(0);
@@ -104,4 +104,4 @@ export const PowerKModalSearchMenu: React.FC<Props> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/modal/search-results.tsx b/apps/web/core/components/power-k/ui/modal/search-results.tsx
index e195728e9..eb8c13dc6 100644
--- a/apps/web/core/components/power-k/ui/modal/search-results.tsx
+++ b/apps/web/core/components/power-k/ui/modal/search-results.tsx
@@ -17,7 +17,7 @@ type Props = {
   results: IWorkspaceSearchResults;
 };
 
-export const PowerKModalSearchResults: React.FC<Props> = observer((props) => {
+export const PowerKModalSearchResults = observer(function PowerKModalSearchResults(props: Props) {
   const { closePalette, results } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/power-k/ui/modal/shortcuts-root.tsx b/apps/web/core/components/power-k/ui/modal/shortcuts-root.tsx
index 365271b5a..08fdedad8 100644
--- a/apps/web/core/components/power-k/ui/modal/shortcuts-root.tsx
+++ b/apps/web/core/components/power-k/ui/modal/shortcuts-root.tsx
@@ -17,7 +17,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const ShortcutsModal: FC<Props> = (props) => {
+export function ShortcutsModal(props: Props) {
   const { isOpen, onClose } = props;
   // states
   const [query, setQuery] = useState("");
@@ -92,4 +92,4 @@ export const ShortcutsModal: FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/modal/wrapper.tsx b/apps/web/core/components/power-k/ui/modal/wrapper.tsx
index a8ed9fb26..a3c6b0c2b 100644
--- a/apps/web/core/components/power-k/ui/modal/wrapper.tsx
+++ b/apps/web/core/components/power-k/ui/modal/wrapper.tsx
@@ -20,7 +20,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const ProjectsAppPowerKModalWrapper = observer((props: Props) => {
+export const ProjectsAppPowerKModalWrapper = observer(function ProjectsAppPowerKModalWrapper(props: Props) {
   const { commandsListComponent: CommandsListComponent, context, hideFooter = false, isOpen, onClose } = props;
   // states
   const [searchTerm, setSearchTerm] = useState("");
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/module/root.tsx b/apps/web/core/components/power-k/ui/pages/context-based/module/root.tsx
index 6c7edfb2c..ad2f74ffe 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/module/root.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/module/root.tsx
@@ -16,7 +16,7 @@ type Props = {
   handleSelection: (data: unknown) => void;
 };
 
-export const PowerKModuleContextBasedPages: React.FC<Props> = observer((props) => {
+export const PowerKModuleContextBasedPages = observer(function PowerKModuleContextBasedPages(props: Props) {
   const { activePage, handleSelection } = props;
   // navigation
   const { moduleId } = useParams();
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/module/status-menu.tsx b/apps/web/core/components/power-k/ui/pages/context-based/module/status-menu.tsx
index 5510b5435..5de812229 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/module/status-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/module/status-menu.tsx
@@ -15,7 +15,7 @@ type Props = {
   value: TModuleStatus;
 };
 
-export const PowerKModuleStatusMenu: React.FC<Props> = observer((props) => {
+export const PowerKModuleStatusMenu = observer(function PowerKModuleStatusMenu(props: Props) {
   const { handleSelect, value } = props;
   // translation
   const { t } = useTranslation();
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/root.tsx b/apps/web/core/components/power-k/ui/pages/context-based/root.tsx
index 71c7828cd..0e264de1e 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/root.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/root.tsx
@@ -19,7 +19,7 @@ export type ContextBasedActionsProps = {
   handleSelection: (data: unknown) => void;
 };
 
-export const PowerKContextBasedPagesList: React.FC<ContextBasedActionsProps> = (props) => {
+export function PowerKContextBasedPagesList(props: ContextBasedActionsProps) {
   const { activeContext, activePage, handleSelection } = props;
 
   return (
@@ -33,7 +33,7 @@ export const PowerKContextBasedPagesList: React.FC<ContextBasedActionsProps> = (
       <PowerKContextBasedActionsExtended {...props} />
     </>
   );
-};
+}
 
 export const usePowerKContextBasedActions = (): TPowerKCommandConfig[] => {
   const workItemCommands = usePowerKWorkItemContextBasedCommands();
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/work-item/cycles-menu.tsx b/apps/web/core/components/power-k/ui/pages/context-based/work-item/cycles-menu.tsx
index 39389f980..b413f4f41 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/work-item/cycles-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/work-item/cycles-menu.tsx
@@ -14,7 +14,7 @@ type Props = {
   workItemDetails: TIssue;
 };
 
-export const PowerKWorkItemCyclesMenu: React.FC<Props> = observer((props) => {
+export const PowerKWorkItemCyclesMenu = observer(function PowerKWorkItemCyclesMenu(props: Props) {
   const { handleSelect, workItemDetails } = props;
   // store hooks
   const { getProjectCycleIds, getCycleById } = useCycle();
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/work-item/estimates-menu.tsx b/apps/web/core/components/power-k/ui/pages/context-based/work-item/estimates-menu.tsx
index 58b3eeb2b..d310bbfe6 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/work-item/estimates-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/work-item/estimates-menu.tsx
@@ -19,7 +19,7 @@ type Props = {
   workItemDetails: TIssue;
 };
 
-export const PowerKWorkItemEstimatesMenu: React.FC<Props> = observer((props) => {
+export const PowerKWorkItemEstimatesMenu = observer(function PowerKWorkItemEstimatesMenu(props: Props) {
   const { handleSelect, workItemDetails } = props;
   // store hooks
   const { currentActiveEstimateIdByProjectId, getEstimateById } = useProjectEstimates();
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/work-item/labels-menu.tsx b/apps/web/core/components/power-k/ui/pages/context-based/work-item/labels-menu.tsx
index c8e51991f..763520a86 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/work-item/labels-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/work-item/labels-menu.tsx
@@ -14,7 +14,7 @@ type Props = {
   workItemDetails: TIssue;
 };
 
-export const PowerKWorkItemLabelsMenu: React.FC<Props> = observer((props) => {
+export const PowerKWorkItemLabelsMenu = observer(function PowerKWorkItemLabelsMenu(props: Props) {
   const { handleSelect, workItemDetails } = props;
   // store hooks
   const { getProjectLabelIds, getLabelById } = useLabel();
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/work-item/modules-menu.tsx b/apps/web/core/components/power-k/ui/pages/context-based/work-item/modules-menu.tsx
index 5c46463e5..a4f31d6e8 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/work-item/modules-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/work-item/modules-menu.tsx
@@ -14,7 +14,7 @@ type Props = {
   workItemDetails: TIssue;
 };
 
-export const PowerKWorkItemModulesMenu: React.FC<Props> = observer((props) => {
+export const PowerKWorkItemModulesMenu = observer(function PowerKWorkItemModulesMenu(props: Props) {
   const { handleSelect, workItemDetails } = props;
   // store hooks
   const { getProjectModuleIds, getModuleById } = useModule();
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/work-item/priorities-menu.tsx b/apps/web/core/components/power-k/ui/pages/context-based/work-item/priorities-menu.tsx
index ff33f0b59..45b16c321 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/work-item/priorities-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/work-item/priorities-menu.tsx
@@ -14,7 +14,7 @@ type Props = {
   workItemDetails: TIssue;
 };
 
-export const PowerKWorkItemPrioritiesMenu: React.FC<Props> = observer((props) => {
+export const PowerKWorkItemPrioritiesMenu = observer(function PowerKWorkItemPrioritiesMenu(props: Props) {
   const { handleSelect, workItemDetails } = props;
 
   return (
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/work-item/root.tsx b/apps/web/core/components/power-k/ui/pages/context-based/work-item/root.tsx
index ad8149036..1f4a4b0f7 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/work-item/root.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/work-item/root.tsx
@@ -23,7 +23,7 @@ type Props = {
   handleSelection: (data: unknown) => void;
 };
 
-export const PowerKWorkItemContextBasedPages: React.FC<Props> = observer((props) => {
+export const PowerKWorkItemContextBasedPages = observer(function PowerKWorkItemContextBasedPages(props: Props) {
   const { activePage, handleSelection } = props;
   // navigation
   const { workItem: entityIdentifier } = useParams();
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/work-item/states-menu.tsx b/apps/web/core/components/power-k/ui/pages/context-based/work-item/states-menu.tsx
index 835cae3ab..255645dfe 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/work-item/states-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/work-item/states-menu.tsx
@@ -16,7 +16,7 @@ type Props = {
   workItemDetails: TIssue;
 };
 
-export const PowerKProjectStatesMenu: React.FC<Props> = observer((props) => {
+export const PowerKProjectStatesMenu = observer(function PowerKProjectStatesMenu(props: Props) {
   const { workItemDetails } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/power-k/ui/pages/default.tsx b/apps/web/core/components/power-k/ui/pages/default.tsx
index eebfe22c8..b8bc83c9f 100644
--- a/apps/web/core/components/power-k/ui/pages/default.tsx
+++ b/apps/web/core/components/power-k/ui/pages/default.tsx
@@ -12,7 +12,7 @@ type Props = {
   onCommandSelect: (command: TPowerKCommandConfig) => void;
 };
 
-export const PowerKModalDefaultPage: React.FC<Props> = (props) => {
+export function PowerKModalDefaultPage(props: Props) {
   const { context, onCommandSelect } = props;
   // store hooks
   const { commandRegistry } = usePowerK();
@@ -20,4 +20,4 @@ export const PowerKModalDefaultPage: React.FC<Props> = (props) => {
   const commands = commandRegistry.getVisibleCommands(context);
 
   return <CommandRenderer context={context} commands={commands} onCommandSelect={onCommandSelect} />;
-};
+}
diff --git a/apps/web/core/components/power-k/ui/pages/open-entity/project-cycles-menu.tsx b/apps/web/core/components/power-k/ui/pages/open-entity/project-cycles-menu.tsx
index a8c17a176..604f87a08 100644
--- a/apps/web/core/components/power-k/ui/pages/open-entity/project-cycles-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/open-entity/project-cycles-menu.tsx
@@ -15,7 +15,7 @@ type Props = {
   handleSelect: (cycle: ICycle) => void;
 };
 
-export const PowerKOpenProjectCyclesMenu: React.FC<Props> = observer((props) => {
+export const PowerKOpenProjectCyclesMenu = observer(function PowerKOpenProjectCyclesMenu(props: Props) {
   const { context, handleSelect } = props;
   // store hooks
   const { fetchedMap, getProjectCycleIds, getCycleById } = useCycle();
diff --git a/apps/web/core/components/power-k/ui/pages/open-entity/project-modules-menu.tsx b/apps/web/core/components/power-k/ui/pages/open-entity/project-modules-menu.tsx
index af3ce8020..cdaff953f 100644
--- a/apps/web/core/components/power-k/ui/pages/open-entity/project-modules-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/open-entity/project-modules-menu.tsx
@@ -15,7 +15,7 @@ type Props = {
   handleSelect: (module: IModule) => void;
 };
 
-export const PowerKOpenProjectModulesMenu: React.FC<Props> = observer((props) => {
+export const PowerKOpenProjectModulesMenu = observer(function PowerKOpenProjectModulesMenu(props: Props) {
   const { context, handleSelect } = props;
   // store hooks
   const { fetchedMap, getProjectModuleIds, getModuleById } = useModule();
diff --git a/apps/web/core/components/power-k/ui/pages/open-entity/project-settings-menu.tsx b/apps/web/core/components/power-k/ui/pages/open-entity/project-settings-menu.tsx
index e7ce54035..fda64ae48 100644
--- a/apps/web/core/components/power-k/ui/pages/open-entity/project-settings-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/open-entity/project-settings-menu.tsx
@@ -16,7 +16,7 @@ type Props = {
   handleSelect: (href: string) => void;
 };
 
-export const PowerKOpenProjectSettingsMenu: React.FC<Props> = observer((props) => {
+export const PowerKOpenProjectSettingsMenu = observer(function PowerKOpenProjectSettingsMenu(props: Props) {
   const { context, handleSelect } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/power-k/ui/pages/open-entity/project-views-menu.tsx b/apps/web/core/components/power-k/ui/pages/open-entity/project-views-menu.tsx
index a60fb316e..6a6004137 100644
--- a/apps/web/core/components/power-k/ui/pages/open-entity/project-views-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/open-entity/project-views-menu.tsx
@@ -15,7 +15,7 @@ type Props = {
   handleSelect: (view: IProjectView) => void;
 };
 
-export const PowerKOpenProjectViewsMenu: React.FC<Props> = observer((props) => {
+export const PowerKOpenProjectViewsMenu = observer(function PowerKOpenProjectViewsMenu(props: Props) {
   const { context, handleSelect } = props;
   // store hooks
   const { fetchedMap, getProjectViews } = useProjectView();
diff --git a/apps/web/core/components/power-k/ui/pages/open-entity/projects-menu.tsx b/apps/web/core/components/power-k/ui/pages/open-entity/projects-menu.tsx
index e11aac6f1..81cfa8163 100644
--- a/apps/web/core/components/power-k/ui/pages/open-entity/projects-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/open-entity/projects-menu.tsx
@@ -13,7 +13,7 @@ type Props = {
   handleSelect: (project: IPartialProject) => void;
 };
 
-export const PowerKOpenProjectMenu: React.FC<Props> = observer((props) => {
+export const PowerKOpenProjectMenu = observer(function PowerKOpenProjectMenu(props: Props) {
   const { handleSelect } = props;
   // store hooks
   const { loader, joinedProjectIds, getPartialProjectById } = useProject();
diff --git a/apps/web/core/components/power-k/ui/pages/open-entity/root.tsx b/apps/web/core/components/power-k/ui/pages/open-entity/root.tsx
index a823d34ee..23967d7c8 100644
--- a/apps/web/core/components/power-k/ui/pages/open-entity/root.tsx
+++ b/apps/web/core/components/power-k/ui/pages/open-entity/root.tsx
@@ -8,7 +8,7 @@ import type { TPowerKOpenEntityActionsProps } from "./shared";
 import { PowerKOpenWorkspaceSettingsMenu } from "./workspace-settings-menu";
 import { PowerKOpenWorkspaceMenu } from "./workspaces-menu";
 
-export const PowerKOpenEntityPages: React.FC<TPowerKOpenEntityActionsProps> = (props) => {
+export function PowerKOpenEntityPages(props: TPowerKOpenEntityActionsProps) {
   const { activePage, context, handleSelection } = props;
 
   return (
@@ -32,4 +32,4 @@ export const PowerKOpenEntityPages: React.FC<TPowerKOpenEntityActionsProps> = (p
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/pages/open-entity/workspace-settings-menu.tsx b/apps/web/core/components/power-k/ui/pages/open-entity/workspace-settings-menu.tsx
index 2a2cbdb0d..2dd1b328c 100644
--- a/apps/web/core/components/power-k/ui/pages/open-entity/workspace-settings-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/open-entity/workspace-settings-menu.tsx
@@ -17,7 +17,7 @@ type Props = {
   handleSelect: (href: string) => void;
 };
 
-export const PowerKOpenWorkspaceSettingsMenu: React.FC<Props> = observer((props) => {
+export const PowerKOpenWorkspaceSettingsMenu = observer(function PowerKOpenWorkspaceSettingsMenu(props: Props) {
   const { context, handleSelect } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/power-k/ui/pages/open-entity/workspaces-menu.tsx b/apps/web/core/components/power-k/ui/pages/open-entity/workspaces-menu.tsx
index a5b315254..92dcbdc3a 100644
--- a/apps/web/core/components/power-k/ui/pages/open-entity/workspaces-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/open-entity/workspaces-menu.tsx
@@ -13,7 +13,7 @@ type Props = {
   handleSelect: (workspace: IWorkspace) => void;
 };
 
-export const PowerKOpenWorkspaceMenu: React.FC<Props> = observer((props) => {
+export const PowerKOpenWorkspaceMenu = observer(function PowerKOpenWorkspaceMenu(props: Props) {
   const { handleSelect } = props;
   // store hooks
   const { loader, workspaces } = useWorkspace();
diff --git a/apps/web/core/components/power-k/ui/pages/preferences/languages-menu.tsx b/apps/web/core/components/power-k/ui/pages/preferences/languages-menu.tsx
index d5ca6556e..dcef2dec0 100644
--- a/apps/web/core/components/power-k/ui/pages/preferences/languages-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/preferences/languages-menu.tsx
@@ -12,7 +12,7 @@ type Props = {
   onSelect: (language: string) => void;
 };
 
-export const PowerKPreferencesLanguagesMenu: React.FC<Props> = observer((props) => {
+export const PowerKPreferencesLanguagesMenu = observer(function PowerKPreferencesLanguagesMenu(props: Props) {
   const { onSelect } = props;
 
   return (
diff --git a/apps/web/core/components/power-k/ui/pages/preferences/root.tsx b/apps/web/core/components/power-k/ui/pages/preferences/root.tsx
index e183b2109..2f70d03c4 100644
--- a/apps/web/core/components/power-k/ui/pages/preferences/root.tsx
+++ b/apps/web/core/components/power-k/ui/pages/preferences/root.tsx
@@ -15,7 +15,7 @@ type Props = {
   handleSelection: (data: unknown) => void;
 };
 
-export const PowerKAccountPreferencesPages: React.FC<Props> = observer((props) => {
+export const PowerKAccountPreferencesPages = observer(function PowerKAccountPreferencesPages(props: Props) {
   const { activePage, handleSelection } = props;
 
   return (
diff --git a/apps/web/core/components/power-k/ui/pages/preferences/start-of-week-menu.tsx b/apps/web/core/components/power-k/ui/pages/preferences/start-of-week-menu.tsx
index 40b349458..5503c4828 100644
--- a/apps/web/core/components/power-k/ui/pages/preferences/start-of-week-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/preferences/start-of-week-menu.tsx
@@ -12,7 +12,7 @@ type Props = {
   onSelect: (day: EStartOfTheWeek) => void;
 };
 
-export const PowerKPreferencesStartOfWeekMenu: React.FC<Props> = (props) => {
+export function PowerKPreferencesStartOfWeekMenu(props: Props) {
   const { onSelect } = props;
 
   return (
@@ -22,4 +22,4 @@ export const PowerKPreferencesStartOfWeekMenu: React.FC<Props> = (props) => {
       ))}
     </Command.Group>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/pages/preferences/themes-menu.tsx b/apps/web/core/components/power-k/ui/pages/preferences/themes-menu.tsx
index 1519c337d..eed0539dd 100644
--- a/apps/web/core/components/power-k/ui/pages/preferences/themes-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/preferences/themes-menu.tsx
@@ -13,7 +13,7 @@ type Props = {
   onSelect: (theme: string) => void;
 };
 
-export const PowerKPreferencesThemesMenu: React.FC<Props> = observer((props) => {
+export const PowerKPreferencesThemesMenu = observer(function PowerKPreferencesThemesMenu(props: Props) {
   const { onSelect } = props;
   // hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/power-k/ui/pages/preferences/timezone-menu.tsx b/apps/web/core/components/power-k/ui/pages/preferences/timezone-menu.tsx
index 53b068d51..dd9378e02 100644
--- a/apps/web/core/components/power-k/ui/pages/preferences/timezone-menu.tsx
+++ b/apps/web/core/components/power-k/ui/pages/preferences/timezone-menu.tsx
@@ -12,7 +12,7 @@ type Props = {
   onSelect: (timezone: string) => void;
 };
 
-export const PowerKPreferencesTimezonesMenu: React.FC<Props> = observer((props) => {
+export const PowerKPreferencesTimezonesMenu = observer(function PowerKPreferencesTimezonesMenu(props: Props) {
   const { onSelect } = props;
   // timezones
   const { timezones } = useTimezone();
diff --git a/apps/web/core/components/power-k/ui/pages/root.tsx b/apps/web/core/components/power-k/ui/pages/root.tsx
index 66bb97bb0..f06e457bc 100644
--- a/apps/web/core/components/power-k/ui/pages/root.tsx
+++ b/apps/web/core/components/power-k/ui/pages/root.tsx
@@ -15,7 +15,7 @@ type Props = {
   onPageDataSelect: (value: unknown) => void;
 };
 
-export const PowerKModalPagesList: React.FC<Props> = observer((props) => {
+export const PowerKModalPagesList = observer(function PowerKModalPagesList(props: Props) {
   const { activePage, context, onCommandSelect, onPageDataSelect } = props;
 
   // Main page content (no specific page)
diff --git a/apps/web/core/components/power-k/ui/pages/work-item-selection-page.tsx b/apps/web/core/components/power-k/ui/pages/work-item-selection-page.tsx
index 6b3715e39..2904a55c5 100644
--- a/apps/web/core/components/power-k/ui/pages/work-item-selection-page.tsx
+++ b/apps/web/core/components/power-k/ui/pages/work-item-selection-page.tsx
@@ -29,7 +29,7 @@ type Props = {
   isWorkspaceLevel?: boolean;
 };
 
-export const WorkItemSelectionPage: React.FC<Props> = (props) => {
+export function WorkItemSelectionPage(props: Props) {
   const { workspaceSlug, projectId, debouncedSearchTerm, isWorkspaceLevel = false } = props;
   // router
   // const router = useAppRouter();
@@ -160,4 +160,4 @@ export const WorkItemSelectionPage: React.FC<Props> = (props) => {
       )} */}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/renderer/command.tsx b/apps/web/core/components/power-k/ui/renderer/command.tsx
index af153fcd4..bd3f78d23 100644
--- a/apps/web/core/components/power-k/ui/renderer/command.tsx
+++ b/apps/web/core/components/power-k/ui/renderer/command.tsx
@@ -16,7 +16,7 @@ type Props = {
   onCommandSelect: (command: TPowerKCommandConfig) => void;
 };
 
-export const CommandRenderer: React.FC<Props> = (props) => {
+export function CommandRenderer(props: Props) {
   const { commands, context, onCommandSelect } = props;
   // derived values
   const { activeContext } = context;
@@ -68,4 +68,4 @@ export const CommandRenderer: React.FC<Props> = (props) => {
       })}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/power-k/ui/renderer/shortcut.tsx b/apps/web/core/components/power-k/ui/renderer/shortcut.tsx
index 49caef90b..7a482b055 100644
--- a/apps/web/core/components/power-k/ui/renderer/shortcut.tsx
+++ b/apps/web/core/components/power-k/ui/renderer/shortcut.tsx
@@ -14,7 +14,7 @@ type Props = {
   commands: TPowerKCommandConfig[];
 };
 
-export const ShortcutRenderer: React.FC<Props> = (props) => {
+export function ShortcutRenderer(props: Props) {
   const { searchQuery, commands } = props;
   // translation
   const { t } = useTranslation();
@@ -106,4 +106,4 @@ export const ShortcutRenderer: React.FC<Props> = (props) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/preferences/list.tsx b/apps/web/core/components/preferences/list.tsx
index beb08fd1a..291eebf01 100644
--- a/apps/web/core/components/preferences/list.tsx
+++ b/apps/web/core/components/preferences/list.tsx
@@ -1,11 +1,13 @@
 import { PREFERENCE_OPTIONS } from "@plane/constants";
 import { PREFERENCE_COMPONENTS } from "@/plane-web/components/preferences/config";
 
-export const PreferencesList = () => (
-  <div className="py-6 space-y-6">
-    {PREFERENCE_OPTIONS.map((option) => {
-      const Component = PREFERENCE_COMPONENTS[option.id as keyof typeof PREFERENCE_COMPONENTS];
-      return <Component key={option.id} option={option} />;
-    })}
-  </div>
-);
+export function PreferencesList() {
+  return (
+    <div className="py-6 space-y-6">
+      {PREFERENCE_OPTIONS.map((option) => {
+        const Component = PREFERENCE_COMPONENTS[option.id as keyof typeof PREFERENCE_COMPONENTS];
+        return <Component key={option.id} option={option} />;
+      })}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/preferences/section.tsx b/apps/web/core/components/preferences/section.tsx
index 5ba35bb55..b82f7da46 100644
--- a/apps/web/core/components/preferences/section.tsx
+++ b/apps/web/core/components/preferences/section.tsx
@@ -4,12 +4,14 @@ interface SettingsSectionProps {
   control: React.ReactNode;
 }
 
-export const PreferencesSection = ({ title, description, control }: SettingsSectionProps) => (
-  <div className="flex w-full justify-between gap-4 sm:gap-16">
-    <div className="col-span-12 sm:col-span-6">
-      <h4 className="text-base font-medium text-custom-text-100">{title}</h4>
-      <p className="text-sm text-custom-text-200">{description}</p>
+export function PreferencesSection({ title, description, control }: SettingsSectionProps) {
+  return (
+    <div className="flex w-full justify-between gap-4 sm:gap-16">
+      <div className="col-span-12 sm:col-span-6">
+        <h4 className="text-base font-medium text-custom-text-100">{title}</h4>
+        <p className="text-sm text-custom-text-200">{description}</p>
+      </div>
+      <div className="col-span-12 sm:col-span-6 my-auto">{control}</div>
     </div>
-    <div className="col-span-12 sm:col-span-6 my-auto">{control}</div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/profile/activity/activity-list.tsx b/apps/web/core/components/profile/activity/activity-list.tsx
index a72eb308e..b25c09d3c 100644
--- a/apps/web/core/components/profile/activity/activity-list.tsx
+++ b/apps/web/core/components/profile/activity/activity-list.tsx
@@ -17,7 +17,7 @@ type Props = {
   activity: IUserActivityResponse | undefined;
 };
 
-export const ActivityList: React.FC<Props> = observer((props) => {
+export const ActivityList = observer(function ActivityList(props: Props) {
   const { activity } = props;
   // params
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/profile/activity/download-button.tsx b/apps/web/core/components/profile/activity/download-button.tsx
index 40140a2a2..276a2e5db 100644
--- a/apps/web/core/components/profile/activity/download-button.tsx
+++ b/apps/web/core/components/profile/activity/download-button.tsx
@@ -12,7 +12,7 @@ import { UserService } from "@/services/user.service";
 
 const userService = new UserService();
 
-export const DownloadActivityButton = () => {
+export function DownloadActivityButton() {
   // states
   const [isDownloading, setIsDownloading] = useState(false);
   // router
@@ -58,4 +58,4 @@ export const DownloadActivityButton = () => {
       {isDownloading ? t("profile.stats.recent_activity.button_loading") : t("profile.stats.recent_activity.button")}
     </Button>
   );
-};
+}
diff --git a/apps/web/core/components/profile/activity/profile-activity-list.tsx b/apps/web/core/components/profile/activity/profile-activity-list.tsx
index a8b151773..5b378e994 100644
--- a/apps/web/core/components/profile/activity/profile-activity-list.tsx
+++ b/apps/web/core/components/profile/activity/profile-activity-list.tsx
@@ -25,7 +25,7 @@ type Props = {
   updateEmptyState: (state: boolean) => void;
 };
 
-export const ProfileActivityListPage: React.FC<Props> = observer((props) => {
+export const ProfileActivityListPage = observer(function ProfileActivityListPage(props: Props) {
   const { cursor, perPage, updateResultsCount, updateTotalPages, updateEmptyState } = props;
   // store hooks
   const { data: currentUser } = useUser();
diff --git a/apps/web/core/components/profile/activity/workspace-activity-list.tsx b/apps/web/core/components/profile/activity/workspace-activity-list.tsx
index 251170005..1f9e140d3 100644
--- a/apps/web/core/components/profile/activity/workspace-activity-list.tsx
+++ b/apps/web/core/components/profile/activity/workspace-activity-list.tsx
@@ -18,7 +18,7 @@ type Props = {
   updateTotalPages: (count: number) => void;
 };
 
-export const WorkspaceActivityListPage: React.FC<Props> = (props) => {
+export function WorkspaceActivityListPage(props: Props) {
   const { cursor, perPage, updateResultsCount, updateTotalPages } = props;
   // router
   const { workspaceSlug, userId } = useParams();
@@ -46,4 +46,4 @@ export const WorkspaceActivityListPage: React.FC<Props> = (props) => {
   }, [updateResultsCount, updateTotalPages, userProfileActivity]);
 
   return <ActivityList activity={userProfileActivity} />;
-};
+}
diff --git a/apps/web/core/components/profile/form.tsx b/apps/web/core/components/profile/form.tsx
index 7bd9e1338..951662425 100644
--- a/apps/web/core/components/profile/form.tsx
+++ b/apps/web/core/components/profile/form.tsx
@@ -42,7 +42,7 @@ export type TProfileFormProps = {
   profile: TUserProfile;
 };
 
-export const ProfileForm = observer((props: TProfileFormProps) => {
+export const ProfileForm = observer(function ProfileForm(props: TProfileFormProps) {
   const { user, profile } = props;
   const { workspaceSlug } = useParams();
   // states
diff --git a/apps/web/core/components/profile/notification/email-notification-form.tsx b/apps/web/core/components/profile/notification/email-notification-form.tsx
index f7e76f1b0..7dae24421 100644
--- a/apps/web/core/components/profile/notification/email-notification-form.tsx
+++ b/apps/web/core/components/profile/notification/email-notification-form.tsx
@@ -20,7 +20,7 @@ interface IEmailNotificationFormProps {
 // services
 const userService = new UserService();
 
-export const EmailNotificationForm: FC<IEmailNotificationFormProps> = (props) => {
+export function EmailNotificationForm(props: IEmailNotificationFormProps) {
   const { data } = props;
   const { t } = useTranslation();
   // form data
@@ -195,4 +195,4 @@ export const EmailNotificationForm: FC<IEmailNotificationFormProps> = (props) =>
       </div>
     </>
   );
-};
+}
diff --git a/apps/web/core/components/profile/overview/activity.tsx b/apps/web/core/components/profile/overview/activity.tsx
index daed93b91..2740b901a 100644
--- a/apps/web/core/components/profile/overview/activity.tsx
+++ b/apps/web/core/components/profile/overview/activity.tsx
@@ -23,7 +23,7 @@ import { UserService } from "@/services/user.service";
 
 const userService = new UserService();
 
-export const ProfileActivity = observer(() => {
+export const ProfileActivity = observer(function ProfileActivity() {
   const { workspaceSlug, userId } = useParams();
   // store hooks
   const { data: currentUser } = useUser();
diff --git a/apps/web/core/components/profile/overview/priority-distribution.tsx b/apps/web/core/components/profile/overview/priority-distribution.tsx
index 0dc98b4ba..aec29c3b7 100644
--- a/apps/web/core/components/profile/overview/priority-distribution.tsx
+++ b/apps/web/core/components/profile/overview/priority-distribution.tsx
@@ -20,7 +20,7 @@ const priorityColors = {
   none: "#e5e5e5",
 };
 
-export const ProfilePriorityDistribution: React.FC<Props> = ({ userProfile }) => {
+export function ProfilePriorityDistribution({ userProfile }: Props) {
   const { t } = useTranslation();
   return (
     <div className="flex flex-col space-y-2">
@@ -79,4 +79,4 @@ export const ProfilePriorityDistribution: React.FC<Props> = ({ userProfile }) =>
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/profile/overview/state-distribution.tsx b/apps/web/core/components/profile/overview/state-distribution.tsx
index 0ef6a7b5f..bd2ecf864 100644
--- a/apps/web/core/components/profile/overview/state-distribution.tsx
+++ b/apps/web/core/components/profile/overview/state-distribution.tsx
@@ -12,7 +12,7 @@ type Props = {
   userProfile: IUserProfileData | undefined;
 };
 
-export const ProfileStateDistribution: React.FC<Props> = ({ stateDistribution, userProfile }) => {
+export function ProfileStateDistribution({ stateDistribution, userProfile }: Props) {
   const { t } = useTranslation();
   if (!userProfile) return null;
 
@@ -80,4 +80,4 @@ export const ProfileStateDistribution: React.FC<Props> = ({ stateDistribution, u
       </Card>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/profile/overview/stats.tsx b/apps/web/core/components/profile/overview/stats.tsx
index 13bb3c8d8..1c9692d1e 100644
--- a/apps/web/core/components/profile/overview/stats.tsx
+++ b/apps/web/core/components/profile/overview/stats.tsx
@@ -14,7 +14,7 @@ type Props = {
   userProfile: IUserProfileData | undefined;
 };
 
-export const ProfileStats: React.FC<Props> = ({ userProfile }) => {
+export function ProfileStats({ userProfile }: Props) {
   const { workspaceSlug, userId } = useParams();
 
   const { t } = useTranslation();
@@ -68,4 +68,4 @@ export const ProfileStats: React.FC<Props> = ({ userProfile }) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/profile/overview/workload.tsx b/apps/web/core/components/profile/overview/workload.tsx
index d4b6a5d9e..7b0d6de29 100644
--- a/apps/web/core/components/profile/overview/workload.tsx
+++ b/apps/web/core/components/profile/overview/workload.tsx
@@ -10,7 +10,7 @@ type Props = {
   stateDistribution: IUserStateDistribution[];
 };
 
-export const ProfileWorkload: React.FC<Props> = ({ stateDistribution }) => {
+export function ProfileWorkload({ stateDistribution }: Props) {
   const { t } = useTranslation();
 
   return (
@@ -44,4 +44,4 @@ export const ProfileWorkload: React.FC<Props> = ({ stateDistribution }) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/profile/preferences/language-timezone.tsx b/apps/web/core/components/profile/preferences/language-timezone.tsx
index 438f446ca..81e734584 100644
--- a/apps/web/core/components/profile/preferences/language-timezone.tsx
+++ b/apps/web/core/components/profile/preferences/language-timezone.tsx
@@ -7,7 +7,7 @@ import { TimezoneSelect } from "@/components/global";
 import { captureElementAndEvent } from "@/helpers/event-tracker.helper";
 import { useUser, useUserProfile } from "@/hooks/store/user";
 
-export const LanguageTimezone = observer(() => {
+export const LanguageTimezone = observer(function LanguageTimezone() {
   // store hooks
   const {
     data: user,
diff --git a/apps/web/core/components/profile/profile-issues-filter.tsx b/apps/web/core/components/profile/profile-issues-filter.tsx
index 43f08a82b..865bc6346 100644
--- a/apps/web/core/components/profile/profile-issues-filter.tsx
+++ b/apps/web/core/components/profile/profile-issues-filter.tsx
@@ -14,7 +14,7 @@ import { WorkItemFiltersToggle } from "@/components/work-item-filters/filters-to
 // hooks
 import { useIssues } from "@/hooks/store/use-issues";
 
-export const ProfileIssuesFilter = observer(() => {
+export const ProfileIssuesFilter = observer(function ProfileIssuesFilter() {
   // i18n
   const { t } = useTranslation();
   // router
diff --git a/apps/web/core/components/profile/profile-issues.tsx b/apps/web/core/components/profile/profile-issues.tsx
index 5dd9c4d28..c6176f875 100644
--- a/apps/web/core/components/profile/profile-issues.tsx
+++ b/apps/web/core/components/profile/profile-issues.tsx
@@ -19,7 +19,7 @@ type Props = {
   type: "assigned" | "subscribed" | "created";
 };
 
-export const ProfileIssuesPage = observer((props: Props) => {
+export const ProfileIssuesPage = observer(function ProfileIssuesPage(props: Props) {
   const { type } = props;
   const { workspaceSlug, userId } = useParams() as {
     workspaceSlug: string;
diff --git a/apps/web/core/components/profile/profile-setting-content-header.tsx b/apps/web/core/components/profile/profile-setting-content-header.tsx
index 4fded0def..78b7daf23 100644
--- a/apps/web/core/components/profile/profile-setting-content-header.tsx
+++ b/apps/web/core/components/profile/profile-setting-content-header.tsx
@@ -7,7 +7,7 @@ type Props = {
   description?: string;
 };
 
-export const ProfileSettingContentHeader: FC<Props> = (props) => {
+export function ProfileSettingContentHeader(props: Props) {
   const { title, description } = props;
   return (
     <div className="flex flex-col gap-1 pb-4 border-b border-custom-border-100 w-full">
@@ -15,4 +15,4 @@ export const ProfileSettingContentHeader: FC<Props> = (props) => {
       {description && <div className="text-sm font-normal text-custom-text-300">{description}</div>}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/profile/profile-setting-content-wrapper.tsx b/apps/web/core/components/profile/profile-setting-content-wrapper.tsx
index 1a77e19d6..94afb7f2a 100644
--- a/apps/web/core/components/profile/profile-setting-content-wrapper.tsx
+++ b/apps/web/core/components/profile/profile-setting-content-wrapper.tsx
@@ -10,7 +10,7 @@ type Props = {
   className?: string;
 };
 
-export const ProfileSettingContentWrapper: FC<Props> = (props) => {
+export function ProfileSettingContentWrapper(props: Props) {
   const { children, className = "" } = props;
   return (
     <div className="flex h-full flex-col">
@@ -28,4 +28,4 @@ export const ProfileSettingContentWrapper: FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/profile/sidebar.tsx b/apps/web/core/components/profile/sidebar.tsx
index f616220fc..c2deb8178 100644
--- a/apps/web/core/components/profile/sidebar.tsx
+++ b/apps/web/core/components/profile/sidebar.tsx
@@ -33,7 +33,7 @@ type TProfileSidebar = {
   className?: string;
 };
 
-export const ProfileSidebar: FC<TProfileSidebar> = observer((props) => {
+export const ProfileSidebar = observer(function ProfileSidebar(props: TProfileSidebar) {
   const { userProjectsData, className = "" } = props;
   // refs
   const ref = useRef<HTMLDivElement>(null);
diff --git a/apps/web/core/components/profile/start-of-week-preference.tsx b/apps/web/core/components/profile/start-of-week-preference.tsx
index 3574da9b3..b89d4085a 100644
--- a/apps/web/core/components/profile/start-of-week-preference.tsx
+++ b/apps/web/core/components/profile/start-of-week-preference.tsx
@@ -19,7 +19,9 @@ import { PreferencesSection } from "../preferences/section";
 const getStartOfWeekLabel = (startOfWeek: EStartOfTheWeek) =>
   START_OF_THE_WEEK_OPTIONS.find((option) => option.value === startOfWeek)?.label;
 
-export const StartOfWeekPreference = observer((props: { option: { title: string; description: string } }) => {
+export const StartOfWeekPreference = observer(function StartOfWeekPreference(props: {
+  option: { title: string; description: string };
+}) {
   // hooks
   const { data: userProfile, updateUserProfile } = useUserProfile();
 
diff --git a/apps/web/core/components/profile/time.tsx b/apps/web/core/components/profile/time.tsx
index cf2fe7845..99532dacf 100644
--- a/apps/web/core/components/profile/time.tsx
+++ b/apps/web/core/components/profile/time.tsx
@@ -5,7 +5,7 @@ type Props = {
   timeZone: string | undefined;
 };
 
-export const ProfileSidebarTime: React.FC<Props> = (props) => {
+export function ProfileSidebarTime(props: Props) {
   const { timeZone } = props;
   // current time hook
   const { currentTime } = useCurrentTime();
@@ -24,4 +24,4 @@ export const ProfileSidebarTime: React.FC<Props> = (props) => {
       {timeString} <span className="text-custom-text-200">{timeZone}</span>
     </span>
   );
-};
+}
diff --git a/apps/web/core/components/project-states/create-update/create.tsx b/apps/web/core/components/project-states/create-update/create.tsx
index ff516c64f..34646ead5 100644
--- a/apps/web/core/components/project-states/create-update/create.tsx
+++ b/apps/web/core/components/project-states/create-update/create.tsx
@@ -18,7 +18,7 @@ type TStateCreate = {
   handleClose: () => void;
 };
 
-export const StateCreate: FC<TStateCreate> = observer((props) => {
+export const StateCreate = observer(function StateCreate(props: TStateCreate) {
   const { groupKey, shouldTrackEvents, createStateCallback, handleClose } = props;
 
   // states
diff --git a/apps/web/core/components/project-states/create-update/form.tsx b/apps/web/core/components/project-states/create-update/form.tsx
index 7ae08cfa1..01cdaff11 100644
--- a/apps/web/core/components/project-states/create-update/form.tsx
+++ b/apps/web/core/components/project-states/create-update/form.tsx
@@ -15,7 +15,7 @@ type TStateForm = {
   buttonTitle: string;
 };
 
-export const StateForm: FC<TStateForm> = (props) => {
+export function StateForm(props: TStateForm) {
   const { data, onSubmit, onCancel, buttonDisabled, buttonTitle } = props;
   // states
   const [formData, setFromData] = useState<Partial<IState> | undefined>(undefined);
@@ -48,17 +48,16 @@ export const StateForm: FC<TStateForm> = (props) => {
     }
   };
 
-  const PopoverButton = useMemo(
-    () => (
+  const PopoverButton = useMemo(function PopoverButton() {
+    return (
       <div
         className="group inline-flex items-center text-base font-medium focus:outline-none h-5 w-5 rounded transition-all"
         style={{
           backgroundColor: formData?.color ?? "black",
         }}
       />
-    ),
-    [formData?.color]
-  );
+    );
+  });
 
   return (
     <div className="relative flex space-x-2 bg-custom-background-100 p-3 rounded">
@@ -106,4 +105,4 @@ export const StateForm: FC<TStateForm> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/project-states/create-update/update.tsx b/apps/web/core/components/project-states/create-update/update.tsx
index 29b82ea55..242d5541a 100644
--- a/apps/web/core/components/project-states/create-update/update.tsx
+++ b/apps/web/core/components/project-states/create-update/update.tsx
@@ -18,7 +18,7 @@ type TStateUpdate = {
   handleClose: () => void;
 };
 
-export const StateUpdate: FC<TStateUpdate> = observer((props) => {
+export const StateUpdate = observer(function StateUpdate(props: TStateUpdate) {
   const { state, updateStateCallback, shouldTrackEvents, handleClose } = props;
   // states
   const [loader, setLoader] = useState(false);
diff --git a/apps/web/core/components/project-states/group-item.tsx b/apps/web/core/components/project-states/group-item.tsx
index 3ab1340d0..2b56c6992 100644
--- a/apps/web/core/components/project-states/group-item.tsx
+++ b/apps/web/core/components/project-states/group-item.tsx
@@ -27,7 +27,7 @@ type TGroupItem = {
   handleExpand: (groupKey: TStateGroups) => void;
 };
 
-export const GroupItem: FC<TGroupItem> = observer((props) => {
+export const GroupItem = observer(function GroupItem(props: TGroupItem) {
   const {
     groupKey,
     groupedStates,
diff --git a/apps/web/core/components/project-states/group-list.tsx b/apps/web/core/components/project-states/group-list.tsx
index b45897034..33923bdbb 100644
--- a/apps/web/core/components/project-states/group-list.tsx
+++ b/apps/web/core/components/project-states/group-list.tsx
@@ -19,7 +19,7 @@ type TGroupList = {
   stateItemClassName?: string;
 };
 
-export const GroupList: FC<TGroupList> = observer((props) => {
+export const GroupList = observer(function GroupList(props: TGroupList) {
   const {
     groupedStates,
     stateOperationsCallbacks,
diff --git a/apps/web/core/components/project-states/loader.tsx b/apps/web/core/components/project-states/loader.tsx
index 958d0ea9e..300fcea14 100644
--- a/apps/web/core/components/project-states/loader.tsx
+++ b/apps/web/core/components/project-states/loader.tsx
@@ -2,11 +2,13 @@
 
 import { Loader } from "@plane/ui";
 
-export const ProjectStateLoader = () => (
-  <Loader className="space-y-5 md:w-2/3">
-    <Loader.Item height="40px" />
-    <Loader.Item height="40px" />
-    <Loader.Item height="40px" />
-    <Loader.Item height="40px" />
-  </Loader>
-);
+export function ProjectStateLoader() {
+  return (
+    <Loader className="space-y-5 md:w-2/3">
+      <Loader.Item height="40px" />
+      <Loader.Item height="40px" />
+      <Loader.Item height="40px" />
+      <Loader.Item height="40px" />
+    </Loader>
+  );
+}
diff --git a/apps/web/core/components/project-states/options/delete.tsx b/apps/web/core/components/project-states/options/delete.tsx
index 0028010b1..93e7dd09b 100644
--- a/apps/web/core/components/project-states/options/delete.tsx
+++ b/apps/web/core/components/project-states/options/delete.tsx
@@ -23,7 +23,7 @@ type TStateDelete = {
   shouldTrackEvents: boolean;
 };
 
-export const StateDelete: FC<TStateDelete> = observer((props) => {
+export const StateDelete = observer(function StateDelete(props: TStateDelete) {
   const { totalStates, state, deleteStateCallback, shouldTrackEvents } = props;
   // hooks
   const { isMobile } = usePlatformOS();
diff --git a/apps/web/core/components/project-states/options/mark-as-default.tsx b/apps/web/core/components/project-states/options/mark-as-default.tsx
index 5ac4cf95f..1416da285 100644
--- a/apps/web/core/components/project-states/options/mark-as-default.tsx
+++ b/apps/web/core/components/project-states/options/mark-as-default.tsx
@@ -13,7 +13,7 @@ type TStateMarksAsDefault = {
   markStateAsDefaultCallback: TStateOperationsCallbacks["markStateAsDefault"];
 };
 
-export const StateMarksAsDefault: FC<TStateMarksAsDefault> = observer((props) => {
+export const StateMarksAsDefault = observer(function StateMarksAsDefault(props: TStateMarksAsDefault) {
   const { stateId, isDefault, markStateAsDefaultCallback } = props;
   // states
   const [isLoading, setIsLoading] = useState(false);
diff --git a/apps/web/core/components/project-states/root.tsx b/apps/web/core/components/project-states/root.tsx
index 55b5bc4ce..8554c64ab 100644
--- a/apps/web/core/components/project-states/root.tsx
+++ b/apps/web/core/components/project-states/root.tsx
@@ -18,7 +18,7 @@ type TProjectState = {
   projectId: string;
 };
 
-export const ProjectStateRoot: FC<TProjectState> = observer((props) => {
+export const ProjectStateRoot = observer(function ProjectStateRoot(props: TProjectState) {
   const { workspaceSlug, projectId } = props;
   // hooks
   const {
diff --git a/apps/web/core/components/project-states/state-delete-modal.tsx b/apps/web/core/components/project-states/state-delete-modal.tsx
index bcb0ec5f5..ca7579f90 100644
--- a/apps/web/core/components/project-states/state-delete-modal.tsx
+++ b/apps/web/core/components/project-states/state-delete-modal.tsx
@@ -20,7 +20,7 @@ type TStateDeleteModal = {
   data: IState | null;
 };
 
-export const StateDeleteModal: React.FC<TStateDeleteModal> = observer((props) => {
+export const StateDeleteModal = observer(function StateDeleteModal(props: TStateDeleteModal) {
   const { isOpen, onClose, data } = props;
   // states
   const [isDeleteLoading, setIsDeleteLoading] = useState(false);
diff --git a/apps/web/core/components/project-states/state-item-title.tsx b/apps/web/core/components/project-states/state-item-title.tsx
index 714d34ff7..120151728 100644
--- a/apps/web/core/components/project-states/state-item-title.tsx
+++ b/apps/web/core/components/project-states/state-item-title.tsx
@@ -28,7 +28,7 @@ type TDisabledStateItemTitleProps = TBaseStateItemTitleProps & {
 
 export type TStateItemTitleProps = TEnabledStateItemTitleProps | TDisabledStateItemTitleProps;
 
-export const StateItemTitle = observer((props: TStateItemTitleProps) => {
+export const StateItemTitle = observer(function StateItemTitle(props: TStateItemTitleProps) {
   const { stateCount, setUpdateStateModal, disabled, state, shouldShowDescription = true } = props;
   // store hooks
   const { getStatePercentageInGroup } = useProjectState();
diff --git a/apps/web/core/components/project-states/state-item.tsx b/apps/web/core/components/project-states/state-item.tsx
index c8a1cfca2..0022b465d 100644
--- a/apps/web/core/components/project-states/state-item.tsx
+++ b/apps/web/core/components/project-states/state-item.tsx
@@ -25,7 +25,7 @@ type TStateItem = {
   stateItemClassName?: string;
 };
 
-export const StateItem: FC<TStateItem> = observer((props) => {
+export const StateItem = observer(function StateItem(props: TStateItem) {
   const {
     groupKey,
     groupedStates,
diff --git a/apps/web/core/components/project-states/state-list.tsx b/apps/web/core/components/project-states/state-list.tsx
index 03ffd7b8d..5c7eb8587 100644
--- a/apps/web/core/components/project-states/state-list.tsx
+++ b/apps/web/core/components/project-states/state-list.tsx
@@ -16,7 +16,7 @@ type TStateList = {
   stateItemClassName?: string;
 };
 
-export const StateList: FC<TStateList> = observer((props) => {
+export const StateList = observer(function StateList(props: TStateList) {
   const {
     groupKey,
     groupedStates,
diff --git a/apps/web/core/components/project/applied-filters/access.tsx b/apps/web/core/components/project/applied-filters/access.tsx
index 15d8bb14e..87fb97c0d 100644
--- a/apps/web/core/components/project/applied-filters/access.tsx
+++ b/apps/web/core/components/project/applied-filters/access.tsx
@@ -10,7 +10,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedAccessFilters: React.FC<Props> = observer((props) => {
+export const AppliedAccessFilters = observer(function AppliedAccessFilters(props: Props) {
   const { handleRemove, values, editable } = props;
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/project/applied-filters/date.tsx b/apps/web/core/components/project/applied-filters/date.tsx
index e22bfe645..8eb1c2b33 100644
--- a/apps/web/core/components/project/applied-filters/date.tsx
+++ b/apps/web/core/components/project/applied-filters/date.tsx
@@ -11,7 +11,7 @@ type Props = {
   values: string[];
 };
 
-export const AppliedDateFilters: React.FC<Props> = observer((props) => {
+export const AppliedDateFilters = observer(function AppliedDateFilters(props: Props) {
   const { editable, handleRemove, values } = props;
 
   const getDateLabel = (value: string): string => {
diff --git a/apps/web/core/components/project/applied-filters/members.tsx b/apps/web/core/components/project/applied-filters/members.tsx
index 72ea1eef7..05ea6002a 100644
--- a/apps/web/core/components/project/applied-filters/members.tsx
+++ b/apps/web/core/components/project/applied-filters/members.tsx
@@ -15,7 +15,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedMembersFilters: React.FC<Props> = observer((props) => {
+export const AppliedMembersFilters = observer(function AppliedMembersFilters(props: Props) {
   const { handleRemove, values, editable } = props;
   // store hooks
   const {
diff --git a/apps/web/core/components/project/applied-filters/project-display-filters.tsx b/apps/web/core/components/project/applied-filters/project-display-filters.tsx
index c19d88ab8..3ee542aa5 100644
--- a/apps/web/core/components/project/applied-filters/project-display-filters.tsx
+++ b/apps/web/core/components/project/applied-filters/project-display-filters.tsx
@@ -13,7 +13,7 @@ type Props = {
   editable: boolean | undefined;
 };
 
-export const AppliedProjectDisplayFilters: React.FC<Props> = observer((props) => {
+export const AppliedProjectDisplayFilters = observer(function AppliedProjectDisplayFilters(props: Props) {
   const { handleRemove, values, editable } = props;
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/project/applied-filters/root.tsx b/apps/web/core/components/project/applied-filters/root.tsx
index e8ad5535d..104df4fc7 100644
--- a/apps/web/core/components/project/applied-filters/root.tsx
+++ b/apps/web/core/components/project/applied-filters/root.tsx
@@ -27,7 +27,7 @@ type Props = {
 const MEMBERS_FILTERS = ["lead", "members"];
 const DATE_FILTERS = ["created_at"];
 
-export const ProjectAppliedFiltersList: React.FC<Props> = (props) => {
+export function ProjectAppliedFiltersList(props: Props) {
   const { t } = useTranslation();
   const {
     appliedFilters,
@@ -127,4 +127,4 @@ export const ProjectAppliedFiltersList: React.FC<Props> = (props) => {
       </Header.RightItem>
     </Header>
   );
-};
+}
diff --git a/apps/web/core/components/project/card-list.tsx b/apps/web/core/components/project/card-list.tsx
index d4e0ef879..24efb4802 100644
--- a/apps/web/core/components/project/card-list.tsx
+++ b/apps/web/core/components/project/card-list.tsx
@@ -21,7 +21,7 @@ type TProjectCardListProps = {
   filteredProjectIds?: string[];
 };
 
-export const ProjectCardList = observer((props: TProjectCardListProps) => {
+export const ProjectCardList = observer(function ProjectCardList(props: TProjectCardListProps) {
   const { totalProjectIds: totalProjectIdsProps, filteredProjectIds: filteredProjectIdsProps } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/project/card.tsx b/apps/web/core/components/project/card.tsx
index e01fc6593..852fcdeda 100644
--- a/apps/web/core/components/project/card.tsx
+++ b/apps/web/core/components/project/card.tsx
@@ -32,7 +32,7 @@ type Props = {
   project: IProject;
 };
 
-export const ProjectCard: React.FC<Props> = observer((props) => {
+export const ProjectCard = observer(function ProjectCard(props: Props) {
   const { project } = props;
   // states
   const [deleteProjectModalOpen, setDeleteProjectModal] = useState(false);
diff --git a/apps/web/core/components/project/confirm-project-member-remove.tsx b/apps/web/core/components/project/confirm-project-member-remove.tsx
index 34443c28d..4b8da5b29 100644
--- a/apps/web/core/components/project/confirm-project-member-remove.tsx
+++ b/apps/web/core/components/project/confirm-project-member-remove.tsx
@@ -21,7 +21,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const ConfirmProjectMemberRemove: React.FC<Props> = observer((props) => {
+export const ConfirmProjectMemberRemove = observer(function ConfirmProjectMemberRemove(props: Props) {
   const { data, onSubmit, isOpen, onClose } = props;
   // router
   const { projectId } = useParams();
diff --git a/apps/web/core/components/project/create-project-modal.tsx b/apps/web/core/components/project/create-project-modal.tsx
index bd5938c19..e2546fcd5 100644
--- a/apps/web/core/components/project/create-project-modal.tsx
+++ b/apps/web/core/components/project/create-project-modal.tsx
@@ -29,7 +29,7 @@ enum EProjectCreationSteps {
   FEATURE_SELECTION = "FEATURE_SELECTION",
 }
 
-export const CreateProjectModal: FC<Props> = (props) => {
+export function CreateProjectModal(props: Props) {
   const { isOpen, onClose, setToFavorite = false, workspaceSlug, data, templateId } = props;
   // states
   const [currentStep, setCurrentStep] = useState<EProjectCreationSteps>(EProjectCreationSteps.CREATE_PROJECT);
@@ -78,4 +78,4 @@ export const CreateProjectModal: FC<Props> = (props) => {
       )}
     </ModalCore>
   );
-};
+}
diff --git a/apps/web/core/components/project/create/common-attributes.tsx b/apps/web/core/components/project/create/common-attributes.tsx
index aebe7033b..aa4d68036 100644
--- a/apps/web/core/components/project/create/common-attributes.tsx
+++ b/apps/web/core/components/project/create/common-attributes.tsx
@@ -21,7 +21,8 @@ type Props = {
   setIsChangeInIdentifierRequired: (value: boolean) => void;
   handleFormOnChange?: () => void;
 };
-const ProjectCommonAttributes: React.FC<Props> = (props) => {
+
+function ProjectCommonAttributes(props: Props) {
   const { setValue, isMobile, isChangeInIdentifierRequired, setIsChangeInIdentifierRequired, handleFormOnChange } =
     props;
   const {
@@ -146,6 +147,6 @@ const ProjectCommonAttributes: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
 
 export default ProjectCommonAttributes;
diff --git a/apps/web/core/components/project/create/header.tsx b/apps/web/core/components/project/create/header.tsx
index 78570e754..2e9c2a72b 100644
--- a/apps/web/core/components/project/create/header.tsx
+++ b/apps/web/core/components/project/create/header.tsx
@@ -18,7 +18,8 @@ type Props = {
   handleClose: () => void;
   isMobile?: boolean;
 };
-const ProjectCreateHeader: React.FC<Props> = (props) => {
+
+function ProjectCreateHeader(props: Props) {
   const { handleClose, isMobile = false } = props;
   const { watch, control } = useFormContext<IProject>();
   const { t } = useTranslation();
@@ -101,6 +102,6 @@ const ProjectCreateHeader: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
 
 export default ProjectCreateHeader;
diff --git a/apps/web/core/components/project/create/project-create-buttons.tsx b/apps/web/core/components/project/create/project-create-buttons.tsx
index fb85c65da..af17d6a5c 100644
--- a/apps/web/core/components/project/create/project-create-buttons.tsx
+++ b/apps/web/core/components/project/create/project-create-buttons.tsx
@@ -13,7 +13,7 @@ type Props = {
   isMobile?: boolean;
 };
 
-const ProjectCreateButtons: React.FC<Props> = (props) => {
+function ProjectCreateButtons(props: Props) {
   const { t } = useTranslation();
   const { handleClose, isMobile = false } = props;
   const {
@@ -32,6 +32,6 @@ const ProjectCreateButtons: React.FC<Props> = (props) => {
       </Button>
     </div>
   );
-};
+}
 
 export default ProjectCreateButtons;
diff --git a/apps/web/core/components/project/delete-project-modal.tsx b/apps/web/core/components/project/delete-project-modal.tsx
index 15b02a2b2..e9109747d 100644
--- a/apps/web/core/components/project/delete-project-modal.tsx
+++ b/apps/web/core/components/project/delete-project-modal.tsx
@@ -29,7 +29,7 @@ const defaultValues = {
   confirmDelete: "",
 };
 
-export const DeleteProjectModal: React.FC<DeleteProjectModal> = (props) => {
+export function DeleteProjectModal(props: DeleteProjectModal) {
   const { isOpen, project, onClose } = props;
   // store hooks
   const { deleteProject } = useProject();
@@ -198,4 +198,4 @@ export const DeleteProjectModal: React.FC<DeleteProjectModal> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/project/dropdowns/filters/access.tsx b/apps/web/core/components/project/dropdowns/filters/access.tsx
index 7d4043945..ddddc45ad 100644
--- a/apps/web/core/components/project/dropdowns/filters/access.tsx
+++ b/apps/web/core/components/project/dropdowns/filters/access.tsx
@@ -14,7 +14,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterAccess: React.FC<Props> = observer((props) => {
+export const FilterAccess = observer(function FilterAccess(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
   // states
   const [previewEnabled, setPreviewEnabled] = useState(true);
diff --git a/apps/web/core/components/project/dropdowns/filters/created-at.tsx b/apps/web/core/components/project/dropdowns/filters/created-at.tsx
index f0aad2470..16605ba8d 100644
--- a/apps/web/core/components/project/dropdowns/filters/created-at.tsx
+++ b/apps/web/core/components/project/dropdowns/filters/created-at.tsx
@@ -15,7 +15,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterCreatedDate: React.FC<Props> = observer((props) => {
+export const FilterCreatedDate = observer(function FilterCreatedDate(props: Props) {
   const { appliedFilters, handleUpdate, searchQuery } = props;
   // state
   const [previewEnabled, setPreviewEnabled] = useState(true);
diff --git a/apps/web/core/components/project/dropdowns/filters/lead.tsx b/apps/web/core/components/project/dropdowns/filters/lead.tsx
index c067e1757..72e24a37c 100644
--- a/apps/web/core/components/project/dropdowns/filters/lead.tsx
+++ b/apps/web/core/components/project/dropdowns/filters/lead.tsx
@@ -20,7 +20,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterLead: React.FC<Props> = observer((props: Props) => {
+export const FilterLead = observer(function FilterLead(props: Props) {
   const { appliedFilters, handleUpdate, memberIds, searchQuery } = props;
   // states
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/project/dropdowns/filters/member-list.tsx b/apps/web/core/components/project/dropdowns/filters/member-list.tsx
index eb0e6f22e..5849e6dfd 100644
--- a/apps/web/core/components/project/dropdowns/filters/member-list.tsx
+++ b/apps/web/core/components/project/dropdowns/filters/member-list.tsx
@@ -34,11 +34,15 @@ const WORKSPACE_ROLE_OPTIONS: IRoleOption[] = [
 ];
 
 // Role filter group component
-const RoleFilterGroup: React.FC<{
+const RoleFilterGroup = observer(function RoleFilterGroup({
+  appliedFilters,
+  handleUpdate,
+  memberType,
+}: {
   appliedFilters: string[] | null;
   handleUpdate: (role: string) => void;
   memberType: "project" | "workspace";
-}> = observer(({ appliedFilters, handleUpdate, memberType }) => {
+}) {
   const [isExpanded, setIsExpanded] = useState(true);
   const appliedFiltersCount = appliedFilters?.length ?? 0;
   const roleOptions = memberType === "project" ? PROJECT_ROLE_OPTIONS : WORKSPACE_ROLE_OPTIONS;
@@ -70,7 +74,7 @@ const RoleFilterGroup: React.FC<{
   );
 });
 
-export const MemberListFilters: React.FC<Props> = observer((props) => {
+export const MemberListFilters = observer(function MemberListFilters(props: Props) {
   const { appliedFilters, handleUpdate, memberType } = props;
 
   return (
@@ -82,7 +86,7 @@ export const MemberListFilters: React.FC<Props> = observer((props) => {
 });
 
 // Dropdown component for member list filters
-export const MemberListFiltersDropdown: React.FC<Props> = observer((props) => {
+export const MemberListFiltersDropdown = observer(function MemberListFiltersDropdown(props: Props) {
   const { appliedFilters, handleUpdate, memberType } = props;
 
   const appliedFiltersCount = appliedFilters?.length ?? 0;
diff --git a/apps/web/core/components/project/dropdowns/filters/members.tsx b/apps/web/core/components/project/dropdowns/filters/members.tsx
index 7f92ef45a..910856741 100644
--- a/apps/web/core/components/project/dropdowns/filters/members.tsx
+++ b/apps/web/core/components/project/dropdowns/filters/members.tsx
@@ -20,7 +20,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const FilterMembers: React.FC<Props> = observer((props: Props) => {
+export const FilterMembers = observer(function FilterMembers(props: Props) {
   const { appliedFilters, handleUpdate, memberIds, searchQuery } = props;
   // states
   const [itemsToRender, setItemsToRender] = useState(5);
diff --git a/apps/web/core/components/project/dropdowns/filters/root.tsx b/apps/web/core/components/project/dropdowns/filters/root.tsx
index 16784f9fd..fa547c3f9 100644
--- a/apps/web/core/components/project/dropdowns/filters/root.tsx
+++ b/apps/web/core/components/project/dropdowns/filters/root.tsx
@@ -22,7 +22,7 @@ type Props = {
   memberIds?: string[] | undefined;
 };
 
-export const ProjectFiltersSelection: React.FC<Props> = observer((props) => {
+export const ProjectFiltersSelection = observer(function ProjectFiltersSelection(props: Props) {
   const { displayFilters, filters, handleFiltersUpdate, handleDisplayFiltersUpdate, memberIds } = props;
   // states
   const [filtersSearchQuery, setFiltersSearchQuery] = useState("");
diff --git a/apps/web/core/components/project/dropdowns/order-by.tsx b/apps/web/core/components/project/dropdowns/order-by.tsx
index c474acf5e..3f0874104 100644
--- a/apps/web/core/components/project/dropdowns/order-by.tsx
+++ b/apps/web/core/components/project/dropdowns/order-by.tsx
@@ -21,7 +21,7 @@ type Props = {
 
 const DISABLED_ORDERING_OPTIONS = ["sort_order"];
 
-export const ProjectOrderByDropdown: React.FC<Props> = (props) => {
+export function ProjectOrderByDropdown(props: Props) {
   const { onChange, value, isMobile = false } = props;
   const { t } = useTranslation();
 
@@ -90,4 +90,4 @@ export const ProjectOrderByDropdown: React.FC<Props> = (props) => {
       </CustomMenu.MenuItem>
     </CustomMenu>
   );
-};
+}
diff --git a/apps/web/core/components/project/empty-state.tsx b/apps/web/core/components/project/empty-state.tsx
index 28576ed8e..d7bbc279d 100644
--- a/apps/web/core/components/project/empty-state.tsx
+++ b/apps/web/core/components/project/empty-state.tsx
@@ -17,35 +17,30 @@ type Props = {
   disabled?: boolean;
 };
 
-export const EmptyState: React.FC<Props> = ({
-  title,
-  description,
-  image,
-  primaryButton,
-  secondaryButton,
-  disabled = false,
-}) => (
-  <div className="flex h-full w-full items-center justify-center px-5 md:px-10 lg:p-20">
-    <div className="relative h-full w-full max-w-6xl">
-      <img src={image} className="w-52 sm:w-60 object-cover" alt={primaryButton?.text ?? ""} />
-    </div>
-    <div className="absolute flex w-full flex-col items-center pt-[30vh] text-center md:pt-[35vh] lg:pt-[45vh]">
-      <h6 className="mt-6 text-xl font-semibold">{title}</h6>
-      {description && <p className="mb-7 text-custom-text-300">{description}</p>}
-      <div className="flex items-center gap-4">
-        {primaryButton && (
-          <Button
-            size="lg"
-            variant="primary"
-            prependIcon={primaryButton.icon}
-            onClick={primaryButton.onClick}
-            disabled={disabled}
-          >
-            {primaryButton.text}
-          </Button>
-        )}
-        {secondaryButton}
+export function EmptyState({ title, description, image, primaryButton, secondaryButton, disabled = false }: Props) {
+  return (
+    <div className="flex h-full w-full items-center justify-center px-5 md:px-10 lg:p-20">
+      <div className="relative h-full w-full max-w-6xl">
+        <img src={image} className="w-52 sm:w-60 object-cover" alt={primaryButton?.text ?? ""} />
+      </div>
+      <div className="absolute flex w-full flex-col items-center pt-[30vh] text-center md:pt-[35vh] lg:pt-[45vh]">
+        <h6 className="mt-6 text-xl font-semibold">{title}</h6>
+        {description && <p className="mb-7 text-custom-text-300">{description}</p>}
+        <div className="flex items-center gap-4">
+          {primaryButton && (
+            <Button
+              size="lg"
+              variant="primary"
+              prependIcon={primaryButton.icon}
+              onClick={primaryButton.onClick}
+              disabled={disabled}
+            >
+              {primaryButton.text}
+            </Button>
+          )}
+          {secondaryButton}
+        </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/project/filters.tsx b/apps/web/core/components/project/filters.tsx
index da2e7db29..09620729e 100644
--- a/apps/web/core/components/project/filters.tsx
+++ b/apps/web/core/components/project/filters.tsx
@@ -22,7 +22,12 @@ type Props = {
   isMobile?: boolean;
 };
 
-const HeaderFilters = observer(({ filterMenuButton, isMobile, classname = "", filterClassname = "" }: Props) => {
+const HeaderFilters = observer(function HeaderFilters({
+  filterMenuButton,
+  isMobile,
+  classname = "",
+  filterClassname = "",
+}: Props) {
   // i18n
   const { t } = useTranslation();
   // router
diff --git a/apps/web/core/components/project/form-loader.tsx b/apps/web/core/components/project/form-loader.tsx
index 433a5beef..78f9c8ffa 100644
--- a/apps/web/core/components/project/form-loader.tsx
+++ b/apps/web/core/components/project/form-loader.tsx
@@ -4,59 +4,61 @@ import type { FC } from "react";
 // components
 import { Loader } from "@plane/ui";
 
-export const ProjectDetailsFormLoader: FC = () => (
-  <>
-    <div className="relative mt-6 h-44 w-full">
-      <Loader>
-        <Loader.Item height="auto" width="46px" />
-      </Loader>
-      <div className="absolute bottom-4 flex w-full items-end justify-between gap-3 px-4">
-        <div className="flex flex-grow gap-3 truncate">
-          <div className="flex h-[52px] w-[52px] flex-shrink-0 items-center justify-center rounded-lg bg-custom-background-90">
+export function ProjectDetailsFormLoader() {
+  return (
+    <>
+      <div className="relative mt-6 h-44 w-full">
+        <Loader>
+          <Loader.Item height="auto" width="46px" />
+        </Loader>
+        <div className="absolute bottom-4 flex w-full items-end justify-between gap-3 px-4">
+          <div className="flex flex-grow gap-3 truncate">
+            <div className="flex h-[52px] w-[52px] flex-shrink-0 items-center justify-center rounded-lg bg-custom-background-90">
+              <Loader>
+                <Loader.Item height="46px" width="46px" />
+              </Loader>
+            </div>
+          </div>
+          <div className="flex flex-shrink-0 justify-center">
             <Loader>
-              <Loader.Item height="46px" width="46px" />
+              <Loader.Item height="32px" width="108px" />
             </Loader>
           </div>
         </div>
-        <div className="flex flex-shrink-0 justify-center">
+      </div>
+      <div className="my-8 flex flex-col gap-8">
+        <div className="flex flex-col gap-1">
+          <h4 className="text-sm">Project name</h4>
           <Loader>
-            <Loader.Item height="32px" width="108px" />
-          </Loader>
-        </div>
-      </div>
-    </div>
-    <div className="my-8 flex flex-col gap-8">
-      <div className="flex flex-col gap-1">
-        <h4 className="text-sm">Project name</h4>
-        <Loader>
-          <Loader.Item height="46px" width="100%" />
-        </Loader>
-      </div>
-      <div className="flex flex-col gap-1">
-        <h4 className="text-sm">Description</h4>
-        <Loader className="w-full">
-          <Loader.Item height="102px" width="full" />
-        </Loader>
-      </div>
-      <div className="flex w-full items-center justify-between gap-10">
-        <div className="flex w-1/2 flex-col gap-1">
-          <h4 className="text-sm">Identifier</h4>
-          <Loader>
-            <Loader.Item height="36px" width="100%" />
-          </Loader>
-        </div>
-        <div className="flex w-1/2 flex-col gap-1">
-          <h4 className="text-sm">Network</h4>
-          <Loader className="w-full">
             <Loader.Item height="46px" width="100%" />
           </Loader>
         </div>
+        <div className="flex flex-col gap-1">
+          <h4 className="text-sm">Description</h4>
+          <Loader className="w-full">
+            <Loader.Item height="102px" width="full" />
+          </Loader>
+        </div>
+        <div className="flex w-full items-center justify-between gap-10">
+          <div className="flex w-1/2 flex-col gap-1">
+            <h4 className="text-sm">Identifier</h4>
+            <Loader>
+              <Loader.Item height="36px" width="100%" />
+            </Loader>
+          </div>
+          <div className="flex w-1/2 flex-col gap-1">
+            <h4 className="text-sm">Network</h4>
+            <Loader className="w-full">
+              <Loader.Item height="46px" width="100%" />
+            </Loader>
+          </div>
+        </div>
+        <div className="flex items-center justify-between py-2">
+          <Loader className="mt-2 w-full">
+            <Loader.Item height="34px" width="100px" />
+          </Loader>
+        </div>
       </div>
-      <div className="flex items-center justify-between py-2">
-        <Loader className="mt-2 w-full">
-          <Loader.Item height="34px" width="100px" />
-        </Loader>
-      </div>
-    </div>
-  </>
-);
+    </>
+  );
+}
diff --git a/apps/web/core/components/project/form.tsx b/apps/web/core/components/project/form.tsx
index b534a93d8..b0e255ca2 100644
--- a/apps/web/core/components/project/form.tsx
+++ b/apps/web/core/components/project/form.tsx
@@ -33,7 +33,7 @@ export interface IProjectDetailsForm {
   isAdmin: boolean;
 }
 const projectService = new ProjectService();
-export const ProjectDetailsForm: FC<IProjectDetailsForm> = (props) => {
+export function ProjectDetailsForm(props: IProjectDetailsForm) {
   const { project, workspaceSlug, projectId, isAdmin } = props;
   const { t } = useTranslation();
   // states
@@ -440,4 +440,4 @@ export const ProjectDetailsForm: FC<IProjectDetailsForm> = (props) => {
       </div>
     </form>
   );
-};
+}
diff --git a/apps/web/core/components/project/header.tsx b/apps/web/core/components/project/header.tsx
index 3d48e4e5d..46b62cb98 100644
--- a/apps/web/core/components/project/header.tsx
+++ b/apps/web/core/components/project/header.tsx
@@ -19,7 +19,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 import HeaderFilters from "./filters";
 import { ProjectSearch } from "./search-projects";
 
-export const ProjectsBaseHeader = observer(() => {
+export const ProjectsBaseHeader = observer(function ProjectsBaseHeader() {
   // i18n
   const { t } = useTranslation();
   // store hooks
diff --git a/apps/web/core/components/project/integration-card.tsx b/apps/web/core/components/project/integration-card.tsx
index 28d491b96..462307601 100644
--- a/apps/web/core/components/project/integration-card.tsx
+++ b/apps/web/core/components/project/integration-card.tsx
@@ -33,7 +33,7 @@ const integrationDetails: { [key: string]: any } = {
 // services
 const projectService = new ProjectService();
 
-export const IntegrationCard: React.FC<Props> = ({ integration }) => {
+export function IntegrationCard({ integration }: Props) {
   const { workspaceSlug, projectId } = useParams();
 
   const { data: syncedGithubRepository } = useSWR(
@@ -120,4 +120,4 @@ export const IntegrationCard: React.FC<Props> = ({ integration }) => {
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/project/join-project-modal.tsx b/apps/web/core/components/project/join-project-modal.tsx
index d4ee8ae10..396c029ec 100644
--- a/apps/web/core/components/project/join-project-modal.tsx
+++ b/apps/web/core/components/project/join-project-modal.tsx
@@ -20,7 +20,7 @@ type TJoinProjectModalProps = {
   handleClose: () => void;
 };
 
-export const JoinProjectModal: React.FC<TJoinProjectModalProps> = (props) => {
+export function JoinProjectModal(props: TJoinProjectModalProps) {
   const { handleClose, isOpen, project, workspaceSlug } = props;
   // states
   const [isJoiningLoading, setIsJoiningLoading] = useState(false);
@@ -104,4 +104,4 @@ export const JoinProjectModal: React.FC<TJoinProjectModalProps> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/project/leave-project-modal.tsx b/apps/web/core/components/project/leave-project-modal.tsx
index 436927a43..fd71b89a2 100644
--- a/apps/web/core/components/project/leave-project-modal.tsx
+++ b/apps/web/core/components/project/leave-project-modal.tsx
@@ -37,7 +37,7 @@ export interface ILeaveProjectModal {
   onClose: () => void;
 }
 
-export const LeaveProjectModal: FC<ILeaveProjectModal> = observer((props) => {
+export const LeaveProjectModal = observer(function LeaveProjectModal(props: ILeaveProjectModal) {
   const { project, isOpen, onClose } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/project/member-header-column.tsx b/apps/web/core/components/project/member-header-column.tsx
index 63b4464e2..f29108724 100644
--- a/apps/web/core/components/project/member-header-column.tsx
+++ b/apps/web/core/components/project/member-header-column.tsx
@@ -16,7 +16,7 @@ interface Props {
   handleDisplayFilterUpdate: (data: Partial<IMemberFilters>) => void;
 }
 
-export const MemberHeaderColumn = observer((props: Props) => {
+export const MemberHeaderColumn = observer(function MemberHeaderColumn(props: Props) {
   const { displayFilters, handleDisplayFilterUpdate, property } = props;
   // i18n
   const { t } = useTranslation();
diff --git a/apps/web/core/components/project/member-list-item.tsx b/apps/web/core/components/project/member-list-item.tsx
index 2d3a23516..58ee1ca33 100644
--- a/apps/web/core/components/project/member-list-item.tsx
+++ b/apps/web/core/components/project/member-list-item.tsx
@@ -24,7 +24,7 @@ type Props = {
   workspaceSlug: string;
 };
 
-export const ProjectMemberListItem: React.FC<Props> = observer((props) => {
+export const ProjectMemberListItem = observer(function ProjectMemberListItem(props: Props) {
   const { memberDetails, projectId, workspaceSlug } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/project/member-list.tsx b/apps/web/core/components/project/member-list.tsx
index 8f527b475..4e69a48c8 100644
--- a/apps/web/core/components/project/member-list.tsx
+++ b/apps/web/core/components/project/member-list.tsx
@@ -22,7 +22,7 @@ type TProjectMemberListProps = {
   workspaceSlug: string;
 };
 
-export const ProjectMemberList: React.FC<TProjectMemberListProps> = observer((props) => {
+export const ProjectMemberList = observer(function ProjectMemberList(props: TProjectMemberListProps) {
   const { projectId, workspaceSlug } = props;
   // states
   const [inviteModal, setInviteModal] = useState(false);
diff --git a/apps/web/core/components/project/member-select.tsx b/apps/web/core/components/project/member-select.tsx
index 3866fa89f..b0f61602d 100644
--- a/apps/web/core/components/project/member-select.tsx
+++ b/apps/web/core/components/project/member-select.tsx
@@ -18,7 +18,7 @@ type Props = {
   isDisabled?: boolean;
 };
 
-export const MemberSelect: React.FC<Props> = observer((props) => {
+export const MemberSelect = observer(function MemberSelect(props: Props) {
   const { value, onChange, isDisabled = false } = props;
   // router
   const { projectId } = useParams();
diff --git a/apps/web/core/components/project/multi-select-modal.tsx b/apps/web/core/components/project/multi-select-modal.tsx
index d2bc1cd52..56804d05a 100644
--- a/apps/web/core/components/project/multi-select-modal.tsx
+++ b/apps/web/core/components/project/multi-select-modal.tsx
@@ -27,7 +27,7 @@ type Props = {
   onSubmit: (projectIds: string[]) => Promise<void>;
 };
 
-export const ProjectMultiSelectModal: React.FC<Props> = observer((props) => {
+export const ProjectMultiSelectModal = observer(function ProjectMultiSelectModal(props: Props) {
   const { isOpen, onClose, selectedProjectIds: selectedProjectIdsProp, projectIds, onSubmit } = props;
   // states
   const [searchTerm, setSearchTerm] = useState("");
diff --git a/apps/web/core/components/project/project-feature-update.tsx b/apps/web/core/components/project/project-feature-update.tsx
index f2d7e9b86..5db6dbade 100644
--- a/apps/web/core/components/project/project-feature-update.tsx
+++ b/apps/web/core/components/project/project-feature-update.tsx
@@ -21,7 +21,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const ProjectFeatureUpdate: FC<Props> = observer((props) => {
+export const ProjectFeatureUpdate = observer(function ProjectFeatureUpdate(props: Props) {
   const { workspaceSlug, projectId, onClose } = props;
   // store hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/project/project-network-icon.tsx b/apps/web/core/components/project/project-network-icon.tsx
index d6f99972b..5d9f592d3 100644
--- a/apps/web/core/components/project/project-network-icon.tsx
+++ b/apps/web/core/components/project/project-network-icon.tsx
@@ -8,7 +8,7 @@ type Props = {
   className?: string;
 };
 
-export const ProjectNetworkIcon = (props: Props) => {
+export function ProjectNetworkIcon(props: Props) {
   const { iconKey, className } = props;
   // Get the icon key
   const getProjectNetworkIcon = () => {
@@ -27,4 +27,4 @@ export const ProjectNetworkIcon = (props: Props) => {
   if (!Icon) return null;
 
   return <Icon className={cn("h-3 w-3", className)} />;
-};
+}
diff --git a/apps/web/core/components/project/project-settings-member-defaults.tsx b/apps/web/core/components/project/project-settings-member-defaults.tsx
index a2f5e76ac..d25f629c8 100644
--- a/apps/web/core/components/project/project-settings-member-defaults.tsx
+++ b/apps/web/core/components/project/project-settings-member-defaults.tsx
@@ -1,5 +1,4 @@
 "use client";
-
 import type { ReactNode } from "react";
 import { useEffect } from "react";
 import { observer } from "mobx-react";
@@ -30,22 +29,26 @@ type TDefaultSettingItemProps = {
   children: ReactNode;
 };
 
-const DefaultSettingItem: React.FC<TDefaultSettingItemProps> = ({ title, description, children }) => (
-  <div className="flex items-center justify-between gap-x-2">
-    <div className="flex flex-col gap-0.5">
-      <h4 className="text-sm font-medium">{title}</h4>
-      <p className="text-xs text-custom-text-300">{description}</p>
+function DefaultSettingItem({ title, description, children }: TDefaultSettingItemProps) {
+  return (
+    <div className="flex items-center justify-between gap-x-2">
+      <div className="flex flex-col gap-0.5">
+        <h4 className="text-sm font-medium">{title}</h4>
+        <p className="text-xs text-custom-text-300">{description}</p>
+      </div>
+      <div className="w-full max-w-48 sm:max-w-64">{children}</div>
     </div>
-    <div className="w-full max-w-48 sm:max-w-64">{children}</div>
-  </div>
-);
+  );
+}
 
 type TProjectSettingsMemberDefaultsProps = {
   workspaceSlug: string;
   projectId: string;
 };
 
-export const ProjectSettingsMemberDefaults: React.FC<TProjectSettingsMemberDefaultsProps> = observer((props) => {
+export const ProjectSettingsMemberDefaults = observer(function ProjectSettingsMemberDefaults(
+  props: TProjectSettingsMemberDefaultsProps
+) {
   const { workspaceSlug, projectId } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/project/publish-project/modal.tsx b/apps/web/core/components/project/publish-project/modal.tsx
index a69a419f2..7f38204ff 100644
--- a/apps/web/core/components/project/publish-project/modal.tsx
+++ b/apps/web/core/components/project/publish-project/modal.tsx
@@ -42,7 +42,7 @@ const VIEW_OPTIONS: {
   { key: "kanban", label: "Kanban" },
 ];
 
-export const PublishProjectModal: React.FC<Props> = observer((props) => {
+export const PublishProjectModal = observer(function PublishProjectModal(props: Props) {
   const { isOpen, onClose, projectId } = props;
   // states
   const [isUnPublishing, setIsUnPublishing] = useState(false);
diff --git a/apps/web/core/components/project/root.tsx b/apps/web/core/components/project/root.tsx
index 02e9a8e4a..4e1b874d4 100644
--- a/apps/web/core/components/project/root.tsx
+++ b/apps/web/core/components/project/root.tsx
@@ -17,7 +17,7 @@ import { useWorkspace } from "@/hooks/store/use-workspace";
 import { ProjectAppliedFiltersList } from "./applied-filters";
 import { ProjectCardList } from "./card-list";
 
-export const ProjectRoot = observer(() => {
+export const ProjectRoot = observer(function ProjectRoot() {
   const { currentWorkspace } = useWorkspace();
   const { workspaceSlug } = useParams();
   const pathname = usePathname();
diff --git a/apps/web/core/components/project/search-projects.tsx b/apps/web/core/components/project/search-projects.tsx
index 273161e0a..6b81e311c 100644
--- a/apps/web/core/components/project/search-projects.tsx
+++ b/apps/web/core/components/project/search-projects.tsx
@@ -14,7 +14,7 @@ import { cn } from "@plane/utils";
 // hooks
 import { useProjectFilter } from "@/hooks/store/use-project-filter";
 
-export const ProjectSearch: FC = observer(() => {
+export const ProjectSearch = observer(function ProjectSearch() {
   // i18n
   const { t } = useTranslation();
   // hooks
diff --git a/apps/web/core/components/project/send-project-invitation-modal.tsx b/apps/web/core/components/project/send-project-invitation-modal.tsx
index e3b4e1fe5..6dbfb4cfe 100644
--- a/apps/web/core/components/project/send-project-invitation-modal.tsx
+++ b/apps/web/core/components/project/send-project-invitation-modal.tsx
@@ -45,7 +45,7 @@ const defaultValues: FormValues = {
   ],
 };
 
-export const SendProjectInvitationModal: React.FC<Props> = observer((props) => {
+export const SendProjectInvitationModal = observer(function SendProjectInvitationModal(props: Props) {
   const { isOpen, onClose, onSuccess, projectId, workspaceSlug } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/project/settings/archive-project/archive-restore-modal.tsx b/apps/web/core/components/project/settings/archive-project/archive-restore-modal.tsx
index 1bac08145..221a536b9 100644
--- a/apps/web/core/components/project/settings/archive-project/archive-restore-modal.tsx
+++ b/apps/web/core/components/project/settings/archive-project/archive-restore-modal.tsx
@@ -18,7 +18,7 @@ type Props = {
   archive: boolean;
 };
 
-export const ArchiveRestoreProjectModal: React.FC<Props> = (props) => {
+export function ArchiveRestoreProjectModal(props: Props) {
   const { workspaceSlug, projectId, isOpen, onClose, archive } = props;
   // router
   const router = useAppRouter();
@@ -136,4 +136,4 @@ export const ArchiveRestoreProjectModal: React.FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/project/settings/archive-project/selection.tsx b/apps/web/core/components/project/settings/archive-project/selection.tsx
index b21ab7400..6cc7b1e4c 100644
--- a/apps/web/core/components/project/settings/archive-project/selection.tsx
+++ b/apps/web/core/components/project/settings/archive-project/selection.tsx
@@ -14,7 +14,7 @@ export interface IArchiveProject {
   handleArchive: () => void;
 }
 
-export const ArchiveProjectSelection: React.FC<IArchiveProject> = (props) => {
+export function ArchiveProjectSelection(props: IArchiveProject) {
   const { projectDetails, handleArchive } = props;
 
   return (
@@ -60,4 +60,4 @@ export const ArchiveProjectSelection: React.FC<IArchiveProject> = (props) => {
       )}
     </Disclosure>
   );
-};
+}
diff --git a/apps/web/core/components/project/settings/delete-project-section.tsx b/apps/web/core/components/project/settings/delete-project-section.tsx
index 30b578247..27e2c9b01 100644
--- a/apps/web/core/components/project/settings/delete-project-section.tsx
+++ b/apps/web/core/components/project/settings/delete-project-section.tsx
@@ -15,7 +15,7 @@ export interface IDeleteProjectSection {
   handleDelete: () => void;
 }
 
-export const DeleteProjectSection: React.FC<IDeleteProjectSection> = (props) => {
+export function DeleteProjectSection(props: IDeleteProjectSection) {
   const { projectDetails, handleDelete } = props;
 
   return (
@@ -66,4 +66,4 @@ export const DeleteProjectSection: React.FC<IDeleteProjectSection> = (props) =>
       )}
     </Disclosure>
   );
-};
+}
diff --git a/apps/web/core/components/project/settings/features-list.tsx b/apps/web/core/components/project/settings/features-list.tsx
index 8024def86..c7f7df3c7 100644
--- a/apps/web/core/components/project/settings/features-list.tsx
+++ b/apps/web/core/components/project/settings/features-list.tsx
@@ -26,7 +26,7 @@ type Props = {
   isAdmin: boolean;
 };
 
-export const ProjectFeaturesList: FC<Props> = observer((props) => {
+export const ProjectFeaturesList = observer(function ProjectFeaturesList(props: Props) {
   const { workspaceSlug, projectId, isAdmin } = props;
   // store hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/project/settings/helper.tsx b/apps/web/core/components/project/settings/helper.tsx
index 23a0db53b..b88dbd5db 100644
--- a/apps/web/core/components/project/settings/helper.tsx
+++ b/apps/web/core/components/project/settings/helper.tsx
@@ -15,7 +15,7 @@ type Props = {
   disabled?: boolean;
 };
 
-export const ProjectFeatureToggle = (props: Props) => {
+export function ProjectFeatureToggle(props: Props) {
   const { workspaceSlug, projectId, featureItem, value, handleSubmit, disabled } = props;
   return featureItem.href ? (
     <Link href={joinUrlPath(workspaceSlug, "settings", "projects", projectId, "features", featureItem.href)}>
@@ -39,4 +39,4 @@ export const ProjectFeatureToggle = (props: Props) => {
       data-ph-element={PROJECT_TRACKER_ELEMENTS.TOGGLE_FEATURE}
     />
   );
-};
+}
diff --git a/apps/web/core/components/project/settings/member-columns.tsx b/apps/web/core/components/project/settings/member-columns.tsx
index 298b9a38b..9ccec385d 100644
--- a/apps/web/core/components/project/settings/member-columns.tsx
+++ b/apps/web/core/components/project/settings/member-columns.tsx
@@ -32,7 +32,7 @@ type AccountTypeProps = {
   projectId: string;
 };
 
-export const NameColumn: React.FC<NameProps> = (props) => {
+export function NameColumn(props: NameProps) {
   const { rowData, workspaceSlug, isAdmin, currentUser, setRemoveMemberModal } = props;
   // derived values
   const { avatar_url, display_name, email, first_name, id, last_name } = rowData.member;
@@ -86,9 +86,9 @@ export const NameColumn: React.FC<NameProps> = (props) => {
       )}
     </Disclosure>
   );
-};
+}
 
-export const AccountTypeColumn: React.FC<AccountTypeProps> = observer((props) => {
+export const AccountTypeColumn = observer(function AccountTypeColumn(props: AccountTypeProps) {
   const { rowData, projectId, workspaceSlug } = props;
   // store hooks
   const {
diff --git a/apps/web/core/components/readonly/cycle.tsx b/apps/web/core/components/readonly/cycle.tsx
index 451a3c6ec..7ef535570 100644
--- a/apps/web/core/components/readonly/cycle.tsx
+++ b/apps/web/core/components/readonly/cycle.tsx
@@ -18,7 +18,7 @@ export type TReadonlyCycleProps = {
   workspaceSlug: string;
 };
 
-export const ReadonlyCycle: React.FC<TReadonlyCycleProps> = observer((props) => {
+export const ReadonlyCycle = observer(function ReadonlyCycle(props: TReadonlyCycleProps) {
   const { className, hideIcon = false, value, placeholder, projectId, workspaceSlug } = props;
 
   const { t } = useTranslation();
diff --git a/apps/web/core/components/readonly/date.tsx b/apps/web/core/components/readonly/date.tsx
index f5be3cbff..ff01400ef 100644
--- a/apps/web/core/components/readonly/date.tsx
+++ b/apps/web/core/components/readonly/date.tsx
@@ -14,7 +14,7 @@ export type TReadonlyDateProps = {
   formatToken?: string;
 };
 
-export const ReadonlyDate: React.FC<TReadonlyDateProps> = observer((props) => {
+export const ReadonlyDate = observer(function ReadonlyDate(props: TReadonlyDateProps) {
   const { className, hideIcon = false, value, placeholder, formatToken } = props;
 
   const { t } = useTranslation();
diff --git a/apps/web/core/components/readonly/estimate.tsx b/apps/web/core/components/readonly/estimate.tsx
index e67ee7408..414f0f76b 100644
--- a/apps/web/core/components/readonly/estimate.tsx
+++ b/apps/web/core/components/readonly/estimate.tsx
@@ -19,7 +19,7 @@ export type TReadonlyEstimateProps = {
   workspaceSlug: string;
 };
 
-export const ReadonlyEstimate: React.FC<TReadonlyEstimateProps> = observer((props) => {
+export const ReadonlyEstimate = observer(function ReadonlyEstimate(props: TReadonlyEstimateProps) {
   const { className, hideIcon = false, value, placeholder, projectId, workspaceSlug } = props;
 
   const { t } = useTranslation();
diff --git a/apps/web/core/components/readonly/labels.tsx b/apps/web/core/components/readonly/labels.tsx
index 87c254e57..7a5d90029 100644
--- a/apps/web/core/components/readonly/labels.tsx
+++ b/apps/web/core/components/readonly/labels.tsx
@@ -18,7 +18,7 @@ export type TReadonlyLabelsProps = {
   workspaceSlug: string;
 };
 
-export const ReadonlyLabels: React.FC<TReadonlyLabelsProps> = observer((props) => {
+export const ReadonlyLabels = observer(function ReadonlyLabels(props: TReadonlyLabelsProps) {
   const { className, value, projectId, workspaceSlug } = props;
 
   const { getLabelById, fetchProjectLabels } = useLabel();
diff --git a/apps/web/core/components/readonly/member.tsx b/apps/web/core/components/readonly/member.tsx
index ff9198e03..f4da66728 100644
--- a/apps/web/core/components/readonly/member.tsx
+++ b/apps/web/core/components/readonly/member.tsx
@@ -20,7 +20,7 @@ export type TReadonlyMemberProps = {
   projectId?: string;
 };
 
-export const ReadonlyMember: React.FC<TReadonlyMemberProps> = observer((props) => {
+export const ReadonlyMember = observer(function ReadonlyMember(props: TReadonlyMemberProps) {
   const { className, icon: Icon, hideIcon = false, value, placeholder, multiple = false } = props;
 
   const { t } = useTranslation();
diff --git a/apps/web/core/components/readonly/module.tsx b/apps/web/core/components/readonly/module.tsx
index ce248145c..b92e86c1f 100644
--- a/apps/web/core/components/readonly/module.tsx
+++ b/apps/web/core/components/readonly/module.tsx
@@ -20,7 +20,7 @@ export type TReadonlyModuleProps = {
   workspaceSlug: string;
 };
 
-export const ReadonlyModule: React.FC<TReadonlyModuleProps> = observer((props) => {
+export const ReadonlyModule = observer(function ReadonlyModule(props: TReadonlyModuleProps) {
   const {
     className,
     hideIcon = false,
diff --git a/apps/web/core/components/readonly/priority.tsx b/apps/web/core/components/readonly/priority.tsx
index f7a75e51e..cfed463dd 100644
--- a/apps/web/core/components/readonly/priority.tsx
+++ b/apps/web/core/components/readonly/priority.tsx
@@ -15,7 +15,7 @@ export type TReadonlyPriorityProps = {
   placeholder?: string;
 };
 
-export const ReadonlyPriority: React.FC<TReadonlyPriorityProps> = observer((props) => {
+export const ReadonlyPriority = observer(function ReadonlyPriority(props: TReadonlyPriorityProps) {
   const { className, hideIcon = false, value, placeholder } = props;
 
   const { t } = useTranslation();
diff --git a/apps/web/core/components/readonly/state.tsx b/apps/web/core/components/readonly/state.tsx
index 13c7f98b6..8a7f467f5 100644
--- a/apps/web/core/components/readonly/state.tsx
+++ b/apps/web/core/components/readonly/state.tsx
@@ -20,7 +20,7 @@ export type TReadonlyStateProps = {
   workspaceSlug: string;
 };
 
-export const ReadonlyState: React.FC<TReadonlyStateProps> = observer((props) => {
+export const ReadonlyState = observer(function ReadonlyState(props: TReadonlyStateProps) {
   const { className, iconSize = "size-4", hideIcon = false, value, placeholder, projectId, workspaceSlug } = props;
   // states
   const [stateLoader, setStateLoader] = useState(false);
diff --git a/apps/web/core/components/rich-filters/add-filters/button.tsx b/apps/web/core/components/rich-filters/add-filters/button.tsx
index cef5e7145..9809507fa 100644
--- a/apps/web/core/components/rich-filters/add-filters/button.tsx
+++ b/apps/web/core/components/rich-filters/add-filters/button.tsx
@@ -26,48 +26,48 @@ export type TAddFilterButtonProps<P extends TFilterProperty, E extends TExternal
   onFilterSelect?: (id: string) => void;
 };
 
-export const AddFilterButton = observer(
-  <P extends TFilterProperty, E extends TExternalFilter>(props: TAddFilterButtonProps<P, E>) => {
-    const { filter, buttonConfig, onFilterSelect } = props;
-    const {
-      variant = "link-neutral",
-      className,
-      label,
-      iconConfig = { shouldShowIcon: true },
-      isDisabled = false,
-    } = buttonConfig || {};
-    // derived values
-    const FilterIcon = iconConfig.iconComponent || ListFilter;
+export const AddFilterButton = observer(function AddFilterButton<P extends TFilterProperty, E extends TExternalFilter>(
+  props: TAddFilterButtonProps<P, E>
+) {
+  const { filter, buttonConfig, onFilterSelect } = props;
+  const {
+    variant = "link-neutral",
+    className,
+    label,
+    iconConfig = { shouldShowIcon: true },
+    isDisabled = false,
+  } = buttonConfig || {};
+  // derived values
+  const FilterIcon = iconConfig.iconComponent || ListFilter;
 
-    const handleFilterSelect = (property: P, operator: TSupportedOperators, isNegation: boolean) => {
-      filter.addCondition(
-        LOGICAL_OPERATOR.AND,
-        {
-          property,
-          operator,
-          value: undefined,
-        },
-        isNegation
-      );
-      onFilterSelect?.(property);
-    };
-
-    if (isDisabled) return null;
-    return (
-      <AddFilterDropdown
-        {...props}
-        buttonConfig={{
-          ...buttonConfig,
-          className: cn(getButtonStyling(variant, "sm"), "py-[5px]", className),
-        }}
-        handleFilterSelect={handleFilterSelect}
-        customButton={
-          <div className="flex items-center gap-1">
-            {iconConfig.shouldShowIcon && <FilterIcon className="size-4 text-custom-text-200" />}
-            {label}
-          </div>
-        }
-      />
+  const handleFilterSelect = (property: P, operator: TSupportedOperators, isNegation: boolean) => {
+    filter.addCondition(
+      LOGICAL_OPERATOR.AND,
+      {
+        property,
+        operator,
+        value: undefined,
+      },
+      isNegation
     );
-  }
-);
+    onFilterSelect?.(property);
+  };
+
+  if (isDisabled) return null;
+  return (
+    <AddFilterDropdown
+      {...props}
+      buttonConfig={{
+        ...buttonConfig,
+        className: cn(getButtonStyling(variant, "sm"), "py-[5px]", className),
+      }}
+      handleFilterSelect={handleFilterSelect}
+      customButton={
+        <div className="flex items-center gap-1">
+          {iconConfig.shouldShowIcon && <FilterIcon className="size-4 text-custom-text-200" />}
+          {label}
+        </div>
+      }
+    />
+  );
+});
diff --git a/apps/web/core/components/rich-filters/add-filters/dropdown.tsx b/apps/web/core/components/rich-filters/add-filters/dropdown.tsx
index 0704daff6..0878510e6 100644
--- a/apps/web/core/components/rich-filters/add-filters/dropdown.tsx
+++ b/apps/web/core/components/rich-filters/add-filters/dropdown.tsx
@@ -18,70 +18,71 @@ export type TAddFilterDropdownProps<P extends TFilterProperty, E extends TExtern
   handleFilterSelect: (property: P, operator: TSupportedOperators, isNegation: boolean) => void;
 };
 
-export const AddFilterDropdown = observer(
-  <P extends TFilterProperty, E extends TExternalFilter>(props: TAddFilterDropdownProps<P, E>) => {
-    const { filter, customButton, buttonConfig } = props;
-    const { className, defaultOpen = false, isDisabled = false } = buttonConfig || {};
+export const AddFilterDropdown = observer(function AddFilterDropdown<
+  P extends TFilterProperty,
+  E extends TExternalFilter,
+>(props: TAddFilterDropdownProps<P, E>) {
+  const { filter, customButton, buttonConfig } = props;
+  const { className, defaultOpen = false, isDisabled = false } = buttonConfig || {};
 
-    // Transform available filter configs to CustomSearchSelect options format
-    const filterOptions = filter.configManager.allAvailableConfigs.map((config) => ({
-      value: config.id,
-      content: (
-        <div className="flex items-center justify-between gap-2 text-custom-text-200 transition-all duration-200 ease-in-out">
-          <div className="flex items-center gap-2">
-            {config.icon && (
-              <config.icon className="size-4 text-custom-text-300 transition-transform duration-200 ease-in-out" />
-            )}
-            <span>{config.label}</span>
-          </div>
-          {config.rightContent}
+  // Transform available filter configs to CustomSearchSelect options format
+  const filterOptions = filter.configManager.allAvailableConfigs.map((config) => ({
+    value: config.id,
+    content: (
+      <div className="flex items-center justify-between gap-2 text-custom-text-200 transition-all duration-200 ease-in-out">
+        <div className="flex items-center gap-2">
+          {config.icon && (
+            <config.icon className="size-4 text-custom-text-300 transition-transform duration-200 ease-in-out" />
+          )}
+          <span>{config.label}</span>
         </div>
-      ),
-      query: config.label.toLowerCase(),
-    }));
-
-    // If all filters are applied, show disabled options
-    const allFiltersApplied = filterOptions.length === 0;
-    const displayOptions = allFiltersApplied
-      ? [
-          {
-            value: "all_filters_applied",
-            content: <div className="text-custom-text-400 italic">All filters applied</div>,
-            query: "all filters applied",
-            disabled: true,
-          },
-        ]
-      : filterOptions;
-
-    const handleFilterSelect = (property: P) => {
-      const config = filter.configManager.getConfigByProperty(property);
-      if (config?.firstOperator) {
-        const { operator, isNegation } = getOperatorForPayload(config.firstOperator);
-        props.handleFilterSelect(property, operator, isNegation);
-      } else {
-        setToast({
-          title: "Filter configuration error",
-          message: "This filter is not properly configured and cannot be applied",
-          type: TOAST_TYPE.ERROR,
-        });
-      }
-    };
-
-    return (
-      <div className="relative transition-all duration-200 ease-in-out">
-        <CustomSearchSelect
-          defaultOpen={defaultOpen}
-          value={""}
-          onChange={handleFilterSelect}
-          options={displayOptions}
-          optionsClassName="w-56"
-          maxHeight="2xl"
-          placement="bottom-start"
-          disabled={isDisabled}
-          customButtonClassName={className}
-          customButton={customButton}
-        />
+        {config.rightContent}
       </div>
-    );
-  }
-);
+    ),
+    query: config.label.toLowerCase(),
+  }));
+
+  // If all filters are applied, show disabled options
+  const allFiltersApplied = filterOptions.length === 0;
+  const displayOptions = allFiltersApplied
+    ? [
+        {
+          value: "all_filters_applied",
+          content: <div className="text-custom-text-400 italic">All filters applied</div>,
+          query: "all filters applied",
+          disabled: true,
+        },
+      ]
+    : filterOptions;
+
+  const handleFilterSelect = (property: P) => {
+    const config = filter.configManager.getConfigByProperty(property);
+    if (config?.firstOperator) {
+      const { operator, isNegation } = getOperatorForPayload(config.firstOperator);
+      props.handleFilterSelect(property, operator, isNegation);
+    } else {
+      setToast({
+        title: "Filter configuration error",
+        message: "This filter is not properly configured and cannot be applied",
+        type: TOAST_TYPE.ERROR,
+      });
+    }
+  };
+
+  return (
+    <div className="relative transition-all duration-200 ease-in-out">
+      <CustomSearchSelect
+        defaultOpen={defaultOpen}
+        value={""}
+        onChange={handleFilterSelect}
+        options={displayOptions}
+        optionsClassName="w-56"
+        maxHeight="2xl"
+        placement="bottom-start"
+        disabled={isDisabled}
+        customButtonClassName={className}
+        customButton={customButton}
+      />
+    </div>
+  );
+});
diff --git a/apps/web/core/components/rich-filters/filter-item/close-button.tsx b/apps/web/core/components/rich-filters/filter-item/close-button.tsx
index e3a73f411..74970b118 100644
--- a/apps/web/core/components/rich-filters/filter-item/close-button.tsx
+++ b/apps/web/core/components/rich-filters/filter-item/close-button.tsx
@@ -10,23 +10,24 @@ interface FilterItemCloseButtonProps<P extends TFilterProperty, E extends TExter
   filter: IFilterInstance<P, E>;
 }
 
-export const FilterItemCloseButton = observer(
-  <P extends TFilterProperty, E extends TExternalFilter>(props: FilterItemCloseButtonProps<P, E>) => {
-    const { conditionId, filter } = props;
+export const FilterItemCloseButton = observer(function FilterItemCloseButton<
+  P extends TFilterProperty,
+  E extends TExternalFilter,
+>(props: FilterItemCloseButtonProps<P, E>) {
+  const { conditionId, filter } = props;
 
-    const handleRemoveFilter = () => {
-      filter.removeCondition(conditionId);
-    };
+  const handleRemoveFilter = () => {
+    filter.removeCondition(conditionId);
+  };
 
-    return (
-      <button
-        onClick={handleRemoveFilter}
-        className="px-1.5 text-custom-text-400 hover:text-custom-text-300 focus:outline-none hover:bg-custom-background-90"
-        type="button"
-        aria-label="Remove filter"
-      >
-        <CloseIcon className="size-3.5" />
-      </button>
-    );
-  }
-);
+  return (
+    <button
+      onClick={handleRemoveFilter}
+      className="px-1.5 text-custom-text-400 hover:text-custom-text-300 focus:outline-none hover:bg-custom-background-90"
+      type="button"
+      aria-label="Remove filter"
+    >
+      <CloseIcon className="size-3.5" />
+    </button>
+  );
+});
diff --git a/apps/web/core/components/rich-filters/filter-item/container.tsx b/apps/web/core/components/rich-filters/filter-item/container.tsx
index ecafbf4f3..811ca27f2 100644
--- a/apps/web/core/components/rich-filters/filter-item/container.tsx
+++ b/apps/web/core/components/rich-filters/filter-item/container.tsx
@@ -13,7 +13,7 @@ interface FilterItemContainerProps {
   tooltipContent?: React.ReactNode;
 }
 
-export const FilterItemContainer: React.FC<FilterItemContainerProps> = (props) => {
+export function FilterItemContainer(props: FilterItemContainerProps) {
   const { children, conditionValue, showTransition, variant = "default", tooltipContent } = props;
   // refs
   const itemRef = useRef<HTMLDivElement>(null);
@@ -61,4 +61,4 @@ export const FilterItemContainer: React.FC<FilterItemContainerProps> = (props) =
       </div>
     </Tooltip>
   );
-};
+}
diff --git a/apps/web/core/components/rich-filters/filter-item/invalid.tsx b/apps/web/core/components/rich-filters/filter-item/invalid.tsx
index 18d0605f5..f04260735 100644
--- a/apps/web/core/components/rich-filters/filter-item/invalid.tsx
+++ b/apps/web/core/components/rich-filters/filter-item/invalid.tsx
@@ -9,28 +9,29 @@ import { FilterItemContainer } from "./container";
 import { FilterItemProperty } from "./property";
 import type { IFilterItemProps } from "./root";
 
-export const InvalidFilterItem = observer(
-  <P extends TFilterProperty, E extends TExternalFilter>(props: IFilterItemProps<P, E>) => {
-    const { condition, filter, isDisabled = false, showTransition = true } = props;
+export const InvalidFilterItem = observer(function InvalidFilterItem<
+  P extends TFilterProperty,
+  E extends TExternalFilter,
+>(props: IFilterItemProps<P, E>) {
+  const { condition, filter, isDisabled = false, showTransition = true } = props;
 
-    return (
-      <FilterItemContainer
-        conditionValue={condition.value}
-        showTransition={showTransition}
-        variant="error"
-        tooltipContent="This filter condition is no longer valid. The property may have been deleted or your access to it may have changed."
-      >
-        {/* Property section */}
-        <FilterItemProperty
-          conditionId={condition.id}
-          icon={CircleAlert}
-          label="Invalid filter"
-          filter={filter}
-          isDisabled={isDisabled}
-        />
-        {/* Remove button */}
-        {!isDisabled && <FilterItemCloseButton conditionId={condition.id} filter={filter} />}
-      </FilterItemContainer>
-    );
-  }
-);
+  return (
+    <FilterItemContainer
+      conditionValue={condition.value}
+      showTransition={showTransition}
+      variant="error"
+      tooltipContent="This filter condition is no longer valid. The property may have been deleted or your access to it may have changed."
+    >
+      {/* Property section */}
+      <FilterItemProperty
+        conditionId={condition.id}
+        icon={CircleAlert}
+        label="Invalid filter"
+        filter={filter}
+        isDisabled={isDisabled}
+      />
+      {/* Remove button */}
+      {!isDisabled && <FilterItemCloseButton conditionId={condition.id} filter={filter} />}
+    </FilterItemContainer>
+  );
+});
diff --git a/apps/web/core/components/rich-filters/filter-item/loader.tsx b/apps/web/core/components/rich-filters/filter-item/loader.tsx
index c2cbddefc..de81d2b76 100644
--- a/apps/web/core/components/rich-filters/filter-item/loader.tsx
+++ b/apps/web/core/components/rich-filters/filter-item/loader.tsx
@@ -1,7 +1,9 @@
 import { Loader } from "@plane/ui";
 
-export const FilterItemLoader = () => (
-  <Loader>
-    <Loader.Item height="28px" width="180px" />
-  </Loader>
-);
+export function FilterItemLoader() {
+  return (
+    <Loader>
+      <Loader.Item height="28px" width="180px" />
+    </Loader>
+  );
+}
diff --git a/apps/web/core/components/rich-filters/filter-item/property.tsx b/apps/web/core/components/rich-filters/filter-item/property.tsx
index 36d1848b6..273f9ea71 100644
--- a/apps/web/core/components/rich-filters/filter-item/property.tsx
+++ b/apps/web/core/components/rich-filters/filter-item/property.tsx
@@ -17,33 +17,34 @@ interface IFilterItemPropertyProps<P extends TFilterProperty, E extends TExterna
   tooltipContent?: React.ReactNode | undefined;
 }
 
-export const FilterItemProperty = observer(
-  <P extends TFilterProperty, E extends TExternalFilter>(props: IFilterItemPropertyProps<P, E>) => {
-    const { conditionId, filter, isDisabled } = props;
+export const FilterItemProperty = observer(function FilterItemProperty<
+  P extends TFilterProperty,
+  E extends TExternalFilter,
+>(props: IFilterItemPropertyProps<P, E>) {
+  const { conditionId, filter, isDisabled } = props;
 
-    if (isDisabled) {
-      return <PropertyButton {...props} />;
-    }
-
-    const handleFilterSelect = (property: P, operator: TSupportedOperators, isNegation: boolean) => {
-      filter.updateConditionProperty(conditionId, property, operator, isNegation);
-    };
-
-    return (
-      <AddFilterDropdown
-        {...props}
-        handleFilterSelect={handleFilterSelect}
-        customButton={<PropertyButton {...props} />}
-      />
-    );
+  if (isDisabled) {
+    return <PropertyButton {...props} />;
   }
-);
+
+  const handleFilterSelect = (property: P, operator: TSupportedOperators, isNegation: boolean) => {
+    filter.updateConditionProperty(conditionId, property, operator, isNegation);
+  };
+
+  return (
+    <AddFilterDropdown
+      {...props}
+      handleFilterSelect={handleFilterSelect}
+      customButton={<PropertyButton {...props} />}
+    />
+  );
+});
 
 type TPropertyButtonProps<P extends TFilterProperty, E extends TExternalFilter> = IFilterItemPropertyProps<P, E> & {
   className?: string;
 };
 
-const PropertyButton = <P extends TFilterProperty, E extends TExternalFilter>(props: TPropertyButtonProps<P, E>) => {
+function PropertyButton<P extends TFilterProperty, E extends TExternalFilter>(props: TPropertyButtonProps<P, E>) {
   const { icon: Icon, label, tooltipContent, className } = props;
 
   return (
@@ -64,4 +65,4 @@ const PropertyButton = <P extends TFilterProperty, E extends TExternalFilter>(pr
       </div>
     </Tooltip>
   );
-};
+}
diff --git a/apps/web/core/components/rich-filters/filter-item/root.tsx b/apps/web/core/components/rich-filters/filter-item/root.tsx
index aa9c9d7bc..bf9d7029c 100644
--- a/apps/web/core/components/rich-filters/filter-item/root.tsx
+++ b/apps/web/core/components/rich-filters/filter-item/root.tsx
@@ -28,99 +28,99 @@ export interface IFilterItemProps<P extends TFilterProperty, E extends TExternal
   showTransition?: boolean;
 }
 
-export const FilterItem = observer(
-  <P extends TFilterProperty, E extends TExternalFilter>(props: IFilterItemProps<P, E>) => {
-    const { condition, filter, isDisabled = false, showTransition = true } = props;
-    // derived values
-    const filterConfig = condition?.property ? filter.configManager.getConfigByProperty(condition.property) : undefined;
-    const operatorOptions = filterConfig
-      ?.getAllDisplayOperatorOptionsByValue(condition.value as TFilterValue)
-      .map((option) => ({
-        value: option.value,
-        content: option.label,
-        query: option.label.toLowerCase(),
-      }));
-    const selectedOperatorFieldConfig = filterConfig?.getOperatorConfig(condition.operator);
-    const selectedOperatorOption = filterConfig?.getDisplayOperatorByValue(
-      condition.operator,
-      condition.value as TFilterValue
-    );
-    // Disable operator selection when filter is disabled or only one operator option is available and selected
-    const isOperatorSelectionDisabled =
-      isDisabled ||
-      (condition.operator && operatorOptions?.length === 1 && operatorOptions[0]?.value === condition.operator);
+export const FilterItem = observer(function FilterItem<P extends TFilterProperty, E extends TExternalFilter>(
+  props: IFilterItemProps<P, E>
+) {
+  const { condition, filter, isDisabled = false, showTransition = true } = props;
+  // derived values
+  const filterConfig = condition?.property ? filter.configManager.getConfigByProperty(condition.property) : undefined;
+  const operatorOptions = filterConfig
+    ?.getAllDisplayOperatorOptionsByValue(condition.value as TFilterValue)
+    .map((option) => ({
+      value: option.value,
+      content: option.label,
+      query: option.label.toLowerCase(),
+    }));
+  const selectedOperatorFieldConfig = filterConfig?.getOperatorConfig(condition.operator);
+  const selectedOperatorOption = filterConfig?.getDisplayOperatorByValue(
+    condition.operator,
+    condition.value as TFilterValue
+  );
+  // Disable operator selection when filter is disabled or only one operator option is available and selected
+  const isOperatorSelectionDisabled =
+    isDisabled ||
+    (condition.operator && operatorOptions?.length === 1 && operatorOptions[0]?.value === condition.operator);
 
-    const handleOperatorChange = (operator: TAllAvailableOperatorsForDisplay) => {
-      if (operator) {
-        const { operator: positiveOperator, isNegation } = getOperatorForPayload(operator);
-        filter.updateConditionOperator(condition.id, positiveOperator, isNegation);
-      }
-    };
-
-    const handleValueChange = (values: SingleOrArray<TFilterValue>) => {
-      filter.updateConditionValue(condition.id, values);
-    };
-
-    if (!filter.configManager.areConfigsReady) {
-      return <FilterItemLoader />;
+  const handleOperatorChange = (operator: TAllAvailableOperatorsForDisplay) => {
+    if (operator) {
+      const { operator: positiveOperator, isNegation } = getOperatorForPayload(operator);
+      filter.updateConditionOperator(condition.id, positiveOperator, isNegation);
     }
+  };
 
-    if (!filterConfig) {
-      return (
-        <InvalidFilterItem
-          condition={condition}
-          filter={filter}
-          isDisabled={isDisabled}
-          showTransition={showTransition}
-        />
-      );
-    }
+  const handleValueChange = (values: SingleOrArray<TFilterValue>) => {
+    filter.updateConditionValue(condition.id, values);
+  };
 
+  if (!filter.configManager.areConfigsReady) {
+    return <FilterItemLoader />;
+  }
+
+  if (!filterConfig) {
     return (
-      <FilterItemContainer conditionValue={condition.value} showTransition={showTransition}>
-        {/* Property section */}
-        <FilterItemProperty
-          conditionId={condition.id}
-          filter={filter}
-          icon={filterConfig.icon}
-          isDisabled={isDisabled}
-          label={filterConfig.label}
-          tooltipContent={filterConfig.tooltipContent}
-        />
-
-        {/* Operator section */}
-        <CustomSearchSelect
-          value={condition.operator}
-          onChange={handleOperatorChange}
-          options={operatorOptions}
-          className={COMMON_FILTER_ITEM_BORDER_CLASSNAME}
-          customButtonClassName={cn(
-            "h-full px-2 text-sm font-normal",
-            isOperatorSelectionDisabled && "hover:bg-custom-background-100"
-          )}
-          optionsClassName="w-48"
-          maxHeight="2xl"
-          disabled={isOperatorSelectionDisabled}
-          customButton={
-            <div className="flex items-center h-full" aria-disabled={isOperatorSelectionDisabled}>
-              {filterConfig.getLabelForOperator(selectedOperatorOption)}
-            </div>
-          }
-        />
-
-        {/* Value section */}
-        {selectedOperatorFieldConfig && (
-          <FilterValueInput
-            filterFieldConfig={selectedOperatorFieldConfig}
-            condition={condition}
-            onChange={handleValueChange}
-            isDisabled={isDisabled}
-          />
-        )}
-
-        {/* Remove button */}
-        {!isDisabled && <FilterItemCloseButton conditionId={condition.id} filter={filter} />}
-      </FilterItemContainer>
+      <InvalidFilterItem
+        condition={condition}
+        filter={filter}
+        isDisabled={isDisabled}
+        showTransition={showTransition}
+      />
     );
   }
-);
+
+  return (
+    <FilterItemContainer conditionValue={condition.value} showTransition={showTransition}>
+      {/* Property section */}
+      <FilterItemProperty
+        conditionId={condition.id}
+        filter={filter}
+        icon={filterConfig.icon}
+        isDisabled={isDisabled}
+        label={filterConfig.label}
+        tooltipContent={filterConfig.tooltipContent}
+      />
+
+      {/* Operator section */}
+      <CustomSearchSelect
+        value={condition.operator}
+        onChange={handleOperatorChange}
+        options={operatorOptions}
+        className={COMMON_FILTER_ITEM_BORDER_CLASSNAME}
+        customButtonClassName={cn(
+          "h-full px-2 text-sm font-normal",
+          isOperatorSelectionDisabled && "hover:bg-custom-background-100"
+        )}
+        optionsClassName="w-48"
+        maxHeight="2xl"
+        disabled={isOperatorSelectionDisabled}
+        customButton={
+          <div className="flex items-center h-full" aria-disabled={isOperatorSelectionDisabled}>
+            {filterConfig.getLabelForOperator(selectedOperatorOption)}
+          </div>
+        }
+      />
+
+      {/* Value section */}
+      {selectedOperatorFieldConfig && (
+        <FilterValueInput
+          filterFieldConfig={selectedOperatorFieldConfig}
+          condition={condition}
+          onChange={handleValueChange}
+          isDisabled={isDisabled}
+        />
+      )}
+
+      {/* Remove button */}
+      {!isDisabled && <FilterItemCloseButton conditionId={condition.id} filter={filter} />}
+    </FilterItemContainer>
+  );
+});
diff --git a/apps/web/core/components/rich-filters/filter-value-input/date/range.tsx b/apps/web/core/components/rich-filters/filter-value-input/date/range.tsx
index 0f4ea1e52..5f9824cf1 100644
--- a/apps/web/core/components/rich-filters/filter-value-input/date/range.tsx
+++ b/apps/web/core/components/rich-filters/filter-value-input/date/range.tsx
@@ -15,45 +15,45 @@ type TDateRangeFilterValueInputProps<P extends TFilterProperty> = {
   onChange: (value: string[]) => void;
 };
 
-export const DateRangeFilterValueInput = observer(
-  <P extends TFilterProperty>(props: TDateRangeFilterValueInputProps<P>) => {
-    const { config, condition, isDisabled, onChange } = props;
-    // derived values
-    const [fromRaw, toRaw] = toFilterArray(condition.value) ?? [];
-    const from = isValidDate(fromRaw) ? new Date(fromRaw) : undefined;
-    const to = isValidDate(toRaw) ? new Date(toRaw) : undefined;
-    const isIncomplete = !from || !to;
+export const DateRangeFilterValueInput = observer(function DateRangeFilterValueInput<P extends TFilterProperty>(
+  props: TDateRangeFilterValueInputProps<P>
+) {
+  const { config, condition, isDisabled, onChange } = props;
+  // derived values
+  const [fromRaw, toRaw] = toFilterArray(condition.value) ?? [];
+  const from = isValidDate(fromRaw) ? new Date(fromRaw) : undefined;
+  const to = isValidDate(toRaw) ? new Date(toRaw) : undefined;
+  const isIncomplete = !from || !to;
 
-    // Handler for date range selection
-    const handleSelect = (range: { from?: Date; to?: Date } | undefined) => {
-      const formattedFrom = range?.from ? renderFormattedPayloadDate(range.from) : undefined;
-      const formattedTo = range?.to ? renderFormattedPayloadDate(range.to) : undefined;
-      if (formattedFrom && formattedTo) {
-        onChange([formattedFrom, formattedTo]);
-      } else {
-        onChange([]);
-      }
-    };
+  // Handler for date range selection
+  const handleSelect = (range: { from?: Date; to?: Date } | undefined) => {
+    const formattedFrom = range?.from ? renderFormattedPayloadDate(range.from) : undefined;
+    const formattedTo = range?.to ? renderFormattedPayloadDate(range.to) : undefined;
+    if (formattedFrom && formattedTo) {
+      onChange([formattedFrom, formattedTo]);
+    } else {
+      onChange([]);
+    }
+  };
 
-    return (
-      <DateRangeDropdown
-        value={{ from, to }}
-        onSelect={handleSelect}
-        minDate={config.min}
-        maxDate={config.max}
-        mergeDates
-        placeholder={{ from: EMPTY_FILTER_PLACEHOLDER_TEXT }}
-        buttonVariant="transparent-with-text"
-        buttonClassName={cn("rounded-none", {
-          [COMMON_FILTER_ITEM_BORDER_CLASSNAME]: !isDisabled,
-          "text-red-500": isIncomplete,
-          "hover:bg-custom-background-100": isDisabled,
-        })}
-        renderPlaceholder
-        renderInPortal
-        defaultOpen={isIncomplete}
-        disabled={isDisabled}
-      />
-    );
-  }
-);
+  return (
+    <DateRangeDropdown
+      value={{ from, to }}
+      onSelect={handleSelect}
+      minDate={config.min}
+      maxDate={config.max}
+      mergeDates
+      placeholder={{ from: EMPTY_FILTER_PLACEHOLDER_TEXT }}
+      buttonVariant="transparent-with-text"
+      buttonClassName={cn("rounded-none", {
+        [COMMON_FILTER_ITEM_BORDER_CLASSNAME]: !isDisabled,
+        "text-red-500": isIncomplete,
+        "hover:bg-custom-background-100": isDisabled,
+      })}
+      renderPlaceholder
+      renderInPortal
+      defaultOpen={isIncomplete}
+      disabled={isDisabled}
+    />
+  );
+});
diff --git a/apps/web/core/components/rich-filters/filter-value-input/date/single.tsx b/apps/web/core/components/rich-filters/filter-value-input/date/single.tsx
index 70da02cf1..499a13417 100644
--- a/apps/web/core/components/rich-filters/filter-value-input/date/single.tsx
+++ b/apps/web/core/components/rich-filters/filter-value-input/date/single.tsx
@@ -13,34 +13,34 @@ type TSingleDateFilterValueInputProps<P extends TFilterProperty> = {
   onChange: (value: string | null | undefined) => void;
 };
 
-export const SingleDateFilterValueInput = observer(
-  <P extends TFilterProperty>(props: TSingleDateFilterValueInputProps<P>) => {
-    const { config, condition, isDisabled, onChange } = props;
-    // derived values
-    const conditionValue = typeof condition.value === "string" ? condition.value : null;
+export const SingleDateFilterValueInput = observer(function SingleDateFilterValueInput<P extends TFilterProperty>(
+  props: TSingleDateFilterValueInputProps<P>
+) {
+  const { config, condition, isDisabled, onChange } = props;
+  // derived values
+  const conditionValue = typeof condition.value === "string" ? condition.value : null;
 
-    return (
-      <DateDropdown
-        value={conditionValue}
-        onChange={(value: Date | null) => {
-          const formattedDate = value ? renderFormattedPayloadDate(value) : null;
-          onChange(formattedDate);
-        }}
-        buttonClassName={cn("rounded-none", {
-          [COMMON_FILTER_ITEM_BORDER_CLASSNAME]: !isDisabled,
-          "text-custom-text-400": !conditionValue,
-          "hover:bg-custom-background-100": isDisabled,
-        })}
-        minDate={config.min}
-        maxDate={config.max}
-        icon={null}
-        placeholder={EMPTY_FILTER_PLACEHOLDER_TEXT}
-        buttonVariant="transparent-with-text"
-        isClearable={false}
-        closeOnSelect
-        defaultOpen={!conditionValue}
-        disabled={isDisabled}
-      />
-    );
-  }
-);
+  return (
+    <DateDropdown
+      value={conditionValue}
+      onChange={(value: Date | null) => {
+        const formattedDate = value ? renderFormattedPayloadDate(value) : null;
+        onChange(formattedDate);
+      }}
+      buttonClassName={cn("rounded-none", {
+        [COMMON_FILTER_ITEM_BORDER_CLASSNAME]: !isDisabled,
+        "text-custom-text-400": !conditionValue,
+        "hover:bg-custom-background-100": isDisabled,
+      })}
+      minDate={config.min}
+      maxDate={config.max}
+      icon={null}
+      placeholder={EMPTY_FILTER_PLACEHOLDER_TEXT}
+      buttonVariant="transparent-with-text"
+      isClearable={false}
+      closeOnSelect
+      defaultOpen={!conditionValue}
+      disabled={isDisabled}
+    />
+  );
+});
diff --git a/apps/web/core/components/rich-filters/filter-value-input/root.tsx b/apps/web/core/components/rich-filters/filter-value-input/root.tsx
index be90b30d9..a9717b09c 100644
--- a/apps/web/core/components/rich-filters/filter-value-input/root.tsx
+++ b/apps/web/core/components/rich-filters/filter-value-input/root.tsx
@@ -22,58 +22,58 @@ import { SingleDateFilterValueInput } from "./date/single";
 import { MultiSelectFilterValueInput } from "./select/multi";
 import { SingleSelectFilterValueInput } from "./select/single";
 
-export const FilterValueInput = observer(
-  <P extends TFilterProperty, V extends TFilterValue>(props: TFilterValueInputProps<P, V>) => {
-    const { condition, filterFieldConfig, isDisabled = false, onChange } = props;
+export const FilterValueInput = observer(function FilterValueInput<P extends TFilterProperty, V extends TFilterValue>(
+  props: TFilterValueInputProps<P, V>
+) {
+  const { condition, filterFieldConfig, isDisabled = false, onChange } = props;
 
-    // Single select input
-    if (filterFieldConfig?.type === FILTER_FIELD_TYPE.SINGLE_SELECT) {
-      return (
-        <SingleSelectFilterValueInput<P>
-          config={filterFieldConfig as TSingleSelectFilterFieldConfig<string>}
-          condition={condition as TFilterConditionNodeForDisplay<P, string>}
-          isDisabled={isDisabled}
-          onChange={(value) => onChange(value as SingleOrArray<V>)}
-        />
-      );
-    }
-
-    // Multi select input
-    if (filterFieldConfig?.type === FILTER_FIELD_TYPE.MULTI_SELECT) {
-      return (
-        <MultiSelectFilterValueInput<P>
-          config={filterFieldConfig as TMultiSelectFilterFieldConfig<string>}
-          condition={condition as TFilterConditionNode<P, string>}
-          isDisabled={isDisabled}
-          onChange={(value) => onChange(value as SingleOrArray<V>)}
-        />
-      );
-    }
-
-    // Date filter input
-    if (filterFieldConfig?.type === FILTER_FIELD_TYPE.DATE) {
-      return (
-        <SingleDateFilterValueInput<P>
-          config={filterFieldConfig as TDateFilterFieldConfig<string>}
-          condition={condition as TFilterConditionNodeForDisplay<P, string>}
-          isDisabled={isDisabled}
-          onChange={(value) => onChange(value as SingleOrArray<V>)}
-        />
-      );
-    }
-
-    // Date range filter input
-    if (filterFieldConfig?.type === FILTER_FIELD_TYPE.DATE_RANGE) {
-      return (
-        <DateRangeFilterValueInput<P>
-          config={filterFieldConfig as TDateRangeFilterFieldConfig<string>}
-          condition={condition as TFilterConditionNodeForDisplay<P, string>}
-          isDisabled={isDisabled}
-          onChange={(value) => onChange(value as SingleOrArray<V>)}
-        />
-      );
-    }
-
-    return <AdditionalFilterValueInput {...props} />;
+  // Single select input
+  if (filterFieldConfig?.type === FILTER_FIELD_TYPE.SINGLE_SELECT) {
+    return (
+      <SingleSelectFilterValueInput<P>
+        config={filterFieldConfig as TSingleSelectFilterFieldConfig<string>}
+        condition={condition as TFilterConditionNodeForDisplay<P, string>}
+        isDisabled={isDisabled}
+        onChange={(value) => onChange(value as SingleOrArray<V>)}
+      />
+    );
   }
-);
+
+  // Multi select input
+  if (filterFieldConfig?.type === FILTER_FIELD_TYPE.MULTI_SELECT) {
+    return (
+      <MultiSelectFilterValueInput<P>
+        config={filterFieldConfig as TMultiSelectFilterFieldConfig<string>}
+        condition={condition as TFilterConditionNode<P, string>}
+        isDisabled={isDisabled}
+        onChange={(value) => onChange(value as SingleOrArray<V>)}
+      />
+    );
+  }
+
+  // Date filter input
+  if (filterFieldConfig?.type === FILTER_FIELD_TYPE.DATE) {
+    return (
+      <SingleDateFilterValueInput<P>
+        config={filterFieldConfig as TDateFilterFieldConfig<string>}
+        condition={condition as TFilterConditionNodeForDisplay<P, string>}
+        isDisabled={isDisabled}
+        onChange={(value) => onChange(value as SingleOrArray<V>)}
+      />
+    );
+  }
+
+  // Date range filter input
+  if (filterFieldConfig?.type === FILTER_FIELD_TYPE.DATE_RANGE) {
+    return (
+      <DateRangeFilterValueInput<P>
+        config={filterFieldConfig as TDateRangeFilterFieldConfig<string>}
+        condition={condition as TFilterConditionNodeForDisplay<P, string>}
+        isDisabled={isDisabled}
+        onChange={(value) => onChange(value as SingleOrArray<V>)}
+      />
+    );
+  }
+
+  return <AdditionalFilterValueInput {...props} />;
+});
diff --git a/apps/web/core/components/rich-filters/filter-value-input/select/multi.tsx b/apps/web/core/components/rich-filters/filter-value-input/select/multi.tsx
index 488e34c5b..222faa2f4 100644
--- a/apps/web/core/components/rich-filters/filter-value-input/select/multi.tsx
+++ b/apps/web/core/components/rich-filters/filter-value-input/select/multi.tsx
@@ -21,34 +21,34 @@ type TMultiSelectFilterValueInputProps<P extends TFilterProperty> = {
   onChange: (values: SingleOrArray<string>) => void;
 };
 
-export const MultiSelectFilterValueInput = observer(
-  <P extends TFilterProperty>(props: TMultiSelectFilterValueInputProps<P>) => {
-    const { config, condition, isDisabled, onChange } = props;
-    // states
-    const [options, setOptions] = useState<IFilterOption<string>[]>([]);
-    const [loading, setLoading] = useState<boolean>(false);
-    // derived values
-    const formattedOptions = useMemo(() => getFormattedOptions<string>(options), [options]);
+export const MultiSelectFilterValueInput = observer(function MultiSelectFilterValueInput<P extends TFilterProperty>(
+  props: TMultiSelectFilterValueInputProps<P>
+) {
+  const { config, condition, isDisabled, onChange } = props;
+  // states
+  const [options, setOptions] = useState<IFilterOption<string>[]>([]);
+  const [loading, setLoading] = useState<boolean>(false);
+  // derived values
+  const formattedOptions = useMemo(() => getFormattedOptions<string>(options), [options]);
 
-    useEffect(() => {
-      loadOptions({ config, setOptions, setLoading });
-    }, [config]);
+  useEffect(() => {
+    loadOptions({ config, setOptions, setLoading });
+  }, [config]);
 
-    const handleSelectChange = (values: string[]) => {
-      onChange(values);
-    };
+  const handleSelectChange = (values: string[]) => {
+    onChange(values);
+  };
 
-    return (
-      <CustomSearchSelect
-        {...getCommonCustomSearchSelectProps(isDisabled)}
-        value={toFilterArray(condition.value)}
-        onChange={handleSelectChange}
-        options={formattedOptions}
-        multiple
-        disabled={loading || isDisabled}
-        customButton={<SelectedOptionsDisplay<string> selectedValue={condition.value} options={options} />}
-        defaultOpen={getFilterValueLength(condition.value) === 0}
-      />
-    );
-  }
-);
+  return (
+    <CustomSearchSelect
+      {...getCommonCustomSearchSelectProps(isDisabled)}
+      value={toFilterArray(condition.value)}
+      onChange={handleSelectChange}
+      options={formattedOptions}
+      multiple
+      disabled={loading || isDisabled}
+      customButton={<SelectedOptionsDisplay<string> selectedValue={condition.value} options={options} />}
+      defaultOpen={getFilterValueLength(condition.value) === 0}
+    />
+  );
+});
diff --git a/apps/web/core/components/rich-filters/filter-value-input/select/selected-options-display.tsx b/apps/web/core/components/rich-filters/filter-value-input/select/selected-options-display.tsx
index bddca2b56..d179aa61e 100644
--- a/apps/web/core/components/rich-filters/filter-value-input/select/selected-options-display.tsx
+++ b/apps/web/core/components/rich-filters/filter-value-input/select/selected-options-display.tsx
@@ -13,7 +13,7 @@ type TSelectedOptionsDisplayProps<V extends TFilterValue> = {
   fallbackText?: string;
 };
 
-export const SelectedOptionsDisplay = <V extends TFilterValue>(props: TSelectedOptionsDisplayProps<V>) => {
+export function SelectedOptionsDisplay<V extends TFilterValue>(props: TSelectedOptionsDisplayProps<V>) {
   const { selectedValue, options, displayCount = 2, emptyValue = EMPTY_FILTER_PLACEHOLDER_TEXT, fallbackText } = props;
   // derived values
   const selectedArray = toFilterArray(selectedValue);
@@ -59,4 +59,4 @@ export const SelectedOptionsDisplay = <V extends TFilterValue>(props: TSelectedO
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/rich-filters/filter-value-input/select/single.tsx b/apps/web/core/components/rich-filters/filter-value-input/select/single.tsx
index 0d1894ebe..20c6d5296 100644
--- a/apps/web/core/components/rich-filters/filter-value-input/select/single.tsx
+++ b/apps/web/core/components/rich-filters/filter-value-input/select/single.tsx
@@ -19,40 +19,40 @@ type TSingleSelectFilterValueInputProps<P extends TFilterProperty> = {
   onChange: (value: string | null) => void;
 };
 
-export const SingleSelectFilterValueInput = observer(
-  <P extends TFilterProperty>(props: TSingleSelectFilterValueInputProps<P>) => {
-    const { config, condition, onChange, isDisabled } = props;
-    // states
-    const [options, setOptions] = useState<IFilterOption<string>[]>([]);
-    const [loading, setLoading] = useState<boolean>(false);
-    // derived values
-    const formattedOptions = useMemo(() => getFormattedOptions<string>(options), [options]);
+export const SingleSelectFilterValueInput = observer(function SingleSelectFilterValueInput<P extends TFilterProperty>(
+  props: TSingleSelectFilterValueInputProps<P>
+) {
+  const { config, condition, onChange, isDisabled } = props;
+  // states
+  const [options, setOptions] = useState<IFilterOption<string>[]>([]);
+  const [loading, setLoading] = useState<boolean>(false);
+  // derived values
+  const formattedOptions = useMemo(() => getFormattedOptions<string>(options), [options]);
 
-    useEffect(() => {
-      loadOptions({ config, setOptions, setLoading });
-    }, [config]);
+  useEffect(() => {
+    loadOptions({ config, setOptions, setLoading });
+  }, [config]);
 
-    const handleSelectChange = (value: string) => {
-      if (value === condition.value) {
-        onChange(null);
-      } else {
-        onChange(value);
+  const handleSelectChange = (value: string) => {
+    if (value === condition.value) {
+      onChange(null);
+    } else {
+      onChange(value);
+    }
+  };
+
+  return (
+    <CustomSearchSelect
+      {...getCommonCustomSearchSelectProps(isDisabled)}
+      value={condition.value}
+      onChange={handleSelectChange}
+      options={formattedOptions}
+      multiple={false}
+      disabled={loading || isDisabled}
+      customButton={
+        <SelectedOptionsDisplay<string> selectedValue={condition.value} options={options} displayCount={1} />
       }
-    };
-
-    return (
-      <CustomSearchSelect
-        {...getCommonCustomSearchSelectProps(isDisabled)}
-        value={condition.value}
-        onChange={handleSelectChange}
-        options={formattedOptions}
-        multiple={false}
-        disabled={loading || isDisabled}
-        customButton={
-          <SelectedOptionsDisplay<string> selectedValue={condition.value} options={options} displayCount={1} />
-        }
-        defaultOpen={!condition.value}
-      />
-    );
-  }
-);
+      defaultOpen={!condition.value}
+    />
+  );
+});
diff --git a/apps/web/core/components/rich-filters/filters-row.tsx b/apps/web/core/components/rich-filters/filters-row.tsx
index 5609ee7d8..6d09a8ee3 100644
--- a/apps/web/core/components/rich-filters/filters-row.tsx
+++ b/apps/web/core/components/rich-filters/filters-row.tsx
@@ -24,143 +24,143 @@ export type TFiltersRowProps<K extends TFilterProperty, E extends TExternalFilte
   };
 };
 
-export const FiltersRow = observer(
-  <K extends TFilterProperty, E extends TExternalFilter>(props: TFiltersRowProps<K, E>) => {
-    const {
-      buttonConfig,
-      disabledAllOperations: disabledAllOperationsProp = false,
-      filter,
-      variant = "header",
-      trackerElements,
-    } = props;
-    // states
-    const [isUpdating, setIsUpdating] = useState(false);
-    // derived values
-    const disabledAllOperations = disabledAllOperationsProp || !filter.configManager.areConfigsReady;
-    const hasAnyConditions = filter.allConditionsForDisplay.length > 0;
-    const hasAvailableOperations =
-      !disabledAllOperations && (filter.canClearFilters || filter.canSaveView || filter.canUpdateView);
+export const FiltersRow = observer(function FiltersRow<K extends TFilterProperty, E extends TExternalFilter>(
+  props: TFiltersRowProps<K, E>
+) {
+  const {
+    buttonConfig,
+    disabledAllOperations: disabledAllOperationsProp = false,
+    filter,
+    variant = "header",
+    trackerElements,
+  } = props;
+  // states
+  const [isUpdating, setIsUpdating] = useState(false);
+  // derived values
+  const disabledAllOperations = disabledAllOperationsProp || !filter.configManager.areConfigsReady;
+  const hasAnyConditions = filter.allConditionsForDisplay.length > 0;
+  const hasAvailableOperations =
+    !disabledAllOperations && (filter.canClearFilters || filter.canSaveView || filter.canUpdateView);
 
-    const headerButtonConfig: Partial<TAddFilterButtonProps<K, E>["buttonConfig"]> = {
-      variant: "link-neutral",
-      className: "bg-custom-background-90",
-      label: null,
-    };
+  const headerButtonConfig: Partial<TAddFilterButtonProps<K, E>["buttonConfig"]> = {
+    variant: "link-neutral",
+    className: "bg-custom-background-90",
+    label: null,
+  };
 
-    const modalButtonConfig: Partial<TAddFilterButtonProps<K, E>["buttonConfig"]> = {
-      variant: "neutral-primary",
-      className: "bg-custom-background-100",
-      label: !hasAnyConditions ? "Filters" : null,
-    };
+  const modalButtonConfig: Partial<TAddFilterButtonProps<K, E>["buttonConfig"]> = {
+    variant: "neutral-primary",
+    className: "bg-custom-background-100",
+    label: !hasAnyConditions ? "Filters" : null,
+  };
 
-    const handleUpdate = useCallback(async () => {
-      setIsUpdating(true);
-      try {
-        await filter.updateView();
-      } finally {
-        setTimeout(() => setIsUpdating(false), 240); // To avoid flickering
-      }
-    }, [filter]);
-
-    const leftContent = (
-      <>
-        {filter.allConditionsForDisplay.map((condition) => (
-          <FilterItem key={condition.id} filter={filter} condition={condition} isDisabled={disabledAllOperations} />
-        ))}
-        <AddFilterButton
-          filter={filter}
-          buttonConfig={{
-            label: null,
-            ...(variant === "modal" ? modalButtonConfig : headerButtonConfig),
-            iconConfig: {
-              shouldShowIcon: true,
-              iconComponent: ListFilterPlus,
-            },
-            ...buttonConfig,
-            isDisabled: disabledAllOperations,
-          }}
-        />
-      </>
-    );
-
-    const rightContent = !disabledAllOperations && (
-      <>
-        <ElementTransition show={filter.canClearFilters}>
-          <Button
-            variant="neutral-primary"
-            size="sm"
-            className={COMMON_OPERATION_BUTTON_CLASSNAME}
-            onClick={filter.clearFilters}
-            data-ph-element={trackerElements?.clearFilter}
-          >
-            {filter.clearFilterOptions?.label ?? "Clear all"}
-          </Button>
-        </ElementTransition>
-        <ElementTransition show={filter.canSaveView}>
-          <Button
-            variant="accent-primary"
-            size="sm"
-            className={COMMON_OPERATION_BUTTON_CLASSNAME}
-            onClick={filter.saveView}
-            data-ph-element={trackerElements?.saveView}
-          >
-            {filter.saveViewOptions?.label ?? "Save view"}
-          </Button>
-        </ElementTransition>
-        <ElementTransition show={filter.canUpdateView}>
-          <Button
-            variant="accent-primary"
-            size="sm"
-            className={COMMON_OPERATION_BUTTON_CLASSNAME}
-            onClick={handleUpdate}
-            loading={isUpdating}
-            disabled={isUpdating}
-            data-ph-element={trackerElements?.updateView}
-          >
-            {isUpdating ? "Confirming" : (filter.updateViewOptions?.label ?? "Update view")}
-          </Button>
-        </ElementTransition>
-      </>
-    );
-
-    const mainContent = (
-      <div className="w-full flex items-start gap-2">
-        <div className="w-full flex flex-wrap items-center gap-2">{leftContent}</div>
-        <div
-          className={cn("flex items-center gap-2 border-l border-custom-border-200 pl-4", {
-            "border-l-transparent pl-0": !hasAvailableOperations,
-          })}
-        >
-          {rightContent}
-        </div>
-      </div>
-    );
-
-    const ModalVariant = (
-      <div className="w-full flex flex-wrap items-center gap-2 min-h-11 bg-custom-background-90 rounded-lg p-2">
-        {mainContent}
-      </div>
-    );
-
-    const HeaderVariant = (
-      <Header variant={EHeaderVariant.TERNARY} className="min-h-11">
-        {mainContent}
-      </Header>
-    );
-
-    if (!filter.configManager.areConfigsReady && !hasAnyConditions) {
-      return (
-        <RowTransition show={filter.isVisible}>
-          <Loader>
-            <Loader.Item height="44px" width="100%" className={cn({ "rounded-none": variant === "header" })} />
-          </Loader>
-        </RowTransition>
-      );
+  const handleUpdate = useCallback(async () => {
+    setIsUpdating(true);
+    try {
+      await filter.updateView();
+    } finally {
+      setTimeout(() => setIsUpdating(false), 240); // To avoid flickering
     }
+  }, [filter]);
 
-    return <RowTransition show={filter.isVisible}>{variant === "modal" ? ModalVariant : HeaderVariant}</RowTransition>;
+  const leftContent = (
+    <>
+      {filter.allConditionsForDisplay.map((condition) => (
+        <FilterItem key={condition.id} filter={filter} condition={condition} isDisabled={disabledAllOperations} />
+      ))}
+      <AddFilterButton
+        filter={filter}
+        buttonConfig={{
+          label: null,
+          ...(variant === "modal" ? modalButtonConfig : headerButtonConfig),
+          iconConfig: {
+            shouldShowIcon: true,
+            iconComponent: ListFilterPlus,
+          },
+          ...buttonConfig,
+          isDisabled: disabledAllOperations,
+        }}
+      />
+    </>
+  );
+
+  const rightContent = !disabledAllOperations && (
+    <>
+      <ElementTransition show={filter.canClearFilters}>
+        <Button
+          variant="neutral-primary"
+          size="sm"
+          className={COMMON_OPERATION_BUTTON_CLASSNAME}
+          onClick={filter.clearFilters}
+          data-ph-element={trackerElements?.clearFilter}
+        >
+          {filter.clearFilterOptions?.label ?? "Clear all"}
+        </Button>
+      </ElementTransition>
+      <ElementTransition show={filter.canSaveView}>
+        <Button
+          variant="accent-primary"
+          size="sm"
+          className={COMMON_OPERATION_BUTTON_CLASSNAME}
+          onClick={filter.saveView}
+          data-ph-element={trackerElements?.saveView}
+        >
+          {filter.saveViewOptions?.label ?? "Save view"}
+        </Button>
+      </ElementTransition>
+      <ElementTransition show={filter.canUpdateView}>
+        <Button
+          variant="accent-primary"
+          size="sm"
+          className={COMMON_OPERATION_BUTTON_CLASSNAME}
+          onClick={handleUpdate}
+          loading={isUpdating}
+          disabled={isUpdating}
+          data-ph-element={trackerElements?.updateView}
+        >
+          {isUpdating ? "Confirming" : (filter.updateViewOptions?.label ?? "Update view")}
+        </Button>
+      </ElementTransition>
+    </>
+  );
+
+  const mainContent = (
+    <div className="w-full flex items-start gap-2">
+      <div className="w-full flex flex-wrap items-center gap-2">{leftContent}</div>
+      <div
+        className={cn("flex items-center gap-2 border-l border-custom-border-200 pl-4", {
+          "border-l-transparent pl-0": !hasAvailableOperations,
+        })}
+      >
+        {rightContent}
+      </div>
+    </div>
+  );
+
+  const ModalVariant = (
+    <div className="w-full flex flex-wrap items-center gap-2 min-h-11 bg-custom-background-90 rounded-lg p-2">
+      {mainContent}
+    </div>
+  );
+
+  const HeaderVariant = (
+    <Header variant={EHeaderVariant.TERNARY} className="min-h-11">
+      {mainContent}
+    </Header>
+  );
+
+  if (!filter.configManager.areConfigsReady && !hasAnyConditions) {
+    return (
+      <RowTransition show={filter.isVisible}>
+        <Loader>
+          <Loader.Item height="44px" width="100%" className={cn({ "rounded-none": variant === "header" })} />
+        </Loader>
+      </RowTransition>
+    );
   }
-);
+
+  return <RowTransition show={filter.isVisible}>{variant === "modal" ? ModalVariant : HeaderVariant}</RowTransition>;
+});
 
 const COMMON_OPERATION_BUTTON_CLASSNAME = "py-1";
 
@@ -169,35 +169,39 @@ type TElementTransitionProps = {
   show: boolean;
 };
 
-const ElementTransition = observer((props: TElementTransitionProps) => (
-  <Transition
-    show={props.show}
-    enter="transition ease-out duration-200"
-    enterFrom="opacity-0 scale-95"
-    enterTo="opacity-100 scale-100"
-    leave="transition ease-in duration-150"
-    leaveFrom="opacity-100 scale-100"
-    leaveTo="opacity-0 scale-95"
-  >
-    {props.children}
-  </Transition>
-));
+const ElementTransition = observer(function ElementTransition(props: TElementTransitionProps) {
+  return (
+    <Transition
+      show={props.show}
+      enter="transition ease-out duration-200"
+      enterFrom="opacity-0 scale-95"
+      enterTo="opacity-100 scale-100"
+      leave="transition ease-in duration-150"
+      leaveFrom="opacity-100 scale-100"
+      leaveTo="opacity-0 scale-95"
+    >
+      {props.children}
+    </Transition>
+  );
+});
 
 type TRowTransitionProps = {
   children: React.ReactNode;
   show: boolean;
 };
 
-const RowTransition = observer((props: TRowTransitionProps) => (
-  <Transition
-    show={props.show}
-    enter="transition-all duration-150 ease-out"
-    enterFrom="opacity-0 -translate-y-1"
-    enterTo="opacity-100 translate-y-0"
-    leave="transition-all duration-100 ease-in"
-    leaveFrom="opacity-100 translate-y-0"
-    leaveTo="opacity-0 -translate-y-1"
-  >
-    {props.children}
-  </Transition>
-));
+const RowTransition = observer(function RowTransition(props: TRowTransitionProps) {
+  return (
+    <Transition
+      show={props.show}
+      enter="transition-all duration-150 ease-out"
+      enterFrom="opacity-0 -translate-y-1"
+      enterTo="opacity-100 translate-y-0"
+      leave="transition-all duration-100 ease-in"
+      leaveFrom="opacity-100 translate-y-0"
+      leaveTo="opacity-0 -translate-y-1"
+    >
+      {props.children}
+    </Transition>
+  );
+});
diff --git a/apps/web/core/components/rich-filters/filters-toggle.tsx b/apps/web/core/components/rich-filters/filters-toggle.tsx
index 2f06186dd..43825099a 100644
--- a/apps/web/core/components/rich-filters/filters-toggle.tsx
+++ b/apps/web/core/components/rich-filters/filters-toggle.tsx
@@ -14,63 +14,63 @@ type TFiltersToggleProps<P extends TFilterProperty, E extends TExternalFilter> =
 const COMMON_CLASSNAME =
   "grid place-items-center h-7 w-full py-0.5 px-2 rounded border transition-all duration-200 cursor-pointer";
 
-export const FiltersToggle = observer(
-  <P extends TFilterProperty, E extends TExternalFilter>(props: TFiltersToggleProps<P, E>) => {
-    const { filter } = props;
-    // derived values
-    const hasAnyConditions = (filter?.allConditionsForDisplay.length ?? 0) > 0;
-    const isFilterRowVisible = filter?.isVisible ?? false;
-    const hasUpdates = filter?.canUpdateView === true && filter?.hasChanges === true;
-    const showFilterRowChangesPill = hasUpdates || hasAnyConditions === true;
-    const showAddFilterButton = !hasAnyConditions && !isFilterRowVisible && !hasUpdates;
+export const FiltersToggle = observer(function FiltersToggle<P extends TFilterProperty, E extends TExternalFilter>(
+  props: TFiltersToggleProps<P, E>
+) {
+  const { filter } = props;
+  // derived values
+  const hasAnyConditions = (filter?.allConditionsForDisplay.length ?? 0) > 0;
+  const isFilterRowVisible = filter?.isVisible ?? false;
+  const hasUpdates = filter?.canUpdateView === true && filter?.hasChanges === true;
+  const showFilterRowChangesPill = hasUpdates || hasAnyConditions === true;
+  const showAddFilterButton = !hasAnyConditions && !isFilterRowVisible && !hasUpdates;
 
-    const handleToggleFilter = () => {
-      if (!filter) {
-        console.error("Filters toggle error - filter instance not available");
-        return;
-      }
-      filter.toggleVisibility();
-    };
-
-    // Show the add filter button when there are no active conditions, the filter row is hidden, and no unsaved changes exist
-    if (filter && showAddFilterButton) {
-      return (
-        <AddFilterButton
-          filter={filter}
-          buttonConfig={{
-            variant: "neutral-primary",
-            className: COMMON_CLASSNAME,
-            label: null,
-          }}
-          onFilterSelect={() => filter?.toggleVisibility(true)}
-        />
-      );
+  const handleToggleFilter = () => {
+    if (!filter) {
+      console.error("Filters toggle error - filter instance not available");
+      return;
     }
+    filter.toggleVisibility();
+  };
 
+  // Show the add filter button when there are no active conditions, the filter row is hidden, and no unsaved changes exist
+  if (filter && showAddFilterButton) {
     return (
-      <div
-        className={cn(COMMON_CLASSNAME, {
-          "border-transparent bg-custom-primary-100/10 hover:bg-custom-primary-100/20": isFilterRowVisible,
-          "border-custom-border-200 hover:bg-custom-background-90": !isFilterRowVisible,
-        })}
-        onClick={handleToggleFilter}
-      >
-        <div className="relative">
-          <ListFilter
-            className={cn("size-4", {
-              "text-custom-primary-100": isFilterRowVisible,
-              "text-custom-text-300": !isFilterRowVisible,
-            })}
-          />
-          {showFilterRowChangesPill && (
-            <span
-              className={cn("p-[3px] rounded-full bg-custom-primary-100 absolute top-[0.2px] -right-[0.4px]", {
-                "bg-custom-text-300": hasAnyConditions === false && filter?.hasChanges === true, // If there are no conditions and there are changes, show the pill in the background color
-              })}
-            />
-          )}
-        </div>
-      </div>
+      <AddFilterButton
+        filter={filter}
+        buttonConfig={{
+          variant: "neutral-primary",
+          className: COMMON_CLASSNAME,
+          label: null,
+        }}
+        onFilterSelect={() => filter?.toggleVisibility(true)}
+      />
     );
   }
-);
+
+  return (
+    <div
+      className={cn(COMMON_CLASSNAME, {
+        "border-transparent bg-custom-primary-100/10 hover:bg-custom-primary-100/20": isFilterRowVisible,
+        "border-custom-border-200 hover:bg-custom-background-90": !isFilterRowVisible,
+      })}
+      onClick={handleToggleFilter}
+    >
+      <div className="relative">
+        <ListFilter
+          className={cn("size-4", {
+            "text-custom-primary-100": isFilterRowVisible,
+            "text-custom-text-300": !isFilterRowVisible,
+          })}
+        />
+        {showFilterRowChangesPill && (
+          <span
+            className={cn("p-[3px] rounded-full bg-custom-primary-100 absolute top-[0.2px] -right-[0.4px]", {
+              "bg-custom-text-300": hasAnyConditions === false && filter?.hasChanges === true, // If there are no conditions and there are changes, show the pill in the background color
+            })}
+          />
+        )}
+      </div>
+    </div>
+  );
+});
diff --git a/apps/web/core/components/settings/content-wrapper.tsx b/apps/web/core/components/settings/content-wrapper.tsx
index 6d9be9c5c..a15566d66 100644
--- a/apps/web/core/components/settings/content-wrapper.tsx
+++ b/apps/web/core/components/settings/content-wrapper.tsx
@@ -6,7 +6,7 @@ type TProps = {
   children: ReactNode;
   size?: "lg" | "md";
 };
-export const SettingsContentWrapper = observer((props: TProps) => {
+export const SettingsContentWrapper = observer(function SettingsContentWrapper(props: TProps) {
   const { children, size = "md" } = props;
 
   return (
diff --git a/apps/web/core/components/settings/header.tsx b/apps/web/core/components/settings/header.tsx
index 4f2e2128d..c5c06a9bb 100644
--- a/apps/web/core/components/settings/header.tsx
+++ b/apps/web/core/components/settings/header.tsx
@@ -15,7 +15,7 @@ import { useUserSettings } from "@/hooks/store/user";
 import { WorkspaceLogo } from "../workspace/logo";
 import SettingsTabs from "./tabs";
 
-export const SettingsHeader = observer(() => {
+export const SettingsHeader = observer(function SettingsHeader() {
   // hooks
   const { t } = useTranslation();
   const { currentWorkspace } = useWorkspace();
diff --git a/apps/web/core/components/settings/heading.tsx b/apps/web/core/components/settings/heading.tsx
index 9ab0315f9..a7fda314d 100644
--- a/apps/web/core/components/settings/heading.tsx
+++ b/apps/web/core/components/settings/heading.tsx
@@ -14,7 +14,7 @@ type Props = {
   className?: string;
 };
 
-export const SettingsHeading = ({
+export function SettingsHeading({
   title,
   description,
   button,
@@ -22,25 +22,27 @@ export const SettingsHeading = ({
   customButton,
   showButton = true,
   className,
-}: Props) => (
-  <div
-    className={cn(
-      "flex flex-col md:flex-row gap-2 items-start md:items-center justify-between border-b border-custom-border-100 pb-3.5",
-      className
-    )}
-  >
-    <div className="flex flex-col items-start gap-1">
-      {typeof title === "string" ? <h3 className="text-xl font-medium">{title}</h3> : title}
-      {description && <div className="text-sm text-custom-text-300">{description}</div>}
+}: Props) {
+  return (
+    <div
+      className={cn(
+        "flex flex-col md:flex-row gap-2 items-start md:items-center justify-between border-b border-custom-border-100 pb-3.5",
+        className
+      )}
+    >
+      <div className="flex flex-col items-start gap-1">
+        {typeof title === "string" ? <h3 className="text-xl font-medium">{title}</h3> : title}
+        {description && <div className="text-sm text-custom-text-300">{description}</div>}
+      </div>
+      {showButton && customButton}
+      {button && showButton && (
+        <Button variant="primary" onClick={button.onClick} size="sm" className="w-fit">
+          {button.label}
+        </Button>
+      )}
+      {appendToRight}
     </div>
-    {showButton && customButton}
-    {button && showButton && (
-      <Button variant="primary" onClick={button.onClick} size="sm" className="w-fit">
-        {button.label}
-      </Button>
-    )}
-    {appendToRight}
-  </div>
-);
+  );
+}
 
 export default SettingsHeading;
diff --git a/apps/web/core/components/settings/layout.tsx b/apps/web/core/components/settings/layout.tsx
index ff2b567af..43923e0df 100644
--- a/apps/web/core/components/settings/layout.tsx
+++ b/apps/web/core/components/settings/layout.tsx
@@ -1,7 +1,11 @@
 import { useRef } from "react";
 import { observer } from "mobx-react";
 
-export const SettingsContentLayout = observer(({ children }: { children: React.ReactNode }) => {
+export const SettingsContentLayout = observer(function SettingsContentLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
   // refs
   const ref = useRef<HTMLDivElement>(null);
 
diff --git a/apps/web/core/components/settings/mobile/nav.tsx b/apps/web/core/components/settings/mobile/nav.tsx
index d2668e0d8..49159ddc2 100644
--- a/apps/web/core/components/settings/mobile/nav.tsx
+++ b/apps/web/core/components/settings/mobile/nav.tsx
@@ -11,7 +11,7 @@ type Props = {
   activePath: string;
 };
 
-export const SettingsMobileNav = observer((props: Props) => {
+export const SettingsMobileNav = observer(function SettingsMobileNav(props: Props) {
   const { hamburgerContent: HamburgerContent, activePath } = props;
   // refs
   const sidebarRef = useRef<HTMLDivElement>(null);
diff --git a/apps/web/core/components/settings/project/sidebar/nav-item-children.tsx b/apps/web/core/components/settings/project/sidebar/nav-item-children.tsx
index 0812b8871..c882da0e6 100644
--- a/apps/web/core/components/settings/project/sidebar/nav-item-children.tsx
+++ b/apps/web/core/components/settings/project/sidebar/nav-item-children.tsx
@@ -11,7 +11,7 @@ import { useUserPermissions, useUserSettings } from "@/hooks/store/user";
 import { PROJECT_SETTINGS_LINKS } from "@/plane-web/constants/project";
 import { getProjectSettingsPageLabelI18nKey } from "@/plane-web/helpers/project-settings";
 
-export const NavItemChildren = observer((props: { projectId: string }) => {
+export const NavItemChildren = observer(function NavItemChildren(props: { projectId: string }) {
   const { projectId } = props;
   const { workspaceSlug } = useParams();
   const pathname = usePathname();
diff --git a/apps/web/core/components/settings/project/sidebar/root.tsx b/apps/web/core/components/settings/project/sidebar/root.tsx
index 51c9ea4a1..cbb6f3f9f 100644
--- a/apps/web/core/components/settings/project/sidebar/root.tsx
+++ b/apps/web/core/components/settings/project/sidebar/root.tsx
@@ -15,7 +15,7 @@ type TProjectSettingsSidebarProps = {
   isMobile?: boolean;
 };
 
-export const ProjectSettingsSidebar = observer((props: TProjectSettingsSidebarProps) => {
+export const ProjectSettingsSidebar = observer(function ProjectSettingsSidebar(props: TProjectSettingsSidebarProps) {
   const { isMobile = false } = props;
   const { workspaceSlug } = useParams();
   // store hooks
diff --git a/apps/web/core/components/settings/sidebar/header.tsx b/apps/web/core/components/settings/sidebar/header.tsx
index 12db096a4..fec333c3e 100644
--- a/apps/web/core/components/settings/sidebar/header.tsx
+++ b/apps/web/core/components/settings/sidebar/header.tsx
@@ -8,7 +8,9 @@ import { useWorkspace } from "@/hooks/store/use-workspace";
 // plane web imports
 import { SubscriptionPill } from "@/plane-web/components/common/subscription/subscription-pill";
 
-export const SettingsSidebarHeader = observer((props: { customHeader?: React.ReactNode }) => {
+export const SettingsSidebarHeader = observer(function SettingsSidebarHeader(props: {
+  customHeader?: React.ReactNode;
+}) {
   const { customHeader } = props;
   const { currentWorkspace } = useWorkspace();
   return customHeader
diff --git a/apps/web/core/components/settings/sidebar/nav-item.tsx b/apps/web/core/components/settings/sidebar/nav-item.tsx
index 3fc56e63f..3570b9b27 100644
--- a/apps/web/core/components/settings/sidebar/nav-item.tsx
+++ b/apps/web/core/components/settings/sidebar/nav-item.tsx
@@ -26,7 +26,7 @@ export type TSettingsSidebarNavItemProps = {
   renderChildren?: (key: string) => React.ReactNode;
 };
 
-const SettingsSidebarNavItem = observer((props: TSettingsSidebarNavItemProps) => {
+const SettingsSidebarNavItem = observer(function SettingsSidebarNavItem(props: TSettingsSidebarNavItemProps) {
   const { workspaceSlug, setting, isActive, actionIcons, appendItemsToTitle, renderChildren } = props;
   // router
   const { projectId } = useParams();
diff --git a/apps/web/core/components/settings/sidebar/root.tsx b/apps/web/core/components/settings/sidebar/root.tsx
index 9f243746c..0d5e0e4fd 100644
--- a/apps/web/core/components/settings/sidebar/root.tsx
+++ b/apps/web/core/components/settings/sidebar/root.tsx
@@ -20,7 +20,7 @@ interface SettingsSidebarProps {
   renderChildren?: (key: string) => React.ReactNode;
 }
 
-export const SettingsSidebar = observer((props: SettingsSidebarProps) => {
+export const SettingsSidebar = observer(function SettingsSidebar(props: SettingsSidebarProps) {
   const {
     isMobile = false,
     customHeader,
diff --git a/apps/web/core/components/settings/tabs.tsx b/apps/web/core/components/settings/tabs.tsx
index 33ac26a76..84712135a 100644
--- a/apps/web/core/components/settings/tabs.tsx
+++ b/apps/web/core/components/settings/tabs.tsx
@@ -22,7 +22,7 @@ const TABS = {
   },
 };
 
-const SettingsTabs = observer(() => {
+const SettingsTabs = observer(function SettingsTabs() {
   // router
   const pathname = usePathname();
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/sidebar/add-button.tsx b/apps/web/core/components/sidebar/add-button.tsx
index cea37334f..8102a88c8 100644
--- a/apps/web/core/components/sidebar/add-button.tsx
+++ b/apps/web/core/components/sidebar/add-button.tsx
@@ -7,7 +7,7 @@ type Props = React.ComponentProps<"button"> & {
   onClick: () => void;
 };
 
-export const SidebarAddButton: FC<Props> = (props) => {
+export function SidebarAddButton(props: Props) {
   const { label, onClick, disabled, ...rest } = props;
   return (
     <button
@@ -23,4 +23,4 @@ export const SidebarAddButton: FC<Props> = (props) => {
       {label}
     </button>
   );
-};
+}
diff --git a/apps/web/core/components/sidebar/search-button.tsx b/apps/web/core/components/sidebar/search-button.tsx
index d87adf84b..6716fe7ff 100644
--- a/apps/web/core/components/sidebar/search-button.tsx
+++ b/apps/web/core/components/sidebar/search-button.tsx
@@ -7,7 +7,7 @@ type Props = {
   isActive?: boolean;
 };
 
-export const SidebarSearchButton: FC<Props> = (props) => {
+export function SidebarSearchButton(props: Props) {
   const { isActive } = props;
   return (
     <div
@@ -25,4 +25,4 @@ export const SidebarSearchButton: FC<Props> = (props) => {
       />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/sidebar/sidebar-item.tsx b/apps/web/core/components/sidebar/sidebar-item.tsx
index 48d0b0ccf..8342dfd87 100644
--- a/apps/web/core/components/sidebar/sidebar-item.tsx
+++ b/apps/web/core/components/sidebar/sidebar-item.tsx
@@ -60,7 +60,7 @@ const styles = {
 // SUB-COMPONENTS
 // ============================================================================
 
-const AppSidebarItemLabel: React.FC<AppSidebarItemLabelProps> = ({ highlight = false, label }) => {
+function AppSidebarItemLabel({ highlight = false, label }: AppSidebarItemLabelProps) {
   if (!label) return null;
 
   return (
@@ -73,9 +73,9 @@ const AppSidebarItemLabel: React.FC<AppSidebarItemLabelProps> = ({ highlight = f
       {label}
     </span>
   );
-};
+}
 
-const AppSidebarItemIcon: React.FC<AppSidebarItemIconProps> = ({ icon, highlight }) => {
+function AppSidebarItemIcon({ icon, highlight }: AppSidebarItemIconProps) {
   if (!icon) return null;
 
   return (
@@ -88,9 +88,9 @@ const AppSidebarItemIcon: React.FC<AppSidebarItemIconProps> = ({ icon, highlight
       {icon}
     </div>
   );
-};
+}
 
-const AppSidebarLinkItem: React.FC<AppSidebarLinkItemProps> = ({ href, children, className }) => {
+function AppSidebarLinkItem({ href, children, className }: AppSidebarLinkItemProps) {
   if (!href) return null;
 
   return (
@@ -98,18 +98,15 @@ const AppSidebarLinkItem: React.FC<AppSidebarLinkItemProps> = ({ href, children,
       {children}
     </Link>
   );
-};
+}
 
-const AppSidebarButtonItem: React.FC<AppSidebarButtonItemProps> = ({
-  children,
-  onClick,
-  disabled = false,
-  className,
-}) => (
-  <button className={cn(styles.base, className)} onClick={onClick} disabled={disabled} type="button">
-    {children}
-  </button>
-);
+function AppSidebarButtonItem({ children, onClick, disabled = false, className }: AppSidebarButtonItemProps) {
+  return (
+    <button className={cn(styles.base, className)} onClick={onClick} disabled={disabled} type="button">
+      {children}
+    </button>
+  );
+}
 
 // ============================================================================
 // MAIN COMPONENT
@@ -122,7 +119,7 @@ type AppSidebarItemComponent = React.FC<AppSidebarItemProps> & {
   Button: React.FC<AppSidebarButtonItemProps>;
 };
 
-const AppSidebarItem: AppSidebarItemComponent = ({ variant = "link", item }) => {
+function AppSidebarItem({ variant = "link", item }) {
   if (!item) return null;
 
   const { icon, isActive, label, href, onClick, disabled } = item;
@@ -143,7 +140,7 @@ const AppSidebarItem: AppSidebarItemComponent = ({ variant = "link", item }) =>
       {commonItems}
     </AppSidebarButtonItem>
   );
-};
+}
 
 // ============================================================================
 // COMPOUND COMPONENT ASSIGNMENT
diff --git a/apps/web/core/components/sidebar/sidebar-navigation.tsx b/apps/web/core/components/sidebar/sidebar-navigation.tsx
index ba0c08c54..7e8ffca5a 100644
--- a/apps/web/core/components/sidebar/sidebar-navigation.tsx
+++ b/apps/web/core/components/sidebar/sidebar-navigation.tsx
@@ -10,7 +10,7 @@ type TSidebarNavItem = {
   children?: React.ReactNode;
 };
 
-export const SidebarNavItem: FC<TSidebarNavItem> = (props) => {
+export function SidebarNavItem(props: TSidebarNavItem) {
   const { className, isActive, children } = props;
   return (
     <div
@@ -27,4 +27,4 @@ export const SidebarNavItem: FC<TSidebarNavItem> = (props) => {
       {children}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/sidebar/sidebar-toggle-button.tsx b/apps/web/core/components/sidebar/sidebar-toggle-button.tsx
index c0b279f9c..1983e1463 100644
--- a/apps/web/core/components/sidebar/sidebar-toggle-button.tsx
+++ b/apps/web/core/components/sidebar/sidebar-toggle-button.tsx
@@ -5,7 +5,7 @@ import { PanelLeft } from "lucide-react";
 // hooks
 import { useAppTheme } from "@/hooks/store/use-app-theme";
 
-export const AppSidebarToggleButton = observer(() => {
+export const AppSidebarToggleButton = observer(function AppSidebarToggleButton() {
   // store hooks
   const { toggleSidebar, sidebarPeek, toggleSidebarPeek } = useAppTheme();
 
diff --git a/apps/web/core/components/sidebar/sidebar-wrapper.tsx b/apps/web/core/components/sidebar/sidebar-wrapper.tsx
index b709b607d..eb21d47de 100644
--- a/apps/web/core/components/sidebar/sidebar-wrapper.tsx
+++ b/apps/web/core/components/sidebar/sidebar-wrapper.tsx
@@ -21,7 +21,7 @@ type TSidebarWrapperProps = {
   quickActions?: React.ReactNode;
 };
 
-export const SidebarWrapper: FC<TSidebarWrapperProps> = observer((props) => {
+export const SidebarWrapper = observer(function SidebarWrapper(props: TSidebarWrapperProps) {
   const { children, title, quickActions } = props;
   // store hooks
   const { toggleSidebar, sidebarCollapsed } = useAppTheme();
diff --git a/apps/web/core/components/stickies/action-bar.tsx b/apps/web/core/components/stickies/action-bar.tsx
index 339a84250..7faeb9368 100644
--- a/apps/web/core/components/stickies/action-bar.tsx
+++ b/apps/web/core/components/stickies/action-bar.tsx
@@ -18,7 +18,7 @@ import { STICKY_COLORS_LIST } from "../editor/sticky-editor/color-palette";
 import { AllStickiesModal } from "./modal";
 import { StickyNote } from "./sticky";
 
-export const StickyActionBar = observer(() => {
+export const StickyActionBar = observer(function StickyActionBar() {
   // states
   const [isExpanded, setIsExpanded] = useState(false);
   const [newSticky, setNewSticky] = useState(false);
diff --git a/apps/web/core/components/stickies/delete-modal.tsx b/apps/web/core/components/stickies/delete-modal.tsx
index 82455186f..6c7cbd86f 100644
--- a/apps/web/core/components/stickies/delete-modal.tsx
+++ b/apps/web/core/components/stickies/delete-modal.tsx
@@ -13,7 +13,7 @@ interface IStickyDelete {
   handleClose: () => void;
 }
 
-export const StickyDeleteModal: React.FC<IStickyDelete> = observer((props) => {
+export const StickyDeleteModal = observer(function StickyDeleteModal(props: IStickyDelete) {
   const { isOpen, handleClose, handleSubmit } = props;
   // states
   const [loader, setLoader] = useState(false);
diff --git a/apps/web/core/components/stickies/layout/stickies-infinite.tsx b/apps/web/core/components/stickies/layout/stickies-infinite.tsx
index a81cb4476..2a9fd0917 100644
--- a/apps/web/core/components/stickies/layout/stickies-infinite.tsx
+++ b/apps/web/core/components/stickies/layout/stickies-infinite.tsx
@@ -9,7 +9,7 @@ import { useIntersectionObserver } from "@/hooks/use-intersection-observer";
 import { useSticky } from "@/hooks/use-stickies";
 import { StickiesLayout } from "./stickies-list";
 
-export const StickiesInfinite = observer(() => {
+export const StickiesInfinite = observer(function StickiesInfinite() {
   const { workspaceSlug } = useParams();
   // hooks
   const { fetchWorkspaceStickies, fetchNextWorkspaceStickies, getWorkspaceStickyIds, loader, paginationInfo } =
diff --git a/apps/web/core/components/stickies/layout/stickies-list.tsx b/apps/web/core/components/stickies/layout/stickies-list.tsx
index beab782f2..aa77dcec7 100644
--- a/apps/web/core/components/stickies/layout/stickies-list.tsx
+++ b/apps/web/core/components/stickies/layout/stickies-list.tsx
@@ -40,7 +40,7 @@ type TProps = TStickiesLayout & {
   columnCount: number;
 };
 
-export const StickiesList = observer((props: TProps) => {
+export const StickiesList = observer(function StickiesList(props: TProps) {
   const { workspaceSlug, intersectionElement, columnCount } = props;
   // navigation
   const pathname = usePathname();
@@ -166,7 +166,7 @@ export const StickiesList = observer((props: TProps) => {
   );
 });
 
-export const StickiesLayout = (props: TStickiesLayout) => {
+export function StickiesLayout(props: TStickiesLayout) {
   // states
   const [containerWidth, setContainerWidth] = useState<number | null>(null);
   // refs
@@ -203,4 +203,4 @@ export const StickiesLayout = (props: TStickiesLayout) => {
       <StickiesList {...props} columnCount={columnCount} />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/stickies/layout/stickies-loader.tsx b/apps/web/core/components/stickies/layout/stickies-loader.tsx
index 2afe5ff12..394133643 100644
--- a/apps/web/core/components/stickies/layout/stickies-loader.tsx
+++ b/apps/web/core/components/stickies/layout/stickies-loader.tsx
@@ -1,45 +1,47 @@
 // plane ui
 import { Loader } from "@plane/ui";
 
-export const StickiesLoader = () => (
-  <div className="overflow-scroll pb-2 grid grid-cols-4 gap-4">
-    {Array.from({ length: 4 }).map((_, index) => (
-      <Loader key={index} className="space-y-5 border border-custom-border-200 p-3 rounded">
-        <div className="space-y-2">
-          <Loader.Item height="20px" />
-          <Loader.Item height="15px" width="75%" />
-        </div>
-        <div className="space-y-2">
-          <div className="flex items-center gap-2">
-            <Loader.Item height="15px" width="15px" className="flex-shrink-0" />
-            <Loader.Item height="15px" width="100%" />
-          </div>
-          <div className="flex items-center gap-2">
-            <Loader.Item height="15px" width="15px" className="flex-shrink-0" />
+export function StickiesLoader() {
+  return (
+    <div className="overflow-scroll pb-2 grid grid-cols-4 gap-4">
+      {Array.from({ length: 4 }).map((_, index) => (
+        <Loader key={index} className="space-y-5 border border-custom-border-200 p-3 rounded">
+          <div className="space-y-2">
+            <Loader.Item height="20px" />
             <Loader.Item height="15px" width="75%" />
           </div>
-          <div className="flex items-center gap-2">
-            <Loader.Item height="15px" width="15px" className="flex-shrink-0" />
-            <Loader.Item height="15px" width="90%" />
+          <div className="space-y-2">
+            <div className="flex items-center gap-2">
+              <Loader.Item height="15px" width="15px" className="flex-shrink-0" />
+              <Loader.Item height="15px" width="100%" />
+            </div>
+            <div className="flex items-center gap-2">
+              <Loader.Item height="15px" width="15px" className="flex-shrink-0" />
+              <Loader.Item height="15px" width="75%" />
+            </div>
+            <div className="flex items-center gap-2">
+              <Loader.Item height="15px" width="15px" className="flex-shrink-0" />
+              <Loader.Item height="15px" width="90%" />
+            </div>
+            <div className="flex items-center gap-2">
+              <Loader.Item height="15px" width="15px" className="flex-shrink-0" />
+              <Loader.Item height="15px" width="60%" />
+            </div>
+            <div className="flex items-center gap-2">
+              <Loader.Item height="15px" width="15px" className="flex-shrink-0" />
+              <Loader.Item height="15px" width="50%" />
+            </div>
           </div>
-          <div className="flex items-center gap-2">
-            <Loader.Item height="15px" width="15px" className="flex-shrink-0" />
-            <Loader.Item height="15px" width="60%" />
+          <div className="flex items-center justify-between gap-2">
+            <div className="flex items-center gap-2">
+              <Loader.Item height="25px" width="25px" />
+              <Loader.Item height="25px" width="25px" />
+              <Loader.Item height="25px" width="25px" />
+            </div>
+            <Loader.Item height="25px" width="25px" className="flex-shrink-0" />
           </div>
-          <div className="flex items-center gap-2">
-            <Loader.Item height="15px" width="15px" className="flex-shrink-0" />
-            <Loader.Item height="15px" width="50%" />
-          </div>
-        </div>
-        <div className="flex items-center justify-between gap-2">
-          <div className="flex items-center gap-2">
-            <Loader.Item height="25px" width="25px" />
-            <Loader.Item height="25px" width="25px" />
-            <Loader.Item height="25px" width="25px" />
-          </div>
-          <Loader.Item height="25px" width="25px" className="flex-shrink-0" />
-        </div>
-      </Loader>
-    ))}
-  </div>
-);
+        </Loader>
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/stickies/layout/stickies-truncated.tsx b/apps/web/core/components/stickies/layout/stickies-truncated.tsx
index c163d7d32..217adb5a6 100644
--- a/apps/web/core/components/stickies/layout/stickies-truncated.tsx
+++ b/apps/web/core/components/stickies/layout/stickies-truncated.tsx
@@ -15,7 +15,7 @@ type StickiesTruncatedProps = {
   handleClose?: () => void;
 };
 
-export const StickiesTruncated = observer((props: StickiesTruncatedProps) => {
+export const StickiesTruncated = observer(function StickiesTruncated(props: StickiesTruncatedProps) {
   const { handleClose = () => {} } = props;
   // navigation
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/stickies/layout/sticky-dnd-wrapper.tsx b/apps/web/core/components/stickies/layout/sticky-dnd-wrapper.tsx
index 76e2ab3ab..a72c825e9 100644
--- a/apps/web/core/components/stickies/layout/sticky-dnd-wrapper.tsx
+++ b/apps/web/core/components/stickies/layout/sticky-dnd-wrapper.tsx
@@ -32,7 +32,7 @@ type Props = {
   handleLayout: () => void;
 };
 
-export const StickyDNDWrapper = observer((props: Props) => {
+export const StickyDNDWrapper = observer(function StickyDNDWrapper(props: Props) {
   const { stickyId, workspaceSlug, itemWidth, isLastChild, isInFirstRow, isInLastRow, handleDrop, handleLayout } =
     props;
   // states
diff --git a/apps/web/core/components/stickies/modal/index.tsx b/apps/web/core/components/stickies/modal/index.tsx
index 8a91bd113..dbc824211 100644
--- a/apps/web/core/components/stickies/modal/index.tsx
+++ b/apps/web/core/components/stickies/modal/index.tsx
@@ -5,11 +5,11 @@ type TProps = {
   isOpen: boolean;
   handleClose: () => void;
 };
-export const AllStickiesModal = (props: TProps) => {
+export function AllStickiesModal(props: TProps) {
   const { isOpen, handleClose } = props;
   return (
     <ModalCore isOpen={isOpen} handleClose={handleClose} width={EModalWidth.VXL}>
       <Stickies handleClose={handleClose} />
     </ModalCore>
   );
-};
+}
diff --git a/apps/web/core/components/stickies/modal/search.tsx b/apps/web/core/components/stickies/modal/search.tsx
index f0ec79b4a..4a876e986 100644
--- a/apps/web/core/components/stickies/modal/search.tsx
+++ b/apps/web/core/components/stickies/modal/search.tsx
@@ -14,7 +14,7 @@ import { CloseIcon } from "@plane/propel/icons";
 import { cn } from "@plane/utils";
 import { useSticky } from "@/hooks/use-stickies";
 
-export const StickySearch: FC = observer(() => {
+export const StickySearch = observer(function StickySearch() {
   // router
   const { workspaceSlug } = useParams();
   // hooks
diff --git a/apps/web/core/components/stickies/modal/stickies.tsx b/apps/web/core/components/stickies/modal/stickies.tsx
index b3e6dd4e6..93b025f02 100644
--- a/apps/web/core/components/stickies/modal/stickies.tsx
+++ b/apps/web/core/components/stickies/modal/stickies.tsx
@@ -14,7 +14,7 @@ type TProps = {
   handleClose?: () => void;
 };
 
-export const Stickies = observer((props: TProps) => {
+export const Stickies = observer(function Stickies(props: TProps) {
   const { handleClose } = props;
   // navigation
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/stickies/sticky/inputs.tsx b/apps/web/core/components/stickies/sticky/inputs.tsx
index b7ba84f1c..3fad50c6b 100644
--- a/apps/web/core/components/stickies/sticky/inputs.tsx
+++ b/apps/web/core/components/stickies/sticky/inputs.tsx
@@ -23,7 +23,7 @@ type TProps = {
   handleDelete: () => void;
 };
 
-export const StickyInput = (props: TProps) => {
+export function StickyInput(props: TProps) {
   const { stickyData, workspaceSlug, handleUpdate, stickyId, handleDelete, handleChange, showToolbar } = props;
   // refs
   const editorRef = useRef<EditorRefApi>(null);
@@ -97,4 +97,4 @@ export const StickyInput = (props: TProps) => {
       />
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/stickies/sticky/root.tsx b/apps/web/core/components/stickies/sticky/root.tsx
index b6af634cc..a9d348737 100644
--- a/apps/web/core/components/stickies/sticky/root.tsx
+++ b/apps/web/core/components/stickies/sticky/root.tsx
@@ -22,7 +22,7 @@ type TProps = {
   showToolbar?: boolean;
   handleLayout?: () => void;
 };
-export const StickyNote = observer((props: TProps) => {
+export const StickyNote = observer(function StickyNote(props: TProps) {
   const { onClose, workspaceSlug, className = "", stickyId, showToolbar, handleLayout } = props;
   // navigation
   // const pathName = usePathname();
diff --git a/apps/web/core/components/stickies/sticky/sticky-item-drag-handle.tsx b/apps/web/core/components/stickies/sticky/sticky-item-drag-handle.tsx
index 40405dfa5..cc55f7573 100644
--- a/apps/web/core/components/stickies/sticky/sticky-item-drag-handle.tsx
+++ b/apps/web/core/components/stickies/sticky/sticky-item-drag-handle.tsx
@@ -11,7 +11,7 @@ type Props = {
   isDragging: boolean;
 };
 
-export const StickyItemDragHandle: FC<Props> = observer((props) => {
+export const StickyItemDragHandle = observer(function StickyItemDragHandle(props: Props) {
   const { isDragging } = props;
 
   return (
diff --git a/apps/web/core/components/stickies/widget.tsx b/apps/web/core/components/stickies/widget.tsx
index 5a96ec644..89fe9b1d3 100644
--- a/apps/web/core/components/stickies/widget.tsx
+++ b/apps/web/core/components/stickies/widget.tsx
@@ -10,7 +10,7 @@ import { StickiesTruncated } from "./layout/stickies-truncated";
 import { StickySearch } from "./modal/search";
 import { useStickyOperations } from "./sticky/use-operations";
 
-export const StickiesWidget: React.FC = observer(() => {
+export const StickiesWidget = observer(function StickiesWidget() {
   // params
   const { workspaceSlug } = useParams();
   // store hooks
diff --git a/apps/web/core/components/ui/empty-space.tsx b/apps/web/core/components/ui/empty-space.tsx
index 2694baa3e..83574c9bc 100644
--- a/apps/web/core/components/ui/empty-space.tsx
+++ b/apps/web/core/components/ui/empty-space.tsx
@@ -11,33 +11,35 @@ type EmptySpaceProps = {
   link?: { text: string; href: string };
 };
 
-const EmptySpace: React.FC<EmptySpaceProps> = ({ title, description, children, Icon, link }) => (
-  <>
-    <div className="max-w-lg">
-      {Icon ? (
-        <div className="mb-4">
-          <Icon className="h-14 w-14 text-custom-text-200" />
-        </div>
-      ) : null}
+function EmptySpace({ title, description, children, Icon, link }: EmptySpaceProps) {
+  return (
+    <>
+      <div className="max-w-lg">
+        {Icon ? (
+          <div className="mb-4">
+            <Icon className="h-14 w-14 text-custom-text-200" />
+          </div>
+        ) : null}
 
-      <h2 className="text-lg font-medium text-custom-text-100">{title}</h2>
-      <div className="mt-1 text-sm text-custom-text-200">{description}</div>
-      <ul role="list" className="mt-6 divide-y divide-custom-border-200 border-b border-t border-custom-border-200">
-        {children}
-      </ul>
-      {link ? (
-        <div className="mt-6 flex">
-          <Link href={link.href}>
-            <span className="text-sm font-medium text-custom-primary hover:text-custom-primary">
-              {link.text}
-              <span aria-hidden="true"> &rarr;</span>
-            </span>
-          </Link>
-        </div>
-      ) : null}
-    </div>
-  </>
-);
+        <h2 className="text-lg font-medium text-custom-text-100">{title}</h2>
+        <div className="mt-1 text-sm text-custom-text-200">{description}</div>
+        <ul role="list" className="mt-6 divide-y divide-custom-border-200 border-b border-t border-custom-border-200">
+          {children}
+        </ul>
+        {link ? (
+          <div className="mt-6 flex">
+            <Link href={link.href}>
+              <span className="text-sm font-medium text-custom-primary hover:text-custom-primary">
+                {link.text}
+                <span aria-hidden="true"> &rarr;</span>
+              </span>
+            </Link>
+          </div>
+        ) : null}
+      </div>
+    </>
+  );
+}
 
 type EmptySpaceItemProps = {
   title: string;
@@ -47,7 +49,7 @@ type EmptySpaceItemProps = {
   href?: string;
 };
 
-const EmptySpaceItem: React.FC<EmptySpaceItemProps> = ({ title, description, Icon, action, href }) => {
+function EmptySpaceItem({ title, description, Icon, action, href }: EmptySpaceItemProps) {
   let spaceItem = (
     <div className={`group relative flex ${description ? "items-start" : "items-center"} space-x-3 py-4`}>
       <div className="flex-shrink-0">
@@ -79,6 +81,6 @@ const EmptySpaceItem: React.FC<EmptySpaceItemProps> = ({ title, description, Ico
       </li>
     </>
   );
-};
+}
 
 export { EmptySpace, EmptySpaceItem };
diff --git a/apps/web/core/components/ui/integration-and-import-export-banner.tsx b/apps/web/core/components/ui/integration-and-import-export-banner.tsx
index e05a19606..216a29ccd 100644
--- a/apps/web/core/components/ui/integration-and-import-export-banner.tsx
+++ b/apps/web/core/components/ui/integration-and-import-export-banner.tsx
@@ -5,14 +5,16 @@ type Props = {
   description?: string;
 };
 
-export const IntegrationAndImportExportBanner: React.FC<Props> = ({ bannerName, description }) => (
-  <div className="flex items-start gap-3 border-b border-custom-border-100 py-3.5">
-    <h3 className="text-xl font-medium">{bannerName}</h3>
-    {description && (
-      <div className="flex items-center gap-3 rounded-[10px] border border-custom-primary/75 bg-custom-primary/5 p-4 text-sm text-custom-text-100">
-        <AlertCircle className="h-6 w-6 text-custom-text-100" />
-        <p className="leading-5">{description}</p>
-      </div>
-    )}
-  </div>
-);
+export function IntegrationAndImportExportBanner({ bannerName, description }: Props) {
+  return (
+    <div className="flex items-start gap-3 border-b border-custom-border-100 py-3.5">
+      <h3 className="text-xl font-medium">{bannerName}</h3>
+      {description && (
+        <div className="flex items-center gap-3 rounded-[10px] border border-custom-primary/75 bg-custom-primary/5 p-4 text-sm text-custom-text-100">
+          <AlertCircle className="h-6 w-6 text-custom-text-100" />
+          <p className="leading-5">{description}</p>
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/ui/labels-list.tsx b/apps/web/core/components/ui/labels-list.tsx
index 142121351..931ccb1f0 100644
--- a/apps/web/core/components/ui/labels-list.tsx
+++ b/apps/web/core/components/ui/labels-list.tsx
@@ -14,7 +14,7 @@ type IssueLabelsListProps = {
   showLength?: boolean;
 };
 
-export const IssueLabelsList: FC<IssueLabelsListProps> = (props) => {
+export function IssueLabelsList(props: IssueLabelsListProps) {
   const { labels } = props;
   const { isMobile } = usePlatformOS();
   return (
@@ -37,4 +37,4 @@ export const IssueLabelsList: FC<IssueLabelsListProps> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/ui/loader/cycle-module-board-loader.tsx b/apps/web/core/components/ui/loader/cycle-module-board-loader.tsx
index a4fe6b188..21024f893 100644
--- a/apps/web/core/components/ui/loader/cycle-module-board-loader.tsx
+++ b/apps/web/core/components/ui/loader/cycle-module-board-loader.tsx
@@ -1,43 +1,45 @@
 import { range } from "lodash-es";
 
-export const CycleModuleBoardLayoutLoader = () => (
-  <div className="h-full w-full animate-pulse">
-    <div className="flex h-full w-full justify-between">
-      <div className="grid h-full w-full grid-cols-1 gap-6 overflow-y-auto p-8 lg:grid-cols-2 xl:grid-cols-3 3xl:grid-cols-4 auto-rows-max transition-all">
-        {range(5).map((i) => (
-          <div
-            key={i}
-            className="flex h-44 w-full flex-col justify-between rounded  border border-custom-border-100 bg-custom-background-100 p-4 text-sm"
-          >
-            <div className="flex items-center justify-between">
-              <span className="h-6 w-24 bg-custom-background-80 rounded" />
-              <div className="flex items-center gap-2">
-                <span className="h-6 w-20 bg-custom-background-80 rounded" />
-                <span className="h-6 w-6 bg-custom-background-80 rounded" />
-              </div>
-            </div>
-            <div className="flex flex-col gap-3">
+export function CycleModuleBoardLayoutLoader() {
+  return (
+    <div className="h-full w-full animate-pulse">
+      <div className="flex h-full w-full justify-between">
+        <div className="grid h-full w-full grid-cols-1 gap-6 overflow-y-auto p-8 lg:grid-cols-2 xl:grid-cols-3 3xl:grid-cols-4 auto-rows-max transition-all">
+          {range(5).map((i) => (
+            <div
+              key={i}
+              className="flex h-44 w-full flex-col justify-between rounded  border border-custom-border-100 bg-custom-background-100 p-4 text-sm"
+            >
               <div className="flex items-center justify-between">
+                <span className="h-6 w-24 bg-custom-background-80 rounded" />
                 <div className="flex items-center gap-2">
-                  <span className="h-5 w-5 bg-custom-background-80 rounded" />
-                  <span className="h-5 w-20 bg-custom-background-80 rounded" />
+                  <span className="h-6 w-20 bg-custom-background-80 rounded" />
+                  <span className="h-6 w-6 bg-custom-background-80 rounded" />
                 </div>
-                <span className="h-5 w-5 bg-custom-background-80 rounded-full" />
               </div>
-              <span className="h-1.5 bg-custom-background-80 rounded" />
-              <div className="flex items-center justify-between">
-                <div className="flex items-center">
-                  <span className="h-4 w-16 bg-custom-background-80 rounded" />
+              <div className="flex flex-col gap-3">
+                <div className="flex items-center justify-between">
+                  <div className="flex items-center gap-2">
+                    <span className="h-5 w-5 bg-custom-background-80 rounded" />
+                    <span className="h-5 w-20 bg-custom-background-80 rounded" />
+                  </div>
+                  <span className="h-5 w-5 bg-custom-background-80 rounded-full" />
                 </div>
-                <div className="flex items-center gap-2">
-                  <span className="h-4 w-4 bg-custom-background-80 rounded" />
-                  <span className="h-4 w-4 bg-custom-background-80 rounded" />
+                <span className="h-1.5 bg-custom-background-80 rounded" />
+                <div className="flex items-center justify-between">
+                  <div className="flex items-center">
+                    <span className="h-4 w-16 bg-custom-background-80 rounded" />
+                  </div>
+                  <div className="flex items-center gap-2">
+                    <span className="h-4 w-4 bg-custom-background-80 rounded" />
+                    <span className="h-4 w-4 bg-custom-background-80 rounded" />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-        ))}
+          ))}
+        </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/ui/loader/cycle-module-list-loader.tsx b/apps/web/core/components/ui/loader/cycle-module-list-loader.tsx
index 57947f0ab..1f0060e21 100644
--- a/apps/web/core/components/ui/loader/cycle-module-list-loader.tsx
+++ b/apps/web/core/components/ui/loader/cycle-module-list-loader.tsx
@@ -1,33 +1,35 @@
 import { range } from "lodash-es";
 
-export const CycleModuleListLayoutLoader = () => (
-  <div className="h-full overflow-y-auto animate-pulse">
-    <div className="flex h-full w-full justify-between">
-      <div className="flex h-full w-full flex-col overflow-y-auto">
-        {range(5).map((i) => (
-          <div
-            key={i}
-            className="flex w-full items-center justify-between gap-5 border-b border-custom-border-100 flex-col sm:flex-row px-5 py-6"
-          >
-            <div className="relative flex w-full items-center gap-3 justify-between overflow-hidden">
-              <div className="relative w-full flex items-center gap-3 overflow-hidden">
-                <div className="flex items-center gap-4 truncate">
-                  <span className="h-10 w-10 bg-custom-background-80 rounded-full" />
-                  <span className="h-5 w-20 bg-custom-background-80 rounded" />
+export function CycleModuleListLayoutLoader() {
+  return (
+    <div className="h-full overflow-y-auto animate-pulse">
+      <div className="flex h-full w-full justify-between">
+        <div className="flex h-full w-full flex-col overflow-y-auto">
+          {range(5).map((i) => (
+            <div
+              key={i}
+              className="flex w-full items-center justify-between gap-5 border-b border-custom-border-100 flex-col sm:flex-row px-5 py-6"
+            >
+              <div className="relative flex w-full items-center gap-3 justify-between overflow-hidden">
+                <div className="relative w-full flex items-center gap-3 overflow-hidden">
+                  <div className="flex items-center gap-4 truncate">
+                    <span className="h-10 w-10 bg-custom-background-80 rounded-full" />
+                    <span className="h-5 w-20 bg-custom-background-80 rounded" />
+                  </div>
+                </div>
+                <span className="h-6 w-20 bg-custom-background-80 rounded" />
+              </div>
+              <div className="flex w-full sm:w-auto relative overflow-hidden items-center gap-2.5 justify-between sm:justify-end sm:flex-shrink-0 ">
+                <div className="flex-shrink-0 relative flex items-center gap-3">
+                  <span className="h-5 w-5 bg-custom-background-80 rounded" />
+                  <span className="h-5 w-5 bg-custom-background-80 rounded" />
+                  <span className="h-5 w-5 bg-custom-background-80 rounded" />
                 </div>
               </div>
-              <span className="h-6 w-20 bg-custom-background-80 rounded" />
             </div>
-            <div className="flex w-full sm:w-auto relative overflow-hidden items-center gap-2.5 justify-between sm:justify-end sm:flex-shrink-0 ">
-              <div className="flex-shrink-0 relative flex items-center gap-3">
-                <span className="h-5 w-5 bg-custom-background-80 rounded" />
-                <span className="h-5 w-5 bg-custom-background-80 rounded" />
-                <span className="h-5 w-5 bg-custom-background-80 rounded" />
-              </div>
-            </div>
-          </div>
-        ))}
+          ))}
+        </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/ui/loader/layouts/calendar-layout-loader.tsx b/apps/web/core/components/ui/loader/layouts/calendar-layout-loader.tsx
index 80a257d4b..bd9ead7b4 100644
--- a/apps/web/core/components/ui/loader/layouts/calendar-layout-loader.tsx
+++ b/apps/web/core/components/ui/loader/layouts/calendar-layout-loader.tsx
@@ -1,7 +1,7 @@
 import { range } from "lodash-es";
 import { getRandomInt } from "../utils";
 
-const CalendarDay = () => {
+function CalendarDay() {
   const dataCount = getRandomInt(0, 1);
   const dataBlocks = range(dataCount).map((index) => (
     <span key={index} className="h-8 w-full bg-custom-background-80 rounded mb-2" />
@@ -15,25 +15,27 @@ const CalendarDay = () => {
       <div className="flex flex-col gap-2.5 p-2">{dataBlocks}</div>
     </div>
   );
-};
+}
 
-export const CalendarLayoutLoader = () => (
-  <div className="h-full w-full overflow-y-auto bg-custom-background-100 animate-pulse">
-    <span className="relative grid divide-x-[0.5px] divide-custom-border-200 text-sm font-medium grid-cols-5">
-      {range(5).map((index) => (
-        <span key={index} className="h-11 w-full bg-custom-background-80" />
-      ))}
-    </span>
-    <div className="h-full w-full overflow-y-auto">
-      <div className="grid h-full w-full grid-cols-1 divide-y-[0.5px] divide-custom-border-200 overflow-y-auto">
-        {range(6).map((index) => (
-          <div key={index} className="grid divide-x-[0.5px] divide-custom-border-200 grid-cols-5">
-            {range(5).map((index) => (
-              <CalendarDay key={index} />
-            ))}
-          </div>
+export function CalendarLayoutLoader() {
+  return (
+    <div className="h-full w-full overflow-y-auto bg-custom-background-100 animate-pulse">
+      <span className="relative grid divide-x-[0.5px] divide-custom-border-200 text-sm font-medium grid-cols-5">
+        {range(5).map((index) => (
+          <span key={index} className="h-11 w-full bg-custom-background-80" />
         ))}
+      </span>
+      <div className="h-full w-full overflow-y-auto">
+        <div className="grid h-full w-full grid-cols-1 divide-y-[0.5px] divide-custom-border-200 overflow-y-auto">
+          {range(6).map((index) => (
+            <div key={index} className="grid divide-x-[0.5px] divide-custom-border-200 grid-cols-5">
+              {range(5).map((index) => (
+                <CalendarDay key={index} />
+              ))}
+            </div>
+          ))}
+        </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/ui/loader/layouts/gantt-layout-loader.tsx b/apps/web/core/components/ui/loader/layouts/gantt-layout-loader.tsx
index 3b0a36caf..77231aa09 100644
--- a/apps/web/core/components/ui/loader/layouts/gantt-layout-loader.tsx
+++ b/apps/web/core/components/ui/loader/layouts/gantt-layout-loader.tsx
@@ -3,58 +3,62 @@ import { Row } from "@plane/ui";
 import { BLOCK_HEIGHT } from "@/components/gantt-chart/constants";
 import { getRandomLength } from "../utils";
 
-export const GanttLayoutListItemLoader = () => (
-  <div className="flex w-full items-center gap-4 px-6 " style={{ height: `${BLOCK_HEIGHT}px` }}>
-    <div className="px-3 h-6 w-8 bg-custom-background-80 rounded" />
-    <div className={`px-3 h-6 w-${getRandomLength(["32", "52", "72"])} bg-custom-background-80 rounded`} />
-  </div>
-);
-
-export const GanttLayoutLoader = () => (
-  <div className="flex flex-col h-full overflow-x-auto animate-pulse">
-    <div className="min-h-10 w-full border-b border-custom-border-200 ">
-      <span className="h-6 w-12 bg-custom-background-80 rounded" />
+export function GanttLayoutListItemLoader() {
+  return (
+    <div className="flex w-full items-center gap-4 px-6 " style={{ height: `${BLOCK_HEIGHT}px` }}>
+      <div className="px-3 h-6 w-8 bg-custom-background-80 rounded" />
+      <div className={`px-3 h-6 w-${getRandomLength(["32", "52", "72"])} bg-custom-background-80 rounded`} />
     </div>
-    <div className="flex h-full">
-      <div className="h-full w-[25.5rem] border-r border-custom-border-200">
-        <Row className="flex items-end h-header py-2 border-b border-custom-border-200">
-          <div className="flex items-center justify-between w-full">
-            <span className="h-5 w-14 bg-custom-background-80 rounded" />
-            <span className="h-5 w-16 bg-custom-background-80 rounded" />
-          </div>
-        </Row>
-        <Row className="flex flex-col gap-3 h-11 py-4 w-full">
-          {range(6).map((index) => (
-            <div key={index} className="flex items-center gap-3  h-11 w-full">
-              <span className="h-6 w-6 bg-custom-background-80 rounded" />
-              <span className={`h-6 w-${getRandomLength(["32", "52", "72"])} bg-custom-background-80 rounded`} />
-            </div>
-          ))}
-        </Row>
+  );
+}
+
+export function GanttLayoutLoader() {
+  return (
+    <div className="flex flex-col h-full overflow-x-auto animate-pulse">
+      <div className="min-h-10 w-full border-b border-custom-border-200 ">
+        <span className="h-6 w-12 bg-custom-background-80 rounded" />
       </div>
-      <div className="h-full w-full border-r border-custom-border-200">
-        <div className="flex flex-col justify-between gap-2 h-header py-1.5 px-4 border-b border-custom-border-200">
-          <div className="flex items-center justify-start">
-            <span className="h-5 w-20 bg-custom-background-80 rounded" />
+      <div className="flex h-full">
+        <div className="h-full w-[25.5rem] border-r border-custom-border-200">
+          <Row className="flex items-end h-header py-2 border-b border-custom-border-200">
+            <div className="flex items-center justify-between w-full">
+              <span className="h-5 w-14 bg-custom-background-80 rounded" />
+              <span className="h-5 w-16 bg-custom-background-80 rounded" />
+            </div>
+          </Row>
+          <Row className="flex flex-col gap-3 h-11 py-4 w-full">
+            {range(6).map((index) => (
+              <div key={index} className="flex items-center gap-3  h-11 w-full">
+                <span className="h-6 w-6 bg-custom-background-80 rounded" />
+                <span className={`h-6 w-${getRandomLength(["32", "52", "72"])} bg-custom-background-80 rounded`} />
+              </div>
+            ))}
+          </Row>
+        </div>
+        <div className="h-full w-full border-r border-custom-border-200">
+          <div className="flex flex-col justify-between gap-2 h-header py-1.5 px-4 border-b border-custom-border-200">
+            <div className="flex items-center justify-start">
+              <span className="h-5 w-20 bg-custom-background-80 rounded" />
+            </div>
+            <div className="flex items-center gap-3 justify-between w-full">
+              {range(15).map((index) => (
+                <span key={index} className="h-5 w-10 bg-custom-background-80 rounded" />
+              ))}
+            </div>
           </div>
-          <div className="flex items-center gap-3 justify-between w-full">
-            {range(15).map((index) => (
-              <span key={index} className="h-5 w-10 bg-custom-background-80 rounded" />
+          <div className="flex flex-col gap-3 h-11 p-4 w-full">
+            {range(6).map((index) => (
+              <div
+                key={index}
+                className={`flex items-center gap-3 h-11 w-full`}
+                style={{ paddingLeft: getRandomLength(["115px", "208px", "260px"]) }}
+              >
+                <span className={`h-6 w-40 w-${getRandomLength(["32", "52", "72"])} bg-custom-background-80 rounded`} />
+              </div>
             ))}
           </div>
         </div>
-        <div className="flex flex-col gap-3 h-11 p-4 w-full">
-          {range(6).map((index) => (
-            <div
-              key={index}
-              className={`flex items-center gap-3 h-11 w-full`}
-              style={{ paddingLeft: getRandomLength(["115px", "208px", "260px"]) }}
-            >
-              <span className={`h-6 w-40 w-${getRandomLength(["32", "52", "72"])} bg-custom-background-80 rounded`} />
-            </div>
-          ))}
-        </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/ui/loader/layouts/kanban-layout-loader.tsx b/apps/web/core/components/ui/loader/layouts/kanban-layout-loader.tsx
index 7c21660d2..d72d49163 100644
--- a/apps/web/core/components/ui/loader/layouts/kanban-layout-loader.tsx
+++ b/apps/web/core/components/ui/loader/layouts/kanban-layout-loader.tsx
@@ -5,17 +5,20 @@ import { ContentWrapper } from "@plane/ui";
 // plane utils
 import { cn } from "@plane/utils";
 
-export const KanbanIssueBlockLoader = forwardRef<HTMLSpanElement, { cardHeight?: number; shouldAnimate?: boolean }>(
-  ({ cardHeight = 100, shouldAnimate = true }, ref) => (
+export const KanbanIssueBlockLoader = forwardRef(function KanbanIssueBlockLoader(
+  { cardHeight = 100, shouldAnimate = true }: { cardHeight?: number; shouldAnimate?: boolean },
+  ref: React.ForwardedRef<HTMLSpanElement>
+) {
+  return (
     <span
       ref={ref}
       className={cn(`block bg-custom-background-80 rounded`, { " animate-pulse": shouldAnimate })}
       style={{ height: `${cardHeight}px` }}
     />
-  )
-);
+  );
+});
 
-export const KanbanColumnLoader = ({
+export function KanbanColumnLoader({
   cardsInColumn = 3,
   ignoreHeader = false,
   cardHeight = 100,
@@ -25,28 +28,32 @@ export const KanbanColumnLoader = ({
   ignoreHeader?: boolean;
   cardHeight?: number;
   shouldAnimate?: boolean;
-}) => (
-  <div className="flex flex-col gap-3">
-    {!ignoreHeader && (
-      <div className="flex items-center justify-between h-9 w-80">
-        <div className="flex item-center gap-3">
-          <span className={cn("h-6 w-6 bg-custom-background-80 rounded", { " animate-pulse": shouldAnimate })} />
-          <span className={cn("h-6 w-24 bg-custom-background-80 rounded", { " animate-pulse": shouldAnimate })} />
+}) {
+  return (
+    <div className="flex flex-col gap-3">
+      {!ignoreHeader && (
+        <div className="flex items-center justify-between h-9 w-80">
+          <div className="flex item-center gap-3">
+            <span className={cn("h-6 w-6 bg-custom-background-80 rounded", { " animate-pulse": shouldAnimate })} />
+            <span className={cn("h-6 w-24 bg-custom-background-80 rounded", { " animate-pulse": shouldAnimate })} />
+          </div>
         </div>
-      </div>
-    )}
-    {range(cardsInColumn).map((cardIndex) => (
-      <KanbanIssueBlockLoader key={cardIndex} cardHeight={cardHeight} shouldAnimate={shouldAnimate} />
-    ))}
-  </div>
-);
+      )}
+      {range(cardsInColumn).map((cardIndex) => (
+        <KanbanIssueBlockLoader key={cardIndex} cardHeight={cardHeight} shouldAnimate={shouldAnimate} />
+      ))}
+    </div>
+  );
+}
 
 KanbanIssueBlockLoader.displayName = "KanbanIssueBlockLoader";
 
-export const KanbanLayoutLoader = ({ cardsInEachColumn = [2, 3, 2, 4, 3] }: { cardsInEachColumn?: number[] }) => (
-  <ContentWrapper className="flex-row gap-5 py-1.5 overflow-x-auto">
-    {cardsInEachColumn.map((cardsInColumn, columnIndex) => (
-      <KanbanColumnLoader key={columnIndex} cardsInColumn={cardsInColumn} />
-    ))}
-  </ContentWrapper>
-);
+export function KanbanLayoutLoader({ cardsInEachColumn = [2, 3, 2, 4, 3] }: { cardsInEachColumn?: number[] }) {
+  return (
+    <ContentWrapper className="flex-row gap-5 py-1.5 overflow-x-auto">
+      {cardsInEachColumn.map((cardsInColumn, columnIndex) => (
+        <KanbanColumnLoader key={columnIndex} cardsInColumn={cardsInColumn} />
+      ))}
+    </ContentWrapper>
+  );
+}
diff --git a/apps/web/core/components/ui/loader/layouts/list-layout-loader.tsx b/apps/web/core/components/ui/loader/layouts/list-layout-loader.tsx
index fd0250779..c65ffe90c 100644
--- a/apps/web/core/components/ui/loader/layouts/list-layout-loader.tsx
+++ b/apps/web/core/components/ui/loader/layouts/list-layout-loader.tsx
@@ -6,78 +6,88 @@ import { Row } from "@plane/ui";
 import { cn } from "@plane/utils";
 import { getRandomInt, getRandomLength } from "../utils";
 
-export const ListLoaderItemRow = forwardRef<
-  HTMLDivElement,
-  { shouldAnimate?: boolean; renderForPlaceHolder?: boolean; defaultPropertyCount?: number }
->(({ shouldAnimate = true, renderForPlaceHolder = false, defaultPropertyCount = 6 }, ref) => (
-  <Row
-    ref={ref}
-    className={cn("flex items-center justify-between h-11 py-3 ", {
-      "bg-custom-background-100": renderForPlaceHolder,
-      "border-b border-custom-border-200": !renderForPlaceHolder,
-    })}
-  >
-    <div className="flex items-center gap-3">
-      <span
-        className={cn("h-5 w-10 bg-custom-background-80 rounded", {
-          "animate-pulse": shouldAnimate,
-          "bg-custom-background-90": renderForPlaceHolder,
-        })}
-      />
-      <span
-        className={cn(`h-5 w-${getRandomLength(["32", "52", "72"])} bg-custom-background-80 rounded`, {
-          "animate-pulse": shouldAnimate,
-          "bg-custom-background-90": renderForPlaceHolder,
-        })}
-      />
-    </div>
-    <div className="flex items-center gap-2">
-      {range(defaultPropertyCount).map((index) => (
-        <Fragment key={index}>
-          {getRandomInt(1, 2) % 2 === 0 ? (
-            <span
-              key={index}
-              className={cn("h-5 w-5 bg-custom-background-80 rounded", {
-                "animate-pulse": shouldAnimate,
-                "bg-custom-background-90": renderForPlaceHolder,
-              })}
-            />
-          ) : (
-            <span
-              className={cn("h-5 w-16 bg-custom-background-80 rounded", {
-                "animate-pulse": shouldAnimate,
-                "bg-custom-background-90": renderForPlaceHolder,
-              })}
-            />
-          )}
-        </Fragment>
-      ))}
-    </div>
-  </Row>
-));
+export const ListLoaderItemRow = forwardRef(function ListLoaderItemRow(
+  {
+    shouldAnimate = true,
+    renderForPlaceHolder = false,
+    defaultPropertyCount = 6,
+  }: { shouldAnimate?: boolean; renderForPlaceHolder?: boolean; defaultPropertyCount?: number },
+  ref: React.ForwardedRef<HTMLDivElement>
+) {
+  return (
+    <Row
+      ref={ref}
+      className={cn("flex items-center justify-between h-11 py-3 ", {
+        "bg-custom-background-100": renderForPlaceHolder,
+        "border-b border-custom-border-200": !renderForPlaceHolder,
+      })}
+    >
+      <div className="flex items-center gap-3">
+        <span
+          className={cn("h-5 w-10 bg-custom-background-80 rounded", {
+            "animate-pulse": shouldAnimate,
+            "bg-custom-background-90": renderForPlaceHolder,
+          })}
+        />
+        <span
+          className={cn(`h-5 w-${getRandomLength(["32", "52", "72"])} bg-custom-background-80 rounded`, {
+            "animate-pulse": shouldAnimate,
+            "bg-custom-background-90": renderForPlaceHolder,
+          })}
+        />
+      </div>
+      <div className="flex items-center gap-2">
+        {range(defaultPropertyCount).map((index) => (
+          <Fragment key={index}>
+            {getRandomInt(1, 2) % 2 === 0 ? (
+              <span
+                key={index}
+                className={cn("h-5 w-5 bg-custom-background-80 rounded", {
+                  "animate-pulse": shouldAnimate,
+                  "bg-custom-background-90": renderForPlaceHolder,
+                })}
+              />
+            ) : (
+              <span
+                className={cn("h-5 w-16 bg-custom-background-80 rounded", {
+                  "animate-pulse": shouldAnimate,
+                  "bg-custom-background-90": renderForPlaceHolder,
+                })}
+              />
+            )}
+          </Fragment>
+        ))}
+      </div>
+    </Row>
+  );
+});
 
 ListLoaderItemRow.displayName = "ListLoaderItemRow";
 
-const ListSection = ({ itemCount }: { itemCount: number }) => (
-  <div className="flex flex-shrink-0 flex-col">
-    <Row className="sticky top-0 z-[2] w-full flex-shrink-0 border-b border-custom-border-200 bg-custom-background-90 py-1">
-      <div className="flex items-center gap-2 py-1.5 w-full">
-        <span className="h-6 w-6 bg-custom-background-80 rounded animate-pulse" />
-        <span className="h-6 w-24 bg-custom-background-80 rounded animate-pulse" />
+function ListSection({ itemCount }: { itemCount: number }) {
+  return (
+    <div className="flex flex-shrink-0 flex-col">
+      <Row className="sticky top-0 z-[2] w-full flex-shrink-0 border-b border-custom-border-200 bg-custom-background-90 py-1">
+        <div className="flex items-center gap-2 py-1.5 w-full">
+          <span className="h-6 w-6 bg-custom-background-80 rounded animate-pulse" />
+          <span className="h-6 w-24 bg-custom-background-80 rounded animate-pulse" />
+        </div>
+      </Row>
+      <div className="relative h-full w-full">
+        {range(itemCount).map((index) => (
+          <ListLoaderItemRow key={index} />
+        ))}
       </div>
-    </Row>
-    <div className="relative h-full w-full">
-      {range(itemCount).map((index) => (
-        <ListLoaderItemRow key={index} />
+    </div>
+  );
+}
+
+export function ListLayoutLoader() {
+  return (
+    <div className="flex flex-shrink-0 flex-col">
+      {[6, 5, 2].map((itemCount, index) => (
+        <ListSection key={index} itemCount={itemCount} />
       ))}
     </div>
-  </div>
-);
-
-export const ListLayoutLoader = () => (
-  <div className="flex flex-shrink-0 flex-col">
-    {[6, 5, 2].map((itemCount, index) => (
-      <ListSection key={index} itemCount={itemCount} />
-    ))}
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/ui/loader/layouts/members-layout-loader.tsx b/apps/web/core/components/ui/loader/layouts/members-layout-loader.tsx
index 4c011855e..02ca1910e 100644
--- a/apps/web/core/components/ui/loader/layouts/members-layout-loader.tsx
+++ b/apps/web/core/components/ui/loader/layouts/members-layout-loader.tsx
@@ -1,15 +1,17 @@
 import { range } from "lodash-es";
-export const MembersLayoutLoader = () => (
-  <div className="flex gap-5 py-1.5 overflow-x-auto">
-    {range(5).map((columnIndex) => (
-      <div key={columnIndex} className="flex flex-col gap-3">
-        <div className={`flex items-center justify-between h-9 ${columnIndex === 0 ? "w-80" : "w-36"}`}>
-          <span className="h-6 w-24 bg-custom-background-80 rounded animate-pulse" />
+export function MembersLayoutLoader() {
+  return (
+    <div className="flex gap-5 py-1.5 overflow-x-auto">
+      {range(5).map((columnIndex) => (
+        <div key={columnIndex} className="flex flex-col gap-3">
+          <div className={`flex items-center justify-between h-9 ${columnIndex === 0 ? "w-80" : "w-36"}`}>
+            <span className="h-6 w-24 bg-custom-background-80 rounded animate-pulse" />
+          </div>
+          {range(2).map((cardIndex) => (
+            <span className="h-8 w-full bg-custom-background-80 rounded animate-pulse" key={cardIndex} />
+          ))}
         </div>
-        {range(2).map((cardIndex) => (
-          <span className="h-8 w-full bg-custom-background-80 rounded animate-pulse" key={cardIndex} />
-        ))}
-      </div>
-    ))}
-  </div>
-);
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/ui/loader/layouts/project-inbox/inbox-layout-loader.tsx b/apps/web/core/components/ui/loader/layouts/project-inbox/inbox-layout-loader.tsx
index 169481f5d..aad510719 100644
--- a/apps/web/core/components/ui/loader/layouts/project-inbox/inbox-layout-loader.tsx
+++ b/apps/web/core/components/ui/loader/layouts/project-inbox/inbox-layout-loader.tsx
@@ -5,21 +5,23 @@ import React from "react";
 import { Loader } from "@plane/ui";
 import { InboxSidebarLoader } from "./inbox-sidebar-loader";
 
-export const InboxLayoutLoader = () => (
-  <div className="relative w-full h-full flex overflow-hidden">
-    <div className="flex-shrink-0 w-2/6 h-full border-r border-custom-border-300">
-      <InboxSidebarLoader />
+export function InboxLayoutLoader() {
+  return (
+    <div className="relative w-full h-full flex overflow-hidden">
+      <div className="flex-shrink-0 w-2/6 h-full border-r border-custom-border-300">
+        <InboxSidebarLoader />
+      </div>
+      <div className="w-4/6">
+        <Loader className="flex flex-col h-full gap-5 p-5">
+          <div className="space-y-2">
+            <Loader.Item height="30px" width="40%" />
+            <Loader.Item height="15px" width="60%" />
+            <Loader.Item height="15px" width="60%" />
+            <Loader.Item height="15px" width="40%" />
+          </div>
+          <Loader.Item height="150px" />
+        </Loader>
+      </div>
     </div>
-    <div className="w-4/6">
-      <Loader className="flex flex-col h-full gap-5 p-5">
-        <div className="space-y-2">
-          <Loader.Item height="30px" width="40%" />
-          <Loader.Item height="15px" width="60%" />
-          <Loader.Item height="15px" width="60%" />
-          <Loader.Item height="15px" width="40%" />
-        </div>
-        <Loader.Item height="150px" />
-      </Loader>
-    </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/ui/loader/layouts/project-inbox/inbox-sidebar-loader.tsx b/apps/web/core/components/ui/loader/layouts/project-inbox/inbox-sidebar-loader.tsx
index a8741ef8f..c28bc0941 100644
--- a/apps/web/core/components/ui/loader/layouts/project-inbox/inbox-sidebar-loader.tsx
+++ b/apps/web/core/components/ui/loader/layouts/project-inbox/inbox-sidebar-loader.tsx
@@ -1,21 +1,23 @@
 import React from "react";
 import { range } from "lodash-es";
 
-export const InboxSidebarLoader = () => (
-  <div className="flex flex-col">
-    {range(6).map((index) => (
-      <div key={index} className="flex flex-col gap-2.5 h-[105px] space-y-3 border-b border-custom-border-200 p-4">
-        <div className="flex flex-col gap-2">
-          <span className="h-5 w-16 bg-custom-background-80 rounded" />
-          <span className="h-5 w-36 bg-custom-background-80 rounded" />
+export function InboxSidebarLoader() {
+  return (
+    <div className="flex flex-col">
+      {range(6).map((index) => (
+        <div key={index} className="flex flex-col gap-2.5 h-[105px] space-y-3 border-b border-custom-border-200 p-4">
+          <div className="flex flex-col gap-2">
+            <span className="h-5 w-16 bg-custom-background-80 rounded" />
+            <span className="h-5 w-36 bg-custom-background-80 rounded" />
+          </div>
+          <div className="flex items-center gap-2">
+            <span className="h-4 w-20 bg-custom-background-80 rounded" />
+            <span className="h-2 w-2 bg-custom-background-80 rounded-full" />
+            <span className="h-4 w-16 bg-custom-background-80 rounded" />
+            <span className="h-4 w-16 bg-custom-background-80 rounded" />
+          </div>
         </div>
-        <div className="flex items-center gap-2">
-          <span className="h-4 w-20 bg-custom-background-80 rounded" />
-          <span className="h-2 w-2 bg-custom-background-80 rounded-full" />
-          <span className="h-4 w-16 bg-custom-background-80 rounded" />
-          <span className="h-4 w-16 bg-custom-background-80 rounded" />
-        </div>
-      </div>
-    ))}
-  </div>
-);
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/ui/loader/layouts/spreadsheet-layout-loader.tsx b/apps/web/core/components/ui/loader/layouts/spreadsheet-layout-loader.tsx
index 580c6744e..1c8f1fa23 100644
--- a/apps/web/core/components/ui/loader/layouts/spreadsheet-layout-loader.tsx
+++ b/apps/web/core/components/ui/loader/layouts/spreadsheet-layout-loader.tsx
@@ -2,45 +2,49 @@ import { range } from "lodash-es";
 import { Row } from "@plane/ui";
 import { getRandomLength } from "../utils";
 
-export const SpreadsheetIssueRowLoader = (props: { columnCount: number }) => (
-  <tr className="border-b border-custom-border-200 bg-custom-background-100">
-    <td className="h-11 min-w-[28rem] z-[10] sticky left-0 flex items-center border-r-[0.5px] border-custom-border-200 bg-custom-background-100">
-      <Row className="flex items-center gap-3">
-        <span className="h-5 w-10 bg-custom-background-80 rounded animate-pulse" />
-        <span
-          className={`h-5 w-${getRandomLength(["32", "52", "72"])} bg-custom-background-80 rounded animate-pulse`}
-        />
-      </Row>
-    </td>
-    {range(props.columnCount).map((colIndex) => (
-      <td key={colIndex} className="h-11 w-full min-w-[8rem] border-r border-custom-border-200 ">
-        <div className="flex items-center justify-center gap-3 px-3">
-          <span className="h-5 w-20 bg-custom-background-80 rounded animate-pulse" />
-        </div>
+export function SpreadsheetIssueRowLoader(props: { columnCount: number }) {
+  return (
+    <tr className="border-b border-custom-border-200 bg-custom-background-100">
+      <td className="h-11 min-w-[28rem] z-[10] sticky left-0 flex items-center border-r-[0.5px] border-custom-border-200 bg-custom-background-100">
+        <Row className="flex items-center gap-3">
+          <span className="h-5 w-10 bg-custom-background-80 rounded animate-pulse" />
+          <span
+            className={`h-5 w-${getRandomLength(["32", "52", "72"])} bg-custom-background-80 rounded animate-pulse`}
+          />
+        </Row>
       </td>
-    ))}
-  </tr>
-);
+      {range(props.columnCount).map((colIndex) => (
+        <td key={colIndex} className="h-11 w-full min-w-[8rem] border-r border-custom-border-200 ">
+          <div className="flex items-center justify-center gap-3 px-3">
+            <span className="h-5 w-20 bg-custom-background-80 rounded animate-pulse" />
+          </div>
+        </td>
+      ))}
+    </tr>
+  );
+}
 
-export const SpreadsheetLayoutLoader = () => (
-  <div className="horizontal-scroll-enable h-full w-full overflow-y-auto ">
-    <table>
-      <thead>
-        <tr>
-          <th className="h-11 min-w-[28rem] bg-custom-background-90 border-r border-custom-border-200 animate-pulse" />
-          {range(10).map((index) => (
-            <th
-              key={index}
-              className="h-11 w-full min-w-[8rem] bg-custom-background-90 border-r border-custom-border-200 animate-pulse"
-            />
+export function SpreadsheetLayoutLoader() {
+  return (
+    <div className="horizontal-scroll-enable h-full w-full overflow-y-auto ">
+      <table>
+        <thead>
+          <tr>
+            <th className="h-11 min-w-[28rem] bg-custom-background-90 border-r border-custom-border-200 animate-pulse" />
+            {range(10).map((index) => (
+              <th
+                key={index}
+                className="h-11 w-full min-w-[8rem] bg-custom-background-90 border-r border-custom-border-200 animate-pulse"
+              />
+            ))}
+          </tr>
+        </thead>
+        <tbody>
+          {range(16).map((rowIndex) => (
+            <SpreadsheetIssueRowLoader key={rowIndex} columnCount={10} />
           ))}
-        </tr>
-      </thead>
-      <tbody>
-        {range(16).map((rowIndex) => (
-          <SpreadsheetIssueRowLoader key={rowIndex} columnCount={10} />
-        ))}
-      </tbody>
-    </table>
-  </div>
-);
+        </tbody>
+      </table>
+    </div>
+  );
+}
diff --git a/apps/web/core/components/ui/loader/notification-loader.tsx b/apps/web/core/components/ui/loader/notification-loader.tsx
index 12a364978..7b23b0c30 100644
--- a/apps/web/core/components/ui/loader/notification-loader.tsx
+++ b/apps/web/core/components/ui/loader/notification-loader.tsx
@@ -1,18 +1,20 @@
 import { range } from "lodash-es";
 
-export const NotificationsLoader = () => (
-  <div className="divide-y divide-custom-border-100 animate-pulse overflow-hidden">
-    {range(3).map((i) => (
-      <div key={i} className="flex w-full items-center gap-4 p-3">
-        <span className="min-h-12 min-w-12 bg-custom-background-80 rounded-full" />
-        <div className="flex flex-col gap-2.5 w-full">
-          <span className="h-5 w-36 bg-custom-background-80 rounded" />
-          <div className="flex items-center justify-between gap-2 w-full">
-            <span className="h-5 w-28 bg-custom-background-80 rounded" />
-            <span className="h-5 w-16 bg-custom-background-80 rounded" />
+export function NotificationsLoader() {
+  return (
+    <div className="divide-y divide-custom-border-100 animate-pulse overflow-hidden">
+      {range(3).map((i) => (
+        <div key={i} className="flex w-full items-center gap-4 p-3">
+          <span className="min-h-12 min-w-12 bg-custom-background-80 rounded-full" />
+          <div className="flex flex-col gap-2.5 w-full">
+            <span className="h-5 w-36 bg-custom-background-80 rounded" />
+            <div className="flex items-center justify-between gap-2 w-full">
+              <span className="h-5 w-28 bg-custom-background-80 rounded" />
+              <span className="h-5 w-16 bg-custom-background-80 rounded" />
+            </div>
           </div>
         </div>
-      </div>
-    ))}
-  </div>
-);
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/ui/loader/pages-loader.tsx b/apps/web/core/components/ui/loader/pages-loader.tsx
index a3d25d751..24047abe3 100644
--- a/apps/web/core/components/ui/loader/pages-loader.tsx
+++ b/apps/web/core/components/ui/loader/pages-loader.tsx
@@ -1,30 +1,32 @@
 import { range } from "lodash-es";
 
-export const PagesLoader = () => (
-  <div className="flex h-full flex-col space-y-5 overflow-hidden p-6">
-    <div className="flex justify-between gap-4">
-      <h3 className="text-2xl font-semibold text-custom-text-100">Pages</h3>
-    </div>
-    <div className="flex items-center gap-3">
-      {range(5).map((i) => (
-        <span key={i} className="h-8 w-20 bg-custom-background-80 rounded-full" />
-      ))}
-    </div>
-    <div className="divide-y divide-custom-border-200">
-      {range(5).map((i) => (
-        <div key={i} className="h-12 w-full flex items-center justify-between px-3">
-          <div className="flex items-center gap-1.5">
-            <span className="h-5 w-5 bg-custom-background-80 rounded" />
-            <span className="h-5 w-20 bg-custom-background-80 rounded" />
+export function PagesLoader() {
+  return (
+    <div className="flex h-full flex-col space-y-5 overflow-hidden p-6">
+      <div className="flex justify-between gap-4">
+        <h3 className="text-2xl font-semibold text-custom-text-100">Pages</h3>
+      </div>
+      <div className="flex items-center gap-3">
+        {range(5).map((i) => (
+          <span key={i} className="h-8 w-20 bg-custom-background-80 rounded-full" />
+        ))}
+      </div>
+      <div className="divide-y divide-custom-border-200">
+        {range(5).map((i) => (
+          <div key={i} className="h-12 w-full flex items-center justify-between px-3">
+            <div className="flex items-center gap-1.5">
+              <span className="h-5 w-5 bg-custom-background-80 rounded" />
+              <span className="h-5 w-20 bg-custom-background-80 rounded" />
+            </div>
+            <div className="flex items-center gap-1.5">
+              <span className="h-5 w-16 bg-custom-background-80 rounded" />
+              <span className="h-5 w-5 bg-custom-background-80 rounded" />
+              <span className="h-5 w-5 bg-custom-background-80 rounded" />
+              <span className="h-5 w-5 bg-custom-background-80 rounded" />
+            </div>
           </div>
-          <div className="flex items-center gap-1.5">
-            <span className="h-5 w-16 bg-custom-background-80 rounded" />
-            <span className="h-5 w-5 bg-custom-background-80 rounded" />
-            <span className="h-5 w-5 bg-custom-background-80 rounded" />
-            <span className="h-5 w-5 bg-custom-background-80 rounded" />
-          </div>
-        </div>
-      ))}
+        ))}
+      </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/ui/loader/projects-loader.tsx b/apps/web/core/components/ui/loader/projects-loader.tsx
index bfdf7716c..0a8c85466 100644
--- a/apps/web/core/components/ui/loader/projects-loader.tsx
+++ b/apps/web/core/components/ui/loader/projects-loader.tsx
@@ -1,39 +1,41 @@
 import { range } from "lodash-es";
 
-export const ProjectsLoader = () => (
-  <div className="h-full w-full overflow-y-auto p-8 animate-pulse">
-    <div className="grid grid-cols-1 gap-9 md:grid-cols-2 lg:grid-cols-3">
-      {range(3).map((i) => (
-        <div
-          key={i}
-          className="flex cursor-pointer flex-col rounded border border-custom-border-200 bg-custom-background-100"
-        >
-          <div className="relative min-h-[118px] w-full rounded-t border-b border-custom-border-200 ">
-            <div className="absolute inset-0 z-[1] bg-gradient-to-t from-black/20 to-transparent">
-              <div className="absolute bottom-4 z-10 flex h-10 w-full items-center justify-between gap-3 px-4">
-                <div className="flex flex-grow items-center gap-2.5 truncate">
-                  <span className="min-h-9 min-w-9 bg-custom-background-80 rounded" />
-                  <div className="flex w-full flex-col justify-between gap-0.5 truncate">
-                    <span className="h-4 w-28 bg-custom-background-80 rounded" />
-                    <span className="h-4 w-16 bg-custom-background-80 rounded" />
+export function ProjectsLoader() {
+  return (
+    <div className="h-full w-full overflow-y-auto p-8 animate-pulse">
+      <div className="grid grid-cols-1 gap-9 md:grid-cols-2 lg:grid-cols-3">
+        {range(3).map((i) => (
+          <div
+            key={i}
+            className="flex cursor-pointer flex-col rounded border border-custom-border-200 bg-custom-background-100"
+          >
+            <div className="relative min-h-[118px] w-full rounded-t border-b border-custom-border-200 ">
+              <div className="absolute inset-0 z-[1] bg-gradient-to-t from-black/20 to-transparent">
+                <div className="absolute bottom-4 z-10 flex h-10 w-full items-center justify-between gap-3 px-4">
+                  <div className="flex flex-grow items-center gap-2.5 truncate">
+                    <span className="min-h-9 min-w-9 bg-custom-background-80 rounded" />
+                    <div className="flex w-full flex-col justify-between gap-0.5 truncate">
+                      <span className="h-4 w-28 bg-custom-background-80 rounded" />
+                      <span className="h-4 w-16 bg-custom-background-80 rounded" />
+                    </div>
+                  </div>
+                  <div className="flex h-full flex-shrink-0 items-center gap-2">
+                    <span className="h-6 w-6 bg-custom-background-80 rounded" />
+                    <span className="h-6 w-6 bg-custom-background-80 rounded" />
                   </div>
-                </div>
-                <div className="flex h-full flex-shrink-0 items-center gap-2">
-                  <span className="h-6 w-6 bg-custom-background-80 rounded" />
-                  <span className="h-6 w-6 bg-custom-background-80 rounded" />
                 </div>
               </div>
             </div>
-          </div>
-          <div className="flex h-[104px] w-full flex-col justify-between rounded-b p-4">
-            <span className="h-4 w-36 bg-custom-background-80 rounded" />
-            <div className="item-center flex justify-between">
-              <span className="h-5 w-20 bg-custom-background-80 rounded" />
-              <span className="h-5 w-5 bg-custom-background-80 rounded" />
+            <div className="flex h-[104px] w-full flex-col justify-between rounded-b p-4">
+              <span className="h-4 w-36 bg-custom-background-80 rounded" />
+              <div className="item-center flex justify-between">
+                <span className="h-5 w-20 bg-custom-background-80 rounded" />
+                <span className="h-5 w-5 bg-custom-background-80 rounded" />
+              </div>
             </div>
           </div>
-        </div>
-      ))}
+        ))}
+      </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/ui/loader/settings/activity.tsx b/apps/web/core/components/ui/loader/settings/activity.tsx
index 59fd18e0e..3bd3d69d5 100644
--- a/apps/web/core/components/ui/loader/settings/activity.tsx
+++ b/apps/web/core/components/ui/loader/settings/activity.tsx
@@ -1,13 +1,15 @@
 import { range } from "lodash-es";
 import { getRandomLength } from "../utils";
 
-export const ActivitySettingsLoader = () => (
-  <div className="flex flex-col gap-3 animate-pulse">
-    {range(10).map((i) => (
-      <div key={i} className="relative flex items-center gap-2 h-12 border-b border-custom-border-200">
-        <span className="h-6 w-6 bg-custom-background-80 rounded" />
-        <span className={`h-6 w-${getRandomLength(["52", "72", "96"])} bg-custom-background-80 rounded`} />
-      </div>
-    ))}
-  </div>
-);
+export function ActivitySettingsLoader() {
+  return (
+    <div className="flex flex-col gap-3 animate-pulse">
+      {range(10).map((i) => (
+        <div key={i} className="relative flex items-center gap-2 h-12 border-b border-custom-border-200">
+          <span className="h-6 w-6 bg-custom-background-80 rounded" />
+          <span className={`h-6 w-${getRandomLength(["52", "72", "96"])} bg-custom-background-80 rounded`} />
+        </div>
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/ui/loader/settings/api-token.tsx b/apps/web/core/components/ui/loader/settings/api-token.tsx
index 576601b30..bc613bbe8 100644
--- a/apps/web/core/components/ui/loader/settings/api-token.tsx
+++ b/apps/web/core/components/ui/loader/settings/api-token.tsx
@@ -1,6 +1,6 @@
 import { range } from "lodash-es";
 import { useTranslation } from "@plane/i18n";
-export const APITokenSettingsLoader = () => {
+export function APITokenSettingsLoader() {
   const { t } = useTranslation();
   return (
     <section className="w-full overflow-y-auto">
@@ -21,4 +21,4 @@ export const APITokenSettingsLoader = () => {
       </div>
     </section>
   );
-};
+}
diff --git a/apps/web/core/components/ui/loader/settings/email.tsx b/apps/web/core/components/ui/loader/settings/email.tsx
index 3fecb3590..a7d0c5748 100644
--- a/apps/web/core/components/ui/loader/settings/email.tsx
+++ b/apps/web/core/components/ui/loader/settings/email.tsx
@@ -1,29 +1,31 @@
 import { range } from "lodash-es";
 
-export const EmailSettingsLoader = () => (
-  <div className="mx-auto mt-8 h-full w-full overflow-y-auto px-6 lg:px-20 pb- animate-pulse">
-    <div className="flex flex-col gap-2 pt-6 mb-2 pb-6 border-b border-custom-border-100">
-      <span className="h-7 w-40 bg-custom-background-80 rounded" />
-      <span className="h-5 w-96 bg-custom-background-80 rounded" />
-    </div>
-    <div className="flex flex-col gap-2">
-      <div className="flex items-center py-3">
-        <span className="h-7 w-32 bg-custom-background-80 rounded" />
+export function EmailSettingsLoader() {
+  return (
+    <div className="mx-auto mt-8 h-full w-full overflow-y-auto px-6 lg:px-20 pb- animate-pulse">
+      <div className="flex flex-col gap-2 pt-6 mb-2 pb-6 border-b border-custom-border-100">
+        <span className="h-7 w-40 bg-custom-background-80 rounded" />
+        <span className="h-5 w-96 bg-custom-background-80 rounded" />
       </div>
-      {range(4).map((i) => (
-        <div key={i} className="flex items-center justify-between">
-          <div className="flex flex-col gap-2 py-3">
-            <span className="h-6 w-28 bg-custom-background-80 rounded" />
-            <span className="h-5 w-96 bg-custom-background-80 rounded" />
-          </div>
-          <div className="flex items-center">
-            <span className="h-5 w-5 bg-custom-background-80 rounded" />
-          </div>
+      <div className="flex flex-col gap-2">
+        <div className="flex items-center py-3">
+          <span className="h-7 w-32 bg-custom-background-80 rounded" />
+        </div>
+        {range(4).map((i) => (
+          <div key={i} className="flex items-center justify-between">
+            <div className="flex flex-col gap-2 py-3">
+              <span className="h-6 w-28 bg-custom-background-80 rounded" />
+              <span className="h-5 w-96 bg-custom-background-80 rounded" />
+            </div>
+            <div className="flex items-center">
+              <span className="h-5 w-5 bg-custom-background-80 rounded" />
+            </div>
+          </div>
+        ))}
+        <div className="flex items-center py-12">
+          <span className="h-8 w-32 bg-custom-background-80 rounded" />
         </div>
-      ))}
-      <div className="flex items-center py-12">
-        <span className="h-8 w-32 bg-custom-background-80 rounded" />
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/ui/loader/settings/import-and-export.tsx b/apps/web/core/components/ui/loader/settings/import-and-export.tsx
index 55097f02f..ee29f4321 100644
--- a/apps/web/core/components/ui/loader/settings/import-and-export.tsx
+++ b/apps/web/core/components/ui/loader/settings/import-and-export.tsx
@@ -1,20 +1,22 @@
 import { range } from "lodash-es";
 
-export const ImportExportSettingsLoader = () => (
-  <div className="divide-y-[0.5px] divide-custom-border-200 animate-pulse">
-    {range(2).map((i) => (
-      <div key={i} className="flex items-center justify-between gap-2 px-4 py-3">
-        <div className="flex flex-col gap-1.5">
-          <div className="flex items-center gap-2">
-            <span className="h-5 w-16 bg-custom-background-80 rounded" />
-            <span className="h-5 w-16 bg-custom-background-80 rounded" />
-          </div>
-          <div className="flex items-center gap-2">
-            <span className="h-4 w-28 bg-custom-background-80 rounded" />
-            <span className="h-4 w-28 bg-custom-background-80 rounded" />
+export function ImportExportSettingsLoader() {
+  return (
+    <div className="divide-y-[0.5px] divide-custom-border-200 animate-pulse">
+      {range(2).map((i) => (
+        <div key={i} className="flex items-center justify-between gap-2 px-4 py-3">
+          <div className="flex flex-col gap-1.5">
+            <div className="flex items-center gap-2">
+              <span className="h-5 w-16 bg-custom-background-80 rounded" />
+              <span className="h-5 w-16 bg-custom-background-80 rounded" />
+            </div>
+            <div className="flex items-center gap-2">
+              <span className="h-4 w-28 bg-custom-background-80 rounded" />
+              <span className="h-4 w-28 bg-custom-background-80 rounded" />
+            </div>
           </div>
         </div>
-      </div>
-    ))}
-  </div>
-);
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/ui/loader/settings/integration.tsx b/apps/web/core/components/ui/loader/settings/integration.tsx
index d1385d2bc..e6787e63b 100644
--- a/apps/web/core/components/ui/loader/settings/integration.tsx
+++ b/apps/web/core/components/ui/loader/settings/integration.tsx
@@ -1,21 +1,23 @@
 import { range } from "lodash-es";
 
-export const IntegrationsSettingsLoader = () => (
-  <div className="divide-y-[0.5px] divide-custom-border-100 animate-pulse">
-    {range(2).map((i) => (
-      <div
-        key={i}
-        className="flex items-center justify-between gap-2 border-b border-custom-border-100 bg-custom-background-100 px-4 py-6"
-      >
-        <div className="flex items-start gap-4">
-          <span className="h-10 w-10 bg-custom-background-80 rounded-full" />
-          <div className="flex flex-col gap-1">
-            <span className="h-5 w-20 bg-custom-background-80 rounded" />
-            <span className="h-4 w-60 bg-custom-background-80 rounded" />
+export function IntegrationsSettingsLoader() {
+  return (
+    <div className="divide-y-[0.5px] divide-custom-border-100 animate-pulse">
+      {range(2).map((i) => (
+        <div
+          key={i}
+          className="flex items-center justify-between gap-2 border-b border-custom-border-100 bg-custom-background-100 px-4 py-6"
+        >
+          <div className="flex items-start gap-4">
+            <span className="h-10 w-10 bg-custom-background-80 rounded-full" />
+            <div className="flex flex-col gap-1">
+              <span className="h-5 w-20 bg-custom-background-80 rounded" />
+              <span className="h-4 w-60 bg-custom-background-80 rounded" />
+            </div>
           </div>
+          <span className="h-8 w-16 bg-custom-background-80 rounded" />
         </div>
-        <span className="h-8 w-16 bg-custom-background-80 rounded" />
-      </div>
-    ))}
-  </div>
-);
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/ui/loader/settings/members.tsx b/apps/web/core/components/ui/loader/settings/members.tsx
index d8b975e1d..384d0478b 100644
--- a/apps/web/core/components/ui/loader/settings/members.tsx
+++ b/apps/web/core/components/ui/loader/settings/members.tsx
@@ -1,17 +1,19 @@
 import { range } from "lodash-es";
 
-export const MembersSettingsLoader = () => (
-  <div className="divide-y-[0.5px] divide-custom-border-100">
-    {range(3).map((i) => (
-      <div key={i} className="group grid grid-cols-5 items-center justify-evenly px-3 py-4">
-        <div className="flex col-span-2 items-center gap-x-2.5">
-          <span className="size-6 bg-custom-background-80 rounded-full" />
+export function MembersSettingsLoader() {
+  return (
+    <div className="divide-y-[0.5px] divide-custom-border-100">
+      {range(3).map((i) => (
+        <div key={i} className="group grid grid-cols-5 items-center justify-evenly px-3 py-4">
+          <div className="flex col-span-2 items-center gap-x-2.5">
+            <span className="size-6 bg-custom-background-80 rounded-full" />
+            <span className="h-5 w-24 bg-custom-background-80 rounded" />
+          </div>
           <span className="h-5 w-24 bg-custom-background-80 rounded" />
+          <span className="h-5 w-20 bg-custom-background-80 rounded" />
+          <span className="h-5 w-28 bg-custom-background-80 rounded" />
         </div>
-        <span className="h-5 w-24 bg-custom-background-80 rounded" />
-        <span className="h-5 w-20 bg-custom-background-80 rounded" />
-        <span className="h-5 w-28 bg-custom-background-80 rounded" />
-      </div>
-    ))}
-  </div>
-);
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/ui/loader/settings/web-hook.tsx b/apps/web/core/components/ui/loader/settings/web-hook.tsx
index 87ddbd19a..29f4e9832 100644
--- a/apps/web/core/components/ui/loader/settings/web-hook.tsx
+++ b/apps/web/core/components/ui/loader/settings/web-hook.tsx
@@ -1,20 +1,22 @@
-export const WebhookSettingsLoader = () => (
-  <div className="h-full w-full overflow-hidden py-8 pr-9">
-    <div className="flex h-full w-full flex-col">
-      <div className="flex items-center justify-between gap-4 border-b border-custom-border-200 pb-3.5">
-        <div className="text-xl font-medium">Webhooks</div>
-        <span className="h-8 w-28 bg-custom-background-80 rounded" />
-      </div>
-      <div className="h-full w-full overflow-y-auto">
-        <div className="border-b border-custom-border-200">
-          <div>
-            <span className="flex items-center justify-between gap-4 px-3.5 py-[18px]">
-              <span className="h-5 w-36 bg-custom-background-80 rounded" />
-              <span className="h-6 w-12 bg-custom-background-80 rounded" />
-            </span>
+export function WebhookSettingsLoader() {
+  return (
+    <div className="h-full w-full overflow-hidden py-8 pr-9">
+      <div className="flex h-full w-full flex-col">
+        <div className="flex items-center justify-between gap-4 border-b border-custom-border-200 pb-3.5">
+          <div className="text-xl font-medium">Webhooks</div>
+          <span className="h-8 w-28 bg-custom-background-80 rounded" />
+        </div>
+        <div className="h-full w-full overflow-y-auto">
+          <div className="border-b border-custom-border-200">
+            <div>
+              <span className="flex items-center justify-between gap-4 px-3.5 py-[18px]">
+                <span className="h-5 w-36 bg-custom-background-80 rounded" />
+                <span className="h-6 w-12 bg-custom-background-80 rounded" />
+              </span>
+            </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/ui/loader/view-list-loader.tsx b/apps/web/core/components/ui/loader/view-list-loader.tsx
index e9f91f09e..8b4959e03 100644
--- a/apps/web/core/components/ui/loader/view-list-loader.tsx
+++ b/apps/web/core/components/ui/loader/view-list-loader.tsx
@@ -1,20 +1,22 @@
 import { range } from "lodash-es";
 
-export const ViewListLoader = () => (
-  <div className="flex h-full w-full flex-col animate-pulse">
-    {range(8).map((i) => (
-      <div key={i} className="group border-b border-custom-border-200">
-        <div className="relative flex w-full items-center justify-between rounded p-4">
-          <div className="flex items-center gap-4">
-            <span className="min-h-10 min-w-10 bg-custom-background-80 rounded" />
-            <span className="h-6 w-28 bg-custom-background-80 rounded" />
-          </div>
-          <div className="flex items-center gap-2">
-            <span className="h-5 w-5 bg-custom-background-80 rounded" />
-            <span className="h-5 w-5 bg-custom-background-80 rounded" />
+export function ViewListLoader() {
+  return (
+    <div className="flex h-full w-full flex-col animate-pulse">
+      {range(8).map((i) => (
+        <div key={i} className="group border-b border-custom-border-200">
+          <div className="relative flex w-full items-center justify-between rounded p-4">
+            <div className="flex items-center gap-4">
+              <span className="min-h-10 min-w-10 bg-custom-background-80 rounded" />
+              <span className="h-6 w-28 bg-custom-background-80 rounded" />
+            </div>
+            <div className="flex items-center gap-2">
+              <span className="h-5 w-5 bg-custom-background-80 rounded" />
+              <span className="h-5 w-5 bg-custom-background-80 rounded" />
+            </div>
           </div>
         </div>
-      </div>
-    ))}
-  </div>
-);
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/ui/markdown-to-component.tsx b/apps/web/core/components/ui/markdown-to-component.tsx
index 35b53ade6..bd5198d64 100644
--- a/apps/web/core/components/ui/markdown-to-component.tsx
+++ b/apps/web/core/components/ui/markdown-to-component.tsx
@@ -33,31 +33,35 @@ interface Props {
   options?: any;
 }
 
-const HeadingPrimary: CustomComponent = ({ children }) => (
-  <h1 className="text-lg font-semibold text-custom-text-100">{children}</h1>
-);
+function HeadingPrimary({ children }) {
+  return <h1 className="text-lg font-semibold text-custom-text-100">{children}</h1>;
+}
 
-const HeadingSecondary: CustomComponent = ({ children }) => (
-  <h3 className="text-base font-semibold text-custom-text-100">{children}</h3>
-);
+function HeadingSecondary({ children }) {
+  return <h3 className="text-base font-semibold text-custom-text-100">{children}</h3>;
+}
 
-const Paragraph: CustomComponent = ({ children }) => <p className="text-sm text-custom-text-200">{children}</p>;
+function Paragraph({ children }) {
+  return <p className="text-sm text-custom-text-200">{children}</p>;
+}
 
-const OrderedList: CustomComponent = ({ children }) => (
-  <ol className="mb-4 ml-8 list-decimal text-sm text-custom-text-200">{children}</ol>
-);
+function OrderedList({ children }) {
+  return <ol className="mb-4 ml-8 list-decimal text-sm text-custom-text-200">{children}</ol>;
+}
 
-const UnorderedList: CustomComponent = ({ children }) => (
-  <ul className="mb-4 ml-8 list-disc text-sm text-custom-text-200">{children}</ul>
-);
+function UnorderedList({ children }) {
+  return <ul className="mb-4 ml-8 list-disc text-sm text-custom-text-200">{children}</ul>;
+}
 
-const Link: CustomComponent = ({ href, children }) => (
-  <a href={href} className="underline hover:no-underline" target="_blank" rel="noopener noreferrer">
-    {children}
-  </a>
-);
+function Link({ href, children }) {
+  return (
+    <a href={href} className="underline hover:no-underline" target="_blank" rel="noopener noreferrer">
+      {children}
+    </a>
+  );
+}
 
-export const MarkdownRenderer: React.FC<Props> = ({ markdown, options = {} }) => {
+export function MarkdownRenderer({ markdown, options = {} }: Props) {
   const customComponents = {
     h1: HeadingPrimary,
     h3: HeadingSecondary,
@@ -72,4 +76,4 @@ export const MarkdownRenderer: React.FC<Props> = ({ markdown, options = {} }) =>
       {markdown}
     </ReactMarkdown>
   );
-};
+}
diff --git a/apps/web/core/components/ui/profile-empty-state.tsx b/apps/web/core/components/ui/profile-empty-state.tsx
index 27c8a0b1d..e8b4d048d 100644
--- a/apps/web/core/components/ui/profile-empty-state.tsx
+++ b/apps/web/core/components/ui/profile-empty-state.tsx
@@ -6,14 +6,16 @@ type Props = {
   image: any;
 };
 
-export const ProfileEmptyState: React.FC<Props> = ({ title, description, image }) => (
-  <div className={`mx-auto grid h-full w-full place-items-center p-8 `}>
-    <div className="flex w-full flex-col items-center text-center">
-      <div className="flex h-14 w-14 items-center justify-center rounded-full bg-custom-background-90">
-        <img src={image} width="32" height="32" className="w-full h-full object-cover" alt={title} />
+export function ProfileEmptyState({ title, description, image }: Props) {
+  return (
+    <div className={`mx-auto grid h-full w-full place-items-center p-8 `}>
+      <div className="flex w-full flex-col items-center text-center">
+        <div className="flex h-14 w-14 items-center justify-center rounded-full bg-custom-background-90">
+          <img src={image} width="32" height="32" className="w-full h-full object-cover" alt={title} />
+        </div>
+        <h6 className="mb-3 mt-3.5 text-base font-semibold">{title}</h6>
+        {description && <p className="text-sm text-custom-text-300">{description}</p>}
       </div>
-      <h6 className="mb-3 mt-3.5 text-base font-semibold">{title}</h6>
-      {description && <p className="text-sm text-custom-text-300">{description}</p>}
     </div>
-  </div>
-);
+  );
+}
diff --git a/apps/web/core/components/user/user-greetings.tsx b/apps/web/core/components/user/user-greetings.tsx
index 99f3a3e7d..7a7a95e68 100644
--- a/apps/web/core/components/user/user-greetings.tsx
+++ b/apps/web/core/components/user/user-greetings.tsx
@@ -10,7 +10,7 @@ export interface IUserGreetingsView {
   user: IUser;
 }
 
-export const UserGreetingsView: FC<IUserGreetingsView> = (props) => {
+export function UserGreetingsView(props: IUserGreetingsView) {
   const { user } = props;
   // current time hook
   const { currentTime } = useCurrentTime();
@@ -53,4 +53,4 @@ export const UserGreetingsView: FC<IUserGreetingsView> = (props) => {
       </h5>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/views/applied-filters/access.tsx b/apps/web/core/components/views/applied-filters/access.tsx
index 95430e2c6..ddde4683c 100644
--- a/apps/web/core/components/views/applied-filters/access.tsx
+++ b/apps/web/core/components/views/applied-filters/access.tsx
@@ -13,7 +13,7 @@ type Props = {
   values: EViewAccess[];
 };
 
-export const AppliedAccessFilters: React.FC<Props> = observer((props) => {
+export const AppliedAccessFilters = observer(function AppliedAccessFilters(props: Props) {
   const { editable, handleRemove, values } = props;
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/views/applied-filters/root.tsx b/apps/web/core/components/views/applied-filters/root.tsx
index dc8eaaa74..9c20dc8b1 100644
--- a/apps/web/core/components/views/applied-filters/root.tsx
+++ b/apps/web/core/components/views/applied-filters/root.tsx
@@ -21,7 +21,7 @@ const MEMBERS_FILTERS = ["owned_by"];
 const DATE_FILTERS = ["created_at"];
 const VIEW_ACCESS_FILTERS = ["view_type"];
 
-export const ViewAppliedFiltersList: React.FC<Props> = (props) => {
+export function ViewAppliedFiltersList(props: Props) {
   const { appliedFilters, handleClearAllFilters, handleRemoveFilter, alwaysAllowEditing } = props;
   const { t } = useTranslation();
 
@@ -84,4 +84,4 @@ export const ViewAppliedFiltersList: React.FC<Props> = (props) => {
       )}
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/views/delete-view-modal.tsx b/apps/web/core/components/views/delete-view-modal.tsx
index 755938c71..eec33a12f 100644
--- a/apps/web/core/components/views/delete-view-modal.tsx
+++ b/apps/web/core/components/views/delete-view-modal.tsx
@@ -21,7 +21,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const DeleteProjectViewModal: React.FC<Props> = observer((props) => {
+export const DeleteProjectViewModal = observer(function DeleteProjectViewModal(props: Props) {
   const { data, isOpen, onClose } = props;
   // states
   const [isDeleteLoading, setIsDeleteLoading] = useState(false);
diff --git a/apps/web/core/components/views/filters/filter-selection.tsx b/apps/web/core/components/views/filters/filter-selection.tsx
index 6e089a2ef..ebb9e9253 100644
--- a/apps/web/core/components/views/filters/filter-selection.tsx
+++ b/apps/web/core/components/views/filters/filter-selection.tsx
@@ -20,7 +20,7 @@ type Props = {
   memberIds?: string[] | undefined;
 };
 
-export const ViewFiltersSelection: React.FC<Props> = observer((props) => {
+export const ViewFiltersSelection = observer(function ViewFiltersSelection(props: Props) {
   const { filters, handleFiltersUpdate, memberIds } = props;
   // states
   const [filtersSearchQuery, setFiltersSearchQuery] = useState("");
diff --git a/apps/web/core/components/views/filters/order-by.tsx b/apps/web/core/components/views/filters/order-by.tsx
index 1c03f191d..7a24fbaf0 100644
--- a/apps/web/core/components/views/filters/order-by.tsx
+++ b/apps/web/core/components/views/filters/order-by.tsx
@@ -18,7 +18,7 @@ type Props = {
   isMobile?: boolean;
 };
 
-export const ViewOrderByDropdown: React.FC<Props> = (props) => {
+export function ViewOrderByDropdown(props: Props) {
   const { onChange, sortBy, sortKey, isMobile = false } = props;
   const { t } = useTranslation();
 
@@ -82,4 +82,4 @@ export const ViewOrderByDropdown: React.FC<Props> = (props) => {
       })}
     </CustomMenu>
   );
-};
+}
diff --git a/apps/web/core/components/views/form.tsx b/apps/web/core/components/views/form.tsx
index d63611a45..00cafc602 100644
--- a/apps/web/core/components/views/form.tsx
+++ b/apps/web/core/components/views/form.tsx
@@ -48,7 +48,7 @@ const DEFAULT_VALUES: Partial<IProjectView> = {
   display_filters: { ...getComputedDisplayFilters(), group_by: "state" },
 };
 
-export const ProjectViewForm: React.FC<Props> = observer((props) => {
+export const ProjectViewForm = observer(function ProjectViewForm(props: Props) {
   const { handleFormSubmit, handleClose, data, preLoadedData, projectId, workspaceSlug } = props;
   // i18n
   const { t } = useTranslation();
diff --git a/apps/web/core/components/views/helper.tsx b/apps/web/core/components/views/helper.tsx
index d43a004b5..91b13b46d 100644
--- a/apps/web/core/components/views/helper.tsx
+++ b/apps/web/core/components/views/helper.tsx
@@ -17,7 +17,7 @@ export type TWorkspaceLayoutProps = {
   issuesLoading: boolean;
 };
 
-export const WorkspaceActiveLayout = (props: TWorkspaceLayoutProps) => {
+export function WorkspaceActiveLayout(props: TWorkspaceLayoutProps) {
   const {
     activeLayout = EIssueLayoutTypes.SPREADSHEET,
     isDefaultView,
@@ -48,4 +48,4 @@ export const WorkspaceActiveLayout = (props: TWorkspaceLayoutProps) => {
     default:
       return <WorkspaceAdditionalLayouts {...props} />;
   }
-};
+}
diff --git a/apps/web/core/components/views/modal.tsx b/apps/web/core/components/views/modal.tsx
index a13dd97d2..13ee993ec 100644
--- a/apps/web/core/components/views/modal.tsx
+++ b/apps/web/core/components/views/modal.tsx
@@ -28,7 +28,7 @@ type Props = {
   projectId: string;
 };
 
-export const CreateUpdateProjectViewModal: FC<Props> = observer((props) => {
+export const CreateUpdateProjectViewModal = observer(function CreateUpdateProjectViewModal(props: Props) {
   const { data, isOpen, onClose, preLoadedData, workspaceSlug, projectId } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/views/quick-actions.tsx b/apps/web/core/components/views/quick-actions.tsx
index 96cf8b4c3..118226cc8 100644
--- a/apps/web/core/components/views/quick-actions.tsx
+++ b/apps/web/core/components/views/quick-actions.tsx
@@ -28,7 +28,7 @@ type Props = {
   customClassName?: string;
 };
 
-export const ViewQuickActions: React.FC<Props> = observer((props) => {
+export const ViewQuickActions = observer(function ViewQuickActions(props: Props) {
   const { parentRef, projectId, view, workspaceSlug, customClassName } = props;
   // states
   const [createUpdateViewModal, setCreateUpdateViewModal] = useState(false);
@@ -71,13 +71,16 @@ export const ViewQuickActions: React.FC<Props> = observer((props) => {
 
   if (publishContextMenu) MENU_ITEMS.splice(2, 0, publishContextMenu);
 
-  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map((item) => ({
-    ...item,
-    action: () => {
-      captureClick({ elementName: PROJECT_VIEW_TRACKER_ELEMENTS.LIST_ITEM_CONTEXT_MENU });
-      item.action();
-    },
-  }));
+  const CONTEXT_MENU_ITEMS = MENU_ITEMS.map(function CONTEXT_MENU_ITEMS(item) {
+    return {
+      ...item,
+
+      action: () => {
+        captureClick({ elementName: PROJECT_VIEW_TRACKER_ELEMENTS.LIST_ITEM_CONTEXT_MENU });
+        item.action();
+      },
+    };
+  });
 
   return (
     <>
diff --git a/apps/web/core/components/views/view-list-header.tsx b/apps/web/core/components/views/view-list-header.tsx
index d67a4efcd..9ba28650e 100644
--- a/apps/web/core/components/views/view-list-header.tsx
+++ b/apps/web/core/components/views/view-list-header.tsx
@@ -14,7 +14,7 @@ import { FiltersDropdown } from "../issues/issue-layouts/filters";
 import { ViewFiltersSelection } from "./filters/filter-selection";
 import { ViewOrderByDropdown } from "./filters/order-by";
 
-export const ViewListHeader = observer(() => {
+export const ViewListHeader = observer(function ViewListHeader() {
   // states
   const [isSearchOpen, setIsSearchOpen] = useState(false);
   // refs
diff --git a/apps/web/core/components/views/view-list-item-action.tsx b/apps/web/core/components/views/view-list-item-action.tsx
index de1a1452e..c50c20521 100644
--- a/apps/web/core/components/views/view-list-item-action.tsx
+++ b/apps/web/core/components/views/view-list-item-action.tsx
@@ -28,7 +28,7 @@ type Props = {
   view: IProjectView;
 };
 
-export const ViewListItemAction: FC<Props> = observer((props) => {
+export const ViewListItemAction = observer(function ViewListItemAction(props: Props) {
   const { parentRef, view } = props;
   // states
   const [createUpdateViewModal, setCreateUpdateViewModal] = useState(false);
diff --git a/apps/web/core/components/views/view-list-item.tsx b/apps/web/core/components/views/view-list-item.tsx
index 524739a92..24a2298d7 100644
--- a/apps/web/core/components/views/view-list-item.tsx
+++ b/apps/web/core/components/views/view-list-item.tsx
@@ -20,7 +20,7 @@ type Props = {
   view: IProjectView;
 };
 
-export const ProjectViewListItem: FC<Props> = observer((props) => {
+export const ProjectViewListItem = observer(function ProjectViewListItem(props: Props) {
   const { view } = props;
   // refs
   const parentRef = useRef(null);
diff --git a/apps/web/core/components/views/views-list.tsx b/apps/web/core/components/views/views-list.tsx
index 96889d1da..3c58952e7 100644
--- a/apps/web/core/components/views/views-list.tsx
+++ b/apps/web/core/components/views/views-list.tsx
@@ -15,7 +15,7 @@ import { useUserPermissions } from "@/hooks/store/user";
 // local imports
 import { ProjectViewListItem } from "./view-list-item";
 
-export const ProjectViewsList = observer(() => {
+export const ProjectViewsList = observer(function ProjectViewsList() {
   const { projectId } = useParams();
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/components/web-hooks/create-webhook-modal.tsx b/apps/web/core/components/web-hooks/create-webhook-modal.tsx
index a956de428..7e1b2b261 100644
--- a/apps/web/core/components/web-hooks/create-webhook-modal.tsx
+++ b/apps/web/core/components/web-hooks/create-webhook-modal.tsx
@@ -34,7 +34,7 @@ interface ICreateWebhookModal {
   onClose: () => void;
 }
 
-export const CreateWebhookModal: React.FC<ICreateWebhookModal> = (props) => {
+export function CreateWebhookModal(props: ICreateWebhookModal) {
   const { isOpen, onClose, currentWorkspace, createWebhook, clearSecretKey } = props;
   // states
   const [generatedWebhook, setGeneratedKey] = useState<IWebhook | null>(null);
@@ -124,4 +124,4 @@ export const CreateWebhookModal: React.FC<ICreateWebhookModal> = (props) => {
       )}
     </ModalCore>
   );
-};
+}
diff --git a/apps/web/core/components/web-hooks/delete-webhook-modal.tsx b/apps/web/core/components/web-hooks/delete-webhook-modal.tsx
index afbad67cc..bd0bfc05e 100644
--- a/apps/web/core/components/web-hooks/delete-webhook-modal.tsx
+++ b/apps/web/core/components/web-hooks/delete-webhook-modal.tsx
@@ -17,7 +17,7 @@ interface IDeleteWebhook {
   onClose: () => void;
 }
 
-export const DeleteWebhookModal: FC<IDeleteWebhook> = (props) => {
+export function DeleteWebhookModal(props: IDeleteWebhook) {
   const { isOpen, onClose } = props;
   // states
   const [isDeleting, setIsDeleting] = useState(false);
@@ -84,4 +84,4 @@ export const DeleteWebhookModal: FC<IDeleteWebhook> = (props) => {
       }
     />
   );
-};
+}
diff --git a/apps/web/core/components/web-hooks/empty-state.tsx b/apps/web/core/components/web-hooks/empty-state.tsx
index 7f655a09d..bb2e14da1 100644
--- a/apps/web/core/components/web-hooks/empty-state.tsx
+++ b/apps/web/core/components/web-hooks/empty-state.tsx
@@ -10,7 +10,7 @@ type Props = {
   onClick: () => void;
 };
 
-export const WebhooksEmptyState: React.FC<Props> = (props) => {
+export function WebhooksEmptyState(props: Props) {
   const { onClick } = props;
   return (
     <div
@@ -28,4 +28,4 @@ export const WebhooksEmptyState: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/web-hooks/form/delete-section.tsx b/apps/web/core/components/web-hooks/form/delete-section.tsx
index 639dc3f80..4a5ad5311 100644
--- a/apps/web/core/components/web-hooks/form/delete-section.tsx
+++ b/apps/web/core/components/web-hooks/form/delete-section.tsx
@@ -9,7 +9,7 @@ type Props = {
   openDeleteModal: () => void;
 };
 
-export const WebhookDeleteSection: React.FC<Props> = (props) => {
+export function WebhookDeleteSection(props: Props) {
   const { openDeleteModal } = props;
 
   return (
@@ -52,4 +52,4 @@ export const WebhookDeleteSection: React.FC<Props> = (props) => {
       )}
     </Disclosure>
   );
-};
+}
diff --git a/apps/web/core/components/web-hooks/form/event-types.tsx b/apps/web/core/components/web-hooks/form/event-types.tsx
index 5bb8d442d..f9111fc19 100644
--- a/apps/web/core/components/web-hooks/form/event-types.tsx
+++ b/apps/web/core/components/web-hooks/form/event-types.tsx
@@ -18,7 +18,7 @@ const WEBHOOK_EVENT_TYPES: { key: TWebhookEventTypes; i18n_label: string }[] = [
   },
 ];
 
-export const WebhookOptions: React.FC<Props> = (props) => {
+export function WebhookOptions(props: Props) {
   const { value, onChange } = props;
   const { t } = useTranslation();
 
@@ -43,4 +43,4 @@ export const WebhookOptions: React.FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/web/core/components/web-hooks/form/form.tsx b/apps/web/core/components/web-hooks/form/form.tsx
index e2e481dad..0bef7ed11 100644
--- a/apps/web/core/components/web-hooks/form/form.tsx
+++ b/apps/web/core/components/web-hooks/form/form.tsx
@@ -36,7 +36,7 @@ const initialWebhookPayload: Partial<IWebhook> = {
   url: "",
 };
 
-export const WebhookForm: FC<Props> = observer((props) => {
+export const WebhookForm = observer(function WebhookForm(props: Props) {
   const { data, onSubmit, handleClose } = props;
   // states
   const [webhookEventType, setWebhookEventType] = useState<TWebhookEventTypes>("all");
diff --git a/apps/web/core/components/web-hooks/form/individual-event-options.tsx b/apps/web/core/components/web-hooks/form/individual-event-options.tsx
index a8216c653..b64c36652 100644
--- a/apps/web/core/components/web-hooks/form/individual-event-options.tsx
+++ b/apps/web/core/components/web-hooks/form/individual-event-options.tsx
@@ -38,31 +38,33 @@ type Props = {
   control: Control<IWebhook, any>;
 };
 
-export const WebhookIndividualEventOptions = ({ control }: Props) => (
-  <div className="grid grid-cols-1 gap-x-4 gap-y-8 px-6 lg:grid-cols-2">
-    {INDIVIDUAL_WEBHOOK_OPTIONS.map((option) => (
-      <Controller
-        key={option.key}
-        control={control}
-        name={option.key}
-        render={({ field: { onChange, value } }) => (
-          <div>
-            <div className="flex items-center gap-2">
-              <input
-                id={option.key}
-                onChange={() => onChange(!value)}
-                type="checkbox"
-                name="selectIndividualEvents"
-                checked={value === true}
-              />
-              <label className="text-sm" htmlFor={option.key}>
-                {option.label}
-              </label>
+export function WebhookIndividualEventOptions({ control }: Props) {
+  return (
+    <div className="grid grid-cols-1 gap-x-4 gap-y-8 px-6 lg:grid-cols-2">
+      {INDIVIDUAL_WEBHOOK_OPTIONS.map((option) => (
+        <Controller
+          key={option.key}
+          control={control}
+          name={option.key}
+          render={({ field: { onChange, value } }) => (
+            <div>
+              <div className="flex items-center gap-2">
+                <input
+                  id={option.key}
+                  onChange={() => onChange(!value)}
+                  type="checkbox"
+                  name="selectIndividualEvents"
+                  checked={value === true}
+                />
+                <label className="text-sm" htmlFor={option.key}>
+                  {option.label}
+                </label>
+              </div>
+              <p className="ml-6 mt-0.5 text-xs text-custom-text-300">{option.description}</p>
             </div>
-            <p className="ml-6 mt-0.5 text-xs text-custom-text-300">{option.description}</p>
-          </div>
-        )}
-      />
-    ))}
-  </div>
-);
+          )}
+        />
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/web-hooks/form/input.tsx b/apps/web/core/components/web-hooks/form/input.tsx
index c5ee281aa..72c72fb88 100644
--- a/apps/web/core/components/web-hooks/form/input.tsx
+++ b/apps/web/core/components/web-hooks/form/input.tsx
@@ -8,7 +8,7 @@ type Props = {
   onChange: (value: string) => void;
   hasError: boolean;
 };
-export const WebhookInput: React.FC<Props> = (props) => {
+export function WebhookInput(props: Props) {
   const { value, onChange, hasError } = props;
   const { t } = useTranslation();
 
@@ -27,4 +27,4 @@ export const WebhookInput: React.FC<Props> = (props) => {
       />
     </>
   );
-};
+}
diff --git a/apps/web/core/components/web-hooks/form/secret-key.tsx b/apps/web/core/components/web-hooks/form/secret-key.tsx
index 9657d6be2..8d2b4f505 100644
--- a/apps/web/core/components/web-hooks/form/secret-key.tsx
+++ b/apps/web/core/components/web-hooks/form/secret-key.tsx
@@ -27,7 +27,7 @@ type Props = {
   data: Partial<IWebhook>;
 };
 
-export const WebhookSecretKey: FC<Props> = observer((props) => {
+export const WebhookSecretKey = observer(function WebhookSecretKey(props: Props) {
   const { data } = props;
   // states
   const [isRegenerating, setIsRegenerating] = useState(false);
diff --git a/apps/web/core/components/web-hooks/form/toggle.tsx b/apps/web/core/components/web-hooks/form/toggle.tsx
index 7415cf545..c6f6cd1a6 100644
--- a/apps/web/core/components/web-hooks/form/toggle.tsx
+++ b/apps/web/core/components/web-hooks/form/toggle.tsx
@@ -14,24 +14,26 @@ interface IWebHookToggle {
   control: Control<IWebhook, any>;
 }
 
-export const WebhookToggle = ({ control }: IWebHookToggle) => (
-  <div className="flex gap-6">
-    <div className="text-sm font-medium">Enable webhook</div>
-    <Controller
-      control={control}
-      name="is_active"
-      render={({ field: { onChange, value } }) => (
-        <ToggleSwitch
-          value={value}
-          onChange={(val: boolean) => {
-            captureClick({
-              elementName: WORKSPACE_SETTINGS_TRACKER_ELEMENTS.WEBHOOK_DETAILS_PAGE_TOGGLE_SWITCH,
-            });
-            onChange(val);
-          }}
-          size="sm"
-        />
-      )}
-    />
-  </div>
-);
+export function WebhookToggle({ control }: IWebHookToggle) {
+  return (
+    <div className="flex gap-6">
+      <div className="text-sm font-medium">Enable webhook</div>
+      <Controller
+        control={control}
+        name="is_active"
+        render={({ field: { onChange, value } }) => (
+          <ToggleSwitch
+            value={value}
+            onChange={(val: boolean) => {
+              captureClick({
+                elementName: WORKSPACE_SETTINGS_TRACKER_ELEMENTS.WEBHOOK_DETAILS_PAGE_TOGGLE_SWITCH,
+              });
+              onChange(val);
+            }}
+            size="sm"
+          />
+        )}
+      />
+    </div>
+  );
+}
diff --git a/apps/web/core/components/web-hooks/generated-hook-details.tsx b/apps/web/core/components/web-hooks/generated-hook-details.tsx
index 9ce62cffb..0d91d6923 100644
--- a/apps/web/core/components/web-hooks/generated-hook-details.tsx
+++ b/apps/web/core/components/web-hooks/generated-hook-details.tsx
@@ -13,7 +13,7 @@ type Props = {
   webhookDetails: IWebhook;
 };
 
-export const GeneratedHookDetails: React.FC<Props> = (props) => {
+export function GeneratedHookDetails(props: Props) {
   const { handleClose, webhookDetails } = props;
   const { t } = useTranslation();
 
@@ -33,4 +33,4 @@ export const GeneratedHookDetails: React.FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/web/core/components/web-hooks/webhooks-list-item.tsx b/apps/web/core/components/web-hooks/webhooks-list-item.tsx
index d78c002c5..1a1113dfd 100644
--- a/apps/web/core/components/web-hooks/webhooks-list-item.tsx
+++ b/apps/web/core/components/web-hooks/webhooks-list-item.tsx
@@ -16,7 +16,7 @@ interface IWebhookListItem {
   webhook: IWebhook;
 }
 
-export const WebhooksListItem: FC<IWebhookListItem> = (props) => {
+export function WebhooksListItem(props: IWebhookListItem) {
   const { webhook } = props;
   // router
   const { workspaceSlug } = useParams();
@@ -66,4 +66,4 @@ export const WebhooksListItem: FC<IWebhookListItem> = (props) => {
       </Link>
     </div>
   );
-};
+}
diff --git a/apps/web/core/components/web-hooks/webhooks-list.tsx b/apps/web/core/components/web-hooks/webhooks-list.tsx
index 3aab35357..fe21e209d 100644
--- a/apps/web/core/components/web-hooks/webhooks-list.tsx
+++ b/apps/web/core/components/web-hooks/webhooks-list.tsx
@@ -4,7 +4,7 @@ import { useWebhook } from "@/hooks/store/use-webhook";
 // components
 import { WebhooksListItem } from "./webhooks-list-item";
 
-export const WebhooksList = observer(() => {
+export const WebhooksList = observer(function WebhooksList() {
   // store hooks
   const { webhooks } = useWebhook();
 
diff --git a/apps/web/core/components/work-item-filters/filters-hoc/base.tsx b/apps/web/core/components/work-item-filters/filters-hoc/base.tsx
index 487d351c4..0b83278ce 100644
--- a/apps/web/core/components/work-item-filters/filters-hoc/base.tsx
+++ b/apps/web/core/components/work-item-filters/filters-hoc/base.tsx
@@ -20,7 +20,7 @@ type TAdditionalWorkItemFiltersProps = {
 
 type TWorkItemFiltersHOCProps = TSharedWorkItemFiltersHOCProps & TAdditionalWorkItemFiltersProps;
 
-export const WorkItemFiltersHOC = observer((props: TWorkItemFiltersHOCProps) => {
+export const WorkItemFiltersHOC = observer(function WorkItemFiltersHOC(props: TWorkItemFiltersHOCProps) {
   const { children, initialWorkItemFilters } = props;
 
   // Only initialize filter instance when initial work item filters are defined
@@ -40,7 +40,7 @@ type TWorkItemFilterProps = TSharedWorkItemFiltersProps &
     children: React.ReactNode | ((props: { filter: IWorkItemFilterInstance }) => React.ReactNode);
   };
 
-const WorkItemFilterRoot = observer((props: TWorkItemFilterProps) => {
+const WorkItemFilterRoot = observer(function WorkItemFilterRoot(props: TWorkItemFilterProps) {
   const {
     children,
     entityType,
diff --git a/apps/web/core/components/work-item-filters/filters-hoc/project-level.tsx b/apps/web/core/components/work-item-filters/filters-hoc/project-level.tsx
index 8b73dba41..b076ff03f 100644
--- a/apps/web/core/components/work-item-filters/filters-hoc/project-level.tsx
+++ b/apps/web/core/components/work-item-filters/filters-hoc/project-level.tsx
@@ -31,7 +31,9 @@ type TProjectLevelWorkItemFiltersHOCProps = TSharedWorkItemFiltersHOCProps & {
 } & TEnableSaveViewProps &
   TEnableUpdateViewProps;
 
-export const ProjectLevelWorkItemFiltersHOC = observer((props: TProjectLevelWorkItemFiltersHOCProps) => {
+export const ProjectLevelWorkItemFiltersHOC = observer(function ProjectLevelWorkItemFiltersHOC(
+  props: TProjectLevelWorkItemFiltersHOCProps
+) {
   const { children, enableSaveView, enableUpdateView, entityId, initialWorkItemFilters, projectId, workspaceSlug } =
     props;
   // states
diff --git a/apps/web/core/components/work-item-filters/filters-hoc/workspace-level.tsx b/apps/web/core/components/work-item-filters/filters-hoc/workspace-level.tsx
index 86051a37f..59842f8e9 100644
--- a/apps/web/core/components/work-item-filters/filters-hoc/workspace-level.tsx
+++ b/apps/web/core/components/work-item-filters/filters-hoc/workspace-level.tsx
@@ -25,7 +25,9 @@ type TWorkspaceLevelWorkItemFiltersHOCProps = TSharedWorkItemFiltersHOCProps & {
 } & TEnableSaveViewProps &
   TEnableUpdateViewProps;
 
-export const WorkspaceLevelWorkItemFiltersHOC = observer((props: TWorkspaceLevelWorkItemFiltersHOCProps) => {
+export const WorkspaceLevelWorkItemFiltersHOC = observer(function WorkspaceLevelWorkItemFiltersHOC(
+  props: TWorkspaceLevelWorkItemFiltersHOCProps
+) {
   const { children, enableSaveView, enableUpdateView, entityId, initialWorkItemFilters, workspaceSlug } = props;
   // states
   const [isCreateViewModalOpen, setIsCreateViewModalOpen] = useState(false);
diff --git a/apps/web/core/components/work-item-filters/filters-row.tsx b/apps/web/core/components/work-item-filters/filters-row.tsx
index 8eb9b6aac..f3a6441d3 100644
--- a/apps/web/core/components/work-item-filters/filters-row.tsx
+++ b/apps/web/core/components/work-item-filters/filters-row.tsx
@@ -10,4 +10,6 @@ type TWorkItemFiltersRowProps = TFiltersRowProps<TWorkItemFilterProperty, TWorkI
   filter: IWorkItemFilterInstance;
 };
 
-export const WorkItemFiltersRow = observer((props: TWorkItemFiltersRowProps) => <FiltersRow {...props} />);
+export const WorkItemFiltersRow = observer(function WorkItemFiltersRow(props: TWorkItemFiltersRowProps) {
+  return <FiltersRow {...props} />;
+});
diff --git a/apps/web/core/components/work-item-filters/filters-toggle.tsx b/apps/web/core/components/work-item-filters/filters-toggle.tsx
index b1d4bde1e..60b2073b6 100644
--- a/apps/web/core/components/work-item-filters/filters-toggle.tsx
+++ b/apps/web/core/components/work-item-filters/filters-toggle.tsx
@@ -11,7 +11,7 @@ type TWorkItemFiltersToggleProps = {
   entityId: string;
 };
 
-export const WorkItemFiltersToggle = observer((props: TWorkItemFiltersToggleProps) => {
+export const WorkItemFiltersToggle = observer(function WorkItemFiltersToggle(props: TWorkItemFiltersToggleProps) {
   const { entityType, entityId } = props;
   // store hooks
   const { getFilter } = useWorkItemFilters();
diff --git a/apps/web/core/components/workspace-notifications/notification-app-sidebar-option.tsx b/apps/web/core/components/workspace-notifications/notification-app-sidebar-option.tsx
index 5c900809f..5b2b846ee 100644
--- a/apps/web/core/components/workspace-notifications/notification-app-sidebar-option.tsx
+++ b/apps/web/core/components/workspace-notifications/notification-app-sidebar-option.tsx
@@ -14,7 +14,9 @@ type TNotificationAppSidebarOption = {
   workspaceSlug: string;
 };
 
-export const NotificationAppSidebarOption: FC<TNotificationAppSidebarOption> = observer((props) => {
+export const NotificationAppSidebarOption = observer(function NotificationAppSidebarOption(
+  props: TNotificationAppSidebarOption
+) {
   const { workspaceSlug } = props;
   // hooks
   const { unreadNotificationsCount, getUnreadNotificationsCount } = useWorkspaceNotifications();
diff --git a/apps/web/core/components/workspace-notifications/root.tsx b/apps/web/core/components/workspace-notifications/root.tsx
index 307001dc3..399e983ca 100644
--- a/apps/web/core/components/workspace-notifications/root.tsx
+++ b/apps/web/core/components/workspace-notifications/root.tsx
@@ -24,7 +24,7 @@ type NotificationsRootProps = {
   workspaceSlug?: string;
 };
 
-export const NotificationsRoot = observer(({ workspaceSlug }: NotificationsRootProps) => {
+export const NotificationsRoot = observer(function NotificationsRoot({ workspaceSlug }: NotificationsRootProps) {
   // plane hooks
   const { t } = useTranslation();
   // hooks
diff --git a/apps/web/core/components/workspace-notifications/sidebar/empty-state.tsx b/apps/web/core/components/workspace-notifications/sidebar/empty-state.tsx
index cacdf7cf9..49d8ffb2f 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/empty-state.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/empty-state.tsx
@@ -11,7 +11,9 @@ type TNotificationEmptyStateProps = {
   currentNotificationTab: ENotificationTab;
 };
 
-export const NotificationEmptyState: FC<TNotificationEmptyStateProps> = observer(({ currentNotificationTab }) => {
+export const NotificationEmptyState = observer(function NotificationEmptyState({
+  currentNotificationTab,
+}: TNotificationEmptyStateProps) {
   // plane imports
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/workspace-notifications/sidebar/filters/applied-filter.tsx b/apps/web/core/components/workspace-notifications/sidebar/filters/applied-filter.tsx
index 1eee3d0cf..c1d84e63c 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/filters/applied-filter.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/filters/applied-filter.tsx
@@ -14,7 +14,7 @@ type TAppliedFilters = {
   workspaceSlug: string;
 };
 
-export const AppliedFilters: FC<TAppliedFilters> = observer((props) => {
+export const AppliedFilters = observer(function AppliedFilters(props: TAppliedFilters) {
   const { workspaceSlug } = props;
   // hooks
   const { filters, updateFilters } = useWorkspaceNotifications();
diff --git a/apps/web/core/components/workspace-notifications/sidebar/filters/menu/menu-option-item.tsx b/apps/web/core/components/workspace-notifications/sidebar/filters/menu/menu-option-item.tsx
index 2d7c83544..fb6afbbb9 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/filters/menu/menu-option-item.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/filters/menu/menu-option-item.tsx
@@ -10,7 +10,10 @@ import { cn } from "@plane/utils";
 // hooks
 import { useWorkspaceNotifications } from "@/hooks/store/notifications";
 
-export const NotificationFilterOptionItem: FC<{ label: string; value: ENotificationFilterType }> = observer((props) => {
+export const NotificationFilterOptionItem = observer(function NotificationFilterOptionItem(props: {
+  label: string;
+  value: ENotificationFilterType;
+}) {
   const { value, label } = props;
   // hooks
   const { filters, updateFilters } = useWorkspaceNotifications();
diff --git a/apps/web/core/components/workspace-notifications/sidebar/filters/menu/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/filters/menu/root.tsx
index aa856b43c..15417fbee 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/filters/menu/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/filters/menu/root.tsx
@@ -14,7 +14,7 @@ import { usePlatformOS } from "@/hooks/use-platform-os";
 // local imports
 import { NotificationFilterOptionItem } from "./menu-option-item";
 
-export const NotificationFilter: FC = observer(() => {
+export const NotificationFilter = observer(function NotificationFilter() {
   // hooks
   const { isMobile } = usePlatformOS();
   const { t } = useTranslation();
diff --git a/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/menu-item.tsx b/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/menu-item.tsx
index f778fe556..9b748b279 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/menu-item.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/menu-item.tsx
@@ -7,7 +7,7 @@ import { cn } from "@plane/utils";
 // local imports
 import type { TPopoverMenuOptions } from "./root";
 
-export const NotificationMenuOptionItem: FC<TPopoverMenuOptions> = observer((props) => {
+export const NotificationMenuOptionItem = observer(function NotificationMenuOptionItem(props: TPopoverMenuOptions) {
   const { type, label = "", isActive, prependIcon, appendIcon, onClick } = props;
 
   if (type === "menu-item")
diff --git a/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/root.tsx
index cd9a75946..d4e13b8ce 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/root.tsx
@@ -23,7 +23,7 @@ export type TPopoverMenuOptions = {
   onClick?: (() => void) | undefined;
 };
 
-export const NotificationHeaderMenuOption = observer(() => {
+export const NotificationHeaderMenuOption = observer(function NotificationHeaderMenuOption() {
   // hooks
   const { filters, updateFilters, updateBulkFilters } = useWorkspaceNotifications();
   const { t } = useTranslation();
diff --git a/apps/web/core/components/workspace-notifications/sidebar/header/options/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/header/options/root.tsx
index 2ceb20389..8adb372da 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/header/options/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/header/options/root.tsx
@@ -24,7 +24,9 @@ type TNotificationSidebarHeaderOptions = {
   workspaceSlug: string;
 };
 
-export const NotificationSidebarHeaderOptions: FC<TNotificationSidebarHeaderOptions> = observer((props) => {
+export const NotificationSidebarHeaderOptions = observer(function NotificationSidebarHeaderOptions(
+  props: TNotificationSidebarHeaderOptions
+) {
   const { workspaceSlug } = props;
   // hooks
   const { isMobile } = usePlatformOS();
diff --git a/apps/web/core/components/workspace-notifications/sidebar/header/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/header/root.tsx
index 63e47a374..6438ae50a 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/header/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/header/root.tsx
@@ -18,7 +18,9 @@ type TNotificationSidebarHeader = {
   workspaceSlug: string;
 };
 
-export const NotificationSidebarHeader: FC<TNotificationSidebarHeader> = observer((props) => {
+export const NotificationSidebarHeader = observer(function NotificationSidebarHeader(
+  props: TNotificationSidebarHeader
+) {
   const { workspaceSlug } = props;
   const { t } = useTranslation();
   const { sidebarCollapsed } = useAppTheme();
diff --git a/apps/web/core/components/workspace-notifications/sidebar/loader.tsx b/apps/web/core/components/workspace-notifications/sidebar/loader.tsx
index 7112651da..b3428459d 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/loader.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/loader.tsx
@@ -1,18 +1,20 @@
 import { range } from "lodash-es";
 
-export const NotificationsLoader = () => (
-  <div className="divide-y divide-custom-border-100 animate-pulse overflow-hidden">
-    {range(8).map((i) => (
-      <div key={i} className="flex w-full items-center gap-4 p-3">
-        <span className="min-h-12 min-w-12 bg-custom-background-80 rounded-full" />
-        <div className="flex flex-col gap-2.5 w-full">
-          <span className="h-5 w-36 bg-custom-background-80 rounded" />
-          <div className="flex items-center justify-between gap-2 w-full">
-            <span className="h-5 w-28 bg-custom-background-80 rounded" />
-            <span className="h-5 w-16 bg-custom-background-80 rounded" />
+export function NotificationsLoader() {
+  return (
+    <div className="divide-y divide-custom-border-100 animate-pulse overflow-hidden">
+      {range(8).map((i) => (
+        <div key={i} className="flex w-full items-center gap-4 p-3">
+          <span className="min-h-12 min-w-12 bg-custom-background-80 rounded-full" />
+          <div className="flex flex-col gap-2.5 w-full">
+            <span className="h-5 w-36 bg-custom-background-80 rounded" />
+            <div className="flex items-center justify-between gap-2 w-full">
+              <span className="h-5 w-28 bg-custom-background-80 rounded" />
+              <span className="h-5 w-16 bg-custom-background-80 rounded" />
+            </div>
           </div>
         </div>
-      </div>
-    ))}
-  </div>
-);
+      ))}
+    </div>
+  );
+}
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/content.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/content.tsx
index 44e0e7b74..dc411309e 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/content.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/content.tsx
@@ -11,13 +11,19 @@ import {
 // components
 import { LiteTextEditor } from "@/components/editor/lite-text";
 
-export const NotificationContent: FC<{
+export function NotificationContent({
+  notification,
+  workspaceId,
+  workspaceSlug,
+  projectId,
+  renderCommentBox = false,
+}: {
   notification: TNotification;
   workspaceId: string;
   workspaceSlug: string;
   projectId: string;
   renderCommentBox?: boolean;
-}> = ({ notification, workspaceId, workspaceSlug, projectId, renderCommentBox = false }) => {
+}) {
   const { data, triggered_by_details: triggeredBy } = notification;
   const notificationField = data?.issue_activity.field;
   const newValue = data?.issue_activity.new_value;
@@ -118,4 +124,4 @@ export const NotificationContent: FC<{
       )}
     </>
   );
-};
+}
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/item.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/item.tsx
index eb94f3954..20b164b34 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/item.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/item.tsx
@@ -21,7 +21,7 @@ type TNotificationItem = {
   notificationId: string;
 };
 
-export const NotificationItem: FC<TNotificationItem> = observer((props) => {
+export const NotificationItem = observer(function NotificationItem(props: TNotificationItem) {
   const { workspaceSlug, notificationId } = props;
   // hooks
   const { currentSelectedNotificationId, setCurrentSelectedNotificationId } = useWorkspaceNotifications();
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/archive.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/archive.tsx
index b77ae7689..d524f2646 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/archive.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/archive.tsx
@@ -22,7 +22,9 @@ type TNotificationItemArchiveOption = {
   notification: INotification;
 };
 
-export const NotificationItemArchiveOption: FC<TNotificationItemArchiveOption> = observer((props) => {
+export const NotificationItemArchiveOption = observer(function NotificationItemArchiveOption(
+  props: TNotificationItemArchiveOption
+) {
   const { workspaceSlug, notification } = props;
   // hooks
   const { currentNotificationTab } = useWorkspaceNotifications();
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/button.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/button.tsx
index 3c45a4690..97b93328a 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/button.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/button.tsx
@@ -14,7 +14,7 @@ type TNotificationItemOptionButton = {
   children: ReactNode;
 };
 
-export const NotificationItemOptionButton: FC<TNotificationItemOptionButton> = (props) => {
+export function NotificationItemOptionButton(props: TNotificationItemOptionButton) {
   const { tooltipContent = "", buttonClassName = "", children, callBack } = props;
   // hooks
   const { isMobile } = usePlatformOS();
@@ -37,4 +37,4 @@ export const NotificationItemOptionButton: FC<TNotificationItemOptionButton> = (
       </button>
     </Tooltip>
   );
-};
+}
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/read.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/read.tsx
index 490338209..f3e71b30f 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/read.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/read.tsx
@@ -21,7 +21,9 @@ type TNotificationItemReadOption = {
   notification: INotification;
 };
 
-export const NotificationItemReadOption: FC<TNotificationItemReadOption> = observer((props) => {
+export const NotificationItemReadOption = observer(function NotificationItemReadOption(
+  props: TNotificationItemReadOption
+) {
   const { workspaceSlug, notification } = props;
   // hooks
   const { currentNotificationTab } = useWorkspaceNotifications();
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/root.tsx
index 981763b36..0bfe280d2 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/root.tsx
@@ -20,7 +20,7 @@ type TNotificationOption = {
   setCustomSnoozeModal: Dispatch<SetStateAction<boolean>>;
 };
 
-export const NotificationOption: FC<TNotificationOption> = observer((props) => {
+export const NotificationOption = observer(function NotificationOption(props: TNotificationOption) {
   const {
     workspaceSlug,
     notificationId,
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx
index e67c43c77..b3320a817 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx
@@ -35,7 +35,7 @@ const defaultValues: FormValues = {
 
 const timeStamps = allTimeIn30MinutesInterval12HoursFormat;
 
-export const NotificationSnoozeModal: FC<TNotificationSnoozeModal> = (props) => {
+export function NotificationSnoozeModal(props: TNotificationSnoozeModal) {
   const { isOpen, onClose, onSubmit: handleSubmitSnooze } = props;
 
   const { workspaceSlug } = useParams();
@@ -260,4 +260,4 @@ export const NotificationSnoozeModal: FC<TNotificationSnoozeModal> = (props) =>
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/root.tsx
index 2ae272317..9495c8da3 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/root.tsx
@@ -27,7 +27,9 @@ type TNotificationItemSnoozeOption = {
   setCustomSnoozeModal: Dispatch<SetStateAction<boolean>>;
 };
 
-export const NotificationItemSnoozeOption: FC<TNotificationItemSnoozeOption> = observer((props) => {
+export const NotificationItemSnoozeOption = observer(function NotificationItemSnoozeOption(
+  props: TNotificationItemSnoozeOption
+) {
   const { workspaceSlug, notification, setIsSnoozeStateModalOpen, customSnoozeModal, setCustomSnoozeModal } = props;
   // hooks
   const { isMobile } = usePlatformOS();
diff --git a/apps/web/core/components/workspace-notifications/sidebar/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/root.tsx
index 080f5afe7..46a1b9540 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/root.tsx
@@ -23,7 +23,7 @@ import { AppliedFilters } from "./filters/applied-filter";
 import { NotificationSidebarHeader } from "./header";
 import { NotificationsLoader } from "./loader";
 
-export const NotificationsSidebarRoot: FC = observer(() => {
+export const NotificationsSidebarRoot = observer(function NotificationsSidebarRoot() {
   const { workspaceSlug } = useParams();
   // hooks
   const { getWorkspaceBySlug } = useWorkspace();
diff --git a/apps/web/core/components/workspace/ConfirmWorkspaceMemberRemove.tsx b/apps/web/core/components/workspace/ConfirmWorkspaceMemberRemove.tsx
index 3674fb533..556ba9ac1 100644
--- a/apps/web/core/components/workspace/ConfirmWorkspaceMemberRemove.tsx
+++ b/apps/web/core/components/workspace/ConfirmWorkspaceMemberRemove.tsx
@@ -8,7 +8,7 @@ import { Button } from "@plane/propel/button";
 import { useUser } from "@/hooks/store/user";
 import type { Props } from "./confirm-workspace-member-remove";
 
-export const ConfirmWorkspaceMemberRemove: React.FC<Props> = observer((props) => {
+export const ConfirmWorkspaceMemberRemove = observer(function ConfirmWorkspaceMemberRemove(props: Props) {
   const { isOpen, onClose, onSubmit, userDetails } = props;
   // states
   const [isRemoving, setIsRemoving] = useState(false);
diff --git a/apps/web/core/components/workspace/billing/comparison/base.tsx b/apps/web/core/components/workspace/billing/comparison/base.tsx
index 3a40018e0..a31c96987 100644
--- a/apps/web/core/components/workspace/billing/comparison/base.tsx
+++ b/apps/web/core/components/workspace/billing/comparison/base.tsx
@@ -24,7 +24,7 @@ export const shouldRenderPlanDetail = (planKey: TPlanePlans) => {
   return true;
 };
 
-export const PlansComparisonBase = observer((props: TPlansComparisonBaseProps) => {
+export const PlansComparisonBase = observer(function PlansComparisonBase(props: TPlansComparisonBaseProps) {
   const { planeDetails, isSelfManaged, isCompareAllFeaturesSectionOpen, setIsCompareAllFeaturesSectionOpen } = props;
   // plan details
   const { planDetails, planHighlights, planComparison } = PLANE_PLANS;
diff --git a/apps/web/core/components/workspace/billing/comparison/feature-detail.tsx b/apps/web/core/components/workspace/billing/comparison/feature-detail.tsx
index 67f15421f..27eedb05a 100644
--- a/apps/web/core/components/workspace/billing/comparison/feature-detail.tsx
+++ b/apps/web/core/components/workspace/billing/comparison/feature-detail.tsx
@@ -12,7 +12,7 @@ type TPlanFeatureDetailProps = {
   data: TPlanFeatureData;
 };
 
-export const PlanFeatureDetail: FC<TPlanFeatureDetailProps> = (props) => {
+export function PlanFeatureDetail(props: TPlanFeatureDetailProps) {
   const { subscriptionType, data } = props;
 
   if (data === null || data === undefined) {
@@ -25,4 +25,4 @@ export const PlanFeatureDetail: FC<TPlanFeatureDetailProps> = (props) => {
     return <MinusCircle className="size-4 text-custom-text-400" />;
   }
   return <>{data}</>;
-};
+}
diff --git a/apps/web/core/components/workspace/confirm-workspace-member-remove.tsx b/apps/web/core/components/workspace/confirm-workspace-member-remove.tsx
index bf1dc3d0d..783012de0 100644
--- a/apps/web/core/components/workspace/confirm-workspace-member-remove.tsx
+++ b/apps/web/core/components/workspace/confirm-workspace-member-remove.tsx
@@ -20,7 +20,7 @@ export type Props = {
   };
 };
 
-export const ConfirmWorkspaceMemberRemove: React.FC<Props> = observer((props) => {
+export const ConfirmWorkspaceMemberRemove = observer(function ConfirmWorkspaceMemberRemove(props: Props) {
   const { isOpen, onClose, onSubmit, userDetails } = props;
   // states
   const [isRemoving, setIsRemoving] = useState(false);
diff --git a/apps/web/core/components/workspace/create-workspace-form.tsx b/apps/web/core/components/workspace/create-workspace-form.tsx
index 6e1d6c501..7f3cdcaf8 100644
--- a/apps/web/core/components/workspace/create-workspace-form.tsx
+++ b/apps/web/core/components/workspace/create-workspace-form.tsx
@@ -40,7 +40,7 @@ type Props = {
 
 const workspaceService = new WorkspaceService();
 
-export const CreateWorkspaceForm: FC<Props> = observer((props) => {
+export const CreateWorkspaceForm = observer(function CreateWorkspaceForm(props: Props) {
   const { t } = useTranslation();
   const {
     onSubmit,
@@ -244,7 +244,6 @@ export const CreateWorkspaceForm: FC<Props> = observer((props) => {
           </div>
         </div>
       </div>
-
       <div className="flex items-center gap-4">
         {secondaryButton}
         <Button
diff --git a/apps/web/core/components/workspace/delete-workspace-form.tsx b/apps/web/core/components/workspace/delete-workspace-form.tsx
index ffdfc7a27..0e1bb4982 100644
--- a/apps/web/core/components/workspace/delete-workspace-form.tsx
+++ b/apps/web/core/components/workspace/delete-workspace-form.tsx
@@ -29,7 +29,7 @@ const defaultValues = {
   confirmDelete: "",
 };
 
-export const DeleteWorkspaceForm: React.FC<Props> = observer((props) => {
+export const DeleteWorkspaceForm = observer(function DeleteWorkspaceForm(props: Props) {
   const { data, onClose } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/workspace/invite-modal/actions.tsx b/apps/web/core/components/workspace/invite-modal/actions.tsx
index 13330aa67..5eddfc777 100644
--- a/apps/web/core/components/workspace/invite-modal/actions.tsx
+++ b/apps/web/core/components/workspace/invite-modal/actions.tsx
@@ -19,7 +19,7 @@ type TInvitationModalActionsProps = {
   className?: string;
 };
 
-export const InvitationModalActions: React.FC<TInvitationModalActionsProps> = observer((props) => {
+export const InvitationModalActions = observer(function InvitationModalActions(props: TInvitationModalActionsProps) {
   const {
     isInviteDisabled = false,
     isSubmitting = false,
diff --git a/apps/web/core/components/workspace/invite-modal/fields.tsx b/apps/web/core/components/workspace/invite-modal/fields.tsx
index 00de28488..1ecf8d21f 100644
--- a/apps/web/core/components/workspace/invite-modal/fields.tsx
+++ b/apps/web/core/components/workspace/invite-modal/fields.tsx
@@ -22,7 +22,7 @@ type TInvitationFieldsProps = {
   className?: string;
 };
 
-export const InvitationFields = observer((props: TInvitationFieldsProps) => {
+export const InvitationFields = observer(function InvitationFields(props: TInvitationFieldsProps) {
   const {
     workspaceSlug,
     fields,
diff --git a/apps/web/core/components/workspace/invite-modal/form.tsx b/apps/web/core/components/workspace/invite-modal/form.tsx
index cbf53e237..d23c5b0b4 100644
--- a/apps/web/core/components/workspace/invite-modal/form.tsx
+++ b/apps/web/core/components/workspace/invite-modal/form.tsx
@@ -12,7 +12,7 @@ type TInvitationFormProps = {
   className?: string;
 };
 
-export const InvitationForm = observer((props: TInvitationFormProps) => {
+export const InvitationForm = observer(function InvitationForm(props: TInvitationFormProps) {
   const { title, description, children, actions, onSubmit, className } = props;
 
   return (
diff --git a/apps/web/core/components/workspace/logo.tsx b/apps/web/core/components/workspace/logo.tsx
index e33f5541a..113e9f1dd 100644
--- a/apps/web/core/components/workspace/logo.tsx
+++ b/apps/web/core/components/workspace/logo.tsx
@@ -9,7 +9,7 @@ type Props = {
   classNames?: string;
 };
 
-export const WorkspaceLogo = observer((props: Props) => {
+export const WorkspaceLogo = observer(function WorkspaceLogo(props: Props) {
   // translation
   const { t } = useTranslation();
 
diff --git a/apps/web/core/components/workspace/settings/invitations-list-item.tsx b/apps/web/core/components/workspace/settings/invitations-list-item.tsx
index 1e62cf505..5f70b1ac2 100644
--- a/apps/web/core/components/workspace/settings/invitations-list-item.tsx
+++ b/apps/web/core/components/workspace/settings/invitations-list-item.tsx
@@ -24,7 +24,7 @@ type Props = {
   invitationId: string;
 };
 
-export const WorkspaceInvitationsListItem: FC<Props> = observer((props) => {
+export const WorkspaceInvitationsListItem = observer(function WorkspaceInvitationsListItem(props: Props) {
   const { invitationId } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/workspace/settings/member-columns.tsx b/apps/web/core/components/workspace/settings/member-columns.tsx
index bdcb3d3a0..11018b310 100644
--- a/apps/web/core/components/workspace/settings/member-columns.tsx
+++ b/apps/web/core/components/workspace/settings/member-columns.tsx
@@ -37,7 +37,7 @@ type AccountTypeProps = {
   workspaceSlug: string;
 };
 
-export const NameColumn: React.FC<NameProps> = (props) => {
+export function NameColumn(props: NameProps) {
   const { rowData, workspaceSlug, isAdmin, currentUser, setRemoveMemberModal } = props;
   // derived values
   const { avatar_url, display_name, email, first_name, id, last_name } = rowData.member;
@@ -97,9 +97,9 @@ export const NameColumn: React.FC<NameProps> = (props) => {
       )}
     </Disclosure>
   );
-};
+}
 
-export const AccountTypeColumn: React.FC<AccountTypeProps> = observer((props) => {
+export const AccountTypeColumn = observer(function AccountTypeColumn(props: AccountTypeProps) {
   const { rowData, workspaceSlug } = props;
   // form info
   const {
diff --git a/apps/web/core/components/workspace/settings/members-list-item.tsx b/apps/web/core/components/workspace/settings/members-list-item.tsx
index 8cd3b9020..5becdec81 100644
--- a/apps/web/core/components/workspace/settings/members-list-item.tsx
+++ b/apps/web/core/components/workspace/settings/members-list-item.tsx
@@ -26,7 +26,7 @@ type Props = {
   memberDetails: (IWorkspaceMember | null)[];
 };
 
-export const WorkspaceMembersListItem: FC<Props> = observer((props) => {
+export const WorkspaceMembersListItem = observer(function WorkspaceMembersListItem(props: Props) {
   const { memberDetails } = props;
   const { columns, workspaceSlug, removeMemberModal, setRemoveMemberModal } = useMemberColumns();
   // router
diff --git a/apps/web/core/components/workspace/settings/members-list.tsx b/apps/web/core/components/workspace/settings/members-list.tsx
index b71ca37ed..5b2394398 100644
--- a/apps/web/core/components/workspace/settings/members-list.tsx
+++ b/apps/web/core/components/workspace/settings/members-list.tsx
@@ -17,7 +17,10 @@ import { useMember } from "@/hooks/store/use-member";
 import { WorkspaceInvitationsListItem } from "./invitations-list-item";
 import { WorkspaceMembersListItem } from "./members-list-item";
 
-export const WorkspaceMembersList: FC<{ searchQuery: string; isAdmin: boolean }> = observer((props) => {
+export const WorkspaceMembersList = observer(function WorkspaceMembersList(props: {
+  searchQuery: string;
+  isAdmin: boolean;
+}) {
   const { searchQuery, isAdmin } = props;
   const [showPendingInvites, setShowPendingInvites] = useState<boolean>(true);
 
diff --git a/apps/web/core/components/workspace/settings/workspace-details.tsx b/apps/web/core/components/workspace/settings/workspace-details.tsx
index 834abe61f..1fe8b8d5f 100644
--- a/apps/web/core/components/workspace/settings/workspace-details.tsx
+++ b/apps/web/core/components/workspace/settings/workspace-details.tsx
@@ -36,7 +36,7 @@ const defaultValues: Partial<IWorkspace> = {
   logo_url: null,
 };
 
-export const WorkspaceDetails: FC = observer(() => {
+export const WorkspaceDetails = observer(function WorkspaceDetails() {
   // states
   const [isLoading, setIsLoading] = useState(false);
   const [isImageUploadModalOpen, setIsImageUploadModalOpen] = useState(false);
diff --git a/apps/web/core/components/workspace/sidebar/dropdown-item.tsx b/apps/web/core/components/workspace/sidebar/dropdown-item.tsx
index 180e690ca..ae86e0520 100644
--- a/apps/web/core/components/workspace/sidebar/dropdown-item.tsx
+++ b/apps/web/core/components/workspace/sidebar/dropdown-item.tsx
@@ -19,7 +19,7 @@ type TProps = {
   handleWorkspaceNavigation: (workspace: IWorkspace) => void;
   handleClose: () => void;
 };
-const SidebarDropdownItem = observer((props: TProps) => {
+const SidebarDropdownItem = observer(function SidebarDropdownItem(props: TProps) {
   const { workspace, activeWorkspace, handleItemClick, handleWorkspaceNavigation, handleClose } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/workspace/sidebar/dropdown.tsx b/apps/web/core/components/workspace/sidebar/dropdown.tsx
index e9f3adee0..fa3aab3e6 100644
--- a/apps/web/core/components/workspace/sidebar/dropdown.tsx
+++ b/apps/web/core/components/workspace/sidebar/dropdown.tsx
@@ -8,7 +8,7 @@ import { WorkspaceAppSwitcher } from "@/plane-web/components/workspace/app-switc
 import { UserMenuRoot } from "./user-menu-root";
 import { WorkspaceMenuRoot } from "./workspace-menu-root";
 
-export const SidebarDropdown = observer(() => {
+export const SidebarDropdown = observer(function SidebarDropdown() {
   // hooks
   const { shouldRenderAppRail, isEnabled: isAppRailEnabled } = useAppRail();
 
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorite-folder.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorite-folder.tsx
index 7b7970123..2d33ea8a6 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorite-folder.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorite-folder.tsx
@@ -42,7 +42,7 @@ type Props = {
   handleDrop: (self: DropTargetRecord, source: ElementDragPayload, location: DragLocationHistory) => void;
 };
 
-export const FavoriteFolder: React.FC<Props> = (props) => {
+export function FavoriteFolder(props: Props) {
   const { favorite, handleRemoveFromFavorites, isLastChild, handleDrop } = props;
   // store hooks
   const { fetchGroupedFavorites } = useFavorite();
@@ -289,4 +289,4 @@ export const FavoriteFolder: React.FC<Props> = (props) => {
       </Disclosure>
     </>
   );
-};
+}
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-drag-handle.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-drag-handle.tsx
index b13c175de..fb2c2e1e1 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-drag-handle.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-drag-handle.tsx
@@ -15,7 +15,7 @@ type Props = {
   isDragging: boolean;
 };
 
-export const FavoriteItemDragHandle: FC<Props> = observer((props) => {
+export const FavoriteItemDragHandle = observer(function FavoriteItemDragHandle(props: Props) {
   const { sort_order, isDragging } = props;
   // store hooks
   const { isMobile } = usePlatformOS();
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-quick-action.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-quick-action.tsx
index 995b26df1..dd4608ca0 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-quick-action.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-quick-action.tsx
@@ -18,7 +18,7 @@ type Props = {
   handleRemoveFromFavorites: (favorite: IFavorite) => void;
 };
 
-export const FavoriteItemQuickAction: FC<Props> = observer((props) => {
+export const FavoriteItemQuickAction = observer(function FavoriteItemQuickAction(props: Props) {
   const { ref, isMenuActive, onChange, handleRemoveFromFavorites, favorite } = props;
   // translation
   const { t } = useTranslation();
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-title.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-title.tsx
index b408e6e86..dcc2723f4 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-title.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-title.tsx
@@ -13,7 +13,7 @@ type Props = {
   icon: React.ReactNode;
 };
 
-export const FavoriteItemTitle: FC<Props> = observer((props) => {
+export const FavoriteItemTitle = observer(function FavoriteItemTitle(props: Props) {
   const { href, title, icon } = props;
   // store hooks
   const { toggleSidebar } = useAppTheme();
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-wrapper.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-wrapper.tsx
index b04c8f02c..e25f1f4b6 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-wrapper.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-wrapper.tsx
@@ -10,7 +10,7 @@ type Props = {
   isMenuActive?: boolean;
 };
 
-export const FavoriteItemWrapper: FC<Props> = (props) => {
+export function FavoriteItemWrapper(props: Props) {
   const { children, elementRef, isMenuActive = false } = props;
   return (
     <>
@@ -27,4 +27,4 @@ export const FavoriteItemWrapper: FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/root.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/root.tsx
index 0aa4b22e2..419aecd94 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/root.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/root.tsx
@@ -33,7 +33,7 @@ type Props = {
   handleDrop: (self: DropTargetRecord, source: ElementDragPayload, location: DragLocationHistory) => void;
 };
 
-export const FavoriteRoot: FC<Props> = observer((props) => {
+export const FavoriteRoot = observer(function FavoriteRoot(props: Props) {
   // props
   const { isLastChild, parentId, workspaceSlug, favorite, handleRemoveFromFavorites, handleDrop } = props;
   // store hooks
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx
index 02eb45acd..ad2ddc85e 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx
@@ -34,7 +34,7 @@ import type { TargetData } from "./favorites.helpers";
 import { getInstructionFromPayload } from "./favorites.helpers";
 import { NewFavoriteFolder } from "./new-fav-folder";
 
-export const SidebarFavoritesMenu = observer(() => {
+export const SidebarFavoritesMenu = observer(function SidebarFavoritesMenu() {
   // states
   const [createNewFolder, setCreateNewFolder] = useState<boolean | string | null>(null);
   const [isDragging, setIsDragging] = useState(false);
diff --git a/apps/web/core/components/workspace/sidebar/favorites/new-fav-folder.tsx b/apps/web/core/components/workspace/sidebar/favorites/new-fav-folder.tsx
index f8be94eb6..724b23793 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/new-fav-folder.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/new-fav-folder.tsx
@@ -26,7 +26,7 @@ type TProps = {
   defaultName?: string;
   favoriteId?: string;
 };
-export const NewFavoriteFolder = observer((props: TProps) => {
+export const NewFavoriteFolder = observer(function NewFavoriteFolder(props: TProps) {
   const { setCreateNewFolder, actionType, defaultName, favoriteId } = props;
   const { t } = useTranslation();
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/workspace/sidebar/help-menu.tsx b/apps/web/core/components/workspace/sidebar/help-menu.tsx
index d2bb71506..c806387f7 100644
--- a/apps/web/core/components/workspace/sidebar/help-menu.tsx
+++ b/apps/web/core/components/workspace/sidebar/help-menu.tsx
@@ -24,7 +24,7 @@ export interface WorkspaceHelpSectionProps {
   setSidebarActive?: React.Dispatch<React.SetStateAction<boolean>>;
 }
 
-export const HelpMenu: React.FC<WorkspaceHelpSectionProps> = observer(() => {
+export const HelpMenu = observer(function HelpMenu(_props: WorkspaceHelpSectionProps) {
   // store hooks
   const { t } = useTranslation();
   const { toggleShortcutsListModal } = usePowerK();
diff --git a/apps/web/core/components/workspace/sidebar/help-section.tsx b/apps/web/core/components/workspace/sidebar/help-section.tsx
index 704085d10..758efdc66 100644
--- a/apps/web/core/components/workspace/sidebar/help-section.tsx
+++ b/apps/web/core/components/workspace/sidebar/help-section.tsx
@@ -25,7 +25,7 @@ export interface WorkspaceHelpSectionProps {
   setSidebarActive?: React.Dispatch<React.SetStateAction<boolean>>;
 }
 
-export const SidebarHelpSection: React.FC<WorkspaceHelpSectionProps> = observer(() => {
+export const SidebarHelpSection = observer(function SidebarHelpSection(_props: WorkspaceHelpSectionProps) {
   // store hooks
   const { t } = useTranslation();
   const { sidebarCollapsed: isCollapsed, toggleSidebar, sidebarPeek, toggleSidebarPeek } = useAppTheme();
diff --git a/apps/web/core/components/workspace/sidebar/help-section/root.tsx b/apps/web/core/components/workspace/sidebar/help-section/root.tsx
index 690175860..2c953e49f 100644
--- a/apps/web/core/components/workspace/sidebar/help-section/root.tsx
+++ b/apps/web/core/components/workspace/sidebar/help-section/root.tsx
@@ -17,7 +17,7 @@ import { useTransient } from "@/hooks/store/use-transient";
 // plane web components
 import { PlaneVersionNumber } from "@/plane-web/components/global";
 
-export const HelpMenuRoot = observer(() => {
+export const HelpMenuRoot = observer(function HelpMenuRoot() {
   // store hooks
   const { t } = useTranslation();
   const { toggleShortcutsListModal } = usePowerK();
diff --git a/apps/web/core/components/workspace/sidebar/project-navigation.tsx b/apps/web/core/components/workspace/sidebar/project-navigation.tsx
index 7b678e4e9..b819d6da4 100644
--- a/apps/web/core/components/workspace/sidebar/project-navigation.tsx
+++ b/apps/web/core/components/workspace/sidebar/project-navigation.tsx
@@ -35,7 +35,7 @@ type TProjectItemsProps = {
   additionalNavigationItems?: (workspaceSlug: string, projectId: string) => TNavigationItem[];
 };
 
-export const ProjectNavigation: FC<TProjectItemsProps> = observer((props) => {
+export const ProjectNavigation = observer(function ProjectNavigation(props: TProjectItemsProps) {
   const { workspaceSlug, projectId, additionalNavigationItems } = props;
   const { workItem: workItemIdentifierFromRoute } = useParams();
   // store hooks
diff --git a/apps/web/core/components/workspace/sidebar/projects-list-item.tsx b/apps/web/core/components/workspace/sidebar/projects-list-item.tsx
index 65f6c32de..6c8d82c89 100644
--- a/apps/web/core/components/workspace/sidebar/projects-list-item.tsx
+++ b/apps/web/core/components/workspace/sidebar/projects-list-item.tsx
@@ -49,7 +49,7 @@ type Props = {
   renderInExtendedSidebar?: boolean;
 };
 
-export const SidebarProjectsListItem: React.FC<Props> = observer((props) => {
+export const SidebarProjectsListItem = observer(function SidebarProjectsListItem(props: Props) {
   const {
     projectId,
     handleCopyText,
diff --git a/apps/web/core/components/workspace/sidebar/projects-list.tsx b/apps/web/core/components/workspace/sidebar/projects-list.tsx
index f3d97e968..bbd237543 100644
--- a/apps/web/core/components/workspace/sidebar/projects-list.tsx
+++ b/apps/web/core/components/workspace/sidebar/projects-list.tsx
@@ -27,7 +27,7 @@ import type { TProject } from "@/plane-web/types";
 // local imports
 import { SidebarProjectsListItem } from "./projects-list-item";
 
-export const SidebarProjectsList: FC = observer(() => {
+export const SidebarProjectsList = observer(function SidebarProjectsList() {
   // states
   const [isAllProjectsListOpen, setIsAllProjectsListOpen] = useState(true);
   const [isProjectModalOpen, setIsProjectModalOpen] = useState(false);
diff --git a/apps/web/core/components/workspace/sidebar/quick-actions.tsx b/apps/web/core/components/workspace/sidebar/quick-actions.tsx
index 06fbc190b..7d960e3d6 100644
--- a/apps/web/core/components/workspace/sidebar/quick-actions.tsx
+++ b/apps/web/core/components/workspace/sidebar/quick-actions.tsx
@@ -18,7 +18,7 @@ import useLocalStorage from "@/hooks/use-local-storage";
 // plane web components
 import { AppSearch } from "@/plane-web/components/workspace/sidebar/app-search";
 
-export const SidebarQuickActions = observer(() => {
+export const SidebarQuickActions = observer(function SidebarQuickActions() {
   const { t } = useTranslation();
   // states
   const [isDraftIssueModalOpen, setIsDraftIssueModalOpen] = useState(false);
diff --git a/apps/web/core/components/workspace/sidebar/sidebar-item.tsx b/apps/web/core/components/workspace/sidebar/sidebar-item.tsx
index 1ed760ab4..4c8b6312f 100644
--- a/apps/web/core/components/workspace/sidebar/sidebar-item.tsx
+++ b/apps/web/core/components/workspace/sidebar/sidebar-item.tsx
@@ -25,7 +25,11 @@ type Props = {
   additionalStaticItems?: string[];
 };
 
-export const SidebarItemBase: FC<Props> = observer(({ item, additionalRender, additionalStaticItems }) => {
+export const SidebarItemBase = observer(function SidebarItemBase({
+  item,
+  additionalRender,
+  additionalStaticItems,
+}: Props) {
   const { t } = useTranslation();
   const pathname = usePathname();
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/workspace/sidebar/sidebar-menu-items.tsx b/apps/web/core/components/workspace/sidebar/sidebar-menu-items.tsx
index f4e5f138c..2afb11101 100644
--- a/apps/web/core/components/workspace/sidebar/sidebar-menu-items.tsx
+++ b/apps/web/core/components/workspace/sidebar/sidebar-menu-items.tsx
@@ -22,7 +22,7 @@ import useLocalStorage from "@/hooks/use-local-storage";
 // plane-web imports
 import { SidebarItem } from "@/plane-web/components/workspace/sidebar/sidebar-item";
 
-export const SidebarMenuItems = observer(() => {
+export const SidebarMenuItems = observer(function SidebarMenuItems() {
   // routers
   const { workspaceSlug } = useParams();
   const { setValue: toggleWorkspaceMenu, storedValue: isWorkspaceMenuOpen } = useLocalStorage<boolean>(
diff --git a/apps/web/core/components/workspace/sidebar/user-menu-item.tsx b/apps/web/core/components/workspace/sidebar/user-menu-item.tsx
index d53a547b2..e3926b0fd 100644
--- a/apps/web/core/components/workspace/sidebar/user-menu-item.tsx
+++ b/apps/web/core/components/workspace/sidebar/user-menu-item.tsx
@@ -27,7 +27,7 @@ export interface SidebarUserMenuItemProps {
   draftIssueCount: number;
 }
 
-export const SidebarUserMenuItem: FC<SidebarUserMenuItemProps> = observer((props) => {
+export const SidebarUserMenuItem = observer(function SidebarUserMenuItem(props: SidebarUserMenuItemProps) {
   const { item, draftIssueCount } = props;
   // nextjs hooks
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/workspace/sidebar/user-menu-root.tsx b/apps/web/core/components/workspace/sidebar/user-menu-root.tsx
index ae2eda14b..c42f821ed 100644
--- a/apps/web/core/components/workspace/sidebar/user-menu-root.tsx
+++ b/apps/web/core/components/workspace/sidebar/user-menu-root.tsx
@@ -25,7 +25,7 @@ type Props = {
   size?: "sm" | "md";
 };
 
-export const UserMenuRoot = observer((props: Props) => {
+export const UserMenuRoot = observer(function UserMenuRoot(props: Props) {
   const { size = "sm" } = props;
   const { workspaceSlug } = useParams();
   // store hooks
diff --git a/apps/web/core/components/workspace/sidebar/user-menu.tsx b/apps/web/core/components/workspace/sidebar/user-menu.tsx
index 5d46f738e..9aa95d0c9 100644
--- a/apps/web/core/components/workspace/sidebar/user-menu.tsx
+++ b/apps/web/core/components/workspace/sidebar/user-menu.tsx
@@ -11,7 +11,7 @@ import { useUserPermissions, useUser } from "@/hooks/store/user";
 // local imports
 import { SidebarUserMenuItem } from "./user-menu-item";
 
-export const SidebarUserMenu = observer(() => {
+export const SidebarUserMenu = observer(function SidebarUserMenu() {
   const { workspaceSlug } = useParams();
   const { workspaceUserInfo } = useUserPermissions();
   const { data: currentUser } = useUser();
diff --git a/apps/web/core/components/workspace/sidebar/workspace-menu-header.tsx b/apps/web/core/components/workspace/sidebar/workspace-menu-header.tsx
index ff69427bc..cbc664ff1 100644
--- a/apps/web/core/components/workspace/sidebar/workspace-menu-header.tsx
+++ b/apps/web/core/components/workspace/sidebar/workspace-menu-header.tsx
@@ -20,7 +20,9 @@ export type SidebarWorkspaceMenuHeaderProps = {
   toggleWorkspaceMenu: (value: boolean) => void;
 };
 
-export const SidebarWorkspaceMenuHeader: FC<SidebarWorkspaceMenuHeaderProps> = observer((props) => {
+export const SidebarWorkspaceMenuHeader = observer(function SidebarWorkspaceMenuHeader(
+  props: SidebarWorkspaceMenuHeaderProps
+) {
   const { isWorkspaceMenuOpen, toggleWorkspaceMenu } = props;
   // state
   const [isMenuActive, setIsMenuActive] = useState(false);
diff --git a/apps/web/core/components/workspace/sidebar/workspace-menu-item.tsx b/apps/web/core/components/workspace/sidebar/workspace-menu-item.tsx
index 3ae8f6401..30d96569e 100644
--- a/apps/web/core/components/workspace/sidebar/workspace-menu-item.tsx
+++ b/apps/web/core/components/workspace/sidebar/workspace-menu-item.tsx
@@ -25,7 +25,9 @@ export type SidebarWorkspaceMenuItemProps = {
   };
 };
 
-export const SidebarWorkspaceMenuItem: FC<SidebarWorkspaceMenuItemProps> = observer((props) => {
+export const SidebarWorkspaceMenuItem = observer(function SidebarWorkspaceMenuItem(
+  props: SidebarWorkspaceMenuItemProps
+) {
   const { item } = props;
 
   const { t } = useTranslation();
diff --git a/apps/web/core/components/workspace/sidebar/workspace-menu-root.tsx b/apps/web/core/components/workspace/sidebar/workspace-menu-root.tsx
index e574f6e30..8776f9698 100644
--- a/apps/web/core/components/workspace/sidebar/workspace-menu-root.tsx
+++ b/apps/web/core/components/workspace/sidebar/workspace-menu-root.tsx
@@ -30,7 +30,7 @@ type WorkspaceMenuRootProps = {
   renderLogoOnly?: boolean;
 };
 
-export const WorkspaceMenuRoot = observer((props: WorkspaceMenuRootProps) => {
+export const WorkspaceMenuRoot = observer(function WorkspaceMenuRoot(props: WorkspaceMenuRootProps) {
   const { renderLogoOnly } = props;
   // store hooks
   const { toggleSidebar, toggleAnySidebarDropdown } = useAppTheme();
diff --git a/apps/web/core/components/workspace/sidebar/workspace-menu.tsx b/apps/web/core/components/workspace/sidebar/workspace-menu.tsx
index dd2238a8b..fe41fddf9 100644
--- a/apps/web/core/components/workspace/sidebar/workspace-menu.tsx
+++ b/apps/web/core/components/workspace/sidebar/workspace-menu.tsx
@@ -13,7 +13,7 @@ import useLocalStorage from "@/hooks/use-local-storage";
 import { SidebarWorkspaceMenuHeader } from "./workspace-menu-header";
 import { SidebarWorkspaceMenuItem } from "./workspace-menu-item";
 
-export const SidebarWorkspaceMenu = observer(() => {
+export const SidebarWorkspaceMenu = observer(function SidebarWorkspaceMenu() {
   // router params
   const { workspaceSlug } = useParams();
   // local storage
diff --git a/apps/web/core/components/workspace/views/default-view-list-item.tsx b/apps/web/core/components/workspace/views/default-view-list-item.tsx
index 536d7ff8a..fdb1377df 100644
--- a/apps/web/core/components/workspace/views/default-view-list-item.tsx
+++ b/apps/web/core/components/workspace/views/default-view-list-item.tsx
@@ -7,7 +7,7 @@ import { truncateText } from "@plane/utils";
 
 type Props = { view: { key: string; i18n_label: string } };
 
-export const GlobalDefaultViewListItem: React.FC<Props> = observer((props) => {
+export const GlobalDefaultViewListItem = observer(function GlobalDefaultViewListItem(props: Props) {
   const { view } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/components/workspace/views/default-view-quick-action.tsx b/apps/web/core/components/workspace/views/default-view-quick-action.tsx
index 203de8377..026d85ba9 100644
--- a/apps/web/core/components/workspace/views/default-view-quick-action.tsx
+++ b/apps/web/core/components/workspace/views/default-view-quick-action.tsx
@@ -19,7 +19,7 @@ type Props = {
   };
 };
 
-export const DefaultWorkspaceViewQuickActions: React.FC<Props> = observer((props) => {
+export const DefaultWorkspaceViewQuickActions = observer(function DefaultWorkspaceViewQuickActions(props: Props) {
   const { workspaceSlug, view } = props;
 
   const { t } = useTranslation();
diff --git a/apps/web/core/components/workspace/views/delete-view-modal.tsx b/apps/web/core/components/workspace/views/delete-view-modal.tsx
index 75c8e32e1..bfaf144ad 100644
--- a/apps/web/core/components/workspace/views/delete-view-modal.tsx
+++ b/apps/web/core/components/workspace/views/delete-view-modal.tsx
@@ -21,7 +21,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const DeleteGlobalViewModal: React.FC<Props> = observer((props) => {
+export const DeleteGlobalViewModal = observer(function DeleteGlobalViewModal(props: Props) {
   const { data, isOpen, onClose } = props;
   // states
   const [isDeleteLoading, setIsDeleteLoading] = useState(false);
diff --git a/apps/web/core/components/workspace/views/form.tsx b/apps/web/core/components/workspace/views/form.tsx
index a97d15ef8..44665fa0a 100644
--- a/apps/web/core/components/workspace/views/form.tsx
+++ b/apps/web/core/components/workspace/views/form.tsx
@@ -36,7 +36,7 @@ const DEFAULT_VALUES: Partial<IWorkspaceView> = {
   }),
 };
 
-export const WorkspaceViewForm: React.FC<Props> = observer((props) => {
+export const WorkspaceViewForm = observer(function WorkspaceViewForm(props: Props) {
   const { handleFormSubmit, handleClose, data, preLoadedData, workspaceSlug } = props;
   // i18n
   const { t } = useTranslation();
diff --git a/apps/web/core/components/workspace/views/header.tsx b/apps/web/core/components/workspace/views/header.tsx
index 0b76e0869..155744f22 100644
--- a/apps/web/core/components/workspace/views/header.tsx
+++ b/apps/web/core/components/workspace/views/header.tsx
@@ -22,7 +22,7 @@ import { DefaultWorkspaceViewQuickActions } from "./default-view-quick-action";
 import { CreateUpdateWorkspaceViewModal } from "./modal";
 import { WorkspaceViewQuickActions } from "./quick-action";
 
-const ViewTab = observer((props: { viewId: string }) => {
+const ViewTab = observer(function ViewTab(props: { viewId: string }) {
   const { viewId } = props;
   // refs
   const parentRef = useRef<HTMLDivElement>(null);
@@ -42,12 +42,12 @@ const ViewTab = observer((props: { viewId: string }) => {
   );
 });
 
-const DefaultViewTab = (props: {
+function DefaultViewTab(props: {
   tab: {
     key: TStaticViewTypes;
     i18n_label: string;
   };
-}) => {
+}) {
   const { tab } = props;
   // refs
   const parentRef = useRef<HTMLDivElement>(null);
@@ -60,9 +60,9 @@ const DefaultViewTab = (props: {
       <DefaultWorkspaceViewQuickActions workspaceSlug={workspaceSlug?.toString()} view={tab} />
     </div>
   );
-};
+}
 
-export const GlobalViewsHeader: React.FC = observer(() => {
+export const GlobalViewsHeader = observer(function GlobalViewsHeader() {
   // states
   const [createViewModal, setCreateViewModal] = useState(false);
   const containerRef = useRef<HTMLDivElement>(null);
diff --git a/apps/web/core/components/workspace/views/modal.tsx b/apps/web/core/components/workspace/views/modal.tsx
index 77bad27ab..92e7d647c 100644
--- a/apps/web/core/components/workspace/views/modal.tsx
+++ b/apps/web/core/components/workspace/views/modal.tsx
@@ -25,7 +25,7 @@ type Props = {
   preLoadedData?: Partial<IWorkspaceView>;
 };
 
-export const CreateUpdateWorkspaceViewModal: React.FC<Props> = observer((props) => {
+export const CreateUpdateWorkspaceViewModal = observer(function CreateUpdateWorkspaceViewModal(props: Props) {
   const { isOpen, onClose, data, preLoadedData } = props;
   // router
   const router = useAppRouter();
diff --git a/apps/web/core/components/workspace/views/quick-action.tsx b/apps/web/core/components/workspace/views/quick-action.tsx
index 7998e7255..131fdda96 100644
--- a/apps/web/core/components/workspace/views/quick-action.tsx
+++ b/apps/web/core/components/workspace/views/quick-action.tsx
@@ -23,7 +23,7 @@ type Props = {
   view: IWorkspaceView;
 };
 
-export const WorkspaceViewQuickActions: React.FC<Props> = observer((props) => {
+export const WorkspaceViewQuickActions = observer(function WorkspaceViewQuickActions(props: Props) {
   const { workspaceSlug, view } = props;
   // states
   const [updateViewModal, setUpdateViewModal] = useState(false);
diff --git a/apps/web/core/components/workspace/views/view-list-item.tsx b/apps/web/core/components/workspace/views/view-list-item.tsx
index 1f1d11c6c..da4f56585 100644
--- a/apps/web/core/components/workspace/views/view-list-item.tsx
+++ b/apps/web/core/components/workspace/views/view-list-item.tsx
@@ -19,7 +19,7 @@ import { CreateUpdateWorkspaceViewModal } from "./modal";
 
 type Props = { viewId: string };
 
-export const GlobalViewListItem: React.FC<Props> = observer((props) => {
+export const GlobalViewListItem = observer(function GlobalViewListItem(props: Props) {
   const { viewId } = props;
   // states
   const [updateViewModal, setUpdateViewModal] = useState(false);
diff --git a/apps/web/core/components/workspace/views/views-list.tsx b/apps/web/core/components/workspace/views/views-list.tsx
index b6c2d6aef..6adb4e428 100644
--- a/apps/web/core/components/workspace/views/views-list.tsx
+++ b/apps/web/core/components/workspace/views/views-list.tsx
@@ -12,7 +12,7 @@ type Props = {
   searchQuery: string;
 };
 
-export const GlobalViewsList: React.FC<Props> = observer((props) => {
+export const GlobalViewsList = observer(function GlobalViewsList(props: Props) {
   const { searchQuery } = props;
   // router
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/constants/plans.tsx b/apps/web/core/constants/plans.tsx
index 717e2ac7d..5277bda04 100644
--- a/apps/web/core/constants/plans.tsx
+++ b/apps/web/core/constants/plans.tsx
@@ -45,20 +45,22 @@ type PlanePlans = {
   planComparison: TPlansComparisonDetails[];
 };
 
-const RiDiscordFill = ({ className }: { className?: string }) => (
-  <DiscordIcon className={cn(className, "size-5 text-custom-text-200")} />
-);
+function RiDiscordFill({ className }: { className?: string }) {
+  return <DiscordIcon className={cn(className, "size-5 text-custom-text-200")} />;
+}
 
-export const ComingSoonBadge = ({ className }: { className?: string }) => (
-  <span
-    className={cn(
-      "bg-[#3f76ff] text-white font-semibold text-[8px] py-0.5 px-1.5 w-fit whitespace-nowrap rounded",
-      className
-    )}
-  >
-    COMING SOON
-  </span>
-);
+export function ComingSoonBadge({ className }: { className?: string }) {
+  return (
+    <span
+      className={cn(
+        "bg-[#3f76ff] text-white font-semibold text-[8px] py-0.5 px-1.5 w-fit whitespace-nowrap rounded",
+        className
+      )}
+    >
+      COMING SOON
+    </span>
+  );
+}
 
 export const PLANS_LIST: TPlanePlans[] = ["free", "one", "pro", "business", "enterprise"];
 
diff --git a/apps/web/core/hooks/context/app-rail-context.tsx b/apps/web/core/hooks/context/app-rail-context.tsx
index 7303a5201..ce7d90762 100644
--- a/apps/web/core/hooks/context/app-rail-context.tsx
+++ b/apps/web/core/hooks/context/app-rail-context.tsx
@@ -21,7 +21,7 @@ interface AppRailProviderProps {
   children: ReactNode;
 }
 
-export const AppRailProvider = observer(({ children }: AppRailProviderProps) => {
+export const AppRailProvider = observer(function AppRailProvider({ children }: AppRailProviderProps) {
   const { workspaceSlug } = useParams();
   const { storedValue: isAppRailVisible, setValue: setIsAppRailVisible } = useLocalStorage<boolean>(
     `APP_RAIL_${workspaceSlug}`,
diff --git a/apps/web/core/hooks/use-realtime-page-events.tsx b/apps/web/core/hooks/use-realtime-page-events.tsx
index 630c89954..452fe0c64 100644
--- a/apps/web/core/hooks/use-realtime-page-events.tsx
+++ b/apps/web/core/hooks/use-realtime-page-events.tsx
@@ -60,48 +60,50 @@ export const useRealtimePageEvents = ({
     [getUserDetails]
   );
 
-  const ACTION_HANDLERS = useMemo<
-    Partial<{
-      [K in keyof EventToPayloadMap]: PageUpdateHandler<K>;
-    }>
-  >(
-    () => ({
+  const ACTION_HANDLERS = useMemo(function ACTION_HANDLERS() {
+    return {
       archived: ({ pageIds, data }) => {
         pageIds.forEach((pageId) => {
           const pageItem = getPageById(pageId);
           if (pageItem) pageItem.archive({ archived_at: data.archived_at, shouldSync: false });
         });
       },
+
       unarchived: ({ pageIds }) => {
         pageIds.forEach((pageId) => {
           const pageItem = getPageById(pageId);
           if (pageItem) pageItem.restore({ shouldSync: false });
         });
       },
+
       locked: ({ pageIds }) => {
         pageIds.forEach((pageId) => {
           const pageItem = getPageById(pageId);
           if (pageItem) pageItem.lock({ shouldSync: false, recursive: false });
         });
       },
+
       unlocked: ({ pageIds }) => {
         pageIds.forEach((pageId) => {
           const pageItem = getPageById(pageId);
           if (pageItem) pageItem.unlock({ shouldSync: false, recursive: false });
         });
       },
+
       "made-public": ({ pageIds }) => {
         pageIds.forEach((pageId) => {
           const pageItem = getPageById(pageId);
           if (pageItem) pageItem.makePublic({ shouldSync: false });
         });
       },
+
       "made-private": ({ pageIds }) => {
         pageIds.forEach((pageId) => {
           const pageItem = getPageById(pageId);
           if (pageItem) pageItem.makePrivate({ shouldSync: false });
         });
       },
+
       deleted: ({ pageIds, data }) => {
         pageIds.forEach((pageId) => {
           const pageItem = getPageById(pageId);
@@ -120,6 +122,7 @@ export const useRealtimePageEvents = ({
           }
         });
       },
+
       property_updated: ({ pageIds, data }) => {
         pageIds.forEach((pageId) => {
           const pageInstance = getPageById(pageId);
@@ -128,6 +131,7 @@ export const useRealtimePageEvents = ({
           pageInstance?.mutateProperties(rest);
         });
       },
+
       error: ({ pageIds, data }) => {
         const errorType = data.error_type;
         const errorMessage = data.error_message || "An error occurred";
@@ -158,10 +162,10 @@ export const useRealtimePageEvents = ({
           }
         }
       },
+
       ...customRealtimeEventHandlers,
-    }),
-    [getPageById, page, router, getUserDisplayText, removePage, currentUser, customRealtimeEventHandlers, handlers]
-  );
+    };
+  });
 
   // The main function that will be returned from this hook
   const updatePageProperties = useCallback(
diff --git a/apps/web/core/layouts/auth-layout/project-wrapper.tsx b/apps/web/core/layouts/auth-layout/project-wrapper.tsx
index 3ed74d0bd..44524960e 100644
--- a/apps/web/core/layouts/auth-layout/project-wrapper.tsx
+++ b/apps/web/core/layouts/auth-layout/project-wrapper.tsx
@@ -44,7 +44,7 @@ interface IProjectAuthWrapper {
   isLoading?: boolean;
 }
 
-export const ProjectAuthWrapper: FC<IProjectAuthWrapper> = observer((props) => {
+export const ProjectAuthWrapper = observer(function ProjectAuthWrapper(props: IProjectAuthWrapper) {
   const { workspaceSlug, projectId, children, isLoading: isParentLoading = false } = props;
   // plane hooks
   const { t } = useTranslation();
diff --git a/apps/web/core/layouts/auth-layout/workspace-wrapper.tsx b/apps/web/core/layouts/auth-layout/workspace-wrapper.tsx
index a484bce97..db73b5fee 100644
--- a/apps/web/core/layouts/auth-layout/workspace-wrapper.tsx
+++ b/apps/web/core/layouts/auth-layout/workspace-wrapper.tsx
@@ -41,7 +41,7 @@ interface IWorkspaceAuthWrapper {
   isLoading?: boolean;
 }
 
-export const WorkspaceAuthWrapper: FC<IWorkspaceAuthWrapper> = observer((props) => {
+export const WorkspaceAuthWrapper = observer(function WorkspaceAuthWrapper(props: IWorkspaceAuthWrapper) {
   const { children, isLoading: isParentLoading = false } = props;
   // router params
   const { workspaceSlug } = useParams();
diff --git a/apps/web/core/layouts/default-layout/index.tsx b/apps/web/core/layouts/default-layout/index.tsx
index aca10dde5..22e9bd946 100644
--- a/apps/web/core/layouts/default-layout/index.tsx
+++ b/apps/web/core/layouts/default-layout/index.tsx
@@ -7,10 +7,12 @@ type Props = {
   className?: string;
 };
 
-const DefaultLayout: FC<Props> = ({ children, gradient = false, className }) => (
-  <div className={cn(`h-screen w-full overflow-hidden ${gradient ? "" : "bg-custom-background-100"}`, className)}>
-    {children}
-  </div>
-);
+function DefaultLayout({ children, gradient = false, className }: Props) {
+  return (
+    <div className={cn(`h-screen w-full overflow-hidden ${gradient ? "" : "bg-custom-background-100"}`, className)}>
+      {children}
+    </div>
+  );
+}
 
 export default DefaultLayout;
diff --git a/apps/web/core/lib/intercom-provider.tsx b/apps/web/core/lib/intercom-provider.tsx
index c302a0d84..ad077b334 100644
--- a/apps/web/core/lib/intercom-provider.tsx
+++ b/apps/web/core/lib/intercom-provider.tsx
@@ -13,7 +13,7 @@ export type IntercomProviderProps = {
   children: React.ReactNode;
 };
 
-const IntercomProvider: FC<IntercomProviderProps> = observer((props) => {
+const IntercomProvider = observer(function IntercomProvider(props: IntercomProviderProps) {
   const { children } = props;
   // hooks
   const { data: user } = useUser();
diff --git a/apps/web/core/lib/posthog-provider.tsx b/apps/web/core/lib/posthog-provider.tsx
index 84d65a172..a3df44d23 100644
--- a/apps/web/core/lib/posthog-provider.tsx
+++ b/apps/web/core/lib/posthog-provider.tsx
@@ -16,13 +16,15 @@ import { useInstance } from "@/hooks/store/use-instance";
 import { useWorkspace } from "@/hooks/store/use-workspace";
 import { useUser, useUserPermissions } from "@/hooks/store/user";
 // dynamic imports
-const PostHogPageView = lazy(() => import("@/lib/posthog-view"));
+const PostHogPageView = lazy(function PostHogPageView() {
+  return import("@/lib/posthog-view");
+});
 
 export interface IPosthogWrapper {
   children: ReactNode;
 }
 
-const PostHogProvider: FC<IPosthogWrapper> = observer((props) => {
+const PostHogProvider = observer(function PostHogProvider(props: IPosthogWrapper) {
   const { children } = props;
   const { data: user } = useUser();
   const { currentWorkspace } = useWorkspace();
diff --git a/apps/web/core/lib/store-context.tsx b/apps/web/core/lib/store-context.tsx
index dde0269ee..893674be9 100644
--- a/apps/web/core/lib/store-context.tsx
+++ b/apps/web/core/lib/store-context.tsx
@@ -18,6 +18,6 @@ const initializeStore = () => {
 
 export const store = initializeStore();
 
-export const StoreProvider = ({ children }: { children: ReactElement }) => (
-  <StoreContext.Provider value={store}>{children}</StoreContext.Provider>
-);
+export function StoreProvider({ children }: { children: ReactElement }) {
+  return <StoreContext.Provider value={store}>{children}</StoreContext.Provider>;
+}
diff --git a/apps/web/core/lib/wrappers/authentication-wrapper.tsx b/apps/web/core/lib/wrappers/authentication-wrapper.tsx
index c8802b311..711d7431a 100644
--- a/apps/web/core/lib/wrappers/authentication-wrapper.tsx
+++ b/apps/web/core/lib/wrappers/authentication-wrapper.tsx
@@ -25,7 +25,7 @@ const isValidURL = (url: string): boolean => {
   return !disallowedSchemes.test(url);
 };
 
-export const AuthenticationWrapper: FC<TAuthenticationWrapper> = observer((props) => {
+export const AuthenticationWrapper = observer(function AuthenticationWrapper(props: TAuthenticationWrapper) {
   const pathname = usePathname();
   const router = useAppRouter();
   const searchParams = useSearchParams();
diff --git a/apps/web/core/lib/wrappers/instance-wrapper.tsx b/apps/web/core/lib/wrappers/instance-wrapper.tsx
index 5f2590034..5f52baf75 100644
--- a/apps/web/core/lib/wrappers/instance-wrapper.tsx
+++ b/apps/web/core/lib/wrappers/instance-wrapper.tsx
@@ -11,7 +11,7 @@ type TInstanceWrapper = {
   children: ReactNode;
 };
 
-export const InstanceWrapper: FC<TInstanceWrapper> = observer((props) => {
+export const InstanceWrapper = observer(function InstanceWrapper(props: TInstanceWrapper) {
   const { children } = props;
   // store
   const { isLoading, instance, error, fetchInstanceInfo } = useInstance();
diff --git a/apps/web/core/lib/wrappers/store-wrapper.tsx b/apps/web/core/lib/wrappers/store-wrapper.tsx
index a2681c9af..9349f90f6 100644
--- a/apps/web/core/lib/wrappers/store-wrapper.tsx
+++ b/apps/web/core/lib/wrappers/store-wrapper.tsx
@@ -16,7 +16,7 @@ type TStoreWrapper = {
   children: ReactNode;
 };
 
-const StoreWrapper: FC<TStoreWrapper> = observer((props) => {
+const StoreWrapper = observer(function StoreWrapper(props: TStoreWrapper) {
   const { children } = props;
   // theme
   const { setTheme } = useTheme();
diff --git a/apps/web/ee/components/home/header.tsx b/apps/web/ee/components/home/header.tsx
index c95736c9e..ac905596e 100644
--- a/apps/web/ee/components/home/header.tsx
+++ b/apps/web/ee/components/home/header.tsx
@@ -1 +1,3 @@
-export const HomePageHeader = () => <></>;
+export function HomePageHeader() {
+  return <></>;
+}
diff --git a/packages/codemods/.prettierrc b/packages/codemods/.prettierrc
new file mode 100644
index 000000000..ed8d93ee4
--- /dev/null
+++ b/packages/codemods/.prettierrc
@@ -0,0 +1,5 @@
+{
+  "printWidth": 80,
+  "tabWidth": 2,
+  "trailingComma": "es5"
+}
\ No newline at end of file
diff --git a/packages/codemods/function-declaration.ts b/packages/codemods/function-declaration.ts
new file mode 100644
index 000000000..496f15ca2
--- /dev/null
+++ b/packages/codemods/function-declaration.ts
@@ -0,0 +1,483 @@
+import {
+  API,
+  FileInfo,
+  Options,
+  TSTypeReference,
+  JSCodeshift,
+  Identifier,
+  BlockStatement,
+  VariableDeclarator,
+  Expression,
+  Pattern,
+  SpreadElement,
+  JSXNamespacedName,
+  ASTNode,
+  Node,
+  FunctionDeclaration,
+} from "jscodeshift";
+
+const COMPONENT_TYPE_NAMES = new Set([
+  "FC",
+  "FunctionComponent",
+  "VFC",
+  "VoidFunctionComponent",
+]);
+
+const COMPONENT_NAME_PATTERN = /^[A-Z]/;
+
+function isReactComponentType(typeReference: TSTypeReference, j: JSCodeshift) {
+  const typeName = typeReference.typeName;
+
+  if (!typeName) {
+    return false;
+  }
+
+  if (j.Identifier.check(typeName)) {
+    return COMPONENT_TYPE_NAMES.has(typeName.name);
+  }
+
+  if (
+    j.TSQualifiedName.check(typeName) &&
+    j.Identifier.check(typeName.left) &&
+    j.Identifier.check(typeName.right)
+  ) {
+    return (
+      typeName.left.name === "React" &&
+      COMPONENT_TYPE_NAMES.has(typeName.right.name)
+    );
+  }
+
+  return false;
+}
+
+function isComponentNameIdentifier(identifier: Identifier | null | undefined) {
+  if (!identifier) {
+    return false;
+  }
+
+  return COMPONENT_NAME_PATTERN.test(identifier.name);
+}
+
+function addComments(target: Node, comments: NonNullable<Node["comments"]>) {
+  if (!comments || comments.length === 0) {
+    return;
+  }
+  target.comments ||= [];
+  target.comments.push(...comments);
+}
+
+function copyOuterComments(source: Node, target: Node, j: JSCodeshift) {
+  if (!j.Node.check(source) || !j.Node.check(target) || !source.comments) {
+    return;
+  }
+  const outerComments = source.comments.filter((c) => c.leading || c.trailing);
+  addComments(target, outerComments);
+}
+
+function ensureParamType(
+  param: Pattern,
+  propsType: ASTNode | null | undefined,
+  j: JSCodeshift
+) {
+  if (!j.Pattern.check(param)) {
+    return;
+  }
+
+  if (!("typeAnnotation" in param)) {
+    return;
+  }
+
+  if (!propsType) {
+    return;
+  }
+
+  if (j.TSTypeReference.check(propsType) && propsType.typeName) {
+    param.typeAnnotation = j.tsTypeAnnotation(
+      propsType.typeParameters
+        ? j.tsTypeReference(propsType.typeName, propsType.typeParameters)
+        : j.tsTypeReference(propsType.typeName)
+    );
+    return;
+  }
+
+  if (j.TSType.check(propsType)) {
+    // @ts-expect-error: jscodeshift types are too strict here
+    param.typeAnnotation = j.tsTypeAnnotation(propsType);
+  }
+}
+
+function toBlockBody(j: JSCodeshift, body: BlockStatement | Expression) {
+  if (j.BlockStatement.check(body)) {
+    return body;
+  }
+
+  // @ts-expect-error: jscodeshift types are too strict here
+  const returnStatement = j.returnStatement(body);
+
+  return j.blockStatement([returnStatement]);
+}
+
+function isFunction(node: Node, j: JSCodeshift) {
+  return (
+    j.ArrowFunctionExpression.check(node) || j.FunctionExpression.check(node)
+  );
+}
+
+function extractArrowFunction(
+  init: Expression | SpreadElement | JSXNamespacedName,
+  j: JSCodeshift
+) {
+  if (isFunction(init, j)) {
+    return init;
+  }
+
+  // If it's a CallExpression like observer(() => {}), extract the arrow function
+  if (j.CallExpression.check(init)) {
+    const firstArg = init.arguments?.[0];
+    if (firstArg && isFunction(firstArg, j)) {
+      return firstArg;
+    }
+  }
+
+  return;
+}
+
+function extractPropsTypeFromWrapper(
+  init: Expression | SpreadElement | JSXNamespacedName,
+  j: JSCodeshift
+) {
+  // If it's a CallExpression like observer<React.FC<Props>>((props) => {})
+  // Extract the Props type from React.FC<Props>
+  if (!j.CallExpression.check(init)) {
+    return;
+  }
+
+  if (!("typeParameters" in init)) {
+    return;
+  }
+
+  const typeParameters = init.typeParameters;
+  if (!j.TSTypeParameterInstantiation.check(typeParameters)) {
+    return;
+  }
+
+  const typeParam = typeParameters.params?.[0];
+  if (
+    !j.TSTypeReference.check(typeParam) ||
+    !isReactComponentType(typeParam, j)
+  ) {
+    return;
+  }
+
+  // Extract the generic type from React.FC<PropsType>
+  return typeParam.typeParameters?.params?.[0];
+}
+
+function isReactForwardRef(
+  init: Expression | SpreadElement | JSXNamespacedName,
+  j: JSCodeshift
+) {
+  if (!j.CallExpression.check(init)) {
+    return false;
+  }
+
+  const callee = init.callee;
+
+  // Check for React.forwardRef
+  if (
+    j.MemberExpression.check(callee) &&
+    j.Identifier.check(callee.object) &&
+    j.Identifier.check(callee.property)
+  ) {
+    return (
+      callee.object.name === "React" && callee.property.name === "forwardRef"
+    );
+  }
+
+  // Check for forwardRef (imported directly)
+  if (j.Identifier.check(callee)) {
+    return callee.name === "forwardRef";
+  }
+
+  return false;
+}
+
+function extractForwardRefTypes(
+  init: Expression | SpreadElement | JSXNamespacedName,
+  j: JSCodeshift
+) {
+  if (!isReactForwardRef(init, j)) {
+    return;
+  }
+
+  if (!("typeParameters" in init)) {
+    return;
+  }
+
+  const typeParameters = init.typeParameters;
+
+  // If no type parameters, we still want to apply default empty object for props
+  if (
+    !j.TSTypeParameterInstantiation.check(typeParameters) ||
+    typeParameters.params.length === 0
+  ) {
+    return; // Let the default props type handling take care of it
+  }
+
+  const typeParams = typeParameters.params;
+
+  // React.forwardRef<ElementType, PropsType>
+  // If PropsType is not specified, use Record<string, unknown> to avoid ESLint errors
+  const [elementType] = typeParams;
+
+  if (!elementType) {
+    return;
+  }
+
+  const propsType =
+    typeParams.length >= 2 && typeParams[1]
+      ? typeParams[1]
+      : j.tsTypeReference(
+          j.identifier("Record"),
+          j.tsTypeParameterInstantiation([
+            j.tsStringKeyword(),
+            j.tsUnknownKeyword(),
+          ])
+        );
+
+  // Create React.ForwardedRef<ElementType> for the ref parameter
+  const refType = j.tsTypeReference(
+    j.tsQualifiedName(j.identifier("React"), j.identifier("ForwardedRef")),
+    j.tsTypeParameterInstantiation([elementType])
+  );
+
+  return { propsType, refType };
+}
+
+function isEmptyObjectType(type: ASTNode, j: JSCodeshift) {
+  return j.TSTypeLiteral.check(type) && type.members.length === 0;
+}
+
+function convertToFunction(
+  j: JSCodeshift,
+  declaration: VariableDeclarator,
+  init: Expression | SpreadElement | JSXNamespacedName,
+  propsType: ASTNode | null | undefined
+) {
+  if (!j.Identifier.check(declaration.id)) {
+    throw new Error("Declaration id must be an identifier");
+  }
+  const componentName = declaration.id.name;
+  const arrowFn = extractArrowFunction(init, j);
+
+  if (!arrowFn) {
+    throw new Error("Expected ArrowFunctionExpression or FunctionExpression");
+  }
+
+  const params = arrowFn.params;
+  const body = toBlockBody(j, arrowFn.body);
+
+  const newFunction = j.functionDeclaration(
+    j.identifier(componentName),
+    params,
+    body
+  );
+
+  // Check if this is React.forwardRef and extract types for props and ref
+  const forwardRefTypes = extractForwardRefTypes(init, j);
+
+  if (forwardRefTypes) {
+    // Apply props type to first parameter
+    const [firstParam, secondParam] = newFunction.params;
+    if (j.Pattern.check(firstParam) && "typeAnnotation" in firstParam) {
+      ensureParamType(firstParam, forwardRefTypes.propsType, j);
+    }
+    // Apply ref type to second parameter
+    if (j.Pattern.check(secondParam) && "typeAnnotation" in secondParam) {
+      ensureParamType(secondParam, forwardRefTypes.refType, j);
+    }
+  } else if (newFunction.params.length > 0) {
+    const [firstParam] = newFunction.params;
+    if (firstParam) {
+      ensureParamType(firstParam, propsType, j);
+    }
+  } else if (propsType && !isEmptyObjectType(propsType, j)) {
+    // If there are no params but a non-empty propsType exists, add _props parameter
+    const propsParam = j.identifier("_props");
+    ensureParamType(propsParam, propsType, j);
+    newFunction.params.push(propsParam);
+  }
+
+  if (arrowFn.returnType) {
+    newFunction.returnType = arrowFn.returnType;
+  }
+
+  // Preserve type parameters (generics) from arrow function
+  if (arrowFn.typeParameters) {
+    newFunction.typeParameters = arrowFn.typeParameters;
+  }
+
+  newFunction.async = arrowFn.async;
+  newFunction.generator = arrowFn.generator;
+
+  return newFunction;
+}
+
+function containsJsx(j: JSCodeshift, body: ASTNode) {
+  return (
+    j(body).find(j.JSXElement).paths().length > 0 ||
+    j(body).find(j.JSXFragment).paths().length > 0
+  );
+}
+
+function toFunctionExpression(
+  j: JSCodeshift,
+  declaration: FunctionDeclaration
+) {
+  const expression = j.functionExpression(
+    declaration.id,
+    declaration.params,
+    declaration.body,
+    declaration.generator,
+    declaration.async
+  );
+  expression.returnType = declaration.returnType;
+  expression.typeParameters = declaration.typeParameters;
+  return expression;
+}
+
+export default function transform(file: FileInfo, api: API, options: Options) {
+  const baseJ = api.jscodeshift;
+  const j =
+    typeof baseJ.withParser === "function" ? baseJ.withParser("tsx") : baseJ;
+  const root = j(file.source);
+
+  root
+    .find(j.VariableDeclaration)
+    .filter((path) => {
+      const [firstDeclaration] = path.node.declarations;
+
+      if (!j.VariableDeclarator.check(firstDeclaration)) {
+        return false;
+      }
+
+      if (
+        !j.Identifier.check(firstDeclaration.id) ||
+        !isComponentNameIdentifier(firstDeclaration.id)
+      ) {
+        return false;
+      }
+
+      const init = firstDeclaration.init;
+
+      if (!init) {
+        return false;
+      }
+
+      const functionToCheck = extractArrowFunction(init, j);
+
+      if (!functionToCheck) {
+        return false;
+      }
+
+      if (file.path && !file.path.endsWith(".tsx")) {
+        if (!containsJsx(j, functionToCheck)) {
+          return false;
+        }
+      }
+
+      return true;
+    })
+    .forEach((path) => {
+      const [firstDeclaration] = path.node.declarations;
+      if (!j.VariableDeclarator.check(firstDeclaration)) {
+        return;
+      }
+      const init = firstDeclaration.init;
+
+      if (!init) {
+        return;
+      }
+
+      let typeAnnotation: ASTNode | null | undefined;
+      if (j.Identifier.check(firstDeclaration.id)) {
+        typeAnnotation = firstDeclaration.id.typeAnnotation?.typeAnnotation;
+      }
+
+      // Try to get props type from variable type annotation first
+      let propsType: ASTNode | undefined =
+        j.TSTypeReference.check(typeAnnotation) &&
+        isReactComponentType(typeAnnotation, j)
+          ? typeAnnotation.typeParameters?.params?.[0]
+          : undefined;
+
+      // If no props type from variable annotation, try to extract from wrapper's type parameters
+      if (!propsType) {
+        propsType = extractPropsTypeFromWrapper(init, j);
+      }
+
+      const newFunction = convertToFunction(
+        j,
+        firstDeclaration,
+        init,
+        propsType
+      );
+
+      const originalNode = path.node;
+
+      // Check if init is wrapped in a call expression (e.g., observer(...))
+      const hasWrapper = j.CallExpression.check(init);
+
+      if (hasWrapper) {
+        // Preserve the wrapper by keeping it as a const assignment
+        // e.g., export const Foo = observer(() => {}) becomes export const Foo = observer(function Foo() {...})
+
+        // Convert function declaration to function expression for wrapping
+        const functionExpression = toFunctionExpression(j, newFunction);
+
+        const wrappedFunction = j.callExpression(init.callee, [
+          functionExpression,
+        ]);
+
+        if (!j.Identifier.check(firstDeclaration.id)) {
+          return;
+        }
+
+        const newDeclarator = j.variableDeclarator(
+          j.identifier(firstDeclaration.id.name),
+          wrappedFunction
+        );
+
+        const newVarDecl = j.variableDeclaration("const", [newDeclarator]);
+
+        // Copy comments from original declaration to new function
+        copyOuterComments(originalNode, newVarDecl, j);
+
+        j(path).replaceWith(newVarDecl);
+        return;
+      }
+
+      // Copy outer comments from original declaration to new function
+      copyOuterComments(originalNode, newFunction, j);
+
+      // Copy comments from VariableDeclarator (e.g. export /* comment */ const Foo)
+      if (firstDeclaration.comments) {
+        addComments(newFunction, firstDeclaration.comments);
+      }
+
+      // Copy comments from arrow function
+      if (init.comments) {
+        addComments(newFunction, init.comments);
+      }
+
+      j(path).replaceWith(newFunction);
+    });
+
+  const quote = options.quote ?? '"';
+
+  const source = root.toSource({
+    quote,
+  });
+
+  return source;
+}
diff --git a/packages/codemods/instructions.md b/packages/codemods/instructions.md
new file mode 100644
index 000000000..4848c203a
--- /dev/null
+++ b/packages/codemods/instructions.md
@@ -0,0 +1,366 @@
+# jscodeshift Instructions
+
+## API Reference
+
+### Core API
+
+#### `jscodeshift`
+
+The main function that returns the jscodeshift instance.
+
+- **Parameters**: `source` (String)
+- **Example**:
+  ```javascript
+  const j = jscodeshift(sourceCode);
+  ```
+
+### Node Traversal APIs
+
+#### `find`
+
+Finds nodes that match the provided type.
+
+- **Parameters**: `type` (String or Function)
+- **Example**:
+  ```javascript
+  const variableDeclarations = j.find(j.VariableDeclaration);
+  ```
+
+#### `findImportDeclarations`
+
+Finds all ImportDeclarations optionally filtered by name.
+
+- **Parameters**: `sourcePath` (String)
+- **Example**:
+  ```javascript
+  const routerImports = j.findImportDeclarations("react-router-dom");
+  ```
+
+#### `closestScope`
+
+Finds the closest enclosing scope of a node.
+
+- **Example**:
+  ```javascript
+  const closestScopes = j.find(j.Identifier).closestScope();
+  ```
+
+#### `closest`
+
+Finds the nearest parent node that matches the specified type.
+
+- **Parameters**: `type` (String or Function)
+- **Example**:
+  ```javascript
+  const closestFunction = j.find(j.Identifier).closest(j.FunctionDeclaration);
+  ```
+
+#### `getVariableDeclarators`
+
+Retrieves variable declarators from the current collection.
+
+- **Parameters**: `callback` (Function)
+- **Example**:
+  ```javascript
+  const variableDeclarators = j.find(j.Identifier).getVariableDeclarators((path) => path.value.name);
+  ```
+
+#### `findVariableDeclarators`
+
+Finds variable declarators by name.
+
+- **Parameters**: `name` (String)
+- **Example**:
+  ```javascript
+  const variableDeclarators = j.findVariableDeclarators("a");
+  ```
+
+#### `filter`
+
+Filters nodes based on a predicate function.
+
+- **Parameters**: `predicate` (Function)
+- **Example**:
+  ```javascript
+  const constDeclarations = j.find(j.VariableDeclaration).filter((path) => path.node.kind === "const");
+  ```
+
+#### `forEach`
+
+Iterates over each node in the collection.
+
+- **Parameters**: `callback` (Function)
+- **Example**:
+  ```javascript
+  j.find(j.VariableDeclaration).forEach((path) => {
+    console.log(path.node);
+  });
+  ```
+
+#### `some`
+
+Checks if at least one element in the collection passes the test.
+
+- **Parameters**: `callback` (Function)
+- **Example**:
+  ```javascript
+  const hasVariableA = root.find(j.VariableDeclarator).some((path) => path.node.id.name === "a");
+  ```
+
+#### `every`
+
+Checks if all elements in the collection pass the test.
+
+- **Parameters**: `callback` (Function)
+- **Example**:
+  ```javascript
+  const allAreConst = root.find(j.VariableDeclaration).every((path) => path.node.kind === "const");
+  ```
+
+#### `map`
+
+Maps each node in the collection to a new value.
+
+- **Parameters**: `callback` (Function)
+- **Example**:
+  ```javascript
+  const variableNames = j.find(j.VariableDeclaration).map((path) => path.node.declarations.map((decl) => decl.id.name));
+  ```
+
+#### `size`
+
+Returns the number of nodes in the collection.
+
+- **Example**:
+  ```javascript
+  const numberOfNodes = j.find(j.VariableDeclaration).size();
+  ```
+
+#### `length`
+
+Returns the number of elements in the collection.
+
+- **Example**:
+  ```javascript
+  const varCount = root.find(j.VariableDeclarator).length;
+  ```
+
+#### `nodes`
+
+Returns the AST nodes in the collection.
+
+- **Example**:
+  ```javascript
+  const nodes = j.find(j.VariableDeclaration).nodes();
+  ```
+
+#### `paths`
+
+Returns the paths of the found nodes.
+
+- **Example**:
+  ```javascript
+  const paths = j.find(j.VariableDeclaration).paths();
+  ```
+
+#### `getAST`
+
+Returns the root AST node of the collection.
+
+- **Example**:
+  ```javascript
+  const ast = root.getAST();
+  ```
+
+#### `get`
+
+Gets the first node in the collection.
+
+- **Example**:
+  ```javascript
+  const firstVariableDeclaration = j.find(j.VariableDeclaration).get();
+  ```
+
+#### `at`
+
+Navigates to a specific path in the AST.
+
+- **Parameters**: `index` (Number)
+- **Example**:
+  ```javascript
+  const secondVariableDeclaration = j.find(j.VariableDeclaration).at(1);
+  ```
+
+#### `getTypes`
+
+Returns the set of node types present in the collection.
+
+- **Example**:
+  ```javascript
+  const types = root.find(j.VariableDeclarator).getTypes();
+  ```
+
+#### `isOfType`
+
+Checks if the node in the collection is of a specific type.
+
+- **Parameters**: `type` (String)
+- **Example**:
+  ```javascript
+  const isVariableDeclarator = root.find(j.VariableDeclarator).at(0).isOfType("VariableDeclarator");
+  ```
+
+### Node Transformation APIs
+
+#### `replaceWith`
+
+Replaces the current node(s) with a new node.
+
+- **Parameters**: `newNode` (Node or Function)
+- **Example**:
+  ```javascript
+  j.find(j.Identifier).replaceWith((path) => j.identifier(path.node.name.toUpperCase()));
+  ```
+
+#### `insertBefore`
+
+Inserts a node before the current node.
+
+- **Parameters**: `newNode` (Node)
+- **Example**:
+  ```javascript
+  j.find(j.FunctionDeclaration).insertBefore(j.expressionStatement(j.stringLiteral("Inserted before")));
+  ```
+
+#### `insertAfter`
+
+Inserts a node after the current node.
+
+- **Parameters**: `newNode` (Node)
+- **Example**:
+  ```javascript
+  j.find(j.FunctionDeclaration).insertAfter(j.expressionStatement(j.stringLiteral("Inserted after")));
+  ```
+
+#### `remove`
+
+Removes the current node(s).
+
+- **Example**:
+  ```javascript
+  j.find(j.VariableDeclaration).remove();
+  ```
+
+#### `renameTo`
+
+Renames the nodes in the collection to a new name.
+
+- **Parameters**: `newName` (String)
+- **Example**:
+  ```javascript
+  root.find(j.Identifier, { name: "a" }).renameTo("x");
+  ```
+
+#### `toSource`
+
+Converts the transformed AST back to source code.
+
+- **Parameters**: `options` (Object)
+- **Example**:
+  ```javascript
+  const transformedSource = j.toSource({ quote: "single" });
+  ```
+
+## AST Grammar
+
+jscodeshift provides 278 node types which are mapped to their corresponding node type in `ast-types`.
+
+### Common Node Types
+
+- **AnyTypeAnnotation**: A type annotation representing any type.
+- **ArrayExpression**: Represents an array literal.
+- **ArrayPattern**: A pattern that matches an array from a destructuring assignment.
+- **ArrayTypeAnnotation**: A type annotation for arrays.
+- **ArrowFunctionExpression**: An arrow function expression.
+- **AssignmentExpression**: Represents an assignment expression.
+- **AssignmentPattern**: A pattern that matches an assignment from a destructuring assignment.
+- **AwaitExpression**: Represents an await expression.
+- **BigIntLiteral**: A literal representing a big integer.
+- **BinaryExpression**: Represents a binary expression.
+- **BlockStatement**: Represents a block statement.
+- **BooleanLiteral**: A literal representing a boolean value.
+- **BreakStatement**: Represents a break statement.
+- **CallExpression**: Represents a call expression.
+- **CatchClause**: Represents a catch clause in a try statement.
+- **ClassDeclaration**: Represents a class declaration.
+- **ClassExpression**: Represents a class expression.
+- **ClassMethod**: Represents a method of a class.
+- **ClassProperty**: Represents a property of a class.
+- **Comment**: Represents a comment in the code.
+- **ConditionalExpression**: Represents a conditional expression (ternary).
+- **ContinueStatement**: Represents a continue statement.
+- **DebuggerStatement**: Represents a debugger statement.
+- **Declaration**: Represents a declaration in the code.
+- **DoWhileStatement**: Represents a do…while statement.
+- **ExportAllDeclaration**: Represents an export all declaration.
+- **ExportDeclaration**: Represents an export declaration.
+- **ExportDefaultDeclaration**: Represents an export default declaration.
+- **ExportNamedDeclaration**: Represents a named export declaration.
+- **ExpressionStatement**: Represents an expression statement.
+- **File**: Represents a file in the AST.
+- **ForInStatement**: Represents a for-in statement.
+- **ForOfStatement**: Represents a for-of statement.
+- **ForStatement**: Represents a for statement.
+- **FunctionDeclaration**: Represents a function declaration.
+- **FunctionExpression**: Represents a function expression.
+- **Identifier**: Represents an identifier.
+- **IfStatement**: Represents an if statement.
+- **ImportDeclaration**: Represents an import declaration.
+- **ImportDefaultSpecifier**: Represents a default import specifier.
+- **ImportNamespaceSpecifier**: Represents a namespace import specifier.
+- **ImportSpecifier**: Represents an import specifier.
+- **InterfaceDeclaration**: Represents an interface declaration.
+- **JSXAttribute**: Represents an attribute in a JSX element.
+- **JSXElement**: Represents a JSX element.
+- **JSXExpressionContainer**: Represents an expression container in JSX.
+- **JSXFragment**: Represents a JSX fragment.
+- **JSXIdentifier**: Represents an identifier in JSX.
+- **JSXText**: Represents text in JSX.
+- **Literal**: Represents a literal value.
+- **LogicalExpression**: Represents a logical expression.
+- **MemberExpression**: Represents a member expression.
+- **MethodDefinition**: Represents a method definition.
+- **NewExpression**: Represents a new expression.
+- **ObjectExpression**: Represents an object expression.
+- **ObjectPattern**: Represents an object pattern for destructuring.
+- **ObjectProperty**: Represents a property in an object.
+- **Program**: Represents the entire program.
+- **Property**: Represents a property in an object.
+- **ReturnStatement**: Represents a return statement.
+- **SpreadElement**: Represents a spread element in an array or function call.
+- **StringLiteral**: Represents a string literal.
+- **SwitchCase**: Represents a case in a switch statement.
+- **SwitchStatement**: Represents a switch statement.
+- **TemplateLiteral**: Represents a template literal.
+- **ThisExpression**: Represents the `this` expression.
+- **ThrowStatement**: Represents a throw statement.
+- **TryStatement**: Represents a try statement.
+- **TSAnyKeyword**: Represents the TypeScript `any` keyword.
+- **TSArrayType**: Represents a TypeScript array type.
+- **TSAsExpression**: Represents a TypeScript as-expression.
+- **TSBooleanKeyword**: Represents the TypeScript `boolean` keyword.
+- **TSDeclareFunction**: Represents a TypeScript function declaration.
+- **TSEnumDeclaration**: Represents a TypeScript enum declaration.
+- **TSInterfaceDeclaration**: Represents a TypeScript interface declaration.
+- **TSNumberKeyword**: Represents the TypeScript `number` keyword.
+- **TSStringKeyword**: Represents the TypeScript `string` keyword.
+- **TSTypeAliasDeclaration**: Represents a TypeScript type alias declaration.
+- **TSTypeAnnotation**: Represents a TypeScript type annotation.
+- **TSTypeReference**: Represents a type reference in TypeScript.
+- **TSUnionType**: Represents a union type in TypeScript.
+- **UnaryExpression**: Represents a unary expression.
+- **VariableDeclaration**: Represents a variable declaration.
+- **VariableDeclarator**: Represents a variable declarator.
+- **WhileStatement**: Represents a while statement.
+
+For a complete list and detailed structure of each node, refer to the [AST Grammar documentation](https://jscodeshift.com/build/ast-grammar/).
diff --git a/packages/codemods/package.json b/packages/codemods/package.json
new file mode 100644
index 000000000..7cd24a9a7
--- /dev/null
+++ b/packages/codemods/package.json
@@ -0,0 +1,15 @@
+{
+  "name": "@plane/codemods",
+  "version": "1.1.0",
+  "private": true,
+  "scripts": {
+    "test": "vitest run",
+    "function-declaration": "jscodeshift -t ./function-declaration.ts --extensions=tsx --parser=tsx ../../apps/*/app ../../apps/*/ce ../../apps/*/core ../../apps/*/ee ../../apps/*/helpers ../../packages/*/src --ignore-pattern='**/node_modules/**' --ignore-pattern='**/dist/**' --ignore-pattern='**/build/**' --ignore-pattern='**/*.d.ts'"
+  },
+  "devDependencies": {
+    "@hypermod/utils": "^0.7.1",
+    "@types/jscodeshift": "^17.3.0",
+    "jscodeshift": "^17.3.0",
+    "vitest": "^4.0.8"
+  }
+}
\ No newline at end of file
diff --git a/packages/codemods/tests/function-declaration.spec.ts b/packages/codemods/tests/function-declaration.spec.ts
new file mode 100644
index 000000000..5c252a389
--- /dev/null
+++ b/packages/codemods/tests/function-declaration.spec.ts
@@ -0,0 +1,465 @@
+import { describe, it, expect } from "vitest";
+import { applyTransform } from "@hypermod/utils";
+import * as transformer from "../function-declaration";
+
+describe("function-declaration", () => {
+  it("should convert arrow function components to function declarations", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      import React from "react";
+
+      export const MyComponent: React.FC<{}> = () => {
+        return <div>Hello, world!</div>;
+      };
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import React from "react";
+
+            export function MyComponent() {
+              return <div>Hello, world!</div>;
+            }"
+    `);
+  });
+
+  it("should handle components with props", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      import React from "react";
+
+      interface IMyComponentProps {
+        name: string;
+      }
+
+      export const MyComponent: React.FC<IMyComponentProps> = ({ name }) => {
+        return <div>Hello, {name}!</div>;
+      };
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import React from "react";
+
+            interface IMyComponentProps {
+              name: string;
+            }
+
+            export function MyComponent(
+              {
+                name
+              }: IMyComponentProps
+            ) {
+              return <div>Hello, {name}!</div>;
+            }"
+    `);
+  });
+
+  it("should preserve default props", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      import React from "react";
+
+      interface IMyComponentProps {
+        name?: string;
+      }
+
+      export const MyComponent: React.FC<IMyComponentProps> = ({ name = "world" }) => {
+        return <div>Hello, {name}!</div>;
+      };
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import React from "react";
+
+            interface IMyComponentProps {
+              name?: string;
+            }
+
+            export function MyComponent(
+              {
+                name = "world"
+              }: IMyComponentProps
+            ) {
+              return <div>Hello, {name}!</div>;
+            }"
+    `);
+  });
+
+  it("should not transform non-component arrow functions", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      const myFunction = () => {
+        return "hello";
+      };
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "const myFunction = () => {
+              return "hello";
+            };"
+    `);
+  });
+
+  it("should handle observer-wrapped components", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      import { observer } from "mobx-react";
+
+      export const WorkspaceAnalyticsHeader = observer(() => {
+        return <div>Analytics</div>;
+      });
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import { observer } from "mobx-react";
+
+            export const WorkspaceAnalyticsHeader = observer(function WorkspaceAnalyticsHeader() {
+              return <div>Analytics</div>;
+            });"
+    `);
+  });
+
+  it("should handle inline arrow function components", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      export const StarUsOnGitHubLink = () => {
+        return <a href="https://github.com">Star us</a>;
+      };
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "export function StarUsOnGitHubLink() {
+              return <a href="https://github.com">Star us</a>;
+            }"
+    `);
+  });
+
+  it("should handle React.FC type without generics", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      import type { FC } from "react";
+
+      export const ProjectAppSidebar: FC = observer(() => {
+        return <div>Sidebar</div>;
+      });
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import type { FC } from "react";
+
+            export const ProjectAppSidebar = observer(function ProjectAppSidebar() {
+              return <div>Sidebar</div>;
+            });"
+    `);
+  });
+
+  it("should handle inline JSX arrow function", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      export const DateAlert = (props: TDateAlertProps) => <></>;
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "export function DateAlert(props: TDateAlertProps) {
+                  return <></>;
+            }"
+    `);
+  });
+
+  it("should handle observer with generic type parameters", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      import { observer } from "mobx-react";
+
+      export const InstanceProvider = observer<React.FC<React.PropsWithChildren>>((props) => {
+        const { children } = props;
+        return <>{children}</>;
+      });
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import { observer } from "mobx-react";
+
+            export const InstanceProvider = observer(function InstanceProvider(props: React.PropsWithChildren) {
+              const { children } = props;
+              return <>{children}</>;
+            });"
+    `);
+  });
+
+  it("should not add double semicolons after use client directive", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      "use client";
+      import { observer } from "mobx-react";
+
+      export const MyComponent = observer(() => {
+        return <div>Hello</div>;
+      });
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      ""use client";
+            import { observer } from "mobx-react";
+
+            export const MyComponent = observer(function MyComponent() {
+              return <div>Hello</div>;
+            });"
+    `);
+  });
+
+  it("should preserve generic type parameters in wrapper functions", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      import React from "react";
+
+      export const ScatterChart = React.memo(<K extends string, T extends string>(props: TScatterChartProps<K, T>) => {
+        return <div>Chart</div>;
+      });
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import React from "react";
+
+            export const ScatterChart = React.memo(
+              function ScatterChart<K extends string, T extends string>(props: TScatterChartProps<K, T>) {
+                return <div>Chart</div>;
+              }
+            );"
+    `);
+  });
+
+  it("should preserve generic type parameters on React.forwardRef", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      import React from "react";
+
+      const Button = React.forwardRef<HTMLButtonElement, ButtonProps>((props, ref) => {
+        return <button ref={ref}>Click me</button>;
+      });
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import React from "react";
+
+            const Button = React.forwardRef(
+              function Button(props: ButtonProps, ref: React.ForwardedRef<HTMLButtonElement>) {
+                return <button ref={ref}>Click me</button>;
+              }
+            );"
+    `);
+  });
+
+  it("should prefix unused props parameter with underscore", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      import type { TCallbackMentionComponentProps } from "@plane/editor";
+
+      export const EditorAdditionalMentionsRoot: React.FC<TCallbackMentionComponentProps> = () => null;
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import type { TCallbackMentionComponentProps } from "@plane/editor";
+
+            export function EditorAdditionalMentionsRoot(_props: TCallbackMentionComponentProps) {
+                  return null;
+            }"
+    `);
+  });
+
+  it("should add Record<string, unknown> type for React.forwardRef with only element type", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      import { forwardRef } from "react";
+
+      const ListLoaderItemRow = forwardRef<HTMLDivElement>((props, ref) => (
+        <div ref={ref}>Content</div>
+      ));
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "import { forwardRef } from "react";
+
+            const ListLoaderItemRow = forwardRef(
+              function ListLoaderItemRow(props: Record<string, unknown>, ref: React.ForwardedRef<HTMLDivElement>) {
+                return (<div ref={ref}>Content</div>);
+              }
+            );"
+    `);
+  });
+
+  it("should preserve comments in function body", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      export const PreloadResources = () => (
+        // usePreloadResources();
+        null
+      );
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "export function PreloadResources() {
+              return (
+                // usePreloadResources();
+                (null)
+              );
+            }"
+    `);
+  });
+
+  it("should preserve leading comments before export declaration", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+"use client";
+
+// TODO: Check if we need this
+// https://nextjs.org/docs/app/api-reference/functions/generate-metadata#link-relpreload
+// export const usePreloadResources = () => {
+//   useEffect(() => {
+//     const preloadItem = (url: string) => {
+//       ReactDOM.preload(url, { as: "fetch", crossOrigin: "use-credentials" });
+//     };
+//
+//     const urls = [
+//       \`\${process.env.VITE_API_BASE_URL}/api/instances/\`,
+//       \`\${process.env.VITE_API_BASE_URL}/api/users/me/\`,
+//       \`\${process.env.VITE_API_BASE_URL}/api/users/me/profile/\`,
+//       \`\${process.env.VITE_API_BASE_URL}/api/users/me/settings/\`,
+//       \`\${process.env.VITE_API_BASE_URL}/api/users/me/workspaces/?v=\${Date.now()}\`,
+//     ];
+//
+//     urls.forEach((url) => preloadItem(url));
+//   }, []);
+// };
+
+export const PreloadResources = () =>
+  // usePreloadResources();
+  null;
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      ""use client";
+
+      // TODO: Check if we need this
+      // https://nextjs.org/docs/app/api-reference/functions/generate-metadata#link-relpreload
+      // export const usePreloadResources = () => {
+      //   useEffect(() => {
+      //     const preloadItem = (url: string) => {
+      //       ReactDOM.preload(url, { as: "fetch", crossOrigin: "use-credentials" });
+      //     };
+      //
+      //     const urls = [
+      //       \`\${process.env.VITE_API_BASE_URL}/api/instances/\`,
+      //       \`\${process.env.VITE_API_BASE_URL}/api/users/me/\`,
+      //       \`\${process.env.VITE_API_BASE_URL}/api/users/me/profile/\`,
+      //       \`\${process.env.VITE_API_BASE_URL}/api/users/me/settings/\`,
+      //       \`\${process.env.VITE_API_BASE_URL}/api/users/me/workspaces/?v=\${Date.now()}\`,
+      //     ];
+      //
+      //     urls.forEach((url) => preloadItem(url));
+      //   }, []);
+      // };
+
+      export function PreloadResources() {
+        return (
+          // usePreloadResources();
+          null
+        );
+      }"
+    `);
+  });
+
+  it("should preserve leading comments before wrapped export declaration", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+// This is a wrapped component
+// It uses observer for reactivity
+export const MyObserverComponent = observer(() => {
+  return <div>Observer component</div>;
+});
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      "// This is a wrapped component
+      // It uses observer for reactivity
+      export const MyObserverComponent = observer(function MyObserverComponent() {
+        return <div>Observer component</div>;
+      });"
+    `);
+  });
+
+  it("should preserve trailing comments on exported variable declaration", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      export const Foo = () => <div />; // trailing comment
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toContain("// trailing comment");
+  });
+
+  it("should preserve leading comments on exported variable declaration inside export", async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+      export /* leading comment */ const Foo = () => <div />;
+      `,
+      { parser: "tsx" },
+    );
+
+    expect(result).toContain("/* leading comment */");
+  });
+});
+
diff --git a/packages/codemods/tsconfig.json b/packages/codemods/tsconfig.json
new file mode 100644
index 000000000..07945fef9
--- /dev/null
+++ b/packages/codemods/tsconfig.json
@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "module": "esnext",
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noUncheckedIndexedAccess": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true
+  }
+}
diff --git a/packages/codemods/vitest.config.ts b/packages/codemods/vitest.config.ts
new file mode 100644
index 000000000..f624398e8
--- /dev/null
+++ b/packages/codemods/vitest.config.ts
@@ -0,0 +1,7 @@
+import { defineConfig } from "vitest/config";
+
+export default defineConfig({
+  test: {
+    environment: "node",
+  },
+});
diff --git a/packages/editor/src/ce/components/link-container.tsx b/packages/editor/src/ce/components/link-container.tsx
index a31a8c110..4994ae124 100644
--- a/packages/editor/src/ce/components/link-container.tsx
+++ b/packages/editor/src/ce/components/link-container.tsx
@@ -1,14 +1,16 @@
 import type { Editor } from "@tiptap/core";
 import { LinkViewContainer } from "@/components/editors/link-view-container";
 
-export const LinkContainer = ({
+export function LinkContainer({
   editor,
   containerRef,
 }: {
   editor: Editor;
   containerRef: React.RefObject<HTMLDivElement>;
-}) => (
-  <>
-    <LinkViewContainer editor={editor} containerRef={containerRef} />
-  </>
-);
+}) {
+  return (
+    <>
+      <LinkViewContainer editor={editor} containerRef={containerRef} />
+    </>
+  );
+}
diff --git a/packages/editor/src/ce/extensions/document-extensions.tsx b/packages/editor/src/ce/extensions/document-extensions.tsx
index abdb282e7..28a470c67 100644
--- a/packages/editor/src/ce/extensions/document-extensions.tsx
+++ b/packages/editor/src/ce/extensions/document-extensions.tsx
@@ -26,7 +26,7 @@ const extensionRegistry: TDocumentEditorAdditionalExtensionsRegistry[] = [
   },
 ];
 
-export const DocumentEditorAdditionalExtensions = (props: TDocumentEditorAdditionalExtensionsProps) => {
+export function DocumentEditorAdditionalExtensions(props: TDocumentEditorAdditionalExtensionsProps) {
   const { disabledExtensions, flaggedExtensions } = props;
 
   const documentExtensions = extensionRegistry
@@ -34,4 +34,4 @@ export const DocumentEditorAdditionalExtensions = (props: TDocumentEditorAdditio
     .map((config) => config.getExtension(props));
 
   return documentExtensions;
-};
+}
diff --git a/packages/editor/src/ce/extensions/rich-text-extensions.tsx b/packages/editor/src/ce/extensions/rich-text-extensions.tsx
index 204c0435b..6cd6ad06c 100644
--- a/packages/editor/src/ce/extensions/rich-text-extensions.tsx
+++ b/packages/editor/src/ce/extensions/rich-text-extensions.tsx
@@ -30,7 +30,7 @@ const extensionRegistry: TRichTextEditorAdditionalExtensionsRegistry[] = [
   },
 ];
 
-export const RichTextEditorAdditionalExtensions = (props: TRichTextEditorAdditionalExtensionsProps) => {
+export function RichTextEditorAdditionalExtensions(props: TRichTextEditorAdditionalExtensionsProps) {
   const { disabledExtensions, flaggedExtensions } = props;
 
   const extensions: Extensions = extensionRegistry
@@ -39,4 +39,4 @@ export const RichTextEditorAdditionalExtensions = (props: TRichTextEditorAdditio
     .filter((extension): extension is AnyExtension => extension !== undefined);
 
   return extensions;
-};
+}
diff --git a/packages/editor/src/core/components/editors/document/collaborative-editor.tsx b/packages/editor/src/core/components/editors/document/collaborative-editor.tsx
index 776011cf3..6bb7f15c4 100644
--- a/packages/editor/src/core/components/editors/document/collaborative-editor.tsx
+++ b/packages/editor/src/core/components/editors/document/collaborative-editor.tsx
@@ -14,7 +14,7 @@ import { DocumentEditorSideEffects } from "@/plane-editor/components/document-ed
 // types
 import type { EditorRefApi, ICollaborativeDocumentEditorProps } from "@/types";
 
-const CollaborativeDocumentEditor: React.FC<ICollaborativeDocumentEditorProps> = (props) => {
+function CollaborativeDocumentEditor(props: ICollaborativeDocumentEditorProps) {
   const {
     aiHandler,
     bubbleMenuEnabled = true,
@@ -105,13 +105,14 @@ const CollaborativeDocumentEditor: React.FC<ICollaborativeDocumentEditorProps> =
       />
     </>
   );
-};
+}
 
-const CollaborativeDocumentEditorWithRef = React.forwardRef<EditorRefApi, ICollaborativeDocumentEditorProps>(
-  (props, ref) => (
-    <CollaborativeDocumentEditor {...props} forwardedRef={ref as React.MutableRefObject<EditorRefApi | null>} />
-  )
-);
+const CollaborativeDocumentEditorWithRef = React.forwardRef(function CollaborativeDocumentEditorWithRef(
+  props: ICollaborativeDocumentEditorProps,
+  ref: React.ForwardedRef<EditorRefApi>
+) {
+  return <CollaborativeDocumentEditor {...props} forwardedRef={ref as React.MutableRefObject<EditorRefApi | null>} />;
+});
 
 CollaborativeDocumentEditorWithRef.displayName = "CollaborativeDocumentEditorWithRef";
 
diff --git a/packages/editor/src/core/components/editors/document/editor.tsx b/packages/editor/src/core/components/editors/document/editor.tsx
index 0279d1b61..c2001902b 100644
--- a/packages/editor/src/core/components/editors/document/editor.tsx
+++ b/packages/editor/src/core/components/editors/document/editor.tsx
@@ -18,7 +18,7 @@ import { DocumentEditorAdditionalExtensions } from "@/plane-editor/extensions";
 // types
 import type { EditorRefApi, IDocumentEditorProps } from "@/types";
 
-const DocumentEditor = (props: IDocumentEditorProps) => {
+function DocumentEditor(props: IDocumentEditorProps) {
   const {
     bubbleMenuEnabled = false,
     containerClassName,
@@ -99,11 +99,14 @@ const DocumentEditor = (props: IDocumentEditorProps) => {
       isTouchDevice={!!isTouchDevice}
     />
   );
-};
+}
 
-const DocumentEditorWithRef = forwardRef<EditorRefApi, IDocumentEditorProps>((props, ref) => (
-  <DocumentEditor {...props} forwardedRef={ref as MutableRefObject<EditorRefApi | null>} />
-));
+const DocumentEditorWithRef = forwardRef(function DocumentEditorWithRef(
+  props: IDocumentEditorProps,
+  ref: React.ForwardedRef<EditorRefApi>
+) {
+  return <DocumentEditor {...props} forwardedRef={ref as MutableRefObject<EditorRefApi | null>} />;
+});
 
 DocumentEditorWithRef.displayName = "DocumentEditorWithRef";
 
diff --git a/packages/editor/src/core/components/editors/document/loader.tsx b/packages/editor/src/core/components/editors/document/loader.tsx
index 36194f7c7..f24eedb01 100644
--- a/packages/editor/src/core/components/editors/document/loader.tsx
+++ b/packages/editor/src/core/components/editors/document/loader.tsx
@@ -6,7 +6,7 @@ type Props = {
   className?: string;
 };
 
-export const DocumentContentLoader = (props: Props) => {
+export function DocumentContentLoader(props: Props) {
   const { className } = props;
 
   return (
@@ -48,4 +48,4 @@ export const DocumentContentLoader = (props: Props) => {
       </Loader>
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/components/editors/document/page-renderer.tsx b/packages/editor/src/core/components/editors/document/page-renderer.tsx
index c32646825..7b99b5207 100644
--- a/packages/editor/src/core/components/editors/document/page-renderer.tsx
+++ b/packages/editor/src/core/components/editors/document/page-renderer.tsx
@@ -23,7 +23,7 @@ type Props = {
   disabledExtensions: IEditorProps["disabledExtensions"];
 };
 
-export const PageRenderer = (props: Props) => {
+export function PageRenderer(props: Props) {
   const {
     aiHandler,
     bubbleMenuEnabled,
@@ -71,4 +71,4 @@ export const PageRenderer = (props: Props) => {
       )}
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/components/editors/editor-container.tsx b/packages/editor/src/core/components/editors/editor-container.tsx
index b2b7309c7..e634e492f 100644
--- a/packages/editor/src/core/components/editors/editor-container.tsx
+++ b/packages/editor/src/core/components/editors/editor-container.tsx
@@ -20,7 +20,7 @@ type Props = {
   isTouchDevice: boolean;
 };
 
-export const EditorContainer: FC<Props> = (props) => {
+export function EditorContainer(props: Props) {
   const { children, displayConfig, editor, editorContainerClassName, id, isTouchDevice } = props;
   // refs
   const containerRef = useRef<HTMLDivElement>(null);
@@ -100,4 +100,4 @@ export const EditorContainer: FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/packages/editor/src/core/components/editors/editor-content.tsx b/packages/editor/src/core/components/editors/editor-content.tsx
index 623dc5546..aef688fc7 100644
--- a/packages/editor/src/core/components/editors/editor-content.tsx
+++ b/packages/editor/src/core/components/editors/editor-content.tsx
@@ -9,7 +9,7 @@ type Props = {
   tabIndex?: number;
 };
 
-export const EditorContentWrapper: FC<Props> = (props) => {
+export function EditorContentWrapper(props: Props) {
   const { editor, children, tabIndex, id } = props;
 
   return (
@@ -18,4 +18,4 @@ export const EditorContentWrapper: FC<Props> = (props) => {
       {children}
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/components/editors/editor-wrapper.tsx b/packages/editor/src/core/components/editors/editor-wrapper.tsx
index dfeb54d45..14570a656 100644
--- a/packages/editor/src/core/components/editors/editor-wrapper.tsx
+++ b/packages/editor/src/core/components/editors/editor-wrapper.tsx
@@ -16,7 +16,7 @@ type Props = IEditorProps & {
   extensions: Extensions;
 };
 
-export const EditorWrapper: React.FC<Props> = (props) => {
+export function EditorWrapper(props: Props) {
   const {
     children,
     containerClassName,
@@ -93,4 +93,4 @@ export const EditorWrapper: React.FC<Props> = (props) => {
       </div>
     </EditorContainer>
   );
-};
+}
diff --git a/packages/editor/src/core/components/editors/link-view-container.tsx b/packages/editor/src/core/components/editors/link-view-container.tsx
index 580093079..3b1c6132a 100644
--- a/packages/editor/src/core/components/editors/link-view-container.tsx
+++ b/packages/editor/src/core/components/editors/link-view-container.tsx
@@ -13,7 +13,7 @@ type Props = {
   containerRef: React.RefObject<HTMLDivElement>;
 };
 
-export const LinkViewContainer: FC<Props> = ({ editor, containerRef }) => {
+export function LinkViewContainer({ editor, containerRef }: Props) {
   const [linkViewProps, setLinkViewProps] = useState<LinkViewProps>();
   const [isOpen, setIsOpen] = useState(false);
   const [virtualElement, setVirtualElement] = useState<Element | null>(null);
@@ -201,4 +201,4 @@ export const LinkViewContainer: FC<Props> = ({ editor, containerRef }) => {
       )}
     </>
   );
-};
+}
diff --git a/packages/editor/src/core/components/editors/lite-text/editor.tsx b/packages/editor/src/core/components/editors/lite-text/editor.tsx
index d4dccd996..6734058d1 100644
--- a/packages/editor/src/core/components/editors/lite-text/editor.tsx
+++ b/packages/editor/src/core/components/editors/lite-text/editor.tsx
@@ -6,7 +6,7 @@ import { EnterKeyExtension } from "@/extensions";
 // types
 import type { EditorRefApi, ILiteTextEditorProps } from "@/types";
 
-const LiteTextEditor: React.FC<ILiteTextEditorProps> = (props) => {
+function LiteTextEditor(props: ILiteTextEditorProps) {
   const { onEnterKeyPress, disabledExtensions, extensions: externalExtensions = [] } = props;
 
   const extensions = useMemo(() => {
@@ -20,11 +20,14 @@ const LiteTextEditor: React.FC<ILiteTextEditorProps> = (props) => {
   }, [externalExtensions, disabledExtensions, onEnterKeyPress]);
 
   return <EditorWrapper {...props} extensions={extensions} />;
-};
+}
 
-const LiteTextEditorWithRef = forwardRef<EditorRefApi, ILiteTextEditorProps>((props, ref) => (
-  <LiteTextEditor {...props} forwardedRef={ref as React.MutableRefObject<EditorRefApi | null>} />
-));
+const LiteTextEditorWithRef = forwardRef(function LiteTextEditorWithRef(
+  props: ILiteTextEditorProps,
+  ref: React.ForwardedRef<EditorRefApi>
+) {
+  return <LiteTextEditor {...props} forwardedRef={ref as React.MutableRefObject<EditorRefApi | null>} />;
+});
 
 LiteTextEditorWithRef.displayName = "LiteTextEditorWithRef";
 
diff --git a/packages/editor/src/core/components/editors/rich-text/editor.tsx b/packages/editor/src/core/components/editors/rich-text/editor.tsx
index 6820eed79..5d99ed3b0 100644
--- a/packages/editor/src/core/components/editors/rich-text/editor.tsx
+++ b/packages/editor/src/core/components/editors/rich-text/editor.tsx
@@ -9,7 +9,7 @@ import { RichTextEditorAdditionalExtensions } from "@/plane-editor/extensions/ri
 // types
 import type { EditorRefApi, IRichTextEditorProps } from "@/types";
 
-const RichTextEditor: React.FC<IRichTextEditorProps> = (props) => {
+function RichTextEditor(props: IRichTextEditorProps) {
   const {
     bubbleMenuEnabled = true,
     disabledExtensions,
@@ -54,11 +54,14 @@ const RichTextEditor: React.FC<IRichTextEditorProps> = (props) => {
       )}
     </EditorWrapper>
   );
-};
+}
 
-const RichTextEditorWithRef = forwardRef<EditorRefApi, IRichTextEditorProps>((props, ref) => (
-  <RichTextEditor {...props} forwardedRef={ref as React.MutableRefObject<EditorRefApi | null>} />
-));
+const RichTextEditorWithRef = forwardRef(function RichTextEditorWithRef(
+  props: IRichTextEditorProps,
+  ref: React.ForwardedRef<EditorRefApi>
+) {
+  return <RichTextEditor {...props} forwardedRef={ref as React.MutableRefObject<EditorRefApi | null>} />;
+});
 
 RichTextEditorWithRef.displayName = "RichTextEditorWithRef";
 
diff --git a/packages/editor/src/core/components/links/link-edit-view.tsx b/packages/editor/src/core/components/links/link-edit-view.tsx
index 34e4eb2cf..d183630fd 100644
--- a/packages/editor/src/core/components/links/link-edit-view.tsx
+++ b/packages/editor/src/core/components/links/link-edit-view.tsx
@@ -14,26 +14,28 @@ type InputViewProps = {
   autoFocus?: boolean;
 };
 
-const InputView = ({ label, value, placeholder, onChange, autoFocus }: InputViewProps) => (
-  <div className="flex flex-col gap-1">
-    <label className="inline-block font-semibold text-xs text-custom-text-400">{label}</label>
-    <input
-      placeholder={placeholder}
-      onClick={(e) => e.stopPropagation()}
-      className="w-[280px] outline-none bg-custom-background-90 text-custom-text-900 text-sm border border-custom-border-300 rounded-md p-2"
-      value={value}
-      onChange={(e) => onChange(e.target.value)}
-      autoFocus={autoFocus}
-    />
-  </div>
-);
+function InputView({ label, value, placeholder, onChange, autoFocus }: InputViewProps) {
+  return (
+    <div className="flex flex-col gap-1">
+      <label className="inline-block font-semibold text-xs text-custom-text-400">{label}</label>
+      <input
+        placeholder={placeholder}
+        onClick={(e) => e.stopPropagation()}
+        className="w-[280px] outline-none bg-custom-background-90 text-custom-text-900 text-sm border border-custom-border-300 rounded-md p-2"
+        value={value}
+        onChange={(e) => onChange(e.target.value)}
+        autoFocus={autoFocus}
+      />
+    </div>
+  );
+}
 
 type LinkEditViewProps = {
   viewProps: LinkViewProps;
   switchView: (view: LinkViews) => void;
 };
 
-export const LinkEditView = ({ viewProps }: LinkEditViewProps) => {
+export function LinkEditView({ viewProps }: LinkEditViewProps) {
   const { editor, from, to, url: initialUrl, text: initialText, closeLinkView } = viewProps;
 
   // State
@@ -147,4 +149,4 @@ export const LinkEditView = ({ viewProps }: LinkEditViewProps) => {
       </div>
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/components/links/link-preview.tsx b/packages/editor/src/core/components/links/link-preview.tsx
index 65803e37b..8ceb0471e 100644
--- a/packages/editor/src/core/components/links/link-preview.tsx
+++ b/packages/editor/src/core/components/links/link-preview.tsx
@@ -2,13 +2,13 @@ import { Copy, GlobeIcon, Link2Off, PencilIcon } from "lucide-react";
 // components
 import type { LinkViewProps, LinkViews } from "@/components/links";
 
-export const LinkPreview = ({
+export function LinkPreview({
   viewProps,
   switchView,
 }: {
   viewProps: LinkViewProps;
   switchView: (view: LinkViews) => void;
-}) => {
+}) {
   const { editor, from, to, url } = viewProps;
 
   const removeLink = () => {
@@ -52,4 +52,4 @@ export const LinkPreview = ({
       </div>
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/components/links/link-view.tsx b/packages/editor/src/core/components/links/link-view.tsx
index ab04ab8d8..4bf0996fc 100644
--- a/packages/editor/src/core/components/links/link-view.tsx
+++ b/packages/editor/src/core/components/links/link-view.tsx
@@ -16,7 +16,7 @@ export type LinkViewProps = {
   closeLinkView: () => void;
 };
 
-export const LinkView = (props: LinkViewProps & { style: CSSProperties }) => {
+export function LinkView(props: LinkViewProps & { style: CSSProperties }) {
   const [currentView, setCurrentView] = useState<LinkViews>(props.view ?? "LinkPreview");
   const [prevFrom, setPrevFrom] = useState(props.from);
 
@@ -37,4 +37,4 @@ export const LinkView = (props: LinkViewProps & { style: CSSProperties }) => {
       {currentView === "LinkEditView" && <LinkEditView viewProps={props} switchView={switchView} />}
     </>
   );
-};
+}
diff --git a/packages/editor/src/core/components/menus/ai-menu.tsx b/packages/editor/src/core/components/menus/ai-menu.tsx
index 14d6474a2..be7a4cf98 100644
--- a/packages/editor/src/core/components/menus/ai-menu.tsx
+++ b/packages/editor/src/core/components/menus/ai-menu.tsx
@@ -10,7 +10,7 @@ type Props = {
   menu: TAIHandler["menu"];
 };
 
-export const AIFeaturesMenu: React.FC<Props> = (props) => {
+export function AIFeaturesMenu(props: Props) {
   const { menu } = props;
   // states
   const [isPopupVisible, setIsPopupVisible] = useState(false);
@@ -94,4 +94,4 @@ export const AIFeaturesMenu: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/components/menus/block-menu.tsx b/packages/editor/src/core/components/menus/block-menu.tsx
index 5ad846339..fa635f124 100644
--- a/packages/editor/src/core/components/menus/block-menu.tsx
+++ b/packages/editor/src/core/components/menus/block-menu.tsx
@@ -34,7 +34,7 @@ export type BlockMenuOption = {
   isDisabled?: boolean;
 };
 
-export const BlockMenu = (props: Props) => {
+export function BlockMenu(props: Props) {
   const { editor, workItemIdentifier } = props;
   const [isOpen, setIsOpen] = useState(false);
   const [isAnimatedIn, setIsAnimatedIn] = useState(false);
@@ -245,4 +245,4 @@ export const BlockMenu = (props: Props) => {
       </div>
     </FloatingPortal>
   );
-};
+}
diff --git a/packages/editor/src/core/components/menus/bubble-menu/alignment-selector.tsx b/packages/editor/src/core/components/menus/bubble-menu/alignment-selector.tsx
index 8bd490f8b..2057a3bcc 100644
--- a/packages/editor/src/core/components/menus/bubble-menu/alignment-selector.tsx
+++ b/packages/editor/src/core/components/menus/bubble-menu/alignment-selector.tsx
@@ -14,7 +14,7 @@ type Props = {
   editorState: EditorStateType;
 };
 
-export const TextAlignmentSelector: React.FC<Props> = (props) => {
+export function TextAlignmentSelector(props: Props) {
   const { editor, editorState } = props;
   const menuItem = TextAlignItem(editor);
 
@@ -80,4 +80,4 @@ export const TextAlignmentSelector: React.FC<Props> = (props) => {
       ))}
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/components/menus/bubble-menu/color-selector.tsx b/packages/editor/src/core/components/menus/bubble-menu/color-selector.tsx
index 41fee1ca4..83e5a8100 100644
--- a/packages/editor/src/core/components/menus/bubble-menu/color-selector.tsx
+++ b/packages/editor/src/core/components/menus/bubble-menu/color-selector.tsx
@@ -17,7 +17,7 @@ type Props = {
   editorState: EditorStateType;
 };
 
-export const BubbleMenuColorSelector: FC<Props> = (props) => {
+export function BubbleMenuColorSelector(props: Props) {
   const { editor, editorState } = props;
   // floating ui
   const { options, getReferenceProps, getFloatingProps } = useFloatingMenu({});
@@ -111,4 +111,4 @@ export const BubbleMenuColorSelector: FC<Props> = (props) => {
       </section>
     </FloatingMenuRoot>
   );
-};
+}
diff --git a/packages/editor/src/core/components/menus/bubble-menu/link-selector.tsx b/packages/editor/src/core/components/menus/bubble-menu/link-selector.tsx
index 14e93c1ee..50c062323 100644
--- a/packages/editor/src/core/components/menus/bubble-menu/link-selector.tsx
+++ b/packages/editor/src/core/components/menus/bubble-menu/link-selector.tsx
@@ -16,7 +16,7 @@ type Props = {
   editor: Editor;
 };
 
-export const BubbleMenuLinkSelector: FC<Props> = (props) => {
+export function BubbleMenuLinkSelector(props: Props) {
   const { editor } = props;
   // states
   const [error, setError] = useState(false);
@@ -119,4 +119,4 @@ export const BubbleMenuLinkSelector: FC<Props> = (props) => {
       </div>
     </FloatingMenuRoot>
   );
-};
+}
diff --git a/packages/editor/src/core/components/menus/bubble-menu/node-selector.tsx b/packages/editor/src/core/components/menus/bubble-menu/node-selector.tsx
index a4e382207..9ed91a6bc 100644
--- a/packages/editor/src/core/components/menus/bubble-menu/node-selector.tsx
+++ b/packages/editor/src/core/components/menus/bubble-menu/node-selector.tsx
@@ -30,7 +30,7 @@ type Props = {
   editor: Editor;
 };
 
-export const BubbleMenuNodeSelector: FC<Props> = (props) => {
+export function BubbleMenuNodeSelector(props: Props) {
   const { editor } = props;
   // floating ui
   const { options, getReferenceProps, getFloatingProps } = useFloatingMenu({});
@@ -102,4 +102,4 @@ export const BubbleMenuNodeSelector: FC<Props> = (props) => {
       </section>
     </FloatingMenuRoot>
   );
-};
+}
diff --git a/packages/editor/src/core/components/menus/bubble-menu/root.tsx b/packages/editor/src/core/components/menus/bubble-menu/root.tsx
index 8700a2c27..c4e7dc87d 100644
--- a/packages/editor/src/core/components/menus/bubble-menu/root.tsx
+++ b/packages/editor/src/core/components/menus/bubble-menu/root.tsx
@@ -64,7 +64,7 @@ type Props = {
   editor: Editor;
 };
 
-export const EditorBubbleMenu: FC<Props> = (props) => {
+export function EditorBubbleMenu(props: Props) {
   const { editor } = props;
   // states
   const [isSelecting, setIsSelecting] = useState(false);
@@ -223,4 +223,4 @@ export const EditorBubbleMenu: FC<Props> = (props) => {
       )}
     </BubbleMenu>
   );
-};
+}
diff --git a/packages/editor/src/core/components/menus/floating-menu/root.tsx b/packages/editor/src/core/components/menus/floating-menu/root.tsx
index 2e1f59f98..33896c1ce 100644
--- a/packages/editor/src/core/components/menus/floating-menu/root.tsx
+++ b/packages/editor/src/core/components/menus/floating-menu/root.tsx
@@ -14,7 +14,7 @@ type Props = {
   options: UseFloatingReturn;
 };
 
-export const FloatingMenuRoot: React.FC<Props> = (props) => {
+export function FloatingMenuRoot(props: Props) {
   const { children, classNames, getFloatingProps, getReferenceProps, menuButton, onClick, options } = props;
   // derived values
   const { refs, floatingStyles, context } = options;
@@ -58,4 +58,4 @@ export const FloatingMenuRoot: React.FC<Props> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/callout/block.tsx b/packages/editor/src/core/extensions/callout/block.tsx
index 2471469b0..906bbb6f4 100644
--- a/packages/editor/src/core/extensions/callout/block.tsx
+++ b/packages/editor/src/core/extensions/callout/block.tsx
@@ -19,7 +19,7 @@ export type CustomCalloutNodeViewProps = NodeViewProps & {
   updateAttributes: (attrs: Partial<TCalloutBlockAttributes>) => void;
 };
 
-export const CustomCalloutBlock: React.FC<CustomCalloutNodeViewProps> = (props) => {
+export function CustomCalloutBlock(props: CustomCalloutNodeViewProps) {
   const { editor, node, updateAttributes } = props;
   // states
   const [isEmojiPickerOpen, setIsEmojiPickerOpen] = useState(false);
@@ -55,4 +55,4 @@ export const CustomCalloutBlock: React.FC<CustomCalloutNodeViewProps> = (props)
       <NodeViewContent as="div" className="w-full break-words" />
     </NodeViewWrapper>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/callout/color-selector.tsx b/packages/editor/src/core/extensions/callout/color-selector.tsx
index 0419fd8fc..740b7654e 100644
--- a/packages/editor/src/core/extensions/callout/color-selector.tsx
+++ b/packages/editor/src/core/extensions/callout/color-selector.tsx
@@ -12,7 +12,7 @@ type Props = {
   toggleDropdown: () => void;
 };
 
-export const CalloutBlockColorSelector: React.FC<Props> = (props) => {
+export function CalloutBlockColorSelector(props: Props) {
   const { disabled, isOpen, onSelect, toggleDropdown } = props;
 
   const handleColorSelect = (val: string | null) => {
@@ -73,4 +73,4 @@ export const CalloutBlockColorSelector: React.FC<Props> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/callout/logo-selector.tsx b/packages/editor/src/core/extensions/callout/logo-selector.tsx
index f4133ae69..4882961c0 100644
--- a/packages/editor/src/core/extensions/callout/logo-selector.tsx
+++ b/packages/editor/src/core/extensions/callout/logo-selector.tsx
@@ -15,7 +15,7 @@ type Props = {
   updateAttributes: (attrs: Partial<TCalloutBlockAttributes>) => void;
 };
 
-export const CalloutBlockLogoSelector: React.FC<Props> = (props) => {
+export function CalloutBlockLogoSelector(props: Props) {
   const { blockAttributes, disabled, handleOpen, isOpen, updateAttributes } = props;
 
   const logoValue: TLogoProps = {
@@ -93,4 +93,4 @@ export const CalloutBlockLogoSelector: React.FC<Props> = (props) => {
       />
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/code/code-block-node-view.tsx b/packages/editor/src/core/extensions/code/code-block-node-view.tsx
index 6e13924a1..76f42cee4 100644
--- a/packages/editor/src/core/extensions/code/code-block-node-view.tsx
+++ b/packages/editor/src/core/extensions/code/code-block-node-view.tsx
@@ -19,7 +19,7 @@ type Props = {
   node: ProseMirrorNode;
 };
 
-export const CodeBlockComponent: React.FC<Props> = ({ node }) => {
+export function CodeBlockComponent({ node }: Props) {
   const [copied, setCopied] = useState(false);
 
   const copyToClipboard = async (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
@@ -60,4 +60,4 @@ export const CodeBlockComponent: React.FC<Props> = ({ node }) => {
       </pre>
     </NodeViewWrapper>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/custom-image/components/block.tsx b/packages/editor/src/core/extensions/custom-image/components/block.tsx
index c2d2c8ac5..508f9a22d 100644
--- a/packages/editor/src/core/extensions/custom-image/components/block.tsx
+++ b/packages/editor/src/core/extensions/custom-image/components/block.tsx
@@ -20,7 +20,7 @@ type CustomImageBlockProps = CustomImageNodeViewProps & {
   downloadSrc: string | undefined;
 };
 
-export const CustomImageBlock: React.FC<CustomImageBlockProps> = (props) => {
+export function CustomImageBlock(props: CustomImageBlockProps) {
   // props
   const {
     editor,
@@ -339,4 +339,4 @@ export const CustomImageBlock: React.FC<CustomImageBlockProps> = (props) => {
       </div>
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/custom-image/components/node-view.tsx b/packages/editor/src/core/extensions/custom-image/components/node-view.tsx
index 059e81ec9..8d67a36e4 100644
--- a/packages/editor/src/core/extensions/custom-image/components/node-view.tsx
+++ b/packages/editor/src/core/extensions/custom-image/components/node-view.tsx
@@ -16,7 +16,7 @@ export type CustomImageNodeViewProps = Omit<NodeViewProps, "extension" | "update
   updateAttributes: (attrs: Partial<TCustomImageAttributes>) => void;
 };
 
-export const CustomImageNodeView: React.FC<CustomImageNodeViewProps> = (props) => {
+export function CustomImageNodeView(props: CustomImageNodeViewProps) {
   const { editor, extension, node, updateAttributes } = props;
   const { src: imgNodeSrc, status } = node.attrs;
 
@@ -147,4 +147,4 @@ export const CustomImageNodeView: React.FC<CustomImageNodeViewProps> = (props) =
       </div>
     </NodeViewWrapper>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/custom-image/components/toolbar/alignment.tsx b/packages/editor/src/core/extensions/custom-image/components/toolbar/alignment.tsx
index d6706c6bb..8d97a676f 100644
--- a/packages/editor/src/core/extensions/custom-image/components/toolbar/alignment.tsx
+++ b/packages/editor/src/core/extensions/custom-image/components/toolbar/alignment.tsx
@@ -14,7 +14,7 @@ type Props = {
   toggleToolbarViewStatus: (val: boolean) => void;
 };
 
-export const ImageAlignmentAction: React.FC<Props> = (props) => {
+export function ImageAlignmentAction(props: Props) {
   const { activeAlignment, handleChange, isTouchDevice, toggleToolbarViewStatus } = props;
   // states
   const [isDropdownOpen, setIsDropdownOpen] = useState(false);
@@ -61,4 +61,4 @@ export const ImageAlignmentAction: React.FC<Props> = (props) => {
       )}
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/custom-image/components/toolbar/download.tsx b/packages/editor/src/core/extensions/custom-image/components/toolbar/download.tsx
index 2f0a665ae..97a2241b0 100644
--- a/packages/editor/src/core/extensions/custom-image/components/toolbar/download.tsx
+++ b/packages/editor/src/core/extensions/custom-image/components/toolbar/download.tsx
@@ -6,7 +6,7 @@ type Props = {
   src: string;
 };
 
-export const ImageDownloadAction: React.FC<Props> = (props) => {
+export function ImageDownloadAction(props: Props) {
   const { src } = props;
 
   return (
@@ -21,4 +21,4 @@ export const ImageDownloadAction: React.FC<Props> = (props) => {
       </button>
     </Tooltip>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/custom-image/components/toolbar/full-screen/modal.tsx b/packages/editor/src/core/extensions/custom-image/components/toolbar/full-screen/modal.tsx
index 82e329815..f292f5b27 100644
--- a/packages/editor/src/core/extensions/custom-image/components/toolbar/full-screen/modal.tsx
+++ b/packages/editor/src/core/extensions/custom-image/components/toolbar/full-screen/modal.tsx
@@ -20,7 +20,7 @@ type Props = {
   width: string;
 };
 
-const ImageFullScreenModalWithoutPortal = (props: Props) => {
+function ImageFullScreenModalWithoutPortal(props: Props) {
   const { aspectRatio, isFullScreenEnabled, isTouchDevice, downloadSrc, src, toggleFullScreenMode, width } = props;
   // refs
   const dragStart = useRef({ x: 0, y: 0 });
@@ -289,9 +289,9 @@ const ImageFullScreenModalWithoutPortal = (props: Props) => {
       </div>
     </div>
   );
-};
+}
 
-export const ImageFullScreenModal: React.FC<Props> = (props) => {
+export function ImageFullScreenModal(props: Props) {
   let modal = <ImageFullScreenModalWithoutPortal {...props} />;
   const portal = document.querySelector("#editor-portal");
   if (portal) {
@@ -303,4 +303,4 @@ export const ImageFullScreenModal: React.FC<Props> = (props) => {
     }
   }
   return modal;
-};
+}
diff --git a/packages/editor/src/core/extensions/custom-image/components/toolbar/full-screen/root.tsx b/packages/editor/src/core/extensions/custom-image/components/toolbar/full-screen/root.tsx
index 2d8e73606..23a2246bb 100644
--- a/packages/editor/src/core/extensions/custom-image/components/toolbar/full-screen/root.tsx
+++ b/packages/editor/src/core/extensions/custom-image/components/toolbar/full-screen/root.tsx
@@ -17,7 +17,7 @@ type Props = {
   toggleToolbarViewStatus: (val: boolean) => void;
 };
 
-export const ImageFullScreenActionRoot: React.FC<Props> = (props) => {
+export function ImageFullScreenActionRoot(props: Props) {
   const { image, isTouchDevice, toggleToolbarViewStatus } = props;
   // states
   const [isFullScreenEnabled, setIsFullScreenEnabled] = useState(false);
@@ -55,4 +55,4 @@ export const ImageFullScreenActionRoot: React.FC<Props> = (props) => {
       </Tooltip>
     </>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/custom-image/components/toolbar/root.tsx b/packages/editor/src/core/extensions/custom-image/components/toolbar/root.tsx
index 1011050de..efcca6548 100644
--- a/packages/editor/src/core/extensions/custom-image/components/toolbar/root.tsx
+++ b/packages/editor/src/core/extensions/custom-image/components/toolbar/root.tsx
@@ -20,7 +20,7 @@ type Props = {
   width: string;
 };
 
-export const ImageToolbarRoot: React.FC<Props> = (props) => {
+export function ImageToolbarRoot(props: Props) {
   const { alignment, editor, downloadSrc, handleAlignmentChange, isTouchDevice } = props;
   // states
   const [shouldShowToolbar, setShouldShowToolbar] = useState(false);
@@ -54,4 +54,4 @@ export const ImageToolbarRoot: React.FC<Props> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/custom-image/components/upload-status.tsx b/packages/editor/src/core/extensions/custom-image/components/upload-status.tsx
index 7b6e0a081..2650ac6a2 100644
--- a/packages/editor/src/core/extensions/custom-image/components/upload-status.tsx
+++ b/packages/editor/src/core/extensions/custom-image/components/upload-status.tsx
@@ -7,7 +7,7 @@ type Props = {
   nodeId: string;
 };
 
-export const ImageUploadStatus: React.FC<Props> = (props) => {
+export function ImageUploadStatus(props: Props) {
   const { editor, nodeId } = props;
   // Displayed status that will animate smoothly
   const [displayStatus, setDisplayStatus] = useState(0);
@@ -57,4 +57,4 @@ export const ImageUploadStatus: React.FC<Props> = (props) => {
       {displayStatus}%
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/custom-image/components/uploader.tsx b/packages/editor/src/core/extensions/custom-image/components/uploader.tsx
index 7aedf5d66..722cefcf8 100644
--- a/packages/editor/src/core/extensions/custom-image/components/uploader.tsx
+++ b/packages/editor/src/core/extensions/custom-image/components/uploader.tsx
@@ -23,7 +23,7 @@ type CustomImageUploaderProps = CustomImageNodeViewProps & {
   setIsUploaded: (isUploaded: boolean) => void;
 };
 
-export const CustomImageUploader = (props: CustomImageUploaderProps) => {
+export function CustomImageUploader(props: CustomImageUploaderProps) {
   const {
     editor,
     extension,
@@ -247,4 +247,4 @@ export const CustomImageUploader = (props: CustomImageUploaderProps) => {
       />
     </div>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/custom-image/extension.tsx b/packages/editor/src/core/extensions/custom-image/extension.tsx
index 69efd5c69..941ac6686 100644
--- a/packages/editor/src/core/extensions/custom-image/extension.tsx
+++ b/packages/editor/src/core/extensions/custom-image/extension.tsx
@@ -20,7 +20,7 @@ type Props = {
   isEditable: boolean;
 };
 
-export const CustomImageExtension = (props: Props) => {
+export function CustomImageExtension(props: Props) {
   const { fileHandler, isEditable } = props;
   // derived values
   const { getAssetSrc, getAssetDownloadSrc, restore: restoreImageFn } = fileHandler;
@@ -125,4 +125,4 @@ export const CustomImageExtension = (props: Props) => {
       ));
     },
   });
-};
+}
diff --git a/packages/editor/src/core/extensions/emoji/components/emojis-list.tsx b/packages/editor/src/core/extensions/emoji/components/emojis-list.tsx
index 25b2977e7..df62a97b9 100644
--- a/packages/editor/src/core/extensions/emoji/components/emojis-list.tsx
+++ b/packages/editor/src/core/extensions/emoji/components/emojis-list.tsx
@@ -21,7 +21,10 @@ export type EmojisListDropdownProps = SuggestionProps<EmojiItem, { name: string
   forceOpen?: boolean;
 };
 
-export const EmojisListDropdown = forwardRef<EmojiListRef, EmojisListDropdownProps>((props, ref) => {
+export const EmojisListDropdown = forwardRef(function EmojisListDropdown(
+  props: EmojisListDropdownProps,
+  ref: React.ForwardedRef<EmojiListRef>
+) {
   const { items, command, query, onClose, forceOpen = false } = props;
   // states
   const [selectedIndex, setSelectedIndex] = useState<number>(0);
diff --git a/packages/editor/src/core/extensions/image/extension.tsx b/packages/editor/src/core/extensions/image/extension.tsx
index 2e4036172..61c1421d1 100644
--- a/packages/editor/src/core/extensions/image/extension.tsx
+++ b/packages/editor/src/core/extensions/image/extension.tsx
@@ -24,7 +24,7 @@ type Props = {
   fileHandler: TFileHandler;
 };
 
-export const ImageExtension = (props: Props) => {
+export function ImageExtension(props: Props) {
   const { fileHandler } = props;
   // derived values
   const { getAssetSrc } = fileHandler;
@@ -61,4 +61,4 @@ export const ImageExtension = (props: Props) => {
       ));
     },
   });
-};
+}
diff --git a/packages/editor/src/core/extensions/mentions/extension.tsx b/packages/editor/src/core/extensions/mentions/extension.tsx
index 921667566..fb9205469 100644
--- a/packages/editor/src/core/extensions/mentions/extension.tsx
+++ b/packages/editor/src/core/extensions/mentions/extension.tsx
@@ -9,7 +9,7 @@ import { MentionNodeView } from "./mention-node-view";
 // utils
 import { renderMentionsDropdown } from "./utils";
 
-export const CustomMentionExtension = (props: TMentionHandler) => {
+export function CustomMentionExtension(props: TMentionHandler) {
   const { searchCallback, renderComponent, getMentionedEntityDetails } = props;
   return CustomMentionExtensionConfig.extend({
     addOptions(this) {
@@ -32,4 +32,4 @@ export const CustomMentionExtension = (props: TMentionHandler) => {
       }),
     },
   });
-};
+}
diff --git a/packages/editor/src/core/extensions/mentions/mention-node-view.tsx b/packages/editor/src/core/extensions/mentions/mention-node-view.tsx
index 6be87fb57..a7290b453 100644
--- a/packages/editor/src/core/extensions/mentions/mention-node-view.tsx
+++ b/packages/editor/src/core/extensions/mentions/mention-node-view.tsx
@@ -12,7 +12,7 @@ export type MentionNodeViewProps = NodeViewProps & {
   };
 };
 
-export const MentionNodeView: React.FC<MentionNodeViewProps> = (props) => {
+export function MentionNodeView(props: MentionNodeViewProps) {
   const {
     extension,
     node: { attrs },
@@ -26,4 +26,4 @@ export const MentionNodeView: React.FC<MentionNodeViewProps> = (props) => {
       })}
     </NodeViewWrapper>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/mentions/mentions-list-dropdown.tsx b/packages/editor/src/core/extensions/mentions/mentions-list-dropdown.tsx
index 8e7a64b4b..67989425e 100644
--- a/packages/editor/src/core/extensions/mentions/mentions-list-dropdown.tsx
+++ b/packages/editor/src/core/extensions/mentions/mentions-list-dropdown.tsx
@@ -17,7 +17,7 @@ export type MentionsListDropdownProps = SuggestionProps<TMentionSection, TMentio
     onClose: () => void;
   };
 
-export const MentionsListDropdown = forwardRef((props: MentionsListDropdownProps, ref) => {
+export const MentionsListDropdown = forwardRef(function MentionsListDropdown(props: MentionsListDropdownProps, ref) {
   const { command, query, searchCallback, onClose } = props;
   // states
   const [sections, setSections] = useState<TMentionSection[]>([]);
diff --git a/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx b/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx
index 2285e582a..663c940b7 100644
--- a/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx
+++ b/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx
@@ -233,6 +233,7 @@ export const getSlashCommandFilteredSections =
                 title: color.label,
                 description: "Change text color",
                 searchTerms: ["color", "text", color.label],
+
                 icon: (
                   <ALargeSmall
                     className="size-3.5"
@@ -241,6 +242,7 @@ export const getSlashCommandFilteredSections =
                     }}
                   />
                 ),
+
                 command: ({ editor, range }) => toggleTextColor(color.key, editor, range),
               }) as ISlashCommandItem
           ),
@@ -273,10 +275,12 @@ export const getSlashCommandFilteredSections =
                 description: "Change background color",
                 searchTerms: ["color", "bg", "background", color.label],
                 icon: <ALargeSmall className="size-3.5" />,
+
                 iconContainerStyle: {
                   borderRadius: "4px",
                   backgroundColor: color.backgroundColor,
                 },
+
                 command: ({ editor, range }) => toggleBackgroundColor(color.key, editor, range),
               }) as ISlashCommandItem
           ),
diff --git a/packages/editor/src/core/extensions/slash-commands/command-menu-item.tsx b/packages/editor/src/core/extensions/slash-commands/command-menu-item.tsx
index 52c8d7aec..32943866a 100644
--- a/packages/editor/src/core/extensions/slash-commands/command-menu-item.tsx
+++ b/packages/editor/src/core/extensions/slash-commands/command-menu-item.tsx
@@ -40,7 +40,7 @@ const highlightMatch = (text: string, query: string): React.ReactNode => {
   return text;
 };
 
-export const CommandMenuItem: React.FC<Props> = (props) => {
+export function CommandMenuItem(props: Props) {
   const { isSelected, item, itemIndex, onClick, onMouseEnter, sectionIndex, query } = props;
 
   return (
@@ -63,4 +63,4 @@ export const CommandMenuItem: React.FC<Props> = (props) => {
       {item.badge}
     </button>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/slash-commands/command-menu.tsx b/packages/editor/src/core/extensions/slash-commands/command-menu.tsx
index 7d8bbab38..c5d0eb1cd 100644
--- a/packages/editor/src/core/extensions/slash-commands/command-menu.tsx
+++ b/packages/editor/src/core/extensions/slash-commands/command-menu.tsx
@@ -15,7 +15,7 @@ export type SlashCommandsMenuProps = SuggestionProps<TSlashCommandSection, ISlas
   onClose: () => void;
 };
 
-export const SlashCommandsMenu = forwardRef((props: SlashCommandsMenuProps, ref) => {
+export const SlashCommandsMenu = forwardRef(function SlashCommandsMenu(props: SlashCommandsMenuProps, ref) {
   const { items: sections, command, query, onClose } = props;
   // states
   const [selectedIndex, setSelectedIndex] = useState({
diff --git a/packages/editor/src/core/extensions/slash-commands/root.tsx b/packages/editor/src/core/extensions/slash-commands/root.tsx
index 2bd66471b..11751e27f 100644
--- a/packages/editor/src/core/extensions/slash-commands/root.tsx
+++ b/packages/editor/src/core/extensions/slash-commands/root.tsx
@@ -121,9 +121,10 @@ export type TExtensionProps = Pick<IEditorProps, "disabledExtensions" | "flagged
   additionalOptions?: TSlashCommandAdditionalOption[];
 };
 
-export const SlashCommands = (props: TExtensionProps) =>
-  Command.configure({
+export function SlashCommands(props: TExtensionProps) {
+  return Command.configure({
     suggestion: {
       items: getSlashCommandFilteredSections(props),
     },
   });
+}
diff --git a/packages/editor/src/core/extensions/table/plugins/drag-handles/color-selector.tsx b/packages/editor/src/core/extensions/table/plugins/drag-handles/color-selector.tsx
index 5b8aac23a..6bcdd1b4a 100644
--- a/packages/editor/src/core/extensions/table/plugins/drag-handles/color-selector.tsx
+++ b/packages/editor/src/core/extensions/table/plugins/drag-handles/color-selector.tsx
@@ -35,7 +35,7 @@ const handleBackgroundColorChange = (editor: Editor, color: string | null) => {
 //     .run();
 // };
 
-export const TableDragHandleDropdownColorSelector: React.FC<Props> = (props) => {
+export function TableDragHandleDropdownColorSelector(props: Props) {
   const { editor, onSelect } = props;
 
   return (
@@ -115,4 +115,4 @@ export const TableDragHandleDropdownColorSelector: React.FC<Props> = (props) =>
       </Disclosure.Panel>
     </Disclosure>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/table/plugins/drag-handles/column/drag-handle.tsx b/packages/editor/src/core/extensions/table/plugins/drag-handles/column/drag-handle.tsx
index b285de93a..30d588336 100644
--- a/packages/editor/src/core/extensions/table/plugins/drag-handles/column/drag-handle.tsx
+++ b/packages/editor/src/core/extensions/table/plugins/drag-handles/column/drag-handle.tsx
@@ -45,7 +45,7 @@ export type ColumnDragHandleProps = {
   editor: Editor;
 };
 
-export const ColumnDragHandle: React.FC<ColumnDragHandleProps> = (props) => {
+export function ColumnDragHandle(props: ColumnDragHandleProps) {
   const { col, editor } = props;
   // states
   const [isDropdownOpen, setIsDropdownOpen] = useState(false);
@@ -222,4 +222,4 @@ export const ColumnDragHandle: React.FC<ColumnDragHandleProps> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/table/plugins/drag-handles/column/dropdown.tsx b/packages/editor/src/core/extensions/table/plugins/drag-handles/column/dropdown.tsx
index 937347076..09e2904a3 100644
--- a/packages/editor/src/core/extensions/table/plugins/drag-handles/column/dropdown.tsx
+++ b/packages/editor/src/core/extensions/table/plugins/drag-handles/column/dropdown.tsx
@@ -62,7 +62,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const ColumnOptionsDropdown: React.FC<Props> = (props) => {
+export function ColumnOptionsDropdown(props: Props) {
   const { editor, onClose } = props;
 
   return (
@@ -100,4 +100,4 @@ export const ColumnOptionsDropdown: React.FC<Props> = (props) => {
       ))}
     </>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/table/plugins/drag-handles/row/drag-handle.tsx b/packages/editor/src/core/extensions/table/plugins/drag-handles/row/drag-handle.tsx
index 3aede2205..703a8b8de 100644
--- a/packages/editor/src/core/extensions/table/plugins/drag-handles/row/drag-handle.tsx
+++ b/packages/editor/src/core/extensions/table/plugins/drag-handles/row/drag-handle.tsx
@@ -45,7 +45,7 @@ export type RowDragHandleProps = {
   row: number;
 };
 
-export const RowDragHandle: React.FC<RowDragHandleProps> = (props) => {
+export function RowDragHandle(props: RowDragHandleProps) {
   const { editor, row } = props;
   // states
   const [isDropdownOpen, setIsDropdownOpen] = useState(false);
@@ -221,4 +221,4 @@ export const RowDragHandle: React.FC<RowDragHandleProps> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/table/plugins/drag-handles/row/dropdown.tsx b/packages/editor/src/core/extensions/table/plugins/drag-handles/row/dropdown.tsx
index 377e9f417..1f764f737 100644
--- a/packages/editor/src/core/extensions/table/plugins/drag-handles/row/dropdown.tsx
+++ b/packages/editor/src/core/extensions/table/plugins/drag-handles/row/dropdown.tsx
@@ -62,7 +62,7 @@ type Props = {
   onClose: () => void;
 };
 
-export const RowOptionsDropdown: React.FC<Props> = (props) => {
+export function RowOptionsDropdown(props: Props) {
   const { editor, onClose } = props;
 
   return (
@@ -100,4 +100,4 @@ export const RowOptionsDropdown: React.FC<Props> = (props) => {
       ))}
     </>
   );
-};
+}
diff --git a/packages/editor/src/core/extensions/work-item-embed/extension.tsx b/packages/editor/src/core/extensions/work-item-embed/extension.tsx
index 5b2f51d3c..819214cef 100644
--- a/packages/editor/src/core/extensions/work-item-embed/extension.tsx
+++ b/packages/editor/src/core/extensions/work-item-embed/extension.tsx
@@ -15,8 +15,8 @@ type Props = {
   }) => React.ReactNode;
 };
 
-export const WorkItemEmbedExtension = (props: Props) =>
-  WorkItemEmbedExtensionConfig.extend({
+export function WorkItemEmbedExtension(props: Props) {
+  return WorkItemEmbedExtensionConfig.extend({
     addNodeView() {
       return ReactNodeViewRenderer((issueProps: NodeViewProps) => (
         <NodeViewWrapper>
@@ -29,3 +29,4 @@ export const WorkItemEmbedExtension = (props: Props) =>
       ));
     },
   });
+}
diff --git a/packages/i18n/src/context/index.tsx b/packages/i18n/src/context/index.tsx
index cf8a960fe..22ed0a5e0 100644
--- a/packages/i18n/src/context/index.tsx
+++ b/packages/i18n/src/context/index.tsx
@@ -12,7 +12,7 @@ interface TranslationProviderProps {
 /**
  * Provides the translation store to the application
  */
-export const TranslationProvider: React.FC<TranslationProviderProps> = observer(({ children }) => {
+export const TranslationProvider = observer(function TranslationProvider({ children }: TranslationProviderProps) {
   const [store] = React.useState(() => new TranslationStore());
 
   return <TranslationContext.Provider value={store}>{children}</TranslationContext.Provider>;
diff --git a/packages/propel/src/accordion/accordion.tsx b/packages/propel/src/accordion/accordion.tsx
index 71850e180..7743f73c1 100644
--- a/packages/propel/src/accordion/accordion.tsx
+++ b/packages/propel/src/accordion/accordion.tsx
@@ -30,55 +30,54 @@ export interface AccordionContentProps {
   children: React.ReactNode;
 }
 
-const AccordionRoot: React.FC<AccordionRootProps> = ({
-  defaultValue = [],
-  allowMultiple = false,
-  className = "",
-  children,
-}) => (
-  <BaseAccordion.Root defaultValue={defaultValue} openMultiple={allowMultiple} className={`text-base ${className}`}>
-    {children}
-  </BaseAccordion.Root>
-);
+function AccordionRoot({ defaultValue = [], allowMultiple = false, className = "", children }: AccordionRootProps) {
+  return (
+    <BaseAccordion.Root defaultValue={defaultValue} openMultiple={allowMultiple} className={`text-base ${className}`}>
+      {children}
+    </BaseAccordion.Root>
+  );
+}
 
-const AccordionItem: React.FC<AccordionItemProps> = ({ value, disabled, className = "", children }) => (
-  <BaseAccordion.Item value={value} disabled={disabled} className={`relative ${className}`}>
-    {children}
-  </BaseAccordion.Item>
-);
+function AccordionItem({ value, disabled, className = "", children }: AccordionItemProps) {
+  return (
+    <BaseAccordion.Item value={value} disabled={disabled} className={`relative ${className}`}>
+      {children}
+    </BaseAccordion.Item>
+  );
+}
 
-const AccordionTrigger: React.FC<AccordionTriggerProps> = ({
+function AccordionTrigger({
   className = "",
   icon = <PlusIcon aria-hidden="true" className="transition-all ease-out  group-data-[panel-open]:rotate-45" />,
   iconClassName = "",
   children,
   asChild = false,
-}) => (
-  <BaseAccordion.Header>
-    {asChild ? (
-      <BaseAccordion.Trigger className={`w-full py-2 ${className}`}>{children}</BaseAccordion.Trigger>
-    ) : (
-      <BaseAccordion.Trigger className={`flex w-full items-center justify-between gap-2 py-2 ${className}`}>
-        {children}
-        <span aria-hidden="true" className={`flex-shrink-0 ${iconClassName}`}>
-          {icon}
-        </span>
-      </BaseAccordion.Trigger>
-    )}
-  </BaseAccordion.Header>
-);
+}: AccordionTriggerProps) {
+  return (
+    <BaseAccordion.Header>
+      {asChild ? (
+        <BaseAccordion.Trigger className={`w-full py-2 ${className}`}>{children}</BaseAccordion.Trigger>
+      ) : (
+        <BaseAccordion.Trigger className={`flex w-full items-center justify-between gap-2 py-2 ${className}`}>
+          {children}
+          <span aria-hidden="true" className={`flex-shrink-0 ${iconClassName}`}>
+            {icon}
+          </span>
+        </BaseAccordion.Trigger>
+      )}
+    </BaseAccordion.Header>
+  );
+}
 
-const AccordionContent: React.FC<AccordionContentProps> = ({
-  className = "",
-  contentWrapperClassName = "",
-  children,
-}) => (
-  <BaseAccordion.Panel
-    className={`h-[var(--accordion-panel-height)] overflow-hidden transition-[height] ease-out data-[ending-style]:h-0 data-[starting-style]:h-0 ${className}`}
-  >
-    <div className={`py-2 ${contentWrapperClassName}`}>{children}</div>
-  </BaseAccordion.Panel>
-);
+function AccordionContent({ className = "", contentWrapperClassName = "", children }: AccordionContentProps) {
+  return (
+    <BaseAccordion.Panel
+      className={`h-[var(--accordion-panel-height)] overflow-hidden transition-[height] ease-out data-[ending-style]:h-0 data-[starting-style]:h-0 ${className}`}
+    >
+      <div className={`py-2 ${contentWrapperClassName}`}>{children}</div>
+    </BaseAccordion.Panel>
+  );
+}
 
 export const Accordion = {
   Root: AccordionRoot,
diff --git a/packages/propel/src/animated-counter/animated-counter.tsx b/packages/propel/src/animated-counter/animated-counter.tsx
index 2c377fabc..ed4402adb 100644
--- a/packages/propel/src/animated-counter/animated-counter.tsx
+++ b/packages/propel/src/animated-counter/animated-counter.tsx
@@ -13,7 +13,7 @@ const sizeClasses = {
   lg: "text-base",
 };
 
-export const AnimatedCounter: React.FC<AnimatedCounterProps> = ({ count, className, size = "md" }) => {
+export function AnimatedCounter({ count, className, size = "md" }: AnimatedCounterProps) {
   // states
   const [displayCount, setDisplayCount] = useState(count);
   const [prevCount, setPrevCount] = useState(count);
@@ -92,4 +92,4 @@ export const AnimatedCounter: React.FC<AnimatedCounterProps> = ({ count, classNa
       </span>
     </div>
   );
-};
+}
diff --git a/packages/propel/src/avatar/avatar.tsx b/packages/propel/src/avatar/avatar.tsx
index ec19dbf23..c7e77a3f5 100644
--- a/packages/propel/src/avatar/avatar.tsx
+++ b/packages/propel/src/avatar/avatar.tsx
@@ -79,7 +79,7 @@ export const getBorderRadius = (shape: "circle" | "square") => {
  */
 export const isAValidNumber = (value: unknown): value is number => typeof value === "number" && !Number.isNaN(value);
 
-export const Avatar: React.FC<Props> = (props) => {
+export function Avatar(props: Props) {
   const {
     name,
     fallbackBackgroundColor,
@@ -116,4 +116,4 @@ export const Avatar: React.FC<Props> = (props) => {
       </AvatarPrimitive.Root>
     </div>
   );
-};
+}
diff --git a/packages/propel/src/banner/banner.stories.tsx b/packages/propel/src/banner/banner.stories.tsx
index 70187155a..02b184cee 100644
--- a/packages/propel/src/banner/banner.stories.tsx
+++ b/packages/propel/src/banner/banner.stories.tsx
@@ -33,99 +33,109 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 
 // Sample icons for different variants
-const SuccessIcon = () => (
-  <svg
-    width="20"
-    height="20"
-    viewBox="0 0 24 24"
-    fill="none"
-    stroke="currentColor"
-    strokeWidth="2"
-    strokeLinecap="round"
-    strokeLinejoin="round"
-    className="text-green-600"
-  >
-    <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14" />
-    <polyline points="22 4 12 14.01 9 11.01" />
-  </svg>
-);
-
-const ErrorIcon = () => (
-  <svg
-    width="20"
-    height="20"
-    viewBox="0 0 24 24"
-    fill="none"
-    stroke="currentColor"
-    strokeWidth="2"
-    strokeLinecap="round"
-    strokeLinejoin="round"
-    className="text-red-600"
-  >
-    <circle cx="12" cy="12" r="10" />
-    <line x1="15" y1="9" x2="9" y2="15" />
-    <line x1="9" y1="9" x2="15" y2="15" />
-  </svg>
-);
-
-const WarningIcon = () => (
-  <svg
-    width="20"
-    height="20"
-    viewBox="0 0 24 24"
-    fill="none"
-    stroke="currentColor"
-    strokeWidth="2"
-    strokeLinecap="round"
-    strokeLinejoin="round"
-    className="text-yellow-600"
-  >
-    <path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" />
-    <line x1="12" y1="9" x2="12" y2="13" />
-    <line x1="12" y1="17" x2="12.01" y2="17" />
-  </svg>
-);
-
-const InfoIcon = () => (
-  <svg
-    width="20"
-    height="20"
-    viewBox="0 0 24 24"
-    fill="none"
-    stroke="currentColor"
-    strokeWidth="2"
-    strokeLinecap="round"
-    strokeLinejoin="round"
-    className="text-blue-600"
-  >
-    <circle cx="12" cy="12" r="10" />
-    <line x1="12" y1="16" x2="12" y2="12" />
-    <line x1="12" y1="8" x2="12.01" y2="8" />
-  </svg>
-);
-
-const CloseButton = ({ onClick }: { onClick?: () => void }) => (
-  <button
-    onClick={onClick}
-    className="rounded p-1 hover:bg-black/5 dark:hover:bg-white/5 transition-colors"
-    aria-label="Dismiss"
-  >
+function SuccessIcon() {
+  return (
     <svg
-      width="16"
-      height="16"
+      width="20"
+      height="20"
       viewBox="0 0 24 24"
       fill="none"
       stroke="currentColor"
       strokeWidth="2"
       strokeLinecap="round"
       strokeLinejoin="round"
-      className="text-text-secondary"
+      className="text-green-600"
     >
-      <line x1="18" y1="6" x2="6" y2="18" />
-      <line x1="6" y1="6" x2="18" y2="18" />
+      <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14" />
+      <polyline points="22 4 12 14.01 9 11.01" />
     </svg>
-  </button>
-);
+  );
+}
+
+function ErrorIcon() {
+  return (
+    <svg
+      width="20"
+      height="20"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      className="text-red-600"
+    >
+      <circle cx="12" cy="12" r="10" />
+      <line x1="15" y1="9" x2="9" y2="15" />
+      <line x1="9" y1="9" x2="15" y2="15" />
+    </svg>
+  );
+}
+
+function WarningIcon() {
+  return (
+    <svg
+      width="20"
+      height="20"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      className="text-yellow-600"
+    >
+      <path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" />
+      <line x1="12" y1="9" x2="12" y2="13" />
+      <line x1="12" y1="17" x2="12.01" y2="17" />
+    </svg>
+  );
+}
+
+function InfoIcon() {
+  return (
+    <svg
+      width="20"
+      height="20"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      className="text-blue-600"
+    >
+      <circle cx="12" cy="12" r="10" />
+      <line x1="12" y1="16" x2="12" y2="12" />
+      <line x1="12" y1="8" x2="12.01" y2="8" />
+    </svg>
+  );
+}
+
+function CloseButton({ onClick }: { onClick?: () => void }) {
+  return (
+    <button
+      onClick={onClick}
+      className="rounded p-1 hover:bg-black/5 dark:hover:bg-white/5 transition-colors"
+      aria-label="Dismiss"
+    >
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        strokeWidth="2"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        className="text-text-secondary"
+      >
+        <line x1="18" y1="6" x2="6" y2="18" />
+        <line x1="6" y1="6" x2="18" y2="18" />
+      </svg>
+    </button>
+  );
+}
 
 // ============================================================================
 // Interactive Stories
diff --git a/packages/propel/src/banner/banner.tsx b/packages/propel/src/banner/banner.tsx
index 051cd5c5c..680c1bba1 100644
--- a/packages/propel/src/banner/banner.tsx
+++ b/packages/propel/src/banner/banner.tsx
@@ -28,102 +28,100 @@ export interface BannerProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
   animationDuration?: number;
 }
 
-export const Banner = React.forwardRef<HTMLDivElement, BannerProps>(
-  (
-    {
-      icon,
-      title,
-      action,
-      variant = "info",
-      dismissible = false,
-      onDismiss,
-      visible = true,
-      animationDuration = 200,
-      className,
-      children,
-      ...props
-    },
-    ref
-  ) => {
-    // Handle dismissal
-    const handleDismiss = () => {
-      if (onDismiss) {
-        onDismiss();
-      }
-    };
-
-    // Don't render if not visible
-    if (!visible) {
-      return null;
+export const Banner = React.forwardRef(function Banner(
+  {
+    icon,
+    title,
+    action,
+    variant = "info",
+    dismissible = false,
+    onDismiss,
+    visible = true,
+    animationDuration = 200,
+    className,
+    children,
+    ...props
+  }: BannerProps,
+  ref: React.ForwardedRef<HTMLDivElement>
+) {
+  // Handle dismissal
+  const handleDismiss = () => {
+    if (onDismiss) {
+      onDismiss();
     }
+  };
 
-    // Get styling using helper functions
-    const containerStyling = getBannerStyling(variant);
-    const iconStyling = "flex items-center justify-center flex-shrink-0 size-5";
-    const titleStyling = getBannerTitleStyling();
-    const actionStyling = getBannerActionStyling();
-    const dismissStyling = getBannerDismissStyling();
-    const dismissIconStyling = getBannerDismissIconStyling();
+  // Don't render if not visible
+  if (!visible) {
+    return null;
+  }
 
-    // Render custom icon component if provided
-    const renderIcon = () => {
-      if (icon) {
-        return <div className={cn(iconStyling)}>{icon}</div>;
-      }
-      return null;
-    };
+  // Get styling using helper functions
+  const containerStyling = getBannerStyling(variant);
+  const iconStyling = "flex items-center justify-center flex-shrink-0 size-5";
+  const titleStyling = getBannerTitleStyling();
+  const actionStyling = getBannerActionStyling();
+  const dismissStyling = getBannerDismissStyling();
+  const dismissIconStyling = getBannerDismissIconStyling();
 
-    // Render dismiss button if dismissible
-    const renderDismissButton = () => {
-      if (!dismissible) return null;
+  // Render custom icon component if provided
+  const renderIcon = () => {
+    if (icon) {
+      return <div className={cn(iconStyling)}>{icon}</div>;
+    }
+    return null;
+  };
 
-      return (
-        <button onClick={handleDismiss} className={cn(dismissStyling)} aria-label="Dismiss banner">
-          <svg
-            width="16"
-            height="16"
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth="2"
-            strokeLinecap="round"
-            strokeLinejoin="round"
-            className={cn(dismissIconStyling)}
-          >
-            <line x1="18" y1="6" x2="6" y2="18" />
-            <line x1="6" y1="6" x2="18" y2="18" />
-          </svg>
-        </button>
-      );
-    };
+  // Render dismiss button if dismissible
+  const renderDismissButton = () => {
+    if (!dismissible) return null;
 
     return (
-      <div
-        ref={ref}
-        className={cn(containerStyling, className)}
-        style={{
-          transitionDuration: `${animationDuration}ms`,
-        }}
-        {...props}
-      >
-        {/* Left side: Icon and Title */}
-        <div className="flex items-center gap-3 flex-1 min-w-0">
-          {renderIcon()}
-          {title && <div className={cn(titleStyling)}>{title}</div>}
-          {children}
-        </div>
-
-        {/* Right side: Actions */}
-        {(action || dismissible) && (
-          <div className={cn(actionStyling)}>
-            {action}
-            {renderDismissButton()}
-          </div>
-        )}
-      </div>
+      <button onClick={handleDismiss} className={cn(dismissStyling)} aria-label="Dismiss banner">
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          strokeWidth="2"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          className={cn(dismissIconStyling)}
+        >
+          <line x1="18" y1="6" x2="6" y2="18" />
+          <line x1="6" y1="6" x2="18" y2="18" />
+        </svg>
+      </button>
     );
-  }
-);
+  };
+
+  return (
+    <div
+      ref={ref}
+      className={cn(containerStyling, className)}
+      style={{
+        transitionDuration: `${animationDuration}ms`,
+      }}
+      {...props}
+    >
+      {/* Left side: Icon and Title */}
+      <div className="flex items-center gap-3 flex-1 min-w-0">
+        {renderIcon()}
+        {title && <div className={cn(titleStyling)}>{title}</div>}
+        {children}
+      </div>
+
+      {/* Right side: Actions */}
+      {(action || dismissible) && (
+        <div className={cn(actionStyling)}>
+          {action}
+          {renderDismissButton()}
+        </div>
+      )}
+    </div>
+  );
+});
 
 Banner.displayName = "Banner";
 
diff --git a/packages/propel/src/button/button.tsx b/packages/propel/src/button/button.tsx
index e6c8875d6..45402f257 100644
--- a/packages/propel/src/button/button.tsx
+++ b/packages/propel/src/button/button.tsx
@@ -14,7 +14,7 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
   children: React.ReactNode;
 }
 
-const Button = React.forwardRef<HTMLButtonElement, ButtonProps>((props, ref) => {
+const Button = React.forwardRef(function Button(props: ButtonProps, ref: React.ForwardedRef<HTMLButtonElement>) {
   const {
     variant = "primary",
     size = "md",
diff --git a/packages/propel/src/calendar/root.tsx b/packages/propel/src/calendar/root.tsx
index e29bfd4a8..ddadf8c9e 100644
--- a/packages/propel/src/calendar/root.tsx
+++ b/packages/propel/src/calendar/root.tsx
@@ -8,7 +8,7 @@ import { cn } from "../utils";
 
 export type CalendarProps = React.ComponentProps<typeof DayPicker>;
 
-export const Calendar = ({ className, showOutsideDays = true, ...props }: CalendarProps) => {
+export function Calendar({ className, showOutsideDays = true, ...props }: CalendarProps) {
   const currentYear = new Date().getFullYear();
   const thirtyYearsAgoFirstDay = new Date(currentYear - 30, 0, 1);
   const thirtyYearsFromNowFirstDay = new Date(currentYear + 30, 11, 31);
@@ -35,4 +35,4 @@ export const Calendar = ({ className, showOutsideDays = true, ...props }: Calend
       {...props}
     />
   );
-};
+}
diff --git a/packages/propel/src/card/card.tsx b/packages/propel/src/card/card.tsx
index e17b252eb..90223e2ae 100644
--- a/packages/propel/src/card/card.tsx
+++ b/packages/propel/src/card/card.tsx
@@ -11,7 +11,7 @@ export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
   children: React.ReactNode;
 }
 
-const Card = React.forwardRef<HTMLDivElement, CardProps>((props, ref) => {
+const Card = React.forwardRef(function Card(props: CardProps, ref: React.ForwardedRef<HTMLDivElement>) {
   const {
     variant = ECardVariant.WITH_SHADOW,
     direction = ECardDirection.COLUMN,
diff --git a/packages/propel/src/charts/area-chart/root.tsx b/packages/propel/src/charts/area-chart/root.tsx
index ab12abe57..f171993ec 100644
--- a/packages/propel/src/charts/area-chart/root.tsx
+++ b/packages/propel/src/charts/area-chart/root.tsx
@@ -10,7 +10,9 @@ import { getLegendProps } from "../components/legend";
 import { CustomXAxisTick, CustomYAxisTick } from "../components/tick";
 import { CustomTooltip } from "../components/tooltip";
 
-export const AreaChart = React.memo(<K extends string, T extends string>(props: TAreaChartProps<K, T>) => {
+export const AreaChart = React.memo(function AreaChart<K extends string, T extends string>(
+  props: TAreaChartProps<K, T>
+) {
   const {
     data,
     areas,
diff --git a/packages/propel/src/charts/bar-chart/bar.tsx b/packages/propel/src/charts/bar-chart/bar.tsx
index 1b25acda3..f5887b58e 100644
--- a/packages/propel/src/charts/bar-chart/bar.tsx
+++ b/packages/propel/src/charts/bar-chart/bar.tsx
@@ -54,7 +54,7 @@ const getBarPath = (x: number, y: number, width: number, height: number, topRadi
   Z
 `;
 
-const PercentageText = ({
+function PercentageText({
   x,
   y,
   percentage,
@@ -64,14 +64,16 @@ const PercentageText = ({
   y: number;
   percentage: number;
   className?: string;
-}) => (
-  <text x={x} y={y} textAnchor="middle" className={cn("text-xs font-medium", className)} fill="currentColor">
-    {percentage}%
-  </text>
-);
+}) {
+  return (
+    <text x={x} y={y} textAnchor="middle" className={cn("text-xs font-medium", className)} fill="currentColor">
+      {percentage}%
+    </text>
+  );
+}
 
 // Base Components
-const CustomBar = React.memo((props: TBarProps) => {
+const CustomBar = React.memo(function CustomBar(props: TBarProps) {
   const {
     opacity,
     fill,
@@ -118,7 +120,7 @@ const CustomBar = React.memo((props: TBarProps) => {
   );
 });
 
-const CustomBarLollipop = React.memo((props: TBarProps) => {
+const CustomBarLollipop = React.memo(function CustomBarLollipop(props: TBarProps) {
   const { fill, x, y, width, height, dataKey, stackKeys, payload, textClassName, showPercentage, dotted } = props;
 
   const currentBarPercentage = calculatePercentage(payload, stackKeys, dataKey);
diff --git a/packages/propel/src/charts/bar-chart/root.tsx b/packages/propel/src/charts/bar-chart/root.tsx
index 891ad7b38..616f04cb1 100644
--- a/packages/propel/src/charts/bar-chart/root.tsx
+++ b/packages/propel/src/charts/bar-chart/root.tsx
@@ -23,7 +23,7 @@ import { barShapeVariants } from "./bar";
 
 const DEFAULT_BAR_FILL_COLOR = "#000000";
 
-export const BarChart = React.memo(<K extends string, T extends string>(props: TBarChartProps<K, T>) => {
+export const BarChart = React.memo(function BarChart<K extends string, T extends string>(props: TBarChartProps<K, T>) {
   const {
     data,
     bars,
diff --git a/packages/propel/src/charts/components/legend.tsx b/packages/propel/src/charts/components/legend.tsx
index c631ae89c..7ef2d7a39 100644
--- a/packages/propel/src/charts/components/legend.tsx
+++ b/packages/propel/src/charts/components/legend.tsx
@@ -31,12 +31,12 @@ export const getLegendProps = (args: TChartLegend): LegendProps => {
   };
 };
 
-const CustomLegend = React.forwardRef<
-  HTMLDivElement,
-  React.ComponentProps<"div"> &
+const CustomLegend = React.forwardRef(function CustomLegend(
+  props: React.ComponentProps<"div"> &
     Pick<LegendProps, "payload" | "formatter" | "onClick" | "onMouseEnter" | "onMouseLeave"> &
-    TChartLegend
->((props, ref) => {
+    TChartLegend,
+  ref: React.ForwardedRef<HTMLDivElement>
+) {
   const { formatter, layout, onClick, onMouseEnter, onMouseLeave, payload } = props;
 
   if (!payload?.length) return null;
diff --git a/packages/propel/src/charts/components/tick.tsx b/packages/propel/src/charts/components/tick.tsx
index 1a79ca334..30d92cbd5 100644
--- a/packages/propel/src/charts/components/tick.tsx
+++ b/packages/propel/src/charts/components/tick.tsx
@@ -4,26 +4,38 @@ import React from "react";
 // Common classnames
 const AXIS_TICK_CLASSNAME = "fill-custom-text-300 text-sm";
 
-export const CustomXAxisTick = React.memo<any>(({ x, y, payload, getLabel }: any) => (
-  <g transform={`translate(${x},${y})`}>
-    <text y={0} dy={16} textAnchor="middle" className={AXIS_TICK_CLASSNAME}>
-      {getLabel ? getLabel(payload.value) : payload.value}
-    </text>
-  </g>
-));
+export const CustomXAxisTick = React.memo(function CustomXAxisTick({ x, y, payload, getLabel }: any) {
+  return (
+    <g transform={`translate(${x},${y})`}>
+      <text y={0} dy={16} textAnchor="middle" className={AXIS_TICK_CLASSNAME}>
+        {getLabel ? getLabel(payload.value) : payload.value}
+      </text>
+    </g>
+  );
+});
 CustomXAxisTick.displayName = "CustomXAxisTick";
 
-export const CustomYAxisTick = React.memo<any>(({ x, y, payload }: any) => (
-  <g transform={`translate(${x},${y})`}>
-    <text dx={-10} textAnchor="middle" className={AXIS_TICK_CLASSNAME}>
-      {payload.value}
-    </text>
-  </g>
-));
+export const CustomYAxisTick = React.memo(function CustomYAxisTick({ x, y, payload }: any) {
+  return (
+    <g transform={`translate(${x},${y})`}>
+      <text dx={-10} textAnchor="middle" className={AXIS_TICK_CLASSNAME}>
+        {payload.value}
+      </text>
+    </g>
+  );
+});
 
 CustomYAxisTick.displayName = "CustomYAxisTick";
 
-export const CustomRadarAxisTick = React.memo<any>(({ x, y, payload, getLabel, cx, cy, offset = 16 }: any) => {
+export const CustomRadarAxisTick = React.memo(function CustomRadarAxisTick({
+  x,
+  y,
+  payload,
+  getLabel,
+  cx,
+  cy,
+  offset = 16,
+}: any) {
   // Calculate direction vector from center to tick
   const dx = x - cx;
   const dy = y - cy;
diff --git a/packages/propel/src/charts/components/tooltip.tsx b/packages/propel/src/charts/components/tooltip.tsx
index 6fbc54cfb..830dffb56 100644
--- a/packages/propel/src/charts/components/tooltip.tsx
+++ b/packages/propel/src/charts/components/tooltip.tsx
@@ -13,7 +13,7 @@ type Props = {
   itemDotColors: Record<string, string>;
 };
 
-export const CustomTooltip = React.memo((props: Props) => {
+export const CustomTooltip = React.memo(function CustomTooltip(props: Props) {
   const { active, activeKey, label, payload, itemKeys, itemLabels, itemDotColors } = props;
   // derived values
   const filteredPayload = payload?.filter((item) => item.dataKey && itemKeys.includes(`${item.dataKey}`));
diff --git a/packages/propel/src/charts/line-chart/root.tsx b/packages/propel/src/charts/line-chart/root.tsx
index 8e9c1874c..fcc332df5 100644
--- a/packages/propel/src/charts/line-chart/root.tsx
+++ b/packages/propel/src/charts/line-chart/root.tsx
@@ -20,7 +20,9 @@ import { getLegendProps } from "../components/legend";
 import { CustomXAxisTick, CustomYAxisTick } from "../components/tick";
 import { CustomTooltip } from "../components/tooltip";
 
-export const LineChart = React.memo(<K extends string, T extends string>(props: TLineChartProps<K, T>) => {
+export const LineChart = React.memo(function LineChart<K extends string, T extends string>(
+  props: TLineChartProps<K, T>
+) {
   const {
     data,
     lines,
diff --git a/packages/propel/src/charts/pie-chart/active-shape.tsx b/packages/propel/src/charts/pie-chart/active-shape.tsx
index 347f63923..28e5a873e 100644
--- a/packages/propel/src/charts/pie-chart/active-shape.tsx
+++ b/packages/propel/src/charts/pie-chart/active-shape.tsx
@@ -2,7 +2,7 @@ import React from "react";
 import { Sector } from "recharts";
 import type { PieSectorDataItem } from "recharts/types/polar/Pie";
 
-export const CustomActiveShape = React.memo((props: PieSectorDataItem) => {
+export const CustomActiveShape = React.memo(function CustomActiveShape(props: PieSectorDataItem) {
   const { cx, cy, cornerRadius, innerRadius, outerRadius, startAngle, endAngle, fill } = props;
 
   return (
diff --git a/packages/propel/src/charts/pie-chart/root.tsx b/packages/propel/src/charts/pie-chart/root.tsx
index 528bfca3e..50141cc94 100644
--- a/packages/propel/src/charts/pie-chart/root.tsx
+++ b/packages/propel/src/charts/pie-chart/root.tsx
@@ -9,7 +9,7 @@ import { getLegendProps } from "../components/legend";
 import { CustomActiveShape } from "./active-shape";
 import { CustomPieChartTooltip } from "./tooltip";
 
-export const PieChart = React.memo(<K extends string, T extends string>(props: TPieChartProps<K, T>) => {
+export const PieChart = React.memo(function PieChart<K extends string, T extends string>(props: TPieChartProps<K, T>) {
   const {
     data,
     dataKey,
diff --git a/packages/propel/src/charts/pie-chart/tooltip.tsx b/packages/propel/src/charts/pie-chart/tooltip.tsx
index b79792ee3..d79ded080 100644
--- a/packages/propel/src/charts/pie-chart/tooltip.tsx
+++ b/packages/propel/src/charts/pie-chart/tooltip.tsx
@@ -9,7 +9,7 @@ type Props = {
   payload: Payload<ValueType, NameType>[];
 };
 
-export const CustomPieChartTooltip = React.memo((props: Props) => {
+export const CustomPieChartTooltip = React.memo(function CustomPieChartTooltip(props: Props) {
   const { dotColor, label, payload } = props;
 
   return (
diff --git a/packages/propel/src/charts/radar-chart/root.tsx b/packages/propel/src/charts/radar-chart/root.tsx
index b87320dd1..227c5eb02 100644
--- a/packages/propel/src/charts/radar-chart/root.tsx
+++ b/packages/propel/src/charts/radar-chart/root.tsx
@@ -13,7 +13,7 @@ import { getLegendProps } from "../components/legend";
 import { CustomRadarAxisTick } from "../components/tick";
 import { CustomTooltip } from "../components/tooltip";
 
-const RadarChart = <T extends string, K extends string>(props: TRadarChartProps<T, K>) => {
+function RadarChart<T extends string, K extends string>(props: TRadarChartProps<T, K>) {
   const { data, radars, margin, showTooltip, legend, className, angleAxis } = props;
 
   // states
@@ -90,6 +90,6 @@ const RadarChart = <T extends string, K extends string>(props: TRadarChartProps<
       </ResponsiveContainer>
     </div>
   );
-};
+}
 
 export { RadarChart };
diff --git a/packages/propel/src/charts/scatter-chart/root.tsx b/packages/propel/src/charts/scatter-chart/root.tsx
index 33119662a..2aafc4ac0 100644
--- a/packages/propel/src/charts/scatter-chart/root.tsx
+++ b/packages/propel/src/charts/scatter-chart/root.tsx
@@ -20,7 +20,9 @@ import { getLegendProps } from "../components/legend";
 import { CustomXAxisTick, CustomYAxisTick } from "../components/tick";
 import { CustomTooltip } from "../components/tooltip";
 
-export const ScatterChart = React.memo(<K extends string, T extends string>(props: TScatterChartProps<K, T>) => {
+export const ScatterChart = React.memo(function ScatterChart<K extends string, T extends string>(
+  props: TScatterChartProps<K, T>
+) {
   const {
     data,
     scatterPoints,
diff --git a/packages/propel/src/charts/tree-map/map-content.tsx b/packages/propel/src/charts/tree-map/map-content.tsx
index 1970a45fa..718a52e11 100644
--- a/packages/propel/src/charts/tree-map/map-content.tsx
+++ b/packages/propel/src/charts/tree-map/map-content.tsx
@@ -146,7 +146,7 @@ const truncateText = (text: string | number, maxWidth: number, fontSize: number,
   return `${stringText.slice(0, maxChars - 3)}...`;
 };
 
-export const CustomTreeMapContent: React.FC<any> = ({
+export function CustomTreeMapContent({
   x,
   y,
   width,
@@ -158,7 +158,7 @@ export const CustomTreeMapContent: React.FC<any> = ({
   fillClassName,
   textClassName,
   icon,
-}) => {
+}: any) {
   const dimensions = useMemo(() => {
     const pX = x + LAYOUT.PADDING;
     const pY = y + LAYOUT.PADDING;
@@ -273,4 +273,4 @@ export const CustomTreeMapContent: React.FC<any> = ({
       {renderContent()}
     </g>
   );
-};
+}
diff --git a/packages/propel/src/charts/tree-map/root.tsx b/packages/propel/src/charts/tree-map/root.tsx
index 2e4a734aa..502adbb87 100644
--- a/packages/propel/src/charts/tree-map/root.tsx
+++ b/packages/propel/src/charts/tree-map/root.tsx
@@ -7,7 +7,7 @@ import { cn } from "../../utils/classname";
 import { CustomTreeMapContent } from "./map-content";
 import { TreeMapTooltip } from "./tooltip";
 
-export const TreeMapChart = React.memo((props: TreeMapChartProps) => {
+export const TreeMapChart = React.memo(function TreeMapChart(props: TreeMapChartProps) {
   const { data, className = "w-full h-96", isAnimationActive = false, showTooltip = true } = props;
   return (
     <div className={cn(className)}>
diff --git a/packages/propel/src/charts/tree-map/tooltip.tsx b/packages/propel/src/charts/tree-map/tooltip.tsx
index 17d4893fe..4a65e63a3 100644
--- a/packages/propel/src/charts/tree-map/tooltip.tsx
+++ b/packages/propel/src/charts/tree-map/tooltip.tsx
@@ -7,7 +7,7 @@ interface TreeMapTooltipProps {
   payload: any[] | undefined;
 }
 
-export const TreeMapTooltip = React.memo(({ active, payload }: TreeMapTooltipProps) => {
+export const TreeMapTooltip = React.memo(function TreeMapTooltip({ active, payload }: TreeMapTooltipProps) {
   if (!active || !payload || !payload[0]?.payload) return null;
 
   const data = payload[0].payload;
diff --git a/packages/propel/src/collapsible/collapsible.tsx b/packages/propel/src/collapsible/collapsible.tsx
index ec4077515..2ae842da3 100644
--- a/packages/propel/src/collapsible/collapsible.tsx
+++ b/packages/propel/src/collapsible/collapsible.tsx
@@ -40,7 +40,7 @@ const useCollapsible = () => {
 };
 
 // Components
-const Root: React.FC<RootProps> = ({ children, className, isOpen: controlledIsOpen, onToggle, defaultOpen }) => {
+function Root({ children, className, isOpen: controlledIsOpen, onToggle, defaultOpen }: RootProps) {
   const [localIsOpen, setLocalIsOpen] = useState<boolean>(controlledIsOpen || defaultOpen || false);
 
   useEffect(() => {
@@ -69,9 +69,9 @@ const Root: React.FC<RootProps> = ({ children, className, isOpen: controlledIsOp
       </BaseCollapsible.Root>
     </CollapsibleContext.Provider>
   );
-};
+}
 
-const Trigger: React.FC<TriggerProps> = ({ children, className, buttonRef }) => {
+function Trigger({ children, className, buttonRef }: TriggerProps) {
   const { isOpen } = useCollapsible();
 
   return (
@@ -79,18 +79,20 @@ const Trigger: React.FC<TriggerProps> = ({ children, className, buttonRef }) =>
       {children}
     </BaseCollapsible.Trigger>
   );
-};
+}
 
-const Content: React.FC<ContentProps> = ({ children, className }) => (
-  <BaseCollapsible.Panel
-    className={clsx(
-      "flex h-[var(--collapsible-panel-height)] flex-col overflow-hidden text-sm transition-all ease-out data-[ending-style]:h-0 data-[starting-style]:h-0",
-      className
-    )}
-  >
-    {children}
-  </BaseCollapsible.Panel>
-);
+function Content({ children, className }: ContentProps) {
+  return (
+    <BaseCollapsible.Panel
+      className={clsx(
+        "flex h-[var(--collapsible-panel-height)] flex-col overflow-hidden text-sm transition-all ease-out data-[ending-style]:h-0 data-[starting-style]:h-0",
+        className
+      )}
+    >
+      {children}
+    </BaseCollapsible.Panel>
+  );
+}
 
 // Compound Component
 export const Collapsible = {
diff --git a/packages/propel/src/combobox/combobox.tsx b/packages/propel/src/combobox/combobox.tsx
index e2d6d005f..94b307533 100644
--- a/packages/propel/src/combobox/combobox.tsx
+++ b/packages/propel/src/combobox/combobox.tsx
@@ -90,13 +90,16 @@ function ComboboxRoot({
 }
 
 // Trigger button component
-const ComboboxButton = React.forwardRef<HTMLButtonElement, ComboboxButtonProps>(
-  ({ className, children, disabled = false }, ref) => (
+const ComboboxButton = React.forwardRef(function ComboboxButton(
+  { className, children, disabled = false }: ComboboxButtonProps,
+  ref: React.ForwardedRef<HTMLButtonElement>
+) {
+  return (
     <BaseCombobox.Trigger ref={ref} disabled={disabled} className={className}>
       {children}
     </BaseCombobox.Trigger>
-  )
-);
+  );
+});
 
 // Options popup component
 function ComboboxOptions({
diff --git a/packages/propel/src/context-menu/context-menu.tsx b/packages/propel/src/context-menu/context-menu.tsx
index 60e05f1ba..494cceb67 100644
--- a/packages/propel/src/context-menu/context-menu.tsx
+++ b/packages/propel/src/context-menu/context-menu.tsx
@@ -24,43 +24,53 @@ export interface ContextMenuItemProps extends React.ComponentProps<typeof Contex
   disabled?: boolean;
 }
 
-const ContextMenuRoot = React.forwardRef<React.ElementRef<typeof ContextMenuPrimitive.Root>, ContextMenuProps>(
-  ({ children, ...props }, _ref) => <ContextMenuPrimitive.Root {...props}>{children}</ContextMenuPrimitive.Root>
-);
+const ContextMenuRoot = React.forwardRef(function ContextMenuRoot(
+  { children, ...props }: ContextMenuProps,
+  _ref: React.ForwardedRef<React.ElementRef<typeof ContextMenuPrimitive.Root>>
+) {
+  return <ContextMenuPrimitive.Root {...props}>{children}</ContextMenuPrimitive.Root>;
+});
 
-const ContextMenuTrigger = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.Trigger>,
-  ContextMenuTriggerProps
->(({ className, children, ...props }, ref) => (
-  <ContextMenuPrimitive.Trigger ref={ref} className={cn("outline-none", className)} {...props}>
-    {children}
-  </ContextMenuPrimitive.Trigger>
-));
+const ContextMenuTrigger = React.forwardRef(function ContextMenuTrigger(
+  { className, children, ...props }: ContextMenuTriggerProps,
+  ref: React.ForwardedRef<React.ElementRef<typeof ContextMenuPrimitive.Trigger>>
+) {
+  return (
+    <ContextMenuPrimitive.Trigger ref={ref} className={cn("outline-none", className)} {...props}>
+      {children}
+    </ContextMenuPrimitive.Trigger>
+  );
+});
 
 const ContextMenuPortal = ContextMenuPrimitive.Portal;
 
-const ContextMenuContent = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.Positioner>,
-  ContextMenuContentProps
->(({ className, children, side = "bottom", sideOffset = 4, ...props }, ref) => (
-  <ContextMenuPrimitive.Positioner ref={ref} side={side} sideOffset={sideOffset} {...props}>
-    <ContextMenuPrimitive.Popup
-      className={cn(
-        "z-50 min-w-32 overflow-hidden rounded-md border border-custom-border-200 bg-custom-background-100 p-1 shadow-md",
-        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-        "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
-        "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
-        "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-        className
-      )}
-    >
-      {children}
-    </ContextMenuPrimitive.Popup>
-  </ContextMenuPrimitive.Positioner>
-));
+const ContextMenuContent = React.forwardRef(function ContextMenuContent(
+  { className, children, side = "bottom", sideOffset = 4, ...props }: ContextMenuContentProps,
+  ref: React.ForwardedRef<React.ElementRef<typeof ContextMenuPrimitive.Positioner>>
+) {
+  return (
+    <ContextMenuPrimitive.Positioner ref={ref} side={side} sideOffset={sideOffset} {...props}>
+      <ContextMenuPrimitive.Popup
+        className={cn(
+          "z-50 min-w-32 overflow-hidden rounded-md border border-custom-border-200 bg-custom-background-100 p-1 shadow-md",
+          "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+          "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+          "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
+          "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+          className
+        )}
+      >
+        {children}
+      </ContextMenuPrimitive.Popup>
+    </ContextMenuPrimitive.Positioner>
+  );
+});
 
-const ContextMenuItem = React.forwardRef<React.ElementRef<typeof ContextMenuPrimitive.Item>, ContextMenuItemProps>(
-  ({ className, disabled, children, ...props }, ref) => (
+const ContextMenuItem = React.forwardRef(function ContextMenuItem(
+  { className, disabled, children, ...props }: ContextMenuItemProps,
+  ref: React.ForwardedRef<React.ElementRef<typeof ContextMenuPrimitive.Item>>
+) {
+  return (
     <ContextMenuPrimitive.Item
       ref={ref}
       className={cn(
@@ -74,38 +84,42 @@ const ContextMenuItem = React.forwardRef<React.ElementRef<typeof ContextMenuPrim
     >
       {children}
     </ContextMenuPrimitive.Item>
-  )
-);
+  );
+});
 
-const ContextMenuSeparator = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.Separator>,
-  React.ComponentProps<typeof ContextMenuPrimitive.Separator>
->(({ className, ...props }, ref) => (
-  <ContextMenuPrimitive.Separator
-    ref={ref}
-    className={cn("-mx-1 my-1 h-px bg-custom-border-200", className)}
-    {...props}
-  />
-));
+const ContextMenuSeparator = React.forwardRef(function ContextMenuSeparator(
+  { className, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Separator>,
+  ref: React.ForwardedRef<React.ElementRef<typeof ContextMenuPrimitive.Separator>>
+) {
+  return (
+    <ContextMenuPrimitive.Separator
+      ref={ref}
+      className={cn("-mx-1 my-1 h-px bg-custom-border-200", className)}
+      {...props}
+    />
+  );
+});
 
 const ContextMenuSubmenu = ContextMenuPrimitive.SubmenuRoot;
 
-const ContextMenuSubmenuTrigger = React.forwardRef<
-  React.ElementRef<typeof ContextMenuPrimitive.SubmenuTrigger>,
-  React.ComponentProps<typeof ContextMenuPrimitive.SubmenuTrigger>
->(({ className, children, ...props }, ref) => (
-  <ContextMenuPrimitive.SubmenuTrigger
-    ref={ref}
-    className={cn(
-      "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:outline-none",
-      "focus:bg-custom-background-90 data-[state=open]:bg-custom-background-90",
-      className
-    )}
-    {...props}
-  >
-    {children}
-  </ContextMenuPrimitive.SubmenuTrigger>
-));
+const ContextMenuSubmenuTrigger = React.forwardRef(function ContextMenuSubmenuTrigger(
+  { className, children, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.SubmenuTrigger>,
+  ref: React.ForwardedRef<React.ElementRef<typeof ContextMenuPrimitive.SubmenuTrigger>>
+) {
+  return (
+    <ContextMenuPrimitive.SubmenuTrigger
+      ref={ref}
+      className={cn(
+        "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:outline-none",
+        "focus:bg-custom-background-90 data-[state=open]:bg-custom-background-90",
+        className
+      )}
+      {...props}
+    >
+      {children}
+    </ContextMenuPrimitive.SubmenuTrigger>
+  );
+});
 
 ContextMenuRoot.displayName = "ContextMenu";
 ContextMenuTrigger.displayName = "ContextMenuTrigger";
diff --git a/packages/propel/src/dialog/root.tsx b/packages/propel/src/dialog/root.tsx
index e806f1659..85f84eb21 100644
--- a/packages/propel/src/dialog/root.tsx
+++ b/packages/propel/src/dialog/root.tsx
@@ -47,59 +47,72 @@ const getPositionClassNames = (position: DialogPosition) =>
     "top-8 left-1/2 -translate-x-1/2": position === "top",
   });
 
-const DialogPortal = memo<React.ComponentProps<typeof BaseDialog.Portal>>(({ children, ...props }) => (
-  <BaseDialog.Portal data-slot="dialog-portal" {...props}>
-    {children}
-  </BaseDialog.Portal>
-));
+const DialogPortal = memo(function DialogPortal({ children, ...props }) {
+  return (
+    <BaseDialog.Portal data-slot="dialog-portal" {...props}>
+      {children}
+    </BaseDialog.Portal>
+  );
+});
 DialogPortal.displayName = "DialogPortal";
 
-const DialogOverlay = memo<React.ComponentProps<typeof BaseDialog.Backdrop>>(({ className, ...props }) => (
-  <BaseDialog.Backdrop data-slot="dialog-overlay" className={cn(OVERLAY_CLASSNAME, className)} {...props} />
-));
+const DialogOverlay = memo(function DialogOverlay({ className, ...props }) {
+  return <BaseDialog.Backdrop data-slot="dialog-overlay" className={cn(OVERLAY_CLASSNAME, className)} {...props} />;
+});
 DialogOverlay.displayName = "DialogOverlay";
 
-const DialogComponent = memo<DialogProps>(({ children, ...props }) => (
-  <BaseDialog.Root data-slot="dialog" {...props}>
-    {children}
-  </BaseDialog.Root>
-));
+const DialogComponent = memo(function DialogComponent({ children, ...props }) {
+  return (
+    <BaseDialog.Root data-slot="dialog" {...props}>
+      {children}
+    </BaseDialog.Root>
+  );
+});
 DialogComponent.displayName = "Dialog";
 
-const DialogTrigger = memo<React.ComponentProps<typeof BaseDialog.Trigger>>(({ children, ...props }) => (
-  <BaseDialog.Trigger data-slot="dialog-trigger" {...props}>
-    {children}
-  </BaseDialog.Trigger>
-));
+const DialogTrigger = memo(function DialogTrigger({ children, ...props }) {
+  return (
+    <BaseDialog.Trigger data-slot="dialog-trigger" {...props}>
+      {children}
+    </BaseDialog.Trigger>
+  );
+});
 DialogTrigger.displayName = "DialogTrigger";
 
-const DialogPanel = forwardRef<React.ElementRef<typeof BaseDialog.Popup>, DialogPanelProps>(
-  ({ className, width = EDialogWidth.XXL, children, position = "center", ...props }, ref) => {
-    const positionClassNames = useMemo(() => getPositionClassNames(position), [position]);
-    return (
-      <DialogPortal>
-        <DialogOverlay />
-        <BaseDialog.Popup
-          ref={ref}
-          data-slot="dialog-content"
-          className={cn(BASE_CLASSNAME, positionClassNames, width, className)}
-          role="dialog"
-          aria-modal="true"
-          {...props}
-        >
-          {children}
-        </BaseDialog.Popup>
-      </DialogPortal>
-    );
-  }
-);
+const DialogPanel = forwardRef(function DialogPanel(
+  { className, width = EDialogWidth.XXL, children, position = "center", ...props }: DialogPanelProps,
+  ref: React.ForwardedRef<React.ElementRef<typeof BaseDialog.Popup>>
+) {
+  const positionClassNames = useMemo(() => getPositionClassNames(position), [position]);
+  return (
+    <DialogPortal>
+      <DialogOverlay />
+      <BaseDialog.Popup
+        ref={ref}
+        data-slot="dialog-content"
+        className={cn(BASE_CLASSNAME, positionClassNames, width, className)}
+        role="dialog"
+        aria-modal="true"
+        {...props}
+      >
+        {children}
+      </BaseDialog.Popup>
+    </DialogPortal>
+  );
+});
 DialogPanel.displayName = "DialogPanel";
 
-const DialogTitle = memo<DialogTitleProps>(({ className, children, ...props }) => (
-  <BaseDialog.Title data-slot="dialog-title" className={cn("text-lg leading-none font-semibold", className)} {...props}>
-    {children}
-  </BaseDialog.Title>
-));
+const DialogTitle = memo(function DialogTitle({ className, children, ...props }) {
+  return (
+    <BaseDialog.Title
+      data-slot="dialog-title"
+      className={cn("text-lg leading-none font-semibold", className)}
+      {...props}
+    >
+      {children}
+    </BaseDialog.Title>
+  );
+});
 
 DialogTitle.displayName = "DialogTitle";
 
diff --git a/packages/propel/src/emoji-icon-picker/emoji-picker.tsx b/packages/propel/src/emoji-icon-picker/emoji-picker.tsx
index 9a80d45f5..fcb22d310 100644
--- a/packages/propel/src/emoji-icon-picker/emoji-picker.tsx
+++ b/packages/propel/src/emoji-icon-picker/emoji-picker.tsx
@@ -8,7 +8,7 @@ import type { TCustomEmojiPicker } from "./helper";
 import { emojiToString, EmojiIconPickerTypes } from "./helper";
 import { IconRoot } from "./icon/icon-root";
 
-export const EmojiPicker: React.FC<TCustomEmojiPicker> = (props) => {
+export function EmojiPicker(props: TCustomEmojiPicker) {
   const {
     isOpen,
     handleToggle,
@@ -135,4 +135,4 @@ export const EmojiPicker: React.FC<TCustomEmojiPicker> = (props) => {
       </Popover.Panel>
     </Popover>
   );
-};
+}
diff --git a/packages/propel/src/emoji-icon-picker/emoji/emoji.tsx b/packages/propel/src/emoji-icon-picker/emoji/emoji.tsx
index 024693726..ad9d5e05e 100644
--- a/packages/propel/src/emoji-icon-picker/emoji/emoji.tsx
+++ b/packages/propel/src/emoji-icon-picker/emoji/emoji.tsx
@@ -7,7 +7,7 @@ type EmojiRootProps = {
   searchDisabled?: boolean;
 };
 
-export const EmojiRoot = (props: EmojiRootProps) => {
+export function EmojiRoot(props: EmojiRootProps) {
   const { onChange, searchPlaceholder = "Search", searchDisabled = false } = props;
   return (
     <EmojiPicker.Root
@@ -63,4 +63,4 @@ export const EmojiRoot = (props: EmojiRootProps) => {
       </EmojiPicker.Viewport>
     </EmojiPicker.Root>
   );
-};
+}
diff --git a/packages/propel/src/emoji-icon-picker/icon/icon-root.tsx b/packages/propel/src/emoji-icon-picker/icon/icon-root.tsx
index 640150dfb..bd203bb8e 100644
--- a/packages/propel/src/emoji-icon-picker/icon/icon-root.tsx
+++ b/packages/propel/src/emoji-icon-picker/icon/icon-root.tsx
@@ -12,7 +12,7 @@ type IconRootProps = {
   iconType: "material" | "lucide";
 };
 
-export const IconRoot: React.FC<IconRootProps> = (props) => {
+export function IconRoot(props: IconRootProps) {
   const { defaultColor, onChange, searchDisabled = false, iconType } = props;
   // states
   const [activeColor, setActiveColor] = useState(defaultColor);
@@ -125,4 +125,4 @@ export const IconRoot: React.FC<IconRootProps> = (props) => {
       </div>
     </>
   );
-};
+}
diff --git a/packages/propel/src/emoji-icon-picker/icon/lucide-root.tsx b/packages/propel/src/emoji-icon-picker/icon/lucide-root.tsx
index a67fa70fd..4582195f0 100644
--- a/packages/propel/src/emoji-icon-picker/icon/lucide-root.tsx
+++ b/packages/propel/src/emoji-icon-picker/icon/lucide-root.tsx
@@ -7,7 +7,7 @@ type LucideIconsListProps = {
   query: string;
 };
 
-export const LucideIconsList: React.FC<LucideIconsListProps> = (props) => {
+export function LucideIconsList(props: LucideIconsListProps) {
   const { query, onChange, activeColor } = props;
 
   const filteredArray = LUCIDE_ICONS_LIST.filter((icon) => icon.name.toLowerCase().includes(query.toLowerCase()));
@@ -31,4 +31,4 @@ export const LucideIconsList: React.FC<LucideIconsListProps> = (props) => {
       ))}
     </>
   );
-};
+}
diff --git a/packages/propel/src/emoji-icon-picker/icon/material-root.tsx b/packages/propel/src/emoji-icon-picker/icon/material-root.tsx
index 676d4961f..1b989f27f 100644
--- a/packages/propel/src/emoji-icon-picker/icon/material-root.tsx
+++ b/packages/propel/src/emoji-icon-picker/icon/material-root.tsx
@@ -10,7 +10,7 @@ type MaterialIconListProps = {
   query: string;
 };
 
-export const MaterialIconList: React.FC<MaterialIconListProps> = (props) => {
+export function MaterialIconList(props: MaterialIconListProps) {
   const { query, onChange, activeColor } = props;
 
   const filteredArray = MATERIAL_ICONS_LIST.filter((icon) => icon.name.toLowerCase().includes(query.toLowerCase()));
@@ -52,4 +52,4 @@ export const MaterialIconList: React.FC<MaterialIconListProps> = (props) => {
       ))}
     </>
   );
-};
+}
diff --git a/packages/propel/src/emoji-icon-picker/logo.tsx b/packages/propel/src/emoji-icon-picker/logo.tsx
index 264dc6f03..508385331 100644
--- a/packages/propel/src/emoji-icon-picker/logo.tsx
+++ b/packages/propel/src/emoji-icon-picker/logo.tsx
@@ -17,7 +17,7 @@ type Props = {
   type?: "lucide" | "material";
 };
 
-export const Logo: FC<Props> = (props) => {
+export function Logo(props: Props) {
   const { logo, size = 16, type = "material" } = props;
 
   // destructuring the logo object
@@ -102,4 +102,4 @@ export const Logo: FC<Props> = (props) => {
 
   // if no value, return empty fragment
   return <></>;
-};
+}
diff --git a/packages/propel/src/emoji-reaction/emoji-reaction-picker.tsx b/packages/propel/src/emoji-reaction/emoji-reaction-picker.tsx
index a217151e8..e1cb4740b 100644
--- a/packages/propel/src/emoji-reaction/emoji-reaction-picker.tsx
+++ b/packages/propel/src/emoji-reaction/emoji-reaction-picker.tsx
@@ -22,7 +22,7 @@ export interface EmojiReactionPickerProps {
   align?: TAlign;
 }
 
-export const EmojiReactionPicker: React.FC<EmojiReactionPickerProps> = (props) => {
+export function EmojiReactionPicker(props: EmojiReactionPickerProps) {
   const {
     isOpen,
     handleToggle,
@@ -83,4 +83,4 @@ export const EmojiReactionPicker: React.FC<EmojiReactionPickerProps> = (props) =
       </Popover.Panel>
     </Popover>
   );
-};
+}
diff --git a/packages/propel/src/emoji-reaction/emoji-reaction.tsx b/packages/propel/src/emoji-reaction/emoji-reaction.tsx
index 898fe894b..4f1b9c50a 100644
--- a/packages/propel/src/emoji-reaction/emoji-reaction.tsx
+++ b/packages/propel/src/emoji-reaction/emoji-reaction.tsx
@@ -36,57 +36,70 @@ export interface EmojiReactionButtonProps extends React.ButtonHTMLAttributes<HTM
   className?: string;
 }
 
-const EmojiReaction = React.forwardRef<HTMLButtonElement, EmojiReactionProps>(
-  ({ emoji, count, reacted = false, users = [], onReactionClick, className, showCount = true, ...props }, ref) => {
-    const handleClick = () => {
-      onReactionClick?.(emoji);
-    };
+const EmojiReaction = React.forwardRef(function EmojiReaction(
+  {
+    emoji,
+    count,
+    reacted = false,
+    users = [],
+    onReactionClick,
+    className,
+    showCount = true,
+    ...props
+  }: EmojiReactionProps,
+  ref: React.ForwardedRef<HTMLButtonElement>
+) {
+  const handleClick = () => {
+    onReactionClick?.(emoji);
+  };
 
-    const tooltipContent = React.useMemo(() => {
-      if (!users.length) return null;
+  const tooltipContent = React.useMemo(() => {
+    if (!users.length) return null;
 
-      const displayUsers = users.slice(0, 5);
-      const remainingCount = users.length - displayUsers.length;
+    const displayUsers = users.slice(0, 5);
+    const remainingCount = users.length - displayUsers.length;
 
-      return (
-        <div className="text-xs">
-          <div className="font-medium mb-1">{stringToEmoji(emoji)}</div>
-          <div>
-            {displayUsers.join(", ")}
-            {remainingCount > 0 && ` and ${remainingCount} more`}
-          </div>
+    return (
+      <div className="text-xs">
+        <div className="font-medium mb-1">{stringToEmoji(emoji)}</div>
+        <div>
+          {displayUsers.join(", ")}
+          {remainingCount > 0 && ` and ${remainingCount} more`}
         </div>
-      );
-    }, [emoji, users]);
-
-    const button = (
-      <button
-        ref={ref}
-        onClick={handleClick}
-        className={cn(
-          "inline-flex items-center rounded-full border px-1.5 text-xs gap-0.5 transition-all duration-200",
-          reacted
-            ? "bg-custom-primary-100/10 border-custom-primary-100 text-custom-primary-100"
-            : "bg-custom-background-100 border-custom-border-200 text-custom-text-300 hover:border-custom-border-300 hover:bg-custom-background-90",
-          className
-        )}
-        {...props}
-      >
-        <span className="text-base leading-unset">{emoji}</span>
-        {showCount && count > 0 && <AnimatedCounter count={count} size="sm" className="text-xs leading-normal" />}
-      </button>
+      </div>
     );
+  }, [emoji, users]);
 
-    if (tooltipContent && users.length > 0) {
-      return <Tooltip tooltipContent={tooltipContent}>{button}</Tooltip>;
-    }
+  const button = (
+    <button
+      ref={ref}
+      onClick={handleClick}
+      className={cn(
+        "inline-flex items-center rounded-full border px-1.5 text-xs gap-0.5 transition-all duration-200",
+        reacted
+          ? "bg-custom-primary-100/10 border-custom-primary-100 text-custom-primary-100"
+          : "bg-custom-background-100 border-custom-border-200 text-custom-text-300 hover:border-custom-border-300 hover:bg-custom-background-90",
+        className
+      )}
+      {...props}
+    >
+      <span className="text-base leading-unset">{emoji}</span>
+      {showCount && count > 0 && <AnimatedCounter count={count} size="sm" className="text-xs leading-normal" />}
+    </button>
+  );
 
-    return button;
+  if (tooltipContent && users.length > 0) {
+    return <Tooltip tooltipContent={tooltipContent}>{button}</Tooltip>;
   }
-);
 
-const EmojiReactionButton = React.forwardRef<HTMLButtonElement, EmojiReactionButtonProps>(
-  ({ onAddReaction, className, ...props }, ref) => (
+  return button;
+});
+
+const EmojiReactionButton = React.forwardRef(function EmojiReactionButton(
+  { onAddReaction, className, ...props }: EmojiReactionButtonProps,
+  ref: React.ForwardedRef<HTMLButtonElement>
+) {
+  return (
     <button
       ref={ref}
       onClick={onAddReaction}
@@ -103,14 +116,22 @@ const EmojiReactionButton = React.forwardRef<HTMLButtonElement, EmojiReactionBut
     >
       <AddReactionIcon className="h-3 w-3" />
     </button>
-  )
-);
+  );
+});
 
-const EmojiReactionGroup = React.forwardRef<HTMLDivElement, EmojiReactionGroupProps>(
-  (
-    { reactions, onReactionClick, onAddReaction, className, showAddButton = true, maxDisplayUsers = 5, ...props },
-    ref
-  ) => (
+const EmojiReactionGroup = React.forwardRef(function EmojiReactionGroup(
+  {
+    reactions,
+    onReactionClick,
+    onAddReaction,
+    className,
+    showAddButton = true,
+    maxDisplayUsers = 5,
+    ...props
+  }: EmojiReactionGroupProps,
+  ref: React.ForwardedRef<HTMLDivElement>
+) {
+  return (
     <div ref={ref} className={cn("flex flex-wrap items-center gap-2", className)} {...props}>
       {reactions.map((reaction, index) => (
         <EmojiReaction
@@ -124,8 +145,8 @@ const EmojiReactionGroup = React.forwardRef<HTMLDivElement, EmojiReactionGroupPr
       ))}
       {showAddButton && <EmojiReactionButton onAddReaction={onAddReaction} />}
     </div>
-  )
-);
+  );
+});
 
 EmojiReaction.displayName = "EmojiReaction";
 EmojiReactionButton.displayName = "EmojiReactionButton";
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx
index ff11731e8..dbe8e38a2 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const CustomerHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="81" height="91" viewBox="0 0 81 91" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function CustomerHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="81"
+      height="91"
+      viewBox="0 0 81 91"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M47.8782 2.57309C46.9628 2.10751 45.787 2.14718 44.5087 2.79426L9.267 20.7542C6.37097 22.2299 4.0195 26.2861 4.0195 29.8055V72.6934C4.0195 74.6583 4.74547 76.0394 5.88968 76.6313L2.37019 74.84C1.22598 74.256 0.5 72.867 0.5 70.9021V28.0142C0.5 24.4869 2.85157 20.4386 5.7476 18.9629L40.9893 1.00296C42.2755 0.347996 43.4513 0.316215 44.3588 0.781791L47.8782 2.57309Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M47.878 2.57281C49.0222 3.15675 49.7482 4.54577 49.7482 6.51066V49.3986C49.7482 52.9259 47.3966 56.9742 44.5006 58.4498L9.25889 76.4102C7.97264 77.0652 6.79695 77.0966 5.88947 76.631C4.74526 76.0471 4.01929 74.658 4.01929 72.6931V29.8052C4.01929 26.2779 6.37076 22.2296 9.26679 20.754L44.5085 2.79397C45.7947 2.13901 46.9705 2.10723 47.878 2.57281Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M63.2578 9.36801C62.3425 8.90244 61.1667 8.94211 59.8883 9.58918L24.6466 27.5492C21.7506 29.0248 19.3991 33.081 19.3991 36.6004V79.4887C19.3991 81.4536 20.1251 82.8344 21.2693 83.4262L17.7498 81.6349C16.6056 81.0509 15.8796 79.6623 15.8796 77.6974V34.8091C15.8796 31.2818 18.2312 27.2335 21.1272 25.7579L56.3689 7.79788C57.6552 7.14292 58.8309 7.11114 59.7384 7.57671L63.2578 9.36801Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M63.2584 9.36578C64.4026 9.94972 65.1285 11.3387 65.1285 13.3036V56.1919C65.1285 59.7192 62.777 63.7672 59.8809 65.2428L24.6394 83.2032C23.3531 83.8581 22.1773 83.8895 21.2698 83.424C20.1256 82.84 19.3997 81.4514 19.3997 79.4865V36.5982C19.3997 33.0709 21.7511 29.0226 24.6472 27.5469L59.8888 9.58694C61.1751 8.93198 62.3509 8.9002 63.2584 9.36578Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M47.8782 2.57309C46.9628 2.10751 45.787 2.14718 44.5087 2.79426L9.267 20.7542C6.37097 22.2299 4.0195 26.2861 4.0195 29.8055V72.6934C4.0195 74.6583 4.74547 76.0394 5.88968 76.6313L2.37019 74.84C1.22598 74.256 0.5 72.867 0.5 70.9021V28.0142C0.5 24.4869 2.85157 20.4386 5.7476 18.9629L40.9893 1.00296C42.2755 0.347996 43.4513 0.316215 44.3588 0.781791L47.8782 2.57309Z"
+        d="M78.6299 16.1631C77.7145 15.6975 76.5387 15.7368 75.2604 16.3839L40.0188 34.3442C37.1228 35.8199 34.7712 39.8757 34.7712 43.3951V86.2834C34.7712 88.2483 35.4972 89.6294 36.6414 90.2213L33.122 88.43C31.9778 87.846 31.2517 86.457 31.2517 84.4921V41.6038C31.2517 38.0765 33.6033 34.0286 36.4993 32.5529L71.741 14.5926C73.0272 13.9376 74.203 13.9062 75.1105 14.3718L78.6299 16.1631Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -13,53 +56,19 @@ export const CustomerHorizontalStackIllustration = ({ className }: TIllustration
         strokeLinejoin="round"
       />
       <path
-        d="M47.878 2.57281C49.0222 3.15675 49.7482 4.54577 49.7482 6.51066V49.3986C49.7482 52.9259 47.3966 56.9742 44.5006 58.4498L9.25889 76.4102C7.97264 77.0652 6.79695 77.0966 5.88947 76.631C4.74526 76.0471 4.01929 74.658 4.01929 72.6931V29.8052C4.01929 26.2779 6.37076 22.2296 9.26679 20.754L44.5085 2.79397C45.7947 2.13901 46.9705 2.10723 47.878 2.57281Z"
+        d="M78.6299 16.1609C79.7741 16.7448 80.5001 18.1334 80.5001 20.0983V62.9866C80.5001 66.5139 78.1486 70.5622 75.2525 72.0379L40.0109 89.9979C38.7247 90.6528 37.5489 90.6846 36.6414 90.219C35.4972 89.6351 34.7712 88.2461 34.7712 86.2812V43.3929C34.7712 39.8656 37.1228 35.8177 40.0188 34.342L75.2604 16.3816C76.5467 15.7267 77.7225 15.6953 78.6299 16.1609Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M63.2578 9.36801C62.3425 8.90244 61.1667 8.94211 59.8883 9.58918L24.6466 27.5492C21.7506 29.0248 19.3991 33.081 19.3991 36.6004V79.4887C19.3991 81.4536 20.1251 82.8344 21.2693 83.4262L17.7498 81.6349C16.6056 81.0509 15.8796 79.6623 15.8796 77.6974V34.8091C15.8796 31.2818 18.2312 27.2335 21.1272 25.7579L56.3689 7.79788C57.6552 7.14292 58.8309 7.11114 59.7384 7.57671L63.2578 9.36801Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M46.6233 45.5414C46.6233 44.9023 47.0494 44.1683 47.5702 43.9L62.7685 36.1588C63.2893 35.8905 63.7154 36.1904 63.7154 36.8296C63.7154 37.4688 63.2893 38.2027 62.7685 38.471V43.0951L70.3676 39.2205C70.8884 38.9522 71.3145 39.2521 71.3145 39.8913C71.3145 40.5305 70.8884 41.2644 70.3676 41.5327V60.0294L71.3145 59.5482C71.8353 59.2799 72.2615 59.5798 72.2615 60.219C72.2615 60.8582 71.8353 61.5917 71.3145 61.86L46.6154 74.4465C46.0946 74.7148 45.6685 74.4149 45.6685 73.7757C45.6685 73.1365 46.0946 72.4026 46.6154 72.1343L47.5623 71.653V46.22C47.0415 46.4883 46.6154 46.1883 46.6154 45.5492L46.6233 45.5414ZM49.472 45.2417V70.6747L51.3737 69.7041V65.6557C51.3737 64.0617 52.439 62.2233 53.7489 61.5525L56.5977 60.1003C57.9076 59.4296 58.9728 60.1874 58.9728 61.7814V65.8295L60.8746 64.8589V39.4258L49.4799 45.2336L49.472 45.2417ZM62.7764 45.4074V63.9041L68.4738 61V42.5033L62.7764 45.4074ZM57.0712 66.8001V62.752C57.0712 62.4364 56.8581 62.2863 56.5977 62.4126L53.7489 63.8644C53.4885 63.9985 53.2755 64.3695 53.2755 64.6851V68.7332L57.0712 66.8001ZM51.3737 48.9029C51.3737 48.2637 51.7999 47.5298 52.3207 47.2615L53.2676 46.7802C53.7884 46.5119 54.2146 46.8119 54.2146 47.451C54.2146 48.0902 53.7884 48.8242 53.2676 49.0925L52.3207 49.5737C51.7999 49.842 51.3737 49.5421 51.3737 48.9029ZM56.1242 46.4804C56.1242 45.8413 56.5503 45.1073 57.0712 44.839L58.018 44.3578C58.5389 44.0895 58.965 44.3894 58.965 45.0286C58.965 45.6678 58.5389 46.4013 58.018 46.6696L57.0712 47.1513C56.5503 47.4196 56.1242 47.1196 56.1242 46.4804ZM51.3737 53.5273C51.3737 52.8882 51.7999 52.1542 52.3207 51.8859L53.2676 51.4043C53.7884 51.136 54.2146 51.4359 54.2146 52.0751C54.2146 52.7143 53.7884 53.4482 53.2676 53.7165L52.3207 54.1978C51.7999 54.4661 51.3737 54.1665 51.3737 53.5273ZM56.1242 51.1045C56.1242 50.4653 56.5503 49.7314 57.0712 49.4631L58.018 48.9819C58.5389 48.7136 58.965 49.0135 58.965 49.6527C58.965 50.2919 58.5389 51.0258 58.018 51.2941L57.0712 51.7754C56.5503 52.0436 56.1242 51.7437 56.1242 51.1045ZM64.6703 49.0609C64.6703 48.4217 65.0964 47.6877 65.6172 47.4194H65.6251C66.1459 47.1433 66.572 47.4509 66.572 48.0822V48.098C66.572 48.7372 66.1459 49.4711 65.6251 49.7394H65.6172C65.0964 50.0156 64.6703 49.7079 64.6703 49.0767V49.0609ZM51.3737 58.1433C51.3737 57.5042 51.7999 56.7702 52.3207 56.5019L53.2676 56.0207C53.7884 55.7524 54.2146 56.0523 54.2146 56.6915C54.2146 57.3307 53.7884 58.0646 53.2676 58.3329L52.3207 58.8142C51.7999 59.0825 51.3737 58.7825 51.3737 58.1433ZM56.1242 55.7286C56.1242 55.0894 56.5503 54.3559 57.0712 54.0876L58.018 53.606C58.5389 53.3377 58.965 53.6376 58.965 54.2768C58.965 54.916 58.5389 55.6499 58.018 55.9182L57.0712 56.3994C56.5503 56.6677 56.1242 56.3678 56.1242 55.7286ZM64.6703 53.6849C64.6703 53.0458 65.0964 52.3118 65.6172 52.0435H65.6251C66.1459 51.7673 66.572 52.0754 66.572 52.7066V52.7224C66.572 53.3616 66.1459 54.0952 65.6251 54.3635H65.6172C65.0964 54.6397 64.6703 54.332 64.6703 53.7007V53.6849ZM64.6703 58.309C64.6703 57.6698 65.0964 56.9363 65.6172 56.668H65.6251C66.1459 56.3918 66.572 56.6994 66.572 57.3307V57.3465C66.572 57.9857 66.1459 58.7196 65.6251 58.9879H65.6172C65.0964 59.2641 64.6703 58.9561 64.6703 58.3248V58.309Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-      <path
-        d="M63.2584 9.36578C64.4026 9.94972 65.1285 11.3387 65.1285 13.3036V56.1919C65.1285 59.7192 62.777 63.7672 59.8809 65.2428L24.6394 83.2032C23.3531 83.8581 22.1773 83.8895 21.2698 83.424C20.1256 82.84 19.3997 81.4514 19.3997 79.4865V36.5982C19.3997 33.0709 21.7511 29.0226 24.6472 27.5469L59.8888 9.58694C61.1751 8.93198 62.3509 8.9002 63.2584 9.36578Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </g>
-    <path
-      d="M78.6299 16.1631C77.7145 15.6975 76.5387 15.7368 75.2604 16.3839L40.0188 34.3442C37.1228 35.8199 34.7712 39.8757 34.7712 43.3951V86.2834C34.7712 88.2483 35.4972 89.6294 36.6414 90.2213L33.122 88.43C31.9778 87.846 31.2517 86.457 31.2517 84.4921V41.6038C31.2517 38.0765 33.6033 34.0286 36.4993 32.5529L71.741 14.5926C73.0272 13.9376 74.203 13.9062 75.1105 14.3718L78.6299 16.1631Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M78.6299 16.1609C79.7741 16.7448 80.5001 18.1334 80.5001 20.0983V62.9866C80.5001 66.5139 78.1486 70.5622 75.2525 72.0379L40.0109 89.9979C38.7247 90.6528 37.5489 90.6846 36.6414 90.219C35.4972 89.6351 34.7712 88.2461 34.7712 86.2812V43.3929C34.7712 39.8656 37.1228 35.8177 40.0188 34.342L75.2604 16.3816C76.5467 15.7267 77.7225 15.6953 78.6299 16.1609Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M46.6233 45.5414C46.6233 44.9023 47.0494 44.1683 47.5702 43.9L62.7685 36.1588C63.2893 35.8905 63.7154 36.1904 63.7154 36.8296C63.7154 37.4688 63.2893 38.2027 62.7685 38.471V43.0951L70.3676 39.2205C70.8884 38.9522 71.3145 39.2521 71.3145 39.8913C71.3145 40.5305 70.8884 41.2644 70.3676 41.5327V60.0294L71.3145 59.5482C71.8353 59.2799 72.2615 59.5798 72.2615 60.219C72.2615 60.8582 71.8353 61.5917 71.3145 61.86L46.6154 74.4465C46.0946 74.7148 45.6685 74.4149 45.6685 73.7757C45.6685 73.1365 46.0946 72.4026 46.6154 72.1343L47.5623 71.653V46.22C47.0415 46.4883 46.6154 46.1883 46.6154 45.5492L46.6233 45.5414ZM49.472 45.2417V70.6747L51.3737 69.7041V65.6557C51.3737 64.0617 52.439 62.2233 53.7489 61.5525L56.5977 60.1003C57.9076 59.4296 58.9728 60.1874 58.9728 61.7814V65.8295L60.8746 64.8589V39.4258L49.4799 45.2336L49.472 45.2417ZM62.7764 45.4074V63.9041L68.4738 61V42.5033L62.7764 45.4074ZM57.0712 66.8001V62.752C57.0712 62.4364 56.8581 62.2863 56.5977 62.4126L53.7489 63.8644C53.4885 63.9985 53.2755 64.3695 53.2755 64.6851V68.7332L57.0712 66.8001ZM51.3737 48.9029C51.3737 48.2637 51.7999 47.5298 52.3207 47.2615L53.2676 46.7802C53.7884 46.5119 54.2146 46.8119 54.2146 47.451C54.2146 48.0902 53.7884 48.8242 53.2676 49.0925L52.3207 49.5737C51.7999 49.842 51.3737 49.5421 51.3737 48.9029ZM56.1242 46.4804C56.1242 45.8413 56.5503 45.1073 57.0712 44.839L58.018 44.3578C58.5389 44.0895 58.965 44.3894 58.965 45.0286C58.965 45.6678 58.5389 46.4013 58.018 46.6696L57.0712 47.1513C56.5503 47.4196 56.1242 47.1196 56.1242 46.4804ZM51.3737 53.5273C51.3737 52.8882 51.7999 52.1542 52.3207 51.8859L53.2676 51.4043C53.7884 51.136 54.2146 51.4359 54.2146 52.0751C54.2146 52.7143 53.7884 53.4482 53.2676 53.7165L52.3207 54.1978C51.7999 54.4661 51.3737 54.1665 51.3737 53.5273ZM56.1242 51.1045C56.1242 50.4653 56.5503 49.7314 57.0712 49.4631L58.018 48.9819C58.5389 48.7136 58.965 49.0135 58.965 49.6527C58.965 50.2919 58.5389 51.0258 58.018 51.2941L57.0712 51.7754C56.5503 52.0436 56.1242 51.7437 56.1242 51.1045ZM64.6703 49.0609C64.6703 48.4217 65.0964 47.6877 65.6172 47.4194H65.6251C66.1459 47.1433 66.572 47.4509 66.572 48.0822V48.098C66.572 48.7372 66.1459 49.4711 65.6251 49.7394H65.6172C65.0964 50.0156 64.6703 49.7079 64.6703 49.0767V49.0609ZM51.3737 58.1433C51.3737 57.5042 51.7999 56.7702 52.3207 56.5019L53.2676 56.0207C53.7884 55.7524 54.2146 56.0523 54.2146 56.6915C54.2146 57.3307 53.7884 58.0646 53.2676 58.3329L52.3207 58.8142C51.7999 59.0825 51.3737 58.7825 51.3737 58.1433ZM56.1242 55.7286C56.1242 55.0894 56.5503 54.3559 57.0712 54.0876L58.018 53.606C58.5389 53.3377 58.965 53.6376 58.965 54.2768C58.965 54.916 58.5389 55.6499 58.018 55.9182L57.0712 56.3994C56.5503 56.6677 56.1242 56.3678 56.1242 55.7286ZM64.6703 53.6849C64.6703 53.0458 65.0964 52.3118 65.6172 52.0435H65.6251C66.1459 51.7673 66.572 52.0754 66.572 52.7066V52.7224C66.572 53.3616 66.1459 54.0952 65.6251 54.3635H65.6172C65.0964 54.6397 64.6703 54.332 64.6703 53.7007V53.6849ZM64.6703 58.309C64.6703 57.6698 65.0964 56.9363 65.6172 56.668H65.6251C66.1459 56.3918 66.572 56.6994 66.572 57.3307V57.3465C66.572 57.9857 66.1459 58.7196 65.6251 58.9879H65.6172C65.0964 59.2641 64.6703 58.9561 64.6703 58.3248V58.309Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx
index e35f9ec83..037d7ef85 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const EpicHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="81" height="92" viewBox="0 0 81 92" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function EpicHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="81"
+      height="92"
+      viewBox="0 0 81 92"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M47.8729 3.07316C46.9576 2.60763 45.782 2.6473 44.5038 3.2943L9.26602 21.2523C6.37031 22.7277 4.01901 26.7835 4.01901 30.3025V73.1855C4.01901 75.1502 4.7449 76.5312 5.88899 77.1229L2.36998 75.3318C1.2259 74.748 0.5 73.3595 0.5 71.3948V28.5114C0.5 24.9845 2.8513 20.9366 5.74701 19.4612L40.9848 1.5032C42.2709 0.848314 43.4464 0.816538 44.3538 1.28206L47.8729 3.07316Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M47.8722 3.07317C49.0163 3.65704 49.7422 5.04591 49.7422 7.01057V49.894C49.7422 53.4209 47.3909 57.4684 44.4952 58.9439L9.25743 76.9022C7.97132 77.5571 6.79566 77.5885 5.88829 77.1229C4.74421 76.5391 4.01831 75.1502 4.01831 73.1855V30.3025C4.01831 26.7756 6.36962 22.7277 9.26533 21.2523L44.5031 3.29431C45.7892 2.63942 46.9648 2.60764 47.8722 3.07317Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M63.2511 9.86669C62.3358 9.40117 61.1602 9.44084 59.8819 10.0878L24.6442 28.0458C21.7485 29.5213 19.3972 33.577 19.3972 37.096V79.9795C19.3972 81.9441 20.1231 83.3247 21.2672 83.9165L17.7482 82.1254C16.6041 81.5415 15.8782 80.153 15.8782 78.1884V35.3049C15.8782 31.778 18.2295 27.7302 21.1252 26.2547L56.3629 8.29674C57.649 7.64185 58.8246 7.61046 59.732 8.07598L63.2511 9.86669Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M63.2519 9.86653C64.3959 10.4504 65.1218 11.8393 65.1218 13.8039V56.6874C65.1218 60.2143 62.7705 64.2617 59.8748 65.7372L24.6371 83.6956C23.351 84.3504 22.1753 84.3818 21.2679 83.9163C20.1238 83.3324 19.3979 81.944 19.3979 79.9793V37.0959C19.3979 33.569 21.7493 29.5211 24.645 28.0456L59.8827 10.0877C61.1688 9.43279 62.3445 9.40101 63.2519 9.86653Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M47.8729 3.07316C46.9576 2.60763 45.782 2.6473 44.5038 3.2943L9.26602 21.2523C6.37031 22.7277 4.01901 26.7835 4.01901 30.3025V73.1855C4.01901 75.1502 4.7449 76.5312 5.88899 77.1229L2.36998 75.3318C1.2259 74.748 0.5 73.3595 0.5 71.3948V28.5114C0.5 24.9845 2.8513 20.9366 5.74701 19.4612L40.9848 1.5032C42.2709 0.848314 43.4464 0.816538 44.3538 1.28206L47.8729 3.07316Z"
+        d="M78.6293 16.668C77.714 16.2025 76.5383 16.2421 75.2601 16.8891L40.0224 34.8471C37.1267 36.3225 34.7755 40.3783 34.7755 43.8973V86.7807C34.7755 88.7454 35.5013 90.126 36.6454 90.7178L33.1263 88.9267C31.9822 88.3428 31.2563 86.9543 31.2563 84.9896V42.1062C31.2563 38.5793 33.6077 34.5314 36.5034 33.056L71.7411 15.098C73.0272 14.4431 74.2029 14.4114 75.1102 14.8769L78.6293 16.668Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -13,51 +56,17 @@ export const EpicHorizontalStackIllustration = ({ className }: TIllustrationAsse
         strokeLinejoin="round"
       />
       <path
-        d="M47.8722 3.07317C49.0163 3.65704 49.7422 5.04591 49.7422 7.01057V49.894C49.7422 53.4209 47.3909 57.4684 44.4952 58.9439L9.25743 76.9022C7.97132 77.5571 6.79566 77.5885 5.88829 77.1229C4.74421 76.5391 4.01831 75.1502 4.01831 73.1855V30.3025C4.01831 26.7756 6.36962 22.7277 9.26533 21.2523L44.5031 3.29431C45.7892 2.63942 46.9648 2.60764 47.8722 3.07317Z"
+        d="M78.6299 16.668C79.774 17.2519 80.4999 18.6407 80.4999 20.6054V63.4888C80.4999 67.0157 78.1486 71.0632 75.2529 72.5387L40.0151 90.497C38.729 91.1519 37.5535 91.1833 36.6461 90.7178C35.502 90.1339 34.7761 88.7454 34.7761 86.7807V43.8973C34.7761 40.3704 37.1273 36.3225 40.023 34.8471L75.2608 16.8891C76.5469 16.2342 77.7225 16.2025 78.6299 16.668Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M63.2511 9.86669C62.3358 9.40117 61.1602 9.44084 59.8819 10.0878L24.6442 28.0458C21.7485 29.5213 19.3972 33.577 19.3972 37.096V79.9795C19.3972 81.9441 20.1231 83.3247 21.2672 83.9165L17.7482 82.1254C16.6041 81.5415 15.8782 80.153 15.8782 78.1884V35.3049C15.8782 31.778 18.2295 27.7302 21.1252 26.2547L56.3629 8.29674C57.649 7.64185 58.8246 7.61046 59.732 8.07598L63.2511 9.86669Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M73.7365 51.6298V55.4643C73.7365 55.8589 73.6103 56.2928 73.4051 56.6795C73.1842 57.0661 72.9001 57.3741 72.5924 57.524L47.4226 70.3533C46.7914 70.6768 46.2786 70.2743 46.2786 69.4537V63.3469L53.9084 46.7774C54.3345 46.0042 54.8315 45.3175 55.4391 45.0098C56.0466 44.7021 56.5359 44.8836 56.962 45.2229L63.5582 54.6044L66.4065 50.0441C66.8326 49.2708 67.4164 48.663 68.024 48.3473C68.6315 48.0317 69.2154 48.0555 69.6336 48.3947L73.7365 51.6221V51.6298Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-      <path
-        d="M63.2519 9.86653C64.3959 10.4504 65.1218 11.8393 65.1218 13.8039V56.6874C65.1218 60.2143 62.7705 64.2617 59.8748 65.7372L24.6371 83.6956C23.351 84.3504 22.1753 84.3818 21.2679 83.9163C20.1238 83.3324 19.3979 81.944 19.3979 79.9793V37.0959C19.3979 33.569 21.7493 29.5211 24.645 28.0456L59.8827 10.0877C61.1688 9.43279 62.3445 9.40101 63.2519 9.86653Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </g>
-    <path
-      d="M78.6293 16.668C77.714 16.2025 76.5383 16.2421 75.2601 16.8891L40.0224 34.8471C37.1267 36.3225 34.7755 40.3783 34.7755 43.8973V86.7807C34.7755 88.7454 35.5013 90.126 36.6454 90.7178L33.1263 88.9267C31.9822 88.3428 31.2563 86.9543 31.2563 84.9896V42.1062C31.2563 38.5793 33.6077 34.5314 36.5034 33.056L71.7411 15.098C73.0272 14.4431 74.2029 14.4114 75.1102 14.8769L78.6293 16.668Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M78.6299 16.668C79.774 17.2519 80.4999 18.6407 80.4999 20.6054V63.4888C80.4999 67.0157 78.1486 71.0632 75.2529 72.5387L40.0151 90.497C38.729 91.1519 37.5535 91.1833 36.6461 90.7178C35.502 90.1339 34.7761 88.7454 34.7761 86.7807V43.8973C34.7761 40.3704 37.1273 36.3225 40.023 34.8471L75.2608 16.8891C76.5469 16.2342 77.7225 16.2025 78.6299 16.668Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M73.7365 51.6298V55.4643C73.7365 55.8589 73.6103 56.2928 73.4051 56.6795C73.1842 57.0661 72.9001 57.3741 72.5924 57.524L47.4226 70.3533C46.7914 70.6768 46.2786 70.2743 46.2786 69.4537V63.3469L53.9084 46.7774C54.3345 46.0042 54.8315 45.3175 55.4391 45.0098C56.0466 44.7021 56.5359 44.8836 56.962 45.2229L63.5582 54.6044L66.4065 50.0441C66.8326 49.2708 67.4164 48.663 68.024 48.3473C68.6315 48.0317 69.2154 48.0555 69.6336 48.3947L73.7365 51.6221V51.6298Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/estimate.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/estimate.tsx
index 997f60a48..42c3dfa31 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/estimate.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/estimate.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const EstimateHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="81" height="92" viewBox="0 0 81 92" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function EstimateHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="81"
+      height="92"
+      viewBox="0 0 81 92"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M47.8734 3.07267C46.9581 2.60715 45.7825 2.6466 44.5042 3.2936L9.26616 21.2519C6.37042 22.7274 4.01909 26.783 4.01909 30.3021V73.1858C4.01909 75.1505 4.745 76.5313 5.88909 77.1231L2.37005 75.332C1.22595 74.7481 0.5 73.3594 0.5 71.3948V28.511C0.5 24.984 2.85133 20.9363 5.74707 19.4608L40.9851 1.5025C42.2713 0.847607 43.4469 0.816046 44.3543 1.28157L47.8734 3.07267Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M47.8732 3.07177C49.0173 3.65565 49.7432 5.04434 49.7432 7.00903V49.8928C49.7432 53.4197 47.3919 57.4675 44.4962 58.943L9.25809 76.9013C7.97197 77.5562 6.7963 77.5877 5.88892 77.1222C4.74482 76.5383 4.01892 75.1496 4.01892 73.1849V30.3012C4.01892 26.7742 6.37025 22.7265 9.26599 21.251L44.5041 3.29269C45.7902 2.6378 46.9658 2.60624 47.8732 3.07177Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M63.2514 9.86595C62.3361 9.40042 61.1605 9.43987 59.8822 10.0869L24.6442 28.0452C21.7484 29.5207 19.3971 33.5763 19.3971 37.0954V79.9791C19.3971 81.9438 20.123 83.3246 21.2671 83.9164L17.748 82.1253C16.604 81.5414 15.8781 80.1527 15.8781 78.188V35.3043C15.8781 31.7773 18.2293 27.7296 21.1251 26.2541L56.3632 8.29578C57.6493 7.64088 58.8249 7.60932 59.7323 8.07485L63.2514 9.86595Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M63.2514 9.86614C64.3955 10.45 65.1214 11.8387 65.1214 13.8034V56.6872C65.1214 60.2141 62.7701 64.2618 59.8743 65.7373L24.6363 83.6956C23.3501 84.3505 22.1745 84.3821 21.2671 83.9166C20.123 83.3327 19.3971 81.944 19.3971 79.9793V37.0955C19.3971 33.5686 21.7484 29.5209 24.6442 28.0454L59.8822 10.0871C61.1684 9.43217 62.344 9.40061 63.2514 9.86614Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M47.8734 3.07267C46.9581 2.60715 45.7825 2.6466 44.5042 3.2936L9.26616 21.2519C6.37042 22.7274 4.01909 26.783 4.01909 30.3021V73.1858C4.01909 75.1505 4.745 76.5313 5.88909 77.1231L2.37005 75.332C1.22595 74.7481 0.5 73.3594 0.5 71.3948V28.511C0.5 24.984 2.85133 20.9363 5.74707 19.4608L40.9851 1.5025C42.2713 0.847607 43.4469 0.816046 44.3543 1.28157L47.8734 3.07267Z"
+        d="M78.6301 16.6678C77.7148 16.2023 76.5391 16.2417 75.2609 16.8887L40.0228 34.8471C37.1271 36.3225 34.7758 40.3781 34.7758 43.8972V86.781C34.7758 88.7457 35.5017 90.1265 36.6458 90.7182L33.1267 88.9271C31.9826 88.3433 31.2567 86.9546 31.2567 84.9899V42.1061C31.2567 38.5792 33.608 34.5315 36.5037 33.056L71.7419 15.0977C73.028 14.4428 74.2036 14.4112 75.111 14.8767L78.6301 16.6678Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -13,53 +56,19 @@ export const EstimateHorizontalStackIllustration = ({ className }: TIllustration
         strokeLinejoin="round"
       />
       <path
-        d="M47.8732 3.07177C49.0173 3.65565 49.7432 5.04434 49.7432 7.00903V49.8928C49.7432 53.4197 47.3919 57.4675 44.4962 58.943L9.25809 76.9013C7.97197 77.5562 6.7963 77.5877 5.88892 77.1222C4.74482 76.5383 4.01892 75.1496 4.01892 73.1849V30.3012C4.01892 26.7742 6.37025 22.7265 9.26599 21.251L44.5041 3.29269C45.7902 2.6378 46.9658 2.60624 47.8732 3.07177Z"
+        d="M78.6299 16.668C79.774 17.2519 80.4999 18.6406 80.4999 20.6053V63.489C80.4999 67.016 78.1487 71.0637 75.2529 72.5392L40.0148 90.4975C38.7287 91.1524 37.553 91.184 36.6456 90.7184C35.5015 90.1346 34.7756 88.7459 34.7756 86.7812V43.8974C34.7756 40.3705 37.127 36.3227 40.0227 34.8473L75.2608 16.8889C76.5469 16.2341 77.7226 16.2025 78.6299 16.668Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M63.2514 9.86595C62.3361 9.40042 61.1605 9.43987 59.8822 10.0869L24.6442 28.0452C21.7484 29.5207 19.3971 33.5763 19.3971 37.0954V79.9791C19.3971 81.9438 20.123 83.3246 21.2671 83.9164L17.748 82.1253C16.604 81.5414 15.8781 80.1527 15.8781 78.188V35.3043C15.8781 31.7773 18.2293 27.7296 21.1251 26.2541L56.3632 8.29578C57.6493 7.64088 58.8249 7.60932 59.7323 8.07485L63.2514 9.86595Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M57.2395 40.7963C57.7524 40.1808 58.3283 39.6916 58.9201 39.3918C59.5119 39.092 60.0879 38.9815 60.6008 39.0841C61.1136 39.1788 61.5397 39.4786 61.8316 39.952L70.8029 54.4938C71.0949 54.9673 71.2527 55.5906 71.2527 56.3086C71.2527 57.0266 71.0949 57.8156 70.8029 58.5889C70.511 59.3621 70.0849 60.0959 69.572 60.7193C69.0592 61.3426 68.4832 61.8239 67.8914 62.1238L49.9331 71.2686C49.3413 71.5684 48.7653 71.671 48.2524 71.5763C47.7395 71.4738 47.3135 71.1739 47.0215 70.7005C46.7296 70.2271 46.5718 69.6038 46.5718 68.8857C46.5718 68.1677 46.7296 67.3866 47.0215 66.6133L56.0007 42.9188C56.3005 42.1455 56.7187 41.4117 57.2316 40.7963H57.2395ZM58.9201 42.1218C58.7229 42.2244 58.5335 42.3822 58.3599 42.5874C58.1942 42.7925 58.0522 43.0371 57.9496 43.2896L48.9705 66.9763C48.8758 67.2367 48.8205 67.4971 48.8205 67.7338C48.8205 67.9705 48.8758 68.1835 48.9705 68.3413C49.0651 68.4991 49.2071 68.6017 49.3807 68.6332C49.5543 68.6648 49.7437 68.6332 49.941 68.5307L67.8914 59.3858C68.0886 59.2832 68.278 59.1254 68.4516 58.9203C68.6252 58.7151 68.7672 58.4706 68.8619 58.2102C68.9566 57.9498 69.0118 57.6894 69.0118 57.4527C69.0118 57.216 68.9566 57.0029 68.8619 56.8451L59.8906 42.3033C59.7959 42.1455 59.6539 42.0508 59.4803 42.0193C59.3067 41.9877 59.1174 42.0193 58.9201 42.1218Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-      <path
-        d="M63.2514 9.86614C64.3955 10.45 65.1214 11.8387 65.1214 13.8034V56.6872C65.1214 60.2141 62.7701 64.2618 59.8743 65.7373L24.6363 83.6956C23.3501 84.3505 22.1745 84.3821 21.2671 83.9166C20.123 83.3327 19.3971 81.944 19.3971 79.9793V37.0955C19.3971 33.5686 21.7484 29.5209 24.6442 28.0454L59.8822 10.0871C61.1684 9.43217 62.344 9.40061 63.2514 9.86614Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </g>
-    <path
-      d="M78.6301 16.6678C77.7148 16.2023 76.5391 16.2417 75.2609 16.8887L40.0228 34.8471C37.1271 36.3225 34.7758 40.3781 34.7758 43.8972V86.781C34.7758 88.7457 35.5017 90.1265 36.6458 90.7182L33.1267 88.9271C31.9826 88.3433 31.2567 86.9546 31.2567 84.9899V42.1061C31.2567 38.5792 33.608 34.5315 36.5037 33.056L71.7419 15.0977C73.028 14.4428 74.2036 14.4112 75.111 14.8767L78.6301 16.6678Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M78.6299 16.668C79.774 17.2519 80.4999 18.6406 80.4999 20.6053V63.489C80.4999 67.016 78.1487 71.0637 75.2529 72.5392L40.0148 90.4975C38.7287 91.1524 37.553 91.184 36.6456 90.7184C35.5015 90.1346 34.7756 88.7459 34.7756 86.7812V43.8974C34.7756 40.3705 37.127 36.3227 40.0227 34.8473L75.2608 16.8889C76.5469 16.2341 77.7226 16.2025 78.6299 16.668Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M57.2395 40.7963C57.7524 40.1808 58.3283 39.6916 58.9201 39.3918C59.5119 39.092 60.0879 38.9815 60.6008 39.0841C61.1136 39.1788 61.5397 39.4786 61.8316 39.952L70.8029 54.4938C71.0949 54.9673 71.2527 55.5906 71.2527 56.3086C71.2527 57.0266 71.0949 57.8156 70.8029 58.5889C70.511 59.3621 70.0849 60.0959 69.572 60.7193C69.0592 61.3426 68.4832 61.8239 67.8914 62.1238L49.9331 71.2686C49.3413 71.5684 48.7653 71.671 48.2524 71.5763C47.7395 71.4738 47.3135 71.1739 47.0215 70.7005C46.7296 70.2271 46.5718 69.6038 46.5718 68.8857C46.5718 68.1677 46.7296 67.3866 47.0215 66.6133L56.0007 42.9188C56.3005 42.1455 56.7187 41.4117 57.2316 40.7963H57.2395ZM58.9201 42.1218C58.7229 42.2244 58.5335 42.3822 58.3599 42.5874C58.1942 42.7925 58.0522 43.0371 57.9496 43.2896L48.9705 66.9763C48.8758 67.2367 48.8205 67.4971 48.8205 67.7338C48.8205 67.9705 48.8758 68.1835 48.9705 68.3413C49.0651 68.4991 49.2071 68.6017 49.3807 68.6332C49.5543 68.6648 49.7437 68.6332 49.941 68.5307L67.8914 59.3858C68.0886 59.2832 68.278 59.1254 68.4516 58.9203C68.6252 58.7151 68.7672 58.4706 68.8619 58.2102C68.9566 57.9498 69.0118 57.6894 69.0118 57.4527C69.0118 57.216 68.9566 57.0029 68.8619 56.8451L59.8906 42.3033C59.7959 42.1455 59.6539 42.0508 59.4803 42.0193C59.3067 41.9877 59.1174 42.0193 58.9201 42.1218Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx
index 7da47eb7f..bc974d859 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const ExportHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="71" height="81" viewBox="0 0 71 81" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function ExportHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="71"
+      height="81"
+      viewBox="0 0 71 81"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M41.9519 2.94243C41.151 2.53509 40.1223 2.5698 39.0038 3.13593L8.17037 18.8494C5.63659 20.1404 3.57921 23.6892 3.57921 26.7684V64.2916C3.57921 66.0107 4.21438 67.2191 5.21547 67.7369L2.13625 66.1696C1.13517 65.6587 0.5 64.4435 0.5 62.7244V25.2012C0.5 22.1151 2.55742 18.5732 5.0912 17.2821L35.9246 1.5687C37.05 0.995669 38.0787 0.967864 38.8726 1.3752L41.9519 2.94243Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M41.9519 2.94356C42.9529 3.45446 43.5881 4.66973 43.5881 6.38884V43.912C43.5881 46.9981 41.5307 50.54 38.9969 51.8311L8.16351 67.5448C7.03816 68.1179 6.00944 68.1453 5.21548 67.738C4.21439 67.2271 3.57922 66.0118 3.57922 64.2927V26.7696C3.57922 23.6835 5.6366 20.1415 8.17038 18.8505L39.0038 3.13706C40.1292 2.56403 41.1579 2.53622 41.9519 2.94356Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M55.4078 8.88579C54.6069 8.47845 53.5782 8.51316 52.4597 9.07929L21.6263 24.7927C19.0926 26.0838 17.0351 29.6326 17.0351 32.7118V70.2353C17.0351 71.9544 17.6703 73.1624 18.6714 73.6802L15.5922 72.113C14.5911 71.6021 13.9559 70.3872 13.9559 68.6681V31.1446C13.9559 28.0585 16.0134 24.5165 18.5471 23.2255L49.3805 7.51206C50.5059 6.93903 51.5346 6.91122 52.3286 7.31856L55.4078 8.88579Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M55.4079 8.88692C56.4089 9.39782 57.0441 10.6131 57.0441 12.3322V49.8557C57.0441 52.9418 54.9867 56.4834 52.4529 57.7744L21.6195 73.4882C20.4941 74.0612 19.4654 74.0887 18.6715 73.6814C17.6704 73.1704 17.0352 71.9555 17.0352 70.2364V32.7129C17.0352 29.6268 19.0926 26.0849 21.6264 24.7938L52.4598 9.08042C53.5852 8.50739 54.6139 8.47958 55.4079 8.88692Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M41.9519 2.94243C41.151 2.53509 40.1223 2.5698 39.0038 3.13593L8.17037 18.8494C5.63659 20.1404 3.57921 23.6892 3.57921 26.7684V64.2916C3.57921 66.0107 4.21438 67.2191 5.21547 67.7369L2.13625 66.1696C1.13517 65.6587 0.5 64.4435 0.5 62.7244V25.2012C0.5 22.1151 2.55742 18.5732 5.0912 17.2821L35.9246 1.5687C37.05 0.995669 38.0787 0.967864 38.8726 1.3752L41.9519 2.94243Z"
+        d="M68.8637 14.8332C68.0629 14.4259 67.0342 14.4602 65.9157 15.0264L35.0823 30.7401C32.5485 32.0312 30.4911 35.5797 30.4911 38.6589V76.1824C30.4911 77.9015 31.1263 79.1098 32.1274 79.6276L29.0482 78.0604C28.0471 77.5495 27.4119 76.3342 27.4119 74.6151V37.0916C27.4119 34.0055 29.4693 30.4639 32.0031 29.1729L62.8365 13.4591C63.9619 12.8861 64.9906 12.8586 65.7845 13.266L68.8637 14.8332Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -13,59 +56,25 @@ export const ExportHorizontalStackIllustration = ({ className }: TIllustrationAs
         strokeLinejoin="round"
       />
       <path
-        d="M41.9519 2.94356C42.9529 3.45446 43.5881 4.66973 43.5881 6.38884V43.912C43.5881 46.9981 41.5307 50.54 38.9969 51.8311L8.16351 67.5448C7.03816 68.1179 6.00944 68.1453 5.21548 67.738C4.21439 67.2271 3.57922 66.0118 3.57922 64.2927V26.7696C3.57922 23.6835 5.6366 20.1415 8.17038 18.8505L39.0038 3.13706C40.1292 2.56403 41.1579 2.53622 41.9519 2.94356Z"
+        d="M68.8637 14.8304C69.8648 15.3413 70.5 16.5563 70.5 18.2754V55.7989C70.5 58.885 68.4426 62.4269 65.9088 63.7179L35.0754 79.4313C33.95 80.0044 32.9213 80.0322 32.1273 79.6248C31.1263 79.1139 30.4911 77.8987 30.4911 76.1796V38.6561C30.4911 35.57 32.5485 32.0284 35.0823 30.7373L65.9157 15.0236C67.041 14.4505 68.0698 14.4231 68.8637 14.8304Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M55.4078 8.88579C54.6069 8.47845 53.5782 8.51316 52.4597 9.07929L21.6263 24.7927C19.0926 26.0838 17.0351 29.6326 17.0351 32.7118V70.2353C17.0351 71.9544 17.6703 73.1624 18.6714 73.6802L15.5922 72.113C14.5911 71.6021 13.9559 70.3872 13.9559 68.6681V31.1446C13.9559 28.0585 16.0134 24.5165 18.5471 23.2255L49.3805 7.51206C50.5059 6.93903 51.5346 6.91122 52.3286 7.31856L55.4078 8.88579Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M43.5881 41.1008C43.5881 40.4104 44.0438 39.6233 44.6099 39.3333L58.9289 32.0359C59.495 31.7459 59.9507 32.0702 59.9507 32.7607C59.9507 33.4511 59.495 34.2382 58.9289 34.5281L44.6099 41.8259C44.0438 42.1159 43.5881 41.7912 43.5881 41.1008Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M55.4079 8.88692C56.4089 9.39782 57.0441 10.6131 57.0441 12.3322V49.8557C57.0441 52.9418 54.9867 56.4834 52.4529 57.7744L21.6195 73.4882C20.4941 74.0612 19.4654 74.0887 18.6715 73.6814C17.6704 73.1704 17.0352 71.9555 17.0352 70.2364V32.7129C17.0352 29.6268 19.0926 26.0849 21.6264 24.7938L52.4598 9.08042C53.5852 8.50739 54.6139 8.47958 55.4079 8.88692Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M58.639 46.7626C58.2385 47.453 57.5895 47.7774 57.1891 47.5013L52.7981 44.3944V58.81C52.7981 59.5004 52.3356 60.2875 51.7764 60.5775C51.2171 60.8674 50.7546 60.5362 50.7546 59.8527V45.43L46.3636 53.0107C45.9631 53.7011 45.3142 54.0323 44.9137 53.7493C44.5202 53.4662 44.5202 52.6793 44.9137 51.9889L51.0514 41.3982C51.0514 41.3982 51.0928 41.336 51.1135 41.3014C51.1205 41.2945 51.1274 41.2878 51.1274 41.2809C51.2033 41.1704 51.2862 41.0598 51.3759 40.9701C51.4104 40.9355 51.445 40.9009 51.4795 40.8733C51.5071 40.8457 51.5416 40.8182 51.5761 40.7975C51.6107 40.7698 51.6521 40.7421 51.6866 40.7145C51.7211 40.6938 51.7487 40.68 51.7833 40.6592C51.8178 40.6385 51.8523 40.6248 51.8868 40.611C52.018 40.5558 52.1492 40.5419 52.2666 40.5558C52.2942 40.5558 52.3218 40.5628 52.3494 40.5767C52.3494 40.5767 52.4046 40.5972 52.4322 40.611C52.4737 40.6318 52.5082 40.6525 52.5427 40.6801L58.6459 44.9952C59.0394 45.2782 59.0394 46.0652 58.6459 46.7556L58.639 46.7626Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M68.8637 14.8332C68.0629 14.4259 67.0342 14.4602 65.9157 15.0264L35.0823 30.7401C32.5485 32.0312 30.4911 35.5797 30.4911 38.6589V76.1824C30.4911 77.9015 31.1263 79.1098 32.1274 79.6276L29.0482 78.0604C28.0471 77.5495 27.4119 76.3342 27.4119 74.6151V37.0916C27.4119 34.0055 29.4693 30.4639 32.0031 29.1729L62.8365 13.4591C63.9619 12.8861 64.9906 12.8586 65.7845 13.266L68.8637 14.8332Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M68.8637 14.8304C69.8648 15.3413 70.5 16.5563 70.5 18.2754V55.7989C70.5 58.885 68.4426 62.4269 65.9088 63.7179L35.0754 79.4313C33.95 80.0044 32.9213 80.0322 32.1273 79.6248C31.1263 79.1139 30.4911 77.8987 30.4911 76.1796V38.6561C30.4911 35.57 32.5485 32.0284 35.0823 30.7373L65.9157 15.0236C67.041 14.4505 68.0698 14.4231 68.8637 14.8304Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M43.5881 41.1008C43.5881 40.4104 44.0438 39.6233 44.6099 39.3333L58.9289 32.0359C59.495 31.7459 59.9507 32.0702 59.9507 32.7607C59.9507 33.4511 59.495 34.2382 58.9289 34.5281L44.6099 41.8259C44.0438 42.1159 43.5881 41.7912 43.5881 41.1008Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M58.639 46.7626C58.2385 47.453 57.5895 47.7774 57.1891 47.5013L52.7981 44.3944V58.81C52.7981 59.5004 52.3356 60.2875 51.7764 60.5775C51.2171 60.8674 50.7546 60.5362 50.7546 59.8527V45.43L46.3636 53.0107C45.9631 53.7011 45.3142 54.0323 44.9137 53.7493C44.5202 53.4662 44.5202 52.6793 44.9137 51.9889L51.0514 41.3982C51.0514 41.3982 51.0928 41.336 51.1135 41.3014C51.1205 41.2945 51.1274 41.2878 51.1274 41.2809C51.2033 41.1704 51.2862 41.0598 51.3759 40.9701C51.4104 40.9355 51.445 40.9009 51.4795 40.8733C51.5071 40.8457 51.5416 40.8182 51.5761 40.7975C51.6107 40.7698 51.6521 40.7421 51.6866 40.7145C51.7211 40.6938 51.7487 40.68 51.7833 40.6592C51.8178 40.6385 51.8523 40.6248 51.8868 40.611C52.018 40.5558 52.1492 40.5419 52.2666 40.5558C52.2942 40.5558 52.3218 40.5628 52.3494 40.5767C52.3494 40.5767 52.4046 40.5972 52.4322 40.611C52.4737 40.6318 52.5082 40.6525 52.5427 40.6801L58.6459 44.9952C59.0394 45.2782 59.0394 46.0652 58.6459 46.7556L58.639 46.7626Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx
index 839d88131..f26a721b6 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const IntakeHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="71" height="80" viewBox="0 0 71 80" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function IntakeHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="71"
+      height="80"
+      viewBox="0 0 71 80"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M41.9519 2.42126C41.151 2.01392 40.1223 2.04846 39.0038 2.61459L8.1704 18.3282C5.63661 19.6192 3.57922 23.1679 3.57922 26.2471V63.7706C3.57922 65.4897 4.21438 66.6979 5.21547 67.2157L2.13625 65.6485C1.13517 65.1376 0.5 63.9225 0.5 62.2034V24.6799C0.5 21.5938 2.55742 18.052 5.0912 16.761L35.9246 1.04736C37.05 0.47433 38.0787 0.446693 38.8727 0.854032L41.9519 2.42126Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M41.952 2.4216C42.953 2.9325 43.5882 4.1476 43.5882 5.86671V43.3902C43.5882 46.4763 41.5308 50.0181 38.997 51.3091L8.16357 67.0227C7.03821 67.5958 6.00952 67.6234 5.21555 67.216C4.21447 66.7052 3.5793 65.49 3.5793 63.7709V26.2474C3.5793 23.1613 5.6367 19.6196 8.17048 18.3285L39.0039 2.61493C40.1293 2.0419 41.158 2.01426 41.952 2.4216Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M55.4078 8.39993C54.607 7.99259 53.5783 8.02713 52.4598 8.59326L21.6264 24.3069C19.0926 25.5979 17.0352 29.1466 17.0352 32.2258V69.7493C17.0352 71.4684 17.6704 72.6766 18.6714 73.1944L15.5923 71.6272C14.5912 71.1163 13.956 69.9012 13.956 68.1821V30.6585C13.956 27.5724 16.0134 24.0307 18.5472 22.7396L49.3806 7.02603C50.506 6.453 51.5347 6.42536 52.3286 6.8327L55.4078 8.39993Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M55.4079 8.40042C56.409 8.91132 57.0442 10.1264 57.0442 11.8455V49.369C57.0442 52.4551 54.9867 55.9969 52.4529 57.2879L21.6195 73.0015C20.4942 73.5746 19.4655 73.6022 18.6715 73.1949C17.6704 72.684 17.0352 71.4689 17.0352 69.7498V32.2263C17.0352 29.1402 19.0926 25.5984 21.6264 24.3073L52.4599 8.59375C53.5852 8.02072 54.6139 7.99308 55.4079 8.40042Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M41.9519 2.42126C41.151 2.01392 40.1223 2.04846 39.0038 2.61459L8.1704 18.3282C5.63661 19.6192 3.57922 23.1679 3.57922 26.2471V63.7706C3.57922 65.4897 4.21438 66.6979 5.21547 67.2157L2.13625 65.6485C1.13517 65.1376 0.5 63.9225 0.5 62.2034V24.6799C0.5 21.5938 2.55742 18.052 5.0912 16.761L35.9246 1.04736C37.05 0.47433 38.0787 0.446693 38.8727 0.854032L41.9519 2.42126Z"
+        d="M68.8638 14.3513C68.0629 13.944 67.0342 13.9785 65.9157 14.5446L35.0823 30.2582C32.5485 31.5493 30.4911 35.098 30.4911 38.1772V75.7005C30.4911 77.4196 31.1263 78.6278 32.1274 79.1456L29.0482 77.5785C28.0471 77.0676 27.4119 75.8524 27.4119 74.1333V36.6099C27.4119 33.5238 29.4693 29.9821 32.0031 28.691L62.8365 12.9774C63.9619 12.4044 64.9906 12.3767 65.7845 12.7841L68.8638 14.3513Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -13,71 +56,37 @@ export const IntakeHorizontalStackIllustration = ({ className }: TIllustrationAs
         strokeLinejoin="round"
       />
       <path
-        d="M41.952 2.4216C42.953 2.9325 43.5882 4.1476 43.5882 5.86671V43.3902C43.5882 46.4763 41.5308 50.0181 38.997 51.3091L8.16357 67.0227C7.03821 67.5958 6.00952 67.6234 5.21555 67.216C4.21447 66.7052 3.5793 65.49 3.5793 63.7709V26.2474C3.5793 23.1613 5.6367 19.6196 8.17048 18.3285L39.0039 2.61493C40.1293 2.0419 41.158 2.01426 41.952 2.4216Z"
+        d="M68.8636 14.3517C69.8647 14.8626 70.4999 16.0777 70.4999 17.7968V55.3201C70.4999 58.4062 68.4425 61.9481 65.9087 63.2392L35.0753 78.9528C33.9499 79.5258 32.9212 79.5533 32.1273 79.1459C31.1262 78.635 30.491 77.4199 30.491 75.7008V38.1775C30.491 35.0914 32.5484 31.5496 35.0822 30.2586L65.9156 14.545C67.041 13.9719 68.0697 13.9443 68.8636 14.3517Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M55.4078 8.39993C54.607 7.99259 53.5783 8.02713 52.4598 8.59326L21.6264 24.3069C19.0926 25.5979 17.0352 29.1466 17.0352 32.2258V69.7493C17.0352 71.4684 17.6704 72.6766 18.6714 73.1944L15.5923 71.6272C14.5912 71.1163 13.956 69.9012 13.956 68.1821V30.6585C13.956 27.5724 16.0134 24.0307 18.5472 22.7396L49.3806 7.02603C50.506 6.453 51.5347 6.42536 52.3286 6.8327L55.4078 8.39993Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M57.8519 35.2914C58.1349 35.3467 58.3075 35.6296 58.3075 36.0369V46.4414C58.3075 46.8349 58.1419 47.2836 57.8726 47.6288L52.1699 54.8159C51.8937 55.168 51.5485 55.3476 51.2654 55.2924C50.9824 55.2372 50.8097 54.954 50.8097 54.5467V44.0941C50.8097 43.7005 50.9754 43.2447 51.2516 42.8995L56.9543 35.7608C57.2305 35.4156 57.5757 35.2362 57.8588 35.2914H57.8519ZM52.5979 43.8178V51.647L56.5056 46.7244V38.9297L52.5979 43.8178Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M55.4079 8.40042C56.409 8.91132 57.0442 10.1264 57.0442 11.8455V49.369C57.0442 52.4551 54.9867 55.9969 52.4529 57.2879L21.6195 73.0015C20.4942 73.5746 19.4655 73.6022 18.6715 73.1949C17.6704 72.684 17.0352 71.4689 17.0352 69.7498V32.2263C17.0352 29.1402 19.0926 25.5984 21.6264 24.3073L52.4599 8.59375C53.5852 8.02072 54.6139 7.99308 55.4079 8.40042Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M55.3249 34.8766C55.5804 35.284 55.4354 36.0434 55.0073 36.575L49.7395 43.1615V52.979C49.7395 53.6004 49.3391 54.3115 48.842 54.5601C48.3449 54.8086 47.9445 54.5118 47.9445 53.8973V43.4445C47.9445 43.051 48.1102 42.5953 48.3863 42.2501L54.0891 35.1114C54.5171 34.5798 55.0695 34.4693 55.3249 34.8766Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M68.8638 14.3513C68.0629 13.944 67.0342 13.9785 65.9157 14.5446L35.0823 30.2582C32.5485 31.5493 30.4911 35.098 30.4911 38.1772V75.7005C30.4911 77.4196 31.1263 78.6278 32.1274 79.1456L29.0482 77.5785C28.0471 77.0676 27.4119 75.8524 27.4119 74.1333V36.6099C27.4119 33.5238 29.4693 29.9821 32.0031 28.691L62.8365 12.9774C63.9619 12.4044 64.9906 12.3767 65.7845 12.7841L68.8638 14.3513Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M68.8636 14.3517C69.8647 14.8626 70.4999 16.0777 70.4999 17.7968V55.3201C70.4999 58.4062 68.4425 61.9481 65.9087 63.2392L35.0753 78.9528C33.9499 79.5258 32.9212 79.5533 32.1273 79.1459C31.1262 78.635 30.491 77.4199 30.491 75.7008V38.1775C30.491 35.0914 32.5484 31.5496 35.0822 30.2586L65.9156 14.545C67.041 13.9719 68.0697 13.9443 68.8636 14.3517Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M57.8519 35.2914C58.1349 35.3467 58.3075 35.6296 58.3075 36.0369V46.4414C58.3075 46.8349 58.1419 47.2836 57.8726 47.6288L52.1699 54.8159C51.8937 55.168 51.5485 55.3476 51.2654 55.2924C50.9824 55.2372 50.8097 54.954 50.8097 54.5467V44.0941C50.8097 43.7005 50.9754 43.2447 51.2516 42.8995L56.9543 35.7608C57.2305 35.4156 57.5757 35.2362 57.8588 35.2914H57.8519ZM52.5979 43.8178V51.647L56.5056 46.7244V38.9297L52.5979 43.8178Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M55.3249 34.8766C55.5804 35.284 55.4354 36.0434 55.0073 36.575L49.7395 43.1615V52.979C49.7395 53.6004 49.3391 54.3115 48.842 54.5601C48.3449 54.8086 47.9445 54.5118 47.9445 53.8973V43.4445C47.9445 43.051 48.1102 42.5953 48.3863 42.2501L54.0891 35.1114C54.5171 34.5798 55.0695 34.4693 55.3249 34.8766Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M52.4253 34.1796C52.6808 34.587 52.5358 35.3464 52.1077 35.878L46.84 42.4645V52.282C46.84 52.9034 46.4395 53.6145 45.9424 53.8631C45.4454 54.1116 45.0449 53.8148 45.0449 53.2003V42.7475C45.0449 42.354 45.2106 41.8983 45.4868 41.5531L51.1895 34.4144C51.6175 33.8828 52.1699 33.7723 52.4253 34.1796Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M42.0347 52.1577C42.5318 51.9023 42.9323 52.206 42.9323 52.8205V60.8223C42.9323 61.5749 43.4293 61.9407 44.03 61.6369L59.2465 53.8837C59.8471 53.5799 60.3442 52.71 60.3442 51.9575V43.9556C60.3442 43.3343 60.7446 42.6231 61.2417 42.3746C61.7388 42.126 62.1393 42.423 62.1393 43.0375V51.0392C62.1393 53.0344 60.8413 55.3198 59.2465 56.1344L44.03 63.8877C42.4351 64.7023 41.1372 63.7357 41.1372 61.7473V53.7457C41.1372 53.1243 41.5376 52.4132 42.0347 52.1646V52.1577Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M52.4253 34.1796C52.6808 34.587 52.5358 35.3464 52.1077 35.878L46.84 42.4645V52.282C46.84 52.9034 46.4395 53.6145 45.9424 53.8631C45.4454 54.1116 45.0449 53.8148 45.0449 53.2003V42.7475C45.0449 42.354 45.2106 41.8983 45.4868 41.5531L51.1895 34.4144C51.6175 33.8828 52.1699 33.7723 52.4253 34.1796Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M42.0347 52.1577C42.5318 51.9023 42.9323 52.206 42.9323 52.8205V60.8223C42.9323 61.5749 43.4293 61.9407 44.03 61.6369L59.2465 53.8837C59.8471 53.5799 60.3442 52.71 60.3442 51.9575V43.9556C60.3442 43.3343 60.7446 42.6231 61.2417 42.3746C61.7388 42.126 62.1393 42.423 62.1393 43.0375V51.0392C62.1393 53.0344 60.8413 55.3198 59.2465 56.1344L44.03 63.8877C42.4351 64.7023 41.1372 63.7357 41.1372 61.7473V53.7457C41.1372 53.1243 41.5376 52.4132 42.0347 52.1646V52.1577Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx
index d42515018..5e43bccc8 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const LabelHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="81" height="92" viewBox="0 0 81 92" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function LabelHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="81"
+      height="92"
+      viewBox="0 0 81 92"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M47.8737 2.47584C46.9585 2.00383 45.7828 2.04383 44.5045 2.69984L9.2662 20.9079C6.37044 22.4039 4.01909 26.5159 4.01909 30.0839V73.5641C4.01909 75.5561 4.745 76.9561 5.88911 77.5561L2.37001 75.7401C1.22591 75.1481 0.5 73.7401 0.5 71.7481V28.2679C0.5 24.6919 2.85132 20.5879 5.74708 19.0919L40.9854 0.883826C42.2716 0.219824 43.4472 0.187824 44.3546 0.659826L47.8737 2.47584Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M47.8737 2.47547C49.0178 3.06747 49.7437 4.47548 49.7437 6.46749V49.9476C49.7437 53.5237 47.3924 57.6277 44.4966 59.1237L9.25828 77.3318C7.97216 77.9958 6.79648 78.0278 5.88909 77.5558C4.74498 76.9638 4.01907 75.5557 4.01907 73.5637V30.0836C4.01907 26.5076 6.37042 22.4035 9.26618 20.9075L44.5045 2.69947C45.7906 2.03547 46.9663 2.00347 47.8737 2.47547Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M63.2522 9.36414C62.337 8.89214 61.1613 8.93214 59.883 9.58814L24.6447 27.7962C21.749 29.2922 19.3976 33.4042 19.3976 36.9722V80.4524C19.3976 82.4444 20.1235 83.8444 21.2676 84.4444L17.7485 82.6284C16.6044 82.0364 15.8785 80.6284 15.8785 78.6364V35.1562C15.8785 31.5802 18.2299 27.4762 21.1256 25.9802L56.364 7.77213C57.6501 7.10813 58.8257 7.07613 59.7331 7.54813L63.2522 9.36414Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M63.2521 9.36378C64.3962 9.95578 65.1221 11.3638 65.1221 13.3558V56.836C65.1221 60.412 62.7708 64.516 59.8751 66.012L24.6367 84.22C23.3505 84.8841 22.1749 84.9161 21.2675 84.4441C20.1234 83.8521 19.3975 82.4441 19.3975 80.452V36.9719C19.3975 33.3959 21.7488 29.2918 24.6446 27.7958L59.8829 9.58778C61.169 8.92377 62.3447 8.89177 63.2521 9.36378Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M47.8737 2.47584C46.9585 2.00383 45.7828 2.04383 44.5045 2.69984L9.2662 20.9079C6.37044 22.4039 4.01909 26.5159 4.01909 30.0839V73.5641C4.01909 75.5561 4.745 76.9561 5.88911 77.5561L2.37001 75.7401C1.22591 75.1481 0.5 73.7401 0.5 71.7481V28.2679C0.5 24.6919 2.85132 20.5879 5.74708 19.0919L40.9854 0.883826C42.2716 0.219824 43.4472 0.187824 44.3546 0.659826L47.8737 2.47584Z"
+        d="M78.6303 16.2602C77.715 15.7882 76.5394 15.8282 75.2612 16.4842L40.0228 34.6923C37.127 36.1883 34.7757 40.3003 34.7757 43.8683V87.3485C34.7757 89.3405 35.5016 90.7405 36.6457 91.3405L33.1266 89.5245C31.9825 88.9325 31.2566 87.5245 31.2566 85.5325V42.0523C31.2566 38.4763 33.6079 34.3723 36.5037 32.8763L71.7421 14.6682C73.0282 14.0042 74.2039 13.9722 75.1113 14.4443L78.6303 16.2602Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -13,57 +56,23 @@ export const LabelHorizontalStackIllustration = ({ className }: TIllustrationAss
         strokeLinejoin="round"
       />
       <path
-        d="M47.8737 2.47547C49.0178 3.06747 49.7437 4.47548 49.7437 6.46749V49.9476C49.7437 53.5237 47.3924 57.6277 44.4966 59.1237L9.25828 77.3318C7.97216 77.9958 6.79648 78.0278 5.88909 77.5558C4.74498 76.9638 4.01907 75.5557 4.01907 73.5637V30.0836C4.01907 26.5076 6.37042 22.4035 9.26618 20.9075L44.5045 2.69947C45.7906 2.03547 46.9663 2.00347 47.8737 2.47547Z"
+        d="M78.6301 16.2599C79.7742 16.8519 80.5001 18.2599 80.5001 20.2519V63.7321C80.5001 67.3081 78.1488 71.4121 75.2531 72.9081L40.0147 91.1162C38.7286 91.7802 37.5529 91.8122 36.6455 91.3402C35.5014 90.7482 34.7755 89.3402 34.7755 87.3482V43.868C34.7755 40.292 37.1268 36.188 40.0226 34.692L75.261 16.4839C76.5471 15.8199 77.7227 15.7879 78.6301 16.2599Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M63.2522 9.36414C62.337 8.89214 61.1613 8.93214 59.883 9.58814L24.6447 27.7962C21.749 29.2922 19.3976 33.4042 19.3976 36.9722V80.4524C19.3976 82.4444 20.1235 83.8444 21.2676 84.4444L17.7485 82.6284C16.6044 82.0364 15.8785 80.6284 15.8785 78.6364V35.1562C15.8785 31.5802 18.2299 27.4762 21.1256 25.9802L56.364 7.77213C57.6501 7.10813 58.8257 7.07613 59.7331 7.54813L63.2522 9.36414Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M49.8068 47.9642C50.4143 46.9082 51.227 46.0682 52.087 45.6282L59.788 41.6522C60.6402 41.2122 61.4608 41.2042 62.0684 41.6362L71.4106 48.3402C72.097 48.8362 72.4758 49.7882 72.4758 50.9882C72.4758 52.1882 72.0891 53.5322 71.4106 54.7402L64.3487 67.1083C63.6622 68.3163 62.7311 69.2683 61.7606 69.7723C60.7901 70.2763 59.8591 70.2843 59.1726 69.7963L49.8304 63.0922C49.2229 62.6602 48.8836 61.8282 48.8836 60.7722V51.2762C48.8836 50.2202 49.2229 49.0362 49.8304 47.9802L49.8068 47.9642ZM52.087 48.2762C51.803 48.4202 51.5269 48.7002 51.3296 49.0522C51.1323 49.4042 51.014 49.7962 51.014 50.1482V59.6442C51.014 59.9962 51.1245 60.2762 51.3296 60.4202L60.6718 67.1163C60.9558 67.3163 61.3503 67.3163 61.7527 67.1083C62.1551 66.9003 62.5418 66.5003 62.8338 66.0043L69.8956 53.6522C70.1796 53.1482 70.3375 52.5882 70.3375 52.0922C70.3375 51.5962 70.1796 51.1962 69.8956 50.9882L60.5534 44.2922C60.3562 44.1482 60.08 44.1482 59.7959 44.2922L52.0949 48.2682L52.087 48.2762Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M63.2521 9.36378C64.3962 9.95578 65.1221 11.3638 65.1221 13.3558V56.836C65.1221 60.412 62.7708 64.516 59.8751 66.012L24.6367 84.22C23.3505 84.8841 22.1749 84.9161 21.2675 84.4441C20.1234 83.8521 19.3975 82.4441 19.3975 80.452V36.9719C19.3975 33.3959 21.7488 29.2918 24.6446 27.7958L59.8829 9.58778C61.169 8.92377 62.3447 8.89177 63.2521 9.36378Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M59.7802 51.2521C59.7802 53.4442 58.3363 55.9722 56.561 56.8842C54.7857 57.8042 53.3417 56.7722 53.3417 54.5721C53.3417 52.3721 54.7857 49.8521 56.561 48.9401C58.3363 48.0201 59.7802 49.0521 59.7802 51.2521Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M78.6303 16.2602C77.715 15.7882 76.5394 15.8282 75.2612 16.4842L40.0228 34.6923C37.127 36.1883 34.7757 40.3003 34.7757 43.8683V87.3485C34.7757 89.3405 35.5016 90.7405 36.6457 91.3405L33.1266 89.5245C31.9825 88.9325 31.2566 87.5245 31.2566 85.5325V42.0523C31.2566 38.4763 33.6079 34.3723 36.5037 32.8763L71.7421 14.6682C73.0282 14.0042 74.2039 13.9722 75.1113 14.4443L78.6303 16.2602Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M78.6301 16.2599C79.7742 16.8519 80.5001 18.2599 80.5001 20.2519V63.7321C80.5001 67.3081 78.1488 71.4121 75.2531 72.9081L40.0147 91.1162C38.7286 91.7802 37.5529 91.8122 36.6455 91.3402C35.5014 90.7482 34.7755 89.3402 34.7755 87.3482V43.868C34.7755 40.292 37.1268 36.188 40.0226 34.692L75.261 16.4839C76.5471 15.8199 77.7227 15.7879 78.6301 16.2599Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M49.8068 47.9642C50.4143 46.9082 51.227 46.0682 52.087 45.6282L59.788 41.6522C60.6402 41.2122 61.4608 41.2042 62.0684 41.6362L71.4106 48.3402C72.097 48.8362 72.4758 49.7882 72.4758 50.9882C72.4758 52.1882 72.0891 53.5322 71.4106 54.7402L64.3487 67.1083C63.6622 68.3163 62.7311 69.2683 61.7606 69.7723C60.7901 70.2763 59.8591 70.2843 59.1726 69.7963L49.8304 63.0922C49.2229 62.6602 48.8836 61.8282 48.8836 60.7722V51.2762C48.8836 50.2202 49.2229 49.0362 49.8304 47.9802L49.8068 47.9642ZM52.087 48.2762C51.803 48.4202 51.5269 48.7002 51.3296 49.0522C51.1323 49.4042 51.014 49.7962 51.014 50.1482V59.6442C51.014 59.9962 51.1245 60.2762 51.3296 60.4202L60.6718 67.1163C60.9558 67.3163 61.3503 67.3163 61.7527 67.1083C62.1551 66.9003 62.5418 66.5003 62.8338 66.0043L69.8956 53.6522C70.1796 53.1482 70.3375 52.5882 70.3375 52.0922C70.3375 51.5962 70.1796 51.1962 69.8956 50.9882L60.5534 44.2922C60.3562 44.1482 60.08 44.1482 59.7959 44.2922L52.0949 48.2682L52.087 48.2762Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M59.7802 51.2521C59.7802 53.4442 58.3363 55.9722 56.561 56.8842C54.7857 57.8042 53.3417 56.7722 53.3417 54.5721C53.3417 52.3721 54.7857 49.8521 56.561 48.9401C58.3363 48.0201 59.7802 49.0521 59.7802 51.2521Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx
index eca3bda06..67a6d0f8d 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const LinkHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="52" height="59" viewBox="0 0 52 59" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function LinkHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="52"
+      height="59"
+      viewBox="0 0 52 59"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M30.6725 2.33465C30.0925 2.03965 29.3475 2.06465 28.5375 2.47465L6.20747 13.8546C4.37247 14.7896 2.88247 17.3596 2.88247 19.5896V46.7646C2.88247 48.0096 3.34246 48.8846 4.06746 49.2596L1.83746 48.1246C1.11246 47.7547 0.652466 46.8746 0.652466 45.6296V18.4546C0.652466 16.2196 2.14246 13.6546 3.97746 12.7196L26.3075 1.33964C27.1225 0.924644 27.8675 0.904645 28.4425 1.19964L30.6725 2.33465Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M30.6724 2.33465C31.3974 2.70465 31.8574 3.58465 31.8574 4.82965V32.0046C31.8574 34.2396 30.3674 36.8046 28.5324 37.7396L6.20245 49.1197C5.38745 49.5347 4.64244 49.5546 4.06744 49.2597C3.34244 48.8897 2.88245 48.0097 2.88245 46.7647V19.5897C2.88245 17.3547 4.37245 14.7897 6.20745 13.8547L28.5374 2.47465C29.3524 2.05965 30.0974 2.03965 30.6724 2.33465Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M40.4175 6.66967C39.8375 6.37467 39.0925 6.39967 38.2825 6.80967L15.9525 18.1897C14.1175 19.1247 12.6275 21.6947 12.6275 23.9247V51.0997C12.6275 52.3447 13.0875 53.2197 13.8125 53.5947L11.5825 52.4597C10.8575 52.0897 10.3975 51.2097 10.3975 49.9647V22.7897C10.3975 20.5547 11.8875 17.9897 13.7225 17.0547L36.0525 5.67467C36.8675 5.25967 37.6125 5.23967 38.1875 5.53467L40.4175 6.66967Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M40.4174 6.66974C41.1424 7.03974 41.6024 7.91973 41.6024 9.16473V36.3397C41.6024 38.5747 40.1124 41.1397 38.2774 42.0747L15.9474 53.4547C15.1324 53.8697 14.3874 53.8897 13.8124 53.5947C13.0874 53.2247 12.6274 52.3447 12.6274 51.0997V23.9247C12.6274 21.6897 14.1174 19.1247 15.9524 18.1897L38.2824 6.80974C39.0974 6.39474 39.8424 6.37474 40.4174 6.66974Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M30.6725 2.33465C30.0925 2.03965 29.3475 2.06465 28.5375 2.47465L6.20747 13.8546C4.37247 14.7896 2.88247 17.3596 2.88247 19.5896V46.7646C2.88247 48.0096 3.34246 48.8846 4.06746 49.2596L1.83746 48.1246C1.11246 47.7547 0.652466 46.8746 0.652466 45.6296V18.4546C0.652466 16.2196 2.14246 13.6546 3.97746 12.7196L26.3075 1.33964C27.1225 0.924644 27.8675 0.904645 28.4425 1.19964L30.6725 2.33465Z"
+        d="M50.1625 10.9747C49.5825 10.6797 48.8375 10.7047 48.0275 11.1147L25.6975 22.4947C23.8625 23.4297 22.3725 25.9997 22.3725 28.2297V55.4047C22.3725 56.6497 22.8325 57.5247 23.5575 57.8997L21.3275 56.7647C20.6025 56.3947 20.1425 55.5147 20.1425 54.2697V27.0947C20.1425 24.8597 21.6325 22.2947 23.4675 21.3597L45.7975 9.97966C46.6125 9.56466 47.3575 9.54466 47.9325 9.83966L50.1625 10.9747Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.25"
@@ -13,65 +56,31 @@ export const LinkHorizontalStackIllustration = ({ className }: TIllustrationAsse
         strokeLinejoin="round"
       />
       <path
-        d="M30.6724 2.33465C31.3974 2.70465 31.8574 3.58465 31.8574 4.82965V32.0046C31.8574 34.2396 30.3674 36.8046 28.5324 37.7396L6.20245 49.1197C5.38745 49.5347 4.64244 49.5546 4.06744 49.2597C3.34244 48.8897 2.88245 48.0097 2.88245 46.7647V19.5897C2.88245 17.3547 4.37245 14.7897 6.20745 13.8547L28.5374 2.47465C29.3524 2.05965 30.0974 2.03965 30.6724 2.33465Z"
+        d="M50.1624 10.9747C50.8874 11.3447 51.3474 12.2247 51.3474 13.4697V40.6447C51.3474 42.8797 49.8574 45.4447 48.0224 46.3797L25.6924 57.7597C24.8774 58.1747 24.1324 58.1947 23.5574 57.8997C22.8324 57.5297 22.3724 56.6497 22.3724 55.4047V28.2297C22.3724 25.9947 23.8624 23.4297 25.6974 22.4947L48.0274 11.1147C48.8424 10.6997 49.5874 10.6797 50.1624 10.9747Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.25"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M40.4175 6.66967C39.8375 6.37467 39.0925 6.39967 38.2825 6.80967L15.9525 18.1897C14.1175 19.1247 12.6275 21.6947 12.6275 23.9247V51.0997C12.6275 52.3447 13.0875 53.2197 13.8125 53.5947L11.5825 52.4597C10.8575 52.0897 10.3975 51.2097 10.3975 49.9647V22.7897C10.3975 20.5547 11.8875 17.9897 13.7225 17.0547L36.0525 5.67467C36.8675 5.25967 37.6125 5.23967 38.1875 5.53467L40.4175 6.66967Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.25"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M33.0175 38.0797C32.4625 39.0347 32.1525 40.1097 32.1525 41.0597C32.1525 42.0097 32.4625 42.7697 33.0175 43.1597C33.5725 43.5497 34.3225 43.5497 35.1025 43.1497C35.8825 42.7497 36.6375 41.9897 37.1875 41.0347L38.2325 39.2347C38.5225 38.7347 38.9875 38.4997 39.2775 38.7047C39.5675 38.9097 39.5675 39.4797 39.2775 39.9747L38.2325 41.7747C37.4025 43.2097 36.2775 44.3497 35.1025 44.9497C33.9275 45.5497 32.8025 45.5547 31.9725 44.9647C31.1425 44.3797 30.6775 43.2447 30.6775 41.8147C30.6775 40.3847 31.1425 38.7797 31.9725 37.3447L33.0175 35.5447C33.3075 35.0447 33.7725 34.8097 34.0625 35.0147C34.3525 35.2197 34.3525 35.7847 34.0625 36.2847L33.0175 38.0847V38.0797Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M40.4174 6.66974C41.1424 7.03974 41.6024 7.91973 41.6024 9.16473V36.3397C41.6024 38.5747 40.1124 41.1397 38.2774 42.0747L15.9474 53.4547C15.1324 53.8697 14.3874 53.8897 13.8124 53.5947C13.0874 53.2247 12.6274 52.3447 12.6274 51.0997V23.9247C12.6274 21.6897 14.1174 19.1247 15.9524 18.1897L38.2824 6.80974C39.0974 6.39474 39.8424 6.37474 40.4174 6.66974Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.25"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M36.1474 31.3997C35.8574 31.1947 35.8574 30.6297 36.1474 30.1297L37.1924 28.3297C38.0224 26.8947 39.1474 25.7547 40.3224 25.1547C41.4974 24.5547 42.6224 24.5497 43.4524 25.1397C44.2824 25.7247 44.7474 26.8597 44.7474 28.2897C44.7474 29.7197 44.2824 31.3247 43.4524 32.7597L42.4074 34.5597C42.1174 35.0597 41.6524 35.2947 41.3624 35.0897C41.0724 34.8847 41.0724 34.3147 41.3624 33.8197L42.4074 32.0197C42.9624 31.0647 43.2724 29.9897 43.2724 29.0397C43.2724 28.0897 42.9624 27.3297 42.4074 26.9397C41.8524 26.5497 41.1024 26.5497 40.3224 26.9497C39.5374 27.3497 38.7874 28.1097 38.2374 29.0647L37.1924 30.8647C36.9024 31.3647 36.4374 31.5997 36.1474 31.3947V31.3997Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M50.1625 10.9747C49.5825 10.6797 48.8375 10.7047 48.0275 11.1147L25.6975 22.4947C23.8625 23.4297 22.3725 25.9997 22.3725 28.2297V55.4047C22.3725 56.6497 22.8325 57.5247 23.5575 57.8997L21.3275 56.7647C20.6025 56.3947 20.1425 55.5147 20.1425 54.2697V27.0947C20.1425 24.8597 21.6325 22.2947 23.4675 21.3597L45.7975 9.97966C46.6125 9.56466 47.3575 9.54466 47.9325 9.83966L50.1625 10.9747Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.25"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M50.1624 10.9747C50.8874 11.3447 51.3474 12.2247 51.3474 13.4697V40.6447C51.3474 42.8797 49.8574 45.4447 48.0224 46.3797L25.6924 57.7597C24.8774 58.1747 24.1324 58.1947 23.5574 57.8997C22.8324 57.5297 22.3724 56.6497 22.3724 55.4047V28.2297C22.3724 25.9947 23.8624 23.4297 25.6974 22.4947L48.0274 11.1147C48.8424 10.6997 49.5874 10.6797 50.1624 10.9747Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.25"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M33.0175 38.0797C32.4625 39.0347 32.1525 40.1097 32.1525 41.0597C32.1525 42.0097 32.4625 42.7697 33.0175 43.1597C33.5725 43.5497 34.3225 43.5497 35.1025 43.1497C35.8825 42.7497 36.6375 41.9897 37.1875 41.0347L38.2325 39.2347C38.5225 38.7347 38.9875 38.4997 39.2775 38.7047C39.5675 38.9097 39.5675 39.4797 39.2775 39.9747L38.2325 41.7747C37.4025 43.2097 36.2775 44.3497 35.1025 44.9497C33.9275 45.5497 32.8025 45.5547 31.9725 44.9647C31.1425 44.3797 30.6775 43.2447 30.6775 41.8147C30.6775 40.3847 31.1425 38.7797 31.9725 37.3447L33.0175 35.5447C33.3075 35.0447 33.7725 34.8097 34.0625 35.0147C34.3525 35.2197 34.3525 35.7847 34.0625 36.2847L33.0175 38.0847V38.0797Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M36.1474 31.3997C35.8574 31.1947 35.8574 30.6297 36.1474 30.1297L37.1924 28.3297C38.0224 26.8947 39.1474 25.7547 40.3224 25.1547C41.4974 24.5547 42.6224 24.5497 43.4524 25.1397C44.2824 25.7247 44.7474 26.8597 44.7474 28.2897C44.7474 29.7197 44.2824 31.3247 43.4524 32.7597L42.4074 34.5597C42.1174 35.0597 41.6524 35.2947 41.3624 35.0897C41.0724 34.8847 41.0724 34.3147 41.3624 33.8197L42.4074 32.0197C42.9624 31.0647 43.2724 29.9897 43.2724 29.0397C43.2724 28.0897 42.9624 27.3297 42.4074 26.9397C41.8524 26.5497 41.1024 26.5497 40.3224 26.9497C39.5374 27.3497 38.7874 28.1097 38.2374 29.0647L37.1924 30.8647C36.9024 31.3647 36.4374 31.5997 36.1474 31.3947V31.3997Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M35.1025 39.5547C34.8125 39.3497 34.8125 38.7847 35.1025 38.2847L39.2775 31.0797C39.5675 30.5797 40.0325 30.3447 40.3225 30.5497C40.6125 30.7547 40.6125 31.3197 40.3225 31.8197L36.1475 39.0247C35.8575 39.5197 35.3925 39.7597 35.1025 39.5547Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M35.1025 39.5547C34.8125 39.3497 34.8125 38.7847 35.1025 38.2847L39.2775 31.0797C39.5675 30.5797 40.0325 30.3447 40.3225 30.5497C40.6125 30.7547 40.6125 31.3197 40.3225 31.8197L36.1475 39.0247C35.8575 39.5197 35.3925 39.7597 35.1025 39.5547Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx
index 8ecaa62b2..756ff4390 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const MembersHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="71" height="80" viewBox="0 0 71 80" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function MembersHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="71"
+      height="80"
+      viewBox="0 0 71 80"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M41.9518 2.84283C41.151 2.43551 40.1223 2.47003 39.0038 3.03614L8.17039 18.7493C5.6366 20.0403 3.5792 23.5889 3.5792 26.668V64.1904C3.5792 65.9094 4.21437 67.1176 5.21546 67.6354L2.13626 66.0682C1.13517 65.5573 0.5 64.3423 0.5 62.6232V25.1008C0.5 22.0148 2.5574 18.4731 5.09119 17.1821L35.9246 1.46898C37.05 0.895957 38.0787 0.868332 38.8726 1.27566L41.9518 2.84283Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M41.9515 2.84317C42.9526 3.35405 43.5877 4.56913 43.5877 6.28819V43.8106C43.5877 46.8966 41.5303 50.4383 38.9966 51.7293L8.16314 67.4424C7.03778 68.0154 6.00908 68.043 5.21512 67.6357C4.21403 67.1248 3.57886 65.9098 3.57886 64.1907V26.6683C3.57886 23.5823 5.63626 20.0406 8.17004 18.7496L39.0035 3.03647C40.1288 2.46346 41.1575 2.43584 41.9515 2.84317Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M55.4077 8.82148C54.6068 8.41415 53.5781 8.44867 52.4596 9.01478L21.6262 24.7279C19.0924 26.0189 17.035 29.5675 17.035 32.6466V70.169C17.035 71.8881 17.6702 73.0962 18.6713 73.614L15.5921 72.0468C14.591 71.536 13.9558 70.3209 13.9558 68.6018V31.0795C13.9558 27.9934 16.0132 24.4518 18.547 23.1608L49.3804 7.44761C50.5058 6.87459 51.5345 6.84697 52.3284 7.2543L55.4077 8.82148Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M55.4076 8.82181C56.4086 9.33269 57.0438 10.5478 57.0438 12.2668V49.7892C57.0438 52.8752 54.9864 56.4169 52.4526 57.7079L21.6192 73.421C20.4938 73.9941 19.4651 74.0217 18.6712 73.6143C17.6701 73.1035 17.0349 71.8884 17.0349 70.1693V32.647C17.0349 29.5609 19.0923 26.0193 21.6261 24.7282L52.4595 9.01511C53.5849 8.44209 54.6136 8.41448 55.4076 8.82181Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M41.9518 2.84283C41.151 2.43551 40.1223 2.47003 39.0038 3.03614L8.17039 18.7493C5.6366 20.0403 3.5792 23.5889 3.5792 26.668V64.1904C3.5792 65.9094 4.21437 67.1176 5.21546 67.6354L2.13626 66.0682C1.13517 65.5573 0.5 64.3423 0.5 62.6232V25.1008C0.5 22.0148 2.5574 18.4731 5.09119 17.1821L35.9246 1.46898C37.05 0.895957 38.0787 0.868332 38.8726 1.27566L41.9518 2.84283Z"
+        d="M68.8637 14.7732C68.0628 14.3659 67.0341 14.4004 65.9157 14.9666L35.0823 30.6797C32.5485 31.9707 30.4911 35.5193 30.4911 38.5984V76.1208C30.4911 77.8398 31.1262 79.048 32.1273 79.5658L29.0481 77.9986C28.047 77.4877 27.4119 76.2727 27.4119 74.5536V37.0312C27.4119 33.9452 29.4693 30.4035 32.003 29.1125L62.8365 13.3994C63.9618 12.8264 64.9905 12.7988 65.7845 13.2061L68.8637 14.7732Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.3"
@@ -13,71 +56,37 @@ export const MembersHorizontalStackIllustration = ({ className }: TIllustrationA
         strokeLinejoin="round"
       />
       <path
-        d="M41.9515 2.84317C42.9526 3.35405 43.5877 4.56913 43.5877 6.28819V43.8106C43.5877 46.8966 41.5303 50.4383 38.9966 51.7293L8.16314 67.4424C7.03778 68.0154 6.00908 68.043 5.21512 67.6357C4.21403 67.1248 3.57886 65.9098 3.57886 64.1907V26.6683C3.57886 23.5823 5.63626 20.0406 8.17004 18.7496L39.0035 3.03647C40.1288 2.46346 41.1575 2.43584 41.9515 2.84317Z"
+        d="M68.8638 14.7736C69.8649 15.2845 70.5001 16.4996 70.5001 18.2186V55.741C70.5001 58.827 68.4427 62.3687 65.9089 63.6597L35.0755 79.3728C33.9501 79.9458 32.9214 79.9734 32.1275 79.5661C31.1264 79.0552 30.4912 77.8402 30.4912 76.1211V38.5987C30.4912 35.5127 32.5486 31.9711 35.0824 30.68L65.9158 14.9669C67.0412 14.3939 68.0699 14.3663 68.8638 14.7736Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.3"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M55.4077 8.82148C54.6068 8.41415 53.5781 8.44867 52.4596 9.01478L21.6262 24.7279C19.0924 26.0189 17.035 29.5675 17.035 32.6466V70.169C17.035 71.8881 17.6702 73.0962 18.6713 73.614L15.5921 72.0468C14.591 71.536 13.9558 70.3209 13.9558 68.6018V31.0795C13.9558 27.9934 16.0132 24.4518 18.547 23.1608L49.3804 7.44761C50.5058 6.87459 51.5345 6.84697 52.3284 7.2543L55.4077 8.82148Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.3"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M47.6061 52.5984C48.8696 50.4168 50.5887 48.6771 52.3699 47.7657C54.1581 46.8544 55.8703 46.8476 57.1337 47.7381C58.3972 48.6356 59.1083 50.3547 59.1083 52.5294C59.1083 53.1784 58.6802 53.924 58.1417 54.1932C57.6032 54.4625 57.1751 54.1587 57.1751 53.5097C57.1751 51.9564 56.6711 50.7206 55.7667 50.0854C54.8623 49.4434 53.6403 49.4503 52.363 50.1062C51.0858 50.7551 49.8638 51.9978 48.9593 53.5581C48.0549 55.1183 47.5509 56.865 47.5509 58.4184C47.5509 59.0673 47.1229 59.8129 46.5913 60.0822C46.0596 60.3514 45.6316 60.0477 45.6316 59.3987C45.6316 57.224 46.3427 54.7732 47.6061 52.5915V52.5984Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M55.4076 8.82181C56.4086 9.33269 57.0438 10.5478 57.0438 12.2668V49.7892C57.0438 52.8752 54.9864 56.4169 52.4526 57.7079L21.6192 73.421C20.4938 73.9941 19.4651 74.0217 18.6712 73.6143C17.6701 73.1035 17.0349 71.8884 17.0349 70.1693V32.647C17.0349 29.5609 19.0923 26.0193 21.6261 24.7282L52.4595 9.01511C53.5849 8.44209 54.6136 8.41448 55.4076 8.82181Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.3"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M52.3766 40.7308C50.7818 41.5454 49.4907 43.7754 49.4907 45.7153C49.4907 47.6553 50.7818 48.5735 52.3766 47.7589C53.9715 46.9442 55.2625 44.7143 55.2625 42.7743C55.2625 40.8343 53.9715 39.9161 52.3766 40.7308ZM47.5576 46.7026C47.5576 43.4647 49.7117 39.7435 52.3697 38.3904C55.0278 37.0372 57.1818 38.563 57.1818 41.794C57.1818 45.025 55.0278 48.753 52.3697 50.1062C49.7117 51.4593 47.5576 49.9336 47.5576 46.7026Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M68.8637 14.7732C68.0628 14.3659 67.0341 14.4004 65.9157 14.9666L35.0823 30.6797C32.5485 31.9707 30.4911 35.5193 30.4911 38.5984V76.1208C30.4911 77.8398 31.1262 79.048 32.1273 79.5658L29.0481 77.9986C28.047 77.4877 27.4119 76.2727 27.4119 74.5536V37.0312C27.4119 33.9452 29.4693 30.4035 32.003 29.1125L62.8365 13.3994C63.9618 12.8264 64.9905 12.7988 65.7845 13.2061L68.8637 14.7732Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M68.8638 14.7736C69.8649 15.2845 70.5001 16.4996 70.5001 18.2186V55.741C70.5001 58.827 68.4427 62.3687 65.9089 63.6597L35.0755 79.3728C33.9501 79.9458 32.9214 79.9734 32.1275 79.5661C31.1264 79.0552 30.4912 77.8402 30.4912 76.1211V38.5987C30.4912 35.5127 32.5486 31.9711 35.0824 30.68L65.9158 14.9669C67.0412 14.3939 68.0699 14.3663 68.8638 14.7736Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M47.6061 52.5984C48.8696 50.4168 50.5887 48.6771 52.3699 47.7657C54.1581 46.8544 55.8703 46.8476 57.1337 47.7381C58.3972 48.6356 59.1083 50.3547 59.1083 52.5294C59.1083 53.1784 58.6802 53.924 58.1417 54.1932C57.6032 54.4625 57.1751 54.1587 57.1751 53.5097C57.1751 51.9564 56.6711 50.7206 55.7667 50.0854C54.8623 49.4434 53.6403 49.4503 52.363 50.1062C51.0858 50.7551 49.8638 51.9978 48.9593 53.5581C48.0549 55.1183 47.5509 56.865 47.5509 58.4184C47.5509 59.0673 47.1229 59.8129 46.5913 60.0822C46.0596 60.3514 45.6316 60.0477 45.6316 59.3987C45.6316 57.224 46.3427 54.7732 47.6061 52.5915V52.5984Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M52.3766 40.7308C50.7818 41.5454 49.4907 43.7754 49.4907 45.7153C49.4907 47.6553 50.7818 48.5735 52.3766 47.7589C53.9715 46.9442 55.2625 44.7143 55.2625 42.7743C55.2625 40.8343 53.9715 39.9161 52.3766 40.7308ZM47.5576 46.7026C47.5576 43.4647 49.7117 39.7435 52.3697 38.3904C55.0278 37.0372 57.1818 38.563 57.1818 41.794C57.1818 45.025 55.0278 48.753 52.3697 50.1062C49.7117 51.4593 47.5576 49.9336 47.5576 46.7026Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M57.189 38.2798C57.189 37.6308 57.617 36.8852 58.1555 36.616C59.274 36.0498 60.3372 36.0636 61.1174 36.6367C61.8975 37.2166 62.3325 38.3074 62.3325 39.6743C62.3325 41.0413 61.8975 42.5809 61.1174 43.9478C61.0828 44.01 61.0483 44.0721 61.0138 44.1273C61.4626 44.2171 61.8837 44.3966 62.2565 44.6727C63.3405 45.4736 63.9411 46.9924 63.9411 48.891C63.9411 49.5399 63.5131 50.2856 62.9746 50.5548C62.436 50.8241 62.0149 50.5203 62.0149 49.8713C62.0149 48.5734 61.6007 47.5447 60.8757 47.0062C60.1508 46.4677 59.1773 46.4608 58.1624 46.9786C57.6308 47.2479 57.1959 46.9441 57.1959 46.2951C57.1959 45.6462 57.6239 44.9006 58.1624 44.6313C58.7493 44.3345 59.3154 43.7476 59.7435 43.002C60.1646 42.2564 60.4132 41.4003 60.4132 40.634C60.4132 39.8677 60.1715 39.267 59.7435 38.9495C59.3223 38.6319 58.7493 38.6319 58.1624 38.9357C57.6308 39.2049 57.1959 38.9011 57.1959 38.2522L57.189 38.2798Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M47.5577 43.1888C47.5577 42.5399 47.1297 42.2361 46.5981 42.5054C45.4796 43.0715 44.4164 44.1692 43.6362 45.543C42.8561 46.9169 42.4211 48.4565 42.4211 49.8165C42.4211 51.1766 42.8561 52.2812 43.6362 52.8542C43.6708 52.8818 43.7053 52.9025 43.7398 52.9302C43.291 53.4825 42.8699 54.09 42.4971 54.7459C41.4131 56.6513 40.8125 58.7846 40.8125 60.6832C40.8125 61.3321 41.2405 61.6359 41.7722 61.3667C42.3038 61.0974 42.7318 60.3518 42.7318 59.7028C42.7318 58.4049 43.1461 56.9551 43.871 55.6779C44.5959 54.4007 45.5694 53.3996 46.5843 52.8818C47.1159 52.6126 47.5439 51.867 47.5439 51.218C47.5439 50.569 47.1159 50.2653 46.5843 50.5345C45.9974 50.8314 45.4313 50.8314 45.0032 50.5207C44.5821 50.2031 44.3336 49.6025 44.3336 48.8362C44.3336 48.0699 44.5752 47.2207 45.0032 46.4751C45.4244 45.7294 45.9974 45.1495 46.5843 44.8458C47.1159 44.5765 47.5439 43.8309 47.5439 43.1819L47.5577 43.1888Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M57.189 38.2798C57.189 37.6308 57.617 36.8852 58.1555 36.616C59.274 36.0498 60.3372 36.0636 61.1174 36.6367C61.8975 37.2166 62.3325 38.3074 62.3325 39.6743C62.3325 41.0413 61.8975 42.5809 61.1174 43.9478C61.0828 44.01 61.0483 44.0721 61.0138 44.1273C61.4626 44.2171 61.8837 44.3966 62.2565 44.6727C63.3405 45.4736 63.9411 46.9924 63.9411 48.891C63.9411 49.5399 63.5131 50.2856 62.9746 50.5548C62.436 50.8241 62.0149 50.5203 62.0149 49.8713C62.0149 48.5734 61.6007 47.5447 60.8757 47.0062C60.1508 46.4677 59.1773 46.4608 58.1624 46.9786C57.6308 47.2479 57.1959 46.9441 57.1959 46.2951C57.1959 45.6462 57.6239 44.9006 58.1624 44.6313C58.7493 44.3345 59.3154 43.7476 59.7435 43.002C60.1646 42.2564 60.4132 41.4003 60.4132 40.634C60.4132 39.8677 60.1715 39.267 59.7435 38.9495C59.3223 38.6319 58.7493 38.6319 58.1624 38.9357C57.6308 39.2049 57.1959 38.9011 57.1959 38.2522L57.189 38.2798Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M47.5577 43.1888C47.5577 42.5399 47.1297 42.2361 46.5981 42.5054C45.4796 43.0715 44.4164 44.1692 43.6362 45.543C42.8561 46.9169 42.4211 48.4565 42.4211 49.8165C42.4211 51.1766 42.8561 52.2812 43.6362 52.8542C43.6708 52.8818 43.7053 52.9025 43.7398 52.9302C43.291 53.4825 42.8699 54.09 42.4971 54.7459C41.4131 56.6513 40.8125 58.7846 40.8125 60.6832C40.8125 61.3321 41.2405 61.6359 41.7722 61.3667C42.3038 61.0974 42.7318 60.3518 42.7318 59.7028C42.7318 58.4049 43.1461 56.9551 43.871 55.6779C44.5959 54.4007 45.5694 53.3996 46.5843 52.8818C47.1159 52.6126 47.5439 51.867 47.5439 51.218C47.5439 50.569 47.1159 50.2653 46.5843 50.5345C45.9974 50.8314 45.4313 50.8314 45.0032 50.5207C44.5821 50.2031 44.3336 49.6025 44.3336 48.8362C44.3336 48.0699 44.5752 47.2207 45.0032 46.4751C45.4244 45.7294 45.9974 45.1495 46.5843 44.8458C47.1159 44.5765 47.5439 43.8309 47.5439 43.1819L47.5577 43.1888Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx
index 962ca4e12..4effbb45c 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const NoteHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="52" height="59" viewBox="0 0 52 59" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function NoteHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="52"
+      height="59"
+      viewBox="0 0 52 59"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M30.6721 2.43395C30.0921 2.13895 29.3471 2.16395 28.5371 2.57395L6.20711 13.9539C4.37211 14.8889 2.8821 17.4589 2.8821 19.6889V46.864C2.8821 48.109 3.34211 48.9839 4.06711 49.3589L1.8371 48.224C1.1121 47.854 0.6521 46.9739 0.6521 45.7289V18.5539C0.6521 16.3189 2.1421 13.7539 3.9771 12.8189L26.3071 1.43895C27.1221 1.02395 27.8671 1.00395 28.4421 1.29895L30.6721 2.43395Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M30.6721 2.43393C31.3971 2.80393 31.8571 3.68392 31.8571 4.92892V32.1039C31.8571 34.3389 30.3671 36.9039 28.5321 37.8389L6.20209 49.2189C5.38709 49.6339 4.64209 49.6539 4.06709 49.3589C3.34209 48.9889 2.88208 48.1089 2.88208 46.8639V19.6889C2.88208 17.4539 4.37209 14.8889 6.20709 13.9539L28.5371 2.57393C29.3521 2.15893 30.0971 2.13893 30.6721 2.43393Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M40.4171 6.76894C39.8371 6.47394 39.0921 6.49894 38.2821 6.90894L15.9521 18.2889C14.1171 19.2239 12.6271 21.7939 12.6271 24.0239V51.1989C12.6271 52.4439 13.0871 53.3189 13.8121 53.6939L11.5821 52.5589C10.8571 52.1889 10.3971 51.3089 10.3971 50.0639V22.8889C10.3971 20.6539 11.8871 18.0889 13.7221 17.1539L36.0521 5.77394C36.8671 5.35894 37.6121 5.33894 38.1871 5.63394L40.4171 6.76894Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M40.4171 6.76892C41.1421 7.13892 41.6021 8.01892 41.6021 9.26392V36.4389C41.6021 38.6739 40.1121 41.2389 38.2771 42.1739L15.9471 53.5539C15.1321 53.9689 14.3871 53.9889 13.8121 53.6939C13.0871 53.3239 12.6271 52.4439 12.6271 51.1989V24.0239C12.6271 21.7889 14.1171 19.2239 15.9521 18.2889L38.2821 6.90892C39.0971 6.49392 39.8421 6.47392 40.4171 6.76892Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M30.6721 2.43395C30.0921 2.13895 29.3471 2.16395 28.5371 2.57395L6.20711 13.9539C4.37211 14.8889 2.8821 17.4589 2.8821 19.6889V46.864C2.8821 48.109 3.34211 48.9839 4.06711 49.3589L1.8371 48.224C1.1121 47.854 0.6521 46.9739 0.6521 45.7289V18.5539C0.6521 16.3189 2.1421 13.7539 3.9771 12.8189L26.3071 1.43895C27.1221 1.02395 27.8671 1.00395 28.4421 1.29895L30.6721 2.43395Z"
+        d="M50.1621 11.0739C49.5821 10.7789 48.8371 10.8039 48.0271 11.2139L25.6971 22.5939C23.8621 23.5289 22.3721 26.0989 22.3721 28.3289V55.5039C22.3721 56.7489 22.8321 57.6239 23.5571 57.9989L21.3271 56.8639C20.6021 56.4939 20.1421 55.6139 20.1421 54.3689V27.1939C20.1421 24.9589 21.6321 22.3939 23.4671 21.4589L45.7971 10.0789C46.6121 9.66393 47.3571 9.64393 47.9321 9.93893L50.1621 11.0739Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.25"
@@ -13,51 +56,17 @@ export const NoteHorizontalStackIllustration = ({ className }: TIllustrationAsse
         strokeLinejoin="round"
       />
       <path
-        d="M30.6721 2.43393C31.3971 2.80393 31.8571 3.68392 31.8571 4.92892V32.1039C31.8571 34.3389 30.3671 36.9039 28.5321 37.8389L6.20209 49.2189C5.38709 49.6339 4.64209 49.6539 4.06709 49.3589C3.34209 48.9889 2.88208 48.1089 2.88208 46.8639V19.6889C2.88208 17.4539 4.37209 14.8889 6.20709 13.9539L28.5371 2.57393C29.3521 2.15893 30.0971 2.13893 30.6721 2.43393Z"
+        d="M50.1621 11.0739C50.8871 11.4439 51.3471 12.3239 51.3471 13.5689V40.7439C51.3471 42.9789 49.8571 45.5439 48.0221 46.4789L25.6921 57.8589C24.8771 58.2739 24.1321 58.2939 23.5571 57.9989C22.8321 57.6289 22.3721 56.7489 22.3721 55.5039V28.3289C22.3721 26.0939 23.8621 23.5289 25.6971 22.5939L48.0271 11.2139C48.8421 10.7989 49.5871 10.7789 50.1621 11.0739Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.25"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M40.4171 6.76894C39.8371 6.47394 39.0921 6.49894 38.2821 6.90894L15.9521 18.2889C14.1171 19.2239 12.6271 21.7939 12.6271 24.0239V51.1989C12.6271 52.4439 13.0871 53.3189 13.8121 53.6939L11.5821 52.5589C10.8571 52.1889 10.3971 51.3089 10.3971 50.0639V22.8889C10.3971 20.6539 11.8871 18.0889 13.7221 17.1539L36.0521 5.77394C36.8671 5.35894 37.6121 5.33894 38.1871 5.63394L40.4171 6.76894Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.25"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M43.5321 23.1439L32.4371 28.7939C31.1271 29.4639 30.0621 31.2989 30.0621 32.8939V46.3939C30.0621 47.9889 31.1271 48.7439 32.4371 48.0789L41.1521 43.6389C41.3621 43.5289 41.5671 43.3239 41.7171 43.0689L45.6771 36.2289C45.8271 35.9739 45.9071 35.6839 45.9071 35.4239V24.8189C45.9071 23.2239 44.8371 22.4739 43.5271 23.1389L43.5321 23.1439ZM44.3221 34.3089L41.9471 35.5189C40.6371 36.1889 39.5671 38.0289 39.5671 39.6239V42.5139L32.4371 46.1489C32.0021 46.3689 31.6471 46.1239 31.6471 45.5889V32.0889C31.6471 31.5539 32.0021 30.9439 32.4371 30.7239L43.5321 25.0739C43.9721 24.8489 44.3221 25.0989 44.3221 25.6339V34.3139V34.3089Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-      <path
-        d="M40.4171 6.76892C41.1421 7.13892 41.6021 8.01892 41.6021 9.26392V36.4389C41.6021 38.6739 40.1121 41.2389 38.2771 42.1739L15.9471 53.5539C15.1321 53.9689 14.3871 53.9889 13.8121 53.6939C13.0871 53.3239 12.6271 52.4439 12.6271 51.1989V24.0239C12.6271 21.7889 14.1171 19.2239 15.9521 18.2889L38.2821 6.90892C39.0971 6.49392 39.8421 6.47392 40.4171 6.76892Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.25"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </g>
-    <path
-      d="M50.1621 11.0739C49.5821 10.7789 48.8371 10.8039 48.0271 11.2139L25.6971 22.5939C23.8621 23.5289 22.3721 26.0989 22.3721 28.3289V55.5039C22.3721 56.7489 22.8321 57.6239 23.5571 57.9989L21.3271 56.8639C20.6021 56.4939 20.1421 55.6139 20.1421 54.3689V27.1939C20.1421 24.9589 21.6321 22.3939 23.4671 21.4589L45.7971 10.0789C46.6121 9.66393 47.3571 9.64393 47.9321 9.93893L50.1621 11.0739Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.25"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M50.1621 11.0739C50.8871 11.4439 51.3471 12.3239 51.3471 13.5689V40.7439C51.3471 42.9789 49.8571 45.5439 48.0221 46.4789L25.6921 57.8589C24.8771 58.2739 24.1321 58.2939 23.5571 57.9989C22.8321 57.6289 22.3721 56.7489 22.3721 55.5039V28.3289C22.3721 26.0939 23.8621 23.5289 25.6971 22.5939L48.0271 11.2139C48.8421 10.7989 49.5871 10.7789 50.1621 11.0739Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.25"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M43.5321 23.1439L32.4371 28.7939C31.1271 29.4639 30.0621 31.2989 30.0621 32.8939V46.3939C30.0621 47.9889 31.1271 48.7439 32.4371 48.0789L41.1521 43.6389C41.3621 43.5289 41.5671 43.3239 41.7171 43.0689L45.6771 36.2289C45.8271 35.9739 45.9071 35.6839 45.9071 35.4239V24.8189C45.9071 23.2239 44.8371 22.4739 43.5271 23.1389L43.5321 23.1439ZM44.3221 34.3089L41.9471 35.5189C40.6371 36.1889 39.5671 38.0289 39.5671 39.6239V42.5139L32.4371 46.1489C32.0021 46.3689 31.6471 46.1239 31.6471 45.5889V32.0889C31.6471 31.5539 32.0021 30.9439 32.4371 30.7239L43.5321 25.0739C43.9721 24.8489 44.3221 25.0989 44.3221 25.6339V34.3139V34.3089Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/priority.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/priority.tsx
index 707a9b6b3..c7a0d819d 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/priority.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/priority.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const PriorityHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="72" height="81" viewBox="0 0 72 81" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function PriorityHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="72"
+      height="81"
+      viewBox="0 0 72 81"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M42.4518 2.93859C41.651 2.53126 40.6222 2.5658 39.5038 3.13193L8.67038 18.8454C6.1366 20.1365 4.0792 23.6852 4.0792 26.7644V64.2878C4.0792 66.0069 4.71437 67.2151 5.71546 67.7329L2.63626 66.1657C1.63517 65.6548 1 64.4397 1 62.7206V25.1972C1 22.1111 3.0574 18.5693 5.59118 17.2783L36.4246 1.5647C37.5499 0.991664 38.5787 0.964028 39.3726 1.37137L42.4518 2.93859Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M42.4519 2.9385C43.4529 3.4494 44.0881 4.66451 44.0881 6.38361V43.907C44.0881 46.9931 42.0307 50.5349 39.4969 51.8259L8.6635 67.5395C7.53814 68.1125 6.50945 68.1402 5.71548 67.7328C4.7144 67.2219 4.07922 66.0068 4.07922 64.2877V26.7643C4.07922 23.6782 6.13663 20.1364 8.67041 18.8453L39.5038 3.13184C40.6292 2.5588 41.6579 2.53117 42.4519 2.9385Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M55.9078 8.88293C55.1069 8.47559 54.0782 8.51013 52.9598 9.07626L22.1264 24.7899C19.5926 26.0809 17.5352 29.6296 17.5352 32.7088V70.2322C17.5352 71.9513 18.1704 73.1595 19.1715 73.6773L16.0923 72.11C15.0912 71.5991 14.456 70.384 14.456 68.6649V31.1415C14.456 28.0554 16.5134 24.5137 19.0472 23.2226L49.8806 7.50903C51.006 6.936 52.0347 6.90836 52.8286 7.3157L55.9078 8.88293Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M55.9079 8.88284C56.909 9.39374 57.5441 10.6088 57.5441 12.3279V49.8514C57.5441 52.9375 55.4867 56.4792 52.9529 57.7703L22.1195 73.4838C20.9942 74.0569 19.9655 74.0845 19.1715 73.6772C18.1704 73.1663 17.5352 71.9512 17.5352 70.2321V32.7087C17.5352 29.6226 19.5926 26.0808 22.1264 24.7898L52.9598 9.07617C54.0852 8.50314 55.1139 8.4755 55.9079 8.88284Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M42.4518 2.93859C41.651 2.53126 40.6222 2.5658 39.5038 3.13193L8.67038 18.8454C6.1366 20.1365 4.0792 23.6852 4.0792 26.7644V64.2878C4.0792 66.0069 4.71437 67.2151 5.71546 67.7329L2.63626 66.1657C1.63517 65.6548 1 64.4397 1 62.7206V25.1972C1 22.1111 3.0574 18.5693 5.59118 17.2783L36.4246 1.5647C37.5499 0.991664 38.5787 0.964028 39.3726 1.37137L42.4518 2.93859Z"
+        d="M69.3638 14.8343C68.5629 14.427 67.5342 14.4615 66.4158 15.0277L35.5823 30.7413C33.0486 32.0323 30.9912 35.581 30.9912 38.6602V76.1836C30.9912 77.9027 31.6263 79.1109 32.6274 79.6287L29.5482 78.0615C28.5471 77.5506 27.912 76.3355 27.912 74.6163V37.0929C27.912 34.0068 29.9694 30.4651 32.5031 29.174L63.3366 13.4605C64.4619 12.8874 65.4906 12.8598 66.2846 13.2671L69.3638 14.8343Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.25"
@@ -13,63 +56,29 @@ export const PriorityHorizontalStackIllustration = ({ className }: TIllustration
         strokeLinejoin="round"
       />
       <path
-        d="M42.4519 2.9385C43.4529 3.4494 44.0881 4.66451 44.0881 6.38361V43.907C44.0881 46.9931 42.0307 50.5349 39.4969 51.8259L8.6635 67.5395C7.53814 68.1125 6.50945 68.1402 5.71548 67.7328C4.7144 67.2219 4.07922 66.0068 4.07922 64.2877V26.7643C4.07922 23.6782 6.13663 20.1364 8.67041 18.8453L39.5038 3.13184C40.6292 2.5588 41.6579 2.53117 42.4519 2.9385Z"
+        d="M69.3638 14.8343C70.3649 15.3452 71.0001 16.5603 71.0001 18.2794V55.8028C71.0001 58.8889 68.9427 62.4306 66.4089 63.7217L35.5755 79.4353C34.4501 80.0083 33.4214 80.0359 32.6275 79.6286C31.6264 79.1177 30.9912 77.9026 30.9912 76.1835V38.6601C30.9912 35.574 33.0486 32.0322 35.5824 30.7412L66.4158 15.0276C67.5412 14.4546 68.5699 14.4269 69.3638 14.8343Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.25"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M55.9078 8.88293C55.1069 8.47559 54.0782 8.51013 52.9598 9.07626L22.1264 24.7899C19.5926 26.0809 17.5352 29.6296 17.5352 32.7088V70.2322C17.5352 71.9513 18.1704 73.1595 19.1715 73.6773L16.0923 72.11C15.0912 71.5991 14.456 70.384 14.456 68.6649V31.1415C14.456 28.0554 16.5134 24.5137 19.0472 23.2226L49.8806 7.50903C51.006 6.936 52.0347 6.90836 52.8286 7.3157L55.9078 8.88293Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.25"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M41.9065 64.3778C41.1954 64.7369 40.6154 64.3364 40.6154 63.4734C40.6154 62.6104 41.1816 61.6162 41.8927 61.2572H41.9065C42.6176 60.8913 43.1906 61.2987 43.1906 62.1617C43.1906 63.0247 42.6176 64.0188 41.9065 64.3778Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M55.9079 8.88284C56.909 9.39374 57.5441 10.6088 57.5441 12.3279V49.8514C57.5441 52.9375 55.4867 56.4792 52.9529 57.7703L22.1195 73.4838C20.9942 74.0569 19.9655 74.0845 19.1715 73.6772C18.1704 73.1663 17.5352 71.9512 17.5352 70.2321V32.7087C17.5352 29.6226 19.5926 26.0808 22.1264 24.7898L52.9598 9.07617C54.0852 8.50314 55.1139 8.4755 55.9079 8.88284Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.25"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M48.3203 61.112C47.6092 61.471 47.0362 61.0636 47.0362 60.2006V53.9456C47.0362 53.0826 47.6092 52.0883 48.3203 51.7293C49.0314 51.3703 49.6045 51.7777 49.6045 52.6407V58.8957C49.6045 59.7587 49.0314 60.7529 48.3203 61.112Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M69.3638 14.8343C68.5629 14.427 67.5342 14.4615 66.4158 15.0277L35.5823 30.7413C33.0486 32.0323 30.9912 35.581 30.9912 38.6602V76.1836C30.9912 77.9027 31.6263 79.1109 32.6274 79.6287L29.5482 78.0615C28.5471 77.5506 27.912 76.3355 27.912 74.6163V37.0929C27.912 34.0068 29.9694 30.4651 32.5031 29.174L63.3366 13.4605C64.4619 12.8874 65.4906 12.8598 66.2846 13.2671L69.3638 14.8343Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.25"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M69.3638 14.8343C70.3649 15.3452 71.0001 16.5603 71.0001 18.2794V55.8028C71.0001 58.8889 68.9427 62.4306 66.4089 63.7217L35.5755 79.4353C34.4501 80.0083 33.4214 80.0359 32.6275 79.6286C31.6264 79.1177 30.9912 77.9026 30.9912 76.1835V38.6601C30.9912 35.574 33.0486 32.0322 35.5824 30.7412L66.4158 15.0276C67.5412 14.4546 68.5699 14.4269 69.3638 14.8343Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.25"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M41.9065 64.3778C41.1954 64.7369 40.6154 64.3364 40.6154 63.4734C40.6154 62.6104 41.1816 61.6162 41.8927 61.2572H41.9065C42.6176 60.8913 43.1906 61.2987 43.1906 62.1617C43.1906 63.0247 42.6176 64.0188 41.9065 64.3778Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M48.3203 61.112C47.6092 61.471 47.0362 61.0636 47.0362 60.2006V53.9456C47.0362 53.0826 47.6092 52.0883 48.3203 51.7293C49.0314 51.3703 49.6045 51.7777 49.6045 52.6407V58.8957C49.6045 59.7587 49.0314 60.7529 48.3203 61.112Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M54.748 57.8396C54.0369 58.1986 53.4638 57.7913 53.4638 56.9283V44.4182C53.4638 43.5551 54.0369 42.561 54.748 42.202C55.4591 41.843 56.0321 42.2503 56.0321 43.1133V55.6234C56.0321 56.4864 55.4591 57.4806 54.748 57.8396Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M61.1687 54.5603C60.4576 54.9193 59.8846 54.5119 59.8846 53.6489V34.8838C59.8846 34.0208 60.4576 33.0266 61.1687 32.6675C61.8798 32.3085 62.4529 32.7159 62.4529 33.5789V52.344C62.4529 53.207 61.8798 54.2013 61.1687 54.5603Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M54.748 57.8396C54.0369 58.1986 53.4638 57.7913 53.4638 56.9283V44.4182C53.4638 43.5551 54.0369 42.561 54.748 42.202C55.4591 41.843 56.0321 42.2503 56.0321 43.1133V55.6234C56.0321 56.4864 55.4591 57.4806 54.748 57.8396Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M61.1687 54.5603C60.4576 54.9193 59.8846 54.5119 59.8846 53.6489V34.8838C59.8846 34.0208 60.4576 33.0266 61.1687 32.6675C61.8798 32.3085 62.4529 32.7159 62.4529 33.5789V52.344C62.4529 53.207 61.8798 54.2013 61.1687 54.5603Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/project.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/project.tsx
index f8b5b529a..e372175fc 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/project.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/project.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const ProjectHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="102"
-    height="115"
-    viewBox="0 0 102 115"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function ProjectHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="102"
+      height="115"
+      viewBox="0 0 102 115"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M60.2802 2.91929C59.1202 2.32929 57.6302 2.37929 56.0102 3.19929L11.3502 25.9593C7.68023 27.8293 4.70023 32.9693 4.70023 37.4293V91.7793C4.70023 94.2693 5.62023 96.0193 7.07023 96.7693L2.61023 94.4993C1.16023 93.7593 0.240234 91.9993 0.240234 89.5093V35.1593C0.240234 30.6893 3.22023 25.5593 6.89023 23.6893L51.5602 0.929289C53.1902 0.0992895 54.6802 0.0592895 55.8302 0.649289L60.2902 2.91929H60.2802Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M60.2802 2.91882C61.7302 3.65882 62.6502 5.41882 62.6502 7.90882V62.2588C62.6502 66.7288 59.6702 71.8588 56.0002 73.7288L11.3402 96.4888C9.7102 97.3188 8.2202 97.3588 7.0702 96.7688C5.6202 96.0288 4.7002 94.2688 4.7002 91.7788V37.4288C4.7002 32.9588 7.6802 27.8288 11.3502 25.9588L56.0102 3.19882C57.6402 2.36882 59.1302 2.32882 60.2802 2.91882Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M79.7705 11.5892C78.6105 10.9992 77.1205 11.0492 75.5005 11.8692L30.8405 34.6292C27.1705 36.4992 24.1905 41.6392 24.1905 46.0992V100.449C24.1905 102.939 25.1105 104.689 26.5605 105.439L22.1005 103.169C20.6505 102.429 19.7305 100.669 19.7305 98.1792V43.8292C19.7305 39.3592 22.7105 34.2292 26.3805 32.3592L71.0405 9.59921C72.6705 8.76921 74.1605 8.72921 75.3105 9.31921L79.7705 11.5892Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M79.7704 11.5887C81.2204 12.3287 82.1404 14.0887 82.1404 16.5787V70.9287C82.1404 75.3987 79.1604 80.5287 75.4904 82.3987L30.8304 105.159C29.2004 105.989 27.7104 106.029 26.5604 105.439C25.1104 104.699 24.1904 102.939 24.1904 100.449V46.0987C24.1904 41.6287 27.1704 36.4987 30.8404 34.6287L75.5004 11.8687C77.1304 11.0387 78.6204 10.9987 79.7704 11.5887Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M60.2802 2.91929C59.1202 2.32929 57.6302 2.37929 56.0102 3.19929L11.3502 25.9593C7.68023 27.8293 4.70023 32.9693 4.70023 37.4293V91.7793C4.70023 94.2693 5.62023 96.0193 7.07023 96.7693L2.61023 94.4993C1.16023 93.7593 0.240234 91.9993 0.240234 89.5093V35.1593C0.240234 30.6893 3.22023 25.5593 6.89023 23.6893L51.5602 0.929289C53.1902 0.0992895 54.6802 0.0592895 55.8302 0.649289L60.2902 2.91929H60.2802Z"
+        d="M99.2602 20.1986C98.1002 19.6086 96.6102 19.6586 94.9902 20.4786L50.3302 43.2386C46.6602 45.1086 43.6802 50.2486 43.6802 54.7086V109.059C43.6802 111.549 44.6002 113.299 46.0502 114.049L41.5902 111.779C40.1402 111.039 39.2202 109.279 39.2202 106.789V52.4386C39.2202 47.9686 42.2002 42.8386 45.8702 40.9686L90.5302 18.2086C92.1602 17.3786 93.6502 17.3386 94.8002 17.9286L99.2602 20.1986Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -20,51 +56,17 @@ export const ProjectHorizontalStackIllustration = ({ className }: TIllustrationA
         strokeLinejoin="round"
       />
       <path
-        d="M60.2802 2.91882C61.7302 3.65882 62.6502 5.41882 62.6502 7.90882V62.2588C62.6502 66.7288 59.6702 71.8588 56.0002 73.7288L11.3402 96.4888C9.7102 97.3188 8.2202 97.3588 7.0702 96.7688C5.6202 96.0288 4.7002 94.2688 4.7002 91.7788V37.4288C4.7002 32.9588 7.6802 27.8288 11.3502 25.9588L56.0102 3.19882C57.6402 2.36882 59.1302 2.32882 60.2802 2.91882Z"
+        d="M99.2602 20.1981C100.71 20.9381 101.63 22.6981 101.63 25.1881V79.5381C101.63 84.0081 98.6502 89.1381 94.9802 91.0081L50.3202 113.768C48.6902 114.598 47.2002 114.638 46.0502 114.048C44.6002 113.308 43.6802 111.548 43.6802 109.058V54.7081C43.6802 50.2381 46.6602 45.1081 50.3302 43.2381L94.9902 20.4781C96.6202 19.6481 98.1102 19.6081 99.2602 20.1981Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M79.7705 11.5892C78.6105 10.9992 77.1205 11.0492 75.5005 11.8692L30.8405 34.6292C27.1705 36.4992 24.1905 41.6392 24.1905 46.0992V100.449C24.1905 102.939 25.1105 104.689 26.5605 105.439L22.1005 103.169C20.6505 102.429 19.7305 100.669 19.7305 98.1792V43.8292C19.7305 39.3592 22.7105 34.2292 26.3805 32.3592L71.0405 9.59921C72.6705 8.76921 74.1605 8.72921 75.3105 9.31921L79.7705 11.5892Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M85.8902 51.3399L81.9602 53.3399V51.7399C81.9602 49.0999 80.2002 47.8499 78.0302 48.9599L72.7802 51.6299C70.6102 52.7399 68.8502 55.7799 68.8502 58.4199V60.0199L64.9202 62.0199C62.7502 63.1299 60.9902 66.1699 60.9902 68.8099V84.7699C60.9902 87.4099 62.7502 88.6599 64.9202 87.5499L85.9002 76.8599C88.0702 75.7499 89.8302 72.7099 89.8302 70.0699V54.1099C89.8302 51.4699 88.0702 50.2199 85.9002 51.3299L85.8902 51.3399ZM71.4602 57.0899C71.4602 56.2099 72.0502 55.1899 72.7702 54.8299L78.0202 52.1599C78.7402 51.7899 79.3302 52.2099 79.3302 53.0899V54.6899L71.4602 58.6999V57.0999V57.0899ZM79.3302 57.8699V77.0199L71.4602 81.0299V61.8799L79.3302 57.8699ZM63.5902 83.4399V67.4799C63.5902 66.5999 64.1802 65.5799 64.9002 65.2199L68.8302 63.2199V82.3699L64.9002 84.3699C64.1802 84.7399 63.5902 84.3199 63.5902 83.4399ZM87.2002 71.4099C87.2002 72.2899 86.6102 73.3099 85.8902 73.6699L81.9602 75.6699V56.5199L85.8902 54.5199C86.6102 54.1499 87.2002 54.5699 87.2002 55.4499V71.4099Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-      <path
-        d="M79.7704 11.5887C81.2204 12.3287 82.1404 14.0887 82.1404 16.5787V70.9287C82.1404 75.3987 79.1604 80.5287 75.4904 82.3987L30.8304 105.159C29.2004 105.989 27.7104 106.029 26.5604 105.439C25.1104 104.699 24.1904 102.939 24.1904 100.449V46.0987C24.1904 41.6287 27.1704 36.4987 30.8404 34.6287L75.5004 11.8687C77.1304 11.0387 78.6204 10.9987 79.7704 11.5887Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </g>
-    <path
-      d="M99.2602 20.1986C98.1002 19.6086 96.6102 19.6586 94.9902 20.4786L50.3302 43.2386C46.6602 45.1086 43.6802 50.2486 43.6802 54.7086V109.059C43.6802 111.549 44.6002 113.299 46.0502 114.049L41.5902 111.779C40.1402 111.039 39.2202 109.279 39.2202 106.789V52.4386C39.2202 47.9686 42.2002 42.8386 45.8702 40.9686L90.5302 18.2086C92.1602 17.3786 93.6502 17.3386 94.8002 17.9286L99.2602 20.1986Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M99.2602 20.1981C100.71 20.9381 101.63 22.6981 101.63 25.1881V79.5381C101.63 84.0081 98.6502 89.1381 94.9802 91.0081L50.3202 113.768C48.6902 114.598 47.2002 114.638 46.0502 114.048C44.6002 113.308 43.6802 111.548 43.6802 109.058V54.7081C43.6802 50.2381 46.6602 45.1081 50.3302 43.2381L94.9902 20.4781C96.6202 19.6481 98.1102 19.6081 99.2602 20.1981Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M85.8902 51.3399L81.9602 53.3399V51.7399C81.9602 49.0999 80.2002 47.8499 78.0302 48.9599L72.7802 51.6299C70.6102 52.7399 68.8502 55.7799 68.8502 58.4199V60.0199L64.9202 62.0199C62.7502 63.1299 60.9902 66.1699 60.9902 68.8099V84.7699C60.9902 87.4099 62.7502 88.6599 64.9202 87.5499L85.9002 76.8599C88.0702 75.7499 89.8302 72.7099 89.8302 70.0699V54.1099C89.8302 51.4699 88.0702 50.2199 85.9002 51.3299L85.8902 51.3399ZM71.4602 57.0899C71.4602 56.2099 72.0502 55.1899 72.7702 54.8299L78.0202 52.1599C78.7402 51.7899 79.3302 52.2099 79.3302 53.0899V54.6899L71.4602 58.6999V57.0999V57.0899ZM79.3302 57.8699V77.0199L71.4602 81.0299V61.8799L79.3302 57.8699ZM63.5902 83.4399V67.4799C63.5902 66.5999 64.1802 65.5799 64.9002 65.2199L68.8302 63.2199V82.3699L64.9002 84.3699C64.1802 84.7399 63.5902 84.3199 63.5902 83.4399ZM87.2002 71.4099C87.2002 72.2899 86.6102 73.3099 85.8902 73.6699L81.9602 75.6699V56.5199L85.8902 54.5199C86.6102 54.1499 87.2002 54.5699 87.2002 55.4499V71.4099Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/settings.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/settings.tsx
index c5a5f78ab..12db92477 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/settings.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/settings.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const SettingsHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="71" height="80" viewBox="0 0 71 80" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function SettingsHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="71"
+      height="80"
+      viewBox="0 0 71 80"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M41.9517 2.43803C41.1509 2.0307 40.1222 2.0654 39.0037 2.63153L8.17035 18.3449C5.63658 19.636 3.57916 23.1848 3.57916 26.264V63.787C3.57916 65.5061 4.21433 66.7145 5.21541 67.2323L2.13625 65.6651C1.13517 65.1542 0.5 63.9393 0.5 62.2202V24.6967C0.5 21.6107 2.55741 18.0687 5.09119 16.7777L35.9246 1.06431C37.0499 0.491274 38.0785 0.46347 38.8725 0.870807L41.9517 2.43803Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M41.9518 2.4388C42.9529 2.9497 43.5881 4.16497 43.5881 5.88407V43.4075C43.5881 46.4936 41.5306 50.0351 38.9969 51.3262L8.1635 67.0399C7.03815 67.6129 6.00943 67.6404 5.21547 67.2331C4.21439 66.7222 3.57922 65.5069 3.57922 63.7878V26.2647C3.57922 23.1786 5.63664 19.6367 8.17041 18.3457L39.0038 2.6323C40.1291 2.05927 41.1578 2.03146 41.9518 2.4388Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M55.4078 8.38193C54.6069 7.97459 53.5782 8.0093 52.4598 8.57543L21.6264 24.2888C19.0926 25.5799 17.0352 29.1287 17.0352 32.2079V69.7313C17.0352 71.4504 17.6705 72.6584 18.6716 73.1762L15.5923 71.609C14.5912 71.0981 13.9561 69.8831 13.9561 68.164V30.6406C13.9561 27.5545 16.0135 24.0126 18.5472 22.7216L49.3806 7.0082C50.506 6.43517 51.5347 6.4077 52.3286 6.81504L55.4078 8.38193Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M55.4079 8.38106C56.4089 8.89196 57.0441 10.1072 57.0441 11.8263V49.3497C57.0441 52.4358 54.9867 55.9774 52.4529 57.2685L21.6196 72.9822C20.4942 73.5552 19.4656 73.5827 18.6716 73.1753C17.6705 72.6644 17.0353 71.4495 17.0353 69.7304V32.207C17.0353 29.1209 19.0927 25.579 21.6265 24.2879L52.4598 8.57456C53.5852 8.00153 54.6139 7.97372 55.4079 8.38106Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M41.9517 2.43803C41.1509 2.0307 40.1222 2.0654 39.0037 2.63153L8.17035 18.3449C5.63658 19.636 3.57916 23.1848 3.57916 26.264V63.787C3.57916 65.5061 4.21433 66.7145 5.21541 67.2323L2.13625 65.6651C1.13517 65.1542 0.5 63.9393 0.5 62.2202V24.6967C0.5 21.6107 2.55741 18.0687 5.09119 16.7777L35.9246 1.06431C37.0499 0.491274 38.0785 0.46347 38.8725 0.870807L41.9517 2.43803Z"
+        d="M68.8636 14.3338C68.0627 13.9264 67.034 13.9612 65.9156 14.5273L35.0822 30.2407C32.5484 31.5317 30.4911 35.0805 30.4911 38.1597V75.6831C30.4911 77.4022 31.1263 78.6103 32.1274 79.1281L29.0481 77.5608C28.047 77.0499 27.4119 75.835 27.4119 74.1159V36.5925C27.4119 33.5064 29.4693 29.9645 32.0031 28.6734L62.8364 12.9601C63.9618 12.387 64.9905 12.3592 65.7844 12.7666L68.8636 14.3338Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
@@ -13,55 +56,21 @@ export const SettingsHorizontalStackIllustration = ({ className }: TIllustration
         strokeLinejoin="round"
       />
       <path
-        d="M41.9518 2.4388C42.9529 2.9497 43.5881 4.16497 43.5881 5.88407V43.4075C43.5881 46.4936 41.5306 50.0351 38.9969 51.3262L8.1635 67.0399C7.03815 67.6129 6.00943 67.6404 5.21547 67.2331C4.21439 66.7222 3.57922 65.5069 3.57922 63.7878V26.2647C3.57922 23.1786 5.63664 19.6367 8.17041 18.3457L39.0038 2.6323C40.1291 2.05927 41.1578 2.03146 41.9518 2.4388Z"
+        d="M68.8636 14.3347C69.8647 14.8456 70.4998 16.0608 70.4998 17.7799V55.3033C70.4998 58.3894 68.4424 61.931 65.9086 63.2221L35.0753 78.9358C33.9499 79.5088 32.9213 79.5363 32.1273 79.129C31.1263 78.618 30.4911 77.4031 30.4911 75.684V38.1606C30.4911 35.0745 32.5484 31.5326 35.0822 30.2416L65.9156 14.5282C67.0409 13.9551 68.0696 13.9273 68.8636 14.3347Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M55.4078 8.38193C54.6069 7.97459 53.5782 8.0093 52.4598 8.57543L21.6264 24.2888C19.0926 25.5799 17.0352 29.1287 17.0352 32.2079V69.7313C17.0352 71.4504 17.6705 72.6584 18.6716 73.1762L15.5923 71.609C14.5912 71.0981 13.9561 69.8831 13.9561 68.164V30.6406C13.9561 27.5545 16.0135 24.0126 18.5472 22.7216L49.3806 7.0082C50.506 6.43517 51.5347 6.4077 52.3286 6.81504L55.4078 8.38193Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.35"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M50.7681 61.8964C50.6645 61.9516 50.5609 62.0001 50.4574 62.0346C48.9178 62.6422 47.6889 61.7721 47.5439 59.9701C47.5163 59.5559 47.3506 59.2589 47.0813 59.1277C46.8189 58.9896 46.4876 59.0313 46.1355 59.2454C45.9836 59.3351 45.8386 59.4592 45.7005 59.6111C44.0642 61.3509 42.1449 61.4475 41.4062 59.8458C40.771 58.465 41.2129 56.2075 42.4695 54.4746C42.7594 54.0741 42.9528 53.6184 43.008 53.1696C43.0632 52.7209 42.9941 52.3413 42.7939 52.0996C42.7042 51.9961 42.6006 51.9201 42.4764 51.8718C41.7653 51.6163 41.3027 50.9397 41.1646 49.9731C41.0265 49.0066 41.2267 47.8604 41.7307 46.7558C42.6282 44.7812 44.2921 43.3866 45.6936 43.4487C46.3495 43.4832 47.1227 42.7515 47.4265 41.8056C47.4886 41.6054 47.5301 41.412 47.5439 41.2187C47.5439 41.1842 47.5439 41.1498 47.5508 41.1152C47.6475 40.052 48.0548 38.9335 48.7038 37.9531C49.3735 36.9452 50.2157 36.1997 51.0718 35.8614C52.6114 35.2538 53.8403 36.1236 53.9853 37.9255C54.0198 38.3397 54.1787 38.6368 54.4479 38.7679C54.7172 38.8991 55.0486 38.8577 55.3938 38.6506C55.5457 38.554 55.6906 38.4366 55.8287 38.2916C57.4581 36.5587 59.3843 36.4552 60.123 38.057C60.7582 39.4378 60.3095 41.6952 59.0598 43.4282C58.4661 44.2359 58.3279 45.2991 58.7353 45.8031C58.825 45.9067 58.9287 45.9825 59.0529 46.0239C59.764 46.2793 60.2265 46.9561 60.3715 47.9158C60.5096 48.8823 60.3163 50.0216 59.8124 51.1331C58.9148 53.1146 57.251 54.5091 55.8425 54.4469C55.5181 54.4262 55.1659 54.592 54.8414 54.9027C54.5169 55.2134 54.2546 55.6343 54.1096 56.09C54.0475 56.2902 54.006 56.4905 53.9922 56.6769C53.9094 57.7747 53.4952 58.9278 52.8324 59.9358C52.2456 60.8195 51.5276 61.5029 50.775 61.8826L50.7681 61.8964ZM46.2528 56.829C47.0123 56.4423 47.7372 56.3939 48.3241 56.6907C48.9868 57.029 49.3942 57.7676 49.4701 58.7825C49.5254 59.4936 50.0224 59.846 50.6369 59.6044C50.9821 59.4732 51.3204 59.1695 51.5896 58.769C51.8589 58.3617 52.0246 57.899 52.0522 57.4641C52.0868 57.0015 52.1834 56.5045 52.3422 56.0074C52.7081 54.8683 53.3571 53.8117 54.1648 53.0385C54.9795 52.2652 55.8564 51.8647 56.6365 51.9061C57.1888 51.9268 57.8585 51.3678 58.2175 50.5739C58.4177 50.1251 58.5006 49.6694 58.4454 49.2827C58.3901 48.8961 58.2037 48.6268 57.9207 48.5232C57.6238 48.4197 57.3545 48.2332 57.1405 47.964C56.1187 46.7074 56.4708 44.0701 57.9276 42.0817C58.4247 41.3982 58.6042 40.4941 58.3487 39.9418C58.0518 39.2997 57.2786 39.341 56.6296 40.0314C56.2982 40.3904 55.9323 40.6941 55.5595 40.9288C54.7034 41.4604 53.861 41.5639 53.1982 41.2326C52.5355 40.8943 52.1282 40.1555 52.0522 39.1475C51.997 38.4295 51.4999 38.0843 50.8854 38.326C50.1743 38.5952 49.5392 39.569 49.4701 40.4734C49.4701 40.501 49.4701 40.5284 49.4632 40.556C49.4218 41.0047 49.332 41.4606 49.1801 41.93C48.4276 44.2843 46.4945 46.1206 44.879 46.0239C44.3266 46.0032 43.6569 46.5627 43.2979 47.3498C43.0977 47.7985 43.0149 48.2539 43.0701 48.6406C43.1253 49.0272 43.3118 49.2965 43.5948 49.4001C43.8917 49.5036 44.161 49.6902 44.375 49.9526C44.8721 50.5601 45.0653 51.5059 44.9134 52.6174C44.7615 53.729 44.2921 54.8752 43.5879 55.8348C43.0908 56.5183 42.9113 57.4225 43.1668 57.9748C43.4636 58.6169 44.2369 58.5755 44.8859 57.8851C45.2173 57.5261 45.5831 57.2225 45.9629 56.9877C46.0595 56.9256 46.1562 56.8702 46.2528 56.8219V56.829Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M55.4079 8.38106C56.4089 8.89196 57.0441 10.1072 57.0441 11.8263V49.3497C57.0441 52.4358 54.9867 55.9774 52.4529 57.2685L21.6196 72.9822C20.4942 73.5552 19.4656 73.5827 18.6716 73.1753C17.6705 72.6644 17.0353 71.4495 17.0353 69.7304V32.207C17.0353 29.1209 19.0927 25.579 21.6265 24.2879L52.4598 8.57456C53.5852 8.00153 54.6139 7.97372 55.4079 8.38106Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.35"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M50.7612 53.673C48.6279 54.7639 46.8881 53.5351 46.8881 50.9323C46.8881 48.3295 48.6279 45.3332 50.7612 44.2424C52.8945 43.1515 54.6343 44.3803 54.6343 46.9831C54.6343 49.5859 52.8945 52.5822 50.7612 53.673ZM50.7612 46.6035C49.6911 47.1489 48.8211 48.647 48.8211 49.9449C48.8211 51.2429 49.6911 51.8573 50.7612 51.3119C51.8313 50.7665 52.7012 49.2684 52.7012 47.9705C52.7012 46.6725 51.8313 46.0581 50.7612 46.6035Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M68.8636 14.3338C68.0627 13.9264 67.034 13.9612 65.9156 14.5273L35.0822 30.2407C32.5484 31.5317 30.4911 35.0805 30.4911 38.1597V75.6831C30.4911 77.4022 31.1263 78.6103 32.1274 79.1281L29.0481 77.5608C28.047 77.0499 27.4119 75.835 27.4119 74.1159V36.5925C27.4119 33.5064 29.4693 29.9645 32.0031 28.6734L62.8364 12.9601C63.9618 12.387 64.9905 12.3592 65.7844 12.7666L68.8636 14.3338Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M68.8636 14.3347C69.8647 14.8456 70.4998 16.0608 70.4998 17.7799V55.3033C70.4998 58.3894 68.4424 61.931 65.9086 63.2221L35.0753 78.9358C33.9499 79.5088 32.9213 79.5363 32.1273 79.129C31.1263 78.618 30.4911 77.4031 30.4911 75.684V38.1606C30.4911 35.0745 32.5484 31.5326 35.0822 30.2416L65.9156 14.5282C67.0409 13.9551 68.0696 13.9273 68.8636 14.3347Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M50.7681 61.8964C50.6645 61.9516 50.5609 62.0001 50.4574 62.0346C48.9178 62.6422 47.6889 61.7721 47.5439 59.9701C47.5163 59.5559 47.3506 59.2589 47.0813 59.1277C46.8189 58.9896 46.4876 59.0313 46.1355 59.2454C45.9836 59.3351 45.8386 59.4592 45.7005 59.6111C44.0642 61.3509 42.1449 61.4475 41.4062 59.8458C40.771 58.465 41.2129 56.2075 42.4695 54.4746C42.7594 54.0741 42.9528 53.6184 43.008 53.1696C43.0632 52.7209 42.9941 52.3413 42.7939 52.0996C42.7042 51.9961 42.6006 51.9201 42.4764 51.8718C41.7653 51.6163 41.3027 50.9397 41.1646 49.9731C41.0265 49.0066 41.2267 47.8604 41.7307 46.7558C42.6282 44.7812 44.2921 43.3866 45.6936 43.4487C46.3495 43.4832 47.1227 42.7515 47.4265 41.8056C47.4886 41.6054 47.5301 41.412 47.5439 41.2187C47.5439 41.1842 47.5439 41.1498 47.5508 41.1152C47.6475 40.052 48.0548 38.9335 48.7038 37.9531C49.3735 36.9452 50.2157 36.1997 51.0718 35.8614C52.6114 35.2538 53.8403 36.1236 53.9853 37.9255C54.0198 38.3397 54.1787 38.6368 54.4479 38.7679C54.7172 38.8991 55.0486 38.8577 55.3938 38.6506C55.5457 38.554 55.6906 38.4366 55.8287 38.2916C57.4581 36.5587 59.3843 36.4552 60.123 38.057C60.7582 39.4378 60.3095 41.6952 59.0598 43.4282C58.4661 44.2359 58.3279 45.2991 58.7353 45.8031C58.825 45.9067 58.9287 45.9825 59.0529 46.0239C59.764 46.2793 60.2265 46.9561 60.3715 47.9158C60.5096 48.8823 60.3163 50.0216 59.8124 51.1331C58.9148 53.1146 57.251 54.5091 55.8425 54.4469C55.5181 54.4262 55.1659 54.592 54.8414 54.9027C54.5169 55.2134 54.2546 55.6343 54.1096 56.09C54.0475 56.2902 54.006 56.4905 53.9922 56.6769C53.9094 57.7747 53.4952 58.9278 52.8324 59.9358C52.2456 60.8195 51.5276 61.5029 50.775 61.8826L50.7681 61.8964ZM46.2528 56.829C47.0123 56.4423 47.7372 56.3939 48.3241 56.6907C48.9868 57.029 49.3942 57.7676 49.4701 58.7825C49.5254 59.4936 50.0224 59.846 50.6369 59.6044C50.9821 59.4732 51.3204 59.1695 51.5896 58.769C51.8589 58.3617 52.0246 57.899 52.0522 57.4641C52.0868 57.0015 52.1834 56.5045 52.3422 56.0074C52.7081 54.8683 53.3571 53.8117 54.1648 53.0385C54.9795 52.2652 55.8564 51.8647 56.6365 51.9061C57.1888 51.9268 57.8585 51.3678 58.2175 50.5739C58.4177 50.1251 58.5006 49.6694 58.4454 49.2827C58.3901 48.8961 58.2037 48.6268 57.9207 48.5232C57.6238 48.4197 57.3545 48.2332 57.1405 47.964C56.1187 46.7074 56.4708 44.0701 57.9276 42.0817C58.4247 41.3982 58.6042 40.4941 58.3487 39.9418C58.0518 39.2997 57.2786 39.341 56.6296 40.0314C56.2982 40.3904 55.9323 40.6941 55.5595 40.9288C54.7034 41.4604 53.861 41.5639 53.1982 41.2326C52.5355 40.8943 52.1282 40.1555 52.0522 39.1475C51.997 38.4295 51.4999 38.0843 50.8854 38.326C50.1743 38.5952 49.5392 39.569 49.4701 40.4734C49.4701 40.501 49.4701 40.5284 49.4632 40.556C49.4218 41.0047 49.332 41.4606 49.1801 41.93C48.4276 44.2843 46.4945 46.1206 44.879 46.0239C44.3266 46.0032 43.6569 46.5627 43.2979 47.3498C43.0977 47.7985 43.0149 48.2539 43.0701 48.6406C43.1253 49.0272 43.3118 49.2965 43.5948 49.4001C43.8917 49.5036 44.161 49.6902 44.375 49.9526C44.8721 50.5601 45.0653 51.5059 44.9134 52.6174C44.7615 53.729 44.2921 54.8752 43.5879 55.8348C43.0908 56.5183 42.9113 57.4225 43.1668 57.9748C43.4636 58.6169 44.2369 58.5755 44.8859 57.8851C45.2173 57.5261 45.5831 57.2225 45.9629 56.9877C46.0595 56.9256 46.1562 56.8702 46.2528 56.8219V56.829Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M50.7612 53.673C48.6279 54.7639 46.8881 53.5351 46.8881 50.9323C46.8881 48.3295 48.6279 45.3332 50.7612 44.2424C52.8945 43.1515 54.6343 44.3803 54.6343 46.9831C54.6343 49.5859 52.8945 52.5822 50.7612 53.673ZM50.7612 46.6035C49.6911 47.1489 48.8211 48.647 48.8211 49.9449C48.8211 51.2429 49.6911 51.8573 50.7612 51.3119C51.8313 50.7665 52.7012 49.2684 52.7012 47.9705C52.7012 46.6725 51.8313 46.0581 50.7612 46.6035Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/state.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/state.tsx
index b3daeae3a..306a79d97 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/state.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/state.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const StateHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="72" height="81" viewBox="0 0 72 81" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function StateHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="72"
+      height="81"
+      viewBox="0 0 72 81"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M42.4518 2.9386C41.651 2.53126 40.6223 2.5658 39.5038 3.13193L8.6704 18.8454C6.13661 20.1365 4.07922 23.6852 4.07922 26.7644V64.2879C4.07922 66.007 4.71436 67.2152 5.71545 67.733L2.63625 66.1657C1.63517 65.6548 1 64.4397 1 62.7206V25.1972C1 22.1111 3.0574 18.5693 5.59118 17.2783L36.4246 1.5647C37.55 0.991664 38.5787 0.964027 39.3726 1.37137L42.4518 2.9386Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M42.4519 2.9385C43.453 3.4494 44.0882 4.66451 44.0882 6.38361V43.907C44.0882 46.9931 42.0307 50.5349 39.497 51.8259L8.66355 67.5395C7.5382 68.1126 6.50948 68.1402 5.71552 67.7329C4.71443 67.222 4.07928 66.0069 4.07928 64.2878V26.7643C4.07928 23.6782 6.13668 20.1364 8.67046 18.8453L39.5039 3.13184C40.6292 2.5588 41.6579 2.53117 42.4519 2.9385Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M55.9078 8.88293C55.1069 8.47559 54.0782 8.51013 52.9597 9.07626L22.1263 24.7899C19.5925 26.0809 17.5351 29.6296 17.5351 32.7088V70.2322C17.5351 71.9513 18.1703 73.1595 19.1714 73.6773L16.0922 72.1101C15.0911 71.5992 14.4559 70.3841 14.4559 68.665V31.1415C14.4559 28.0554 16.5133 24.5137 19.0471 23.2226L49.8805 7.50903C51.0059 6.936 52.0346 6.90836 52.8286 7.3157L55.9078 8.88293Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M55.9078 8.88284C56.9089 9.39374 57.5441 10.6088 57.5441 12.3279V49.8514C57.5441 52.9375 55.4867 56.4792 52.9529 57.7703L22.1194 73.4839C20.9941 74.0569 19.9654 74.0845 19.1715 73.6772C18.1704 73.1663 17.5352 71.9512 17.5352 70.2321V32.7087C17.5352 29.6226 19.5926 26.0808 22.1264 24.7898L52.9598 9.07617C54.0851 8.50314 55.1138 8.4755 55.9078 8.88284Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.25"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M42.4518 2.9386C41.651 2.53126 40.6223 2.5658 39.5038 3.13193L8.6704 18.8454C6.13661 20.1365 4.07922 23.6852 4.07922 26.7644V64.2879C4.07922 66.007 4.71436 67.2152 5.71545 67.733L2.63625 66.1657C1.63517 65.6548 1 64.4397 1 62.7206V25.1972C1 22.1111 3.0574 18.5693 5.59118 17.2783L36.4246 1.5647C37.55 0.991664 38.5787 0.964027 39.3726 1.37137L42.4518 2.9386Z"
+        d="M69.3638 14.8343C68.5629 14.427 67.5342 14.4615 66.4158 15.0277L35.5823 30.7413C33.0485 32.0323 30.9911 35.581 30.9911 38.6602V76.1836C30.9911 77.9027 31.6263 79.1109 32.6274 79.6287L29.5482 78.0615C28.5471 77.5506 27.9119 76.3355 27.9119 74.6164V37.093C27.9119 34.0069 29.9693 30.4651 32.5031 29.174L63.3365 13.4605C64.4619 12.8874 65.4906 12.8598 66.2846 13.2671L69.3638 14.8343Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.25"
@@ -13,51 +56,17 @@ export const StateHorizontalStackIllustration = ({ className }: TIllustrationAss
         strokeLinejoin="round"
       />
       <path
-        d="M42.4519 2.9385C43.453 3.4494 44.0882 4.66451 44.0882 6.38361V43.907C44.0882 46.9931 42.0307 50.5349 39.497 51.8259L8.66355 67.5395C7.5382 68.1126 6.50948 68.1402 5.71552 67.7329C4.71443 67.222 4.07928 66.0069 4.07928 64.2878V26.7643C4.07928 23.6782 6.13668 20.1364 8.67046 18.8453L39.5039 3.13184C40.6292 2.5588 41.6579 2.53117 42.4519 2.9385Z"
+        d="M69.3638 14.8343C70.3649 15.3452 71.0001 16.5603 71.0001 18.2794V55.8028C71.0001 58.8889 68.9427 62.4306 66.4089 63.7217L35.5755 79.4353C34.4501 80.0083 33.4214 80.036 32.6275 79.6286C31.6264 79.1177 30.9912 77.9026 30.9912 76.1835V38.6601C30.9912 35.574 33.0486 32.0322 35.5824 30.7412L66.4158 15.0276C67.5412 14.4546 68.5699 14.4269 69.3638 14.8343Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.25"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M55.9078 8.88293C55.1069 8.47559 54.0782 8.51013 52.9597 9.07626L22.1263 24.7899C19.5925 26.0809 17.5351 29.6296 17.5351 32.7088V70.2322C17.5351 71.9513 18.1703 73.1595 19.1714 73.6773L16.0922 72.1101C15.0911 71.5992 14.4559 70.3841 14.4559 68.665V31.1415C14.4559 28.0554 16.5133 24.5137 19.0471 23.2226L49.8805 7.50903C51.0059 6.936 52.0346 6.90836 52.8286 7.3157L55.9078 8.88293Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.25"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M51.9864 33.7926C45.2411 37.2308 39.78 46.6686 39.78 54.8706C39.78 63.0726 45.248 66.9389 51.9864 63.5076C58.7316 60.0694 64.1927 50.6316 64.1927 42.4296C64.1927 34.2276 58.7247 30.3613 51.9864 33.7926ZM46.9602 54.4772L44.8131 56.9764C44.1986 55.8994 43.8534 54.484 43.8534 52.7994C43.8534 51.1148 44.1986 49.3405 44.8131 47.6421L46.9602 47.9528C46.5322 49.1403 46.2905 50.3761 46.2905 51.5636C46.2905 52.7511 46.5322 53.7314 46.9602 54.4909V54.4772ZM51.9864 58.5505C50.5986 59.2547 49.2938 59.5032 48.1477 59.3444L49.3007 56.141C50.1015 56.2514 51.006 56.0858 51.9864 55.5887C52.9667 55.0916 53.8781 54.3321 54.672 53.407L55.825 55.4367C54.6858 56.7623 53.3741 57.8532 51.9864 58.5574V58.5505ZM54.672 41.1592C53.8781 41.0488 52.9667 41.2144 51.9864 41.7115C51.006 42.2086 50.1015 42.9681 49.3007 43.8932L48.1477 41.8635C49.2869 40.5379 50.5986 39.447 51.9864 38.7428C53.3741 38.0386 54.6789 37.7901 55.825 37.9488L54.672 41.1523V41.1592ZM59.1734 49.6581L57.0194 49.3543C57.4474 48.1668 57.6891 46.931 57.6891 45.7435C57.6891 44.556 57.4474 43.5688 57.0194 42.8162L59.1734 40.317C59.781 41.394 60.1331 42.8093 60.1331 44.5008C60.1331 46.1854 59.7879 47.9597 59.1734 49.6581Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-      <path
-        d="M55.9078 8.88284C56.9089 9.39374 57.5441 10.6088 57.5441 12.3279V49.8514C57.5441 52.9375 55.4867 56.4792 52.9529 57.7703L22.1194 73.4839C20.9941 74.0569 19.9654 74.0845 19.1715 73.6772C18.1704 73.1663 17.5352 71.9512 17.5352 70.2321V32.7087C17.5352 29.6226 19.5926 26.0808 22.1264 24.7898L52.9598 9.07617C54.0851 8.50314 55.1138 8.4755 55.9078 8.88284Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.25"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </g>
-    <path
-      d="M69.3638 14.8343C68.5629 14.427 67.5342 14.4615 66.4158 15.0277L35.5823 30.7413C33.0485 32.0323 30.9911 35.581 30.9911 38.6602V76.1836C30.9911 77.9027 31.6263 79.1109 32.6274 79.6287L29.5482 78.0615C28.5471 77.5506 27.9119 76.3355 27.9119 74.6164V37.093C27.9119 34.0069 29.9693 30.4651 32.5031 29.174L63.3365 13.4605C64.4619 12.8874 65.4906 12.8598 66.2846 13.2671L69.3638 14.8343Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.25"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M69.3638 14.8343C70.3649 15.3452 71.0001 16.5603 71.0001 18.2794V55.8028C71.0001 58.8889 68.9427 62.4306 66.4089 63.7217L35.5755 79.4353C34.4501 80.0083 33.4214 80.036 32.6275 79.6286C31.6264 79.1177 30.9912 77.9026 30.9912 76.1835V38.6601C30.9912 35.574 33.0486 32.0322 35.5824 30.7412L66.4158 15.0276C67.5412 14.4546 68.5699 14.4269 69.3638 14.8343Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.25"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M51.9864 33.7926C45.2411 37.2308 39.78 46.6686 39.78 54.8706C39.78 63.0726 45.248 66.9389 51.9864 63.5076C58.7316 60.0694 64.1927 50.6316 64.1927 42.4296C64.1927 34.2276 58.7247 30.3613 51.9864 33.7926ZM46.9602 54.4772L44.8131 56.9764C44.1986 55.8994 43.8534 54.484 43.8534 52.7994C43.8534 51.1148 44.1986 49.3405 44.8131 47.6421L46.9602 47.9528C46.5322 49.1403 46.2905 50.3761 46.2905 51.5636C46.2905 52.7511 46.5322 53.7314 46.9602 54.4909V54.4772ZM51.9864 58.5505C50.5986 59.2547 49.2938 59.5032 48.1477 59.3444L49.3007 56.141C50.1015 56.2514 51.006 56.0858 51.9864 55.5887C52.9667 55.0916 53.8781 54.3321 54.672 53.407L55.825 55.4367C54.6858 56.7623 53.3741 57.8532 51.9864 58.5574V58.5505ZM54.672 41.1592C53.8781 41.0488 52.9667 41.2144 51.9864 41.7115C51.006 42.2086 50.1015 42.9681 49.3007 43.8932L48.1477 41.8635C49.2869 40.5379 50.5986 39.447 51.9864 38.7428C53.3741 38.0386 54.6789 37.7901 55.825 37.9488L54.672 41.1523V41.1592ZM59.1734 49.6581L57.0194 49.3543C57.4474 48.1668 57.6891 46.931 57.6891 45.7435C57.6891 44.556 57.4474 43.5688 57.0194 42.8162L59.1734 40.317C59.781 41.394 60.1331 42.8093 60.1331 44.5008C60.1331 46.1854 59.7879 47.9597 59.1734 49.6581Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/template.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/template.tsx
index 2147891dd..5d89e7c9b 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/template.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/template.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const TemplateHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="81" height="92" viewBox="0 0 81 92" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function TemplateHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="81"
+      height="92"
+      viewBox="0 0 81 92"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M47.8783 2.45609C46.9629 1.98409 45.7871 2.02411 44.5088 2.68011L9.26704 20.8881C6.37099 22.3841 4.01943 26.4961 4.01943 30.0641V73.5441C4.01943 75.5361 4.74542 76.9361 5.88964 77.5361L2.37019 75.72C1.22598 75.128 0.5 73.7201 0.5 71.7281V28.2481C0.5 24.6721 2.85155 20.5681 5.74759 19.0721L40.9893 0.864095C42.2756 0.200096 43.4514 0.168121 44.3588 0.640121L47.8783 2.45609Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M47.8784 2.45571C49.0226 3.04771 49.7486 4.4557 49.7486 6.4477V49.9277C49.7486 53.5037 47.397 57.6077 44.501 59.1037L9.25923 77.3117C7.97298 77.9757 6.79721 78.0077 5.88973 77.5357C4.74552 76.9437 4.01953 75.5357 4.01953 73.5437V30.0637C4.01953 26.4877 6.37109 22.3837 9.26713 20.8877L44.5089 2.67974C45.7951 2.01574 46.9709 1.98371 47.8784 2.45571Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M63.2587 9.39208C62.3433 8.92008 61.1675 8.96005 59.8891 9.61605L24.6474 27.824C21.7514 29.32 19.3998 33.432 19.3998 37V80.48C19.3998 82.472 20.1258 83.872 21.27 84.472L17.7506 82.656C16.6064 82.064 15.8804 80.656 15.8804 78.664V35.1841C15.8804 31.6081 18.2319 27.504 21.128 26.008L56.3697 7.80004C57.656 7.13604 58.8317 7.10406 59.7392 7.57606L63.2587 9.39208Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M63.2583 9.39247C64.4025 9.98447 65.1285 11.3925 65.1285 13.3845V56.8644C65.1285 60.4404 62.7769 64.5444 59.8809 66.0404L24.6391 84.2484C23.3529 84.9124 22.1771 84.9444 21.2696 84.4724C20.1254 83.8804 19.3994 82.4724 19.3994 80.4804V37.0004C19.3994 33.4244 21.751 29.3204 24.647 27.8244L59.8888 9.61644C61.175 8.95245 62.3508 8.92047 63.2583 9.39247Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M47.8783 2.45609C46.9629 1.98409 45.7871 2.02411 44.5088 2.68011L9.26704 20.8881C6.37099 22.3841 4.01943 26.4961 4.01943 30.0641V73.5441C4.01943 75.5361 4.74542 76.9361 5.88964 77.5361L2.37019 75.72C1.22598 75.128 0.5 73.7201 0.5 71.7281V28.2481C0.5 24.6721 2.85155 20.5681 5.74759 19.0721L40.9893 0.864095C42.2756 0.200096 43.4514 0.168121 44.3588 0.640121L47.8783 2.45609Z"
+        d="M78.6297 16.2803C77.7144 15.8083 76.5386 15.8483 75.2602 16.5043L40.0185 34.7123C37.1225 36.2083 34.7709 40.3203 34.7709 43.8883V87.3683C34.7709 89.3603 35.4969 90.7603 36.6411 91.3603L33.1217 89.5443C31.9774 88.9523 31.2515 87.5443 31.2515 85.5522V42.0723C31.2515 38.4963 33.603 34.3923 36.4991 32.8963L71.7408 14.6883C73.0271 14.0243 74.2028 13.9923 75.1103 14.4643L78.6297 16.2803Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -13,65 +56,31 @@ export const TemplateHorizontalStackIllustration = ({ className }: TIllustration
         strokeLinejoin="round"
       />
       <path
-        d="M47.8784 2.45571C49.0226 3.04771 49.7486 4.4557 49.7486 6.4477V49.9277C49.7486 53.5037 47.397 57.6077 44.501 59.1037L9.25923 77.3117C7.97298 77.9757 6.79721 78.0077 5.88973 77.5357C4.74552 76.9437 4.01953 75.5357 4.01953 73.5437V30.0637C4.01953 26.4877 6.37109 22.3837 9.26713 20.8877L44.5089 2.67974C45.7951 2.01574 46.9709 1.98371 47.8784 2.45571Z"
+        d="M78.6298 16.28C79.7741 16.872 80.5 18.2799 80.5 20.2719V63.7519C80.5 67.3279 78.1485 71.4319 75.2524 72.9279L40.0107 91.1359C38.7244 91.7999 37.5487 91.8319 36.6412 91.3599C35.497 90.7679 34.771 89.3599 34.771 87.3679V43.8879C34.771 40.3119 37.1226 36.2079 40.0186 34.7119L75.2603 16.5039C76.5466 15.8399 77.7224 15.808 78.6298 16.28Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M63.2587 9.39208C62.3433 8.92008 61.1675 8.96005 59.8891 9.61605L24.6474 27.824C21.7514 29.32 19.3998 33.432 19.3998 37V80.48C19.3998 82.472 20.1258 83.872 21.27 84.472L17.7506 82.656C16.6064 82.064 15.8804 80.656 15.8804 78.664V35.1841C15.8804 31.6081 18.2319 27.504 21.128 26.008L56.3697 7.80004C57.656 7.13604 58.8317 7.10406 59.7392 7.57606L63.2587 9.39208Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M59.384 41.4397L55.6989 50.5676L63.0298 46.7837L59.384 41.4476V41.4397ZM59.313 38.2556C59.6523 38.0636 59.9838 37.9836 60.2836 38.0236C60.5835 38.0636 60.836 38.2156 61.0175 38.4636L61.0333 38.4797L65.2787 44.6877C65.4681 44.9437 65.5865 45.2956 65.6023 45.7036C65.6259 46.1276 65.547 46.6076 65.3892 47.0796C65.2235 47.5516 64.9788 48.0076 64.6711 48.3996C64.3633 48.7836 64.0161 49.0876 63.661 49.2716L55.1465 53.6716C54.7993 53.8636 54.4521 53.9436 54.1522 53.8956C53.8366 53.8476 53.5683 53.6716 53.3947 53.3756C53.2132 53.0876 53.1264 52.6956 53.1343 52.2476C53.1422 51.7996 53.2526 51.3196 53.442 50.8476L57.7111 40.2797C57.8768 39.8477 58.1057 39.4397 58.3819 39.0877C58.666 38.7197 58.9974 38.4317 59.3367 38.2397L59.313 38.2556Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M63.2583 9.39247C64.4025 9.98447 65.1285 11.3925 65.1285 13.3845V56.8644C65.1285 60.4404 62.7769 64.5444 59.8809 66.0404L24.6391 84.2484C23.3529 84.9124 22.1771 84.9444 21.2696 84.4724C20.1254 83.8804 19.3994 82.4724 19.3994 80.4804V37.0004C19.3994 33.4244 21.751 29.3204 24.647 27.8244L59.8888 9.61644C61.175 8.95245 62.3508 8.92047 63.2583 9.39247Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M47.8789 63.1118C47.8789 61.5438 48.9048 59.7438 50.1752 59.0878L55.92 56.1198C57.1904 55.4638 58.2163 56.1998 58.2163 57.7678V64.8558C58.2163 66.4237 57.1904 68.2238 55.92 68.8798L50.1752 71.8477C48.9048 72.5037 47.8789 71.7677 47.8789 70.1997V63.1118ZM55.92 58.9518L50.1752 61.9198V69.0077L55.92 66.0398V58.9518Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M78.6297 16.2803C77.7144 15.8083 76.5386 15.8483 75.2602 16.5043L40.0185 34.7123C37.1225 36.2083 34.7709 40.3203 34.7709 43.8883V87.3683C34.7709 89.3603 35.4969 90.7603 36.6411 91.3603L33.1217 89.5443C31.9774 88.9523 31.2515 87.5443 31.2515 85.5522V42.0723C31.2515 38.4963 33.603 34.3923 36.4991 32.8963L71.7408 14.6883C73.0271 14.0243 74.2028 13.9923 75.1103 14.4643L78.6297 16.2803Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M78.6298 16.28C79.7741 16.872 80.5 18.2799 80.5 20.2719V63.7519C80.5 67.3279 78.1485 71.4319 75.2524 72.9279L40.0107 91.1359C38.7244 91.7999 37.5487 91.8319 36.6412 91.3599C35.497 90.7679 34.771 89.3599 34.771 87.3679V43.8879C34.771 40.3119 37.1226 36.2079 40.0186 34.7119L75.2603 16.5039C76.5466 15.8399 77.7224 15.808 78.6298 16.28Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M59.384 41.4397L55.6989 50.5676L63.0298 46.7837L59.384 41.4476V41.4397ZM59.313 38.2556C59.6523 38.0636 59.9838 37.9836 60.2836 38.0236C60.5835 38.0636 60.836 38.2156 61.0175 38.4636L61.0333 38.4797L65.2787 44.6877C65.4681 44.9437 65.5865 45.2956 65.6023 45.7036C65.6259 46.1276 65.547 46.6076 65.3892 47.0796C65.2235 47.5516 64.9788 48.0076 64.6711 48.3996C64.3633 48.7836 64.0161 49.0876 63.661 49.2716L55.1465 53.6716C54.7993 53.8636 54.4521 53.9436 54.1522 53.8956C53.8366 53.8476 53.5683 53.6716 53.3947 53.3756C53.2132 53.0876 53.1264 52.6956 53.1343 52.2476C53.1422 51.7996 53.2526 51.3196 53.442 50.8476L57.7111 40.2797C57.8768 39.8477 58.1057 39.4397 58.3819 39.0877C58.666 38.7197 58.9974 38.4317 59.3367 38.2397L59.313 38.2556Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M47.8789 63.1118C47.8789 61.5438 48.9048 59.7438 50.1752 59.0878L55.92 56.1198C57.1904 55.4638 58.2163 56.1998 58.2163 57.7678V64.8558C58.2163 66.4237 57.1904 68.2238 55.92 68.8798L50.1752 71.8477C48.9048 72.5037 47.8789 71.7677 47.8789 70.1997V63.1118ZM55.92 58.9518L50.1752 61.9198V69.0077L55.92 66.0398V58.9518Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M65.6887 53.9033C64.1026 54.7193 62.8163 56.9753 62.8163 58.9353C62.8163 60.8953 64.1026 61.8153 65.6887 60.9993C67.2748 60.1833 68.5611 57.9273 68.5611 55.9673C68.5611 54.0073 67.2748 53.0873 65.6887 53.9033ZM60.52 60.1193C60.52 56.5993 62.8321 52.5433 65.6887 51.0633C68.5453 49.5913 70.8574 51.2473 70.8574 54.7753C70.8574 58.2953 68.5453 62.3513 65.6887 63.8313C62.8321 65.3033 60.52 63.6473 60.52 60.1193Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M65.6887 53.9033C64.1026 54.7193 62.8163 56.9753 62.8163 58.9353C62.8163 60.8953 64.1026 61.8153 65.6887 60.9993C67.2748 60.1833 68.5611 57.9273 68.5611 55.9673C68.5611 54.0073 67.2748 53.0873 65.6887 53.9033ZM60.52 60.1193C60.52 56.5993 62.8321 52.5433 65.6887 51.0633C68.5453 49.5913 70.8574 51.2473 70.8574 54.7753C70.8574 58.2953 68.5453 62.3513 65.6887 63.8313C62.8321 65.3033 60.52 63.6473 60.52 60.1193Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx
index 7f7204b58..bc625e754 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const TokenHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="81" height="92" viewBox="0 0 81 92" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function TokenHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="81"
+      height="92"
+      viewBox="0 0 81 92"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M47.8735 3.05272C46.9582 2.58718 45.7826 2.62663 44.5043 3.27365L9.26615 21.2323C6.3704 22.7078 4.01908 26.7634 4.01908 30.2826V73.167C4.01908 75.1317 4.74499 76.5126 5.88909 77.1043L2.37001 75.3132C1.22591 74.7293 0.5 73.3406 0.5 71.3759V28.4914C0.5 24.9644 2.85132 20.9166 5.74706 19.4411L40.9931 1.48252C42.2793 0.827616 43.4549 0.796055 44.3623 1.26159L47.8814 3.05272H47.8735Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M47.8735 3.05224C49.0176 3.63613 49.7435 5.02484 49.7435 6.98956V49.874C49.7435 53.401 47.3922 57.4488 44.4965 58.9243L9.25828 76.8829C7.97216 77.5378 6.7965 77.5694 5.88911 77.1039C4.74501 76.52 4.0191 75.1313 4.0191 73.1665V30.2821C4.0191 26.7551 6.37042 22.7073 9.26617 21.2318L44.5044 3.27317C45.7905 2.61827 46.9661 2.5867 47.8735 3.05224Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M63.2517 9.89232C62.3365 9.42678 61.1608 9.46623 59.8826 10.1132L24.6444 28.0719C21.7486 29.5474 19.3973 33.603 19.3973 37.1222V80.0066C19.3973 81.9713 20.1232 83.3522 21.2673 83.9439L17.7482 82.1528C16.6041 81.5689 15.8782 80.1802 15.8782 78.2155V35.331C15.8782 31.804 18.2296 27.7562 21.1253 26.2807L56.3635 8.32212C57.6496 7.66722 58.8253 7.63565 59.7326 8.10119L63.2517 9.89232Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M63.2518 9.89184C64.3958 10.4757 65.1218 11.8644 65.1218 13.8292V56.7136C65.1218 60.2406 62.7704 64.2884 59.8747 65.7639L24.6365 83.7225C23.3504 84.3774 22.1747 84.409 21.2673 83.9435C20.1232 83.3596 19.3973 81.9709 19.3973 80.0061V37.1217C19.3973 33.5947 21.7487 29.5469 24.6444 28.0714L59.8826 10.1128C61.1687 9.45787 62.3444 9.4263 63.2518 9.89184Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M47.8735 3.05272C46.9582 2.58718 45.7826 2.62663 44.5043 3.27365L9.26615 21.2323C6.3704 22.7078 4.01908 26.7634 4.01908 30.2826V73.167C4.01908 75.1317 4.74499 76.5126 5.88909 77.1043L2.37001 75.3132C1.22591 74.7293 0.5 73.3406 0.5 71.3759V28.4914C0.5 24.9644 2.85132 20.9166 5.74706 19.4411L40.9931 1.48252C42.2793 0.827616 43.4549 0.796055 44.3623 1.26159L47.8814 3.05272H47.8735Z"
+        d="M78.63 16.6875C77.7147 16.2219 76.539 16.2614 75.2608 16.9084L40.0226 34.867C37.1269 36.3425 34.7756 40.3982 34.7756 43.9173V86.8018C34.7756 88.7665 35.5015 90.1473 36.6456 90.7391L33.1265 88.948C31.9824 88.3641 31.2565 86.9754 31.2565 85.0107V42.1262C31.2565 38.5992 33.6078 34.5514 36.5035 33.0759L71.7417 15.1173C73.0278 14.4624 74.2035 14.4308 75.1109 14.8964L78.63 16.6875Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -13,59 +56,25 @@ export const TokenHorizontalStackIllustration = ({ className }: TIllustrationAss
         strokeLinejoin="round"
       />
       <path
-        d="M47.8735 3.05224C49.0176 3.63613 49.7435 5.02484 49.7435 6.98956V49.874C49.7435 53.401 47.3922 57.4488 44.4965 58.9243L9.25828 76.8829C7.97216 77.5378 6.7965 77.5694 5.88911 77.1039C4.74501 76.52 4.0191 75.1313 4.0191 73.1665V30.2821C4.0191 26.7551 6.37042 22.7073 9.26617 21.2318L44.5044 3.27317C45.7905 2.61827 46.9661 2.5867 47.8735 3.05224Z"
+        d="M78.63 16.6869C79.7741 17.2708 80.5 18.6595 80.5 20.6242V63.5087C80.5 67.0357 78.1487 71.0835 75.2529 72.559L40.0147 90.5176C38.7286 91.1725 37.553 91.204 36.6456 90.7385C35.5015 90.1546 34.7756 88.7659 34.7756 86.8012V43.9167C34.7756 40.3897 37.1269 36.3419 40.0226 34.8664L75.2608 16.9078C76.5469 16.2529 77.7226 16.2213 78.63 16.6869Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M63.2517 9.89232C62.3365 9.42678 61.1608 9.46623 59.8826 10.1132L24.6444 28.0719C21.7486 29.5474 19.3973 33.603 19.3973 37.1222V80.0066C19.3973 81.9713 20.1232 83.3522 21.2673 83.9439L17.7482 82.1528C16.6041 81.5689 15.8782 80.1802 15.8782 78.2155V35.331C15.8782 31.804 18.2296 27.7562 21.1253 26.2807L56.3635 8.32212C57.6496 7.66722 58.8253 7.63565 59.7326 8.10119L63.2517 9.89232Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M53.4204 72.4882L50.43 74.011C49.3332 74.5712 48.4337 73.94 48.4337 72.5986V69.9632C48.4337 68.9848 48.7493 67.9117 49.3095 66.9412L55.6849 55.934C55.322 54.3954 55.3851 52.5254 55.8664 50.5922C57.2235 45.1636 61.5001 40.4688 65.3979 40.1374C67.2837 39.9796 68.8065 40.8476 69.6745 42.5992C70.5424 44.343 70.6608 46.7575 70.0059 49.385C68.7197 54.5374 64.814 59.0192 61.0898 59.753L60.6953 60.4237C60.1272 61.4021 59.3776 62.1596 58.5807 62.5699L58.4071 62.6567V63.8718C58.4071 65.2132 57.5155 66.7597 56.4108 67.3199L55.4166 67.8249V69.04C55.4166 70.3814 54.525 71.9279 53.4204 72.4882ZM62.944 43.3094C60.6716 44.4693 58.5412 47.2782 57.7601 50.4344C57.3577 52.0598 57.3577 53.6143 57.7601 54.8294C57.8863 55.2081 57.7916 55.7368 57.5234 56.2102L50.7219 67.9433C50.5325 68.2668 50.43 68.6297 50.43 68.9532V71.5886L53.4204 70.0658V68.8507C53.4204 67.5093 54.312 65.9628 55.4166 65.4026L56.4108 64.8976V63.6824C56.4108 62.3411 57.3024 60.7945 58.4071 60.2343L58.5807 60.1475C58.8411 60.0134 59.1014 59.753 59.2829 59.4295L60.0956 58.025C60.3639 57.5595 60.7663 57.2439 61.1292 57.2123C63.9855 56.9677 67.118 53.5275 68.1122 49.5428C68.5935 47.6096 68.5067 45.8422 67.8676 44.5639C67.2285 43.2857 66.1159 42.6387 64.7351 42.7649C64.1433 42.8123 63.5358 43.0016 62.9361 43.3094H62.944Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M63.2518 9.89184C64.3958 10.4757 65.1218 11.8644 65.1218 13.8292V56.7136C65.1218 60.2406 62.7704 64.2884 59.8747 65.7639L24.6365 83.7225C23.3504 84.3774 22.1747 84.409 21.2673 83.9435C20.1232 83.3596 19.3973 81.9709 19.3973 80.0061V37.1217C19.3973 33.5947 21.7487 29.5469 24.6444 28.0714L59.8826 10.1128C61.1687 9.45787 62.3444 9.4263 63.2518 9.89184Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M63.8988 47.7273C64.1749 47.5853 64.3959 47.7431 64.3959 48.0824C64.3959 48.4217 64.1749 48.8004 63.8988 48.9424C63.6226 49.0845 63.4017 48.9267 63.4017 48.5874C63.4017 48.2481 63.6226 47.8693 63.8988 47.7273Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M78.63 16.6875C77.7147 16.2219 76.539 16.2614 75.2608 16.9084L40.0226 34.867C37.1269 36.3425 34.7756 40.3982 34.7756 43.9173V86.8018C34.7756 88.7665 35.5015 90.1473 36.6456 90.7391L33.1265 88.948C31.9824 88.3641 31.2565 86.9754 31.2565 85.0107V42.1262C31.2565 38.5992 33.6078 34.5514 36.5035 33.0759L71.7417 15.1173C73.0278 14.4624 74.2035 14.4308 75.1109 14.8964L78.63 16.6875Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M78.63 16.6869C79.7741 17.2708 80.5 18.6595 80.5 20.6242V63.5087C80.5 67.0357 78.1487 71.0835 75.2529 72.559L40.0147 90.5176C38.7286 91.1725 37.553 91.204 36.6456 90.7385C35.5015 90.1546 34.7756 88.7659 34.7756 86.8012V43.9167C34.7756 40.3897 37.1269 36.3419 40.0226 34.8664L75.2608 16.9078C76.5469 16.2529 77.7226 16.2213 78.63 16.6869Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M53.4204 72.4882L50.43 74.011C49.3332 74.5712 48.4337 73.94 48.4337 72.5986V69.9632C48.4337 68.9848 48.7493 67.9117 49.3095 66.9412L55.6849 55.934C55.322 54.3954 55.3851 52.5254 55.8664 50.5922C57.2235 45.1636 61.5001 40.4688 65.3979 40.1374C67.2837 39.9796 68.8065 40.8476 69.6745 42.5992C70.5424 44.343 70.6608 46.7575 70.0059 49.385C68.7197 54.5374 64.814 59.0192 61.0898 59.753L60.6953 60.4237C60.1272 61.4021 59.3776 62.1596 58.5807 62.5699L58.4071 62.6567V63.8718C58.4071 65.2132 57.5155 66.7597 56.4108 67.3199L55.4166 67.8249V69.04C55.4166 70.3814 54.525 71.9279 53.4204 72.4882ZM62.944 43.3094C60.6716 44.4693 58.5412 47.2782 57.7601 50.4344C57.3577 52.0598 57.3577 53.6143 57.7601 54.8294C57.8863 55.2081 57.7916 55.7368 57.5234 56.2102L50.7219 67.9433C50.5325 68.2668 50.43 68.6297 50.43 68.9532V71.5886L53.4204 70.0658V68.8507C53.4204 67.5093 54.312 65.9628 55.4166 65.4026L56.4108 64.8976V63.6824C56.4108 62.3411 57.3024 60.7945 58.4071 60.2343L58.5807 60.1475C58.8411 60.0134 59.1014 59.753 59.2829 59.4295L60.0956 58.025C60.3639 57.5595 60.7663 57.2439 61.1292 57.2123C63.9855 56.9677 67.118 53.5275 68.1122 49.5428C68.5935 47.6096 68.5067 45.8422 67.8676 44.5639C67.2285 43.2857 66.1159 42.6387 64.7351 42.7649C64.1433 42.8123 63.5358 43.0016 62.9361 43.3094H62.944Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M63.8988 47.7273C64.1749 47.5853 64.3959 47.7431 64.3959 48.0824C64.3959 48.4217 64.1749 48.8004 63.8988 48.9424C63.6226 49.0845 63.4017 48.9267 63.4017 48.5874C63.4017 48.2481 63.6226 47.8693 63.8988 47.7273Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M63.8987 50.157C63.0702 50.5751 62.3995 50.1017 62.3995 49.0996C62.3995 48.0976 63.0702 46.9377 63.8987 46.5195C64.7272 46.1013 65.3979 46.5747 65.3979 47.5768C65.3979 48.5789 64.7272 49.7388 63.8987 50.157ZM63.8987 47.7267C63.6225 47.8687 63.4016 48.2554 63.4016 48.5868C63.4016 48.9182 63.6225 49.076 63.8987 48.9418C64.1749 48.8077 64.3958 48.4132 64.3958 48.0818C64.3958 47.7504 64.1749 47.5926 63.8987 47.7267Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M63.8987 50.157C63.0702 50.5751 62.3995 50.1017 62.3995 49.0996C62.3995 48.0976 63.0702 46.9377 63.8987 46.5195C64.7272 46.1013 65.3979 46.5747 65.3979 47.5768C65.3979 48.5789 64.7272 49.7388 63.8987 50.157ZM63.8987 47.7267C63.6225 47.8687 63.4016 48.2554 63.4016 48.5868C63.4016 48.9182 63.6225 49.076 63.8987 48.9418C64.1749 48.8077 64.3958 48.4132 64.3958 48.0818C64.3958 47.7504 64.1749 47.5926 63.8987 47.7267Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/unknown.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/unknown.tsx
index eaa5ac912..caf9a0c3f 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/unknown.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/unknown.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const UnknownHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="101"
-    height="114"
-    viewBox="0 0 101 114"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function UnknownHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="101"
+      height="114"
+      viewBox="0 0 101 114"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M59.7226 3.31093C58.5784 2.72896 57.1087 2.77828 55.5108 3.58712L11.4588 26.0373C7.83873 27.8818 4.8993 32.9518 4.8993 37.3511V90.9612C4.8993 93.4173 5.80678 95.1435 7.23704 95.8833L2.83776 93.6442C1.4075 92.9143 0.5 91.1782 0.5 88.7221V35.112C0.5 30.7029 3.43946 25.6427 7.05949 23.7982L51.1115 1.34802C52.7193 0.529321 54.189 0.489863 55.3234 1.07183L59.7226 3.31093Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M59.7228 3.31097C61.153 4.04089 62.0605 5.77694 62.0605 8.23304V61.8431C62.0605 66.2523 59.1211 71.3124 55.501 73.157L11.449 95.6071C9.84119 96.4258 8.37149 96.4653 7.23714 95.8833C5.80688 95.1534 4.89941 93.4174 4.89941 90.9613V37.3512C4.89941 32.942 7.83884 27.8819 11.4589 26.0373L55.5109 3.58716C57.1187 2.76845 58.5884 2.729 59.7228 3.31097Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M78.9375 11.853C77.7933 11.2711 76.3235 11.3204 74.7256 12.1292L30.6736 34.5794C27.0536 36.4239 24.1141 41.4939 24.1141 45.8932V99.5033C24.1141 101.959 25.0216 103.686 26.4519 104.425L22.0526 102.186C20.6223 101.456 19.7148 99.7203 19.7148 97.2642V43.6541C19.7148 39.245 22.6543 34.1848 26.2743 32.3403L70.3263 9.89014C71.9341 9.07144 73.4039 9.03198 74.5382 9.61395L78.9375 11.853Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M78.9376 11.8531C80.3679 12.583 81.2754 14.319 81.2754 16.7752V70.3852C81.2754 74.7944 78.3359 79.8546 74.7159 81.6991L30.6639 104.149C29.0561 104.968 27.5864 105.007 26.452 104.425C25.0218 103.696 24.1143 101.959 24.1143 99.5034V45.8933C24.1143 41.4841 27.0537 36.424 30.6738 34.5794L74.7257 12.1293C76.3335 11.3106 77.8033 11.2711 78.9376 11.8531Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M59.7226 3.31093C58.5784 2.72896 57.1087 2.77828 55.5108 3.58712L11.4588 26.0373C7.83873 27.8818 4.8993 32.9518 4.8993 37.3511V90.9612C4.8993 93.4173 5.80678 95.1435 7.23704 95.8833L2.83776 93.6442C1.4075 92.9143 0.5 91.1782 0.5 88.7221V35.112C0.5 30.7029 3.43946 25.6427 7.05949 23.7982L51.1115 1.34802C52.7193 0.529321 54.189 0.489863 55.3234 1.07183L59.7226 3.31093Z"
+        d="M98.1621 20.3557C97.0179 19.7738 95.5482 19.8231 93.9502 20.6319L49.8982 43.0821C46.2782 44.9266 43.3388 49.9966 43.3388 54.3959V108.006C43.3388 110.462 44.2462 112.188 45.6765 112.928L41.2772 110.689C39.847 109.959 38.9395 108.223 38.9395 105.767V52.1568C38.9395 47.7477 41.8789 42.6875 45.4989 40.843L89.5509 18.3928C91.1587 17.5741 92.6285 17.5347 93.7628 18.1166L98.1621 20.3557Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -20,59 +56,25 @@ export const UnknownHorizontalStackIllustration = ({ className }: TIllustrationA
         strokeLinejoin="round"
       />
       <path
-        d="M59.7228 3.31097C61.153 4.04089 62.0605 5.77694 62.0605 8.23304V61.8431C62.0605 66.2523 59.1211 71.3124 55.501 73.157L11.449 95.6071C9.84119 96.4258 8.37149 96.4653 7.23714 95.8833C5.80688 95.1534 4.89941 93.4174 4.89941 90.9613V37.3512C4.89941 32.942 7.83884 27.8819 11.4589 26.0373L55.5109 3.58716C57.1187 2.76845 58.5884 2.729 59.7228 3.31097Z"
+        d="M98.1622 20.3558C99.5925 21.0857 100.5 22.8217 100.5 25.2778V78.8879C100.5 83.2971 97.5605 88.3572 93.9405 90.2018L49.8885 112.652C48.2806 113.471 46.8109 113.51 45.6766 112.928C44.2463 112.198 43.3389 110.462 43.3389 108.006V54.396C43.3389 49.9868 46.2783 44.9267 49.8983 43.0821L93.9503 20.632C95.5582 19.8133 97.0279 19.7738 98.1622 20.3558Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M78.9375 11.853C77.7933 11.2711 76.3235 11.3204 74.7256 12.1292L30.6736 34.5794C27.0536 36.4239 24.1141 41.4939 24.1141 45.8932V99.5033C24.1141 101.959 25.0216 103.686 26.4519 104.425L22.0526 102.186C20.6223 101.456 19.7148 99.7203 19.7148 97.2642V43.6541C19.7148 39.245 22.6543 34.1848 26.2743 32.3403L70.3263 9.89014C71.9341 9.07144 73.4039 9.03198 74.5382 9.61395L78.9375 11.853Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M73.3248 76.3332C72.6146 76.6982 72.0425 76.2937 72.0425 75.4356C72.0425 74.5774 72.6047 73.591 73.3149 73.2261H73.3248C74.035 72.8611 74.6071 73.2655 74.6071 74.1237C74.6071 74.9818 74.035 75.9682 73.3248 76.3332Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M78.9376 11.8531C80.3679 12.583 81.2754 14.319 81.2754 16.7752V70.3852C81.2754 74.7944 78.3359 79.8546 74.7159 81.6991L30.6639 104.149C29.0561 104.968 27.5864 105.007 26.452 104.425C25.0218 103.696 24.1143 101.959 24.1143 99.5034V45.8933C24.1143 41.4841 27.0537 36.424 30.6738 34.5794L74.7257 12.1293C76.3335 11.3106 77.8033 11.2711 78.9376 11.8531Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M80.9988 80.2194L65.6407 88.0415C63.52 89.1166 61.8037 87.9034 61.8037 85.3289V60.4128C61.8037 57.8383 63.5299 54.8594 65.6407 53.7843L77.1617 47.9153C77.4971 47.7377 77.8226 47.7377 78.0692 47.9153L84.4708 52.4428C84.7076 52.6105 84.8457 52.936 84.8457 53.3503V73.5909C84.8457 76.1654 83.1195 79.1443 81.0087 80.2194H80.9988ZM65.6407 56.8914C64.9305 57.2465 64.3584 58.2427 64.3584 59.1009V84.017C64.3584 84.8752 64.9305 85.2796 65.6407 84.9245L80.9988 77.1024C81.709 76.7473 82.2811 75.7511 82.2811 74.8929V55.2934L76.6291 51.2986L65.6407 56.9012V56.8914Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M98.1621 20.3557C97.0179 19.7738 95.5482 19.8231 93.9502 20.6319L49.8982 43.0821C46.2782 44.9266 43.3388 49.9966 43.3388 54.3959V108.006C43.3388 110.462 44.2462 112.188 45.6765 112.928L41.2772 110.689C39.847 109.959 38.9395 108.223 38.9395 105.767V52.1568C38.9395 47.7477 41.8789 42.6875 45.4989 40.843L89.5509 18.3928C91.1587 17.5741 92.6285 17.5347 93.7628 18.1166L98.1621 20.3557Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M98.1622 20.3558C99.5925 21.0857 100.5 22.8217 100.5 25.2778V78.8879C100.5 83.2971 97.5605 88.3572 93.9405 90.2018L49.8885 112.652C48.2806 113.471 46.8109 113.51 45.6766 112.928C44.2463 112.198 43.3389 110.462 43.3389 108.006V54.396C43.3389 49.9868 46.2783 44.9267 49.8983 43.0821L93.9503 20.632C95.5582 19.8133 97.0279 19.7738 98.1622 20.3558Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M73.3248 76.3332C72.6146 76.6982 72.0425 76.2937 72.0425 75.4356C72.0425 74.5774 72.6047 73.591 73.3149 73.2261H73.3248C74.035 72.8611 74.6071 73.2655 74.6071 74.1237C74.6071 74.9818 74.035 75.9682 73.3248 76.3332Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M80.9988 80.2194L65.6407 88.0415C63.52 89.1166 61.8037 87.9034 61.8037 85.3289V60.4128C61.8037 57.8383 63.5299 54.8594 65.6407 53.7843L77.1617 47.9153C77.4971 47.7377 77.8226 47.7377 78.0692 47.9153L84.4708 52.4428C84.7076 52.6105 84.8457 52.936 84.8457 53.3503V73.5909C84.8457 76.1654 83.1195 79.1443 81.0087 80.2194H80.9988ZM65.6407 56.8914C64.9305 57.2465 64.3584 58.2427 64.3584 59.1009V84.017C64.3584 84.8752 64.9305 85.2796 65.6407 84.9245L80.9988 77.1024C81.709 76.7473 82.2811 75.7511 82.2811 74.8929V55.2934L76.6291 51.2986L65.6407 56.9012V56.8914Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M73.2167 70.1681C72.6841 70.4443 72.181 70.2865 72.0035 69.7242C71.7766 69.0239 72.1416 67.9586 72.8123 67.347C73.5817 66.6368 75.7813 64.2498 75.7813 62.642C75.7813 61.3597 75.0909 60.541 74.0946 60.61C73.4535 60.6593 72.7531 61.044 72.1416 61.7148C71.5201 62.3855 71.0565 63.2437 70.8198 64.1511C70.5732 65.0882 69.8433 65.8675 69.1824 65.9168C68.5215 65.9661 68.1763 65.246 68.413 64.309C69.3797 60.5903 72.3191 57.4141 74.9725 57.2366C76.9748 57.0985 78.3262 58.7457 78.3459 61.3301C78.3459 65.463 74.1143 69.448 73.631 69.8919C73.4929 70.0201 73.3647 70.1089 73.2266 70.178L73.2167 70.1681Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M73.2167 70.1681C72.6841 70.4443 72.181 70.2865 72.0035 69.7242C71.7766 69.0239 72.1416 67.9586 72.8123 67.347C73.5817 66.6368 75.7813 64.2498 75.7813 62.642C75.7813 61.3597 75.0909 60.541 74.0946 60.61C73.4535 60.6593 72.7531 61.044 72.1416 61.7148C71.5201 62.3855 71.0565 63.2437 70.8198 64.1511C70.5732 65.0882 69.8433 65.8675 69.1824 65.9168C68.5215 65.9661 68.1763 65.246 68.413 64.309C69.3797 60.5903 72.3191 57.4141 74.9725 57.2366C76.9748 57.0985 78.3262 58.7457 78.3459 61.3301C78.3459 65.463 74.1143 69.448 73.631 69.8919C73.4929 70.0201 73.3647 70.1089 73.2266 70.178L73.2167 70.1681Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/update.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/update.tsx
index 083fa77be..bcdc70bcf 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/update.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/update.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const UpdateHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="72" height="81" viewBox="0 0 72 81" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function UpdateHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="72"
+      height="81"
+      viewBox="0 0 72 81"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M42.4559 2.91759C41.655 2.51021 40.6262 2.54473 39.5076 3.11092L8.67113 18.8261C6.1371 20.1172 4.0795 23.6663 4.0795 26.7458V64.2729C4.0795 65.9922 4.71473 67.2005 5.71591 67.7184L2.63642 66.151C1.63523 65.6401 1 64.4248 1 62.7055V25.1784C1 22.092 3.0576 18.5499 5.59163 17.2587L36.4281 1.54355C37.5536 0.970462 38.5824 0.942844 39.3764 1.35022L42.4559 2.91759Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M42.4558 2.91754C43.457 3.42849 44.0922 4.64374 44.0922 6.36301V43.8901C44.0922 46.9766 42.0346 50.5187 39.5005 51.8099L8.66409 67.525C7.53862 68.0981 6.5098 68.1257 5.71576 67.7183C4.71458 67.2074 4.07935 65.9922 4.07935 64.2729V26.7457C4.07935 23.6593 6.13695 20.1172 8.67098 18.826L39.5075 3.11088C40.6329 2.53778 41.6617 2.51017 42.4558 2.91754Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M55.9132 8.904C55.1123 8.49662 54.0835 8.53114 52.9649 9.09733L22.1284 24.8125C19.5944 26.1036 17.5368 29.6527 17.5368 32.7322V70.2593C17.5368 71.9786 18.172 73.1869 19.1732 73.7048L16.0937 72.1374C15.0925 71.6265 14.4573 70.4112 14.4573 68.692V31.1648C14.4573 28.0784 16.5149 24.5363 19.0489 23.2451L49.8854 7.52994C51.0109 6.95685 52.0397 6.92923 52.8337 7.33661L55.9132 8.904Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M55.913 8.90393C56.9142 9.41488 57.5495 10.6301 57.5495 12.3494V49.8765C57.5495 52.9629 55.4918 56.5051 52.9578 57.7962L22.1213 73.5114C20.9959 74.0845 19.9671 74.1121 19.173 73.7047C18.1719 73.1938 17.5366 71.9785 17.5366 70.2593V32.7321C17.5366 29.6457 19.5942 26.1036 22.1283 24.8124L52.9647 9.09726C54.0902 8.52417 55.119 8.49655 55.913 8.90393Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M42.4559 2.91759C41.655 2.51021 40.6262 2.54473 39.5076 3.11092L8.67113 18.8261C6.1371 20.1172 4.0795 23.6663 4.0795 26.7458V64.2729C4.0795 65.9922 4.71473 67.2005 5.71591 67.7184L2.63642 66.151C1.63523 65.6401 1 64.4248 1 62.7055V25.1784C1 22.092 3.0576 18.5499 5.59163 17.2587L36.4281 1.54355C37.5536 0.970462 38.5824 0.942844 39.3764 1.35022L42.4559 2.91759Z"
+        d="M69.3636 14.8489C68.5627 14.4415 67.5339 14.476 66.4153 15.0422L35.5788 30.7573C33.0448 32.0485 30.9872 35.5975 30.9872 38.6771V76.2042C30.9872 77.9235 31.6225 79.1318 32.6236 79.6497L29.5441 78.0823C28.5429 77.5713 27.9077 76.3561 27.9077 74.6368V37.1097C27.9077 34.0233 29.9653 30.4812 32.4994 29.19L63.3358 13.4748C64.4613 12.9017 65.4901 12.8741 66.2842 13.2815L69.3636 14.8489Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
@@ -13,57 +56,23 @@ export const UpdateHorizontalStackIllustration = ({ className }: TIllustrationAs
         strokeLinejoin="round"
       />
       <path
-        d="M42.4558 2.91754C43.457 3.42849 44.0922 4.64374 44.0922 6.36301V43.8901C44.0922 46.9766 42.0346 50.5187 39.5005 51.8099L8.66409 67.525C7.53862 68.0981 6.5098 68.1257 5.71576 67.7183C4.71458 67.2074 4.07935 65.9922 4.07935 64.2729V26.7457C4.07935 23.6593 6.13695 20.1172 8.67098 18.826L39.5075 3.11088C40.6329 2.53778 41.6617 2.51017 42.4558 2.91754Z"
+        d="M69.3635 14.8489C70.3646 15.3598 70.9999 16.5751 70.9999 18.2943V55.8215C70.9999 58.9079 68.9423 62.45 66.4083 63.7412L35.5718 79.4563C34.4463 80.0294 33.4175 80.0571 32.6235 79.6497C31.6223 79.1387 30.9871 77.9235 30.9871 76.2042V38.6771C30.9871 35.5907 33.0446 32.0485 35.5787 30.7574L66.4152 15.0422C67.5406 14.4691 68.5694 14.4415 69.3635 14.8489Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M55.9132 8.904C55.1123 8.49662 54.0835 8.53114 52.9649 9.09733L22.1284 24.8125C19.5944 26.1036 17.5368 29.6527 17.5368 32.7322V70.2593C17.5368 71.9786 18.172 73.1869 19.1732 73.7048L16.0937 72.1374C15.0925 71.6265 14.4573 70.4112 14.4573 68.692V31.1648C14.4573 28.0784 16.5149 24.5363 19.0489 23.2451L49.8854 7.52994C51.0109 6.95685 52.0397 6.92923 52.8337 7.33661L55.9132 8.904Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.35"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M48.6497 44.3459C51.1699 39.1121 55.1125 34.5688 59.5454 32.3109C59.9113 32.1245 60.2013 32.3317 60.2013 32.7736C60.2013 38.1661 58.1161 44.0213 54.8708 48.7442C55.3887 52.4037 53.1861 57.2163 49.9616 59.4879C49.6509 59.702 49.3402 59.8953 49.0295 60.0541C48.6635 60.2405 48.3735 60.0334 48.3735 59.5915V55.1863C47.5242 54.7996 46.7509 54.2541 46.0812 53.5637L42.4631 55.4072C42.0971 55.5937 41.8071 55.3865 41.8071 54.9446C41.8071 50.9675 44.4516 46.3966 47.7176 44.7325C48.0283 44.5737 48.339 44.4425 48.6497 44.3459ZM53.628 40.9211C52.5371 41.4735 51.6602 42.9994 51.6602 44.3251C51.6602 45.6509 52.544 46.2723 53.628 45.7199C54.712 45.1675 55.5958 43.6416 55.5958 42.3159C55.5958 40.9902 54.712 40.3687 53.628 40.9211Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M55.913 8.90393C56.9142 9.41488 57.5495 10.6301 57.5495 12.3494V49.8765C57.5495 52.9629 55.4918 56.5051 52.9578 57.7962L22.1213 73.5114C20.9959 74.0845 19.9671 74.1121 19.173 73.7047C18.1719 73.1938 17.5366 71.9785 17.5366 70.2593V32.7321C17.5366 29.6457 19.5942 26.1036 22.1283 24.8124L52.9647 9.09726C54.0902 8.52417 55.119 8.49655 55.913 8.90393Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.35"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M45.0936 56.4499C45.3835 56.0356 45.4457 55.5039 45.2247 55.2622C45.0107 55.0206 44.5964 55.1587 44.3064 55.566C42.9393 57.5063 42.2419 59.916 42.5112 61.8355C42.5526 62.1601 42.7736 62.312 43.0567 62.2222C44.7414 61.6836 46.44 59.9782 47.455 57.7963C47.6759 57.3337 47.6207 56.8572 47.3376 56.7329C47.0476 56.6087 46.6402 56.8849 46.4192 57.3475C46.4192 57.3544 46.4123 57.3682 46.4054 57.3751C45.784 58.7077 44.8104 59.7986 43.7678 60.3303C43.7678 59.0184 44.2857 57.5891 45.0936 56.4499Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M69.3636 14.8489C68.5627 14.4415 67.5339 14.476 66.4153 15.0422L35.5788 30.7573C33.0448 32.0485 30.9872 35.5975 30.9872 38.6771V76.2042C30.9872 77.9235 31.6225 79.1318 32.6236 79.6497L29.5441 78.0823C28.5429 77.5713 27.9077 76.3561 27.9077 74.6368V37.1097C27.9077 34.0233 29.9653 30.4812 32.4994 29.19L63.3358 13.4748C64.4613 12.9017 65.4901 12.8741 66.2842 13.2815L69.3636 14.8489Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M69.3635 14.8489C70.3646 15.3598 70.9999 16.5751 70.9999 18.2943V55.8215C70.9999 58.9079 68.9423 62.45 66.4083 63.7412L35.5718 79.4563C34.4463 80.0294 33.4175 80.0571 32.6235 79.6497C31.6223 79.1387 30.9871 77.9235 30.9871 76.2042V38.6771C30.9871 35.5907 33.0446 32.0485 35.5787 30.7574L66.4152 15.0422C67.5406 14.4691 68.5694 14.4415 69.3635 14.8489Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M48.6497 44.3459C51.1699 39.1121 55.1125 34.5688 59.5454 32.3109C59.9113 32.1245 60.2013 32.3317 60.2013 32.7736C60.2013 38.1661 58.1161 44.0213 54.8708 48.7442C55.3887 52.4037 53.1861 57.2163 49.9616 59.4879C49.6509 59.702 49.3402 59.8953 49.0295 60.0541C48.6635 60.2405 48.3735 60.0334 48.3735 59.5915V55.1863C47.5242 54.7996 46.7509 54.2541 46.0812 53.5637L42.4631 55.4072C42.0971 55.5937 41.8071 55.3865 41.8071 54.9446C41.8071 50.9675 44.4516 46.3966 47.7176 44.7325C48.0283 44.5737 48.339 44.4425 48.6497 44.3459ZM53.628 40.9211C52.5371 41.4735 51.6602 42.9994 51.6602 44.3251C51.6602 45.6509 52.544 46.2723 53.628 45.7199C54.712 45.1675 55.5958 43.6416 55.5958 42.3159C55.5958 40.9902 54.712 40.3687 53.628 40.9211Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M45.0936 56.4499C45.3835 56.0356 45.4457 55.5039 45.2247 55.2622C45.0107 55.0206 44.5964 55.1587 44.3064 55.566C42.9393 57.5063 42.2419 59.916 42.5112 61.8355C42.5526 62.1601 42.7736 62.312 43.0567 62.2222C44.7414 61.6836 46.44 59.9782 47.455 57.7963C47.6759 57.3337 47.6207 56.8572 47.3376 56.7329C47.0476 56.6087 46.6402 56.8849 46.4192 57.3475C46.4192 57.3544 46.4123 57.3682 46.4054 57.3751C45.784 58.7077 44.8104 59.7986 43.7678 60.3303C43.7678 59.0184 44.2857 57.5891 45.0936 56.4499Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx
index b4f631dfa..97ba93593 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const WebhookHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="81" height="91" viewBox="0 0 81 91" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function WebhookHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="81"
+      height="91"
+      viewBox="0 0 81 91"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M47.8736 2.5768C46.9583 2.11126 45.7826 2.15093 44.5044 2.79794L9.26615 20.7562C6.3704 22.2317 4.01906 26.2876 4.01906 29.8067V72.6905C4.01906 74.6552 4.74496 76.0362 5.88906 76.628L2.37 74.8369C1.22591 74.253 0.5 72.8641 0.5 70.8994V28.0155C0.5 24.4885 2.85134 20.4406 5.74709 18.9651L40.9853 1.00681C42.2715 0.351913 43.447 0.320136 44.3544 0.785668L47.8736 2.5768Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M47.8736 2.57668C49.0177 3.16057 49.7436 4.54946 49.7436 6.51416V49.398C49.7436 52.925 47.3922 56.9729 44.4965 58.4484L9.25823 76.4071C7.97211 77.062 6.79644 77.0934 5.88905 76.6279C4.74495 76.044 4.01904 74.6551 4.01904 72.6904V29.8065C4.01904 26.2796 6.37038 22.2316 9.26613 20.7561L44.5044 2.79783C45.7905 2.14293 46.9662 2.11115 47.8736 2.57668Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M63.2515 9.37172C62.3362 8.90619 61.1606 8.94585 59.8823 9.59286L24.6441 27.5512C21.7483 29.0267 19.397 33.0825 19.397 36.6016V79.4858C19.397 81.4505 20.1229 82.8311 21.267 83.4229L17.7479 81.6318C16.6038 81.0479 15.8779 79.6594 15.8779 77.6947V34.8105C15.8779 31.2835 18.2293 27.2355 21.125 25.76L56.3633 7.80174C57.6494 7.14683 58.825 7.11506 59.7324 7.58059L63.2515 9.37172Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M63.252 9.36965C64.3961 9.95354 65.122 11.3424 65.122 13.3071V56.1914C65.122 59.7184 62.7707 63.7659 59.8749 65.2414L24.6367 83.2001C23.3505 83.855 22.1749 83.8864 21.2675 83.4208C20.1234 82.837 19.3975 81.4484 19.3975 79.4837V36.5995C19.3975 33.0725 21.7488 29.0246 24.6446 27.5491L59.8828 9.5908C61.1689 8.9359 62.3446 8.90412 63.252 9.36965Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M47.8736 2.5768C46.9583 2.11126 45.7826 2.15093 44.5044 2.79794L9.26615 20.7562C6.3704 22.2317 4.01906 26.2876 4.01906 29.8067V72.6905C4.01906 74.6552 4.74496 76.0362 5.88906 76.628L2.37 74.8369C1.22591 74.253 0.5 72.8641 0.5 70.8994V28.0155C0.5 24.4885 2.85134 20.4406 5.74709 18.9651L40.9853 1.00681C42.2715 0.351913 43.447 0.320136 44.3544 0.785668L47.8736 2.5768Z"
+        d="M78.6304 16.1648C77.7151 15.6993 76.5395 15.7386 75.2612 16.3856L40.023 34.3443C37.1272 35.8198 34.7759 39.8752 34.7759 43.3943V86.2786C34.7759 88.2433 35.5019 89.6243 36.646 90.216L33.1268 88.4249C31.9827 87.841 31.2568 86.4521 31.2568 84.4874V41.6032C31.2568 38.0762 33.6082 34.0287 36.5039 32.5532L71.7422 14.5945C73.0283 13.9396 74.204 13.9082 75.1114 14.3737L78.6304 16.1648Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -13,51 +56,17 @@ export const WebhookHorizontalStackIllustration = ({ className }: TIllustrationA
         strokeLinejoin="round"
       />
       <path
-        d="M47.8736 2.57668C49.0177 3.16057 49.7436 4.54946 49.7436 6.51416V49.398C49.7436 52.925 47.3922 56.9729 44.4965 58.4484L9.25823 76.4071C7.97211 77.062 6.79644 77.0934 5.88905 76.6279C4.74495 76.044 4.01904 74.6551 4.01904 72.6904V29.8065C4.01904 26.2796 6.37038 22.2316 9.26613 20.7561L44.5044 2.79783C45.7905 2.14293 46.9662 2.11115 47.8736 2.57668Z"
+        d="M78.6299 16.1647C79.774 16.7486 80.4999 18.1371 80.4999 20.1018V62.9861C80.4999 66.5131 78.1486 70.561 75.2528 72.0365L40.0146 89.9948C38.7285 90.6497 37.5529 90.6814 36.6455 90.2159C35.5014 89.632 34.7754 88.2431 34.7754 86.2784V43.3942C34.7754 39.8672 37.1267 35.8197 40.0225 34.3442L75.2607 16.3855C76.5469 15.7306 77.7225 15.6992 78.6299 16.1647Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M63.2515 9.37172C62.3362 8.90619 61.1606 8.94585 59.8823 9.59286L24.6441 27.5512C21.7483 29.0267 19.397 33.0825 19.397 36.6016V79.4858C19.397 81.4505 20.1229 82.8311 21.267 83.4229L17.7479 81.6318C16.6038 81.0479 15.8779 79.6594 15.8779 77.6947V34.8105C15.8779 31.2835 18.2293 27.2355 21.125 25.76L56.3633 7.80174C57.6494 7.14683 58.825 7.11506 59.7324 7.58059L63.2515 9.37172Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M58.4468 44.0802C58.9439 43.4963 59.5594 43.37 59.875 43.7724L59.9302 43.8595L63.3546 49.7375L63.4098 49.8165C63.7175 50.1953 64.4672 50.1637 65.5324 49.6193L65.8006 49.4929C67.1499 48.8853 68.4359 48.9249 69.3986 49.6035C70.4243 50.3294 71.0003 51.7261 71.0003 53.4936C71.0003 55.261 70.4243 57.2415 69.3986 59.0168C68.3728 60.7843 66.9842 62.1964 65.5324 62.9381C64.9248 63.2458 64.4356 62.8987 64.4356 62.1649C64.4356 61.4311 64.9248 60.5867 65.5324 60.279C66.4003 59.8371 67.2366 58.9929 67.8521 57.9277C68.4675 56.8625 68.8147 55.6712 68.8147 54.6139C68.8147 53.5566 68.4675 52.7203 67.8521 52.2784C67.3155 51.8997 66.6054 51.8524 65.8558 52.1443L65.5324 52.2942C64.3015 52.9254 62.4393 53.4934 61.5161 52.1363L61.4293 52.0022L58.005 46.1237L57.9576 46.0212C57.7445 45.5083 57.9419 44.672 58.439 44.096L58.4468 44.0802ZM47.7948 61.8335C48.1341 61.1234 48.7575 60.658 49.2388 60.7764C49.7517 60.9026 49.9095 61.6363 49.5938 62.4253L49.4913 62.7016C49.2624 63.3407 49.1441 64.0111 49.1362 64.6345C49.1362 65.5182 49.3808 66.2602 49.8306 66.7257C50.2803 67.1992 50.9116 67.3725 51.6217 67.2304C52.3318 67.0805 53.0814 66.6231 53.7521 65.9209C54.4227 65.2187 54.9672 64.3192 55.3143 63.3565V63.3326C55.9298 61.6757 57.1449 59.1902 58.9913 58.2513L65.5403 54.9137L65.6506 54.8663C66.203 54.6532 66.6291 55.0005 66.6291 55.6869C66.6291 56.3734 66.1951 57.1625 65.6506 57.5096L65.5403 57.5728L58.9913 60.9104C58.4389 61.1945 57.7841 62.1569 57.2396 63.6482C56.6636 65.242 55.7562 66.7413 54.6437 67.9012C53.5311 69.069 52.2766 69.8424 51.1009 70.0791C49.9174 70.3237 48.8679 70.0239 48.1184 69.2427C47.3688 68.4537 46.9585 67.2228 46.9585 65.7394V65.7236L46.9743 65.2817C47.0374 64.2402 47.2899 63.1039 47.7396 61.9834L47.8027 61.8413L47.7948 61.8335ZM58.2732 38.7384C58.9991 38.2492 59.7329 37.9335 60.4351 37.8072C61.1374 37.681 61.8002 37.752 62.3762 38.0045C62.8812 38.2254 63.3073 38.5886 63.6466 39.0778L63.7806 39.2909L63.8675 39.4959C64.0174 40.0087 63.8123 40.7742 63.3546 41.3186C62.8891 41.863 62.3288 42.0129 61.9974 41.7131L61.8712 41.5551L61.6977 41.3028C61.5083 41.074 61.2873 40.8924 61.0269 40.7819C60.6797 40.632 60.2853 40.5847 59.8671 40.6636C59.441 40.7425 59.007 40.9242 58.573 41.2161C58.1391 41.508 57.7209 41.8944 57.3422 42.36C56.9635 42.8255 56.6321 43.3543 56.3717 43.9145C56.1113 44.4748 55.9219 45.0586 55.8193 45.6267C55.7167 46.1948 55.701 46.7393 55.772 47.2364C55.843 47.7256 55.9929 48.1436 56.2217 48.475C56.5926 48.9879 56.9476 49.6667 57.1055 50.5031C57.2711 51.3474 57.2554 52.4283 56.8056 53.6592L53.3812 63.0961L53.326 63.246C53.0103 63.964 52.4028 64.4608 51.9057 64.3898C51.3771 64.3109 51.1798 63.6008 51.4638 62.8118L54.8883 53.3749L54.9277 53.2331C55.0224 52.9175 55.0461 52.5543 54.9672 52.1598C54.8962 51.8126 54.7621 51.4735 54.5806 51.1658L54.3833 50.866C54.3833 50.866 54.3833 50.8502 54.3754 50.8502C53.9888 50.2979 53.7284 49.5876 53.6101 48.767C53.4917 47.9465 53.5233 47.0391 53.6969 46.0844C53.8705 45.1297 54.186 44.1591 54.62 43.228C55.0539 42.2969 55.6063 41.4134 56.2296 40.6401C56.8609 39.8669 57.5552 39.2197 58.2811 38.7384H58.2732Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-      <path
-        d="M63.252 9.36965C64.3961 9.95354 65.122 11.3424 65.122 13.3071V56.1914C65.122 59.7184 62.7707 63.7659 59.8749 65.2414L24.6367 83.2001C23.3505 83.855 22.1749 83.8864 21.2675 83.4208C20.1234 82.837 19.3975 81.4484 19.3975 79.4837V36.5995C19.3975 33.0725 21.7488 29.0246 24.6446 27.5491L59.8828 9.5908C61.1689 8.9359 62.3446 8.90412 63.252 9.36965Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </g>
-    <path
-      d="M78.6304 16.1648C77.7151 15.6993 76.5395 15.7386 75.2612 16.3856L40.023 34.3443C37.1272 35.8198 34.7759 39.8752 34.7759 43.3943V86.2786C34.7759 88.2433 35.5019 89.6243 36.646 90.216L33.1268 88.4249C31.9827 87.841 31.2568 86.4521 31.2568 84.4874V41.6032C31.2568 38.0762 33.6082 34.0287 36.5039 32.5532L71.7422 14.5945C73.0283 13.9396 74.204 13.9082 75.1114 14.3737L78.6304 16.1648Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M78.6299 16.1647C79.774 16.7486 80.4999 18.1371 80.4999 20.1018V62.9861C80.4999 66.5131 78.1486 70.561 75.2528 72.0365L40.0146 89.9948C38.7285 90.6497 37.5529 90.6814 36.6455 90.2159C35.5014 89.632 34.7754 88.2431 34.7754 86.2784V43.3942C34.7754 39.8672 37.1267 35.8197 40.0225 34.3442L75.2607 16.3855C76.5469 15.7306 77.7225 15.6992 78.6299 16.1647Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M58.4468 44.0802C58.9439 43.4963 59.5594 43.37 59.875 43.7724L59.9302 43.8595L63.3546 49.7375L63.4098 49.8165C63.7175 50.1953 64.4672 50.1637 65.5324 49.6193L65.8006 49.4929C67.1499 48.8853 68.4359 48.9249 69.3986 49.6035C70.4243 50.3294 71.0003 51.7261 71.0003 53.4936C71.0003 55.261 70.4243 57.2415 69.3986 59.0168C68.3728 60.7843 66.9842 62.1964 65.5324 62.9381C64.9248 63.2458 64.4356 62.8987 64.4356 62.1649C64.4356 61.4311 64.9248 60.5867 65.5324 60.279C66.4003 59.8371 67.2366 58.9929 67.8521 57.9277C68.4675 56.8625 68.8147 55.6712 68.8147 54.6139C68.8147 53.5566 68.4675 52.7203 67.8521 52.2784C67.3155 51.8997 66.6054 51.8524 65.8558 52.1443L65.5324 52.2942C64.3015 52.9254 62.4393 53.4934 61.5161 52.1363L61.4293 52.0022L58.005 46.1237L57.9576 46.0212C57.7445 45.5083 57.9419 44.672 58.439 44.096L58.4468 44.0802ZM47.7948 61.8335C48.1341 61.1234 48.7575 60.658 49.2388 60.7764C49.7517 60.9026 49.9095 61.6363 49.5938 62.4253L49.4913 62.7016C49.2624 63.3407 49.1441 64.0111 49.1362 64.6345C49.1362 65.5182 49.3808 66.2602 49.8306 66.7257C50.2803 67.1992 50.9116 67.3725 51.6217 67.2304C52.3318 67.0805 53.0814 66.6231 53.7521 65.9209C54.4227 65.2187 54.9672 64.3192 55.3143 63.3565V63.3326C55.9298 61.6757 57.1449 59.1902 58.9913 58.2513L65.5403 54.9137L65.6506 54.8663C66.203 54.6532 66.6291 55.0005 66.6291 55.6869C66.6291 56.3734 66.1951 57.1625 65.6506 57.5096L65.5403 57.5728L58.9913 60.9104C58.4389 61.1945 57.7841 62.1569 57.2396 63.6482C56.6636 65.242 55.7562 66.7413 54.6437 67.9012C53.5311 69.069 52.2766 69.8424 51.1009 70.0791C49.9174 70.3237 48.8679 70.0239 48.1184 69.2427C47.3688 68.4537 46.9585 67.2228 46.9585 65.7394V65.7236L46.9743 65.2817C47.0374 64.2402 47.2899 63.1039 47.7396 61.9834L47.8027 61.8413L47.7948 61.8335ZM58.2732 38.7384C58.9991 38.2492 59.7329 37.9335 60.4351 37.8072C61.1374 37.681 61.8002 37.752 62.3762 38.0045C62.8812 38.2254 63.3073 38.5886 63.6466 39.0778L63.7806 39.2909L63.8675 39.4959C64.0174 40.0087 63.8123 40.7742 63.3546 41.3186C62.8891 41.863 62.3288 42.0129 61.9974 41.7131L61.8712 41.5551L61.6977 41.3028C61.5083 41.074 61.2873 40.8924 61.0269 40.7819C60.6797 40.632 60.2853 40.5847 59.8671 40.6636C59.441 40.7425 59.007 40.9242 58.573 41.2161C58.1391 41.508 57.7209 41.8944 57.3422 42.36C56.9635 42.8255 56.6321 43.3543 56.3717 43.9145C56.1113 44.4748 55.9219 45.0586 55.8193 45.6267C55.7167 46.1948 55.701 46.7393 55.772 47.2364C55.843 47.7256 55.9929 48.1436 56.2217 48.475C56.5926 48.9879 56.9476 49.6667 57.1055 50.5031C57.2711 51.3474 57.2554 52.4283 56.8056 53.6592L53.3812 63.0961L53.326 63.246C53.0103 63.964 52.4028 64.4608 51.9057 64.3898C51.3771 64.3109 51.1798 63.6008 51.4638 62.8118L54.8883 53.3749L54.9277 53.2331C55.0224 52.9175 55.0461 52.5543 54.9672 52.1598C54.8962 51.8126 54.7621 51.4735 54.5806 51.1658L54.3833 50.866C54.3833 50.866 54.3833 50.8502 54.3754 50.8502C53.9888 50.2979 53.7284 49.5876 53.6101 48.767C53.4917 47.9465 53.5233 47.0391 53.6969 46.0844C53.8705 45.1297 54.186 44.1591 54.62 43.228C55.0539 42.2969 55.6063 41.4134 56.2296 40.6401C56.8609 39.8669 57.5552 39.2197 58.2811 38.7384H58.2732Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/work-item.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/work-item.tsx
index 3efe73572..e2156e5b9 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/work-item.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/work-item.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const WorkItemHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="72" height="80" viewBox="0 0 72 80" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function WorkItemHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="72"
+      height="80"
+      viewBox="0 0 72 80"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M42.4518 2.44207C41.651 2.03473 40.6223 2.06925 39.5038 2.63538L8.67038 18.349C6.1366 19.64 4.0792 23.1887 4.0792 26.2679V63.7913C4.0792 65.5104 4.71437 66.7186 5.71546 67.2364L2.63625 65.6692C1.63517 65.1583 1 63.9432 1 62.2241V24.7007C1 21.6146 3.0574 18.0728 5.59118 16.7818L36.4246 1.06817C37.55 0.495131 38.5787 0.467515 39.3726 0.874853L42.4518 2.44207Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M42.4515 2.44211C43.4526 2.95301 44.0877 4.16813 44.0877 5.88723V43.4106C44.0877 46.4967 42.0303 50.0385 39.4965 51.3296L8.66314 67.0432C7.53778 67.6162 6.50907 67.6438 5.71511 67.2365C4.71403 66.7256 4.07886 65.5105 4.07886 63.7914V26.2679C4.07886 23.1818 6.13626 19.6401 8.67004 18.349L39.5035 2.63543C40.6288 2.06239 41.6575 2.03478 42.4515 2.44211Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M55.9076 8.38648C55.1068 7.97914 54.0781 8.01366 52.9596 8.57979L22.1262 24.2934C19.5924 25.5844 17.535 29.1331 17.535 32.2123V69.7357C17.535 71.4548 18.1702 72.6631 19.1713 73.1809L16.0921 71.6136C15.091 71.1027 14.4558 69.8876 14.4558 68.1685V30.6451C14.4558 27.559 16.5132 24.0172 19.047 22.7262L49.8804 7.01256C51.0058 6.43953 52.0345 6.41191 52.8284 6.81925L55.9076 8.38648Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M55.9075 8.38645C56.9086 8.89735 57.5438 10.1125 57.5438 11.8316V49.355C57.5438 52.4411 55.4864 55.9829 52.9526 57.2739L22.1192 72.9875C20.9938 73.5605 19.9651 73.5882 19.1712 73.1808C18.1701 72.6699 17.5349 71.4548 17.5349 69.7357V32.2123C17.5349 29.1262 19.5923 25.5844 22.1261 24.2933L52.9595 8.57976C54.0849 8.00673 55.1136 7.97911 55.9075 8.38645Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M42.4518 2.44207C41.651 2.03473 40.6223 2.06925 39.5038 2.63538L8.67038 18.349C6.1366 19.64 4.0792 23.1887 4.0792 26.2679V63.7913C4.0792 65.5104 4.71437 66.7186 5.71546 67.2364L2.63625 65.6692C1.63517 65.1583 1 63.9432 1 62.2241V24.7007C1 21.6146 3.0574 18.0728 5.59118 16.7818L36.4246 1.06817C37.55 0.495131 38.5787 0.467515 39.3726 0.874853L42.4518 2.44207Z"
+        d="M69.3637 14.3309C68.5628 13.9235 67.5341 13.958 66.4157 14.5242L35.5822 30.2378C33.0485 31.5288 30.9911 35.0775 30.9911 38.1567V75.6801C30.9911 77.3992 31.6262 78.6074 32.6273 79.1252L29.5481 77.558C28.547 77.0471 27.9119 75.832 27.9119 74.1129V36.5895C27.9119 33.5034 29.9693 29.9616 32.5031 28.6706L63.3365 12.957C64.4618 12.3839 65.4905 12.3563 66.2845 12.7636L69.3637 14.3309Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.3"
@@ -13,65 +56,31 @@ export const WorkItemHorizontalStackIllustration = ({ className }: TIllustration
         strokeLinejoin="round"
       />
       <path
-        d="M42.4515 2.44211C43.4526 2.95301 44.0877 4.16813 44.0877 5.88723V43.4106C44.0877 46.4967 42.0303 50.0385 39.4965 51.3296L8.66314 67.0432C7.53778 67.6162 6.50907 67.6438 5.71511 67.2365C4.71403 66.7256 4.07886 65.5105 4.07886 63.7914V26.2679C4.07886 23.1818 6.13626 19.6401 8.67004 18.349L39.5035 2.63543C40.6288 2.06239 41.6575 2.03478 42.4515 2.44211Z"
+        d="M69.3636 14.3308C70.3647 14.8417 70.9998 16.0569 70.9998 17.776V55.2994C70.9998 58.3855 68.9424 61.9273 66.4087 63.2183L35.5752 78.9319C34.4499 79.5049 33.4212 79.5326 32.6272 79.1252C31.6261 78.6143 30.991 77.3992 30.991 75.6801V38.1567C30.991 35.0706 33.0484 31.5288 35.5821 30.2377L66.4156 14.5242C67.5409 13.9511 68.5696 13.9235 69.3636 14.3308Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.3"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M55.9076 8.38648C55.1068 7.97914 54.0781 8.01366 52.9596 8.57979L22.1262 24.2934C19.5924 25.5844 17.535 29.1331 17.535 32.2123V69.7357C17.535 71.4548 18.1702 72.6631 19.1713 73.1809L16.0921 71.6136C15.091 71.1027 14.4558 69.8876 14.4558 68.1685V30.6451C14.4558 27.559 16.5132 24.0172 19.047 22.7262L49.8804 7.01256C51.0058 6.43953 52.0345 6.41191 52.8284 6.81925L55.9076 8.38648Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.3"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M53.5394 40.4351C53.7258 40.8562 54.14 41.0081 54.6302 40.7665C55.293 40.4351 55.8384 39.4892 55.8453 38.6538V37.1211C55.8591 36.6241 55.6658 36.2512 55.3344 36.1339C55.0099 36.0165 54.5888 36.1684 54.216 36.5343L46.3868 44.2875C45.9242 44.7501 45.6135 45.4612 45.6135 46.0895V56.6388C45.6135 57.1636 45.8345 57.5433 46.1935 57.633C46.5525 57.7228 47.0012 57.5088 47.3741 57.0807L48.4925 55.7828C49.0793 55.0993 49.3072 54.0705 49.0034 53.4906C48.8032 53.1109 48.4235 53.0142 48.023 53.1868V45.91L53.5394 40.4489V40.4351Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M55.9075 8.38645C56.9086 8.89735 57.5438 10.1125 57.5438 11.8316V49.355C57.5438 52.4411 55.4864 55.9829 52.9526 57.2739L22.1192 72.9875C20.9938 73.5605 19.9651 73.5882 19.1712 73.1808C18.1701 72.6699 17.5349 71.4548 17.5349 69.7357V32.2123C17.5349 29.1262 19.5923 25.5844 22.1261 24.2933L52.9595 8.57976C54.0849 8.00673 55.1136 7.97911 55.9075 8.38645Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.3"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M48.7274 38.3707C48.9138 38.7918 49.328 38.9437 49.8182 38.7021C50.481 38.3707 51.0264 37.4249 51.0333 36.5895V35.0568C51.0471 34.5597 50.8538 34.1868 50.5224 34.0695C50.191 33.9521 49.7768 34.104 49.4039 34.4699L41.5748 42.2231C41.1122 42.6857 40.8015 43.3968 40.8015 44.0251V54.5745C40.8015 55.0992 41.0225 55.4789 41.3815 55.5687C41.7405 55.6584 42.1892 55.4513 42.562 55.0163L43.6805 53.7184C44.2673 53.0349 44.4952 52.0062 44.1914 51.4262C43.9912 51.0465 43.6115 50.9499 43.211 51.1225V43.8456L48.7274 38.3845V38.3707Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M69.3637 14.3309C68.5628 13.9235 67.5341 13.958 66.4157 14.5242L35.5822 30.2378C33.0485 31.5288 30.9911 35.0775 30.9911 38.1567V75.6801C30.9911 77.3992 31.6262 78.6074 32.6273 79.1252L29.5481 77.558C28.547 77.0471 27.9119 75.832 27.9119 74.1129V36.5895C27.9119 33.5034 29.9693 29.9616 32.5031 28.6706L63.3365 12.957C64.4618 12.3839 65.4905 12.3563 66.2845 12.7636L69.3637 14.3309Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M69.3636 14.3308C70.3647 14.8417 70.9998 16.0569 70.9998 17.776V55.2994C70.9998 58.3855 68.9424 61.9273 66.4087 63.2183L35.5752 78.9319C34.4499 79.5049 33.4212 79.5326 32.6272 79.1252C31.6261 78.6143 30.991 77.3992 30.991 75.6801V38.1567C30.991 35.0706 33.0484 31.5288 35.5821 30.2377L66.4156 14.5242C67.5409 13.9511 68.5696 13.9235 69.3636 14.3308Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M53.5394 40.4351C53.7258 40.8562 54.14 41.0081 54.6302 40.7665C55.293 40.4351 55.8384 39.4892 55.8453 38.6538V37.1211C55.8591 36.6241 55.6658 36.2512 55.3344 36.1339C55.0099 36.0165 54.5888 36.1684 54.216 36.5343L46.3868 44.2875C45.9242 44.7501 45.6135 45.4612 45.6135 46.0895V56.6388C45.6135 57.1636 45.8345 57.5433 46.1935 57.633C46.5525 57.7228 47.0012 57.5088 47.3741 57.0807L48.4925 55.7828C49.0793 55.0993 49.3072 54.0705 49.0034 53.4906C48.8032 53.1109 48.4235 53.0142 48.023 53.1868V45.91L53.5394 40.4489V40.4351Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M48.7274 38.3707C48.9138 38.7918 49.328 38.9437 49.8182 38.7021C50.481 38.3707 51.0264 37.4249 51.0333 36.5895V35.0568C51.0471 34.5597 50.8538 34.1868 50.5224 34.0695C50.191 33.9521 49.7768 34.104 49.4039 34.4699L41.5748 42.2231C41.1122 42.6857 40.8015 43.3968 40.8015 44.0251V54.5745C40.8015 55.0992 41.0225 55.4789 41.3815 55.5687C41.7405 55.6584 42.1892 55.4513 42.562 55.0163L43.6805 53.7184C44.2673 53.0349 44.4952 52.0062 44.1914 51.4262C43.9912 51.0465 43.6115 50.9499 43.211 51.1225V43.8456L48.7274 38.3845V38.3707Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M61.1825 49.431C61.1825 50.0524 60.8787 50.7704 60.4092 51.226L52.5869 58.9793C52.2141 59.3452 51.7999 59.4971 51.4754 59.3797C51.1509 59.2623 50.9507 58.9033 50.9507 58.4062V47.8569C50.9507 47.2355 51.2545 46.5175 51.7239 46.0549L59.5531 38.3017C59.9259 37.9358 60.3402 37.7839 60.6647 37.9013C60.9891 38.0186 61.1894 38.3846 61.1894 38.8747V49.4241L61.1825 49.431ZM58.7799 42.306L53.3602 47.6705V54.9888L58.773 49.6243V42.306H58.7799Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M61.1825 49.431C61.1825 50.0524 60.8787 50.7704 60.4092 51.226L52.5869 58.9793C52.2141 59.3452 51.7999 59.4971 51.4754 59.3797C51.1509 59.2623 50.9507 58.9033 50.9507 58.4062V47.8569C50.9507 47.2355 51.2545 46.5175 51.7239 46.0549L59.5531 38.3017C59.9259 37.9358 60.3402 37.7839 60.6647 37.9013C60.9891 38.0186 61.1894 38.3846 61.1894 38.8747V49.4241L61.1825 49.431ZM58.7799 42.306L53.3602 47.6705V54.9888L58.773 49.6243V42.306H58.7799Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx
index d090f1fa4..7d91b2e04 100644
--- a/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx
+++ b/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx
@@ -1,11 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const WorklogHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg width="81" height="91" viewBox="0 0 81 91" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <g opacity="0.2">
+export function WorklogHorizontalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="81"
+      height="91"
+      viewBox="0 0 81 91"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M47.8736 2.5768C46.9583 2.11127 45.7826 2.15093 44.5044 2.79795L9.26614 20.7563C6.37039 22.2318 4.01915 26.2876 4.01915 29.8067V72.6906C4.01915 74.6553 4.74506 76.0363 5.88915 76.6281L2.37 74.837C1.22591 74.2531 0.5 72.8642 0.5 70.8995V28.0156C0.5 24.4886 2.85134 20.4406 5.74709 18.9651L40.9853 1.00681C42.2714 0.351913 43.4471 0.320136 44.3545 0.785668L47.8736 2.5768Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M47.8737 2.57668C49.0178 3.16057 49.7437 4.54946 49.7437 6.51417V49.3981C49.7437 52.9251 47.3924 56.973 44.4966 58.4485L9.25838 76.4072C7.97226 77.0621 6.79668 77.0935 5.88929 76.628C4.74519 76.0441 4.01929 74.6552 4.01929 72.6905V29.8066C4.01929 26.2796 6.37053 22.2316 9.26628 20.7561L44.5045 2.79783C45.7906 2.14293 46.9663 2.11115 47.8737 2.57668Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M63.252 9.37172C62.3367 8.90619 61.161 8.94586 59.8828 9.59287L24.6446 27.5512C21.7488 29.0267 19.3976 33.0825 19.3976 36.6016V79.4859C19.3976 81.4506 20.1235 82.8312 21.2676 83.423L17.7484 81.6319C16.6043 81.048 15.8784 79.6595 15.8784 77.6948V34.8105C15.8784 31.2835 18.2298 27.2356 21.1255 25.7601L56.3637 7.80174C57.6499 7.14683 58.8255 7.11506 59.7329 7.58059L63.252 9.37172Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M63.2521 9.36965C64.3962 9.95354 65.1221 11.3424 65.1221 13.3071V56.1914C65.1221 59.7184 62.7708 63.766 59.875 65.2415L24.6369 83.2002C23.3508 83.8551 22.1751 83.8865 21.2677 83.4209C20.1236 82.8371 19.3977 81.4485 19.3977 79.4838V36.5996C19.3977 33.0726 21.7489 29.0246 24.6447 27.5491L59.8829 9.5908C61.169 8.9359 62.3447 8.90412 63.2521 9.36965Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M47.8736 2.5768C46.9583 2.11127 45.7826 2.15093 44.5044 2.79795L9.26614 20.7563C6.37039 22.2318 4.01915 26.2876 4.01915 29.8067V72.6906C4.01915 74.6553 4.74506 76.0363 5.88915 76.6281L2.37 74.837C1.22591 74.2531 0.5 72.8642 0.5 70.8995V28.0156C0.5 24.4886 2.85134 20.4406 5.74709 18.9651L40.9853 1.00681C42.2714 0.351913 43.4471 0.320136 44.3545 0.785668L47.8736 2.5768Z"
+        d="M78.6299 16.1649C77.7146 15.6993 76.5389 15.7386 75.2607 16.3856L40.0226 34.3443C37.1268 35.8198 34.7755 39.8753 34.7755 43.3944V86.2786C34.7755 88.2433 35.5014 89.6244 36.6455 90.2161L33.1264 88.425C31.9823 87.8411 31.2563 86.4522 31.2563 84.4875V41.6032C31.2563 38.0762 33.6077 34.0287 36.5034 32.5532L71.7417 14.5945C73.0278 13.9396 74.2035 13.9082 75.1108 14.3737L78.6299 16.1649Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -13,59 +56,25 @@ export const WorklogHorizontalStackIllustration = ({ className }: TIllustrationA
         strokeLinejoin="round"
       />
       <path
-        d="M47.8737 2.57668C49.0178 3.16057 49.7437 4.54946 49.7437 6.51417V49.3981C49.7437 52.9251 47.3924 56.973 44.4966 58.4485L9.25838 76.4072C7.97226 77.0621 6.79668 77.0935 5.88929 76.628C4.74519 76.0441 4.01929 74.6552 4.01929 72.6905V29.8066C4.01929 26.2796 6.37053 22.2316 9.26628 20.7561L44.5045 2.79783C45.7906 2.14293 46.9663 2.11115 47.8737 2.57668Z"
+        d="M78.63 16.1647C79.7741 16.7486 80.5 18.1371 80.5 20.1018V62.9861C80.5 66.5131 78.1487 70.5611 75.253 72.0366L40.0148 89.9949C38.7287 90.6498 37.553 90.6815 36.6456 90.216C35.5015 89.6321 34.7756 88.2432 34.7756 86.2785V43.3942C34.7756 39.8672 37.127 35.8197 40.0227 34.3442L75.2609 16.3855C76.547 15.7306 77.7226 15.6992 78.63 16.1647Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M63.252 9.37172C62.3367 8.90619 61.161 8.94586 59.8828 9.59287L24.6446 27.5512C21.7488 29.0267 19.3976 33.0825 19.3976 36.6016V79.4859C19.3976 81.4506 20.1235 82.8312 21.2676 83.423L17.7484 81.6319C16.6043 81.048 15.8784 79.6595 15.8784 77.6948V34.8105C15.8784 31.2835 18.2298 27.2356 21.1255 25.7601L56.3637 7.80174C57.6499 7.14683 58.8255 7.11506 59.7329 7.58059L63.252 9.37172Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M61.7446 39.5835L57.3813 41.8088C56.7817 42.1165 56.2925 41.7694 56.2925 41.0356C56.2925 40.3018 56.7817 39.4574 57.3813 39.1497L61.7446 36.9247C62.3443 36.617 62.8335 36.9641 62.8335 37.6979C62.8335 38.4318 62.3443 39.2757 61.7446 39.5835Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
       <path
-        d="M63.2521 9.36965C64.3962 9.95354 65.1221 11.3424 65.1221 13.3071V56.1914C65.1221 59.7184 62.7708 63.766 59.875 65.2415L24.6369 83.2002C23.3508 83.8551 22.1751 83.8865 21.2677 83.4209C20.1236 82.8371 19.3977 81.4485 19.3977 79.4838V36.5996C19.3977 33.0726 21.7489 29.0246 24.6447 27.5491L59.8829 9.5908C61.169 8.9359 62.3447 8.90412 63.2521 9.36965Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M59.5591 56.6164C59.2829 56.7584 58.9989 56.7742 58.7859 56.6164C58.3598 56.3165 58.3598 55.472 58.7859 54.7382L62.0604 49.0889C62.4864 48.3551 63.1809 48.0001 63.599 48.2999C64.0251 48.5997 64.0251 49.4439 63.599 50.1777L60.3245 55.8273C60.1115 56.1982 59.8354 56.4663 59.5513 56.6083L59.5591 56.6164Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </g>
-    <path
-      d="M78.6299 16.1649C77.7146 15.6993 76.5389 15.7386 75.2607 16.3856L40.0226 34.3443C37.1268 35.8198 34.7755 39.8753 34.7755 43.3944V86.2786C34.7755 88.2433 35.5014 89.6244 36.6455 90.2161L33.1264 88.425C31.9823 87.8411 31.2563 86.4522 31.2563 84.4875V41.6032C31.2563 38.0762 33.6077 34.0287 36.5034 32.5532L71.7417 14.5945C73.0278 13.9396 74.2035 13.9082 75.1108 14.3737L78.6299 16.1649Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M78.63 16.1647C79.7741 16.7486 80.5 18.1371 80.5 20.1018V62.9861C80.5 66.5131 78.1487 70.5611 75.253 72.0366L40.0148 89.9949C38.7287 90.6498 37.553 90.6815 36.6456 90.216C35.5015 89.6321 34.7756 88.2432 34.7756 86.2785V43.3942C34.7756 39.8672 37.127 35.8197 40.0227 34.3442L75.2609 16.3855C76.547 15.7306 77.7226 15.6992 78.63 16.1647Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M61.7446 39.5835L57.3813 41.8088C56.7817 42.1165 56.2925 41.7694 56.2925 41.0356C56.2925 40.3018 56.7817 39.4574 57.3813 39.1497L61.7446 36.9247C62.3443 36.617 62.8335 36.9641 62.8335 37.6979C62.8335 38.4318 62.3443 39.2757 61.7446 39.5835Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M59.5591 56.6164C59.2829 56.7584 58.9989 56.7742 58.7859 56.6164C58.3598 56.3165 58.3598 55.472 58.7859 54.7382L62.0604 49.0889C62.4864 48.3551 63.1809 48.0001 63.599 48.2999C64.0251 48.5997 64.0251 49.4439 63.599 50.1777L60.3245 55.8273C60.1115 56.1982 59.8354 56.4663 59.5513 56.6083L59.5591 56.6164Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M59.5592 67.2388C54.1464 70.0005 49.7437 66.8835 49.7437 60.2951C49.7437 53.7066 54.1464 46.1082 59.5592 43.3466C64.9719 40.5849 69.3748 43.7019 69.3748 50.2903C69.3748 56.8788 64.9719 64.4772 59.5592 67.2388ZM59.5592 46.0057C55.3457 48.1519 51.9214 54.0619 51.9214 59.1828C51.9214 64.3036 55.3457 66.7259 59.5592 64.5797C63.7726 62.4335 67.1971 56.5235 67.1971 51.4026C67.1971 46.2817 63.7726 43.8595 59.5592 46.0057Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M59.5592 67.2388C54.1464 70.0005 49.7437 66.8835 49.7437 60.2951C49.7437 53.7066 54.1464 46.1082 59.5592 43.3466C64.9719 40.5849 69.3748 43.7019 69.3748 50.2903C69.3748 56.8788 64.9719 64.4772 59.5592 67.2388ZM59.5592 46.0057C55.3457 48.1519 51.9214 54.0619 51.9214 59.1828C51.9214 64.3036 55.3457 66.7259 59.5592 64.5797C63.7726 62.4335 67.1971 56.5235 67.1971 51.4026C67.1971 46.2817 63.7726 43.8595 59.5592 46.0057Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/illustration/inbox.tsx b/packages/propel/src/empty-state/assets/illustration/inbox.tsx
index e174545b8..62dd62a0d 100644
--- a/packages/propel/src/empty-state/assets/illustration/inbox.tsx
+++ b/packages/propel/src/empty-state/assets/illustration/inbox.tsx
@@ -1,135 +1,137 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const InboxIllustration = ({ className, ...rest }: TIllustrationAssetProps) => (
-  <svg
-    width="100"
-    height="92"
-    viewBox="0 0 100 92"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-    {...rest}
-  >
-    <path
-      d="M47.9704 90.9139C45.6095 90.9139 43.3811 90.4381 41.6888 89.5768L3.42089 70.0815C1.60205 69.1601 0.602295 67.8772 0.602295 66.48V46.5631C0.602295 45.1719 1.60205 43.8951 3.42089 42.9676L45.748 21.4005C47.4344 20.5393 49.6628 20.0635 52.0236 20.0635C54.3845 20.0635 56.6129 20.5393 58.2992 21.4005L96.5732 40.9018C98.392 41.8233 99.3917 43.1061 99.3917 44.5034V64.4202C99.3917 65.8115 98.392 67.0883 96.5732 68.0158L54.246 89.5829C52.5597 90.4441 50.3313 90.9199 47.9644 90.9199L47.9704 90.9139Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M52.0296 20.6717C54.2038 20.6717 56.3719 21.0933 58.0282 21.9425L96.3021 41.4438C97.9643 42.287 98.7894 43.3952 98.7894 44.5094V64.4263C98.7894 65.5344 97.9583 66.6426 96.3021 67.4858L53.9749 89.0528C52.3187 89.902 50.1445 90.3236 47.9703 90.3236C45.7962 90.3236 43.622 89.902 41.9658 89.0528L3.69185 69.5455C2.0296 68.7023 1.2045 67.5942 1.2045 66.486V46.5691C1.2045 45.4609 2.03562 44.3588 3.69185 43.5096L46.019 21.9425C47.6752 21.0933 49.8494 20.6717 52.0236 20.6717M52.0296 19.4672C49.5724 19.4672 47.2476 19.9671 45.477 20.8705L3.14981 42.4316C1.12018 43.4674 -3.05176e-05 44.9309 -3.05176e-05 46.5631V66.48C-3.05176e-05 67.4255 0.409509 69.2263 3.14981 70.6175L41.4177 90.1189C43.1884 91.0223 45.5131 91.5221 47.9703 91.5221C50.4276 91.5221 52.7523 91.0223 54.523 90.1189L96.8501 68.5518C98.8798 67.5159 100 66.0524 100 64.4202V44.5033C100 43.5578 99.5904 41.757 96.8501 40.3658L58.5762 20.8645C56.8116 19.9611 54.4808 19.4612 52.0296 19.4612V19.4672Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M86.7922 46.4305C86.6838 46.4968 86.5754 46.563 86.455 46.6233L79.4085 50.2128L79.3844 50.2308L79.3964 50.2128L86.7982 46.4366L86.7922 46.4305Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M76.6561 56.5847L76.114 57.8495L75.1504 60.0899C74.6806 61.186 73.9098 62.0894 73.0606 62.5231L64.3699 66.9557L62.6595 64.7033L56.8115 61.722H56.7934L51.7765 64.2756C49.0724 65.4862 44.9589 65.426 42.3812 64.113L28.2159 56.8919L47.8618 46.8883C50.5479 45.5211 54.9083 45.5211 57.5944 46.8883L71.7597 54.1094L76.644 56.5908L76.6561 56.5847Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M88.4665 44.142C88.4665 44.9611 87.9064 45.7742 86.7922 46.4306L79.3904 50.2068L79.3783 50.2249L76.6561 56.5848L71.7717 54.1035L57.6065 46.8823C54.9204 45.5152 50.56 45.5152 47.8739 46.8823L28.228 56.886L13.5448 49.4058C12.2018 48.7193 11.5272 47.8219 11.5272 46.9245C11.5272 46.0271 12.2018 45.1298 13.5448 44.4432L47.8679 26.9594C50.554 25.5923 54.9144 25.5923 57.6005 26.9594L86.4489 41.6547C87.792 42.3413 88.4665 43.2386 88.4665 44.136V44.142Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M98.7954 44.5034C98.7954 45.5995 97.9763 46.6896 96.3562 47.5328L88.4666 51.5499L85.2505 53.1881L79.4025 50.2068L86.449 46.6173C86.5694 46.5571 86.6839 46.4969 86.7862 46.4246C87.9064 45.7742 88.4605 44.9551 88.4605 44.136C88.4605 43.2326 87.786 42.3352 86.4429 41.6547L57.5945 26.9594C54.9084 25.5923 50.548 25.5923 47.8619 26.9594L13.5388 44.4432C12.1958 45.1298 11.5212 46.0271 11.5212 46.9245C11.5212 47.8219 12.1958 48.7253 13.5388 49.4058L28.222 56.886L42.3873 64.1071C44.965 65.4261 49.0785 65.4803 51.7826 64.2697C51.9031 64.2155 52.0175 64.1613 52.1259 64.1071L56.8115 61.7161L62.6595 64.6973L53.9688 69.124C53.0956 69.5696 52.0838 69.9009 50.9997 70.1057C49.2832 70.4429 47.4042 70.4851 45.6576 70.2321C44.3025 70.0334 43.0257 69.672 41.9597 69.124L23.0787 59.5058L11.5212 53.6157L3.68578 49.6226C2.02353 48.7795 1.19843 47.6713 1.19843 46.5571C1.19843 45.4429 2.02955 44.3468 3.68578 43.4976L46.0129 21.9305C49.3314 20.2382 54.7096 20.2382 58.0161 21.9305L96.29 41.4319C97.9522 42.275 98.7773 43.3832 98.7773 44.4974L98.7954 44.5034Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M86.7921 46.4305C86.6837 46.4968 86.5753 46.563 86.4549 46.6233L79.4084 50.2128H79.3903L86.7921 46.4366V46.4305Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M85.2503 53.1939L82.5161 59.5719L81.0164 63.0771C80.5467 64.1732 79.7758 65.0766 78.9266 65.5102L68.9651 70.5873C68.3869 70.8824 67.8268 70.9126 67.3872 70.6837C67.2005 70.5934 67.0379 70.4548 66.8993 70.2742L64.3759 66.9497L73.0665 62.517C73.9157 62.0894 74.6866 61.18 75.1564 60.0838L76.12 57.8434L76.6621 56.5787L79.3843 50.2188L79.4084 50.2007L85.2564 53.1819L85.2503 53.1939Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M79.4025 50.2067L79.3783 50.2249L79.3904 50.2007L79.4025 50.2067Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M98.7953 44.5034V64.4203C98.7953 65.5285 97.9642 66.6366 96.308 67.4798L53.9808 89.0469C50.6624 90.7393 45.2841 90.7393 41.9717 89.0469L3.69176 69.5456C2.02951 68.7024 1.20441 67.5942 1.20441 66.4861V46.5692C1.20441 47.6774 2.02951 48.7855 3.69176 49.6347L11.5272 53.6277L23.0847 59.5179L41.9657 69.136C43.0317 69.6841 44.3145 70.0515 45.6636 70.2442C47.4162 70.4911 49.2952 70.449 51.0057 70.1177C52.0897 69.913 53.1015 69.5817 53.9748 69.136L62.6655 64.7094L64.3759 66.9619L66.8994 70.2864C67.0379 70.467 67.2006 70.6056 67.3873 70.6959C67.8269 70.9248 68.387 70.9007 68.9652 70.5995L78.9266 65.5224C79.7758 65.0948 80.5467 64.1854 81.0165 63.0893L82.5161 59.5841L85.2504 53.2061L88.4665 51.568L96.3562 47.5509C97.9763 46.7077 98.7953 45.6176 98.7953 44.5215V44.5034Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M56.8175 61.7161L52.1319 64.1071C52.0175 64.1673 51.9091 64.2215 51.7886 64.2697L56.8055 61.7101H56.8236L56.8175 61.7161Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M43.333 50.7852C42.821 50.7852 42.3452 50.6707 41.9116 50.4539L36.5454 47.7196C35.3168 47.0933 34.6061 45.6719 34.6061 43.829V23.87C34.6061 23.87 34.6061 23.8338 34.6061 23.8097V22.027C34.6061 18.823 36.7622 15.1191 39.4062 13.77L63.2679 1.61027C63.9485 1.26096 64.623 1.0863 65.2674 1.0863C65.7794 1.0863 66.2551 1.20073 66.6828 1.41755L72.0489 4.15183C73.2775 4.77819 73.9822 6.19953 73.9822 8.04848V9.84323C73.9822 9.84323 73.9822 9.87937 73.9822 9.90346V29.8505C73.9822 33.0545 71.8261 36.7584 69.1821 38.1075L45.3204 50.2672C44.6399 50.6105 43.9714 50.7912 43.333 50.7912V50.7852Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M65.2734 1.68846C65.6889 1.68846 66.0744 1.7788 66.4177 1.95345L71.7839 4.68773C72.7656 5.18761 73.3859 6.37408 73.3859 8.04837V9.84312C73.3859 9.84312 73.3859 9.86721 73.3859 9.87926V29.8383C73.3859 32.8316 71.3743 36.3066 68.9111 37.5593L45.0493 49.7191C44.4411 50.0262 43.8629 50.1768 43.3329 50.1768C42.9113 50.1768 42.5258 50.0864 42.1826 49.9118L36.8164 47.1775C35.8347 46.6776 35.2083 45.4972 35.2083 43.8229V23.8638C35.2083 23.8638 35.2083 23.8458 35.2083 23.8397V22.0269C35.2083 19.0337 37.2199 15.5586 39.6832 14.3059L63.5449 2.14618C64.1592 1.833 64.7374 1.68846 65.2674 1.68846M65.2734 0.483928C64.5326 0.483928 63.7737 0.682675 63.0028 1.07415L39.1411 13.2339C36.2623 14.6974 34.0098 18.5639 34.0098 22.033V23.7916C34.0098 23.7916 34.0098 23.8458 34.0098 23.8699V43.8289C34.0098 45.9067 34.8349 47.5208 36.2743 48.2556L41.6405 50.9898C42.1585 51.2548 42.7306 51.3873 43.3389 51.3873C44.0737 51.3873 44.8385 51.1886 45.6034 50.8031L69.4651 38.6434C72.344 37.1799 74.5964 33.3134 74.5964 29.8443V9.92141C74.5964 9.92141 74.5964 9.86721 74.5964 9.8371V8.04235C74.5964 5.95851 73.7713 4.34444 72.3319 3.60968L66.9657 0.8754C66.4478 0.610404 65.8817 0.477905 65.2734 0.477905V0.483928Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M72.85 8.76514C72.3682 8.51822 71.6575 8.80128 71.0854 9.53002L70.3988 10.4033L57.7392 26.6705C57.2755 27.2306 56.6973 27.5317 56.2938 27.4414L43.5559 24.0747L42.8693 23.9001C42.1707 23.7134 41.2432 24.4361 40.8095 25.49C40.6469 25.8815 40.5686 26.267 40.5686 26.5922V46.5512C40.5686 48.2195 41.195 49.406 42.1767 49.9058L36.8105 47.1716C35.8288 46.6717 35.2025 45.4912 35.2025 43.8169V23.8579C35.2025 23.5327 35.2747 23.1472 35.4434 22.7557C35.877 21.7018 36.7985 20.973 37.5031 21.1658L38.1897 21.3404L50.9276 24.7071C51.3311 24.7914 51.9093 24.4963 52.373 23.9362L65.0326 7.66902L65.7192 6.79574C66.2853 6.067 67.002 5.78393 67.4838 6.03086L72.85 8.76514Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M72.8499 8.76507C72.9644 8.8253 73.0607 8.90962 73.145 9.02405C73.3077 9.24689 73.386 9.55404 73.386 9.88529V29.8443C73.386 32.8376 71.3744 36.3127 68.9111 37.5654L45.0494 49.7251C43.9593 50.2792 42.9596 50.3093 42.1826 49.9118C41.2009 49.4119 40.5746 48.2315 40.5746 46.5572V26.5981C40.5746 26.2729 40.6469 25.8875 40.8155 25.496C41.2491 24.442 42.1706 23.7133 42.8752 23.906L43.5618 24.0807L56.2997 27.4473C56.7032 27.5316 57.2814 27.2365 57.7451 26.6764L70.4047 10.4093L71.0913 9.53597C71.6575 8.80723 72.3741 8.52417 72.856 8.7711L72.8499 8.76507Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M71.784 4.68781C71.007 4.29031 70.0073 4.32645 68.9172 4.88053L45.0554 17.0403C42.5922 18.293 40.5806 21.768 40.5806 24.7613V26.5741C40.5806 27.092 40.7673 27.5016 41.1106 27.6762L35.7444 24.942C35.4011 24.7673 35.2144 24.3578 35.2144 23.8398V22.027C35.2144 19.0337 37.226 15.5587 39.6893 14.306L63.551 2.14625C64.6411 1.59217 65.6409 1.55603 66.4178 1.95352L71.784 4.68781Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M71.784 4.68778C72.7656 5.18766 73.386 6.37412 73.386 8.04239V9.83714C73.386 10.4514 73.1451 11.1561 72.6994 11.7282L70.4048 14.6793L59.293 28.959C58.5642 29.8383 57.7693 30.4948 56.9803 30.8983C56.1913 31.3018 55.4264 31.4524 54.7459 31.3139L43.5618 28.3387L41.2793 27.7425C41.219 27.7244 41.1648 27.7063 41.1106 27.6762C40.7673 27.5016 40.5806 27.092 40.5806 26.5741V24.7613C40.5806 21.768 42.5922 18.2929 45.0555 17.0402L68.9172 4.8805C70.0073 4.32642 71.007 4.29028 71.784 4.68778Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.3024"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+export function InboxIllustration({ className, ...rest }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="100"
+      height="92"
+      viewBox="0 0 100 92"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      {...rest}
+    >
+      <path
+        d="M47.9704 90.9139C45.6095 90.9139 43.3811 90.4381 41.6888 89.5768L3.42089 70.0815C1.60205 69.1601 0.602295 67.8772 0.602295 66.48V46.5631C0.602295 45.1719 1.60205 43.8951 3.42089 42.9676L45.748 21.4005C47.4344 20.5393 49.6628 20.0635 52.0236 20.0635C54.3845 20.0635 56.6129 20.5393 58.2992 21.4005L96.5732 40.9018C98.392 41.8233 99.3917 43.1061 99.3917 44.5034V64.4202C99.3917 65.8115 98.392 67.0883 96.5732 68.0158L54.246 89.5829C52.5597 90.4441 50.3313 90.9199 47.9644 90.9199L47.9704 90.9139Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M52.0296 20.6717C54.2038 20.6717 56.3719 21.0933 58.0282 21.9425L96.3021 41.4438C97.9643 42.287 98.7894 43.3952 98.7894 44.5094V64.4263C98.7894 65.5344 97.9583 66.6426 96.3021 67.4858L53.9749 89.0528C52.3187 89.902 50.1445 90.3236 47.9703 90.3236C45.7962 90.3236 43.622 89.902 41.9658 89.0528L3.69185 69.5455C2.0296 68.7023 1.2045 67.5942 1.2045 66.486V46.5691C1.2045 45.4609 2.03562 44.3588 3.69185 43.5096L46.019 21.9425C47.6752 21.0933 49.8494 20.6717 52.0236 20.6717M52.0296 19.4672C49.5724 19.4672 47.2476 19.9671 45.477 20.8705L3.14981 42.4316C1.12018 43.4674 -3.05176e-05 44.9309 -3.05176e-05 46.5631V66.48C-3.05176e-05 67.4255 0.409509 69.2263 3.14981 70.6175L41.4177 90.1189C43.1884 91.0223 45.5131 91.5221 47.9703 91.5221C50.4276 91.5221 52.7523 91.0223 54.523 90.1189L96.8501 68.5518C98.8798 67.5159 100 66.0524 100 64.4202V44.5033C100 43.5578 99.5904 41.757 96.8501 40.3658L58.5762 20.8645C56.8116 19.9611 54.4808 19.4612 52.0296 19.4612V19.4672Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M86.7922 46.4305C86.6838 46.4968 86.5754 46.563 86.455 46.6233L79.4085 50.2128L79.3844 50.2308L79.3964 50.2128L86.7982 46.4366L86.7922 46.4305Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M76.6561 56.5847L76.114 57.8495L75.1504 60.0899C74.6806 61.186 73.9098 62.0894 73.0606 62.5231L64.3699 66.9557L62.6595 64.7033L56.8115 61.722H56.7934L51.7765 64.2756C49.0724 65.4862 44.9589 65.426 42.3812 64.113L28.2159 56.8919L47.8618 46.8883C50.5479 45.5211 54.9083 45.5211 57.5944 46.8883L71.7597 54.1094L76.644 56.5908L76.6561 56.5847Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M88.4665 44.142C88.4665 44.9611 87.9064 45.7742 86.7922 46.4306L79.3904 50.2068L79.3783 50.2249L76.6561 56.5848L71.7717 54.1035L57.6065 46.8823C54.9204 45.5152 50.56 45.5152 47.8739 46.8823L28.228 56.886L13.5448 49.4058C12.2018 48.7193 11.5272 47.8219 11.5272 46.9245C11.5272 46.0271 12.2018 45.1298 13.5448 44.4432L47.8679 26.9594C50.554 25.5923 54.9144 25.5923 57.6005 26.9594L86.4489 41.6547C87.792 42.3413 88.4665 43.2386 88.4665 44.136V44.142Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M98.7954 44.5034C98.7954 45.5995 97.9763 46.6896 96.3562 47.5328L88.4666 51.5499L85.2505 53.1881L79.4025 50.2068L86.449 46.6173C86.5694 46.5571 86.6839 46.4969 86.7862 46.4246C87.9064 45.7742 88.4605 44.9551 88.4605 44.136C88.4605 43.2326 87.786 42.3352 86.4429 41.6547L57.5945 26.9594C54.9084 25.5923 50.548 25.5923 47.8619 26.9594L13.5388 44.4432C12.1958 45.1298 11.5212 46.0271 11.5212 46.9245C11.5212 47.8219 12.1958 48.7253 13.5388 49.4058L28.222 56.886L42.3873 64.1071C44.965 65.4261 49.0785 65.4803 51.7826 64.2697C51.9031 64.2155 52.0175 64.1613 52.1259 64.1071L56.8115 61.7161L62.6595 64.6973L53.9688 69.124C53.0956 69.5696 52.0838 69.9009 50.9997 70.1057C49.2832 70.4429 47.4042 70.4851 45.6576 70.2321C44.3025 70.0334 43.0257 69.672 41.9597 69.124L23.0787 59.5058L11.5212 53.6157L3.68578 49.6226C2.02353 48.7795 1.19843 47.6713 1.19843 46.5571C1.19843 45.4429 2.02955 44.3468 3.68578 43.4976L46.0129 21.9305C49.3314 20.2382 54.7096 20.2382 58.0161 21.9305L96.29 41.4319C97.9522 42.275 98.7773 43.3832 98.7773 44.4974L98.7954 44.5034Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M86.7921 46.4305C86.6837 46.4968 86.5753 46.563 86.4549 46.6233L79.4084 50.2128H79.3903L86.7921 46.4366V46.4305Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M85.2503 53.1939L82.5161 59.5719L81.0164 63.0771C80.5467 64.1732 79.7758 65.0766 78.9266 65.5102L68.9651 70.5873C68.3869 70.8824 67.8268 70.9126 67.3872 70.6837C67.2005 70.5934 67.0379 70.4548 66.8993 70.2742L64.3759 66.9497L73.0665 62.517C73.9157 62.0894 74.6866 61.18 75.1564 60.0838L76.12 57.8434L76.6621 56.5787L79.3843 50.2188L79.4084 50.2007L85.2564 53.1819L85.2503 53.1939Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M79.4025 50.2067L79.3783 50.2249L79.3904 50.2007L79.4025 50.2067Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M98.7953 44.5034V64.4203C98.7953 65.5285 97.9642 66.6366 96.308 67.4798L53.9808 89.0469C50.6624 90.7393 45.2841 90.7393 41.9717 89.0469L3.69176 69.5456C2.02951 68.7024 1.20441 67.5942 1.20441 66.4861V46.5692C1.20441 47.6774 2.02951 48.7855 3.69176 49.6347L11.5272 53.6277L23.0847 59.5179L41.9657 69.136C43.0317 69.6841 44.3145 70.0515 45.6636 70.2442C47.4162 70.4911 49.2952 70.449 51.0057 70.1177C52.0897 69.913 53.1015 69.5817 53.9748 69.136L62.6655 64.7094L64.3759 66.9619L66.8994 70.2864C67.0379 70.467 67.2006 70.6056 67.3873 70.6959C67.8269 70.9248 68.387 70.9007 68.9652 70.5995L78.9266 65.5224C79.7758 65.0948 80.5467 64.1854 81.0165 63.0893L82.5161 59.5841L85.2504 53.2061L88.4665 51.568L96.3562 47.5509C97.9763 46.7077 98.7953 45.6176 98.7953 44.5215V44.5034Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M56.8175 61.7161L52.1319 64.1071C52.0175 64.1673 51.9091 64.2215 51.7886 64.2697L56.8055 61.7101H56.8236L56.8175 61.7161Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M43.333 50.7852C42.821 50.7852 42.3452 50.6707 41.9116 50.4539L36.5454 47.7196C35.3168 47.0933 34.6061 45.6719 34.6061 43.829V23.87C34.6061 23.87 34.6061 23.8338 34.6061 23.8097V22.027C34.6061 18.823 36.7622 15.1191 39.4062 13.77L63.2679 1.61027C63.9485 1.26096 64.623 1.0863 65.2674 1.0863C65.7794 1.0863 66.2551 1.20073 66.6828 1.41755L72.0489 4.15183C73.2775 4.77819 73.9822 6.19953 73.9822 8.04848V9.84323C73.9822 9.84323 73.9822 9.87937 73.9822 9.90346V29.8505C73.9822 33.0545 71.8261 36.7584 69.1821 38.1075L45.3204 50.2672C44.6399 50.6105 43.9714 50.7912 43.333 50.7912V50.7852Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M65.2734 1.68846C65.6889 1.68846 66.0744 1.7788 66.4177 1.95345L71.7839 4.68773C72.7656 5.18761 73.3859 6.37408 73.3859 8.04837V9.84312C73.3859 9.84312 73.3859 9.86721 73.3859 9.87926V29.8383C73.3859 32.8316 71.3743 36.3066 68.9111 37.5593L45.0493 49.7191C44.4411 50.0262 43.8629 50.1768 43.3329 50.1768C42.9113 50.1768 42.5258 50.0864 42.1826 49.9118L36.8164 47.1775C35.8347 46.6776 35.2083 45.4972 35.2083 43.8229V23.8638C35.2083 23.8638 35.2083 23.8458 35.2083 23.8397V22.0269C35.2083 19.0337 37.2199 15.5586 39.6832 14.3059L63.5449 2.14618C64.1592 1.833 64.7374 1.68846 65.2674 1.68846M65.2734 0.483928C64.5326 0.483928 63.7737 0.682675 63.0028 1.07415L39.1411 13.2339C36.2623 14.6974 34.0098 18.5639 34.0098 22.033V23.7916C34.0098 23.7916 34.0098 23.8458 34.0098 23.8699V43.8289C34.0098 45.9067 34.8349 47.5208 36.2743 48.2556L41.6405 50.9898C42.1585 51.2548 42.7306 51.3873 43.3389 51.3873C44.0737 51.3873 44.8385 51.1886 45.6034 50.8031L69.4651 38.6434C72.344 37.1799 74.5964 33.3134 74.5964 29.8443V9.92141C74.5964 9.92141 74.5964 9.86721 74.5964 9.8371V8.04235C74.5964 5.95851 73.7713 4.34444 72.3319 3.60968L66.9657 0.8754C66.4478 0.610404 65.8817 0.477905 65.2734 0.477905V0.483928Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M72.85 8.76514C72.3682 8.51822 71.6575 8.80128 71.0854 9.53002L70.3988 10.4033L57.7392 26.6705C57.2755 27.2306 56.6973 27.5317 56.2938 27.4414L43.5559 24.0747L42.8693 23.9001C42.1707 23.7134 41.2432 24.4361 40.8095 25.49C40.6469 25.8815 40.5686 26.267 40.5686 26.5922V46.5512C40.5686 48.2195 41.195 49.406 42.1767 49.9058L36.8105 47.1716C35.8288 46.6717 35.2025 45.4912 35.2025 43.8169V23.8579C35.2025 23.5327 35.2747 23.1472 35.4434 22.7557C35.877 21.7018 36.7985 20.973 37.5031 21.1658L38.1897 21.3404L50.9276 24.7071C51.3311 24.7914 51.9093 24.4963 52.373 23.9362L65.0326 7.66902L65.7192 6.79574C66.2853 6.067 67.002 5.78393 67.4838 6.03086L72.85 8.76514Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M72.8499 8.76507C72.9644 8.8253 73.0607 8.90962 73.145 9.02405C73.3077 9.24689 73.386 9.55404 73.386 9.88529V29.8443C73.386 32.8376 71.3744 36.3127 68.9111 37.5654L45.0494 49.7251C43.9593 50.2792 42.9596 50.3093 42.1826 49.9118C41.2009 49.4119 40.5746 48.2315 40.5746 46.5572V26.5981C40.5746 26.2729 40.6469 25.8875 40.8155 25.496C41.2491 24.442 42.1706 23.7133 42.8752 23.906L43.5618 24.0807L56.2997 27.4473C56.7032 27.5316 57.2814 27.2365 57.7451 26.6764L70.4047 10.4093L71.0913 9.53597C71.6575 8.80723 72.3741 8.52417 72.856 8.7711L72.8499 8.76507Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M71.784 4.68781C71.007 4.29031 70.0073 4.32645 68.9172 4.88053L45.0554 17.0403C42.5922 18.293 40.5806 21.768 40.5806 24.7613V26.5741C40.5806 27.092 40.7673 27.5016 41.1106 27.6762L35.7444 24.942C35.4011 24.7673 35.2144 24.3578 35.2144 23.8398V22.027C35.2144 19.0337 37.226 15.5587 39.6893 14.306L63.551 2.14625C64.6411 1.59217 65.6409 1.55603 66.4178 1.95352L71.784 4.68781Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M71.784 4.68778C72.7656 5.18766 73.386 6.37412 73.386 8.04239V9.83714C73.386 10.4514 73.1451 11.1561 72.6994 11.7282L70.4048 14.6793L59.293 28.959C58.5642 29.8383 57.7693 30.4948 56.9803 30.8983C56.1913 31.3018 55.4264 31.4524 54.7459 31.3139L43.5618 28.3387L41.2793 27.7425C41.219 27.7244 41.1648 27.7063 41.1106 27.6762C40.7673 27.5016 40.5806 27.092 40.5806 26.5741V24.7613C40.5806 21.768 42.5922 18.2929 45.0555 17.0402L68.9172 4.8805C70.0073 4.32642 71.007 4.29028 71.784 4.68778Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.3024"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/illustration/search.tsx b/packages/propel/src/empty-state/assets/illustration/search.tsx
index 2b1f36b00..12a16c4f2 100644
--- a/packages/propel/src/empty-state/assets/illustration/search.tsx
+++ b/packages/propel/src/empty-state/assets/illustration/search.tsx
@@ -1,59 +1,61 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const SearchIllustration = ({ className, ...rest }: TIllustrationAssetProps) => (
-  <svg
-    width="161"
-    height="168"
-    viewBox="0 0 161 168"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-    {...rest}
-  >
-    <path
-      d="M144.84 4.63218C142.624 3.50452 139.768 3.59686 136.656 5.18614L20.4472 64.3983C13.4043 67.9857 7.69345 77.8445 7.69345 86.4108V156.537C7.69345 161.318 9.46737 164.688 12.2569 166.106L5.5634 162.696C2.77391 161.272 1 157.902 1 153.128V83.0015C1 74.4286 6.71087 64.5764 13.7538 60.989L129.962 1.77674C133.082 0.187462 135.93 0.0951613 138.146 1.22282L144.84 4.63218Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M144.84 4.6322C147.629 6.05662 149.403 9.42642 149.403 14.2009V84.327C149.403 92.8998 143.692 102.752 136.649 106.339L20.4407 165.552C17.3215 167.141 14.4726 167.233 12.2569 166.106C9.4674 164.681 7.69348 161.311 7.69348 156.537V86.4109C7.69348 77.838 13.4043 67.9858 20.4473 64.3983L136.656 5.18616C139.775 3.59688 142.624 3.50454 144.84 4.6322Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M151.843 141.244C151.019 141.244 150.28 141.013 149.641 140.558L147.108 138.771C146.772 138.844 146.436 138.883 146.112 138.883C145.295 138.883 144.55 138.653 143.91 138.204L121.119 122.081C113.252 131.399 103.611 136.945 95.2226 136.945C91.7803 136.945 88.661 136.035 85.9441 134.241C83.702 133.792 81.6247 132.902 79.7782 131.59C68.1521 123.366 68.0663 100.49 79.587 80.5944C88.0939 65.9018 100.821 56.4123 111.999 56.4123C115.448 56.4123 118.574 57.3224 121.291 59.1227C123.539 59.5777 125.61 60.4679 127.457 61.7671C137.764 69.0606 139.215 87.6901 130.978 106.221L158.418 125.628C160.944 127.415 161.029 132.091 158.609 136.265C157.475 138.224 155.958 139.76 154.329 140.585C153.479 141.02 152.641 141.238 151.837 141.238L151.843 141.244ZM90.8636 123.657C91.3252 123.709 91.8066 123.736 92.2814 123.736C100.287 123.736 109.467 116.818 115.666 106.115C123.777 92.115 124.074 75.8332 116.371 69.6937C115.91 69.6409 115.428 69.6145 114.947 69.6145C106.941 69.6145 97.7615 76.5322 91.5626 87.2285C83.4514 101.229 83.1546 117.511 90.857 123.65L90.8636 123.657Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M112.006 57.0718C115.277 57.0718 118.35 57.9291 121.04 59.7425C123.197 60.158 125.234 61.0021 127.081 62.3078C137.309 69.542 138.344 88.4287 130.16 106.452L158.049 126.176C160.271 127.745 160.271 132.111 158.049 135.942C156.941 137.855 155.49 139.266 154.039 140.004C153.294 140.387 152.549 140.585 151.843 140.585C151.184 140.585 150.564 140.407 150.023 140.024L147.247 138.059C146.864 138.165 146.482 138.224 146.112 138.224C145.453 138.224 144.833 138.046 144.292 137.663L121.007 121.19C113.107 130.752 103.525 136.285 95.2292 136.285C91.9649 136.285 88.8985 135.428 86.2079 133.621C84.0449 133.205 82.0138 132.361 80.1673 131.056C68.7917 123.01 68.7917 100.569 80.1673 80.9307C88.7797 66.0667 101.435 57.0784 112.012 57.0784M92.288 124.395C100.241 124.395 109.764 117.629 116.246 106.445C124.667 91.9106 124.792 75.3452 116.642 69.0606C116.088 68.9881 115.527 68.9551 114.96 68.9551C107.007 68.9551 97.4845 75.7211 91.0087 86.8988C82.5875 101.433 82.4622 117.999 90.613 124.283C91.167 124.356 91.7275 124.389 92.2946 124.389M112.006 55.7529C100.591 55.7529 87.6455 65.3743 79.0198 80.2647C73.4013 89.9586 70.3085 100.642 70.3085 110.336C70.3085 120.241 73.5332 127.983 79.3957 132.131C81.2884 133.469 83.4052 134.386 85.6869 134.861C88.483 136.681 91.6879 137.604 95.216 137.604C103.65 137.604 113.305 132.15 121.218 122.964L143.514 138.738C144.259 139.266 145.15 139.543 146.093 139.543C146.37 139.543 146.653 139.516 146.937 139.47L149.238 141.099C149.983 141.627 150.874 141.904 151.823 141.904C152.773 141.904 153.67 141.66 154.613 141.178C156.354 140.295 157.969 138.666 159.163 136.602C161.755 132.131 161.583 127.079 158.781 125.094L131.776 105.997C139.894 87.3472 138.285 68.6386 127.813 61.2329C125.933 59.9008 123.816 58.9842 121.522 58.5028C118.719 56.6827 115.507 55.7529 111.973 55.7529H112.006ZM91.1274 123.024C83.8206 116.983 84.2361 101.202 92.1364 87.5648C98.1242 77.2246 107.297 70.274 114.947 70.274C115.336 70.274 115.725 70.2938 116.107 70.3267C123.414 76.3607 122.992 92.1414 115.092 105.785C109.104 116.126 99.9311 123.076 92.2748 123.076C91.8857 123.076 91.4967 123.057 91.1208 123.024H91.1274Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M152.311 123.815L124.423 104.091C132.607 86.0679 131.572 67.1877 121.343 59.947C109.968 51.9016 91.5296 61.2922 80.1541 80.9307C68.7785 100.569 68.7785 123.01 80.1541 131.056C89.914 137.96 104.897 132.012 116.134 117.755L144.279 137.663C145.387 138.448 146.844 138.382 148.295 137.644C149.746 136.905 151.197 135.487 152.305 133.581C154.527 129.75 154.527 125.384 152.305 123.815H152.311ZM85.2715 122.239C76.7184 116.185 76.7184 99.3162 85.2715 84.5445C93.8245 69.7794 107.693 62.7101 116.246 68.7638C124.799 74.811 124.799 91.6864 116.246 106.452C107.693 121.217 93.8245 128.286 85.2781 122.239H85.2715Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M158.042 126.176L130.154 106.452C138.338 88.4287 137.302 69.5486 127.074 62.3078C115.699 54.2625 97.2603 63.6531 85.8847 83.2916C74.5092 102.93 74.5092 125.371 85.8847 133.416C95.6446 140.321 110.627 134.373 121.864 120.115L150.01 140.024C151.118 140.809 152.575 140.743 154.026 140.004C155.477 139.266 156.928 137.848 158.035 135.942C160.258 132.111 160.258 127.745 158.035 126.176H158.042ZM91.0021 124.6C82.449 118.546 82.449 101.677 91.0021 86.9053C99.5552 72.1402 113.423 65.0709 121.977 71.1247C130.53 77.1718 130.53 94.0472 121.977 108.812C113.423 123.577 99.5552 130.647 91.0087 124.6H91.0021Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M37.1248 108.984C28.6904 113.283 21.8256 108.43 21.8256 98.1622C21.8256 87.8945 28.6904 76.0441 37.1248 71.7445C45.5592 67.4449 52.4241 72.2984 52.4241 82.5661C52.4241 92.8338 45.5592 104.684 37.1248 108.984ZM37.1248 74.6065C29.9829 78.2467 24.1798 88.2704 24.1798 96.962C24.1798 105.654 29.9895 109.755 37.1248 106.122C44.2667 102.482 50.0699 92.4579 50.0699 83.7663C50.0699 75.0813 44.2601 70.9729 37.1248 74.6065ZM37.138 101.829C36.4852 102.158 35.951 101.796 35.951 101.004C35.951 100.213 36.4786 99.2898 37.1248 98.9601H37.138C37.7909 98.6238 38.3119 98.9931 38.3119 99.7844C38.3119 100.576 37.7843 101.499 37.138 101.829ZM37.1248 96.0915C36.472 96.4212 35.951 96.0519 35.951 95.2606V93.8296C35.951 91.9237 37.0523 89.5761 38.8922 87.5516C39.1889 87.2284 39.4527 86.8855 39.6769 86.5228C40.31 85.5205 40.6595 84.4719 40.6595 83.5487C40.6595 82.6255 40.31 81.9264 39.6835 81.5769C38.2986 80.8054 35.9576 81.999 34.5793 84.1818C34.0913 84.9467 33.3462 85.2699 32.9175 84.894C32.4889 84.5181 32.5416 83.5883 33.0296 82.8167C35.2982 79.2557 38.9713 77.3763 41.2398 78.6358C42.3873 79.2755 43.0203 80.5943 43.0203 82.3551C43.0203 84.1158 42.3873 86.0744 41.2398 87.8813C40.8573 88.488 40.4155 89.0749 39.9275 89.6091C39.1493 90.4663 38.3185 91.7061 38.3185 92.6294V94.0604C38.3185 94.8517 37.7909 95.7618 37.1446 96.0915H37.1248Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+export function SearchIllustration({ className, ...rest }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="161"
+      height="168"
+      viewBox="0 0 161 168"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      {...rest}
+    >
+      <path
+        d="M144.84 4.63218C142.624 3.50452 139.768 3.59686 136.656 5.18614L20.4472 64.3983C13.4043 67.9857 7.69345 77.8445 7.69345 86.4108V156.537C7.69345 161.318 9.46737 164.688 12.2569 166.106L5.5634 162.696C2.77391 161.272 1 157.902 1 153.128V83.0015C1 74.4286 6.71087 64.5764 13.7538 60.989L129.962 1.77674C133.082 0.187462 135.93 0.0951613 138.146 1.22282L144.84 4.63218Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M144.84 4.6322C147.629 6.05662 149.403 9.42642 149.403 14.2009V84.327C149.403 92.8998 143.692 102.752 136.649 106.339L20.4407 165.552C17.3215 167.141 14.4726 167.233 12.2569 166.106C9.4674 164.681 7.69348 161.311 7.69348 156.537V86.4109C7.69348 77.838 13.4043 67.9858 20.4473 64.3983L136.656 5.18616C139.775 3.59688 142.624 3.50454 144.84 4.6322Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M151.843 141.244C151.019 141.244 150.28 141.013 149.641 140.558L147.108 138.771C146.772 138.844 146.436 138.883 146.112 138.883C145.295 138.883 144.55 138.653 143.91 138.204L121.119 122.081C113.252 131.399 103.611 136.945 95.2226 136.945C91.7803 136.945 88.661 136.035 85.9441 134.241C83.702 133.792 81.6247 132.902 79.7782 131.59C68.1521 123.366 68.0663 100.49 79.587 80.5944C88.0939 65.9018 100.821 56.4123 111.999 56.4123C115.448 56.4123 118.574 57.3224 121.291 59.1227C123.539 59.5777 125.61 60.4679 127.457 61.7671C137.764 69.0606 139.215 87.6901 130.978 106.221L158.418 125.628C160.944 127.415 161.029 132.091 158.609 136.265C157.475 138.224 155.958 139.76 154.329 140.585C153.479 141.02 152.641 141.238 151.837 141.238L151.843 141.244ZM90.8636 123.657C91.3252 123.709 91.8066 123.736 92.2814 123.736C100.287 123.736 109.467 116.818 115.666 106.115C123.777 92.115 124.074 75.8332 116.371 69.6937C115.91 69.6409 115.428 69.6145 114.947 69.6145C106.941 69.6145 97.7615 76.5322 91.5626 87.2285C83.4514 101.229 83.1546 117.511 90.857 123.65L90.8636 123.657Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M112.006 57.0718C115.277 57.0718 118.35 57.9291 121.04 59.7425C123.197 60.158 125.234 61.0021 127.081 62.3078C137.309 69.542 138.344 88.4287 130.16 106.452L158.049 126.176C160.271 127.745 160.271 132.111 158.049 135.942C156.941 137.855 155.49 139.266 154.039 140.004C153.294 140.387 152.549 140.585 151.843 140.585C151.184 140.585 150.564 140.407 150.023 140.024L147.247 138.059C146.864 138.165 146.482 138.224 146.112 138.224C145.453 138.224 144.833 138.046 144.292 137.663L121.007 121.19C113.107 130.752 103.525 136.285 95.2292 136.285C91.9649 136.285 88.8985 135.428 86.2079 133.621C84.0449 133.205 82.0138 132.361 80.1673 131.056C68.7917 123.01 68.7917 100.569 80.1673 80.9307C88.7797 66.0667 101.435 57.0784 112.012 57.0784M92.288 124.395C100.241 124.395 109.764 117.629 116.246 106.445C124.667 91.9106 124.792 75.3452 116.642 69.0606C116.088 68.9881 115.527 68.9551 114.96 68.9551C107.007 68.9551 97.4845 75.7211 91.0087 86.8988C82.5875 101.433 82.4622 117.999 90.613 124.283C91.167 124.356 91.7275 124.389 92.2946 124.389M112.006 55.7529C100.591 55.7529 87.6455 65.3743 79.0198 80.2647C73.4013 89.9586 70.3085 100.642 70.3085 110.336C70.3085 120.241 73.5332 127.983 79.3957 132.131C81.2884 133.469 83.4052 134.386 85.6869 134.861C88.483 136.681 91.6879 137.604 95.216 137.604C103.65 137.604 113.305 132.15 121.218 122.964L143.514 138.738C144.259 139.266 145.15 139.543 146.093 139.543C146.37 139.543 146.653 139.516 146.937 139.47L149.238 141.099C149.983 141.627 150.874 141.904 151.823 141.904C152.773 141.904 153.67 141.66 154.613 141.178C156.354 140.295 157.969 138.666 159.163 136.602C161.755 132.131 161.583 127.079 158.781 125.094L131.776 105.997C139.894 87.3472 138.285 68.6386 127.813 61.2329C125.933 59.9008 123.816 58.9842 121.522 58.5028C118.719 56.6827 115.507 55.7529 111.973 55.7529H112.006ZM91.1274 123.024C83.8206 116.983 84.2361 101.202 92.1364 87.5648C98.1242 77.2246 107.297 70.274 114.947 70.274C115.336 70.274 115.725 70.2938 116.107 70.3267C123.414 76.3607 122.992 92.1414 115.092 105.785C109.104 116.126 99.9311 123.076 92.2748 123.076C91.8857 123.076 91.4967 123.057 91.1208 123.024H91.1274Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M152.311 123.815L124.423 104.091C132.607 86.0679 131.572 67.1877 121.343 59.947C109.968 51.9016 91.5296 61.2922 80.1541 80.9307C68.7785 100.569 68.7785 123.01 80.1541 131.056C89.914 137.96 104.897 132.012 116.134 117.755L144.279 137.663C145.387 138.448 146.844 138.382 148.295 137.644C149.746 136.905 151.197 135.487 152.305 133.581C154.527 129.75 154.527 125.384 152.305 123.815H152.311ZM85.2715 122.239C76.7184 116.185 76.7184 99.3162 85.2715 84.5445C93.8245 69.7794 107.693 62.7101 116.246 68.7638C124.799 74.811 124.799 91.6864 116.246 106.452C107.693 121.217 93.8245 128.286 85.2781 122.239H85.2715Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M158.042 126.176L130.154 106.452C138.338 88.4287 137.302 69.5486 127.074 62.3078C115.699 54.2625 97.2603 63.6531 85.8847 83.2916C74.5092 102.93 74.5092 125.371 85.8847 133.416C95.6446 140.321 110.627 134.373 121.864 120.115L150.01 140.024C151.118 140.809 152.575 140.743 154.026 140.004C155.477 139.266 156.928 137.848 158.035 135.942C160.258 132.111 160.258 127.745 158.035 126.176H158.042ZM91.0021 124.6C82.449 118.546 82.449 101.677 91.0021 86.9053C99.5552 72.1402 113.423 65.0709 121.977 71.1247C130.53 77.1718 130.53 94.0472 121.977 108.812C113.423 123.577 99.5552 130.647 91.0087 124.6H91.0021Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M37.1248 108.984C28.6904 113.283 21.8256 108.43 21.8256 98.1622C21.8256 87.8945 28.6904 76.0441 37.1248 71.7445C45.5592 67.4449 52.4241 72.2984 52.4241 82.5661C52.4241 92.8338 45.5592 104.684 37.1248 108.984ZM37.1248 74.6065C29.9829 78.2467 24.1798 88.2704 24.1798 96.962C24.1798 105.654 29.9895 109.755 37.1248 106.122C44.2667 102.482 50.0699 92.4579 50.0699 83.7663C50.0699 75.0813 44.2601 70.9729 37.1248 74.6065ZM37.138 101.829C36.4852 102.158 35.951 101.796 35.951 101.004C35.951 100.213 36.4786 99.2898 37.1248 98.9601H37.138C37.7909 98.6238 38.3119 98.9931 38.3119 99.7844C38.3119 100.576 37.7843 101.499 37.138 101.829ZM37.1248 96.0915C36.472 96.4212 35.951 96.0519 35.951 95.2606V93.8296C35.951 91.9237 37.0523 89.5761 38.8922 87.5516C39.1889 87.2284 39.4527 86.8855 39.6769 86.5228C40.31 85.5205 40.6595 84.4719 40.6595 83.5487C40.6595 82.6255 40.31 81.9264 39.6835 81.5769C38.2986 80.8054 35.9576 81.999 34.5793 84.1818C34.0913 84.9467 33.3462 85.2699 32.9175 84.894C32.4889 84.5181 32.5416 83.5883 33.0296 82.8167C35.2982 79.2557 38.9713 77.3763 41.2398 78.6358C42.3873 79.2755 43.0203 80.5943 43.0203 82.3551C43.0203 84.1158 42.3873 86.0744 41.2398 87.8813C40.8573 88.488 40.4155 89.0749 39.9275 89.6091C39.1493 90.4663 38.3185 91.7061 38.3185 92.6294V94.0604C38.3185 94.8517 37.7909 95.7618 37.1446 96.0915H37.1248Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/404-error.tsx b/packages/propel/src/empty-state/assets/vertical-stack/404-error.tsx
index bc162b98d..ac2544043 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/404-error.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/404-error.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const Error404VerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="173"
-    viewBox="0 0 162 173"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function Error404VerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="173"
+      viewBox="0 0 162 173"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M1 138.476C1 140.5 2.51532 142.519 5.54055 144.066L44.4938 163.915C50.5496 166.999 60.3642 166.999 66.42 163.915L148.273 122.209C151.298 120.667 152.813 118.649 152.813 116.625V123.088C152.813 125.111 151.298 127.13 148.273 128.672L66.42 170.378C60.3642 173.462 50.5496 173.462 44.4938 170.378L5.54055 150.529C2.50996 148.987 1 146.963 1 144.939V138.476Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 138.476C1 136.452 2.51532 134.433 5.54055 132.891L87.3932 91.1859C93.449 88.1018 103.264 88.1018 109.319 91.1859L148.273 111.035C151.303 112.577 152.813 114.601 152.813 116.625C152.813 118.649 151.298 120.667 148.273 122.209L66.42 163.915C60.3642 166.999 50.5496 166.999 44.4938 163.915L5.54055 144.066C2.50996 142.524 1 140.5 1 138.476Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M1 118.06C1 120.084 2.51532 122.102 5.54055 123.65L44.4938 143.499C50.5496 146.583 60.3642 146.583 66.42 143.499L148.273 101.793C151.298 100.251 152.813 98.2325 152.813 96.2085V102.671C152.813 104.695 151.298 106.714 148.273 108.256L66.42 149.961C60.3642 153.045 50.5496 153.045 44.4938 149.961L5.54055 130.113C2.50996 128.57 1 126.546 1 124.523V118.06Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 118.06C1 116.036 2.51532 114.017 5.54055 112.475L87.3932 70.7696C93.449 67.6855 103.264 67.6855 109.319 70.7696L148.273 90.6184C151.303 92.1605 152.813 94.1844 152.813 96.2084C152.813 98.2323 151.298 100.251 148.273 101.793L66.42 143.498C60.3642 146.583 50.5496 146.583 44.4938 143.498L5.54055 123.65C2.50996 122.108 1 120.084 1 118.06Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M1 138.476C1 140.5 2.51532 142.519 5.54055 144.066L44.4938 163.915C50.5496 166.999 60.3642 166.999 66.42 163.915L148.273 122.209C151.298 120.667 152.813 118.649 152.813 116.625V123.088C152.813 125.111 151.298 127.13 148.273 128.672L66.42 170.378C60.3642 173.462 50.5496 173.462 44.4938 170.378L5.54055 150.529C2.50996 148.987 1 146.963 1 144.939V138.476Z"
+        d="M1 97.6435C1 99.6675 2.51532 101.686 5.54055 103.234L44.4938 123.082C50.5496 126.166 60.3642 126.166 66.42 123.082L148.273 81.3769C151.298 79.8348 152.813 77.8162 152.813 75.7922V82.255C152.813 84.279 151.298 86.2976 148.273 87.8396L66.42 129.545C60.3642 132.629 50.5496 132.629 44.4938 129.545L5.54055 109.696C2.50996 108.154 1 106.13 1 104.106V97.6435Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -20,17 +56,17 @@ export const Error404VerticalStackIllustration = ({ className }: TIllustrationAs
         strokeLinejoin="round"
       />
       <path
-        d="M1 138.476C1 136.452 2.51532 134.433 5.54055 132.891L87.3932 91.1859C93.449 88.1018 103.264 88.1018 109.319 91.1859L148.273 111.035C151.303 112.577 152.813 114.601 152.813 116.625C152.813 118.649 151.298 120.667 148.273 122.209L66.42 163.915C60.3642 166.999 50.5496 166.999 44.4938 163.915L5.54055 144.066C2.50996 142.524 1 140.5 1 138.476Z"
+        d="M1 97.6434C1 95.6194 2.51532 93.6008 5.54055 92.0588L87.3932 50.3534C93.449 47.2693 103.264 47.2693 109.319 50.3534L148.273 70.2021C151.303 71.7442 152.813 73.7681 152.813 75.7921C152.813 77.8161 151.298 79.8347 148.273 81.3767L66.42 123.082C60.3642 126.166 50.5496 126.166 44.4938 123.082L5.54055 103.233C2.50996 101.691 1 99.6674 1 97.6434Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M1 118.06C1 120.084 2.51532 122.102 5.54055 123.65L44.4938 143.499C50.5496 146.583 60.3642 146.583 66.42 143.499L148.273 101.793C151.298 100.251 152.813 98.2325 152.813 96.2085V102.671C152.813 104.695 151.298 106.714 148.273 108.256L66.42 149.961C60.3642 153.045 50.5496 153.045 44.4938 149.961L5.54055 130.113C2.50996 128.57 1 126.546 1 124.523V118.06Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M157.632 39.0343C158.232 38.7291 158.612 38.0062 158.612 36.9782V23.8492C158.612 22.0073 157.386 19.887 155.87 19.1159L121.897 1.80518C121.228 1.4625 120.612 1.44644 120.135 1.68738L122.523 0.471936C123 0.230988 123.616 0.247052 124.285 0.589733L158.259 17.9005C159.774 18.6715 161 20.7919 161 22.6338V35.7628C161 36.7908 160.62 37.5136 160.02 37.8188L157.632 39.0343Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -38,249 +74,215 @@ export const Error404VerticalStackIllustration = ({ className }: TIllustrationAs
         strokeLinejoin="round"
       />
       <path
-        d="M1 118.06C1 116.036 2.51532 114.017 5.54055 112.475L87.3932 70.7696C93.449 67.6855 103.264 67.6855 109.319 70.7696L148.273 90.6184C151.303 92.1605 152.813 94.1844 152.813 96.2084C152.813 98.2323 151.298 100.251 148.273 101.793L66.42 143.498C60.3642 146.583 50.5496 146.583 44.4938 143.498L5.54055 123.65C2.50996 122.108 1 120.084 1 118.06Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M157.632 39.0342C157.155 39.2751 156.54 39.2591 155.87 38.9164L121.897 21.6056C120.381 20.8346 119.155 18.7142 119.155 16.8723V3.74336C119.155 2.71531 119.536 1.99247 120.135 1.68727C120.612 1.44632 121.227 1.46238 121.897 1.80507L155.87 19.1158C157.386 19.8869 158.612 22.0072 158.612 23.8491V36.9781C158.612 38.0061 158.232 38.729 157.632 39.0342Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M1 97.6435C1 99.6675 2.51532 101.686 5.54055 103.234L44.4938 123.082C50.5496 126.166 60.3642 126.166 66.42 123.082L148.273 81.3769C151.298 79.8348 152.813 77.8162 152.813 75.7922V82.255C152.813 84.279 151.298 86.2976 148.273 87.8396L66.42 129.545C60.3642 132.629 50.5496 132.629 44.4938 129.545L5.54055 109.696C2.50996 108.154 1 106.13 1 104.106V97.6435Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M1 97.6434C1 95.6194 2.51532 93.6008 5.54055 92.0588L87.3932 50.3534C93.449 47.2693 103.264 47.2693 109.319 50.3534L148.273 70.2021C151.303 71.7442 152.813 73.7681 152.813 75.7921C152.813 77.8161 151.298 79.8347 148.273 81.3767L66.42 123.082C60.3642 126.166 50.5496 126.166 44.4938 123.082L5.54055 103.233C2.50996 101.691 1 99.6674 1 97.6434Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M157.632 39.0343C158.232 38.7291 158.612 38.0062 158.612 36.9782V23.8492C158.612 22.0073 157.386 19.887 155.87 19.1159L121.897 1.80518C121.228 1.4625 120.612 1.44644 120.135 1.68738L122.523 0.471936C123 0.230988 123.616 0.247052 124.285 0.589733L158.259 17.9005C159.774 18.6715 161 20.7919 161 22.6338V35.7628C161 36.7908 160.62 37.5136 160.02 37.8188L157.632 39.0343Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M157.632 39.0342C157.155 39.2751 156.54 39.2591 155.87 38.9164L121.897 21.6056C120.381 20.8346 119.155 18.7142 119.155 16.8723V3.74336C119.155 2.71531 119.536 1.99247 120.135 1.68727C120.612 1.44632 121.227 1.46238 121.897 1.80507L155.87 19.1158C157.386 19.8869 158.612 22.0072 158.612 23.8491V36.9781C158.612 38.0061 158.232 38.729 157.632 39.0342Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M134.105 24.1008C133.843 23.9669 133.586 23.7527 133.355 23.4743C132.632 22.6015 132.386 21.3486 132.804 20.6847L136.825 14.1684C136.959 13.9488 137.157 13.8096 137.393 13.7668C137.741 13.7025 138.153 13.8525 138.538 14.1791C138.929 14.5057 139.25 14.9822 139.449 15.507L143.47 26.1247C143.604 26.4674 143.673 26.8208 143.673 27.1421C143.673 28.154 142.999 28.6359 142.163 28.2129L134.116 24.1115C134.116 24.1115 134.105 24.1115 134.105 24.1061V24.1008ZM138.137 15.1268C138.051 15.084 137.965 15.0679 137.89 15.0786C137.81 15.0947 137.746 15.1375 137.703 15.2125L133.677 21.7341C133.537 21.959 133.618 22.3766 133.859 22.6658C133.934 22.7622 134.03 22.8371 134.116 22.88L142.169 26.9814C142.447 27.1206 142.672 26.96 142.672 26.6227C142.672 26.5156 142.651 26.3978 142.602 26.2854L138.576 15.6622C138.506 15.4855 138.399 15.3249 138.271 15.2178C138.228 15.1803 138.18 15.1482 138.137 15.1268Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M138.142 21.263C137.864 21.1237 137.639 20.7329 137.639 20.3955V17.9486C137.639 17.6113 137.864 17.4506 138.142 17.5952C138.421 17.7398 138.645 18.1253 138.645 18.4626V20.9096C138.645 21.2469 138.421 21.4075 138.142 21.263Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M138.147 23.7153C137.869 23.576 137.644 23.1852 137.644 22.8478C137.644 22.5105 137.869 22.3499 138.142 22.4891C138.421 22.6337 138.645 23.0245 138.645 23.3619C138.645 23.6992 138.421 23.8598 138.142 23.7153H138.147Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M17.1274 48.2278C15.9602 47.6334 14.4609 47.6816 12.8171 48.5223C9.10654 50.4124 6.10273 55.6061 6.10273 60.1145C6.10273 62.6311 7.03975 64.4087 8.51221 65.1584L6.12414 63.9429C4.65168 63.1933 3.71466 61.4156 3.71466 58.8991C3.71466 54.3853 6.72385 49.1916 10.4291 47.3068C12.0675 46.4715 13.5721 46.418 14.7394 47.0123L17.1274 48.2278Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M17.1275 48.2276C18.5999 48.9773 19.5369 50.7549 19.5369 53.2715C19.5369 57.7852 16.5278 62.979 12.8225 64.8637C11.1841 65.699 9.67952 65.7526 8.51226 65.1582C7.0398 64.4086 6.10278 62.631 6.10278 60.1144C6.10278 55.6006 9.11194 50.4069 12.8172 48.5221C14.4556 47.6869 15.9602 47.6333 17.1275 48.2276Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M15.4943 59.0437C15.3979 59.0919 15.3016 59.0972 15.2266 59.0437L9.87221 55.2582C9.72228 55.1511 9.72228 54.8619 9.87221 54.6049C10.0221 54.3479 10.2577 54.2301 10.4076 54.3318L15.762 58.1174C15.912 58.2245 15.912 58.5136 15.762 58.7706C15.6871 58.8991 15.5907 58.9902 15.4943 59.0437Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M12.8171 61.7583C10.5201 62.931 8.65143 61.6084 8.65143 58.8134C8.65143 56.0184 10.5201 52.7951 12.8171 51.6225C15.1142 50.4499 16.9829 51.7724 16.9829 54.5674C16.9829 57.3624 15.1142 60.5857 12.8171 61.7583ZM12.8171 52.5434C10.9377 53.5019 9.41174 56.1416 9.41174 58.4279C9.41174 60.7142 10.9431 61.7958 12.8171 60.8374C14.6912 59.8789 16.2225 57.2392 16.2225 54.9529C16.2225 52.6666 14.6912 51.585 12.8171 52.5434Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M52.2095 105.279C52.1238 105.279 52.0435 105.257 51.9685 105.22L47.1978 102.789C47.0211 102.698 46.9033 102.516 46.9033 102.312V97.3221L37.1636 102.286C37.0887 102.323 37.003 102.345 36.9227 102.345C36.8424 102.345 36.7567 102.323 36.6817 102.286L31.911 99.8547C31.7343 99.7637 31.6165 99.5816 31.6165 99.3782V93.0653C31.6165 92.985 31.6325 92.9047 31.67 92.8351L46.6837 61.4423C46.7319 61.3352 46.8176 61.2495 46.9247 61.196L52.8948 58.1547C52.9698 58.1172 53.0555 58.0958 53.1358 58.0958C53.2161 58.0958 53.3018 58.1172 53.3767 58.1547L58.1475 60.5856C58.3242 60.6766 58.442 60.8587 58.442 61.0621V80.6699L59.8288 81.3767C59.6628 79.6258 59.5825 77.6447 59.5825 75.4708C59.5825 60.6017 63.368 52.04 71.8547 47.7136C73.9162 46.6642 75.6724 46.1501 77.2145 46.1501C78.1515 46.1501 79.0136 46.3483 79.7739 46.7338L84.5446 49.1647C87.1201 50.4765 88.598 53.8765 89.1441 59.7878L101.775 33.3692C101.823 33.2621 101.909 33.1764 102.016 33.1229L107.986 30.0816C108.061 30.0441 108.147 30.0227 108.227 30.0227C108.307 30.0227 108.393 30.0441 108.468 30.0816L113.239 32.5125C113.416 32.6035 113.533 32.7856 113.533 32.989V52.5968L117.142 54.4387C117.319 54.5298 117.437 54.7118 117.437 54.9153V61.0621C117.437 61.2656 117.324 61.4476 117.142 61.5387L113.533 63.3806V73.7788C113.533 73.9823 113.421 74.1643 113.239 74.2554L107.547 77.1574C107.472 77.1949 107.386 77.2163 107.306 77.2163C107.226 77.2163 107.14 77.1949 107.065 77.1574L102.294 74.7265C102.118 74.6355 102 74.4535 102 74.25V69.2597L92.2603 74.2232C92.1854 74.2607 92.0997 74.2821 92.0194 74.2821C91.9391 74.2821 91.8534 74.2607 91.7784 74.2232L89.0531 72.8364C87.9715 83.2989 84.1645 89.8634 77.1181 93.4509C75.0727 94.495 73.3272 95.0036 71.7798 95.0036C70.8695 95.0036 70.0342 94.8216 69.29 94.4575C69.2632 94.4468 69.2311 94.4361 69.2043 94.4254L64.4336 91.9945C63.4912 91.5126 62.6827 90.7255 62.0187 89.6439L58.4474 91.4644V101.863C58.4474 102.066 58.3349 102.248 58.1528 102.339L52.4611 105.241C52.3862 105.279 52.3005 105.3 52.2202 105.3L52.2095 105.279ZM46.5981 85.2693L46.9033 85.1141V84.6322L46.5981 85.2693ZM76.9789 57.4158C72.856 59.6004 71.2443 64.5318 71.2443 74.9247C71.2443 78.903 71.4853 81.7997 71.9779 83.7326C76.0954 81.548 77.7071 76.6166 77.7071 66.2291C77.7071 62.1866 77.4768 59.3594 76.9789 57.4211V57.4158ZM101.689 57.1963L101.995 57.041V56.5591L101.689 57.1963Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M108.222 30.5582L112.993 32.9891V52.9235L116.896 54.91V61.0568L112.993 63.0433V73.7682L107.301 76.6702L102.53 74.2393V68.3763L92.014 73.736L88.5872 71.9905C87.6823 82.2013 84.2876 89.1835 76.8664 92.9637C74.8907 93.9703 73.204 94.4575 71.7744 94.4575C70.8641 94.4575 70.0557 94.2594 69.3435 93.8739C69.3757 93.89 69.4078 93.9167 69.4399 93.9328L64.6691 91.5019C63.4537 90.8808 62.5113 89.7189 61.8045 88.0483V89.1299L57.9012 91.1164V101.841L52.2094 104.743L47.4387 102.312V96.4494L36.9227 101.809L32.1519 99.3782V93.0654L47.1656 61.6726L53.1357 58.6313L57.9065 61.0622V80.9966L60.4606 82.2977C60.225 80.3005 60.1125 78.0249 60.1125 75.4655C60.1125 61.7208 63.2341 52.704 72.0956 48.1849C74.0821 47.1729 75.7741 46.6803 77.2145 46.6803C78.0765 46.6803 78.8475 46.857 79.5275 47.205L84.2983 49.6359C84.2501 49.6091 84.1966 49.5877 84.143 49.5663C87.0076 50.8942 88.3945 55.1241 88.7479 61.8386L102.252 33.5995L108.222 30.5582ZM81.9799 49.1165C81.9799 49.1165 81.9477 49.1165 81.9317 49.1165C81.9317 49.1165 81.9264 49.1165 81.921 49.1165C81.921 49.1165 81.9263 49.1165 81.9317 49.1165C81.9477 49.1165 81.9638 49.1165 81.9799 49.1165C82.1191 49.1165 82.2583 49.1165 82.3922 49.1326C82.3922 49.1326 82.4029 49.1326 82.4082 49.1326C82.4082 49.1326 82.4243 49.1326 82.435 49.1326C82.4243 49.1326 82.4189 49.1326 82.4082 49.1326C82.4082 49.1326 82.3975 49.1326 82.3922 49.1326C82.2583 49.1219 82.1191 49.1165 81.9799 49.1165ZM81.348 49.1486C81.498 49.1326 81.6479 49.1272 81.7925 49.1219C81.6479 49.1219 81.498 49.1326 81.348 49.1486ZM82.9597 49.2022C82.8259 49.1808 82.6866 49.1594 82.5474 49.1486C82.6866 49.1647 82.8259 49.1808 82.9597 49.2022ZM83.538 49.336C83.3934 49.2932 83.2489 49.2557 83.0989 49.2236C83.2489 49.2557 83.3934 49.2879 83.538 49.336ZM84.0252 49.5127C83.8807 49.4485 83.7308 49.3896 83.5755 49.3468C83.7308 49.3949 83.8807 49.4538 84.0252 49.5127ZM79.3081 49.5877C79.4848 49.5288 79.6561 49.4806 79.8221 49.4324C79.6507 49.4806 79.4794 49.5288 79.3081 49.5877ZM78.5049 49.8768C78.7298 49.7858 78.9493 49.7055 79.1688 49.6359C78.9547 49.7109 78.7298 49.7912 78.5049 49.8768ZM100.522 58.3957L102.53 57.373V54.2085L100.522 58.3957ZM80.3147 56.4735C80.4218 56.5324 80.5288 56.5966 80.6306 56.6716C80.5288 56.5966 80.4218 56.527 80.3147 56.4735ZM71.6405 84.4876C71.7905 84.4234 71.9404 84.3538 72.0903 84.2735C76.7272 81.9122 78.2425 76.4453 78.2425 66.2238C78.2425 61.9028 77.9748 58.7276 77.3162 56.6555C77.1663 56.7198 77.0163 56.7894 76.8611 56.8697C72.2242 59.231 70.7089 64.6389 70.7089 74.9193C70.7089 79.2296 70.9819 82.4101 71.6352 84.4823M81.5301 57.7478C81.4498 57.6086 81.3695 57.4801 81.2838 57.3569C81.3695 57.4747 81.4498 57.6086 81.5301 57.7478ZM81.7657 58.219C81.7122 58.0958 81.6532 57.9834 81.5943 57.8709C81.6532 57.9834 81.7068 58.0958 81.7657 58.219ZM81.8246 58.3528C81.8942 58.5135 81.9585 58.6848 82.0173 58.8615C81.9585 58.6848 81.8889 58.5135 81.8246 58.3528ZM82.3815 60.1733C82.3386 59.9859 82.2958 59.8092 82.253 59.6379C82.2958 59.8092 82.3386 59.9913 82.3815 60.1733ZM82.6599 61.7957C82.6331 61.5923 82.601 61.3941 82.5742 61.2014C82.6064 61.3941 82.6331 61.5923 82.6599 61.7957ZM82.7831 62.8505C82.7563 62.5614 82.7241 62.2883 82.6866 62.0206C82.7188 62.2883 82.7509 62.5668 82.7831 62.8505ZM82.858 63.7608C82.8366 63.4877 82.8152 63.22 82.7938 62.963C82.8205 63.22 82.842 63.4877 82.858 63.7608ZM82.9276 64.821C82.9116 64.5532 82.9008 64.2962 82.8794 64.0392C82.8955 64.2909 82.9116 64.5532 82.9276 64.821ZM82.9758 66.0525C82.9651 65.6991 82.9544 65.3618 82.9383 65.0298C82.9544 65.3618 82.9651 65.7044 82.9758 66.0525ZM83.0025 67.1769C83.0025 66.8824 82.9919 66.5933 82.9812 66.3148C82.9865 66.5986 82.9972 66.8824 83.0025 67.1769ZM83.0133 68.6547C83.0133 68.2585 83.0133 67.8676 83.0079 67.4928C83.0079 67.873 83.0133 68.2585 83.0133 68.6547ZM64.9047 79.7918C64.9047 79.6473 64.8994 79.5027 64.894 79.3581C64.894 79.5027 64.8994 79.6473 64.9047 79.7918ZM64.9529 81.2375C64.9475 81.0876 64.9422 80.9323 64.9368 80.7771C64.9422 80.9323 64.9475 81.0823 64.9529 81.2375ZM65.0279 82.5654C65.0225 82.4583 65.0172 82.3459 65.0065 82.2388C65.0118 82.3459 65.0172 82.4583 65.0279 82.5654ZM45.4308 86.4634L47.4387 85.4407V82.2763L45.4308 86.4634ZM76.3899 86.9293C76.5452 86.8596 76.7004 86.79 76.8664 86.7044C76.7058 86.79 76.5452 86.8596 76.3899 86.9293ZM75.9294 87.1113C76.0311 87.0738 76.1382 87.0363 76.2453 86.9882C76.1382 87.031 76.0311 87.0738 75.9294 87.1113ZM73.7395 87.2344C73.6645 87.2077 73.5949 87.1756 73.5199 87.1434C73.5895 87.1756 73.6645 87.2077 73.7395 87.2344ZM74.0822 87.3255C74.0019 87.3094 73.9269 87.2934 73.8465 87.2719C73.9215 87.2934 74.0019 87.3148 74.0822 87.3255ZM75.0245 87.3362C75.1263 87.3201 75.2333 87.3041 75.3404 87.2773C75.2333 87.2987 75.1263 87.3201 75.0245 87.3362ZM74.9228 87.3522C74.805 87.363 74.6872 87.3737 74.5747 87.3737C74.5747 87.3737 74.5641 87.3737 74.5587 87.3737C74.5641 87.3737 74.5694 87.3737 74.5747 87.3737C74.6872 87.3737 74.805 87.3683 74.9228 87.3522ZM66.2754 89.6921C66.2379 89.5904 66.2058 89.4833 66.1737 89.3816C66.2058 89.4887 66.2433 89.5904 66.2754 89.6921ZM66.586 90.4953C66.5539 90.4203 66.5217 90.34 66.495 90.2597C66.5271 90.34 66.5539 90.4203 66.586 90.4953ZM67.432 92.0748C67.3838 91.9999 67.3356 91.9303 67.2874 91.8553C67.3356 91.9303 67.3838 92.0052 67.432 92.0748ZM68.3101 93.1296C68.3101 93.1296 68.278 93.0975 68.2673 93.0815C68.2834 93.0975 68.2994 93.1136 68.3101 93.1296ZM68.9633 93.6437C68.9098 93.6062 68.8509 93.5741 68.7974 93.5312C68.8509 93.5687 68.9044 93.6062 68.9633 93.6437ZM108.222 29.4873C108.056 29.4873 107.89 29.5248 107.735 29.6051L101.764 32.6464C101.556 32.7535 101.384 32.9248 101.282 33.139L89.4493 57.8817C88.7585 52.961 87.27 50.0107 84.8606 48.7364C84.8338 48.7203 84.8016 48.7042 84.7749 48.6882L80.0041 46.2573C79.1688 45.8289 78.2264 45.6147 77.2038 45.6147C75.5707 45.6147 73.7395 46.1448 71.5977 47.2318C62.9075 51.6599 59.0309 60.3661 59.0309 75.4655C59.0309 77.2699 59.0898 78.9405 59.2023 80.4611L58.9667 80.3433V61.0675C58.9667 60.6659 58.7418 60.2965 58.3831 60.1144L53.6123 57.6835C53.457 57.6032 53.291 57.5658 53.1251 57.5658C52.9591 57.5658 52.7931 57.6032 52.6378 57.6835L46.6677 60.7248C46.4588 60.8319 46.2875 61.0033 46.1857 61.2174L31.172 92.6103C31.1024 92.7548 31.0649 92.9101 31.0649 93.0707V99.3836C31.0649 99.7851 31.2898 100.155 31.6486 100.337L36.4193 102.768C36.5746 102.848 36.7406 102.885 36.9066 102.885C37.0726 102.885 37.2386 102.848 37.3938 102.768L46.3517 98.2003V102.318C46.3517 102.719 46.5766 103.089 46.9354 103.271L51.7061 105.702C51.8614 105.782 52.0274 105.82 52.1934 105.82C52.3594 105.82 52.5254 105.782 52.6806 105.702L58.3724 102.8C58.7311 102.618 58.956 102.248 58.956 101.847V91.775L61.8045 90.3239C62.4685 91.2824 63.2556 91.9945 64.1658 92.4603L68.9366 94.8912C69.7772 95.3142 70.725 95.5338 71.753 95.5338C73.3808 95.5338 75.2066 95.009 77.3323 93.9274C84.384 90.3346 88.266 83.8719 89.4707 73.6611L91.5053 74.6998C91.6606 74.7801 91.8266 74.8176 91.9926 74.8176C92.1586 74.8176 92.3246 74.7801 92.4799 74.6998L101.438 70.1325V74.25C101.438 74.6516 101.663 75.0211 102.021 75.2031L106.792 77.634C106.947 77.7143 107.113 77.7518 107.279 77.7518C107.445 77.7518 107.611 77.7143 107.767 77.634L113.458 74.7319C113.817 74.5499 114.042 74.1804 114.042 73.7789V63.7072L117.362 62.0153C117.72 61.8332 117.945 61.4638 117.945 61.0622V54.9153C117.945 54.5137 117.72 54.1443 117.362 53.9622L114.042 52.2703V32.9944C114.042 32.5929 113.817 32.2234 113.458 32.0413L108.688 29.6105C108.532 29.5301 108.366 29.4927 108.2 29.4927L108.222 29.4873ZM72.342 82.8974C71.9672 81.0341 71.7851 78.4051 71.7851 74.9247C71.7851 65.3136 73.1558 60.5 76.6201 58.2511C76.9949 60.1144 77.177 62.7435 77.177 66.2238C77.177 75.8349 75.8063 80.6485 72.342 82.8974Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M107.301 65.9453V76.6701L102.53 74.2393V63.5144L107.301 65.9453Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M116.896 54.9099L112.993 56.9018L108.222 54.4709L112.125 52.4844L116.896 54.9099Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M97.4326 64.8317L107.301 59.8039L102.53 57.373L92.6619 62.4008L97.4326 64.8317Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M107.301 59.8038V44.2707L102.53 41.8398V57.3729L107.301 59.8038Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M112.992 32.989L107.028 36.0303L102.257 33.5994L108.222 30.5581L112.992 32.989Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M107.028 36.0303L92.014 67.4231L87.2432 64.9922L102.257 33.5994L107.028 36.0303Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M92.014 67.4231V73.7359L87.2432 71.305V64.9922L92.014 67.4231Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M112.993 32.989V56.9017L116.896 54.9153V61.0621L112.993 63.0486V73.7734L107.301 76.6755V65.9507L92.014 73.7413V67.4285L107.028 36.0357L112.998 32.9944L112.993 32.989ZM107.301 59.8038V44.2707L97.4327 64.8316L107.301 59.8038Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M73.445 87.1166C74.3231 87.5663 75.4475 87.4271 76.8611 86.7096C81.498 84.3483 83.0133 78.8815 83.0133 68.6599C83.0133 61.5279 82.2851 57.48 80.2879 56.4626L75.5171 54.0317C77.5143 55.0491 78.2426 59.0916 78.2426 66.229C78.2426 76.4506 76.7272 81.9174 72.0903 84.2787C70.6767 85.0016 69.5524 85.1354 68.6743 84.6856L73.445 87.1166Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M84.2983 49.6411C82.4778 48.7148 80.0362 49.0039 76.8664 50.6209C68.0049 55.1347 64.8833 64.1568 64.8833 77.9016C64.8833 86.6935 66.1684 92.2728 69.4399 93.938L64.6691 91.5071C61.3976 89.8419 60.1125 84.2626 60.1125 75.4707C60.1125 61.7259 63.2341 52.7091 72.0957 48.19C75.2708 46.573 77.7071 46.2839 79.5276 47.2102L84.2983 49.6411Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M76.8664 50.6155C85.728 46.1018 88.8496 51.938 88.8496 65.6828C88.8496 79.4275 85.728 88.4443 76.8664 92.9634C68.0049 97.4772 64.8833 91.582 64.8833 77.8962C64.8833 64.2103 68.0049 55.1346 76.8664 50.6155ZM70.7142 74.9245C70.7142 85.146 72.2295 89.0708 76.8664 86.7041C81.5033 84.3428 83.0186 78.876 83.0186 68.6545C83.0186 58.4329 81.5033 54.5082 76.8664 56.8748C72.2295 59.2361 70.7142 64.644 70.7142 74.9245Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M52.2094 94.0183V104.743L47.4387 102.312V91.5874L52.2094 94.0183Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M61.8045 82.9829L57.9012 84.9694L53.1304 82.5385L57.0338 80.552L61.8045 82.9829Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M42.3413 92.8993L52.2094 87.8716L47.4387 85.4407L37.5705 90.4685L42.3413 92.8993Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M52.2094 87.8715V72.3437L47.4387 69.9128V85.4406L52.2094 87.8715Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M57.9011 61.062L51.9363 64.1033L47.1656 61.6724L53.1304 58.6311L57.9011 61.062Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M51.9364 64.1033L36.9226 95.4961L32.1519 93.0652L47.1656 61.6724L51.9364 64.1033Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M36.9226 95.4961V101.809L32.1519 99.378V93.0652L36.9226 95.4961Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M57.9012 61.062V84.9747L61.8045 82.9883V89.1351L57.9012 91.1216V101.846L52.2095 104.749V94.0237L36.9227 101.814V95.5015L51.9364 64.1087L57.9065 61.0674L57.9012 61.062ZM52.2095 87.8715V72.3384L42.3413 92.8992L52.2095 87.8715Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+      <path
+        d="M134.105 24.1008C133.843 23.9669 133.586 23.7527 133.355 23.4743C132.632 22.6015 132.386 21.3486 132.804 20.6847L136.825 14.1684C136.959 13.9488 137.157 13.8096 137.393 13.7668C137.741 13.7025 138.153 13.8525 138.538 14.1791C138.929 14.5057 139.25 14.9822 139.449 15.507L143.47 26.1247C143.604 26.4674 143.673 26.8208 143.673 27.1421C143.673 28.154 142.999 28.6359 142.163 28.2129L134.116 24.1115C134.116 24.1115 134.105 24.1115 134.105 24.1061V24.1008ZM138.137 15.1268C138.051 15.084 137.965 15.0679 137.89 15.0786C137.81 15.0947 137.746 15.1375 137.703 15.2125L133.677 21.7341C133.537 21.959 133.618 22.3766 133.859 22.6658C133.934 22.7622 134.03 22.8371 134.116 22.88L142.169 26.9814C142.447 27.1206 142.672 26.96 142.672 26.6227C142.672 26.5156 142.651 26.3978 142.602 26.2854L138.576 15.6622C138.506 15.4855 138.399 15.3249 138.271 15.2178C138.228 15.1803 138.18 15.1482 138.137 15.1268Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M138.142 21.263C137.864 21.1237 137.639 20.7329 137.639 20.3955V17.9486C137.639 17.6113 137.864 17.4506 138.142 17.5952C138.421 17.7398 138.645 18.1253 138.645 18.4626V20.9096C138.645 21.2469 138.421 21.4075 138.142 21.263Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M138.147 23.7153C137.869 23.576 137.644 23.1852 137.644 22.8478C137.644 22.5105 137.869 22.3499 138.142 22.4891C138.421 22.6337 138.645 23.0245 138.645 23.3619C138.645 23.6992 138.421 23.8598 138.142 23.7153H138.147Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M17.1274 48.2278C15.9602 47.6334 14.4609 47.6816 12.8171 48.5223C9.10654 50.4124 6.10273 55.6061 6.10273 60.1145C6.10273 62.6311 7.03975 64.4087 8.51221 65.1584L6.12414 63.9429C4.65168 63.1933 3.71466 61.4156 3.71466 58.8991C3.71466 54.3853 6.72385 49.1916 10.4291 47.3068C12.0675 46.4715 13.5721 46.418 14.7394 47.0123L17.1274 48.2278Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M17.1275 48.2276C18.5999 48.9773 19.5369 50.7549 19.5369 53.2715C19.5369 57.7852 16.5278 62.979 12.8225 64.8637C11.1841 65.699 9.67952 65.7526 8.51226 65.1582C7.0398 64.4086 6.10278 62.631 6.10278 60.1144C6.10278 55.6006 9.11194 50.4069 12.8172 48.5221C14.4556 47.6869 15.9602 47.6333 17.1275 48.2276Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M15.4943 59.0437C15.3979 59.0919 15.3016 59.0972 15.2266 59.0437L9.87221 55.2582C9.72228 55.1511 9.72228 54.8619 9.87221 54.6049C10.0221 54.3479 10.2577 54.2301 10.4076 54.3318L15.762 58.1174C15.912 58.2245 15.912 58.5136 15.762 58.7706C15.6871 58.8991 15.5907 58.9902 15.4943 59.0437Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M12.8171 61.7583C10.5201 62.931 8.65143 61.6084 8.65143 58.8134C8.65143 56.0184 10.5201 52.7951 12.8171 51.6225C15.1142 50.4499 16.9829 51.7724 16.9829 54.5674C16.9829 57.3624 15.1142 60.5857 12.8171 61.7583ZM12.8171 52.5434C10.9377 53.5019 9.41174 56.1416 9.41174 58.4279C9.41174 60.7142 10.9431 61.7958 12.8171 60.8374C14.6912 59.8789 16.2225 57.2392 16.2225 54.9529C16.2225 52.6666 14.6912 51.585 12.8171 52.5434Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M52.2095 105.279C52.1238 105.279 52.0435 105.257 51.9685 105.22L47.1978 102.789C47.0211 102.698 46.9033 102.516 46.9033 102.312V97.3221L37.1636 102.286C37.0887 102.323 37.003 102.345 36.9227 102.345C36.8424 102.345 36.7567 102.323 36.6817 102.286L31.911 99.8547C31.7343 99.7637 31.6165 99.5816 31.6165 99.3782V93.0653C31.6165 92.985 31.6325 92.9047 31.67 92.8351L46.6837 61.4423C46.7319 61.3352 46.8176 61.2495 46.9247 61.196L52.8948 58.1547C52.9698 58.1172 53.0555 58.0958 53.1358 58.0958C53.2161 58.0958 53.3018 58.1172 53.3767 58.1547L58.1475 60.5856C58.3242 60.6766 58.442 60.8587 58.442 61.0621V80.6699L59.8288 81.3767C59.6628 79.6258 59.5825 77.6447 59.5825 75.4708C59.5825 60.6017 63.368 52.04 71.8547 47.7136C73.9162 46.6642 75.6724 46.1501 77.2145 46.1501C78.1515 46.1501 79.0136 46.3483 79.7739 46.7338L84.5446 49.1647C87.1201 50.4765 88.598 53.8765 89.1441 59.7878L101.775 33.3692C101.823 33.2621 101.909 33.1764 102.016 33.1229L107.986 30.0816C108.061 30.0441 108.147 30.0227 108.227 30.0227C108.307 30.0227 108.393 30.0441 108.468 30.0816L113.239 32.5125C113.416 32.6035 113.533 32.7856 113.533 32.989V52.5968L117.142 54.4387C117.319 54.5298 117.437 54.7118 117.437 54.9153V61.0621C117.437 61.2656 117.324 61.4476 117.142 61.5387L113.533 63.3806V73.7788C113.533 73.9823 113.421 74.1643 113.239 74.2554L107.547 77.1574C107.472 77.1949 107.386 77.2163 107.306 77.2163C107.226 77.2163 107.14 77.1949 107.065 77.1574L102.294 74.7265C102.118 74.6355 102 74.4535 102 74.25V69.2597L92.2603 74.2232C92.1854 74.2607 92.0997 74.2821 92.0194 74.2821C91.9391 74.2821 91.8534 74.2607 91.7784 74.2232L89.0531 72.8364C87.9715 83.2989 84.1645 89.8634 77.1181 93.4509C75.0727 94.495 73.3272 95.0036 71.7798 95.0036C70.8695 95.0036 70.0342 94.8216 69.29 94.4575C69.2632 94.4468 69.2311 94.4361 69.2043 94.4254L64.4336 91.9945C63.4912 91.5126 62.6827 90.7255 62.0187 89.6439L58.4474 91.4644V101.863C58.4474 102.066 58.3349 102.248 58.1528 102.339L52.4611 105.241C52.3862 105.279 52.3005 105.3 52.2202 105.3L52.2095 105.279ZM46.5981 85.2693L46.9033 85.1141V84.6322L46.5981 85.2693ZM76.9789 57.4158C72.856 59.6004 71.2443 64.5318 71.2443 74.9247C71.2443 78.903 71.4853 81.7997 71.9779 83.7326C76.0954 81.548 77.7071 76.6166 77.7071 66.2291C77.7071 62.1866 77.4768 59.3594 76.9789 57.4211V57.4158ZM101.689 57.1963L101.995 57.041V56.5591L101.689 57.1963Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M108.222 30.5582L112.993 32.9891V52.9235L116.896 54.91V61.0568L112.993 63.0433V73.7682L107.301 76.6702L102.53 74.2393V68.3763L92.014 73.736L88.5872 71.9905C87.6823 82.2013 84.2876 89.1835 76.8664 92.9637C74.8907 93.9703 73.204 94.4575 71.7744 94.4575C70.8641 94.4575 70.0557 94.2594 69.3435 93.8739C69.3757 93.89 69.4078 93.9167 69.4399 93.9328L64.6691 91.5019C63.4537 90.8808 62.5113 89.7189 61.8045 88.0483V89.1299L57.9012 91.1164V101.841L52.2094 104.743L47.4387 102.312V96.4494L36.9227 101.809L32.1519 99.3782V93.0654L47.1656 61.6726L53.1357 58.6313L57.9065 61.0622V80.9966L60.4606 82.2977C60.225 80.3005 60.1125 78.0249 60.1125 75.4655C60.1125 61.7208 63.2341 52.704 72.0956 48.1849C74.0821 47.1729 75.7741 46.6803 77.2145 46.6803C78.0765 46.6803 78.8475 46.857 79.5275 47.205L84.2983 49.6359C84.2501 49.6091 84.1966 49.5877 84.143 49.5663C87.0076 50.8942 88.3945 55.1241 88.7479 61.8386L102.252 33.5995L108.222 30.5582ZM81.9799 49.1165C81.9799 49.1165 81.9477 49.1165 81.9317 49.1165C81.9317 49.1165 81.9264 49.1165 81.921 49.1165C81.921 49.1165 81.9263 49.1165 81.9317 49.1165C81.9477 49.1165 81.9638 49.1165 81.9799 49.1165C82.1191 49.1165 82.2583 49.1165 82.3922 49.1326C82.3922 49.1326 82.4029 49.1326 82.4082 49.1326C82.4082 49.1326 82.4243 49.1326 82.435 49.1326C82.4243 49.1326 82.4189 49.1326 82.4082 49.1326C82.4082 49.1326 82.3975 49.1326 82.3922 49.1326C82.2583 49.1219 82.1191 49.1165 81.9799 49.1165ZM81.348 49.1486C81.498 49.1326 81.6479 49.1272 81.7925 49.1219C81.6479 49.1219 81.498 49.1326 81.348 49.1486ZM82.9597 49.2022C82.8259 49.1808 82.6866 49.1594 82.5474 49.1486C82.6866 49.1647 82.8259 49.1808 82.9597 49.2022ZM83.538 49.336C83.3934 49.2932 83.2489 49.2557 83.0989 49.2236C83.2489 49.2557 83.3934 49.2879 83.538 49.336ZM84.0252 49.5127C83.8807 49.4485 83.7308 49.3896 83.5755 49.3468C83.7308 49.3949 83.8807 49.4538 84.0252 49.5127ZM79.3081 49.5877C79.4848 49.5288 79.6561 49.4806 79.8221 49.4324C79.6507 49.4806 79.4794 49.5288 79.3081 49.5877ZM78.5049 49.8768C78.7298 49.7858 78.9493 49.7055 79.1688 49.6359C78.9547 49.7109 78.7298 49.7912 78.5049 49.8768ZM100.522 58.3957L102.53 57.373V54.2085L100.522 58.3957ZM80.3147 56.4735C80.4218 56.5324 80.5288 56.5966 80.6306 56.6716C80.5288 56.5966 80.4218 56.527 80.3147 56.4735ZM71.6405 84.4876C71.7905 84.4234 71.9404 84.3538 72.0903 84.2735C76.7272 81.9122 78.2425 76.4453 78.2425 66.2238C78.2425 61.9028 77.9748 58.7276 77.3162 56.6555C77.1663 56.7198 77.0163 56.7894 76.8611 56.8697C72.2242 59.231 70.7089 64.6389 70.7089 74.9193C70.7089 79.2296 70.9819 82.4101 71.6352 84.4823M81.5301 57.7478C81.4498 57.6086 81.3695 57.4801 81.2838 57.3569C81.3695 57.4747 81.4498 57.6086 81.5301 57.7478ZM81.7657 58.219C81.7122 58.0958 81.6532 57.9834 81.5943 57.8709C81.6532 57.9834 81.7068 58.0958 81.7657 58.219ZM81.8246 58.3528C81.8942 58.5135 81.9585 58.6848 82.0173 58.8615C81.9585 58.6848 81.8889 58.5135 81.8246 58.3528ZM82.3815 60.1733C82.3386 59.9859 82.2958 59.8092 82.253 59.6379C82.2958 59.8092 82.3386 59.9913 82.3815 60.1733ZM82.6599 61.7957C82.6331 61.5923 82.601 61.3941 82.5742 61.2014C82.6064 61.3941 82.6331 61.5923 82.6599 61.7957ZM82.7831 62.8505C82.7563 62.5614 82.7241 62.2883 82.6866 62.0206C82.7188 62.2883 82.7509 62.5668 82.7831 62.8505ZM82.858 63.7608C82.8366 63.4877 82.8152 63.22 82.7938 62.963C82.8205 63.22 82.842 63.4877 82.858 63.7608ZM82.9276 64.821C82.9116 64.5532 82.9008 64.2962 82.8794 64.0392C82.8955 64.2909 82.9116 64.5532 82.9276 64.821ZM82.9758 66.0525C82.9651 65.6991 82.9544 65.3618 82.9383 65.0298C82.9544 65.3618 82.9651 65.7044 82.9758 66.0525ZM83.0025 67.1769C83.0025 66.8824 82.9919 66.5933 82.9812 66.3148C82.9865 66.5986 82.9972 66.8824 83.0025 67.1769ZM83.0133 68.6547C83.0133 68.2585 83.0133 67.8676 83.0079 67.4928C83.0079 67.873 83.0133 68.2585 83.0133 68.6547ZM64.9047 79.7918C64.9047 79.6473 64.8994 79.5027 64.894 79.3581C64.894 79.5027 64.8994 79.6473 64.9047 79.7918ZM64.9529 81.2375C64.9475 81.0876 64.9422 80.9323 64.9368 80.7771C64.9422 80.9323 64.9475 81.0823 64.9529 81.2375ZM65.0279 82.5654C65.0225 82.4583 65.0172 82.3459 65.0065 82.2388C65.0118 82.3459 65.0172 82.4583 65.0279 82.5654ZM45.4308 86.4634L47.4387 85.4407V82.2763L45.4308 86.4634ZM76.3899 86.9293C76.5452 86.8596 76.7004 86.79 76.8664 86.7044C76.7058 86.79 76.5452 86.8596 76.3899 86.9293ZM75.9294 87.1113C76.0311 87.0738 76.1382 87.0363 76.2453 86.9882C76.1382 87.031 76.0311 87.0738 75.9294 87.1113ZM73.7395 87.2344C73.6645 87.2077 73.5949 87.1756 73.5199 87.1434C73.5895 87.1756 73.6645 87.2077 73.7395 87.2344ZM74.0822 87.3255C74.0019 87.3094 73.9269 87.2934 73.8465 87.2719C73.9215 87.2934 74.0019 87.3148 74.0822 87.3255ZM75.0245 87.3362C75.1263 87.3201 75.2333 87.3041 75.3404 87.2773C75.2333 87.2987 75.1263 87.3201 75.0245 87.3362ZM74.9228 87.3522C74.805 87.363 74.6872 87.3737 74.5747 87.3737C74.5747 87.3737 74.5641 87.3737 74.5587 87.3737C74.5641 87.3737 74.5694 87.3737 74.5747 87.3737C74.6872 87.3737 74.805 87.3683 74.9228 87.3522ZM66.2754 89.6921C66.2379 89.5904 66.2058 89.4833 66.1737 89.3816C66.2058 89.4887 66.2433 89.5904 66.2754 89.6921ZM66.586 90.4953C66.5539 90.4203 66.5217 90.34 66.495 90.2597C66.5271 90.34 66.5539 90.4203 66.586 90.4953ZM67.432 92.0748C67.3838 91.9999 67.3356 91.9303 67.2874 91.8553C67.3356 91.9303 67.3838 92.0052 67.432 92.0748ZM68.3101 93.1296C68.3101 93.1296 68.278 93.0975 68.2673 93.0815C68.2834 93.0975 68.2994 93.1136 68.3101 93.1296ZM68.9633 93.6437C68.9098 93.6062 68.8509 93.5741 68.7974 93.5312C68.8509 93.5687 68.9044 93.6062 68.9633 93.6437ZM108.222 29.4873C108.056 29.4873 107.89 29.5248 107.735 29.6051L101.764 32.6464C101.556 32.7535 101.384 32.9248 101.282 33.139L89.4493 57.8817C88.7585 52.961 87.27 50.0107 84.8606 48.7364C84.8338 48.7203 84.8016 48.7042 84.7749 48.6882L80.0041 46.2573C79.1688 45.8289 78.2264 45.6147 77.2038 45.6147C75.5707 45.6147 73.7395 46.1448 71.5977 47.2318C62.9075 51.6599 59.0309 60.3661 59.0309 75.4655C59.0309 77.2699 59.0898 78.9405 59.2023 80.4611L58.9667 80.3433V61.0675C58.9667 60.6659 58.7418 60.2965 58.3831 60.1144L53.6123 57.6835C53.457 57.6032 53.291 57.5658 53.1251 57.5658C52.9591 57.5658 52.7931 57.6032 52.6378 57.6835L46.6677 60.7248C46.4588 60.8319 46.2875 61.0033 46.1857 61.2174L31.172 92.6103C31.1024 92.7548 31.0649 92.9101 31.0649 93.0707V99.3836C31.0649 99.7851 31.2898 100.155 31.6486 100.337L36.4193 102.768C36.5746 102.848 36.7406 102.885 36.9066 102.885C37.0726 102.885 37.2386 102.848 37.3938 102.768L46.3517 98.2003V102.318C46.3517 102.719 46.5766 103.089 46.9354 103.271L51.7061 105.702C51.8614 105.782 52.0274 105.82 52.1934 105.82C52.3594 105.82 52.5254 105.782 52.6806 105.702L58.3724 102.8C58.7311 102.618 58.956 102.248 58.956 101.847V91.775L61.8045 90.3239C62.4685 91.2824 63.2556 91.9945 64.1658 92.4603L68.9366 94.8912C69.7772 95.3142 70.725 95.5338 71.753 95.5338C73.3808 95.5338 75.2066 95.009 77.3323 93.9274C84.384 90.3346 88.266 83.8719 89.4707 73.6611L91.5053 74.6998C91.6606 74.7801 91.8266 74.8176 91.9926 74.8176C92.1586 74.8176 92.3246 74.7801 92.4799 74.6998L101.438 70.1325V74.25C101.438 74.6516 101.663 75.0211 102.021 75.2031L106.792 77.634C106.947 77.7143 107.113 77.7518 107.279 77.7518C107.445 77.7518 107.611 77.7143 107.767 77.634L113.458 74.7319C113.817 74.5499 114.042 74.1804 114.042 73.7789V63.7072L117.362 62.0153C117.72 61.8332 117.945 61.4638 117.945 61.0622V54.9153C117.945 54.5137 117.72 54.1443 117.362 53.9622L114.042 52.2703V32.9944C114.042 32.5929 113.817 32.2234 113.458 32.0413L108.688 29.6105C108.532 29.5301 108.366 29.4927 108.2 29.4927L108.222 29.4873ZM72.342 82.8974C71.9672 81.0341 71.7851 78.4051 71.7851 74.9247C71.7851 65.3136 73.1558 60.5 76.6201 58.2511C76.9949 60.1144 77.177 62.7435 77.177 66.2238C77.177 75.8349 75.8063 80.6485 72.342 82.8974Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M107.301 65.9453V76.6701L102.53 74.2393V63.5144L107.301 65.9453Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M116.896 54.9099L112.993 56.9018L108.222 54.4709L112.125 52.4844L116.896 54.9099Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M97.4326 64.8317L107.301 59.8039L102.53 57.373L92.6619 62.4008L97.4326 64.8317Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M107.301 59.8038V44.2707L102.53 41.8398V57.3729L107.301 59.8038Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M112.992 32.989L107.028 36.0303L102.257 33.5994L108.222 30.5581L112.992 32.989Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M107.028 36.0303L92.014 67.4231L87.2432 64.9922L102.257 33.5994L107.028 36.0303Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M92.014 67.4231V73.7359L87.2432 71.305V64.9922L92.014 67.4231Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M112.993 32.989V56.9017L116.896 54.9153V61.0621L112.993 63.0486V73.7734L107.301 76.6755V65.9507L92.014 73.7413V67.4285L107.028 36.0357L112.998 32.9944L112.993 32.989ZM107.301 59.8038V44.2707L97.4327 64.8316L107.301 59.8038Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M73.445 87.1166C74.3231 87.5663 75.4475 87.4271 76.8611 86.7096C81.498 84.3483 83.0133 78.8815 83.0133 68.6599C83.0133 61.5279 82.2851 57.48 80.2879 56.4626L75.5171 54.0317C77.5143 55.0491 78.2426 59.0916 78.2426 66.229C78.2426 76.4506 76.7272 81.9174 72.0903 84.2787C70.6767 85.0016 69.5524 85.1354 68.6743 84.6856L73.445 87.1166Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M84.2983 49.6411C82.4778 48.7148 80.0362 49.0039 76.8664 50.6209C68.0049 55.1347 64.8833 64.1568 64.8833 77.9016C64.8833 86.6935 66.1684 92.2728 69.4399 93.938L64.6691 91.5071C61.3976 89.8419 60.1125 84.2626 60.1125 75.4707C60.1125 61.7259 63.2341 52.7091 72.0957 48.19C75.2708 46.573 77.7071 46.2839 79.5276 47.2102L84.2983 49.6411Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M76.8664 50.6155C85.728 46.1018 88.8496 51.938 88.8496 65.6828C88.8496 79.4275 85.728 88.4443 76.8664 92.9634C68.0049 97.4772 64.8833 91.582 64.8833 77.8962C64.8833 64.2103 68.0049 55.1346 76.8664 50.6155ZM70.7142 74.9245C70.7142 85.146 72.2295 89.0708 76.8664 86.7041C81.5033 84.3428 83.0186 78.876 83.0186 68.6545C83.0186 58.4329 81.5033 54.5082 76.8664 56.8748C72.2295 59.2361 70.7142 64.644 70.7142 74.9245Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M52.2094 94.0183V104.743L47.4387 102.312V91.5874L52.2094 94.0183Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M61.8045 82.9829L57.9012 84.9694L53.1304 82.5385L57.0338 80.552L61.8045 82.9829Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M42.3413 92.8993L52.2094 87.8716L47.4387 85.4407L37.5705 90.4685L42.3413 92.8993Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M52.2094 87.8715V72.3437L47.4387 69.9128V85.4406L52.2094 87.8715Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M57.9011 61.062L51.9363 64.1033L47.1656 61.6724L53.1304 58.6311L57.9011 61.062Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M51.9364 64.1033L36.9226 95.4961L32.1519 93.0652L47.1656 61.6724L51.9364 64.1033Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M36.9226 95.4961V101.809L32.1519 99.378V93.0652L36.9226 95.4961Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M57.9012 61.062V84.9747L61.8045 82.9883V89.1351L57.9012 91.1216V101.846L52.2095 104.749V94.0237L36.9227 101.814V95.5015L51.9364 64.1087L57.9065 61.0674L57.9012 61.062ZM52.2095 87.8715V72.3384L42.3413 92.8992L52.2095 87.8715Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx b/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx
index 9d3736fc0..c5a5fceab 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="175"
-    viewBox="0 0 162 175"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function ArchivedCycleVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="175"
+      viewBox="0 0 162 175"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M1 139.94C1 141.957 2.50994 143.968 5.52448 145.51L44.34 165.289C50.3744 168.362 60.1543 168.362 66.1888 165.289L147.752 123.731C150.767 122.194 152.277 120.183 152.277 118.166V124.606C152.277 126.623 150.767 128.634 147.752 130.171L66.1888 171.729C60.1543 174.802 50.3744 174.802 44.34 171.729L5.52448 151.95C2.5046 150.414 1 148.397 1 146.38V139.94Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 139.94C1 137.923 2.50994 135.911 5.52448 134.375L87.0878 92.8166C93.1222 89.7434 102.902 89.7434 108.937 92.8166L147.752 112.595C150.772 114.132 152.277 116.149 152.277 118.165C152.277 120.182 150.767 122.194 147.752 123.73L66.1888 165.288C60.1543 168.362 50.3744 168.362 44.34 165.288L5.52448 145.51C2.5046 143.973 1 141.956 1 139.94Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M1 119.596C1 121.613 2.50994 123.625 5.52448 125.167L44.34 144.945C50.3744 148.018 60.1543 148.018 66.1888 144.945L147.752 103.387C150.767 101.851 152.277 99.8391 152.277 97.8223V104.262C152.277 106.279 150.767 108.29 147.752 109.827L66.1888 151.385C60.1543 154.458 50.3744 154.458 44.34 151.385L5.52448 131.601C2.5046 130.065 1 128.048 1 126.031V119.591V119.596Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 119.596C1 117.579 2.50994 115.567 5.52448 114.031L87.0878 72.4729C93.1222 69.3997 102.902 69.3997 108.937 72.4729L147.752 92.2515C150.772 93.7881 152.277 95.8049 152.277 97.8217C152.277 99.8385 150.767 101.85 147.752 103.387L66.1888 144.945C60.1543 148.018 50.3744 148.018 44.34 144.945L5.52448 125.161C2.5046 123.624 1 121.607 1 119.59V119.596Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M1 139.94C1 141.957 2.50994 143.968 5.52448 145.51L44.34 165.289C50.3744 168.362 60.1543 168.362 66.1888 165.289L147.752 123.731C150.767 122.194 152.277 120.183 152.277 118.166V124.606C152.277 126.623 150.767 128.634 147.752 130.171L66.1888 171.729C60.1543 174.802 50.3744 174.802 44.34 171.729L5.52448 151.95C2.5046 150.414 1 148.397 1 146.38V139.94Z"
+        d="M1 99.2467C1 101.264 2.50994 103.275 5.52448 104.817L44.34 124.596C50.3744 127.669 60.1543 127.669 66.1888 124.596L147.752 83.0376C150.767 81.5009 152.277 79.4895 152.277 77.4727V83.9126C152.277 85.9294 150.767 87.9408 147.752 89.4775L66.1888 131.035C60.1543 134.109 50.3744 134.109 44.34 131.035L5.52448 111.257C2.5046 109.72 1 107.703 1 105.687V99.2467Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -20,17 +56,121 @@ export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrat
         strokeLinejoin="round"
       />
       <path
-        d="M1 139.94C1 137.923 2.50994 135.911 5.52448 134.375L87.0878 92.8166C93.1222 89.7434 102.902 89.7434 108.937 92.8166L147.752 112.595C150.772 114.132 152.277 116.149 152.277 118.165C152.277 120.182 150.767 122.194 147.752 123.73L66.1888 165.288C60.1543 168.362 50.3744 168.362 44.34 165.288L5.52448 145.51C2.5046 143.973 1 141.956 1 139.94Z"
+        d="M1 99.2461C1 97.2293 2.50994 95.2179 5.52448 93.6813L87.0878 52.1233C93.1222 49.0501 102.902 49.0501 108.937 52.1233L147.752 71.9019C150.772 73.4385 152.277 75.4553 152.277 77.4721C152.277 79.4889 150.767 81.5004 147.752 83.037L66.1888 124.595C60.1543 127.668 50.3744 127.668 44.34 124.595L5.52448 104.816C2.5046 103.28 1 101.263 1 99.2461Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M1 119.596C1 121.613 2.50994 123.625 5.52448 125.167L44.34 144.945C50.3744 148.018 60.1543 148.018 66.1888 144.945L147.752 103.387C150.767 101.851 152.277 99.8391 152.277 97.8223V104.262C152.277 106.279 150.767 108.29 147.752 109.827L66.1888 151.385C60.1543 154.458 50.3744 154.458 44.34 151.385L5.52448 131.601C2.5046 130.065 1 128.048 1 126.031V119.591V119.596Z"
+        d="M65.0365 96.1829C64.2682 96.1829 63.5586 96.0175 62.913 95.6867L58.1591 93.2644C56.4358 92.3894 55.3793 90.4046 55.2513 87.8168L53.9281 61.1288C53.9174 60.9208 54.0295 60.7233 54.2162 60.6273L56.7079 59.3575L51.97 56.9458C50.7375 56.3162 50.0332 54.8863 50.0332 53.0243V50.7887C50.0332 47.5234 52.2261 43.7512 54.9205 42.38L97.1881 20.8407C97.8764 20.4886 98.554 20.3125 99.2049 20.3125C99.7171 20.3125 100.192 20.4245 100.624 20.6433L105.378 23.0656C106.611 23.6952 107.315 25.1251 107.315 26.9925V29.2281C107.315 32.4934 105.122 36.2602 102.428 37.6368L99.6797 39.0347L103.132 40.7954C103.319 40.8914 103.431 41.0888 103.42 41.2969L102.097 69.3348C101.857 74.3501 98.5059 79.8883 94.4616 81.9425L68.1044 95.3719C67.048 95.9108 66.0129 96.1829 65.0259 96.1829H65.0365Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M99.2048 20.8464C99.6316 20.8464 100.032 20.9424 100.379 21.1185L105.132 23.5408C106.141 24.053 106.776 25.2695 106.776 26.9875V29.2231C106.776 32.307 104.716 35.8604 102.182 37.1569L98.5005 39.035L102.886 41.2706L101.563 69.3085C101.334 74.1531 98.1163 79.4885 94.2214 81.468L67.8642 94.8974C66.8612 95.4096 65.9061 95.6497 65.0311 95.6497C64.3428 95.6497 63.7132 95.5003 63.1477 95.2122L58.3938 92.7899C56.8945 92.0269 55.9021 90.2822 55.7794 87.7959L54.4562 61.1078L58.2711 59.1657C58.2284 59.1657 58.1804 59.1657 58.1377 59.1657C57.7108 59.1657 57.316 59.075 56.9639 58.8936L52.21 56.4713C51.2016 55.9591 50.5666 54.7426 50.5666 53.0246V50.789C50.5666 47.7051 52.6208 44.1517 55.1605 42.8552L97.4281 21.3159C98.0576 20.9958 98.6552 20.8464 99.1994 20.8464M99.2048 19.7793C98.4738 19.7793 97.7108 19.9767 96.9479 20.3662L54.6803 41.9055C51.7778 43.3834 49.5049 47.2836 49.5049 50.789V53.0246C49.5049 55.1001 50.3159 56.7007 51.7351 57.4264L55.5393 59.3631L53.9813 60.1581C53.6079 60.3502 53.3784 60.7397 53.3998 61.1612L54.723 87.8492C54.8564 90.629 56.0248 92.7792 57.9189 93.7449L62.6728 96.1672C63.3931 96.5353 64.1881 96.7221 65.0364 96.7221C66.1035 96.7221 67.224 96.4286 68.3551 95.8524L94.7123 82.423C98.9807 80.2568 102.385 74.6386 102.635 69.3618L103.959 41.3239C103.98 40.9024 103.751 40.5129 103.377 40.3209L100.859 39.035L102.673 38.112C105.575 36.634 107.848 32.7285 107.848 29.2284V26.9929C107.848 24.9174 107.037 23.3167 105.618 22.5911L100.864 20.1688C100.357 19.9127 99.797 19.7793 99.2048 19.7793Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M102.891 41.27L59.2153 63.5295L54.4614 61.1072L98.1376 38.8477L102.891 41.27Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M59.2153 63.5297L60.5385 90.2177C60.6612 92.7041 61.6536 94.4488 63.1529 95.2117L58.399 92.7894C56.8997 92.0265 55.9073 90.2818 55.7846 87.7954L54.4614 61.1074L59.2153 63.5297Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M102.891 41.2695L101.568 69.3074C101.339 74.152 98.1216 79.4875 94.2267 81.467L67.8695 94.8963C66.0821 95.8087 64.4334 95.8674 63.1529 95.2111C61.6536 94.4481 60.6612 92.7034 60.5385 90.2171L59.2153 63.5291L102.891 41.2695Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M105.138 23.5408C104.337 23.1353 103.313 23.1673 102.187 23.7382L59.9195 45.2775C57.3798 46.5687 55.3257 50.1221 55.3257 53.2113V55.4469C55.3257 57.1702 55.9659 58.3814 56.969 58.8936L52.2151 56.4713C51.2067 55.9591 50.5718 54.7426 50.5718 53.0246V50.789C50.5718 47.7051 52.6259 44.1517 55.1656 42.8552L97.4332 21.3159C98.5536 20.745 99.5834 20.7076 100.384 21.1185L105.138 23.5408Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M105.138 23.5403C106.146 24.0526 106.781 25.269 106.781 26.9871V29.2226C106.781 32.3065 104.721 35.8599 102.187 37.1565L59.9195 58.6957C58.7991 59.2666 57.7693 59.304 56.969 58.8932C55.9606 58.381 55.3257 57.1645 55.3257 55.4464V53.2109C55.3257 50.127 57.3798 46.5736 59.9195 45.277L102.187 23.7378C103.308 23.1669 104.337 23.1295 105.138 23.5403Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M86.0156 83.9164C85.7595 83.9164 85.5248 83.8631 85.306 83.751C85.2526 83.7243 85.2046 83.6977 85.1566 83.6603L80.4347 81.254C80.4347 81.254 80.392 81.2273 80.3707 81.2167L73.0184 76.0199C72.0474 75.4117 71.9246 73.731 72.7676 72.2104C73.3866 71.0793 74.3736 70.3483 75.286 70.3483C75.5421 70.3483 75.7822 70.407 76.0009 70.5191L79.6024 72.3545V59.3519C79.6024 57.9113 80.5361 56.3107 81.7312 55.7025C82.0514 55.5424 82.3715 55.457 82.6809 55.457C82.9371 55.457 83.1825 55.5157 83.4012 55.6278L88.1551 58.0501C88.7581 58.3595 89.1049 59.0318 89.1049 59.9015V63.0814C89.4303 62.9107 89.7665 62.8146 90.0866 62.8146C90.3427 62.8146 90.5774 62.868 90.7962 62.98L95.5501 65.4023C95.5875 65.4237 95.6248 65.445 95.6621 65.4664C96.6545 66.0906 96.7773 67.7713 95.9396 69.2919C95.9129 69.3453 95.8702 69.42 95.8275 69.484L88.4913 82.1504C87.8617 83.2442 86.9173 83.9218 86.021 83.9218L86.0156 83.9164Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M82.6754 55.9851C82.8515 55.9851 83.0115 56.0224 83.1556 56.0971L87.9095 58.5194C88.3097 58.7222 88.5658 59.2077 88.5658 59.896V64.1643C89.0406 63.6415 89.5955 63.3427 90.081 63.3427C90.2464 63.3427 90.4012 63.38 90.5452 63.4494L95.2991 65.8717C95.2991 65.8717 95.3471 65.8984 95.3738 65.9144C96.1154 66.3786 96.1581 67.7711 95.4645 69.0303C95.4378 69.0836 95.4058 69.137 95.3738 69.185L88.0215 81.8781C87.4773 82.8171 86.6823 83.3827 86.0154 83.3827C85.85 83.3827 85.6899 83.3453 85.5459 83.276C85.5032 83.2546 85.4658 83.2333 85.4285 83.2013L80.6746 80.779L73.3223 75.5822C72.5807 75.1181 72.538 73.7202 73.2316 72.4663C73.7705 71.4846 74.5922 70.8817 75.2858 70.8817C75.4565 70.8817 75.6166 70.919 75.7606 70.9937L80.1357 73.224V59.3517C80.1357 58.1192 80.9574 56.6947 81.9711 56.1771C82.2219 56.0491 82.4566 55.9904 82.6754 55.9904M82.6754 54.918C82.2806 54.918 81.8857 55.0193 81.4909 55.2168C80.109 55.921 79.0686 57.6977 79.0686 59.3464V71.4793L76.2462 70.0387C75.9527 69.8893 75.6272 69.8146 75.2858 69.8146C74.1653 69.8146 73.0182 70.6363 72.2979 71.9541C71.3108 73.7362 71.4976 75.6676 72.7301 76.4679L80.061 81.6487C80.1037 81.6807 80.1464 81.7073 80.1944 81.7287L84.8896 84.1243C84.9483 84.1617 85.007 84.1937 85.0657 84.2257C85.3591 84.3751 85.6793 84.4498 86.0154 84.4498C87.0985 84.4498 88.2189 83.6708 88.9446 82.4116L96.2808 69.7452C96.3289 69.6705 96.3715 69.6012 96.4089 69.5265C97.3906 67.7284 97.1879 65.7917 95.9394 65.0073C95.8914 64.9753 95.838 64.9486 95.7846 64.922L91.0307 62.4997C90.7373 62.3503 90.4172 62.2756 90.081 62.2756C89.9316 62.2756 89.7822 62.2916 89.6328 62.3183V59.896C89.6328 58.8182 89.1793 57.9699 88.395 57.5697L83.6411 55.1474C83.3423 54.998 83.0222 54.918 82.6754 54.918Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M95.3046 65.8708C94.563 65.492 93.4479 66.1322 92.781 67.3487L88.5713 74.6263L83.8174 72.204L88.0271 64.9264C88.6993 63.7099 89.8091 63.0697 90.5507 63.4485L95.3046 65.8708Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M80.5147 73.4103C79.7678 73.0262 78.6526 73.6664 77.9857 74.8883C77.2921 76.1421 77.3348 77.54 78.0764 78.0042L85.4287 83.2009L80.6748 80.7786L73.3225 75.5819C72.5809 75.1177 72.5382 73.7198 73.2318 72.466C73.8988 71.2441 75.0085 70.6092 75.7608 70.988L80.5147 73.4103Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M87.9095 58.5191C87.5894 58.3537 87.1732 58.3644 86.725 58.5938C85.7113 59.1114 84.8896 60.5359 84.8896 61.7684V76.4997L80.1357 74.0774V59.3461C80.1357 58.1136 80.9574 56.6891 81.9711 56.1715C82.4193 55.9421 82.8355 55.9314 83.1556 56.0968L87.9095 58.5191Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M87.9097 58.5187C88.3099 58.7214 88.566 59.207 88.566 59.8952V74.6265L92.7756 67.3489C93.4479 66.1324 94.5577 65.4922 95.2993 65.871C95.326 65.8816 95.3473 65.8977 95.374 65.9137C96.1157 66.3778 96.1583 67.7704 95.4647 69.0296C95.438 69.0829 95.406 69.1363 95.374 69.1843L88.0217 81.8774C87.3441 83.0458 86.2664 83.6381 85.5461 83.2753C85.5034 83.2539 85.4661 83.2326 85.4287 83.2006L78.0764 78.0038C77.3348 77.5396 77.2921 76.1418 77.9857 74.8879C78.6527 73.6661 79.7624 73.0312 80.5147 73.41C80.5414 73.4207 80.5628 73.4367 80.5841 73.4527C80.6108 73.474 80.6428 73.4954 80.6748 73.5167L84.8898 76.4992V61.768C84.8898 60.5355 85.7115 59.1109 86.7252 58.5934C87.1734 58.364 87.5896 58.3533 87.9097 58.5187Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M157.644 42.7875C158.242 42.4834 158.62 41.7631 158.62 40.7387V27.6562C158.62 25.8208 157.399 23.7079 155.889 22.9396L122.035 5.69003C121.368 5.34856 120.755 5.33255 120.28 5.57265L122.659 4.3615C123.134 4.1214 123.748 4.13741 124.415 4.47888L158.268 21.7284C159.778 22.4968 161 24.6096 161 26.445V39.5276C161 40.552 160.621 41.2723 160.024 41.5764L157.644 42.7875Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -38,320 +178,182 @@ export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrat
         strokeLinejoin="round"
       />
       <path
-        d="M1 119.596C1 117.579 2.50994 115.567 5.52448 114.031L87.0878 72.4729C93.1222 69.3997 102.902 69.3997 108.937 72.4729L147.752 92.2515C150.772 93.7881 152.277 95.8049 152.277 97.8217C152.277 99.8385 150.767 101.85 147.752 103.387L66.1888 144.945C60.1543 148.018 50.3744 148.018 44.34 144.945L5.52448 125.161C2.5046 123.624 1 121.607 1 119.59V119.596Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M157.644 42.7878C157.169 43.0279 156.555 43.0119 155.889 42.6705L122.035 25.4209C120.525 24.6526 119.303 22.5397 119.303 20.7043V7.62711C119.303 6.6027 119.682 5.88242 120.28 5.57829C120.754 5.3382 121.368 5.3542 122.035 5.69567L155.889 22.9452C157.398 23.7135 158.62 25.8264 158.62 27.6618V40.7444C158.62 41.7688 158.241 42.4891 157.644 42.7932V42.7878Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M1 99.2467C1 101.264 2.50994 103.275 5.52448 104.817L44.34 124.596C50.3744 127.669 60.1543 127.669 66.1888 124.596L147.752 83.0376C150.767 81.5009 152.277 79.4895 152.277 77.4727V83.9126C152.277 85.9294 150.767 87.9408 147.752 89.4775L66.1888 131.035C60.1543 134.109 50.3744 134.109 44.34 131.035L5.52448 111.257C2.5046 109.72 1 107.703 1 105.687V99.2467Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M1 99.2461C1 97.2293 2.50994 95.2179 5.52448 93.6813L87.0878 52.1233C93.1222 49.0501 102.902 49.0501 108.937 52.1233L147.752 71.9019C150.772 73.4385 152.277 75.4553 152.277 77.4721C152.277 79.4889 150.767 81.5004 147.752 83.037L66.1888 124.595C60.1543 127.668 50.3744 127.668 44.34 124.595L5.52448 104.816C2.5046 103.28 1 101.263 1 99.2461Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M65.0365 96.1829C64.2682 96.1829 63.5586 96.0175 62.913 95.6867L58.1591 93.2644C56.4358 92.3894 55.3793 90.4046 55.2513 87.8168L53.9281 61.1288C53.9174 60.9208 54.0295 60.7233 54.2162 60.6273L56.7079 59.3575L51.97 56.9458C50.7375 56.3162 50.0332 54.8863 50.0332 53.0243V50.7887C50.0332 47.5234 52.2261 43.7512 54.9205 42.38L97.1881 20.8407C97.8764 20.4886 98.554 20.3125 99.2049 20.3125C99.7171 20.3125 100.192 20.4245 100.624 20.6433L105.378 23.0656C106.611 23.6952 107.315 25.1251 107.315 26.9925V29.2281C107.315 32.4934 105.122 36.2602 102.428 37.6368L99.6797 39.0347L103.132 40.7954C103.319 40.8914 103.431 41.0888 103.42 41.2969L102.097 69.3348C101.857 74.3501 98.5059 79.8883 94.4616 81.9425L68.1044 95.3719C67.048 95.9108 66.0129 96.1829 65.0259 96.1829H65.0365Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M99.2048 20.8464C99.6316 20.8464 100.032 20.9424 100.379 21.1185L105.132 23.5408C106.141 24.053 106.776 25.2695 106.776 26.9875V29.2231C106.776 32.307 104.716 35.8604 102.182 37.1569L98.5005 39.035L102.886 41.2706L101.563 69.3085C101.334 74.1531 98.1163 79.4885 94.2214 81.468L67.8642 94.8974C66.8612 95.4096 65.9061 95.6497 65.0311 95.6497C64.3428 95.6497 63.7132 95.5003 63.1477 95.2122L58.3938 92.7899C56.8945 92.0269 55.9021 90.2822 55.7794 87.7959L54.4562 61.1078L58.2711 59.1657C58.2284 59.1657 58.1804 59.1657 58.1377 59.1657C57.7108 59.1657 57.316 59.075 56.9639 58.8936L52.21 56.4713C51.2016 55.9591 50.5666 54.7426 50.5666 53.0246V50.789C50.5666 47.7051 52.6208 44.1517 55.1605 42.8552L97.4281 21.3159C98.0576 20.9958 98.6552 20.8464 99.1994 20.8464M99.2048 19.7793C98.4738 19.7793 97.7108 19.9767 96.9479 20.3662L54.6803 41.9055C51.7778 43.3834 49.5049 47.2836 49.5049 50.789V53.0246C49.5049 55.1001 50.3159 56.7007 51.7351 57.4264L55.5393 59.3631L53.9813 60.1581C53.6079 60.3502 53.3784 60.7397 53.3998 61.1612L54.723 87.8492C54.8564 90.629 56.0248 92.7792 57.9189 93.7449L62.6728 96.1672C63.3931 96.5353 64.1881 96.7221 65.0364 96.7221C66.1035 96.7221 67.224 96.4286 68.3551 95.8524L94.7123 82.423C98.9807 80.2568 102.385 74.6386 102.635 69.3618L103.959 41.3239C103.98 40.9024 103.751 40.5129 103.377 40.3209L100.859 39.035L102.673 38.112C105.575 36.634 107.848 32.7285 107.848 29.2284V26.9929C107.848 24.9174 107.037 23.3167 105.618 22.5911L100.864 20.1688C100.357 19.9127 99.797 19.7793 99.2048 19.7793Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M102.891 41.27L59.2153 63.5295L54.4614 61.1072L98.1376 38.8477L102.891 41.27Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M59.2153 63.5297L60.5385 90.2177C60.6612 92.7041 61.6536 94.4488 63.1529 95.2117L58.399 92.7894C56.8997 92.0265 55.9073 90.2818 55.7846 87.7954L54.4614 61.1074L59.2153 63.5297Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M102.891 41.2695L101.568 69.3074C101.339 74.152 98.1216 79.4875 94.2267 81.467L67.8695 94.8963C66.0821 95.8087 64.4334 95.8674 63.1529 95.2111C61.6536 94.4481 60.6612 92.7034 60.5385 90.2171L59.2153 63.5291L102.891 41.2695Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M105.138 23.5408C104.337 23.1353 103.313 23.1673 102.187 23.7382L59.9195 45.2775C57.3798 46.5687 55.3257 50.1221 55.3257 53.2113V55.4469C55.3257 57.1702 55.9659 58.3814 56.969 58.8936L52.2151 56.4713C51.2067 55.9591 50.5718 54.7426 50.5718 53.0246V50.789C50.5718 47.7051 52.6259 44.1517 55.1656 42.8552L97.4332 21.3159C98.5536 20.745 99.5834 20.7076 100.384 21.1185L105.138 23.5408Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M105.138 23.5403C106.146 24.0526 106.781 25.269 106.781 26.9871V29.2226C106.781 32.3065 104.721 35.8599 102.187 37.1565L59.9195 58.6957C58.7991 59.2666 57.7693 59.304 56.969 58.8932C55.9606 58.381 55.3257 57.1645 55.3257 55.4464V53.2109C55.3257 50.127 57.3798 46.5736 59.9195 45.277L102.187 23.7378C103.308 23.1669 104.337 23.1295 105.138 23.5403Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M86.0156 83.9164C85.7595 83.9164 85.5248 83.8631 85.306 83.751C85.2526 83.7243 85.2046 83.6977 85.1566 83.6603L80.4347 81.254C80.4347 81.254 80.392 81.2273 80.3707 81.2167L73.0184 76.0199C72.0474 75.4117 71.9246 73.731 72.7676 72.2104C73.3866 71.0793 74.3736 70.3483 75.286 70.3483C75.5421 70.3483 75.7822 70.407 76.0009 70.5191L79.6024 72.3545V59.3519C79.6024 57.9113 80.5361 56.3107 81.7312 55.7025C82.0514 55.5424 82.3715 55.457 82.6809 55.457C82.9371 55.457 83.1825 55.5157 83.4012 55.6278L88.1551 58.0501C88.7581 58.3595 89.1049 59.0318 89.1049 59.9015V63.0814C89.4303 62.9107 89.7665 62.8146 90.0866 62.8146C90.3427 62.8146 90.5774 62.868 90.7962 62.98L95.5501 65.4023C95.5875 65.4237 95.6248 65.445 95.6621 65.4664C96.6545 66.0906 96.7773 67.7713 95.9396 69.2919C95.9129 69.3453 95.8702 69.42 95.8275 69.484L88.4913 82.1504C87.8617 83.2442 86.9173 83.9218 86.021 83.9218L86.0156 83.9164Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M82.6754 55.9851C82.8515 55.9851 83.0115 56.0224 83.1556 56.0971L87.9095 58.5194C88.3097 58.7222 88.5658 59.2077 88.5658 59.896V64.1643C89.0406 63.6415 89.5955 63.3427 90.081 63.3427C90.2464 63.3427 90.4012 63.38 90.5452 63.4494L95.2991 65.8717C95.2991 65.8717 95.3471 65.8984 95.3738 65.9144C96.1154 66.3786 96.1581 67.7711 95.4645 69.0303C95.4378 69.0836 95.4058 69.137 95.3738 69.185L88.0215 81.8781C87.4773 82.8171 86.6823 83.3827 86.0154 83.3827C85.85 83.3827 85.6899 83.3453 85.5459 83.276C85.5032 83.2546 85.4658 83.2333 85.4285 83.2013L80.6746 80.779L73.3223 75.5822C72.5807 75.1181 72.538 73.7202 73.2316 72.4663C73.7705 71.4846 74.5922 70.8817 75.2858 70.8817C75.4565 70.8817 75.6166 70.919 75.7606 70.9937L80.1357 73.224V59.3517C80.1357 58.1192 80.9574 56.6947 81.9711 56.1771C82.2219 56.0491 82.4566 55.9904 82.6754 55.9904M82.6754 54.918C82.2806 54.918 81.8857 55.0193 81.4909 55.2168C80.109 55.921 79.0686 57.6977 79.0686 59.3464V71.4793L76.2462 70.0387C75.9527 69.8893 75.6272 69.8146 75.2858 69.8146C74.1653 69.8146 73.0182 70.6363 72.2979 71.9541C71.3108 73.7362 71.4976 75.6676 72.7301 76.4679L80.061 81.6487C80.1037 81.6807 80.1464 81.7073 80.1944 81.7287L84.8896 84.1243C84.9483 84.1617 85.007 84.1937 85.0657 84.2257C85.3591 84.3751 85.6793 84.4498 86.0154 84.4498C87.0985 84.4498 88.2189 83.6708 88.9446 82.4116L96.2808 69.7452C96.3289 69.6705 96.3715 69.6012 96.4089 69.5265C97.3906 67.7284 97.1879 65.7917 95.9394 65.0073C95.8914 64.9753 95.838 64.9486 95.7846 64.922L91.0307 62.4997C90.7373 62.3503 90.4172 62.2756 90.081 62.2756C89.9316 62.2756 89.7822 62.2916 89.6328 62.3183V59.896C89.6328 58.8182 89.1793 57.9699 88.395 57.5697L83.6411 55.1474C83.3423 54.998 83.0222 54.918 82.6754 54.918Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M95.3046 65.8708C94.563 65.492 93.4479 66.1322 92.781 67.3487L88.5713 74.6263L83.8174 72.204L88.0271 64.9264C88.6993 63.7099 89.8091 63.0697 90.5507 63.4485L95.3046 65.8708Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M80.5147 73.4103C79.7678 73.0262 78.6526 73.6664 77.9857 74.8883C77.2921 76.1421 77.3348 77.54 78.0764 78.0042L85.4287 83.2009L80.6748 80.7786L73.3225 75.5819C72.5809 75.1177 72.5382 73.7198 73.2318 72.466C73.8988 71.2441 75.0085 70.6092 75.7608 70.988L80.5147 73.4103Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M87.9095 58.5191C87.5894 58.3537 87.1732 58.3644 86.725 58.5938C85.7113 59.1114 84.8896 60.5359 84.8896 61.7684V76.4997L80.1357 74.0774V59.3461C80.1357 58.1136 80.9574 56.6891 81.9711 56.1715C82.4193 55.9421 82.8355 55.9314 83.1556 56.0968L87.9095 58.5191Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M87.9097 58.5187C88.3099 58.7214 88.566 59.207 88.566 59.8952V74.6265L92.7756 67.3489C93.4479 66.1324 94.5577 65.4922 95.2993 65.871C95.326 65.8816 95.3473 65.8977 95.374 65.9137C96.1157 66.3778 96.1583 67.7704 95.4647 69.0296C95.438 69.0829 95.406 69.1363 95.374 69.1843L88.0217 81.8774C87.3441 83.0458 86.2664 83.6381 85.5461 83.2753C85.5034 83.2539 85.4661 83.2326 85.4287 83.2006L78.0764 78.0038C77.3348 77.5396 77.2921 76.1418 77.9857 74.8879C78.6527 73.6661 79.7624 73.0312 80.5147 73.41C80.5414 73.4207 80.5628 73.4367 80.5841 73.4527C80.6108 73.474 80.6428 73.4954 80.6748 73.5167L84.8898 76.4992V61.768C84.8898 60.5355 85.7115 59.1109 86.7252 58.5934C87.1734 58.364 87.5896 58.3533 87.9097 58.5187Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M157.644 42.7875C158.242 42.4834 158.62 41.7631 158.62 40.7387V27.6562C158.62 25.8208 157.399 23.7079 155.889 22.9396L122.035 5.69003C121.368 5.34856 120.755 5.33255 120.28 5.57265L122.659 4.3615C123.134 4.1214 123.748 4.13741 124.415 4.47888L158.268 21.7284C159.778 22.4968 161 24.6096 161 26.445V39.5276C161 40.552 160.621 41.2723 160.024 41.5764L157.644 42.7875Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M157.644 42.7878C157.169 43.0279 156.555 43.0119 155.889 42.6705L122.035 25.4209C120.525 24.6526 119.303 22.5397 119.303 20.7043V7.62711C119.303 6.6027 119.682 5.88242 120.28 5.57829C120.754 5.3382 121.368 5.3542 122.035 5.69567L155.889 22.9452C157.398 23.7135 158.62 25.8264 158.62 27.6618V40.7444C158.62 41.7688 158.241 42.4891 157.644 42.7932V42.7878Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M133.199 17.6289C133.219 17.6148 133.303 17.5662 133.508 17.6709L133.509 17.6719L141.362 21.6729L141.364 21.6738C141.577 21.781 141.806 22.0073 141.983 22.3145C142.16 22.619 142.258 22.9562 142.258 23.2441C142.258 23.5356 142.163 23.6422 142.127 23.668C142.108 23.6818 142.023 23.7323 141.817 23.627L141.816 23.626L133.963 19.624L133.961 19.623L133.881 19.5781C133.692 19.459 133.498 19.2522 133.343 18.9834C133.166 18.6787 133.067 18.3408 133.067 18.0527C133.067 17.7603 133.164 17.654 133.199 17.6289Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M133.425 23.0605C133.53 22.9867 133.732 22.9327 134.07 23.1035V23.1025L145.082 28.7158C145.424 28.8901 145.77 29.2403 146.033 29.6934C146.294 30.1441 146.446 30.6509 146.446 31.0986C146.446 31.5487 146.298 31.7691 146.178 31.8535C146.074 31.9272 145.871 31.9802 145.534 31.8096L134.523 26.1973C134.181 26.023 133.834 25.6737 133.571 25.2207C133.309 24.77 133.158 24.2632 133.158 23.8154C133.158 23.3652 133.306 23.145 133.425 23.0605Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <mask id="path-24-inside-1_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+      <path
+        d="M133.199 17.6289C133.219 17.6148 133.303 17.5662 133.508 17.6709L133.509 17.6719L141.362 21.6729L141.364 21.6738C141.577 21.781 141.806 22.0073 141.983 22.3145C142.16 22.619 142.258 22.9562 142.258 23.2441C142.258 23.5356 142.163 23.6422 142.127 23.668C142.108 23.6818 142.023 23.7323 141.817 23.627L141.816 23.626L133.963 19.624L133.961 19.623L133.881 19.5781C133.692 19.459 133.498 19.2522 133.343 18.9834C133.166 18.6787 133.067 18.3408 133.067 18.0527C133.067 17.7603 133.164 17.654 133.199 17.6289Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M133.425 23.0605C133.53 22.9867 133.732 22.9327 134.07 23.1035V23.1025L145.082 28.7158C145.424 28.8901 145.77 29.2403 146.033 29.6934C146.294 30.1441 146.446 30.6509 146.446 31.0986C146.446 31.5487 146.298 31.7691 146.178 31.8535C146.074 31.9272 145.871 31.9802 145.534 31.8096L134.523 26.1973C134.181 26.023 133.834 25.6737 133.571 25.2207C133.309 24.77 133.158 24.2632 133.158 23.8154C133.158 23.3652 133.306 23.145 133.425 23.0605Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <mask id="path-24-inside-1_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M127.141 16.0095C127.194 16.1855 127.317 16.3563 127.456 16.4256C127.648 16.527 127.808 16.4096 127.808 16.1695V15.7267C127.808 15.5826 127.754 15.4172 127.658 15.2892C127.562 15.1611 127.445 15.0811 127.333 15.0757L125.065 15.0117C124.932 15.0117 124.841 15.1238 124.841 15.3052V18.3571C124.841 18.5118 124.905 18.6825 125.007 18.8159C125.113 18.9493 125.241 19.0187 125.348 19.0026L125.674 18.9546C125.844 18.928 125.908 18.6985 125.823 18.4424C125.764 18.2717 125.658 18.133 125.54 18.0636V15.9561L127.136 15.9988L127.141 16.0095Z"
+        />
+      </mask>
       <path
         fillRule="evenodd"
         clipRule="evenodd"
         d="M127.141 16.0095C127.194 16.1855 127.317 16.3563 127.456 16.4256C127.648 16.527 127.808 16.4096 127.808 16.1695V15.7267C127.808 15.5826 127.754 15.4172 127.658 15.2892C127.562 15.1611 127.445 15.0811 127.333 15.0757L125.065 15.0117C124.932 15.0117 124.841 15.1238 124.841 15.3052V18.3571C124.841 18.5118 124.905 18.6825 125.007 18.8159C125.113 18.9493 125.241 19.0187 125.348 19.0026L125.674 18.9546C125.844 18.928 125.908 18.6985 125.823 18.4424C125.764 18.2717 125.658 18.133 125.54 18.0636V15.9561L127.136 15.9988L127.141 16.0095Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </mask>
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M127.141 16.0095C127.194 16.1855 127.317 16.3563 127.456 16.4256C127.648 16.527 127.808 16.4096 127.808 16.1695V15.7267C127.808 15.5826 127.754 15.4172 127.658 15.2892C127.562 15.1611 127.445 15.0811 127.333 15.0757L125.065 15.0117C124.932 15.0117 124.841 15.1238 124.841 15.3052V18.3571C124.841 18.5118 124.905 18.6825 125.007 18.8159C125.113 18.9493 125.241 19.0187 125.348 19.0026L125.674 18.9546C125.844 18.928 125.908 18.6985 125.823 18.4424C125.764 18.2717 125.658 18.133 125.54 18.0636V15.9561L127.136 15.9988L127.141 16.0095Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M127.141 16.0095L128.098 15.7194L128.073 15.6383L128.035 15.5624L127.141 16.0095ZM127.456 16.4256L127.922 15.5412L127.913 15.5361L127.903 15.5312L127.456 16.4256ZM127.333 15.0757L127.381 14.0769L127.371 14.0764L127.361 14.0761L127.333 15.0757ZM125.065 15.0117L125.094 14.0121L125.08 14.0117H125.065V15.0117ZM125.007 18.8159L124.211 19.421L124.218 19.4309L124.226 19.4406L125.007 18.8159ZM125.348 19.0026L125.202 18.0134L125.2 18.0137L125.348 19.0026ZM125.674 18.9546L125.82 19.944L125.828 19.9426L125.674 18.9546ZM125.823 18.4424L126.772 18.1262L126.769 18.1173L125.823 18.4424ZM125.54 18.0636H124.54V18.6342L125.032 18.9245L125.54 18.0636ZM125.54 15.9561L125.567 14.9565L124.54 14.929V15.9561H125.54ZM127.136 15.9988L128.03 15.5518L127.762 15.0152L127.162 14.9991L127.136 15.9988ZM127.141 16.0095L126.184 16.2995C126.29 16.6492 126.551 17.0915 127.008 17.32L127.456 16.4256L127.903 15.5312C127.961 15.5601 128 15.5907 128.023 15.6111C128.046 15.6319 128.06 15.6493 128.068 15.6599C128.082 15.6782 128.091 15.6954 128.098 15.7194L127.141 16.0095ZM127.456 16.4256L126.989 17.31C127.335 17.4926 127.848 17.5584 128.293 17.2336C128.699 16.9373 128.808 16.4882 128.808 16.1695H127.808H126.808C126.808 16.0909 126.836 15.8206 127.115 15.6176C127.432 15.3862 127.769 15.46 127.922 15.5412L127.456 16.4256ZM127.808 16.1695H128.808V15.7267H127.808H126.808V16.1695H127.808ZM127.808 15.7267H128.808C128.808 15.3625 128.682 14.9873 128.458 14.6892L127.658 15.2892L126.858 15.8892C126.837 15.8611 126.827 15.8379 126.821 15.8207C126.816 15.8042 126.808 15.774 126.808 15.7267H127.808ZM127.658 15.2892L128.458 14.6892C128.279 14.4497 127.919 14.1025 127.381 14.0769L127.333 15.0757L127.285 16.0746C127.12 16.0667 127.006 16.0074 126.949 15.97C126.892 15.932 126.865 15.8981 126.858 15.8892L127.658 15.2892ZM127.333 15.0757L127.361 14.0761L125.094 14.0121L125.065 15.0117L125.037 16.0113L127.305 16.0753L127.333 15.0757ZM125.065 15.0117V14.0117C124.69 14.0117 124.342 14.1822 124.113 14.4772C123.902 14.7493 123.841 15.0586 123.841 15.3052H124.841H125.841C125.841 15.3703 125.826 15.533 125.693 15.7036C125.543 15.8973 125.307 16.0117 125.065 16.0117V15.0117ZM124.841 15.3052H123.841V18.3571H124.841H125.841V15.3052H124.841ZM124.841 18.3571H123.841C123.841 18.7636 123.999 19.1421 124.211 19.421L125.007 18.8159L125.803 18.2108C125.814 18.2249 125.82 18.2375 125.826 18.2521C125.83 18.2654 125.841 18.3002 125.841 18.3571H124.841ZM125.007 18.8159L124.226 19.4406C124.421 19.6852 124.867 20.086 125.497 19.9916L125.348 19.0026L125.2 18.0137C125.417 17.9811 125.579 18.0452 125.656 18.0874C125.736 18.131 125.775 18.176 125.788 18.1912L125.007 18.8159ZM125.348 19.0026L125.494 19.9919L125.82 19.9439L125.674 18.9546L125.528 17.9653L125.202 18.0134L125.348 19.0026ZM125.674 18.9546L125.828 19.9426C126.405 19.8525 126.705 19.411 126.805 19.0611C126.901 18.7278 126.861 18.3946 126.772 18.1262L125.823 18.4424L124.874 18.7587C124.87 18.7464 124.841 18.6559 124.883 18.508C124.906 18.4294 124.957 18.3118 125.067 18.1994C125.184 18.0795 125.343 17.9942 125.519 17.9666L125.674 18.9546ZM125.823 18.4424L126.769 18.1173C126.652 17.7768 126.416 17.4197 126.049 17.2027L125.54 18.0636L125.032 18.9245C124.957 18.8807 124.919 18.8361 124.905 18.8163C124.888 18.7942 124.881 18.7777 124.877 18.7675L125.823 18.4424ZM125.54 18.0636H126.54V15.9561H125.54H124.54V18.0636H125.54ZM125.54 15.9561L125.514 16.9557L127.109 16.9984L127.136 15.9988L127.162 14.9991L125.567 14.9565L125.54 15.9561ZM127.136 15.9988L126.241 16.4458L126.246 16.4565L127.141 16.0095L128.035 15.5624L128.03 15.5518L127.136 15.9988Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-24-inside-1_637_1524)"
-    />
-    <mask id="path-26-inside-2_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+      <path
+        d="M127.141 16.0095L128.098 15.7194L128.073 15.6383L128.035 15.5624L127.141 16.0095ZM127.456 16.4256L127.922 15.5412L127.913 15.5361L127.903 15.5312L127.456 16.4256ZM127.333 15.0757L127.381 14.0769L127.371 14.0764L127.361 14.0761L127.333 15.0757ZM125.065 15.0117L125.094 14.0121L125.08 14.0117H125.065V15.0117ZM125.007 18.8159L124.211 19.421L124.218 19.4309L124.226 19.4406L125.007 18.8159ZM125.348 19.0026L125.202 18.0134L125.2 18.0137L125.348 19.0026ZM125.674 18.9546L125.82 19.944L125.828 19.9426L125.674 18.9546ZM125.823 18.4424L126.772 18.1262L126.769 18.1173L125.823 18.4424ZM125.54 18.0636H124.54V18.6342L125.032 18.9245L125.54 18.0636ZM125.54 15.9561L125.567 14.9565L124.54 14.929V15.9561H125.54ZM127.136 15.9988L128.03 15.5518L127.762 15.0152L127.162 14.9991L127.136 15.9988ZM127.141 16.0095L126.184 16.2995C126.29 16.6492 126.551 17.0915 127.008 17.32L127.456 16.4256L127.903 15.5312C127.961 15.5601 128 15.5907 128.023 15.6111C128.046 15.6319 128.06 15.6493 128.068 15.6599C128.082 15.6782 128.091 15.6954 128.098 15.7194L127.141 16.0095ZM127.456 16.4256L126.989 17.31C127.335 17.4926 127.848 17.5584 128.293 17.2336C128.699 16.9373 128.808 16.4882 128.808 16.1695H127.808H126.808C126.808 16.0909 126.836 15.8206 127.115 15.6176C127.432 15.3862 127.769 15.46 127.922 15.5412L127.456 16.4256ZM127.808 16.1695H128.808V15.7267H127.808H126.808V16.1695H127.808ZM127.808 15.7267H128.808C128.808 15.3625 128.682 14.9873 128.458 14.6892L127.658 15.2892L126.858 15.8892C126.837 15.8611 126.827 15.8379 126.821 15.8207C126.816 15.8042 126.808 15.774 126.808 15.7267H127.808ZM127.658 15.2892L128.458 14.6892C128.279 14.4497 127.919 14.1025 127.381 14.0769L127.333 15.0757L127.285 16.0746C127.12 16.0667 127.006 16.0074 126.949 15.97C126.892 15.932 126.865 15.8981 126.858 15.8892L127.658 15.2892ZM127.333 15.0757L127.361 14.0761L125.094 14.0121L125.065 15.0117L125.037 16.0113L127.305 16.0753L127.333 15.0757ZM125.065 15.0117V14.0117C124.69 14.0117 124.342 14.1822 124.113 14.4772C123.902 14.7493 123.841 15.0586 123.841 15.3052H124.841H125.841C125.841 15.3703 125.826 15.533 125.693 15.7036C125.543 15.8973 125.307 16.0117 125.065 16.0117V15.0117ZM124.841 15.3052H123.841V18.3571H124.841H125.841V15.3052H124.841ZM124.841 18.3571H123.841C123.841 18.7636 123.999 19.1421 124.211 19.421L125.007 18.8159L125.803 18.2108C125.814 18.2249 125.82 18.2375 125.826 18.2521C125.83 18.2654 125.841 18.3002 125.841 18.3571H124.841ZM125.007 18.8159L124.226 19.4406C124.421 19.6852 124.867 20.086 125.497 19.9916L125.348 19.0026L125.2 18.0137C125.417 17.9811 125.579 18.0452 125.656 18.0874C125.736 18.131 125.775 18.176 125.788 18.1912L125.007 18.8159ZM125.348 19.0026L125.494 19.9919L125.82 19.9439L125.674 18.9546L125.528 17.9653L125.202 18.0134L125.348 19.0026ZM125.674 18.9546L125.828 19.9426C126.405 19.8525 126.705 19.411 126.805 19.0611C126.901 18.7278 126.861 18.3946 126.772 18.1262L125.823 18.4424L124.874 18.7587C124.87 18.7464 124.841 18.6559 124.883 18.508C124.906 18.4294 124.957 18.3118 125.067 18.1994C125.184 18.0795 125.343 17.9942 125.519 17.9666L125.674 18.9546ZM125.823 18.4424L126.769 18.1173C126.652 17.7768 126.416 17.4197 126.049 17.2027L125.54 18.0636L125.032 18.9245C124.957 18.8807 124.919 18.8361 124.905 18.8163C124.888 18.7942 124.881 18.7777 124.877 18.7675L125.823 18.4424ZM125.54 18.0636H126.54V15.9561H125.54H124.54V18.0636H125.54ZM125.54 15.9561L125.514 16.9557L127.109 16.9984L127.136 15.9988L127.162 14.9991L125.567 14.9565L125.54 15.9561ZM127.136 15.9988L126.241 16.4458L126.246 16.4565L127.141 16.0095L128.035 15.5624L128.03 15.5518L127.136 15.9988Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-24-inside-1_637_1524)"
+      />
+      <mask id="path-26-inside-2_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M125.748 13.9919C125.802 14.1679 125.924 14.3387 126.063 14.408C126.255 14.5094 126.415 14.392 126.415 14.1519V13.7091C126.415 13.565 126.362 13.3996 126.266 13.2716C126.17 13.1435 126.052 13.0635 125.94 13.0582L123.673 12.9941C123.539 12.9941 123.449 13.1062 123.449 13.2876V16.3395C123.449 16.4942 123.513 16.6649 123.614 16.7983C123.721 16.9317 123.849 17.0011 123.956 16.9851L124.281 16.9371C124.452 16.9104 124.516 16.6809 124.43 16.4248C124.372 16.2541 124.265 16.1154 124.148 16.046V13.9385L125.743 13.9812L125.748 13.9919Z"
+        />
+      </mask>
       <path
         fillRule="evenodd"
         clipRule="evenodd"
         d="M125.748 13.9919C125.802 14.1679 125.924 14.3387 126.063 14.408C126.255 14.5094 126.415 14.392 126.415 14.1519V13.7091C126.415 13.565 126.362 13.3996 126.266 13.2716C126.17 13.1435 126.052 13.0635 125.94 13.0582L123.673 12.9941C123.539 12.9941 123.449 13.1062 123.449 13.2876V16.3395C123.449 16.4942 123.513 16.6649 123.614 16.7983C123.721 16.9317 123.849 17.0011 123.956 16.9851L124.281 16.9371C124.452 16.9104 124.516 16.6809 124.43 16.4248C124.372 16.2541 124.265 16.1154 124.148 16.046V13.9385L125.743 13.9812L125.748 13.9919Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </mask>
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M125.748 13.9919C125.802 14.1679 125.924 14.3387 126.063 14.408C126.255 14.5094 126.415 14.392 126.415 14.1519V13.7091C126.415 13.565 126.362 13.3996 126.266 13.2716C126.17 13.1435 126.052 13.0635 125.94 13.0582L123.673 12.9941C123.539 12.9941 123.449 13.1062 123.449 13.2876V16.3395C123.449 16.4942 123.513 16.6649 123.614 16.7983C123.721 16.9317 123.849 17.0011 123.956 16.9851L124.281 16.9371C124.452 16.9104 124.516 16.6809 124.43 16.4248C124.372 16.2541 124.265 16.1154 124.148 16.046V13.9385L125.743 13.9812L125.748 13.9919Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M125.748 13.9919L126.705 13.7019L126.681 13.6207L126.643 13.5449L125.748 13.9919ZM126.063 14.408L126.53 13.5237L126.52 13.5185L126.51 13.5136L126.063 14.408ZM125.94 13.0582L125.988 12.0593L125.978 12.0588L125.969 12.0586L125.94 13.0582ZM123.673 12.9941L123.701 11.9945L123.687 11.9941H123.673V12.9941ZM123.614 16.7983L122.818 17.4034L122.825 17.4133L122.833 17.423L123.614 16.7983ZM123.956 16.9851L123.81 15.9958L123.807 15.9961L123.956 16.9851ZM124.281 16.9371L124.427 17.9264L124.435 17.9251L124.281 16.9371ZM124.43 16.4248L125.379 16.1086L125.376 16.0998L124.43 16.4248ZM124.148 16.046H123.148V16.6167L123.639 16.907L124.148 16.046ZM124.148 13.9385L124.174 12.9389L123.148 12.9114V13.9385H124.148ZM125.743 13.9812L126.638 13.5342L126.369 12.9976L125.77 12.9816L125.743 13.9812ZM125.748 13.9919L124.791 14.2819C124.897 14.6316 125.159 15.074 125.616 15.3025L126.063 14.408L126.51 13.5136C126.568 13.5425 126.607 13.5731 126.63 13.5935C126.653 13.6143 126.668 13.6317 126.675 13.6423C126.689 13.6606 126.698 13.6778 126.705 13.7019L125.748 13.9919ZM126.063 14.408L125.596 15.2924C125.942 15.475 126.455 15.5408 126.9 15.216C127.307 14.9197 127.415 14.4706 127.415 14.1519H126.415H125.415C125.415 14.0734 125.444 13.803 125.722 13.6C126.039 13.3686 126.376 13.4425 126.53 13.5237L126.063 14.408ZM126.415 14.1519H127.415V13.7091H126.415H125.415V14.1519H126.415ZM126.415 13.7091H127.415C127.415 13.345 127.289 12.9697 127.066 12.6716L126.266 13.2716L125.466 13.8716C125.445 13.8435 125.435 13.8204 125.429 13.8031C125.423 13.7866 125.415 13.7564 125.415 13.7091H126.415ZM126.266 13.2716L127.066 12.6716C126.886 12.4321 126.526 12.0849 125.988 12.0593L125.94 13.0582L125.893 14.057C125.728 14.0492 125.613 13.9898 125.557 13.9524C125.499 13.9144 125.473 13.8805 125.466 13.8716L126.266 13.2716ZM125.94 13.0582L125.969 12.0586L123.701 11.9945L123.673 12.9941L123.645 13.9937L125.912 14.0578L125.94 13.0582ZM123.673 12.9941V11.9941C123.298 11.9941 122.95 12.1646 122.721 12.4596C122.51 12.7317 122.449 13.041 122.449 13.2876H123.449H124.449C124.449 13.3528 124.433 13.5154 124.301 13.6861C124.15 13.8797 123.915 13.9941 123.673 13.9941V12.9941ZM123.449 13.2876H122.449V16.3395H123.449H124.449V13.2876H123.449ZM123.449 16.3395H122.449C122.449 16.746 122.606 17.1245 122.818 17.4034L123.614 16.7983L124.41 16.1932C124.421 16.2073 124.428 16.22 124.433 16.2345C124.438 16.2479 124.449 16.2826 124.449 16.3395H123.449ZM123.614 16.7983L122.833 17.423C123.029 17.6676 123.475 18.0684 124.104 17.974L123.956 16.9851L123.807 15.9961C124.024 15.9635 124.186 16.0277 124.264 16.0698C124.344 16.1134 124.383 16.1584 124.395 16.1736L123.614 16.7983ZM123.956 16.9851L124.102 17.9744L124.427 17.9263L124.281 16.9371L124.135 15.9478L123.81 15.9958L123.956 16.9851ZM124.281 16.9371L124.435 17.9251C125.012 17.8349 125.312 17.3935 125.413 17.0435C125.509 16.7102 125.469 16.377 125.379 16.1086L124.43 16.4248L123.482 16.7411C123.478 16.7288 123.448 16.6384 123.491 16.4904C123.513 16.4118 123.564 16.2943 123.674 16.1818C123.792 16.0619 123.95 15.9766 124.127 15.949L124.281 16.9371ZM124.43 16.4248L125.376 16.0998C125.259 15.7592 125.024 15.4021 124.656 15.1851L124.148 16.046L123.639 16.907C123.565 16.8631 123.527 16.8185 123.512 16.7987C123.495 16.7766 123.488 16.7601 123.485 16.7499L124.43 16.4248ZM124.148 16.046H125.148V13.9385H124.148H123.148V16.046H124.148ZM124.148 13.9385L124.121 14.9382L125.716 14.9808L125.743 13.9812L125.77 12.9816L124.174 12.9389L124.148 13.9385ZM125.743 13.9812L124.848 14.4282L124.854 14.4389L125.748 13.9919L126.643 13.5449L126.638 13.5342L125.743 13.9812Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-26-inside-2_637_1524)"
-    />
-    <mask id="path-28-inside-3_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+      <path
+        d="M125.748 13.9919L126.705 13.7019L126.681 13.6207L126.643 13.5449L125.748 13.9919ZM126.063 14.408L126.53 13.5237L126.52 13.5185L126.51 13.5136L126.063 14.408ZM125.94 13.0582L125.988 12.0593L125.978 12.0588L125.969 12.0586L125.94 13.0582ZM123.673 12.9941L123.701 11.9945L123.687 11.9941H123.673V12.9941ZM123.614 16.7983L122.818 17.4034L122.825 17.4133L122.833 17.423L123.614 16.7983ZM123.956 16.9851L123.81 15.9958L123.807 15.9961L123.956 16.9851ZM124.281 16.9371L124.427 17.9264L124.435 17.9251L124.281 16.9371ZM124.43 16.4248L125.379 16.1086L125.376 16.0998L124.43 16.4248ZM124.148 16.046H123.148V16.6167L123.639 16.907L124.148 16.046ZM124.148 13.9385L124.174 12.9389L123.148 12.9114V13.9385H124.148ZM125.743 13.9812L126.638 13.5342L126.369 12.9976L125.77 12.9816L125.743 13.9812ZM125.748 13.9919L124.791 14.2819C124.897 14.6316 125.159 15.074 125.616 15.3025L126.063 14.408L126.51 13.5136C126.568 13.5425 126.607 13.5731 126.63 13.5935C126.653 13.6143 126.668 13.6317 126.675 13.6423C126.689 13.6606 126.698 13.6778 126.705 13.7019L125.748 13.9919ZM126.063 14.408L125.596 15.2924C125.942 15.475 126.455 15.5408 126.9 15.216C127.307 14.9197 127.415 14.4706 127.415 14.1519H126.415H125.415C125.415 14.0734 125.444 13.803 125.722 13.6C126.039 13.3686 126.376 13.4425 126.53 13.5237L126.063 14.408ZM126.415 14.1519H127.415V13.7091H126.415H125.415V14.1519H126.415ZM126.415 13.7091H127.415C127.415 13.345 127.289 12.9697 127.066 12.6716L126.266 13.2716L125.466 13.8716C125.445 13.8435 125.435 13.8204 125.429 13.8031C125.423 13.7866 125.415 13.7564 125.415 13.7091H126.415ZM126.266 13.2716L127.066 12.6716C126.886 12.4321 126.526 12.0849 125.988 12.0593L125.94 13.0582L125.893 14.057C125.728 14.0492 125.613 13.9898 125.557 13.9524C125.499 13.9144 125.473 13.8805 125.466 13.8716L126.266 13.2716ZM125.94 13.0582L125.969 12.0586L123.701 11.9945L123.673 12.9941L123.645 13.9937L125.912 14.0578L125.94 13.0582ZM123.673 12.9941V11.9941C123.298 11.9941 122.95 12.1646 122.721 12.4596C122.51 12.7317 122.449 13.041 122.449 13.2876H123.449H124.449C124.449 13.3528 124.433 13.5154 124.301 13.6861C124.15 13.8797 123.915 13.9941 123.673 13.9941V12.9941ZM123.449 13.2876H122.449V16.3395H123.449H124.449V13.2876H123.449ZM123.449 16.3395H122.449C122.449 16.746 122.606 17.1245 122.818 17.4034L123.614 16.7983L124.41 16.1932C124.421 16.2073 124.428 16.22 124.433 16.2345C124.438 16.2479 124.449 16.2826 124.449 16.3395H123.449ZM123.614 16.7983L122.833 17.423C123.029 17.6676 123.475 18.0684 124.104 17.974L123.956 16.9851L123.807 15.9961C124.024 15.9635 124.186 16.0277 124.264 16.0698C124.344 16.1134 124.383 16.1584 124.395 16.1736L123.614 16.7983ZM123.956 16.9851L124.102 17.9744L124.427 17.9263L124.281 16.9371L124.135 15.9478L123.81 15.9958L123.956 16.9851ZM124.281 16.9371L124.435 17.9251C125.012 17.8349 125.312 17.3935 125.413 17.0435C125.509 16.7102 125.469 16.377 125.379 16.1086L124.43 16.4248L123.482 16.7411C123.478 16.7288 123.448 16.6384 123.491 16.4904C123.513 16.4118 123.564 16.2943 123.674 16.1818C123.792 16.0619 123.95 15.9766 124.127 15.949L124.281 16.9371ZM124.43 16.4248L125.376 16.0998C125.259 15.7592 125.024 15.4021 124.656 15.1851L124.148 16.046L123.639 16.907C123.565 16.8631 123.527 16.8185 123.512 16.7987C123.495 16.7766 123.488 16.7601 123.485 16.7499L124.43 16.4248ZM124.148 16.046H125.148V13.9385H124.148H123.148V16.046H124.148ZM124.148 13.9385L124.121 14.9382L125.716 14.9808L125.743 13.9812L125.77 12.9816L124.174 12.9389L124.148 13.9385ZM125.743 13.9812L124.848 14.4282L124.854 14.4389L125.748 13.9919L126.643 13.5449L126.638 13.5342L125.743 13.9812Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-26-inside-2_637_1524)"
+      />
+      <mask id="path-28-inside-3_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M129.206 17.379C129.11 17.2456 128.992 17.1656 128.886 17.1656L126.618 17.1016C126.485 17.1016 126.394 17.2189 126.394 17.3897V20.4469C126.394 20.591 126.447 20.751 126.543 20.8791C126.645 21.0125 126.762 21.0925 126.869 21.0925L129.131 21.1565C129.27 21.1672 129.361 21.0498 129.361 20.8684V17.8112C129.361 17.6671 129.307 17.5071 129.206 17.379ZM128.662 20.2175L127.093 20.1695V18.0513L128.662 18.0993V20.2175Z"
+        />
+      </mask>
       <path
         fillRule="evenodd"
         clipRule="evenodd"
         d="M129.206 17.379C129.11 17.2456 128.992 17.1656 128.886 17.1656L126.618 17.1016C126.485 17.1016 126.394 17.2189 126.394 17.3897V20.4469C126.394 20.591 126.447 20.751 126.543 20.8791C126.645 21.0125 126.762 21.0925 126.869 21.0925L129.131 21.1565C129.27 21.1672 129.361 21.0498 129.361 20.8684V17.8112C129.361 17.6671 129.307 17.5071 129.206 17.379ZM128.662 20.2175L127.093 20.1695V18.0513L128.662 18.0993V20.2175Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </mask>
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M129.206 17.379C129.11 17.2456 128.992 17.1656 128.886 17.1656L126.618 17.1016C126.485 17.1016 126.394 17.2189 126.394 17.3897V20.4469C126.394 20.591 126.447 20.751 126.543 20.8791C126.645 21.0125 126.762 21.0925 126.869 21.0925L129.131 21.1565C129.27 21.1672 129.361 21.0498 129.361 20.8684V17.8112C129.361 17.6671 129.307 17.5071 129.206 17.379ZM128.662 20.2175L127.093 20.1695V18.0513L128.662 18.0993V20.2175Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M129.206 17.379L128.394 17.9633L128.408 17.9818L128.422 17.9997L129.206 17.379ZM128.886 17.1656L128.857 18.1652L128.872 18.1656H128.886V17.1656ZM126.618 17.1016L126.646 16.102L126.632 16.1016H126.618V17.1016ZM126.543 20.8791L125.743 21.4791L125.747 21.4842L126.543 20.8791ZM126.869 21.0925L126.897 20.0929L126.883 20.0925H126.869V21.0925ZM129.131 21.1565L129.208 20.1595L129.184 20.1576L129.159 20.1569L129.131 21.1565ZM128.662 20.2175L128.631 21.217L129.662 21.2486V20.2175H128.662ZM127.093 20.1695H126.093V21.1393L127.062 21.169L127.093 20.1695ZM127.093 18.0513L127.124 17.0517L126.093 17.0202V18.0513H127.093ZM128.662 18.0993H129.662V17.1294L128.692 17.0998L128.662 18.0993ZM129.206 17.379L130.017 16.7947C129.848 16.5591 129.469 16.1656 128.886 16.1656V17.1656V18.1656C128.689 18.1656 128.554 18.0936 128.493 18.0528C128.429 18.0101 128.401 17.9721 128.394 17.9633L129.206 17.379ZM128.886 17.1656L128.914 16.166L126.646 16.102L126.618 17.1016L126.59 18.1012L128.857 18.1652L128.886 17.1656ZM126.618 17.1016V16.1016C126.229 16.1016 125.886 16.285 125.666 16.5684C125.461 16.8329 125.394 17.1363 125.394 17.3897H126.394H127.394C127.394 17.4723 127.373 17.6317 127.246 17.7948C127.105 17.9768 126.874 18.1016 126.618 18.1016V17.1016ZM126.394 17.3897H125.394V20.4469H126.394H127.394V17.3897H126.394ZM126.394 20.4469H125.394C125.394 20.8186 125.524 21.1871 125.743 21.4791L126.543 20.8791L127.343 20.2791C127.361 20.3025 127.372 20.3243 127.379 20.3451C127.386 20.3651 127.394 20.3984 127.394 20.4469H126.394ZM126.543 20.8791L125.747 21.4842C125.912 21.7003 126.288 22.0925 126.869 22.0925V21.0925V20.0925C127.066 20.0925 127.2 20.1647 127.257 20.2022C127.316 20.2414 127.34 20.2739 127.34 20.274L126.543 20.8791ZM126.869 21.0925L126.841 22.0921L129.103 22.1561L129.131 21.1565L129.159 20.1569L126.897 20.0929L126.869 21.0925ZM129.131 21.1565L129.054 22.1536C129.459 22.1847 129.838 22.0139 130.083 21.7041C130.302 21.4269 130.361 21.1106 130.361 20.8684H129.361H128.361C128.361 20.8076 128.374 20.6407 128.513 20.4648C128.677 20.2565 128.942 20.139 129.208 20.1595L129.131 21.1565ZM129.361 20.8684H130.361V17.8112H129.361H128.361V20.8684H129.361ZM129.361 17.8112H130.361C130.361 17.4375 130.228 17.0596 129.99 16.7583L129.206 17.379L128.422 17.9997C128.4 17.9727 128.387 17.9461 128.378 17.9206C128.369 17.8959 128.361 17.86 128.361 17.8112H129.361ZM128.662 20.2175L128.692 19.2179L127.124 19.1699L127.093 20.1695L127.062 21.169L128.631 21.217L128.662 20.2175ZM127.093 20.1695H128.093V18.0513H127.093H126.093V20.1695H127.093ZM127.093 18.0513L127.062 19.0508L128.631 19.0988L128.662 18.0993L128.692 17.0998L127.124 17.0517L127.093 18.0513ZM128.662 18.0993H127.662V20.2175H128.662H129.662V18.0993H128.662Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-28-inside-3_637_1524)"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M6.50079 63.4029C5.03354 62.6559 4.09983 60.8899 4.09983 58.3769C4.09983 53.8791 7.09837 48.7037 10.7905 46.8256L35.5471 34.2125C37.1797 33.3802 38.6737 33.3268 39.8368 33.9191L37.4572 32.7079C36.2941 32.1157 34.8001 32.1691 33.1675 33.0014L8.41089 45.6144C4.71341 47.4979 1.72021 52.6733 1.72021 57.1657C1.72021 59.6787 2.65392 61.4448 4.12118 62.1917L6.50079 63.4029Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M6.50057 63.4027C7.6637 63.9949 9.15763 63.9416 10.7903 63.1092L35.5469 50.4962C39.2443 48.6128 42.2375 43.4373 42.2375 38.9449C42.2375 36.4319 41.3038 34.6658 39.8366 33.9189C38.6734 33.3266 37.1795 33.38 35.5469 34.2123L10.7903 46.8254C7.09281 48.7088 4.09961 53.8842 4.09961 58.3767C4.09961 60.8897 5.03332 62.6557 6.50057 63.4027Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <mask id="path-32-inside-4_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
-      <path d="M14.1791 51.6711C14.2698 51.5324 14.4032 51.4737 14.4886 51.5324C14.574 51.5911 14.5793 51.7511 14.5046 51.9005L14.4886 51.9326L11.2553 57.5188C11.1646 57.6735 11.0205 57.7482 10.9298 57.6842C10.8391 57.6202 10.8391 57.4441 10.9298 57.284L14.1631 51.6978L14.1791 51.6711Z" />
-    </mask>
-    <path
-      d="M14.1791 51.6711C14.2698 51.5324 14.4032 51.4737 14.4886 51.5324C14.574 51.5911 14.5793 51.7511 14.5046 51.9005L14.4886 51.9326L11.2553 57.5188C11.1646 57.6735 11.0205 57.7482 10.9298 57.6842C10.8391 57.6202 10.8391 57.4441 10.9298 57.284L14.1631 51.6978L14.1791 51.6711Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M14.1791 51.6711L13.3422 51.1239L13.3316 51.14L13.3217 51.1566L14.1791 51.6711ZM14.5046 51.9005L13.6102 51.4533L13.6102 51.4534L14.5046 51.9005ZM14.4886 51.9326L15.3541 52.4335L15.3694 52.4071L15.3831 52.3797L14.4886 51.9326ZM11.2553 57.5188L12.118 58.0245L12.1208 58.0197L11.2553 57.5188ZM10.9298 57.284L10.0643 56.7831L10.0598 56.791L10.9298 57.284ZM14.1631 51.6978L13.3057 51.1833L13.3016 51.19L13.2977 51.1969L14.1631 51.6978ZM14.1791 51.6711L15.0161 52.2184C14.9808 52.2724 14.8999 52.3711 14.743 52.4411C14.5825 52.5126 14.2477 52.5803 13.9221 52.3564L14.4886 51.5324L15.0551 50.7084C14.6441 50.4258 14.1999 50.4935 13.9287 50.6144C13.6611 50.7337 13.4682 50.9311 13.3422 51.1239L14.1791 51.6711ZM14.4886 51.5324L13.9221 52.3564C13.6072 52.14 13.5618 51.8301 13.5574 51.7228C13.5523 51.595 13.5841 51.5055 13.6102 51.4533L14.5046 51.9005L15.399 52.3478C15.4998 52.1462 15.5663 51.902 15.5558 51.6421C15.5461 51.4027 15.4553 50.9835 15.0551 50.7084L14.4886 51.5324ZM14.5046 51.9005L13.6102 51.4534L13.5942 51.4854L14.4886 51.9326L15.3831 52.3797L15.3991 52.3477L14.5046 51.9005ZM14.4886 51.9326L13.6231 51.4316L10.3898 57.0179L11.2553 57.5188L12.1208 58.0197L15.3541 52.4335L14.4886 51.9326ZM11.2553 57.5188L10.3926 57.0131C10.4213 56.9642 10.4908 56.8681 10.6373 56.7932C10.7818 56.7193 11.1467 56.6132 11.5065 56.8672L10.9298 57.6842L10.3532 58.5012C10.8037 58.8192 11.286 58.7078 11.5479 58.5739C11.8117 58.4389 11.9986 58.2281 12.118 58.0245L11.2553 57.5188ZM10.9298 57.6842L11.5065 56.8672C11.8308 57.0961 11.8618 57.42 11.8618 57.5201C11.8618 57.6453 11.8268 57.7295 11.7999 57.777L10.9298 57.284L10.0598 56.791C9.94216 56.9987 9.86182 57.2509 9.86182 57.5201C9.86182 57.7643 9.9382 58.2082 10.3532 58.5012L10.9298 57.6842ZM10.9298 57.284L11.7953 57.785L15.0286 52.1987L14.1631 51.6978L13.2977 51.1969L10.0644 56.7831L10.9298 57.284ZM14.1631 51.6978L15.0206 52.2123L15.0366 52.1857L14.1791 51.6711L13.3217 51.1566L13.3057 51.1833L14.1631 51.6978Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-32-inside-4_637_1524)"
-    />
-    <mask id="path-34-inside-5_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
-      <path d="M11.7833 53.5338C11.7833 53.299 11.6286 53.1923 11.4365 53.2884C11.2444 53.3844 11.0897 53.6512 11.0897 53.8859C11.0897 54.1207 11.2444 54.2274 11.4365 54.1314C11.6286 54.0353 11.7833 53.7685 11.7833 53.5338ZM12.2475 53.2937C12.2475 53.8379 11.8847 54.4622 11.4365 54.6916C10.9883 54.921 10.6255 54.6649 10.6255 54.1207C10.6255 53.5765 10.9883 52.9522 11.4365 52.7228C11.8847 52.4934 12.2475 52.7495 12.2475 53.2937Z" />
-    </mask>
-    <path
-      d="M11.7833 53.5338C11.7833 53.299 11.6286 53.1923 11.4365 53.2884C11.2444 53.3844 11.0897 53.6512 11.0897 53.8859C11.0897 54.1207 11.2444 54.2274 11.4365 54.1314C11.6286 54.0353 11.7833 53.7685 11.7833 53.5338ZM12.2475 53.2937C12.2475 53.8379 11.8847 54.4622 11.4365 54.6916C10.9883 54.921 10.6255 54.6649 10.6255 54.1207C10.6255 53.5765 10.9883 52.9522 11.4365 52.7228C11.8847 52.4934 12.2475 52.7495 12.2475 53.2937Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M11.7833 53.5338H12.7833C12.7833 53.2204 12.6769 52.7637 12.2565 52.4686C11.8092 52.1545 11.3108 52.2332 10.9893 52.3939L11.4365 53.2884L11.8837 54.1828C11.7542 54.2475 11.4293 54.3315 11.1073 54.1054C10.8123 53.8983 10.7833 53.6124 10.7833 53.5338H11.7833ZM11.4365 53.2884L10.9893 52.3939C10.6733 52.5519 10.4577 52.8064 10.3261 53.0332C10.1917 53.2649 10.0897 53.5617 10.0897 53.8859H11.0897H12.0897C12.0897 53.9754 12.065 54.0214 12.056 54.037C12.0488 54.0494 12.0362 54.0681 12.014 54.0907C11.9926 54.1124 11.951 54.1491 11.8837 54.1828L11.4365 53.2884ZM11.0897 53.8859H10.0897C10.0897 54.1993 10.1961 54.656 10.6164 54.9511C11.0638 55.2652 11.5621 55.1866 11.8837 55.0258L11.4365 54.1314L10.9893 53.2369C11.1187 53.1722 11.4437 53.0882 11.7657 53.3143C12.0606 53.5214 12.0897 53.8073 12.0897 53.8859H11.0897ZM11.4365 54.1314L11.8837 55.0258C12.1997 54.8678 12.4152 54.6133 12.5468 54.3865C12.6813 54.1548 12.7833 53.858 12.7833 53.5338H11.7833H10.7833C10.7833 53.4443 10.8079 53.3983 10.817 53.3827C10.8242 53.3703 10.8367 53.3516 10.859 53.329C10.8803 53.3073 10.9219 53.2706 10.9893 53.2369L11.4365 54.1314ZM12.2475 53.2937H11.2475C11.2475 53.357 11.2213 53.4776 11.1452 53.6087C11.11 53.6693 11.0717 53.7185 11.0371 53.7539C11.0016 53.7903 10.9802 53.8018 10.9808 53.8014L11.4365 54.6916L11.8921 55.5817C12.3309 55.3571 12.66 54.983 12.8749 54.6127C13.0923 54.2383 13.2475 53.7746 13.2475 53.2937H12.2475ZM11.4365 54.6916L10.9808 53.8014C10.9826 53.8005 11.0323 53.7755 11.1233 53.7757C11.2207 53.776 11.3357 53.8061 11.4389 53.8788C11.6468 54.0253 11.6255 54.1939 11.6255 54.1207H10.6255H9.62549C9.62549 54.5917 9.78557 55.1605 10.287 55.5137C10.8187 55.8884 11.4365 55.815 11.8921 55.5817L11.4365 54.6916ZM10.6255 54.1207H11.6255C11.6255 54.0574 11.6517 53.9368 11.7278 53.8057C11.763 53.745 11.8012 53.6959 11.8359 53.6604C11.8714 53.6241 11.8928 53.6126 11.8921 53.6129L11.4365 52.7228L10.9808 51.8326C10.5421 52.0572 10.213 52.4314 9.99806 52.8017C9.7807 53.1761 9.62549 53.6397 9.62549 54.1207H10.6255ZM11.4365 52.7228L11.8921 53.6129C11.8904 53.6139 11.8407 53.6389 11.7497 53.6387C11.6522 53.6384 11.5372 53.6083 11.4341 53.5356C11.2261 53.3891 11.2475 53.2205 11.2475 53.2937H12.2475H13.2475C13.2475 52.8227 13.0874 52.2539 12.586 51.9006C12.0542 51.526 11.4364 51.5994 10.9808 51.8326L11.4365 52.7228Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-34-inside-5_637_1524)"
-    />
-    <mask id="path-36-inside-6_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
-      <path d="M14.3228 55.3307C14.3228 55.0959 14.1681 54.9892 13.976 55.0852C13.784 55.1813 13.6292 55.448 13.6292 55.6828C13.6292 55.9176 13.784 56.0243 13.976 55.9282C14.1681 55.8322 14.3228 55.5654 14.3228 55.3307ZM14.787 55.0906C14.787 55.6348 14.4242 56.259 13.976 56.4885C13.5279 56.7179 13.165 56.4618 13.165 55.9176C13.165 55.3733 13.5279 54.7491 13.976 54.5197C14.4242 54.2902 14.787 54.5463 14.787 55.0906Z" />
-    </mask>
-    <path
-      d="M14.3228 55.3307C14.3228 55.0959 14.1681 54.9892 13.976 55.0852C13.784 55.1813 13.6292 55.448 13.6292 55.6828C13.6292 55.9176 13.784 56.0243 13.976 55.9282C14.1681 55.8322 14.3228 55.5654 14.3228 55.3307ZM14.787 55.0906C14.787 55.6348 14.4242 56.259 13.976 56.4885C13.5279 56.7179 13.165 56.4618 13.165 55.9176C13.165 55.3733 13.5279 54.7491 13.976 54.5197C14.4242 54.2902 14.787 54.5463 14.787 55.0906Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M14.3228 55.3307H15.3228C15.3228 55.0172 15.2164 54.5606 14.7961 54.2655C14.3487 53.9514 13.8504 54.03 13.5288 54.1908L13.976 55.0852L14.4232 55.9797C14.2938 56.0444 13.9688 56.1284 13.6468 55.9023C13.3519 55.6952 13.3228 55.4093 13.3228 55.3307H14.3228ZM13.976 55.0852L13.5288 54.1908C13.2128 54.3488 12.9973 54.6033 12.8657 54.8301C12.7312 55.0618 12.6292 55.3585 12.6292 55.6828H13.6292H14.6292C14.6292 55.7723 14.6046 55.8183 14.5955 55.8339C14.5883 55.8463 14.5758 55.8649 14.5535 55.8875C14.5322 55.9092 14.4906 55.946 14.4232 55.9797L13.976 55.0852ZM13.6292 55.6828H12.6292C12.6292 55.9962 12.7356 56.4529 13.156 56.748C13.6034 57.0621 14.1017 56.9834 14.4232 56.8227L13.976 55.9282L13.5288 55.0338C13.6583 54.9691 13.9832 54.8851 14.3052 55.1111C14.6002 55.3182 14.6292 55.6042 14.6292 55.6828H13.6292ZM13.976 55.9282L14.4232 56.8227C14.7393 56.6647 14.9548 56.4102 15.0864 56.1833C15.2208 55.9517 15.3228 55.6549 15.3228 55.3307H14.3228H13.3228C13.3228 55.2412 13.3475 55.1952 13.3565 55.1796C13.3637 55.1672 13.3763 55.1485 13.3985 55.1259C13.4199 55.1042 13.4615 55.0675 13.5288 55.0338L13.976 55.9282ZM14.787 55.0906H13.787C13.787 55.1538 13.7608 55.2744 13.6847 55.4055C13.6495 55.4662 13.6113 55.5154 13.5767 55.5508C13.5411 55.5872 13.5197 55.5986 13.5204 55.5983L13.976 56.4885L14.4317 57.3786C14.8704 57.154 15.1995 56.7799 15.4144 56.4096C15.6318 56.0351 15.787 55.5715 15.787 55.0906H14.787ZM13.976 56.4885L13.5204 55.5983C13.5222 55.5974 13.5718 55.5723 13.6628 55.5726C13.7603 55.5728 13.8753 55.603 13.9784 55.6756C14.1864 55.8221 14.165 55.9908 14.165 55.9176H13.165H12.165C12.165 56.3885 12.3251 56.9574 12.8265 57.3106C13.3583 57.6853 13.9761 57.6118 14.4317 57.3786L13.976 56.4885ZM13.165 55.9176H14.165C14.165 55.8543 14.1912 55.7337 14.2673 55.6026C14.3025 55.5419 14.3408 55.4927 14.3754 55.4573C14.4109 55.4209 14.4324 55.4095 14.4317 55.4098L13.976 54.5197L13.5204 53.6295C13.0816 53.8541 12.7526 54.2283 12.5376 54.5985C12.3203 54.973 12.165 55.4366 12.165 55.9176H13.165ZM13.976 54.5197L14.4317 55.4098C14.4299 55.4107 14.3802 55.4358 14.2892 55.4355C14.1918 55.4353 14.0768 55.4051 13.9736 55.3325C13.7657 55.186 13.787 55.0173 13.787 55.0906H14.787H15.787C15.787 54.6196 15.6269 54.0508 15.1255 53.6975C14.5938 53.3229 13.976 53.3963 13.5204 53.6295L13.976 54.5197Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-36-inside-6_637_1524)"
-    />
-    <mask id="path-38-inside-7_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
-      <path d="M12.6314 49.6269C12.6314 49.4775 12.7328 49.3067 12.8555 49.2481C13.5758 48.9279 14.2748 48.8212 14.899 48.9546C15.5873 49.0987 16.1475 49.5202 16.537 50.1711C16.9211 50.822 17.1132 51.6864 17.0919 52.6627C17.0705 53.6445 16.8304 54.7062 16.4089 55.7413C15.9821 56.7764 15.3845 57.7475 14.6802 58.5531C13.9706 59.3588 13.181 59.967 12.386 60.3138C11.591 60.6606 10.8227 60.7407 10.1611 60.5379C9.56353 60.3512 9.06733 59.9457 8.72586 59.3481C8.66717 59.2467 8.71519 59.06 8.82724 58.9373C8.93928 58.8145 9.07267 58.8039 9.13136 58.9052C9.44082 59.4335 9.87832 59.7909 10.4119 59.9563C11.0094 60.1377 11.6977 60.0684 12.4127 59.7536C13.1276 59.4388 13.8426 58.8946 14.4775 58.169C15.1124 57.4433 15.6513 56.5736 16.0355 55.6399C16.4196 54.7062 16.6277 53.7512 16.649 52.8655C16.6704 51.9851 16.4996 51.2062 16.1528 50.6193C15.806 50.0324 15.2992 49.6535 14.6802 49.5255C14.1254 49.4081 13.5064 49.4988 12.8662 49.7816C12.7435 49.835 12.6421 49.7656 12.6421 49.6162L12.6314 49.6269Z" />
-    </mask>
-    <path
-      d="M12.6314 49.6269C12.6314 49.4775 12.7328 49.3067 12.8555 49.2481C13.5758 48.9279 14.2748 48.8212 14.899 48.9546C15.5873 49.0987 16.1475 49.5202 16.537 50.1711C16.9211 50.822 17.1132 51.6864 17.0919 52.6627C17.0705 53.6445 16.8304 54.7062 16.4089 55.7413C15.9821 56.7764 15.3845 57.7475 14.6802 58.5531C13.9706 59.3588 13.181 59.967 12.386 60.3138C11.591 60.6606 10.8227 60.7407 10.1611 60.5379C9.56353 60.3512 9.06733 59.9457 8.72586 59.3481C8.66717 59.2467 8.71519 59.06 8.82724 58.9373C8.93928 58.8145 9.07267 58.8039 9.13136 58.9052C9.44082 59.4335 9.87832 59.7909 10.4119 59.9563C11.0094 60.1377 11.6977 60.0684 12.4127 59.7536C13.1276 59.4388 13.8426 58.8946 14.4775 58.169C15.1124 57.4433 15.6513 56.5736 16.0355 55.6399C16.4196 54.7062 16.6277 53.7512 16.649 52.8655C16.6704 51.9851 16.4996 51.2062 16.1528 50.6193C15.806 50.0324 15.2992 49.6535 14.6802 49.5255C14.1254 49.4081 13.5064 49.4988 12.8662 49.7816C12.7435 49.835 12.6421 49.7656 12.6421 49.6162L12.6314 49.6269Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M12.6314 49.6269H11.6314V52.0414L13.3386 50.3339L12.6314 49.6269ZM12.8555 49.2481L12.4494 48.3342L12.4366 48.3399L12.4241 48.3459L12.8555 49.2481ZM14.899 48.9546L14.69 49.9325L14.6941 49.9334L14.899 48.9546ZM16.537 50.1711L17.3982 49.6628L17.3951 49.6576L16.537 50.1711ZM17.0919 52.6627L16.0921 52.6409L16.0921 52.641L17.0919 52.6627ZM16.4089 55.7413L17.3334 56.1226L17.3351 56.1185L16.4089 55.7413ZM14.6802 58.5531L15.4307 59.2141L15.4331 59.2113L14.6802 58.5531ZM10.1611 60.5379L9.86283 61.4924L9.8681 61.494L10.1611 60.5379ZM8.72586 59.3481L9.59412 58.8519L9.59129 58.8471L8.72586 59.3481ZM9.13136 58.9052L8.26592 59.4063L8.26853 59.4107L9.13136 58.9052ZM10.4119 59.9563L10.1158 60.9115L10.1214 60.9132L10.4119 59.9563ZM16.649 52.8655L15.6493 52.8413L15.6493 52.8414L16.649 52.8655ZM14.6802 49.5255L14.4733 50.5039L14.4776 50.5048L14.6802 49.5255ZM12.8662 49.7816L13.2649 50.6987L13.2702 50.6964L12.8662 49.7816ZM12.6421 49.6162H13.6421V47.2017L11.9349 48.9092L12.6421 49.6162ZM12.6314 49.6269H13.6314C13.6314 49.7646 13.5901 49.8587 13.5579 49.913C13.5288 49.9621 13.4526 50.071 13.287 50.1502L12.8555 49.2481L12.4241 48.3459C12.1358 48.4838 11.9475 48.7074 11.837 48.8939C11.7235 49.0856 11.6314 49.3397 11.6314 49.6269H12.6314ZM12.8555 49.2481L13.2617 50.1619C13.8447 49.9027 14.3251 49.8546 14.69 49.9325L14.899 48.9546L15.108 47.9767C14.2244 47.7879 13.3069 47.9531 12.4494 48.3342L12.8555 49.2481ZM14.899 48.9546L14.6941 49.9334C15.0795 50.014 15.4163 50.2457 15.6789 50.6845L16.537 50.1711L17.3951 49.6576C16.8787 48.7947 16.0951 48.1833 15.1039 47.9758L14.899 48.9546ZM16.537 50.1711L15.6758 50.6793C15.9411 51.129 16.1106 51.7966 16.0921 52.6409L17.0919 52.6627L18.0916 52.6846C18.1159 51.5761 17.9011 50.515 17.3982 49.6628L16.537 50.1711ZM17.0919 52.6627L16.0921 52.641C16.0739 53.4811 15.8663 54.4223 15.4828 55.3642L16.4089 55.7413L17.3351 56.1185C17.7946 54.9902 18.0672 53.8078 18.0916 52.6845L17.0919 52.6627ZM16.4089 55.7413L15.4845 55.3601C15.0975 56.2984 14.5567 57.175 13.9274 57.895L14.6802 58.5531L15.4331 59.2113C16.2124 58.3199 16.8667 57.2544 17.3334 56.1225L16.4089 55.7413ZM14.6802 58.5531L13.9298 57.8921C13.2931 58.615 12.6174 59.1218 11.9861 59.3972L12.386 60.3138L12.7858 61.2304C13.7445 60.8122 14.6481 60.1025 15.4307 59.2141L14.6802 58.5531ZM12.386 60.3138L11.9861 59.3972C11.3489 59.6752 10.8309 59.6973 10.4541 59.5818L10.1611 60.5379L9.8681 61.494C10.8145 61.784 11.8331 61.646 12.7858 61.2304L12.386 60.3138ZM10.1611 60.5379L10.4594 59.5834C10.1205 59.4775 9.81975 59.2468 9.59411 58.852L8.72586 59.3481L7.85762 59.8442C8.31492 60.6445 9.00659 61.2248 9.86283 61.4924L10.1611 60.5379ZM8.72586 59.3481L9.59129 58.8471C9.67218 58.9868 9.6945 59.1162 9.69943 59.1991C9.70445 59.2837 9.69354 59.3497 9.68267 59.3932C9.66228 59.4747 9.62472 59.5469 9.56572 59.6115L8.82724 58.9373L8.08875 58.263C7.91771 58.4503 7.80011 58.6772 7.74238 58.9081C7.69157 59.1114 7.64868 59.4834 7.86044 59.8491L8.72586 59.3481ZM8.82724 58.9373L9.56572 59.6115C9.51185 59.6705 9.36053 59.8067 9.0964 59.8325C8.95667 59.8461 8.78955 59.8262 8.62497 59.7433C8.45877 59.6596 8.33993 59.5341 8.26593 59.4063L9.13136 58.9052L9.99679 58.4042C9.765 58.0039 9.33453 57.7998 8.90221 57.8419C8.5287 57.8784 8.25467 58.0813 8.08875 58.263L8.82724 58.9373ZM9.13136 58.9052L8.26853 59.4107C8.69234 60.1341 9.32239 60.6655 10.1158 60.9115L10.4119 59.9563L10.708 59.0012C10.4343 58.9163 10.1893 58.7328 9.99419 58.3998L9.13136 58.9052ZM10.4119 59.9563L10.1214 60.9132C11.0001 61.18 11.938 61.0552 12.8156 60.6688L12.4127 59.7536L12.0097 58.8384C11.4574 59.0815 11.0187 59.0955 10.7024 58.9995L10.4119 59.9563ZM12.4127 59.7536L12.8156 60.6688C13.6886 60.2844 14.5178 59.6415 15.2301 58.8275L14.4775 58.169L13.7249 57.5104C13.1674 58.1477 12.5666 58.5932 12.0097 58.8384L12.4127 59.7536ZM14.4775 58.169L15.2301 58.8275C15.9388 58.0174 16.5353 57.0534 16.9602 56.0204L16.0355 55.6399L15.1107 55.2595C14.7674 56.0939 14.286 56.8692 13.7249 57.5104L14.4775 58.169ZM16.0355 55.6399L16.9602 56.0204C17.3859 54.9859 17.6241 53.9104 17.6487 52.8896L16.649 52.8655L15.6493 52.8414C15.6312 53.592 15.4533 54.4266 15.1107 55.2595L16.0355 55.6399ZM16.649 52.8655L17.6487 52.8897C17.6733 51.878 17.4807 50.9007 17.0138 50.1105L16.1528 50.6193L15.2919 51.128C15.5186 51.5116 15.6675 52.0923 15.6493 52.8413L16.649 52.8655ZM16.1528 50.6193L17.0138 50.1105C16.538 49.3055 15.8043 48.7369 14.8829 48.5462L14.6802 49.5255L14.4776 50.5048C14.794 50.5702 15.074 50.7593 15.2919 51.128L16.1528 50.6193ZM14.6802 49.5255L14.8872 48.5471C14.0782 48.376 13.243 48.522 12.4622 48.8668L12.8662 49.7816L13.2702 50.6964C13.7699 50.4757 14.1725 50.4402 14.4733 50.5038L14.6802 49.5255ZM12.8662 49.7816L12.4675 48.8645C12.6447 48.7875 12.9796 48.7378 13.2931 48.9639C13.5906 49.1784 13.6421 49.4789 13.6421 49.6162H12.6421H11.6421C11.6421 49.9029 11.7443 50.3127 12.1231 50.586C12.518 50.8708 12.965 50.8291 13.2649 50.6987L12.8662 49.7816ZM12.6421 49.6162L11.9349 48.9092L11.9243 48.9198L12.6314 49.6269L13.3386 50.3339L13.3493 50.3232L12.6421 49.6162Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-38-inside-7_637_1524)"
-    />
-    <path
-      d="M32.6416 43.9189C32.8989 43.7886 33.0298 43.841 33.082 43.8779C33.1494 43.9259 33.2655 44.0754 33.2656 44.4287C33.2656 44.7781 33.1461 45.1793 32.9375 45.5391C32.7276 45.901 32.4543 46.1752 32.1895 46.3096H32.1885L23.1289 50.9248C22.8717 51.0551 22.7416 51.0037 22.6895 50.9668C22.6221 50.919 22.506 50.7697 22.5059 50.416C22.5059 50.0667 22.6245 49.6653 22.833 49.3057C23.043 48.9437 23.3171 48.6695 23.582 48.5352H23.583L32.6416 43.9189Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M49.4459 2.57338C48.2828 1.98115 46.7889 2.02916 45.1509 2.86683C41.4534 4.75025 38.4602 9.92566 38.4602 14.4181C38.4602 16.9258 39.3939 18.6972 40.8611 19.4441L38.4815 18.233C37.0143 17.486 36.0806 15.7146 36.0806 13.207C36.0806 8.70917 39.0791 3.53377 42.7712 1.65568C44.4039 0.823348 45.9032 0.769994 47.0663 1.36223L49.4459 2.57338Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M49.4457 2.57317C50.9129 3.32013 51.8467 5.09151 51.8467 7.59918C51.8467 12.097 48.8481 17.2724 45.156 19.1505C43.5233 19.9828 42.0241 20.0362 40.8609 19.4439C39.3937 18.697 38.46 16.9256 38.46 14.4179C38.46 9.92011 41.4585 4.7447 45.1506 2.86662C46.7833 2.03429 48.2826 1.98093 49.4457 2.57317Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M43.2979 15.4766C43.2572 15.4566 43.2179 15.4351 43.1797 15.4121C43.2187 15.4347 43.2578 15.4566 43.2979 15.4766Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M44.0566 13.6064C44.14 13.661 44.226 13.7069 44.3154 13.7422C44.2284 13.7154 44.1512 13.6777 44.085 13.6309C44.0749 13.6238 44.0666 13.6142 44.0566 13.6064ZM46.8799 8.31543C46.9113 8.32939 46.9406 8.34529 46.9688 8.3623C46.9394 8.34564 46.9099 8.32983 46.8799 8.31543Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M129.206 17.379L128.394 17.9633L128.408 17.9818L128.422 17.9997L129.206 17.379ZM128.886 17.1656L128.857 18.1652L128.872 18.1656H128.886V17.1656ZM126.618 17.1016L126.646 16.102L126.632 16.1016H126.618V17.1016ZM126.543 20.8791L125.743 21.4791L125.747 21.4842L126.543 20.8791ZM126.869 21.0925L126.897 20.0929L126.883 20.0925H126.869V21.0925ZM129.131 21.1565L129.208 20.1595L129.184 20.1576L129.159 20.1569L129.131 21.1565ZM128.662 20.2175L128.631 21.217L129.662 21.2486V20.2175H128.662ZM127.093 20.1695H126.093V21.1393L127.062 21.169L127.093 20.1695ZM127.093 18.0513L127.124 17.0517L126.093 17.0202V18.0513H127.093ZM128.662 18.0993H129.662V17.1294L128.692 17.0998L128.662 18.0993ZM129.206 17.379L130.017 16.7947C129.848 16.5591 129.469 16.1656 128.886 16.1656V17.1656V18.1656C128.689 18.1656 128.554 18.0936 128.493 18.0528C128.429 18.0101 128.401 17.9721 128.394 17.9633L129.206 17.379ZM128.886 17.1656L128.914 16.166L126.646 16.102L126.618 17.1016L126.59 18.1012L128.857 18.1652L128.886 17.1656ZM126.618 17.1016V16.1016C126.229 16.1016 125.886 16.285 125.666 16.5684C125.461 16.8329 125.394 17.1363 125.394 17.3897H126.394H127.394C127.394 17.4723 127.373 17.6317 127.246 17.7948C127.105 17.9768 126.874 18.1016 126.618 18.1016V17.1016ZM126.394 17.3897H125.394V20.4469H126.394H127.394V17.3897H126.394ZM126.394 20.4469H125.394C125.394 20.8186 125.524 21.1871 125.743 21.4791L126.543 20.8791L127.343 20.2791C127.361 20.3025 127.372 20.3243 127.379 20.3451C127.386 20.3651 127.394 20.3984 127.394 20.4469H126.394ZM126.543 20.8791L125.747 21.4842C125.912 21.7003 126.288 22.0925 126.869 22.0925V21.0925V20.0925C127.066 20.0925 127.2 20.1647 127.257 20.2022C127.316 20.2414 127.34 20.2739 127.34 20.274L126.543 20.8791ZM126.869 21.0925L126.841 22.0921L129.103 22.1561L129.131 21.1565L129.159 20.1569L126.897 20.0929L126.869 21.0925ZM129.131 21.1565L129.054 22.1536C129.459 22.1847 129.838 22.0139 130.083 21.7041C130.302 21.4269 130.361 21.1106 130.361 20.8684H129.361H128.361C128.361 20.8076 128.374 20.6407 128.513 20.4648C128.677 20.2565 128.942 20.139 129.208 20.1595L129.131 21.1565ZM129.361 20.8684H130.361V17.8112H129.361H128.361V20.8684H129.361ZM129.361 17.8112H130.361C130.361 17.4375 130.228 17.0596 129.99 16.7583L129.206 17.379L128.422 17.9997C128.4 17.9727 128.387 17.9461 128.378 17.9206C128.369 17.8959 128.361 17.86 128.361 17.8112H129.361ZM128.662 20.2175L128.692 19.2179L127.124 19.1699L127.093 20.1695L127.062 21.169L128.631 21.217L128.662 20.2175ZM127.093 20.1695H128.093V18.0513H127.093H126.093V20.1695H127.093ZM127.093 18.0513L127.062 19.0508L128.631 19.0988L128.662 18.0993L128.692 17.0998L127.124 17.0517L127.093 18.0513ZM128.662 18.0993H127.662V20.2175H128.662H129.662V18.0993H128.662Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-28-inside-3_637_1524)"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M6.50079 63.4029C5.03354 62.6559 4.09983 60.8899 4.09983 58.3769C4.09983 53.8791 7.09837 48.7037 10.7905 46.8256L35.5471 34.2125C37.1797 33.3802 38.6737 33.3268 39.8368 33.9191L37.4572 32.7079C36.2941 32.1157 34.8001 32.1691 33.1675 33.0014L8.41089 45.6144C4.71341 47.4979 1.72021 52.6733 1.72021 57.1657C1.72021 59.6787 2.65392 61.4448 4.12118 62.1917L6.50079 63.4029Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M6.50057 63.4027C7.6637 63.9949 9.15763 63.9416 10.7903 63.1092L35.5469 50.4962C39.2443 48.6128 42.2375 43.4373 42.2375 38.9449C42.2375 36.4319 41.3038 34.6658 39.8366 33.9189C38.6734 33.3266 37.1795 33.38 35.5469 34.2123L10.7903 46.8254C7.09281 48.7088 4.09961 53.8842 4.09961 58.3767C4.09961 60.8897 5.03332 62.6557 6.50057 63.4027Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <mask id="path-32-inside-4_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path d="M14.1791 51.6711C14.2698 51.5324 14.4032 51.4737 14.4886 51.5324C14.574 51.5911 14.5793 51.7511 14.5046 51.9005L14.4886 51.9326L11.2553 57.5188C11.1646 57.6735 11.0205 57.7482 10.9298 57.6842C10.8391 57.6202 10.8391 57.4441 10.9298 57.284L14.1631 51.6978L14.1791 51.6711Z" />
+      </mask>
+      <path
+        d="M14.1791 51.6711C14.2698 51.5324 14.4032 51.4737 14.4886 51.5324C14.574 51.5911 14.5793 51.7511 14.5046 51.9005L14.4886 51.9326L11.2553 57.5188C11.1646 57.6735 11.0205 57.7482 10.9298 57.6842C10.8391 57.6202 10.8391 57.4441 10.9298 57.284L14.1631 51.6978L14.1791 51.6711Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M14.1791 51.6711L13.3422 51.1239L13.3316 51.14L13.3217 51.1566L14.1791 51.6711ZM14.5046 51.9005L13.6102 51.4533L13.6102 51.4534L14.5046 51.9005ZM14.4886 51.9326L15.3541 52.4335L15.3694 52.4071L15.3831 52.3797L14.4886 51.9326ZM11.2553 57.5188L12.118 58.0245L12.1208 58.0197L11.2553 57.5188ZM10.9298 57.284L10.0643 56.7831L10.0598 56.791L10.9298 57.284ZM14.1631 51.6978L13.3057 51.1833L13.3016 51.19L13.2977 51.1969L14.1631 51.6978ZM14.1791 51.6711L15.0161 52.2184C14.9808 52.2724 14.8999 52.3711 14.743 52.4411C14.5825 52.5126 14.2477 52.5803 13.9221 52.3564L14.4886 51.5324L15.0551 50.7084C14.6441 50.4258 14.1999 50.4935 13.9287 50.6144C13.6611 50.7337 13.4682 50.9311 13.3422 51.1239L14.1791 51.6711ZM14.4886 51.5324L13.9221 52.3564C13.6072 52.14 13.5618 51.8301 13.5574 51.7228C13.5523 51.595 13.5841 51.5055 13.6102 51.4533L14.5046 51.9005L15.399 52.3478C15.4998 52.1462 15.5663 51.902 15.5558 51.6421C15.5461 51.4027 15.4553 50.9835 15.0551 50.7084L14.4886 51.5324ZM14.5046 51.9005L13.6102 51.4534L13.5942 51.4854L14.4886 51.9326L15.3831 52.3797L15.3991 52.3477L14.5046 51.9005ZM14.4886 51.9326L13.6231 51.4316L10.3898 57.0179L11.2553 57.5188L12.1208 58.0197L15.3541 52.4335L14.4886 51.9326ZM11.2553 57.5188L10.3926 57.0131C10.4213 56.9642 10.4908 56.8681 10.6373 56.7932C10.7818 56.7193 11.1467 56.6132 11.5065 56.8672L10.9298 57.6842L10.3532 58.5012C10.8037 58.8192 11.286 58.7078 11.5479 58.5739C11.8117 58.4389 11.9986 58.2281 12.118 58.0245L11.2553 57.5188ZM10.9298 57.6842L11.5065 56.8672C11.8308 57.0961 11.8618 57.42 11.8618 57.5201C11.8618 57.6453 11.8268 57.7295 11.7999 57.777L10.9298 57.284L10.0598 56.791C9.94216 56.9987 9.86182 57.2509 9.86182 57.5201C9.86182 57.7643 9.9382 58.2082 10.3532 58.5012L10.9298 57.6842ZM10.9298 57.284L11.7953 57.785L15.0286 52.1987L14.1631 51.6978L13.2977 51.1969L10.0644 56.7831L10.9298 57.284ZM14.1631 51.6978L15.0206 52.2123L15.0366 52.1857L14.1791 51.6711L13.3217 51.1566L13.3057 51.1833L14.1631 51.6978Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-32-inside-4_637_1524)"
+      />
+      <mask id="path-34-inside-5_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path d="M11.7833 53.5338C11.7833 53.299 11.6286 53.1923 11.4365 53.2884C11.2444 53.3844 11.0897 53.6512 11.0897 53.8859C11.0897 54.1207 11.2444 54.2274 11.4365 54.1314C11.6286 54.0353 11.7833 53.7685 11.7833 53.5338ZM12.2475 53.2937C12.2475 53.8379 11.8847 54.4622 11.4365 54.6916C10.9883 54.921 10.6255 54.6649 10.6255 54.1207C10.6255 53.5765 10.9883 52.9522 11.4365 52.7228C11.8847 52.4934 12.2475 52.7495 12.2475 53.2937Z" />
+      </mask>
+      <path
+        d="M11.7833 53.5338C11.7833 53.299 11.6286 53.1923 11.4365 53.2884C11.2444 53.3844 11.0897 53.6512 11.0897 53.8859C11.0897 54.1207 11.2444 54.2274 11.4365 54.1314C11.6286 54.0353 11.7833 53.7685 11.7833 53.5338ZM12.2475 53.2937C12.2475 53.8379 11.8847 54.4622 11.4365 54.6916C10.9883 54.921 10.6255 54.6649 10.6255 54.1207C10.6255 53.5765 10.9883 52.9522 11.4365 52.7228C11.8847 52.4934 12.2475 52.7495 12.2475 53.2937Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M11.7833 53.5338H12.7833C12.7833 53.2204 12.6769 52.7637 12.2565 52.4686C11.8092 52.1545 11.3108 52.2332 10.9893 52.3939L11.4365 53.2884L11.8837 54.1828C11.7542 54.2475 11.4293 54.3315 11.1073 54.1054C10.8123 53.8983 10.7833 53.6124 10.7833 53.5338H11.7833ZM11.4365 53.2884L10.9893 52.3939C10.6733 52.5519 10.4577 52.8064 10.3261 53.0332C10.1917 53.2649 10.0897 53.5617 10.0897 53.8859H11.0897H12.0897C12.0897 53.9754 12.065 54.0214 12.056 54.037C12.0488 54.0494 12.0362 54.0681 12.014 54.0907C11.9926 54.1124 11.951 54.1491 11.8837 54.1828L11.4365 53.2884ZM11.0897 53.8859H10.0897C10.0897 54.1993 10.1961 54.656 10.6164 54.9511C11.0638 55.2652 11.5621 55.1866 11.8837 55.0258L11.4365 54.1314L10.9893 53.2369C11.1187 53.1722 11.4437 53.0882 11.7657 53.3143C12.0606 53.5214 12.0897 53.8073 12.0897 53.8859H11.0897ZM11.4365 54.1314L11.8837 55.0258C12.1997 54.8678 12.4152 54.6133 12.5468 54.3865C12.6813 54.1548 12.7833 53.858 12.7833 53.5338H11.7833H10.7833C10.7833 53.4443 10.8079 53.3983 10.817 53.3827C10.8242 53.3703 10.8367 53.3516 10.859 53.329C10.8803 53.3073 10.9219 53.2706 10.9893 53.2369L11.4365 54.1314ZM12.2475 53.2937H11.2475C11.2475 53.357 11.2213 53.4776 11.1452 53.6087C11.11 53.6693 11.0717 53.7185 11.0371 53.7539C11.0016 53.7903 10.9802 53.8018 10.9808 53.8014L11.4365 54.6916L11.8921 55.5817C12.3309 55.3571 12.66 54.983 12.8749 54.6127C13.0923 54.2383 13.2475 53.7746 13.2475 53.2937H12.2475ZM11.4365 54.6916L10.9808 53.8014C10.9826 53.8005 11.0323 53.7755 11.1233 53.7757C11.2207 53.776 11.3357 53.8061 11.4389 53.8788C11.6468 54.0253 11.6255 54.1939 11.6255 54.1207H10.6255H9.62549C9.62549 54.5917 9.78557 55.1605 10.287 55.5137C10.8187 55.8884 11.4365 55.815 11.8921 55.5817L11.4365 54.6916ZM10.6255 54.1207H11.6255C11.6255 54.0574 11.6517 53.9368 11.7278 53.8057C11.763 53.745 11.8012 53.6959 11.8359 53.6604C11.8714 53.6241 11.8928 53.6126 11.8921 53.6129L11.4365 52.7228L10.9808 51.8326C10.5421 52.0572 10.213 52.4314 9.99806 52.8017C9.7807 53.1761 9.62549 53.6397 9.62549 54.1207H10.6255ZM11.4365 52.7228L11.8921 53.6129C11.8904 53.6139 11.8407 53.6389 11.7497 53.6387C11.6522 53.6384 11.5372 53.6083 11.4341 53.5356C11.2261 53.3891 11.2475 53.2205 11.2475 53.2937H12.2475H13.2475C13.2475 52.8227 13.0874 52.2539 12.586 51.9006C12.0542 51.526 11.4364 51.5994 10.9808 51.8326L11.4365 52.7228Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-34-inside-5_637_1524)"
+      />
+      <mask id="path-36-inside-6_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path d="M14.3228 55.3307C14.3228 55.0959 14.1681 54.9892 13.976 55.0852C13.784 55.1813 13.6292 55.448 13.6292 55.6828C13.6292 55.9176 13.784 56.0243 13.976 55.9282C14.1681 55.8322 14.3228 55.5654 14.3228 55.3307ZM14.787 55.0906C14.787 55.6348 14.4242 56.259 13.976 56.4885C13.5279 56.7179 13.165 56.4618 13.165 55.9176C13.165 55.3733 13.5279 54.7491 13.976 54.5197C14.4242 54.2902 14.787 54.5463 14.787 55.0906Z" />
+      </mask>
+      <path
+        d="M14.3228 55.3307C14.3228 55.0959 14.1681 54.9892 13.976 55.0852C13.784 55.1813 13.6292 55.448 13.6292 55.6828C13.6292 55.9176 13.784 56.0243 13.976 55.9282C14.1681 55.8322 14.3228 55.5654 14.3228 55.3307ZM14.787 55.0906C14.787 55.6348 14.4242 56.259 13.976 56.4885C13.5279 56.7179 13.165 56.4618 13.165 55.9176C13.165 55.3733 13.5279 54.7491 13.976 54.5197C14.4242 54.2902 14.787 54.5463 14.787 55.0906Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M14.3228 55.3307H15.3228C15.3228 55.0172 15.2164 54.5606 14.7961 54.2655C14.3487 53.9514 13.8504 54.03 13.5288 54.1908L13.976 55.0852L14.4232 55.9797C14.2938 56.0444 13.9688 56.1284 13.6468 55.9023C13.3519 55.6952 13.3228 55.4093 13.3228 55.3307H14.3228ZM13.976 55.0852L13.5288 54.1908C13.2128 54.3488 12.9973 54.6033 12.8657 54.8301C12.7312 55.0618 12.6292 55.3585 12.6292 55.6828H13.6292H14.6292C14.6292 55.7723 14.6046 55.8183 14.5955 55.8339C14.5883 55.8463 14.5758 55.8649 14.5535 55.8875C14.5322 55.9092 14.4906 55.946 14.4232 55.9797L13.976 55.0852ZM13.6292 55.6828H12.6292C12.6292 55.9962 12.7356 56.4529 13.156 56.748C13.6034 57.0621 14.1017 56.9834 14.4232 56.8227L13.976 55.9282L13.5288 55.0338C13.6583 54.9691 13.9832 54.8851 14.3052 55.1111C14.6002 55.3182 14.6292 55.6042 14.6292 55.6828H13.6292ZM13.976 55.9282L14.4232 56.8227C14.7393 56.6647 14.9548 56.4102 15.0864 56.1833C15.2208 55.9517 15.3228 55.6549 15.3228 55.3307H14.3228H13.3228C13.3228 55.2412 13.3475 55.1952 13.3565 55.1796C13.3637 55.1672 13.3763 55.1485 13.3985 55.1259C13.4199 55.1042 13.4615 55.0675 13.5288 55.0338L13.976 55.9282ZM14.787 55.0906H13.787C13.787 55.1538 13.7608 55.2744 13.6847 55.4055C13.6495 55.4662 13.6113 55.5154 13.5767 55.5508C13.5411 55.5872 13.5197 55.5986 13.5204 55.5983L13.976 56.4885L14.4317 57.3786C14.8704 57.154 15.1995 56.7799 15.4144 56.4096C15.6318 56.0351 15.787 55.5715 15.787 55.0906H14.787ZM13.976 56.4885L13.5204 55.5983C13.5222 55.5974 13.5718 55.5723 13.6628 55.5726C13.7603 55.5728 13.8753 55.603 13.9784 55.6756C14.1864 55.8221 14.165 55.9908 14.165 55.9176H13.165H12.165C12.165 56.3885 12.3251 56.9574 12.8265 57.3106C13.3583 57.6853 13.9761 57.6118 14.4317 57.3786L13.976 56.4885ZM13.165 55.9176H14.165C14.165 55.8543 14.1912 55.7337 14.2673 55.6026C14.3025 55.5419 14.3408 55.4927 14.3754 55.4573C14.4109 55.4209 14.4324 55.4095 14.4317 55.4098L13.976 54.5197L13.5204 53.6295C13.0816 53.8541 12.7526 54.2283 12.5376 54.5985C12.3203 54.973 12.165 55.4366 12.165 55.9176H13.165ZM13.976 54.5197L14.4317 55.4098C14.4299 55.4107 14.3802 55.4358 14.2892 55.4355C14.1918 55.4353 14.0768 55.4051 13.9736 55.3325C13.7657 55.186 13.787 55.0173 13.787 55.0906H14.787H15.787C15.787 54.6196 15.6269 54.0508 15.1255 53.6975C14.5938 53.3229 13.976 53.3963 13.5204 53.6295L13.976 54.5197Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-36-inside-6_637_1524)"
+      />
+      <mask id="path-38-inside-7_637_1524" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path d="M12.6314 49.6269C12.6314 49.4775 12.7328 49.3067 12.8555 49.2481C13.5758 48.9279 14.2748 48.8212 14.899 48.9546C15.5873 49.0987 16.1475 49.5202 16.537 50.1711C16.9211 50.822 17.1132 51.6864 17.0919 52.6627C17.0705 53.6445 16.8304 54.7062 16.4089 55.7413C15.9821 56.7764 15.3845 57.7475 14.6802 58.5531C13.9706 59.3588 13.181 59.967 12.386 60.3138C11.591 60.6606 10.8227 60.7407 10.1611 60.5379C9.56353 60.3512 9.06733 59.9457 8.72586 59.3481C8.66717 59.2467 8.71519 59.06 8.82724 58.9373C8.93928 58.8145 9.07267 58.8039 9.13136 58.9052C9.44082 59.4335 9.87832 59.7909 10.4119 59.9563C11.0094 60.1377 11.6977 60.0684 12.4127 59.7536C13.1276 59.4388 13.8426 58.8946 14.4775 58.169C15.1124 57.4433 15.6513 56.5736 16.0355 55.6399C16.4196 54.7062 16.6277 53.7512 16.649 52.8655C16.6704 51.9851 16.4996 51.2062 16.1528 50.6193C15.806 50.0324 15.2992 49.6535 14.6802 49.5255C14.1254 49.4081 13.5064 49.4988 12.8662 49.7816C12.7435 49.835 12.6421 49.7656 12.6421 49.6162L12.6314 49.6269Z" />
+      </mask>
+      <path
+        d="M12.6314 49.6269C12.6314 49.4775 12.7328 49.3067 12.8555 49.2481C13.5758 48.9279 14.2748 48.8212 14.899 48.9546C15.5873 49.0987 16.1475 49.5202 16.537 50.1711C16.9211 50.822 17.1132 51.6864 17.0919 52.6627C17.0705 53.6445 16.8304 54.7062 16.4089 55.7413C15.9821 56.7764 15.3845 57.7475 14.6802 58.5531C13.9706 59.3588 13.181 59.967 12.386 60.3138C11.591 60.6606 10.8227 60.7407 10.1611 60.5379C9.56353 60.3512 9.06733 59.9457 8.72586 59.3481C8.66717 59.2467 8.71519 59.06 8.82724 58.9373C8.93928 58.8145 9.07267 58.8039 9.13136 58.9052C9.44082 59.4335 9.87832 59.7909 10.4119 59.9563C11.0094 60.1377 11.6977 60.0684 12.4127 59.7536C13.1276 59.4388 13.8426 58.8946 14.4775 58.169C15.1124 57.4433 15.6513 56.5736 16.0355 55.6399C16.4196 54.7062 16.6277 53.7512 16.649 52.8655C16.6704 51.9851 16.4996 51.2062 16.1528 50.6193C15.806 50.0324 15.2992 49.6535 14.6802 49.5255C14.1254 49.4081 13.5064 49.4988 12.8662 49.7816C12.7435 49.835 12.6421 49.7656 12.6421 49.6162L12.6314 49.6269Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M12.6314 49.6269H11.6314V52.0414L13.3386 50.3339L12.6314 49.6269ZM12.8555 49.2481L12.4494 48.3342L12.4366 48.3399L12.4241 48.3459L12.8555 49.2481ZM14.899 48.9546L14.69 49.9325L14.6941 49.9334L14.899 48.9546ZM16.537 50.1711L17.3982 49.6628L17.3951 49.6576L16.537 50.1711ZM17.0919 52.6627L16.0921 52.6409L16.0921 52.641L17.0919 52.6627ZM16.4089 55.7413L17.3334 56.1226L17.3351 56.1185L16.4089 55.7413ZM14.6802 58.5531L15.4307 59.2141L15.4331 59.2113L14.6802 58.5531ZM10.1611 60.5379L9.86283 61.4924L9.8681 61.494L10.1611 60.5379ZM8.72586 59.3481L9.59412 58.8519L9.59129 58.8471L8.72586 59.3481ZM9.13136 58.9052L8.26592 59.4063L8.26853 59.4107L9.13136 58.9052ZM10.4119 59.9563L10.1158 60.9115L10.1214 60.9132L10.4119 59.9563ZM16.649 52.8655L15.6493 52.8413L15.6493 52.8414L16.649 52.8655ZM14.6802 49.5255L14.4733 50.5039L14.4776 50.5048L14.6802 49.5255ZM12.8662 49.7816L13.2649 50.6987L13.2702 50.6964L12.8662 49.7816ZM12.6421 49.6162H13.6421V47.2017L11.9349 48.9092L12.6421 49.6162ZM12.6314 49.6269H13.6314C13.6314 49.7646 13.5901 49.8587 13.5579 49.913C13.5288 49.9621 13.4526 50.071 13.287 50.1502L12.8555 49.2481L12.4241 48.3459C12.1358 48.4838 11.9475 48.7074 11.837 48.8939C11.7235 49.0856 11.6314 49.3397 11.6314 49.6269H12.6314ZM12.8555 49.2481L13.2617 50.1619C13.8447 49.9027 14.3251 49.8546 14.69 49.9325L14.899 48.9546L15.108 47.9767C14.2244 47.7879 13.3069 47.9531 12.4494 48.3342L12.8555 49.2481ZM14.899 48.9546L14.6941 49.9334C15.0795 50.014 15.4163 50.2457 15.6789 50.6845L16.537 50.1711L17.3951 49.6576C16.8787 48.7947 16.0951 48.1833 15.1039 47.9758L14.899 48.9546ZM16.537 50.1711L15.6758 50.6793C15.9411 51.129 16.1106 51.7966 16.0921 52.6409L17.0919 52.6627L18.0916 52.6846C18.1159 51.5761 17.9011 50.515 17.3982 49.6628L16.537 50.1711ZM17.0919 52.6627L16.0921 52.641C16.0739 53.4811 15.8663 54.4223 15.4828 55.3642L16.4089 55.7413L17.3351 56.1185C17.7946 54.9902 18.0672 53.8078 18.0916 52.6845L17.0919 52.6627ZM16.4089 55.7413L15.4845 55.3601C15.0975 56.2984 14.5567 57.175 13.9274 57.895L14.6802 58.5531L15.4331 59.2113C16.2124 58.3199 16.8667 57.2544 17.3334 56.1225L16.4089 55.7413ZM14.6802 58.5531L13.9298 57.8921C13.2931 58.615 12.6174 59.1218 11.9861 59.3972L12.386 60.3138L12.7858 61.2304C13.7445 60.8122 14.6481 60.1025 15.4307 59.2141L14.6802 58.5531ZM12.386 60.3138L11.9861 59.3972C11.3489 59.6752 10.8309 59.6973 10.4541 59.5818L10.1611 60.5379L9.8681 61.494C10.8145 61.784 11.8331 61.646 12.7858 61.2304L12.386 60.3138ZM10.1611 60.5379L10.4594 59.5834C10.1205 59.4775 9.81975 59.2468 9.59411 58.852L8.72586 59.3481L7.85762 59.8442C8.31492 60.6445 9.00659 61.2248 9.86283 61.4924L10.1611 60.5379ZM8.72586 59.3481L9.59129 58.8471C9.67218 58.9868 9.6945 59.1162 9.69943 59.1991C9.70445 59.2837 9.69354 59.3497 9.68267 59.3932C9.66228 59.4747 9.62472 59.5469 9.56572 59.6115L8.82724 58.9373L8.08875 58.263C7.91771 58.4503 7.80011 58.6772 7.74238 58.9081C7.69157 59.1114 7.64868 59.4834 7.86044 59.8491L8.72586 59.3481ZM8.82724 58.9373L9.56572 59.6115C9.51185 59.6705 9.36053 59.8067 9.0964 59.8325C8.95667 59.8461 8.78955 59.8262 8.62497 59.7433C8.45877 59.6596 8.33993 59.5341 8.26593 59.4063L9.13136 58.9052L9.99679 58.4042C9.765 58.0039 9.33453 57.7998 8.90221 57.8419C8.5287 57.8784 8.25467 58.0813 8.08875 58.263L8.82724 58.9373ZM9.13136 58.9052L8.26853 59.4107C8.69234 60.1341 9.32239 60.6655 10.1158 60.9115L10.4119 59.9563L10.708 59.0012C10.4343 58.9163 10.1893 58.7328 9.99419 58.3998L9.13136 58.9052ZM10.4119 59.9563L10.1214 60.9132C11.0001 61.18 11.938 61.0552 12.8156 60.6688L12.4127 59.7536L12.0097 58.8384C11.4574 59.0815 11.0187 59.0955 10.7024 58.9995L10.4119 59.9563ZM12.4127 59.7536L12.8156 60.6688C13.6886 60.2844 14.5178 59.6415 15.2301 58.8275L14.4775 58.169L13.7249 57.5104C13.1674 58.1477 12.5666 58.5932 12.0097 58.8384L12.4127 59.7536ZM14.4775 58.169L15.2301 58.8275C15.9388 58.0174 16.5353 57.0534 16.9602 56.0204L16.0355 55.6399L15.1107 55.2595C14.7674 56.0939 14.286 56.8692 13.7249 57.5104L14.4775 58.169ZM16.0355 55.6399L16.9602 56.0204C17.3859 54.9859 17.6241 53.9104 17.6487 52.8896L16.649 52.8655L15.6493 52.8414C15.6312 53.592 15.4533 54.4266 15.1107 55.2595L16.0355 55.6399ZM16.649 52.8655L17.6487 52.8897C17.6733 51.878 17.4807 50.9007 17.0138 50.1105L16.1528 50.6193L15.2919 51.128C15.5186 51.5116 15.6675 52.0923 15.6493 52.8413L16.649 52.8655ZM16.1528 50.6193L17.0138 50.1105C16.538 49.3055 15.8043 48.7369 14.8829 48.5462L14.6802 49.5255L14.4776 50.5048C14.794 50.5702 15.074 50.7593 15.2919 51.128L16.1528 50.6193ZM14.6802 49.5255L14.8872 48.5471C14.0782 48.376 13.243 48.522 12.4622 48.8668L12.8662 49.7816L13.2702 50.6964C13.7699 50.4757 14.1725 50.4402 14.4733 50.5038L14.6802 49.5255ZM12.8662 49.7816L12.4675 48.8645C12.6447 48.7875 12.9796 48.7378 13.2931 48.9639C13.5906 49.1784 13.6421 49.4789 13.6421 49.6162H12.6421H11.6421C11.6421 49.9029 11.7443 50.3127 12.1231 50.586C12.518 50.8708 12.965 50.8291 13.2649 50.6987L12.8662 49.7816ZM12.6421 49.6162L11.9349 48.9092L11.9243 48.9198L12.6314 49.6269L13.3386 50.3339L13.3493 50.3232L12.6421 49.6162Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-38-inside-7_637_1524)"
+      />
+      <path
+        d="M32.6416 43.9189C32.8989 43.7886 33.0298 43.841 33.082 43.8779C33.1494 43.9259 33.2655 44.0754 33.2656 44.4287C33.2656 44.7781 33.1461 45.1793 32.9375 45.5391C32.7276 45.901 32.4543 46.1752 32.1895 46.3096H32.1885L23.1289 50.9248C22.8717 51.0551 22.7416 51.0037 22.6895 50.9668C22.6221 50.919 22.506 50.7697 22.5059 50.416C22.5059 50.0667 22.6245 49.6653 22.833 49.3057C23.043 48.9437 23.3171 48.6695 23.582 48.5352H23.583L32.6416 43.9189Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M49.4459 2.57338C48.2828 1.98115 46.7889 2.02916 45.1509 2.86683C41.4534 4.75025 38.4602 9.92566 38.4602 14.4181C38.4602 16.9258 39.3939 18.6972 40.8611 19.4441L38.4815 18.233C37.0143 17.486 36.0806 15.7146 36.0806 13.207C36.0806 8.70917 39.0791 3.53377 42.7712 1.65568C44.4039 0.823348 45.9032 0.769994 47.0663 1.36223L49.4459 2.57338Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M49.4457 2.57317C50.9129 3.32013 51.8467 5.09151 51.8467 7.59918C51.8467 12.097 48.8481 17.2724 45.156 19.1505C43.5233 19.9828 42.0241 20.0362 40.8609 19.4439C39.3937 18.697 38.46 16.9256 38.46 14.4179C38.46 9.92011 41.4585 4.7447 45.1506 2.86662C46.7833 2.03429 48.2826 1.98093 49.4457 2.57317Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M43.2979 15.4766C43.2572 15.4566 43.2179 15.4351 43.1797 15.4121C43.2187 15.4347 43.2578 15.4566 43.2979 15.4766Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M44.0566 13.6064C44.14 13.661 44.226 13.7069 44.3154 13.7422C44.2284 13.7154 44.1512 13.6777 44.085 13.6309C44.0749 13.6238 44.0666 13.6142 44.0566 13.6064ZM46.8799 8.31543C46.9113 8.32939 46.9406 8.34529 46.9688 8.3623C46.9394 8.34564 46.9099 8.32983 46.8799 8.31543Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/archived-module.tsx b/packages/propel/src/empty-state/assets/vertical-stack/archived-module.tsx
index 420841463..625a9a20c 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/archived-module.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/archived-module.tsx
@@ -1,110 +1,20 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const ArchivedModuleVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="183"
-    viewBox="0 0 162 183"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M25.9452 34.658C24.4766 33.9103 23.542 32.1426 23.542 29.6273C23.542 25.1253 26.5433 19.945 30.2389 18.0652L55.0187 5.43502C56.6528 4.6019 58.1482 4.5485 59.3124 5.14129L56.9305 3.92901C55.7663 3.33622 54.271 3.38962 52.6368 4.22273L27.8571 16.8529C24.1562 18.7381 21.1602 23.9183 21.1602 28.415C21.1602 30.9304 22.0947 32.6981 23.5634 33.4457L25.9452 34.658Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M25.9452 34.6572C27.1094 35.25 28.6047 35.1966 30.2389 34.3634L55.0187 21.7386C58.7196 19.8534 61.7156 14.6732 61.7156 10.1765C61.7156 7.66116 60.781 5.89347 59.3124 5.1458C58.1482 4.55301 56.6528 4.60642 55.0187 5.43953L30.2389 18.0644C26.538 19.9496 23.542 25.1298 23.542 29.6265C23.542 32.1418 24.4766 33.9095 25.9452 34.6572Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M33.6249 22.9154C33.7157 22.7766 33.8492 22.7178 33.9346 22.7766C34.0201 22.8353 34.0254 22.9955 33.9506 23.145L33.9346 23.1771L30.6983 28.7686C30.6075 28.9234 30.4633 28.9982 30.3725 28.9341C30.2817 28.87 30.2817 28.6938 30.3725 28.5336L33.6089 22.9421L33.6249 22.9154Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M31.227 24.7793C31.227 24.5443 31.0721 24.4375 30.8799 24.5336C30.6876 24.6297 30.5327 24.8968 30.5327 25.1317C30.5327 25.3667 30.6876 25.4735 30.8799 25.3774C31.0721 25.2813 31.227 25.0143 31.227 24.7793ZM31.6916 24.5443C31.6916 25.089 31.3285 25.7139 30.8799 25.9435C30.4313 26.1731 30.0681 25.9168 30.0681 25.3721C30.0681 24.8273 30.4313 24.2025 30.8799 23.9729C31.3285 23.7432 31.6916 23.9996 31.6916 24.5443Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M33.7743 26.5781C33.7743 26.3431 33.6195 26.2363 33.4272 26.3324C33.2349 26.4286 33.0801 26.6956 33.0801 26.9306C33.0801 27.1656 33.2349 27.2724 33.4272 27.1762C33.6195 27.0801 33.7743 26.8131 33.7743 26.5781ZM34.2336 26.3431C34.2336 26.8879 33.8705 27.5127 33.4219 27.7423C32.9733 27.972 32.6101 27.7156 32.6101 27.1709C32.6101 26.6262 32.9733 26.0013 33.4219 25.7717C33.8705 25.5421 34.2336 25.7984 34.2336 26.3431Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M32.076 20.8697C32.076 20.7202 32.1775 20.5493 32.3003 20.4906C33.0213 20.1701 33.7209 20.0633 34.3457 20.1968C35.0346 20.341 35.5954 20.7629 35.9852 21.4145C36.3697 22.066 36.562 22.9312 36.5406 23.9085C36.5193 24.8911 36.279 25.9539 35.8571 26.9899C35.4298 28.026 34.8317 28.9979 34.1268 29.8043C33.4165 30.6107 32.6261 31.2195 31.8304 31.5667C31.0346 31.9138 30.2656 31.9939 29.6034 31.791C29.0053 31.6041 28.5086 31.1982 28.1668 30.6001C28.1081 30.4986 28.1561 30.3117 28.2683 30.1888C28.3804 30.066 28.5139 30.0553 28.5727 30.1568C28.8824 30.6855 29.3203 31.0433 29.8544 31.2089C30.4525 31.3904 31.1414 31.321 31.8571 31.0059C32.5727 30.6908 33.2883 30.1461 33.9238 29.4198C34.5593 28.6935 35.0987 27.823 35.4832 26.8884C35.8677 25.9539 36.076 24.9979 36.0974 24.1114C36.1187 23.2302 35.9479 22.4505 35.6007 21.8631C35.2536 21.2756 34.7462 20.8964 34.1268 20.7683C33.5713 20.6508 32.9519 20.7416 32.311 21.0246C32.1882 21.078 32.0867 21.0086 32.0867 20.8591L32.076 20.8697Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M51.8838 17.9949L42.8157 22.6144C42.0681 22.9936 41.4646 22.5664 41.4646 21.6585C41.4646 20.7506 42.0681 19.7092 42.8157 19.33L51.8838 14.7105C52.6315 14.3314 53.235 14.7586 53.235 15.6665C53.235 16.5744 52.6315 17.6158 51.8838 17.9949Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M157.636 39.6191C158.234 39.3147 158.613 38.5937 158.613 37.5683V24.4735C158.613 22.6364 157.39 20.5216 155.879 19.7526L121.999 2.4922C121.331 2.15041 120.717 2.13439 120.242 2.37471L122.624 1.16243C123.099 0.92211 123.713 0.938131 124.381 1.27992L158.266 18.5456C159.777 19.3146 161 21.4295 161 23.2666V36.3614C161 37.3868 160.621 38.1077 160.023 38.4121L157.641 39.6244L157.636 39.6191Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M157.636 39.6197C157.16 39.86 156.546 39.844 155.879 39.5022L121.993 22.2365C120.482 21.4675 119.259 19.3526 119.259 17.5155V4.42606C119.259 3.40069 119.638 2.67973 120.236 2.37532C120.712 2.135 121.326 2.15102 121.993 2.49281L155.879 19.7585C157.39 20.5275 158.613 22.6424 158.613 24.4795V37.5743C158.613 38.5996 158.234 39.3206 157.636 39.625V39.6197Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M133.705 16.8793L141.566 20.8847C142.212 21.2158 142.736 20.8419 142.736 20.0569C142.736 19.2719 142.212 18.364 141.566 18.0382L133.705 14.0329C133.059 13.7018 132.535 14.0756 132.535 14.8606C132.535 15.6457 133.059 16.5536 133.705 16.8793Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M134.266 23.4595L145.288 29.0776C146.196 29.5369 146.928 29.0189 146.928 27.9187C146.928 26.8133 146.191 25.5476 145.288 25.0883L134.266 19.4701C133.358 19.0109 132.626 19.5289 132.626 20.629C132.626 21.7345 133.363 23.0002 134.266 23.4595Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M127.104 12.817C127.158 12.9933 127.28 13.1642 127.419 13.2336C127.612 13.335 127.772 13.2176 127.772 12.9772V12.534C127.772 12.3898 127.718 12.2242 127.622 12.0961C127.526 11.9679 127.409 11.8878 127.296 11.8824L125.027 11.8184C124.893 11.8184 124.802 11.9305 124.802 12.1121V15.1668C124.802 15.3217 124.867 15.4926 124.968 15.6261C125.075 15.7596 125.203 15.829 125.31 15.813L125.636 15.765C125.806 15.7383 125.871 15.5086 125.785 15.2523C125.726 15.0814 125.62 14.9425 125.502 14.8731V12.7636L127.099 12.8063L127.104 12.817Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M125.71 10.7975C125.764 10.9737 125.887 11.1446 126.026 11.214C126.218 11.3155 126.378 11.198 126.378 10.9577V10.5144C126.378 10.3703 126.325 10.2047 126.228 10.0765C126.132 9.94836 126.015 9.86825 125.903 9.86291L123.633 9.79883C123.499 9.79883 123.409 9.91098 123.409 10.0926V13.1473C123.409 13.3022 123.473 13.4731 123.574 13.6066C123.681 13.7401 123.809 13.8095 123.916 13.7935L124.242 13.7454C124.413 13.7187 124.477 13.4891 124.391 13.2327C124.333 13.0618 124.226 12.923 124.108 12.8536V10.7441L125.705 10.7868L125.71 10.7975Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M129.171 14.1879C129.075 14.0543 128.957 13.9742 128.851 13.9742L126.581 13.9102C126.447 13.9102 126.357 14.0276 126.357 14.1985V17.2586C126.357 17.4028 126.41 17.563 126.506 17.6912C126.608 17.8247 126.725 17.9048 126.832 17.9048L129.096 17.9689C129.235 17.9796 129.326 17.8621 129.326 17.6805V14.6204C129.326 14.4762 129.273 14.316 129.171 14.1879ZM128.626 17.029L127.056 16.9809V14.8608L128.626 14.9088V17.029Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <g opacity="0.2">
+export function ArchivedModuleVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="183"
+      viewBox="0 0 162 183"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
       <path
-        d="M1 147.833C1 149.852 2.51135 151.866 5.52871 153.409L44.3805 173.206C50.4206 176.282 60.2097 176.282 66.2497 173.206L147.889 131.609C150.907 130.071 152.418 128.058 152.418 126.039V132.485C152.418 134.504 150.907 136.517 147.889 138.055L66.2497 179.652C60.2097 182.728 50.4206 182.728 44.3805 179.652L5.52871 159.855C2.50601 158.317 1 156.298 1 154.279V147.833Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M25.9452 34.658C24.4766 33.9103 23.542 32.1426 23.542 29.6273C23.542 25.1253 26.5433 19.945 30.2389 18.0652L55.0187 5.43502C56.6528 4.6019 58.1482 4.5485 59.3124 5.14129L56.9305 3.92901C55.7663 3.33622 54.271 3.38962 52.6368 4.22273L27.8571 16.8529C24.1562 18.7381 21.1602 23.9183 21.1602 28.415C21.1602 30.9304 22.0947 32.6981 23.5634 33.4457L25.9452 34.658Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -112,17 +22,41 @@ export const ArchivedModuleVerticalStackIllustration = ({ className }: TIllustra
         strokeLinejoin="round"
       />
       <path
-        d="M1 147.833C1 145.815 2.51135 143.801 5.52871 142.263L87.1683 100.666C93.2083 97.5903 102.997 97.5903 109.037 100.666L147.889 120.464C150.912 122.002 152.418 124.02 152.418 126.039C152.418 128.058 150.907 130.071 147.889 131.609L66.2497 173.206C60.2097 176.282 50.4206 176.282 44.3805 173.206L5.52871 153.409C2.50601 151.871 1 149.852 1 147.833Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M25.9452 34.6572C27.1094 35.25 28.6047 35.1966 30.2389 34.3634L55.0187 21.7386C58.7196 19.8534 61.7156 14.6732 61.7156 10.1765C61.7156 7.66116 60.781 5.89347 59.3124 5.1458C58.1482 4.55301 56.6528 4.60642 55.0187 5.43953L30.2389 18.0644C26.538 19.9496 23.542 25.1298 23.542 29.6265C23.542 32.1418 24.4766 33.9095 25.9452 34.6572Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M1 127.47C1 129.489 2.51135 131.502 5.52871 133.046L44.3805 152.843C50.4206 155.919 60.2097 155.919 66.2497 152.843L147.889 111.246C150.907 109.708 152.418 107.694 152.418 105.676V112.122C152.418 114.14 150.907 116.154 147.889 117.692L66.2497 159.289C60.2097 162.365 50.4206 162.365 44.3805 159.289L5.52871 139.492C2.50601 137.954 1 135.935 1 133.916V127.47Z"
+        d="M33.6249 22.9154C33.7157 22.7766 33.8492 22.7178 33.9346 22.7766C34.0201 22.8353 34.0254 22.9955 33.9506 23.145L33.9346 23.1771L30.6983 28.7686C30.6075 28.9234 30.4633 28.9982 30.3725 28.9341C30.2817 28.87 30.2817 28.6938 30.3725 28.5336L33.6089 22.9421L33.6249 22.9154Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M31.227 24.7793C31.227 24.5443 31.0721 24.4375 30.8799 24.5336C30.6876 24.6297 30.5327 24.8968 30.5327 25.1317C30.5327 25.3667 30.6876 25.4735 30.8799 25.3774C31.0721 25.2813 31.227 25.0143 31.227 24.7793ZM31.6916 24.5443C31.6916 25.089 31.3285 25.7139 30.8799 25.9435C30.4313 26.1731 30.0681 25.9168 30.0681 25.3721C30.0681 24.8273 30.4313 24.2025 30.8799 23.9729C31.3285 23.7432 31.6916 23.9996 31.6916 24.5443Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M33.7743 26.5781C33.7743 26.3431 33.6195 26.2363 33.4272 26.3324C33.2349 26.4286 33.0801 26.6956 33.0801 26.9306C33.0801 27.1656 33.2349 27.2724 33.4272 27.1762C33.6195 27.0801 33.7743 26.8131 33.7743 26.5781ZM34.2336 26.3431C34.2336 26.8879 33.8705 27.5127 33.4219 27.7423C32.9733 27.972 32.6101 27.7156 32.6101 27.1709C32.6101 26.6262 32.9733 26.0013 33.4219 25.7717C33.8705 25.5421 34.2336 25.7984 34.2336 26.3431Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M32.076 20.8697C32.076 20.7202 32.1775 20.5493 32.3003 20.4906C33.0213 20.1701 33.7209 20.0633 34.3457 20.1968C35.0346 20.341 35.5954 20.7629 35.9852 21.4145C36.3697 22.066 36.562 22.9312 36.5406 23.9085C36.5193 24.8911 36.279 25.9539 35.8571 26.9899C35.4298 28.026 34.8317 28.9979 34.1268 29.8043C33.4165 30.6107 32.6261 31.2195 31.8304 31.5667C31.0346 31.9138 30.2656 31.9939 29.6034 31.791C29.0053 31.6041 28.5086 31.1982 28.1668 30.6001C28.1081 30.4986 28.1561 30.3117 28.2683 30.1888C28.3804 30.066 28.5139 30.0553 28.5727 30.1568C28.8824 30.6855 29.3203 31.0433 29.8544 31.2089C30.4525 31.3904 31.1414 31.321 31.8571 31.0059C32.5727 30.6908 33.2883 30.1461 33.9238 29.4198C34.5593 28.6935 35.0987 27.823 35.4832 26.8884C35.8677 25.9539 36.076 24.9979 36.0974 24.1114C36.1187 23.2302 35.9479 22.4505 35.6007 21.8631C35.2536 21.2756 34.7462 20.8964 34.1268 20.7683C33.5713 20.6508 32.9519 20.7416 32.311 21.0246C32.1882 21.078 32.0867 21.0086 32.0867 20.8591L32.076 20.8697Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M51.8838 17.9949L42.8157 22.6144C42.0681 22.9936 41.4646 22.5664 41.4646 21.6585C41.4646 20.7506 42.0681 19.7092 42.8157 19.33L51.8838 14.7105C52.6315 14.3314 53.235 14.7586 53.235 15.6665C53.235 16.5744 52.6315 17.6158 51.8838 17.9949Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M157.636 39.6191C158.234 39.3147 158.613 38.5937 158.613 37.5683V24.4735C158.613 22.6364 157.39 20.5216 155.879 19.7526L121.999 2.4922C121.331 2.15041 120.717 2.13439 120.242 2.37471L122.624 1.16243C123.099 0.92211 123.713 0.938131 124.381 1.27992L158.266 18.5456C159.777 19.3146 161 21.4295 161 23.2666V36.3614C161 37.3868 160.621 38.1077 160.023 38.4121L157.641 39.6244L157.636 39.6191Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -130,165 +64,233 @@ export const ArchivedModuleVerticalStackIllustration = ({ className }: TIllustra
         strokeLinejoin="round"
       />
       <path
-        d="M1 127.47C1 125.451 2.51135 123.438 5.52871 121.9L87.1683 80.3032C93.2083 77.2271 102.997 77.2271 109.037 80.3032L147.889 100.1C150.912 101.638 152.418 103.657 152.418 105.676C152.418 107.694 150.907 109.708 147.889 111.246L66.2497 152.843C60.2097 155.919 50.4206 155.919 44.3805 152.843L5.52871 133.046C2.50601 131.507 1 129.489 1 127.47Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M157.636 39.6197C157.16 39.86 156.546 39.844 155.879 39.5022L121.993 22.2365C120.482 21.4675 119.259 19.3526 119.259 17.5155V4.42606C119.259 3.40069 119.638 2.67973 120.236 2.37532C120.712 2.135 121.326 2.15102 121.993 2.49281L155.879 19.7585C157.39 20.5275 158.613 22.6424 158.613 24.4795V37.5743C158.613 38.5996 158.234 39.3206 157.636 39.625V39.6197Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M1 107.107C1 109.126 2.51135 111.139 5.52871 112.682L44.3805 132.479C50.4206 135.556 60.2097 135.556 66.2497 132.479L147.889 90.8826C150.907 89.3445 152.418 87.3312 152.418 85.3125V91.7584C152.418 93.7771 150.907 95.7905 147.889 97.3285L66.2497 138.925C60.2097 142.001 50.4206 142.001 44.3805 138.925L5.52871 119.123C2.50601 117.585 1 115.566 1 113.547V107.102V107.107Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M1 107.107C1 105.088 2.51135 103.075 5.52871 101.537L87.1683 59.9399C93.2083 56.8638 102.997 56.8638 109.037 59.9399L147.889 79.737C150.912 81.275 152.418 83.2937 152.418 85.3124C152.418 87.3311 150.907 89.3444 147.889 90.8825L66.2497 132.479C60.2097 135.555 50.4206 135.555 44.3805 132.479L5.52871 112.677C2.50601 111.139 1 109.12 1 107.101V107.107Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M65.0962 104.037C64.3272 104.037 63.6116 103.871 62.9707 103.54L58.2124 101.116C56.4874 100.24 55.43 98.2533 55.3018 95.6632L53.9774 68.9502C53.9667 68.7419 54.0789 68.5443 54.2658 68.4482L56.7598 67.1772L52.0174 64.7633C50.7838 64.1331 50.0789 62.7019 50.0789 60.8381V58.6004C50.0789 55.332 52.2738 51.5563 54.9707 50.1838L97.2778 28.6244C97.9667 28.2719 98.645 28.0957 99.2965 28.0957C99.8092 28.0957 100.285 28.2079 100.717 28.4268L105.475 30.8514C106.709 31.4816 107.414 32.9128 107.414 34.782V37.0196C107.414 40.288 105.219 44.0583 102.522 45.4362L99.7718 46.8354L103.227 48.5977C103.414 48.6938 103.526 48.8914 103.515 49.0997L102.191 77.1638C101.951 82.1839 98.5969 87.7272 94.5488 89.7833L68.167 103.225C67.1096 103.765 66.0735 104.037 65.0855 104.037H65.0962Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M99.2964 28.6345C99.7236 28.6345 100.124 28.7306 100.471 28.9069L105.23 31.3314C106.239 31.8441 106.875 33.0617 106.875 34.7814V37.019C106.875 40.1058 104.813 43.6625 102.276 44.9603L98.5915 46.8401L102.981 49.0778L101.657 77.1419C101.427 81.991 98.207 87.3315 94.3084 89.3128L67.9266 102.755C66.9226 103.267 65.9666 103.508 65.0908 103.508C64.4019 103.508 63.7717 103.358 63.2056 103.07L58.4472 100.645C56.9466 99.8815 55.9533 98.1352 55.8304 95.6466L54.506 68.9336L58.3244 66.9897C58.2817 66.9897 58.2336 66.9897 58.1909 66.9897C57.7637 66.9897 57.3685 66.8989 57.016 66.7173L52.2577 64.2927C51.2483 63.7801 50.6128 62.5624 50.6128 60.8428V58.6052C50.6128 55.5184 52.6689 51.9616 55.2109 50.6639L97.518 29.1045C98.1482 28.784 98.7463 28.6345 99.2911 28.6345M99.2964 27.5664C98.5648 27.5664 97.8011 27.764 97.0374 28.1539L54.7303 49.7133C51.8251 51.1926 49.55 55.0965 49.55 58.6052V60.8428C49.55 62.9202 50.3618 64.5224 51.7824 65.2487L55.5901 67.1873L54.0307 67.983C53.6569 68.1753 53.4272 68.5651 53.4486 68.987L54.773 95.7C54.9065 98.4824 56.0761 100.635 57.9719 101.601L62.7303 104.026C63.4513 104.394 64.247 104.581 65.0961 104.581C66.1642 104.581 67.2857 104.287 68.4179 103.711L94.7997 90.2687C99.0721 88.1005 102.479 82.477 102.73 77.1953L104.055 49.1312C104.076 48.7093 103.846 48.3194 103.473 48.1272L100.952 46.8401L102.768 45.9162C105.673 44.4369 107.948 40.5277 107.948 37.0244V34.7867C107.948 32.7093 107.136 31.1071 105.716 30.3808L100.957 27.9563C100.45 27.6999 99.8892 27.5664 99.2964 27.5664Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M102.987 49.073L59.2698 71.3534L54.5115 68.9288L98.2285 46.6484L102.987 49.073Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M59.2698 71.3543L60.5943 98.0672C60.7171 100.556 61.7104 102.302 63.2111 103.066L58.4527 100.641C56.9521 99.8776 55.9587 98.1313 55.8359 95.6427L54.5115 68.9297L59.2698 71.3543Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M102.987 49.0723L101.662 77.1364C101.433 81.9855 98.2124 87.326 94.3139 89.3073L67.932 102.749C66.1429 103.662 64.4927 103.721 63.211 103.064C61.7104 102.301 60.717 100.554 60.5942 98.0656L59.2698 71.3527L102.987 49.0723Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M105.235 31.3324C104.434 30.9265 103.409 30.9585 102.282 31.53L59.9746 53.0894C57.4326 54.3818 55.3765 57.9385 55.3765 61.0306V63.2683C55.3765 64.9933 56.0174 66.2055 57.0214 66.7182L52.263 64.2937C51.2537 63.781 50.6182 62.5634 50.6182 60.8437V58.6061C50.6182 55.5193 52.6742 51.9625 55.2163 50.6648L97.5234 29.1054C98.6449 28.534 99.6756 28.4966 100.477 28.9078L105.235 31.3324Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M105.235 31.3316C106.244 31.8443 106.88 33.0619 106.88 34.7816V37.0192C106.88 40.106 104.818 43.6627 102.282 44.9605L59.9746 66.5199C58.8531 67.0913 57.8224 67.1287 57.0213 66.7175C56.012 66.2048 55.3765 64.9872 55.3765 63.2676V61.0299C55.3765 57.9431 57.4325 54.3864 59.9746 53.0886L102.282 31.5292C103.403 30.9578 104.434 30.9204 105.235 31.3316Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M86.0947 91.7575C85.8384 91.7575 85.6034 91.7041 85.3844 91.5919C85.331 91.5652 85.2829 91.5385 85.2349 91.5011L80.5086 89.0926C80.5086 89.0926 80.4658 89.0659 80.4445 89.0552L73.0853 83.8536C72.1134 83.2448 71.9905 81.5625 72.8343 80.0405C73.4538 78.9083 74.4418 78.1767 75.355 78.1767C75.6114 78.1767 75.8517 78.2354 76.0707 78.3476L79.6755 80.1847V67.17C79.6755 65.7281 80.61 64.126 81.8063 63.5171C82.1267 63.3569 82.4472 63.2715 82.7569 63.2715C83.0132 63.2715 83.2589 63.3302 83.4779 63.4424L88.2362 65.8669C88.8397 66.1767 89.1868 66.8496 89.1868 67.7201V70.903C89.5126 70.7321 89.849 70.636 90.1695 70.636C90.4258 70.636 90.6608 70.6894 90.8797 70.8015L95.6381 73.2261C95.6755 73.2475 95.7182 73.2688 95.7556 73.2902C96.7489 73.9097 96.8664 75.5919 96.0279 77.1193C96.0012 77.1727 95.9585 77.2475 95.9158 77.3115L88.5727 89.9845C87.9425 91.0792 86.9972 91.7575 86.1 91.7575H86.0947Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M82.7516 63.8005C82.9278 63.8005 83.0881 63.8379 83.2322 63.9127L87.9906 66.3372C88.3911 66.5402 88.6475 67.0262 88.6475 67.7151V71.9874C89.1228 71.4641 89.6782 71.165 90.1642 71.165C90.3297 71.165 90.4899 71.2024 90.6288 71.2718L95.3871 73.6964C95.3871 73.6964 95.4352 73.7231 95.4619 73.7391C96.2042 74.2037 96.2469 75.5976 95.5527 76.8579C95.526 76.9113 95.4939 76.9647 95.4619 77.0128L88.1027 89.7178C87.558 90.6577 86.7623 91.2238 86.0947 91.2238C85.9292 91.2238 85.769 91.1864 85.6248 91.117C85.5821 91.0956 85.5447 91.0742 85.5073 91.0422L80.7489 88.6176L73.3898 83.416C72.6475 82.9514 72.6047 81.5522 73.299 80.2972C73.8384 79.3145 74.6608 78.7111 75.3551 78.7111C75.5206 78.7111 75.6862 78.7485 75.8304 78.8232L80.2096 81.0555V67.1703C80.2096 65.9367 81.032 64.5108 82.0467 63.9928C82.2977 63.8646 82.5326 63.8059 82.7516 63.8059M82.7516 62.7324C82.3564 62.7324 81.9612 62.8339 81.566 63.0315C80.1828 63.7364 79.1415 65.5148 79.1415 67.165V79.3092L76.3164 77.8673C76.0226 77.7177 75.6969 77.643 75.3551 77.643C74.2336 77.643 73.0854 78.4654 72.3644 79.7845C71.3764 81.5682 71.5634 83.5015 72.797 84.3025L80.1348 89.4881C80.1775 89.5202 80.2202 89.5469 80.2683 89.5682L84.9679 91.9661C85.0266 92.0035 85.0854 92.0355 85.1441 92.0676C85.4379 92.2171 85.7583 92.2919 86.0947 92.2919C87.1788 92.2919 88.3003 91.5122 89.0266 90.2518L96.3698 77.5736C96.4178 77.4988 96.4606 77.4294 96.4979 77.3546C97.4806 75.5549 97.2777 73.6163 96.028 72.8312C95.9799 72.7992 95.9265 72.7725 95.8731 72.7458L91.1148 70.3212C90.821 70.1717 90.5006 70.0969 90.1642 70.0969C90.0146 70.0969 89.8651 70.1129 89.7156 70.1396V67.7151C89.7156 66.6363 89.2616 65.7872 88.4766 65.3866L83.7182 62.9621C83.4192 62.8125 83.0987 62.7324 82.7516 62.7324Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M95.3923 73.6974C94.65 73.3182 93.5338 73.9591 92.8663 75.1767L88.6526 82.4611L83.8943 80.0365L88.1079 72.7521C88.7808 71.5345 89.8916 70.8936 90.6339 71.2728L95.3923 73.6974Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M80.5887 81.2486C79.841 80.8641 78.7248 81.505 78.0573 82.728C77.363 83.983 77.4057 85.3822 78.1481 85.8468L85.5072 91.0484L80.7489 88.6238L73.3897 83.4222C72.6474 82.9576 72.6047 81.5584 73.2989 80.3034C73.9665 79.0804 75.0773 78.4449 75.8303 78.8241L80.5887 81.2486Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M87.9905 66.3379C87.6701 66.1723 87.2535 66.183 86.8049 66.4127C85.7902 66.9307 84.9678 68.3566 84.9678 69.5902V84.3352L80.2095 81.9107V67.1657C80.2095 65.932 81.0319 64.5061 82.0466 63.9881C82.4952 63.7585 82.9117 63.7478 83.2322 63.9133L87.9905 66.3379Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M87.9905 66.3372C88.391 66.5401 88.6474 67.0261 88.6474 67.715V82.46L92.861 75.1756C93.5339 73.958 94.6447 73.3171 95.387 73.6963C95.4137 73.707 95.4351 73.723 95.4618 73.739C96.2041 74.2037 96.2468 75.5975 95.5526 76.8579C95.5259 76.9113 95.4938 76.9647 95.4618 77.0127L88.1026 89.7177C87.4244 90.8872 86.3456 91.48 85.6247 91.1169C85.5819 91.0955 85.5446 91.0742 85.5072 91.0421L78.148 85.8405C77.4057 85.3759 77.363 83.9767 78.0572 82.7217C78.7248 81.4987 79.8356 80.8632 80.5886 81.2424C80.6153 81.2531 80.6367 81.2691 80.658 81.2851C80.6847 81.3065 80.7168 81.3278 80.7488 81.3492L84.9678 84.3345V69.5895C84.9678 68.3559 85.7902 66.93 86.8049 66.4119C87.2535 66.1823 87.6701 66.1716 87.9905 66.3372Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M21.9345 49.7917C20.7703 49.1989 19.2749 49.247 17.6354 50.0854C13.9345 51.9706 10.9385 57.1508 10.9385 61.6475C10.9385 64.1575 11.8731 65.9305 13.3417 66.6782L10.9598 65.4659C9.49122 64.7183 8.55664 62.9452 8.55664 60.4352C8.55664 55.9332 11.558 50.753 15.2536 48.8731C16.8878 48.04 18.3884 47.9866 19.5526 48.5794L21.9345 49.7917Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M21.9345 49.7923C23.4031 50.54 24.3377 52.313 24.3377 54.823C24.3377 59.325 21.3363 64.5052 17.6408 66.3851C16.0066 67.2182 14.5059 67.2716 13.3417 66.6788C11.8731 65.9311 10.9385 64.1581 10.9385 61.6481C10.9385 57.1461 13.9398 51.9659 17.6354 50.086C19.2696 49.2529 20.7703 49.1995 21.9345 49.7923Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M19.9479 58.7846L19.5741 58.6938V58.0369C19.5741 57.818 19.4245 57.7112 19.243 57.8019C19.0614 57.8927 18.9119 58.1491 18.9119 58.368V59.2492C18.9119 59.3881 18.9706 59.4842 19.0667 59.5109L19.5954 59.6444C19.6488 59.6604 19.7076 59.6444 19.7717 59.6177C19.8838 59.5643 19.9906 59.4415 20.0494 59.2866C20.1455 59.0516 20.0974 58.8273 19.9426 58.7899L19.9479 58.7846Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M16.781 62.262L15.6274 62.8495C15.4458 62.9403 15.2963 62.8388 15.2963 62.6145V59.0097L16.6101 58.3368C16.7916 58.246 16.9412 57.9897 16.9412 57.7707C16.9412 57.5517 16.7916 57.4449 16.6101 57.5357L15.2963 58.2086V57.007C15.2963 56.7881 15.4458 56.5317 15.6274 56.4409L16.2843 56.1045V56.505C16.2843 56.724 16.4338 56.8308 16.6154 56.74C16.797 56.6492 16.9465 56.3929 16.9465 56.1739V55.7734L18.9225 54.7694V55.1699C18.9225 55.3889 19.072 55.4957 19.2536 55.4049C19.4352 55.3141 19.5847 55.0578 19.5847 54.8388V54.4383L20.2416 54.1018C20.4232 54.011 20.5727 54.1125 20.5727 54.3368V54.9349C20.5727 55.1539 20.7222 55.2607 20.9038 55.1699C21.0854 55.0791 21.2349 54.8228 21.2349 54.6038V54.0057C21.2349 53.3435 20.7916 53.0284 20.2469 53.3061L19.59 53.6425V53.242C19.59 53.023 19.4405 52.9162 19.2589 53.007C19.0774 53.0978 18.9278 53.3541 18.9278 53.5731V53.9736L16.9519 54.9776V54.5771C16.9519 54.3582 16.8023 54.2513 16.6207 54.3421C16.4392 54.4329 16.2896 54.6893 16.2896 54.9082V55.3088L15.6328 55.6452C15.088 55.9229 14.6448 56.6866 14.6448 57.3488V62.951C14.6448 63.6132 15.088 63.9283 15.6328 63.6505L16.7863 63.0631C16.9679 62.9723 17.1174 62.716 17.1174 62.497C17.1174 62.2781 16.9679 62.1712 16.7863 62.262H16.781Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M19.2483 56.2C17.9772 56.8462 16.9465 58.6299 16.9465 60.1733C16.9465 61.7167 17.9772 62.4484 19.2483 61.8022C20.5193 61.156 21.55 59.3723 21.55 57.8289C21.55 56.2855 20.5193 55.5538 19.2483 56.2ZM19.2483 61.0064C18.3404 61.4711 17.6034 60.9477 17.6034 59.8422C17.6034 58.7367 18.3404 57.4657 19.2483 57.0011C20.1561 56.5365 20.8931 57.0598 20.8931 58.1653C20.8931 59.2708 20.1561 60.5418 19.2483 61.0064Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M133.705 16.8793L141.566 20.8847C142.212 21.2158 142.736 20.8419 142.736 20.0569C142.736 19.2719 142.212 18.364 141.566 18.0382L133.705 14.0329C133.059 13.7018 132.535 14.0756 132.535 14.8606C132.535 15.6457 133.059 16.5536 133.705 16.8793Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M134.266 23.4595L145.288 29.0776C146.196 29.5369 146.928 29.0189 146.928 27.9187C146.928 26.8133 146.191 25.5476 145.288 25.0883L134.266 19.4701C133.358 19.0109 132.626 19.5289 132.626 20.629C132.626 21.7345 133.363 23.0002 134.266 23.4595Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M127.104 12.817C127.158 12.9933 127.28 13.1642 127.419 13.2336C127.612 13.335 127.772 13.2176 127.772 12.9772V12.534C127.772 12.3898 127.718 12.2242 127.622 12.0961C127.526 11.9679 127.409 11.8878 127.296 11.8824L125.027 11.8184C124.893 11.8184 124.802 11.9305 124.802 12.1121V15.1668C124.802 15.3217 124.867 15.4926 124.968 15.6261C125.075 15.7596 125.203 15.829 125.31 15.813L125.636 15.765C125.806 15.7383 125.871 15.5086 125.785 15.2523C125.726 15.0814 125.62 14.9425 125.502 14.8731V12.7636L127.099 12.8063L127.104 12.817Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M125.71 10.7975C125.764 10.9737 125.887 11.1446 126.026 11.214C126.218 11.3155 126.378 11.198 126.378 10.9577V10.5144C126.378 10.3703 126.325 10.2047 126.228 10.0765C126.132 9.94836 126.015 9.86825 125.903 9.86291L123.633 9.79883C123.499 9.79883 123.409 9.91098 123.409 10.0926V13.1473C123.409 13.3022 123.473 13.4731 123.574 13.6066C123.681 13.7401 123.809 13.8095 123.916 13.7935L124.242 13.7454C124.413 13.7187 124.477 13.4891 124.391 13.2327C124.333 13.0618 124.226 12.923 124.108 12.8536V10.7441L125.705 10.7868L125.71 10.7975Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M129.171 14.1879C129.075 14.0543 128.957 13.9742 128.851 13.9742L126.581 13.9102C126.447 13.9102 126.357 14.0276 126.357 14.1985V17.2586C126.357 17.4028 126.41 17.563 126.506 17.6912C126.608 17.8247 126.725 17.9048 126.832 17.9048L129.096 17.9689C129.235 17.9796 129.326 17.8621 129.326 17.6805V14.6204C129.326 14.4762 129.273 14.316 129.171 14.1879ZM128.626 17.029L127.056 16.9809V14.8608L128.626 14.9088V17.029Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <g opacity="0.2">
+        <path
+          d="M1 147.833C1 149.852 2.51135 151.866 5.52871 153.409L44.3805 173.206C50.4206 176.282 60.2097 176.282 66.2497 173.206L147.889 131.609C150.907 130.071 152.418 128.058 152.418 126.039V132.485C152.418 134.504 150.907 136.517 147.889 138.055L66.2497 179.652C60.2097 182.728 50.4206 182.728 44.3805 179.652L5.52871 159.855C2.50601 158.317 1 156.298 1 154.279V147.833Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 147.833C1 145.815 2.51135 143.801 5.52871 142.263L87.1683 100.666C93.2083 97.5903 102.997 97.5903 109.037 100.666L147.889 120.464C150.912 122.002 152.418 124.02 152.418 126.039C152.418 128.058 150.907 130.071 147.889 131.609L66.2497 173.206C60.2097 176.282 50.4206 176.282 44.3805 173.206L5.52871 153.409C2.50601 151.871 1 149.852 1 147.833Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M1 127.47C1 129.489 2.51135 131.502 5.52871 133.046L44.3805 152.843C50.4206 155.919 60.2097 155.919 66.2497 152.843L147.889 111.246C150.907 109.708 152.418 107.694 152.418 105.676V112.122C152.418 114.14 150.907 116.154 147.889 117.692L66.2497 159.289C60.2097 162.365 50.4206 162.365 44.3805 159.289L5.52871 139.492C2.50601 137.954 1 135.935 1 133.916V127.47Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 127.47C1 125.451 2.51135 123.438 5.52871 121.9L87.1683 80.3032C93.2083 77.2271 102.997 77.2271 109.037 80.3032L147.889 100.1C150.912 101.638 152.418 103.657 152.418 105.676C152.418 107.694 150.907 109.708 147.889 111.246L66.2497 152.843C60.2097 155.919 50.4206 155.919 44.3805 152.843L5.52871 133.046C2.50601 131.507 1 129.489 1 127.47Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <path
+        d="M1 107.107C1 109.126 2.51135 111.139 5.52871 112.682L44.3805 132.479C50.4206 135.556 60.2097 135.556 66.2497 132.479L147.889 90.8826C150.907 89.3445 152.418 87.3312 152.418 85.3125V91.7584C152.418 93.7771 150.907 95.7905 147.889 97.3285L66.2497 138.925C60.2097 142.001 50.4206 142.001 44.3805 138.925L5.52871 119.123C2.50601 117.585 1 115.566 1 113.547V107.102V107.107Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M1 107.107C1 105.088 2.51135 103.075 5.52871 101.537L87.1683 59.9399C93.2083 56.8638 102.997 56.8638 109.037 59.9399L147.889 79.737C150.912 81.275 152.418 83.2937 152.418 85.3124C152.418 87.3311 150.907 89.3444 147.889 90.8825L66.2497 132.479C60.2097 135.555 50.4206 135.555 44.3805 132.479L5.52871 112.677C2.50601 111.139 1 109.12 1 107.101V107.107Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M65.0962 104.037C64.3272 104.037 63.6116 103.871 62.9707 103.54L58.2124 101.116C56.4874 100.24 55.43 98.2533 55.3018 95.6632L53.9774 68.9502C53.9667 68.7419 54.0789 68.5443 54.2658 68.4482L56.7598 67.1772L52.0174 64.7633C50.7838 64.1331 50.0789 62.7019 50.0789 60.8381V58.6004C50.0789 55.332 52.2738 51.5563 54.9707 50.1838L97.2778 28.6244C97.9667 28.2719 98.645 28.0957 99.2965 28.0957C99.8092 28.0957 100.285 28.2079 100.717 28.4268L105.475 30.8514C106.709 31.4816 107.414 32.9128 107.414 34.782V37.0196C107.414 40.288 105.219 44.0583 102.522 45.4362L99.7718 46.8354L103.227 48.5977C103.414 48.6938 103.526 48.8914 103.515 49.0997L102.191 77.1638C101.951 82.1839 98.5969 87.7272 94.5488 89.7833L68.167 103.225C67.1096 103.765 66.0735 104.037 65.0855 104.037H65.0962Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M99.2964 28.6345C99.7236 28.6345 100.124 28.7306 100.471 28.9069L105.23 31.3314C106.239 31.8441 106.875 33.0617 106.875 34.7814V37.019C106.875 40.1058 104.813 43.6625 102.276 44.9603L98.5915 46.8401L102.981 49.0778L101.657 77.1419C101.427 81.991 98.207 87.3315 94.3084 89.3128L67.9266 102.755C66.9226 103.267 65.9666 103.508 65.0908 103.508C64.4019 103.508 63.7717 103.358 63.2056 103.07L58.4472 100.645C56.9466 99.8815 55.9533 98.1352 55.8304 95.6466L54.506 68.9336L58.3244 66.9897C58.2817 66.9897 58.2336 66.9897 58.1909 66.9897C57.7637 66.9897 57.3685 66.8989 57.016 66.7173L52.2577 64.2927C51.2483 63.7801 50.6128 62.5624 50.6128 60.8428V58.6052C50.6128 55.5184 52.6689 51.9616 55.2109 50.6639L97.518 29.1045C98.1482 28.784 98.7463 28.6345 99.2911 28.6345M99.2964 27.5664C98.5648 27.5664 97.8011 27.764 97.0374 28.1539L54.7303 49.7133C51.8251 51.1926 49.55 55.0965 49.55 58.6052V60.8428C49.55 62.9202 50.3618 64.5224 51.7824 65.2487L55.5901 67.1873L54.0307 67.983C53.6569 68.1753 53.4272 68.5651 53.4486 68.987L54.773 95.7C54.9065 98.4824 56.0761 100.635 57.9719 101.601L62.7303 104.026C63.4513 104.394 64.247 104.581 65.0961 104.581C66.1642 104.581 67.2857 104.287 68.4179 103.711L94.7997 90.2687C99.0721 88.1005 102.479 82.477 102.73 77.1953L104.055 49.1312C104.076 48.7093 103.846 48.3194 103.473 48.1272L100.952 46.8401L102.768 45.9162C105.673 44.4369 107.948 40.5277 107.948 37.0244V34.7867C107.948 32.7093 107.136 31.1071 105.716 30.3808L100.957 27.9563C100.45 27.6999 99.8892 27.5664 99.2964 27.5664Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M102.987 49.073L59.2698 71.3534L54.5115 68.9288L98.2285 46.6484L102.987 49.073Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M59.2698 71.3543L60.5943 98.0672C60.7171 100.556 61.7104 102.302 63.2111 103.066L58.4527 100.641C56.9521 99.8776 55.9587 98.1313 55.8359 95.6427L54.5115 68.9297L59.2698 71.3543Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M102.987 49.0723L101.662 77.1364C101.433 81.9855 98.2124 87.326 94.3139 89.3073L67.932 102.749C66.1429 103.662 64.4927 103.721 63.211 103.064C61.7104 102.301 60.717 100.554 60.5942 98.0656L59.2698 71.3527L102.987 49.0723Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M105.235 31.3324C104.434 30.9265 103.409 30.9585 102.282 31.53L59.9746 53.0894C57.4326 54.3818 55.3765 57.9385 55.3765 61.0306V63.2683C55.3765 64.9933 56.0174 66.2055 57.0214 66.7182L52.263 64.2937C51.2537 63.781 50.6182 62.5634 50.6182 60.8437V58.6061C50.6182 55.5193 52.6742 51.9625 55.2163 50.6648L97.5234 29.1054C98.6449 28.534 99.6756 28.4966 100.477 28.9078L105.235 31.3324Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M105.235 31.3316C106.244 31.8443 106.88 33.0619 106.88 34.7816V37.0192C106.88 40.106 104.818 43.6627 102.282 44.9605L59.9746 66.5199C58.8531 67.0913 57.8224 67.1287 57.0213 66.7175C56.012 66.2048 55.3765 64.9872 55.3765 63.2676V61.0299C55.3765 57.9431 57.4325 54.3864 59.9746 53.0886L102.282 31.5292C103.403 30.9578 104.434 30.9204 105.235 31.3316Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M86.0947 91.7575C85.8384 91.7575 85.6034 91.7041 85.3844 91.5919C85.331 91.5652 85.2829 91.5385 85.2349 91.5011L80.5086 89.0926C80.5086 89.0926 80.4658 89.0659 80.4445 89.0552L73.0853 83.8536C72.1134 83.2448 71.9905 81.5625 72.8343 80.0405C73.4538 78.9083 74.4418 78.1767 75.355 78.1767C75.6114 78.1767 75.8517 78.2354 76.0707 78.3476L79.6755 80.1847V67.17C79.6755 65.7281 80.61 64.126 81.8063 63.5171C82.1267 63.3569 82.4472 63.2715 82.7569 63.2715C83.0132 63.2715 83.2589 63.3302 83.4779 63.4424L88.2362 65.8669C88.8397 66.1767 89.1868 66.8496 89.1868 67.7201V70.903C89.5126 70.7321 89.849 70.636 90.1695 70.636C90.4258 70.636 90.6608 70.6894 90.8797 70.8015L95.6381 73.2261C95.6755 73.2475 95.7182 73.2688 95.7556 73.2902C96.7489 73.9097 96.8664 75.5919 96.0279 77.1193C96.0012 77.1727 95.9585 77.2475 95.9158 77.3115L88.5727 89.9845C87.9425 91.0792 86.9972 91.7575 86.1 91.7575H86.0947Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M82.7516 63.8005C82.9278 63.8005 83.0881 63.8379 83.2322 63.9127L87.9906 66.3372C88.3911 66.5402 88.6475 67.0262 88.6475 67.7151V71.9874C89.1228 71.4641 89.6782 71.165 90.1642 71.165C90.3297 71.165 90.4899 71.2024 90.6288 71.2718L95.3871 73.6964C95.3871 73.6964 95.4352 73.7231 95.4619 73.7391C96.2042 74.2037 96.2469 75.5976 95.5527 76.8579C95.526 76.9113 95.4939 76.9647 95.4619 77.0128L88.1027 89.7178C87.558 90.6577 86.7623 91.2238 86.0947 91.2238C85.9292 91.2238 85.769 91.1864 85.6248 91.117C85.5821 91.0956 85.5447 91.0742 85.5073 91.0422L80.7489 88.6176L73.3898 83.416C72.6475 82.9514 72.6047 81.5522 73.299 80.2972C73.8384 79.3145 74.6608 78.7111 75.3551 78.7111C75.5206 78.7111 75.6862 78.7485 75.8304 78.8232L80.2096 81.0555V67.1703C80.2096 65.9367 81.032 64.5108 82.0467 63.9928C82.2977 63.8646 82.5326 63.8059 82.7516 63.8059M82.7516 62.7324C82.3564 62.7324 81.9612 62.8339 81.566 63.0315C80.1828 63.7364 79.1415 65.5148 79.1415 67.165V79.3092L76.3164 77.8673C76.0226 77.7177 75.6969 77.643 75.3551 77.643C74.2336 77.643 73.0854 78.4654 72.3644 79.7845C71.3764 81.5682 71.5634 83.5015 72.797 84.3025L80.1348 89.4881C80.1775 89.5202 80.2202 89.5469 80.2683 89.5682L84.9679 91.9661C85.0266 92.0035 85.0854 92.0355 85.1441 92.0676C85.4379 92.2171 85.7583 92.2919 86.0947 92.2919C87.1788 92.2919 88.3003 91.5122 89.0266 90.2518L96.3698 77.5736C96.4178 77.4988 96.4606 77.4294 96.4979 77.3546C97.4806 75.5549 97.2777 73.6163 96.028 72.8312C95.9799 72.7992 95.9265 72.7725 95.8731 72.7458L91.1148 70.3212C90.821 70.1717 90.5006 70.0969 90.1642 70.0969C90.0146 70.0969 89.8651 70.1129 89.7156 70.1396V67.7151C89.7156 66.6363 89.2616 65.7872 88.4766 65.3866L83.7182 62.9621C83.4192 62.8125 83.0987 62.7324 82.7516 62.7324Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M95.3923 73.6974C94.65 73.3182 93.5338 73.9591 92.8663 75.1767L88.6526 82.4611L83.8943 80.0365L88.1079 72.7521C88.7808 71.5345 89.8916 70.8936 90.6339 71.2728L95.3923 73.6974Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M80.5887 81.2486C79.841 80.8641 78.7248 81.505 78.0573 82.728C77.363 83.983 77.4057 85.3822 78.1481 85.8468L85.5072 91.0484L80.7489 88.6238L73.3897 83.4222C72.6474 82.9576 72.6047 81.5584 73.2989 80.3034C73.9665 79.0804 75.0773 78.4449 75.8303 78.8241L80.5887 81.2486Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M87.9905 66.3379C87.6701 66.1723 87.2535 66.183 86.8049 66.4127C85.7902 66.9307 84.9678 68.3566 84.9678 69.5902V84.3352L80.2095 81.9107V67.1657C80.2095 65.932 81.0319 64.5061 82.0466 63.9881C82.4952 63.7585 82.9117 63.7478 83.2322 63.9133L87.9905 66.3379Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M87.9905 66.3372C88.391 66.5401 88.6474 67.0261 88.6474 67.715V82.46L92.861 75.1756C93.5339 73.958 94.6447 73.3171 95.387 73.6963C95.4137 73.707 95.4351 73.723 95.4618 73.739C96.2041 74.2037 96.2468 75.5975 95.5526 76.8579C95.5259 76.9113 95.4938 76.9647 95.4618 77.0127L88.1026 89.7177C87.4244 90.8872 86.3456 91.48 85.6247 91.1169C85.5819 91.0955 85.5446 91.0742 85.5072 91.0421L78.148 85.8405C77.4057 85.3759 77.363 83.9767 78.0572 82.7217C78.7248 81.4987 79.8356 80.8632 80.5886 81.2424C80.6153 81.2531 80.6367 81.2691 80.658 81.2851C80.6847 81.3065 80.7168 81.3278 80.7488 81.3492L84.9678 84.3345V69.5895C84.9678 68.3559 85.7902 66.93 86.8049 66.4119C87.2535 66.1823 87.6701 66.1716 87.9905 66.3372Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M21.9345 49.7917C20.7703 49.1989 19.2749 49.247 17.6354 50.0854C13.9345 51.9706 10.9385 57.1508 10.9385 61.6475C10.9385 64.1575 11.8731 65.9305 13.3417 66.6782L10.9598 65.4659C9.49122 64.7183 8.55664 62.9452 8.55664 60.4352C8.55664 55.9332 11.558 50.753 15.2536 48.8731C16.8878 48.04 18.3884 47.9866 19.5526 48.5794L21.9345 49.7917Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M21.9345 49.7923C23.4031 50.54 24.3377 52.313 24.3377 54.823C24.3377 59.325 21.3363 64.5052 17.6408 66.3851C16.0066 67.2182 14.5059 67.2716 13.3417 66.6788C11.8731 65.9311 10.9385 64.1581 10.9385 61.6481C10.9385 57.1461 13.9398 51.9659 17.6354 50.086C19.2696 49.2529 20.7703 49.1995 21.9345 49.7923Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M19.9479 58.7846L19.5741 58.6938V58.0369C19.5741 57.818 19.4245 57.7112 19.243 57.8019C19.0614 57.8927 18.9119 58.1491 18.9119 58.368V59.2492C18.9119 59.3881 18.9706 59.4842 19.0667 59.5109L19.5954 59.6444C19.6488 59.6604 19.7076 59.6444 19.7717 59.6177C19.8838 59.5643 19.9906 59.4415 20.0494 59.2866C20.1455 59.0516 20.0974 58.8273 19.9426 58.7899L19.9479 58.7846Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M16.781 62.262L15.6274 62.8495C15.4458 62.9403 15.2963 62.8388 15.2963 62.6145V59.0097L16.6101 58.3368C16.7916 58.246 16.9412 57.9897 16.9412 57.7707C16.9412 57.5517 16.7916 57.4449 16.6101 57.5357L15.2963 58.2086V57.007C15.2963 56.7881 15.4458 56.5317 15.6274 56.4409L16.2843 56.1045V56.505C16.2843 56.724 16.4338 56.8308 16.6154 56.74C16.797 56.6492 16.9465 56.3929 16.9465 56.1739V55.7734L18.9225 54.7694V55.1699C18.9225 55.3889 19.072 55.4957 19.2536 55.4049C19.4352 55.3141 19.5847 55.0578 19.5847 54.8388V54.4383L20.2416 54.1018C20.4232 54.011 20.5727 54.1125 20.5727 54.3368V54.9349C20.5727 55.1539 20.7222 55.2607 20.9038 55.1699C21.0854 55.0791 21.2349 54.8228 21.2349 54.6038V54.0057C21.2349 53.3435 20.7916 53.0284 20.2469 53.3061L19.59 53.6425V53.242C19.59 53.023 19.4405 52.9162 19.2589 53.007C19.0774 53.0978 18.9278 53.3541 18.9278 53.5731V53.9736L16.9519 54.9776V54.5771C16.9519 54.3582 16.8023 54.2513 16.6207 54.3421C16.4392 54.4329 16.2896 54.6893 16.2896 54.9082V55.3088L15.6328 55.6452C15.088 55.9229 14.6448 56.6866 14.6448 57.3488V62.951C14.6448 63.6132 15.088 63.9283 15.6328 63.6505L16.7863 63.0631C16.9679 62.9723 17.1174 62.716 17.1174 62.497C17.1174 62.2781 16.9679 62.1712 16.7863 62.262H16.781Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M19.2483 56.2C17.9772 56.8462 16.9465 58.6299 16.9465 60.1733C16.9465 61.7167 17.9772 62.4484 19.2483 61.8022C20.5193 61.156 21.55 59.3723 21.55 57.8289C21.55 56.2855 20.5193 55.5538 19.2483 56.2ZM19.2483 61.0064C18.3404 61.4711 17.6034 60.9477 17.6034 59.8422C17.6034 58.7367 18.3404 57.4657 19.2483 57.0011C20.1561 56.5365 20.8931 57.0598 20.8931 58.1653C20.8931 59.2708 20.1561 60.5418 19.2483 61.0064Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/archived-work-item.tsx b/packages/propel/src/empty-state/assets/vertical-stack/archived-work-item.tsx
index 9b01e452b..adf06c9be 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/archived-work-item.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/archived-work-item.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const ArchivedWorkItemVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="176"
-    viewBox="0 0 162 176"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function ArchivedWorkItemVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="176"
+      viewBox="0 0 162 176"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M1 142.417C1 144.386 2.47405 146.349 5.41695 147.855L43.31 167.163C49.2011 170.163 58.7486 170.163 64.6396 167.163L144.265 126.593C147.207 125.093 148.681 123.129 148.681 121.16V127.447C148.681 129.416 147.207 131.38 144.265 132.88L64.6396 173.45C58.7486 176.45 49.2011 176.45 43.31 173.45L5.41695 154.141C2.46885 152.641 1 150.672 1 148.704V142.417Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 142.415C1 140.446 2.47405 138.483 5.41695 136.983L85.0419 96.4123C90.9329 93.4121 100.48 93.4121 106.371 96.4123L144.265 115.721C147.213 117.221 148.681 119.19 148.681 121.159C148.681 123.128 147.207 125.091 144.265 126.591L64.6396 167.162C58.7486 170.162 49.2011 170.162 43.31 167.162L5.41695 147.853C2.46885 146.353 1 144.384 1 142.415Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M1 122.555C1 124.524 2.47405 126.488 5.41695 127.993L43.31 147.302C49.2011 150.302 58.7486 150.302 64.6396 147.302L144.265 106.731C147.207 105.231 148.681 103.268 148.681 101.299V107.586C148.681 109.555 147.207 111.518 144.265 113.018L64.6396 153.589C58.7486 156.589 49.2011 156.589 43.31 153.589L5.41695 134.28C2.46885 132.78 1 130.811 1 128.842V122.555Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 122.556C1 120.587 2.47405 118.623 5.41695 117.123L85.0419 76.5529C90.9329 73.5527 100.48 73.5527 106.371 76.5529L144.265 95.8614C147.213 97.3615 148.681 99.3304 148.681 101.299C148.681 103.268 147.207 105.232 144.265 106.732L64.6396 147.302C58.7486 150.302 49.2011 150.302 43.31 147.302L5.41695 127.989C2.46885 126.488 1 124.52 1 122.551V122.556Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M1 142.417C1 144.386 2.47405 146.349 5.41695 147.855L43.31 167.163C49.2011 170.163 58.7486 170.163 64.6396 167.163L144.265 126.593C147.207 125.093 148.681 123.129 148.681 121.16V127.447C148.681 129.416 147.207 131.38 144.265 132.88L64.6396 173.45C58.7486 176.45 49.2011 176.45 43.31 173.45L5.41695 154.141C2.46885 152.641 1 150.672 1 148.704V142.417Z"
+        d="M1 102.69C1 104.659 2.47405 106.623 5.41695 108.128L43.31 127.437C49.2011 130.437 58.7486 130.437 64.6396 127.437L144.265 86.8662C147.207 85.3661 148.681 83.4025 148.681 81.4336V87.7205C148.681 89.6893 147.207 91.653 144.265 93.1531L64.6396 133.723C58.7486 136.724 49.2011 136.724 43.31 133.723L5.41695 114.415C2.46885 112.915 1 110.946 1 108.977V102.69Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -20,17 +56,121 @@ export const ArchivedWorkItemVerticalStackIllustration = ({ className }: TIllust
         strokeLinejoin="round"
       />
       <path
-        d="M1 142.415C1 140.446 2.47405 138.483 5.41695 136.983L85.0419 96.4123C90.9329 93.4121 100.48 93.4121 106.371 96.4123L144.265 115.721C147.213 117.221 148.681 119.19 148.681 121.159C148.681 123.128 147.207 125.091 144.265 126.591L64.6396 167.162C58.7486 170.162 49.2011 170.162 43.31 167.162L5.41695 147.853C2.46885 146.353 1 144.384 1 142.415Z"
+        d="M1 102.691C1 100.722 2.47405 98.7581 5.41695 97.258L85.0419 56.6876C90.9329 53.6875 100.48 53.6875 106.371 56.6876L144.265 75.9962C147.213 77.4963 148.681 79.4652 148.681 81.434C148.681 83.4029 147.207 85.3666 144.265 86.8667L64.6396 127.437C58.7486 130.437 49.2011 130.437 43.31 127.437L5.41695 108.128C2.46885 106.628 1 104.66 1 102.691Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M1 122.555C1 124.524 2.47405 126.488 5.41695 127.993L43.31 147.302C49.2011 150.302 58.7486 150.302 64.6396 147.302L144.265 106.731C147.207 105.231 148.681 103.268 148.681 101.299V107.586C148.681 109.555 147.207 111.518 144.265 113.018L64.6396 153.589C58.7486 156.589 49.2011 156.589 43.31 153.589L5.41695 134.28C2.46885 132.78 1 130.811 1 128.842V122.555Z"
+        d="M63.5145 99.7001C62.7644 99.7001 62.0717 99.5387 61.4414 99.2157L56.8005 96.851C55.1181 95.9968 54.0868 94.0591 53.9618 91.5329L52.67 65.4792C52.6596 65.276 52.769 65.0833 52.9513 64.9895L55.3837 63.7499L50.7584 61.3956C49.5552 60.7809 48.8677 59.385 48.8677 57.5672V55.3848C48.8677 52.197 51.0084 48.5145 53.6388 47.1759L94.9019 26.1485C95.5738 25.8047 96.2353 25.6328 96.8708 25.6328C97.3708 25.6328 97.8344 25.7422 98.2563 25.9557L102.897 28.3205C104.1 28.9351 104.788 30.331 104.788 32.1541V34.3365C104.788 37.5242 102.647 41.2067 100.017 42.5454L97.3344 43.91L100.704 45.6289C100.887 45.7227 100.996 45.9154 100.986 46.1185L99.6939 73.4901C99.4595 78.3862 96.1885 83.7928 92.2403 85.7982L66.5094 98.9084C65.4781 99.4345 64.4676 99.7001 63.504 99.7001H63.5145Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M96.8708 26.1531C97.2875 26.1531 97.6782 26.2468 98.0167 26.4187L102.658 28.7834C103.642 29.2835 104.262 30.4711 104.262 32.1482V34.3307C104.262 37.3413 102.251 40.8103 99.7773 42.076L96.1833 43.9094L100.465 46.0919L99.1731 73.4634C98.9491 78.1929 95.8083 83.4016 92.0059 85.334L66.2751 98.4442C65.2959 98.9443 64.3635 99.1787 63.5093 99.1787C62.8374 99.1787 62.2227 99.0328 61.6706 98.7515L57.0297 96.3868C55.5661 95.642 54.5972 93.9387 54.4774 91.5115L53.1857 65.4577L56.9099 63.5618C56.8682 63.5618 56.8213 63.5618 56.7797 63.5618C56.363 63.5618 55.9775 63.4732 55.6338 63.2961L50.9928 60.9314C50.0084 60.4313 49.3886 59.2438 49.3886 57.5666V55.3841C49.3886 52.3735 51.3939 48.9045 53.8732 47.6388L95.1363 26.6114C95.751 26.2989 96.3343 26.1531 96.8656 26.1531M96.8708 25.1113C96.1572 25.1113 95.4124 25.304 94.6676 25.6843L53.4045 46.7117C50.5709 48.1545 48.3521 51.962 48.3521 55.3841V57.5666C48.3521 59.5927 49.1438 61.1553 50.5293 61.8637L54.2431 63.7545L52.7221 64.5306C52.3575 64.7181 52.1335 65.0983 52.1544 65.5098L53.4461 91.5636C53.5763 94.2773 54.717 96.3764 56.5661 97.3192L61.2071 99.6839C61.9102 100.043 62.6863 100.226 63.5145 100.226C64.5562 100.226 65.65 99.9391 66.7543 99.3766L92.4851 86.2664C96.6521 84.1516 99.9752 78.6669 100.22 73.5155L101.512 46.1439C101.533 45.7325 101.309 45.3522 100.944 45.1647L98.4855 43.9094L100.256 43.0083C103.09 41.5655 105.309 37.7528 105.309 34.3359V32.1535C105.309 30.1273 104.517 28.5647 103.132 27.8563L98.4907 25.4916C97.9959 25.2415 97.449 25.1113 96.8708 25.1113Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M100.47 46.0913L57.8318 67.8219L53.1909 65.4571L95.8291 43.7266L100.47 46.0913Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M57.8318 67.8218L59.1236 93.8755C59.2434 96.3028 60.2122 98.006 61.6758 98.7509L57.0349 96.3861C55.5713 95.6413 54.6025 93.9381 54.4827 91.5108L53.1909 65.457L57.8318 67.8218Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M100.47 46.0898L99.1785 73.4614C98.9545 78.1909 95.8137 83.3996 92.0113 85.332L66.2805 98.4422C64.5356 99.3329 62.9261 99.3902 61.676 98.7495C60.2124 98.0047 59.2436 96.3014 59.1238 93.8742L57.832 67.8204L100.47 46.0898Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M102.663 28.7833C101.882 28.3875 100.882 28.4187 99.7827 28.976L58.5196 50.0035C56.0403 51.264 54.035 54.7329 54.035 57.7488V59.9312C54.035 61.6136 54.66 62.796 55.6392 63.296L50.9983 60.9312C50.0139 60.4312 49.394 59.2436 49.394 57.5664V55.384C49.394 52.3734 51.3994 48.9044 53.8787 47.6387L95.1418 26.6113C96.2356 26.054 97.2409 26.0175 98.0222 26.4186L102.663 28.7833Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M102.663 28.7819C103.647 29.2819 104.267 30.4695 104.267 32.1467V34.3291C104.267 37.3397 102.257 40.8087 99.7824 42.0744L58.5193 63.1018C57.4255 63.6591 56.4202 63.6956 55.6389 63.2945C54.6545 62.7945 54.0347 61.6069 54.0347 59.9297V57.7473C54.0347 54.7367 56.04 51.2677 58.5193 50.002L99.7824 28.9746C100.876 28.4173 101.882 28.3808 102.663 28.7819Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M83.995 87.7245C83.745 87.7245 83.5158 87.6724 83.3023 87.563C83.2502 87.537 83.2033 87.5109 83.1564 87.4744L78.5468 85.1253C78.5468 85.1253 78.5051 85.0993 78.4843 85.0889L71.3067 80.0156C70.3587 79.4218 70.2389 77.7811 71.0619 76.2966C71.6661 75.1924 72.6297 74.4788 73.5204 74.4788C73.7704 74.4788 74.0048 74.5361 74.2184 74.6455L77.7342 76.4373V63.7437C77.7342 62.3374 78.6457 60.7748 79.8125 60.181C80.125 60.0247 80.4375 59.9414 80.7396 59.9414C80.9896 59.9414 81.2292 59.9987 81.4428 60.1081L86.0837 62.4728C86.6723 62.7749 87.0109 63.4312 87.0109 64.2802V67.3846C87.3286 67.2179 87.6567 67.1242 87.9693 67.1242C88.2141 67.1242 88.4485 67.1763 88.662 67.2856L93.3029 69.6504C93.3394 69.6712 93.3759 69.692 93.4123 69.7129C94.3863 70.3223 94.5009 71.963 93.6832 73.4475C93.6571 73.4996 93.6155 73.5725 93.5738 73.635L86.4119 86.0004C85.7972 87.0682 84.8753 87.7297 84.0003 87.7297L83.995 87.7245Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M80.7346 60.4578C80.9064 60.4578 81.0627 60.4942 81.2033 60.5671L85.8443 62.9319C86.2349 63.1298 86.4849 63.6038 86.4849 64.2757V68.4426C86.9485 67.9322 87.4902 67.6405 87.9642 67.6405C88.1257 67.6405 88.2819 67.677 88.4173 67.7447L93.0583 70.1094C93.0583 70.1094 93.1052 70.1355 93.1312 70.1511C93.8552 70.6042 93.8969 71.9637 93.2197 73.193C93.1937 73.245 93.1624 73.2971 93.1312 73.344L85.9536 85.7354C85.4224 86.6522 84.6463 87.2043 83.9952 87.2043C83.8337 87.2043 83.6775 87.1678 83.5368 87.1001C83.4951 87.0793 83.4587 87.0584 83.4222 87.0272L78.7813 84.6624L71.6037 79.5892C70.8797 79.1361 70.8381 77.7714 71.5152 76.5473C72.0413 75.5889 72.8434 75.0004 73.5205 75.0004C73.682 75.0004 73.8435 75.0368 73.9841 75.1097L78.2552 77.287V63.7444C78.2552 62.5412 79.0574 61.1505 80.047 60.6453C80.2918 60.5203 80.521 60.463 80.7346 60.463M80.7346 59.416C80.3491 59.416 79.9637 59.515 79.5782 59.7077C78.2292 60.3952 77.2135 62.1297 77.2135 63.7392V75.5837L74.4581 74.1774C74.1716 74.0316 73.8539 73.9586 73.5205 73.9586C72.4267 73.9586 71.3069 74.7608 70.6037 76.0473C69.6401 77.787 69.8224 79.6725 71.0256 80.4538L78.1823 85.5115C78.224 85.5427 78.2656 85.5688 78.3125 85.5896L82.8961 87.9283C82.9534 87.9647 83.0107 87.996 83.068 88.0273C83.3545 88.1731 83.667 88.246 83.9952 88.246C85.0525 88.246 86.1464 87.4855 86.8547 86.2563L94.0167 73.8909C94.0635 73.818 94.1052 73.7503 94.1417 73.6774C95.1001 71.922 94.9021 70.0313 93.6833 69.2656C93.6364 69.2344 93.5843 69.2083 93.5323 69.1823L88.8913 66.8175C88.6049 66.6717 88.2923 66.5988 87.9642 66.5988C87.8183 66.5988 87.6725 66.6144 87.5267 66.6404V64.2757C87.5267 63.2236 87.0839 62.3954 86.3182 62.0047L81.6773 59.64C81.3856 59.4941 81.0731 59.416 80.7346 59.416Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M93.0634 70.1095C92.3394 69.7397 91.2508 70.3647 90.5997 71.5523L86.4901 78.6569L81.8491 76.2922L85.9588 69.1875C86.6151 68 87.6985 67.3749 88.4225 67.7447L93.0634 70.1095Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M78.6248 77.4693C77.8956 77.0943 76.807 77.7193 76.1559 78.9121C75.4788 80.1362 75.5205 81.5008 76.2445 81.954L83.422 87.0272L78.7811 84.6625L71.6035 79.5893C70.8795 79.1361 70.8379 77.7714 71.515 76.5474C72.1661 75.3546 73.2495 74.7348 73.9839 75.1046L78.6248 77.4693Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M85.8439 62.9315C85.5314 62.7701 85.1251 62.7805 84.6876 63.0045C83.6979 63.5097 82.8958 64.9004 82.8958 66.1036V80.4848L78.2549 78.12V63.7389C78.2549 62.5357 79.057 61.145 80.0467 60.6397C80.4842 60.4158 80.8905 60.4053 81.203 60.5668L85.8439 62.9315Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M85.8442 62.932C86.2349 63.13 86.4849 63.604 86.4849 64.2759V78.657L90.5946 71.5524C91.2508 70.3648 92.3343 69.7398 93.0583 70.1096C93.0843 70.12 93.1051 70.1356 93.1312 70.1513C93.8552 70.6044 93.8969 71.9639 93.2197 73.1931C93.1937 73.2452 93.1624 73.2973 93.1312 73.3442L85.9536 85.7356C85.2921 86.8763 84.24 87.4545 83.5368 87.1003C83.4951 87.0794 83.4587 87.0586 83.4222 87.0274L76.2447 81.9541C75.5207 81.501 75.479 80.1363 76.1561 78.9123C76.8072 77.7195 77.8906 77.0996 78.625 77.4694C78.6511 77.4799 78.6719 77.4955 78.6927 77.5111C78.7188 77.532 78.75 77.5528 78.7813 77.5736L82.8961 80.4853V66.1041C82.8961 64.9009 83.6983 63.5102 84.6879 63.005C85.1254 62.781 85.5317 62.7706 85.8442 62.932Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M147.952 47.5821C149.088 47.0039 150.546 47.0508 152.145 47.8686C155.755 49.7072 158.677 54.7596 158.677 59.1453C158.677 61.5934 157.765 63.3227 156.333 64.0519L158.656 62.8695C160.088 62.1403 161 60.411 161 57.963C161 53.572 158.073 48.5196 154.468 46.6862C152.874 45.8736 151.411 45.8215 150.275 46.3997L147.952 47.5821Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -38,292 +178,154 @@ export const ArchivedWorkItemVerticalStackIllustration = ({ className }: TIllust
         strokeLinejoin="round"
       />
       <path
-        d="M1 122.556C1 120.587 2.47405 118.623 5.41695 117.123L85.0419 76.5529C90.9329 73.5527 100.48 73.5527 106.371 76.5529L144.265 95.8614C147.213 97.3615 148.681 99.3304 148.681 101.299C148.681 103.268 147.207 105.232 144.265 106.732L64.6396 147.302C58.7486 150.302 49.2011 150.302 43.31 147.302L5.41695 127.989C2.46885 126.488 1 124.52 1 122.551V122.556Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M147.952 47.5813C146.52 48.3106 145.608 50.0398 145.608 52.4879C145.608 56.8788 148.536 61.9312 152.14 63.7647C153.734 64.5772 155.198 64.6293 156.333 64.0512C157.765 63.322 158.677 61.5927 158.677 59.1446C158.677 54.7537 155.75 49.7013 152.145 47.8678C150.551 47.0553 149.088 47.0032 147.952 47.5813Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M1 102.69C1 104.659 2.47405 106.623 5.41695 108.128L43.31 127.437C49.2011 130.437 58.7486 130.437 64.6396 127.437L144.265 86.8662C147.207 85.3661 148.681 83.4025 148.681 81.4336V87.7205C148.681 89.6893 147.207 91.653 144.265 93.1531L64.6396 133.723C58.7486 136.724 49.2011 136.724 43.31 133.723L5.41695 114.415C2.46885 112.915 1 110.946 1 108.977V102.69Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M1 102.691C1 100.722 2.47405 98.7581 5.41695 97.258L85.0419 56.6876C90.9329 53.6875 100.48 53.6875 106.371 56.6876L144.265 75.9962C147.213 77.4963 148.681 79.4652 148.681 81.434C148.681 83.4029 147.207 85.3666 144.265 86.8667L64.6396 127.437C58.7486 130.437 49.2011 130.437 43.31 127.437L5.41695 108.128C2.46885 106.628 1 104.66 1 102.691Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M63.5145 99.7001C62.7644 99.7001 62.0717 99.5387 61.4414 99.2157L56.8005 96.851C55.1181 95.9968 54.0868 94.0591 53.9618 91.5329L52.67 65.4792C52.6596 65.276 52.769 65.0833 52.9513 64.9895L55.3837 63.7499L50.7584 61.3956C49.5552 60.7809 48.8677 59.385 48.8677 57.5672V55.3848C48.8677 52.197 51.0084 48.5145 53.6388 47.1759L94.9019 26.1485C95.5738 25.8047 96.2353 25.6328 96.8708 25.6328C97.3708 25.6328 97.8344 25.7422 98.2563 25.9557L102.897 28.3205C104.1 28.9351 104.788 30.331 104.788 32.1541V34.3365C104.788 37.5242 102.647 41.2067 100.017 42.5454L97.3344 43.91L100.704 45.6289C100.887 45.7227 100.996 45.9154 100.986 46.1185L99.6939 73.4901C99.4595 78.3862 96.1885 83.7928 92.2403 85.7982L66.5094 98.9084C65.4781 99.4345 64.4676 99.7001 63.504 99.7001H63.5145Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M96.8708 26.1531C97.2875 26.1531 97.6782 26.2468 98.0167 26.4187L102.658 28.7834C103.642 29.2835 104.262 30.4711 104.262 32.1482V34.3307C104.262 37.3413 102.251 40.8103 99.7773 42.076L96.1833 43.9094L100.465 46.0919L99.1731 73.4634C98.9491 78.1929 95.8083 83.4016 92.0059 85.334L66.2751 98.4442C65.2959 98.9443 64.3635 99.1787 63.5093 99.1787C62.8374 99.1787 62.2227 99.0328 61.6706 98.7515L57.0297 96.3868C55.5661 95.642 54.5972 93.9387 54.4774 91.5115L53.1857 65.4577L56.9099 63.5618C56.8682 63.5618 56.8213 63.5618 56.7797 63.5618C56.363 63.5618 55.9775 63.4732 55.6338 63.2961L50.9928 60.9314C50.0084 60.4313 49.3886 59.2438 49.3886 57.5666V55.3841C49.3886 52.3735 51.3939 48.9045 53.8732 47.6388L95.1363 26.6114C95.751 26.2989 96.3343 26.1531 96.8656 26.1531M96.8708 25.1113C96.1572 25.1113 95.4124 25.304 94.6676 25.6843L53.4045 46.7117C50.5709 48.1545 48.3521 51.962 48.3521 55.3841V57.5666C48.3521 59.5927 49.1438 61.1553 50.5293 61.8637L54.2431 63.7545L52.7221 64.5306C52.3575 64.7181 52.1335 65.0983 52.1544 65.5098L53.4461 91.5636C53.5763 94.2773 54.717 96.3764 56.5661 97.3192L61.2071 99.6839C61.9102 100.043 62.6863 100.226 63.5145 100.226C64.5562 100.226 65.65 99.9391 66.7543 99.3766L92.4851 86.2664C96.6521 84.1516 99.9752 78.6669 100.22 73.5155L101.512 46.1439C101.533 45.7325 101.309 45.3522 100.944 45.1647L98.4855 43.9094L100.256 43.0083C103.09 41.5655 105.309 37.7528 105.309 34.3359V32.1535C105.309 30.1273 104.517 28.5647 103.132 27.8563L98.4907 25.4916C97.9959 25.2415 97.449 25.1113 96.8708 25.1113Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M100.47 46.0913L57.8318 67.8219L53.1909 65.4571L95.8291 43.7266L100.47 46.0913Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M57.8318 67.8218L59.1236 93.8755C59.2434 96.3028 60.2122 98.006 61.6758 98.7509L57.0349 96.3861C55.5713 95.6413 54.6025 93.9381 54.4827 91.5108L53.1909 65.457L57.8318 67.8218Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M100.47 46.0898L99.1785 73.4614C98.9545 78.1909 95.8137 83.3996 92.0113 85.332L66.2805 98.4422C64.5356 99.3329 62.9261 99.3902 61.676 98.7495C60.2124 98.0047 59.2436 96.3014 59.1238 93.8742L57.832 67.8204L100.47 46.0898Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M102.663 28.7833C101.882 28.3875 100.882 28.4187 99.7827 28.976L58.5196 50.0035C56.0403 51.264 54.035 54.7329 54.035 57.7488V59.9312C54.035 61.6136 54.66 62.796 55.6392 63.296L50.9983 60.9312C50.0139 60.4312 49.394 59.2436 49.394 57.5664V55.384C49.394 52.3734 51.3994 48.9044 53.8787 47.6387L95.1418 26.6113C96.2356 26.054 97.2409 26.0175 98.0222 26.4186L102.663 28.7833Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M102.663 28.7819C103.647 29.2819 104.267 30.4695 104.267 32.1467V34.3291C104.267 37.3397 102.257 40.8087 99.7824 42.0744L58.5193 63.1018C57.4255 63.6591 56.4202 63.6956 55.6389 63.2945C54.6545 62.7945 54.0347 61.6069 54.0347 59.9297V57.7473C54.0347 54.7367 56.04 51.2677 58.5193 50.002L99.7824 28.9746C100.876 28.4173 101.882 28.3808 102.663 28.7819Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M83.995 87.7245C83.745 87.7245 83.5158 87.6724 83.3023 87.563C83.2502 87.537 83.2033 87.5109 83.1564 87.4744L78.5468 85.1253C78.5468 85.1253 78.5051 85.0993 78.4843 85.0889L71.3067 80.0156C70.3587 79.4218 70.2389 77.7811 71.0619 76.2966C71.6661 75.1924 72.6297 74.4788 73.5204 74.4788C73.7704 74.4788 74.0048 74.5361 74.2184 74.6455L77.7342 76.4373V63.7437C77.7342 62.3374 78.6457 60.7748 79.8125 60.181C80.125 60.0247 80.4375 59.9414 80.7396 59.9414C80.9896 59.9414 81.2292 59.9987 81.4428 60.1081L86.0837 62.4728C86.6723 62.7749 87.0109 63.4312 87.0109 64.2802V67.3846C87.3286 67.2179 87.6567 67.1242 87.9693 67.1242C88.2141 67.1242 88.4485 67.1763 88.662 67.2856L93.3029 69.6504C93.3394 69.6712 93.3759 69.692 93.4123 69.7129C94.3863 70.3223 94.5009 71.963 93.6832 73.4475C93.6571 73.4996 93.6155 73.5725 93.5738 73.635L86.4119 86.0004C85.7972 87.0682 84.8753 87.7297 84.0003 87.7297L83.995 87.7245Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M80.7346 60.4578C80.9064 60.4578 81.0627 60.4942 81.2033 60.5671L85.8443 62.9319C86.2349 63.1298 86.4849 63.6038 86.4849 64.2757V68.4426C86.9485 67.9322 87.4902 67.6405 87.9642 67.6405C88.1257 67.6405 88.2819 67.677 88.4173 67.7447L93.0583 70.1094C93.0583 70.1094 93.1052 70.1355 93.1312 70.1511C93.8552 70.6042 93.8969 71.9637 93.2197 73.193C93.1937 73.245 93.1624 73.2971 93.1312 73.344L85.9536 85.7354C85.4224 86.6522 84.6463 87.2043 83.9952 87.2043C83.8337 87.2043 83.6775 87.1678 83.5368 87.1001C83.4951 87.0793 83.4587 87.0584 83.4222 87.0272L78.7813 84.6624L71.6037 79.5892C70.8797 79.1361 70.8381 77.7714 71.5152 76.5473C72.0413 75.5889 72.8434 75.0004 73.5205 75.0004C73.682 75.0004 73.8435 75.0368 73.9841 75.1097L78.2552 77.287V63.7444C78.2552 62.5412 79.0574 61.1505 80.047 60.6453C80.2918 60.5203 80.521 60.463 80.7346 60.463M80.7346 59.416C80.3491 59.416 79.9637 59.515 79.5782 59.7077C78.2292 60.3952 77.2135 62.1297 77.2135 63.7392V75.5837L74.4581 74.1774C74.1716 74.0316 73.8539 73.9586 73.5205 73.9586C72.4267 73.9586 71.3069 74.7608 70.6037 76.0473C69.6401 77.787 69.8224 79.6725 71.0256 80.4538L78.1823 85.5115C78.224 85.5427 78.2656 85.5688 78.3125 85.5896L82.8961 87.9283C82.9534 87.9647 83.0107 87.996 83.068 88.0273C83.3545 88.1731 83.667 88.246 83.9952 88.246C85.0525 88.246 86.1464 87.4855 86.8547 86.2563L94.0167 73.8909C94.0635 73.818 94.1052 73.7503 94.1417 73.6774C95.1001 71.922 94.9021 70.0313 93.6833 69.2656C93.6364 69.2344 93.5843 69.2083 93.5323 69.1823L88.8913 66.8175C88.6049 66.6717 88.2923 66.5988 87.9642 66.5988C87.8183 66.5988 87.6725 66.6144 87.5267 66.6404V64.2757C87.5267 63.2236 87.0839 62.3954 86.3182 62.0047L81.6773 59.64C81.3856 59.4941 81.0731 59.416 80.7346 59.416Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M93.0634 70.1095C92.3394 69.7397 91.2508 70.3647 90.5997 71.5523L86.4901 78.6569L81.8491 76.2922L85.9588 69.1875C86.6151 68 87.6985 67.3749 88.4225 67.7447L93.0634 70.1095Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M78.6248 77.4693C77.8956 77.0943 76.807 77.7193 76.1559 78.9121C75.4788 80.1362 75.5205 81.5008 76.2445 81.954L83.422 87.0272L78.7811 84.6625L71.6035 79.5893C70.8795 79.1361 70.8379 77.7714 71.515 76.5474C72.1661 75.3546 73.2495 74.7348 73.9839 75.1046L78.6248 77.4693Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M85.8439 62.9315C85.5314 62.7701 85.1251 62.7805 84.6876 63.0045C83.6979 63.5097 82.8958 64.9004 82.8958 66.1036V80.4848L78.2549 78.12V63.7389C78.2549 62.5357 79.057 61.145 80.0467 60.6397C80.4842 60.4158 80.8905 60.4053 81.203 60.5668L85.8439 62.9315Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M85.8442 62.932C86.2349 63.13 86.4849 63.604 86.4849 64.2759V78.657L90.5946 71.5524C91.2508 70.3648 92.3343 69.7398 93.0583 70.1096C93.0843 70.12 93.1051 70.1356 93.1312 70.1513C93.8552 70.6044 93.8969 71.9639 93.2197 73.1931C93.1937 73.2452 93.1624 73.2973 93.1312 73.3442L85.9536 85.7356C85.2921 86.8763 84.24 87.4545 83.5368 87.1003C83.4951 87.0794 83.4587 87.0586 83.4222 87.0274L76.2447 81.9541C75.5207 81.501 75.479 80.1363 76.1561 78.9123C76.8072 77.7195 77.8906 77.0996 78.625 77.4694C78.6511 77.4799 78.6719 77.4955 78.6927 77.5111C78.7188 77.532 78.75 77.5528 78.7813 77.5736L82.8961 80.4853V66.1041C82.8961 64.9009 83.6983 63.5102 84.6879 63.005C85.1254 62.781 85.5317 62.7706 85.8442 62.932Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M147.952 47.5821C149.088 47.0039 150.546 47.0508 152.145 47.8686C155.755 49.7072 158.677 54.7596 158.677 59.1453C158.677 61.5934 157.765 63.3227 156.333 64.0519L158.656 62.8695C160.088 62.1403 161 60.411 161 57.963C161 53.572 158.073 48.5196 154.468 46.6862C152.874 45.8736 151.411 45.8215 150.275 46.3997L147.952 47.5821Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M147.952 47.5813C146.52 48.3106 145.608 50.0398 145.608 52.4879C145.608 56.8788 148.536 61.9312 152.14 63.7647C153.734 64.5772 155.198 64.6293 156.333 64.0512C157.765 63.322 158.677 61.5927 158.677 59.1446C158.677 54.7537 155.75 49.7013 152.145 47.8678C150.551 47.0553 149.088 47.0032 147.952 47.5813Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <mask id="path-22-inside-1_637_1592" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+      <mask id="path-22-inside-1_637_1592" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M153.937 53.9148C153.755 53.6023 153.51 53.3523 153.249 53.2221C152.994 53.0919 152.744 53.0919 152.562 53.2221L149.796 55.1753C149.494 55.3889 149.322 55.8004 149.322 56.3212C149.322 56.8421 149.494 57.4255 149.796 57.9515C150.098 58.4724 150.51 58.8891 150.937 59.1079C151.364 59.3266 151.775 59.3266 152.078 59.1131L155.041 57.0192C155.166 56.9306 155.369 57.0348 155.5 57.2536C155.625 57.4723 155.625 57.7172 155.5 57.8109L152.536 59.9048C152.114 60.2069 151.536 60.2017 150.937 59.8944C150.338 59.5871 149.765 59.0089 149.338 58.2745C148.916 57.5453 148.676 56.7223 148.676 55.9931C148.676 55.2639 148.916 54.6857 149.338 54.3888L152.098 52.4356C152.4 52.222 152.812 52.222 153.239 52.4356C153.666 52.6543 154.078 53.071 154.38 53.5919C154.682 54.1128 154.854 54.7013 154.854 55.2222C154.854 55.7431 154.682 56.1545 154.38 56.3733L151.609 58.3266C151.426 58.4568 151.182 58.4516 150.926 58.3266C150.671 58.1963 150.421 57.9463 150.244 57.6338C150.067 57.3213 149.963 56.9671 149.963 56.6546C149.963 56.3421 150.067 56.0973 150.244 55.967L152.984 54.0346C153.109 53.9461 153.312 54.0502 153.442 54.269C153.567 54.4878 153.567 54.7326 153.442 54.8211L150.702 56.7535C150.64 56.7952 150.609 56.8786 150.609 56.9827C150.609 57.0869 150.645 57.2015 150.702 57.3109C150.765 57.415 150.843 57.4984 150.932 57.5401C151.02 57.5817 151.098 57.5817 151.161 57.5401L153.932 55.5868C154.114 55.4566 154.213 55.2118 154.213 54.8993C154.213 54.5867 154.109 54.2325 153.927 53.92L153.937 53.9148Z"
+        />
+      </mask>
       <path
         fillRule="evenodd"
         clipRule="evenodd"
         d="M153.937 53.9148C153.755 53.6023 153.51 53.3523 153.249 53.2221C152.994 53.0919 152.744 53.0919 152.562 53.2221L149.796 55.1753C149.494 55.3889 149.322 55.8004 149.322 56.3212C149.322 56.8421 149.494 57.4255 149.796 57.9515C150.098 58.4724 150.51 58.8891 150.937 59.1079C151.364 59.3266 151.775 59.3266 152.078 59.1131L155.041 57.0192C155.166 56.9306 155.369 57.0348 155.5 57.2536C155.625 57.4723 155.625 57.7172 155.5 57.8109L152.536 59.9048C152.114 60.2069 151.536 60.2017 150.937 59.8944C150.338 59.5871 149.765 59.0089 149.338 58.2745C148.916 57.5453 148.676 56.7223 148.676 55.9931C148.676 55.2639 148.916 54.6857 149.338 54.3888L152.098 52.4356C152.4 52.222 152.812 52.222 153.239 52.4356C153.666 52.6543 154.078 53.071 154.38 53.5919C154.682 54.1128 154.854 54.7013 154.854 55.2222C154.854 55.7431 154.682 56.1545 154.38 56.3733L151.609 58.3266C151.426 58.4568 151.182 58.4516 150.926 58.3266C150.671 58.1963 150.421 57.9463 150.244 57.6338C150.067 57.3213 149.963 56.9671 149.963 56.6546C149.963 56.3421 150.067 56.0973 150.244 55.967L152.984 54.0346C153.109 53.9461 153.312 54.0502 153.442 54.269C153.567 54.4878 153.567 54.7326 153.442 54.8211L150.702 56.7535C150.64 56.7952 150.609 56.8786 150.609 56.9827C150.609 57.0869 150.645 57.2015 150.702 57.3109C150.765 57.415 150.843 57.4984 150.932 57.5401C151.02 57.5817 151.098 57.5817 151.161 57.5401L153.932 55.5868C154.114 55.4566 154.213 55.2118 154.213 54.8993C154.213 54.5867 154.109 54.2325 153.927 53.92L153.937 53.9148Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
       />
-    </mask>
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M153.937 53.9148C153.755 53.6023 153.51 53.3523 153.249 53.2221C152.994 53.0919 152.744 53.0919 152.562 53.2221L149.796 55.1753C149.494 55.3889 149.322 55.8004 149.322 56.3212C149.322 56.8421 149.494 57.4255 149.796 57.9515C150.098 58.4724 150.51 58.8891 150.937 59.1079C151.364 59.3266 151.775 59.3266 152.078 59.1131L155.041 57.0192C155.166 56.9306 155.369 57.0348 155.5 57.2536C155.625 57.4723 155.625 57.7172 155.5 57.8109L152.536 59.9048C152.114 60.2069 151.536 60.2017 150.937 59.8944C150.338 59.5871 149.765 59.0089 149.338 58.2745C148.916 57.5453 148.676 56.7223 148.676 55.9931C148.676 55.2639 148.916 54.6857 149.338 54.3888L152.098 52.4356C152.4 52.222 152.812 52.222 153.239 52.4356C153.666 52.6543 154.078 53.071 154.38 53.5919C154.682 54.1128 154.854 54.7013 154.854 55.2222C154.854 55.7431 154.682 56.1545 154.38 56.3733L151.609 58.3266C151.426 58.4568 151.182 58.4516 150.926 58.3266C150.671 58.1963 150.421 57.9463 150.244 57.6338C150.067 57.3213 149.963 56.9671 149.963 56.6546C149.963 56.3421 150.067 56.0973 150.244 55.967L152.984 54.0346C153.109 53.9461 153.312 54.0502 153.442 54.269C153.567 54.4878 153.567 54.7326 153.442 54.8211L150.702 56.7535C150.64 56.7952 150.609 56.8786 150.609 56.9827C150.609 57.0869 150.645 57.2015 150.702 57.3109C150.765 57.415 150.843 57.4984 150.932 57.5401C151.02 57.5817 151.098 57.5817 151.161 57.5401L153.932 55.5868C154.114 55.4566 154.213 55.2118 154.213 54.8993C154.213 54.5867 154.109 54.2325 153.927 53.92L153.937 53.9148Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M153.937 53.9148L154.385 54.8091L155.338 54.332L154.801 53.4109L153.937 53.9148ZM153.249 53.2221L152.795 54.1129L152.802 54.1165L153.249 53.2221ZM152.562 53.2221L153.139 54.0389L153.143 54.0358L152.562 53.2221ZM149.796 55.1753L149.219 54.3585L149.219 54.3587L149.796 55.1753ZM149.796 57.9515L148.929 58.4495L148.931 58.4533L149.796 57.9515ZM152.078 59.1131L151.501 58.2963L151.5 58.2965L152.078 59.1131ZM155.041 57.0192L155.618 57.8359L155.619 57.8352L155.041 57.0192ZM155.5 57.2536L156.368 56.7574L156.363 56.7497L156.359 56.7421L155.5 57.2536ZM155.5 57.8109L156.077 58.6276L156.088 58.6194L156.1 58.6109L155.5 57.8109ZM152.536 59.9048L151.959 59.088L151.954 59.0917L152.536 59.9048ZM149.338 58.2745L148.472 58.7753L148.473 58.7772L149.338 58.2745ZM149.338 54.3888L149.913 55.2066L149.915 55.2051L149.338 54.3888ZM152.098 52.4356L151.521 51.619L151.521 51.6192L152.098 52.4356ZM153.239 52.4356L153.695 51.5455L153.686 51.5411L153.239 52.4356ZM154.38 56.3733L154.956 57.1907L154.966 57.1833L154.38 56.3733ZM151.609 58.3266L151.033 57.5092L151.028 57.5128L151.609 58.3266ZM150.926 58.3266L150.472 59.2173L150.479 59.221L150.487 59.2246L150.926 58.3266ZM150.244 55.967L149.668 55.1499L149.66 55.1555L149.652 55.1614L150.244 55.967ZM152.984 54.0346L153.56 54.8518L153.562 54.8506L152.984 54.0346ZM153.442 54.269L154.31 53.7729L154.306 53.7652L154.302 53.7575L153.442 54.269ZM153.442 54.8211L154.019 55.6383L154.02 55.6372L153.442 54.8211ZM150.702 56.7535L151.257 57.5856L151.268 57.5783L151.279 57.5707L150.702 56.7535ZM150.702 57.3109L149.817 57.7749L149.83 57.8005L149.845 57.8254L150.702 57.3109ZM151.161 57.5401L151.716 58.3721L151.726 58.3649L151.737 58.3574L151.161 57.5401ZM153.932 55.5868L154.508 56.4042L154.513 56.4005L153.932 55.5868ZM153.927 53.92L153.479 53.0257L152.526 53.5029L153.063 54.4239L153.927 53.92ZM153.937 53.9148L154.801 53.4109C154.549 52.9788 154.175 52.5668 153.697 52.3276L153.249 53.2221L152.802 54.1165C152.845 54.1378 152.961 54.2258 153.073 54.4187L153.937 53.9148ZM153.249 53.2221L153.704 52.3313C153.226 52.0872 152.555 51.998 151.981 52.4083L152.562 53.2221L153.143 54.0358C153.051 54.1018 152.952 54.1244 152.878 54.1244C152.811 54.1244 152.782 54.1064 152.795 54.1128L153.249 53.2221ZM152.562 53.2221L151.985 52.4052L149.219 54.3585L149.796 55.1753L150.373 55.9922L153.139 54.0389L152.562 53.2221ZM149.796 55.1753L149.219 54.3587C148.557 54.827 148.322 55.6129 148.322 56.3212H149.322H150.322C150.322 56.1673 150.348 56.0682 150.37 56.0161C150.39 55.9662 150.401 55.9727 150.373 55.9919L149.796 55.1753ZM149.322 56.3212H148.322C148.322 57.0475 148.557 57.8009 148.929 58.4495L149.796 57.9515L150.663 57.4536C150.432 57.05 150.322 56.6367 150.322 56.3212H149.322ZM149.796 57.9515L148.931 58.4533C149.305 59.0985 149.845 59.672 150.481 59.9979L150.937 59.1079L151.393 58.2178C151.175 58.1062 150.891 57.8463 150.661 57.4498L149.796 57.9515ZM150.937 59.1079L150.481 59.9979C151.13 60.3303 151.96 60.4207 152.655 59.9297L152.078 59.1131L151.5 58.2965C151.513 58.2874 151.528 58.2803 151.542 58.2762C151.555 58.2722 151.561 58.2726 151.557 58.2726C151.548 58.2726 151.493 58.2692 151.393 58.2178L150.937 59.1079ZM152.078 59.1131L152.655 59.9298L155.618 57.8359L155.041 57.0192L154.464 56.2025L151.501 58.2963L152.078 59.1131ZM155.041 57.0192L155.619 57.8352C155.271 58.0816 154.927 57.9696 154.813 57.9113C154.693 57.85 154.649 57.78 154.64 57.7651L155.5 57.2536L156.359 56.7421C156.22 56.5084 156.009 56.2769 155.724 56.131C155.445 55.988 154.936 55.8683 154.463 56.2032L155.041 57.0192ZM155.5 57.2536L154.631 57.7497C154.619 57.7282 154.593 57.6748 154.593 57.5791C154.593 57.5061 154.615 57.2241 154.9 57.0109L155.5 57.8109L156.1 58.6109C156.509 58.3039 156.593 57.8526 156.593 57.5791C156.593 57.2829 156.505 56.9977 156.368 56.7574L155.5 57.2536ZM155.5 57.8109L154.923 56.9942L151.959 59.0881L152.536 59.9048L153.113 60.7215L156.077 58.6276L155.5 57.8109ZM152.536 59.9048L151.954 59.0917C151.932 59.1072 151.779 59.2024 151.393 59.0046L150.937 59.8944L150.48 60.7841C151.293 61.201 152.296 61.3066 153.118 60.7178L152.536 59.9048ZM150.937 59.8944L151.393 59.0046C151.002 58.804 150.557 58.3818 150.202 57.7718L149.338 58.2745L148.473 58.7772C148.973 59.636 149.673 60.3701 150.48 60.7841L150.937 59.8944ZM149.338 58.2745L150.203 57.7737C149.855 57.1716 149.676 56.5195 149.676 55.9931H148.676H147.676C147.676 56.925 147.977 57.919 148.472 58.7753L149.338 58.2745ZM148.676 55.9931H149.676C149.676 55.4474 149.856 55.2472 149.913 55.2066L149.338 54.3888L148.762 53.571C147.976 54.1242 147.676 55.0803 147.676 55.9931H148.676ZM149.338 54.3888L149.915 55.2051L152.676 53.2519L152.098 52.4356L151.521 51.6192L148.76 53.5725L149.338 54.3888ZM152.098 52.4356L152.676 53.2521C152.663 53.2613 152.648 53.2681 152.635 53.2721C152.622 53.276 152.617 53.2754 152.622 53.2754C152.633 53.2754 152.69 53.2792 152.792 53.33L153.239 52.4356L153.686 51.5411C153.041 51.2187 152.214 51.129 151.521 51.619L152.098 52.4356ZM153.239 52.4356L152.783 53.3256C153.001 53.4373 153.285 53.6972 153.515 54.0936L154.38 53.5919L155.245 53.0902C154.871 52.4449 154.331 51.8714 153.695 51.5455L153.239 52.4356ZM154.38 53.5919L153.515 54.0936C153.743 54.4874 153.854 54.9047 153.854 55.2222H154.854H155.854C155.854 54.4979 155.621 53.7381 155.245 53.0902L154.38 53.5919ZM154.854 55.2222H153.854C153.854 55.3758 153.828 55.4754 153.806 55.5291C153.785 55.5804 153.772 55.5787 153.793 55.5634L154.38 56.3733L154.966 57.1833C155.617 56.7117 155.854 55.9346 155.854 55.2222H154.854ZM154.38 56.3733L153.804 55.556L151.033 57.5092L151.609 58.3266L152.185 59.1439L154.956 57.1907L154.38 56.3733ZM151.609 58.3266L151.028 57.5128C151.123 57.4444 151.226 57.4219 151.301 57.4223C151.366 57.4227 151.389 57.4398 151.366 57.4285L150.926 58.3266L150.487 59.2246C150.94 59.4468 151.606 59.5576 152.19 59.1403L151.609 58.3266ZM150.926 58.3266L151.381 57.4358C151.333 57.4112 151.214 57.3176 151.114 57.1408L150.244 57.6338L149.374 58.1268C149.628 58.575 150.01 58.9815 150.472 59.2173L150.926 58.3266ZM150.244 57.6338L151.114 57.1408C151.005 56.949 150.963 56.7632 150.963 56.6546H149.963H148.963C148.963 57.171 149.129 57.6936 149.374 58.1268L150.244 57.6338ZM149.963 56.6546H150.963C150.963 56.6066 150.971 56.6004 150.961 56.6245C150.951 56.6503 150.917 56.7137 150.836 56.7727L150.244 55.967L149.652 55.1614C149.133 55.5425 148.963 56.1466 148.963 56.6546H149.963ZM150.244 55.967L150.82 56.7842L153.56 54.8518L152.984 54.0346L152.407 53.2174L149.668 55.1499L150.244 55.967ZM152.984 54.0346L153.562 54.8506C153.214 55.097 152.869 54.985 152.755 54.9268C152.636 54.8655 152.592 54.7954 152.583 54.7805L153.442 54.269L154.302 53.7575C154.162 53.5239 153.952 53.2923 153.667 53.1464C153.387 53.0035 152.879 52.8837 152.406 53.2186L152.984 54.0346ZM153.442 54.269L152.574 54.7651C152.562 54.7442 152.536 54.6907 152.536 54.5939C152.536 54.5239 152.557 54.2227 152.864 54.0051L153.442 54.8211L154.02 55.6372C154.453 55.331 154.536 54.8631 154.536 54.5939C154.536 54.2978 154.447 54.0126 154.31 53.7729L153.442 54.269ZM153.442 54.8211L152.866 54.0039L150.126 55.9364L150.702 56.7535L151.279 57.5707L154.019 55.6383L153.442 54.8211ZM150.702 56.7535L150.148 55.9215C149.682 56.2319 149.609 56.729 149.609 56.9827H150.609H151.609C151.609 57.025 151.603 57.11 151.561 57.2161C151.516 57.3269 151.425 57.4735 151.257 57.5856L150.702 56.7535ZM150.609 56.9827H149.609C149.609 57.3044 149.715 57.5817 149.817 57.7749L150.702 57.3109L151.588 56.8469C151.585 56.8406 151.588 56.8455 151.593 56.8627C151.598 56.8789 151.609 56.9204 151.609 56.9827H150.609ZM150.702 57.3109L149.845 57.8254C149.963 58.0227 150.171 58.2873 150.506 58.4449L150.932 57.5401L151.357 56.6352C151.442 56.6749 151.494 56.7212 151.52 56.7478C151.547 56.7748 151.558 56.7937 151.56 56.7964L150.702 57.3109ZM150.932 57.5401L150.506 58.4449C150.802 58.5843 151.273 58.6669 151.716 58.3721L151.161 57.5401L150.606 56.708C150.745 56.6157 150.904 56.5713 151.056 56.5713C151.198 56.5713 151.302 56.6094 151.357 56.6352L150.932 57.5401ZM151.161 57.5401L151.737 58.3574L154.508 56.4042L153.932 55.5868L153.356 54.7695L150.585 56.7227L151.161 57.5401ZM153.932 55.5868L154.513 56.4005C155.056 56.0125 155.213 55.3916 155.213 54.8993H154.213H153.213C153.213 54.9538 153.204 54.9604 153.215 54.9338C153.227 54.9035 153.265 54.8343 153.351 54.7731L153.932 55.5868ZM154.213 54.8993H155.213C155.213 54.3819 155.047 53.8557 154.79 53.4162L153.927 53.92L153.063 54.4239C153.171 54.6094 153.213 54.7916 153.213 54.8993H154.213ZM153.927 53.92L154.374 54.8143L154.385 54.8091L153.937 53.9148L153.49 53.0205L153.479 53.0257L153.927 53.92Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-22-inside-1_637_1592)"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M145.66 31.3567C147.093 30.6275 148.004 28.9035 148.004 26.4502C148.004 22.0593 145.077 17.0068 141.473 15.1734L117.304 2.85488C115.711 2.04233 114.252 1.99024 113.117 2.56841L115.44 1.38604C116.575 0.807874 118.034 0.859961 119.628 1.67251L143.796 13.9858C147.405 15.8245 150.327 20.8769 150.327 25.2626C150.327 27.7159 149.416 29.4399 147.984 30.1692L145.66 31.3515V31.3567Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M145.661 31.3567C144.525 31.9348 143.067 31.8827 141.473 31.0702L117.305 18.7569C113.695 16.9182 110.773 11.8658 110.773 7.48011C110.773 5.02682 111.684 3.30275 113.117 2.57354C114.252 1.99537 115.711 2.04746 117.305 2.86001L141.473 15.1733C145.082 17.012 148.005 22.0644 148.005 26.4501C148.005 28.9034 147.093 30.6274 145.661 31.3567Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M118.058 13.2158C117.924 13.2467 117.793 13.3006 117.671 13.3867C117.64 13.4092 117.611 13.4349 117.583 13.46C117.629 13.3916 117.678 13.3404 117.727 13.3057C117.804 13.2514 117.913 13.2113 118.058 13.2158Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M123.195 13.1484C123.154 13.2058 123.112 13.2504 123.068 13.2812C122.993 13.3343 122.894 13.3704 122.763 13.3701C122.89 13.3379 123.013 13.2848 123.125 13.2051C123.15 13.1876 123.172 13.1676 123.195 13.1484Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <mask id="path-28-inside-2_637_1592" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
-      <path d="M124.633 19.4853C124.43 19.3811 124.263 19.0946 124.263 18.8498V17.9539C124.263 17.3393 123.925 16.6309 123.435 16.2299C123.237 16.0684 123.117 15.7611 123.169 15.5475C123.221 15.334 123.419 15.2923 123.617 15.4538C124.43 16.1257 124.998 17.3029 124.998 18.3238V19.2197C124.998 19.4697 124.831 19.5843 124.628 19.4801L124.633 19.4853Z" />
-    </mask>
-    <path
-      d="M124.633 19.4853C124.43 19.3811 124.263 19.0946 124.263 18.8498V17.9539C124.263 17.3393 123.925 16.6309 123.435 16.2299C123.237 16.0684 123.117 15.7611 123.169 15.5475C123.221 15.334 123.419 15.2923 123.617 15.4538C124.43 16.1257 124.998 17.3029 124.998 18.3238V19.2197C124.998 19.4697 124.831 19.5843 124.628 19.4801L124.633 19.4853Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M124.633 19.4853L124.177 20.3751L125.34 18.7785L124.633 19.4853ZM123.435 16.2299L124.069 15.4563L124.067 15.455L123.435 16.2299ZM123.617 15.4538L124.255 14.6831L124.249 14.6789L123.617 15.4538ZM124.628 19.4801L125.084 18.5903L123.92 20.1869L124.628 19.4801ZM124.633 19.4853L125.089 18.5955C125.152 18.6277 125.189 18.6614 125.206 18.6784C125.223 18.6966 125.232 18.7101 125.236 18.7174C125.241 18.7248 125.246 18.7353 125.251 18.7514C125.255 18.7667 125.263 18.7998 125.263 18.8498H124.263H123.263C123.263 19.1842 123.371 19.489 123.508 19.7233C123.642 19.9535 123.86 20.2125 124.177 20.3751L124.633 19.4853ZM124.263 18.8498H125.263V17.9539H124.263H123.263V18.8498H124.263ZM124.263 17.9539H125.263C125.263 17.0323 124.784 16.0426 124.069 15.4563L123.435 16.2299L122.801 17.0035C123.065 17.2193 123.263 17.6464 123.263 17.9539H124.263ZM123.435 16.2299L124.067 15.455C124.098 15.4805 124.115 15.502 124.123 15.5132C124.131 15.5248 124.136 15.535 124.14 15.5453C124.144 15.5551 124.151 15.5754 124.155 15.6082C124.158 15.6393 124.161 15.7014 124.141 15.7845L123.169 15.5475L122.198 15.3106C122.109 15.6763 122.18 16.0228 122.277 16.2712C122.377 16.5291 122.55 16.7981 122.803 17.0047L123.435 16.2299ZM123.169 15.5475L124.141 15.7845C124.098 15.9613 123.924 16.2591 123.544 16.3387C123.226 16.4054 123.024 16.2604 122.985 16.2287L123.617 15.4538L124.249 14.6789C124.013 14.4858 123.613 14.2808 123.133 14.3813C122.592 14.4948 122.293 14.9203 122.198 15.3106L123.169 15.5475ZM123.617 15.4538L122.98 16.2244C123.573 16.7146 123.998 17.6136 123.998 18.3238H124.998H125.998C125.998 16.9921 125.287 15.5368 124.255 14.6831L123.617 15.4538ZM124.998 18.3238H123.998V19.2197H124.998H125.998V18.3238H124.998ZM124.998 19.2197H123.998C123.998 19.1454 124.026 18.866 124.316 18.6631C124.634 18.4405 124.956 18.5244 125.084 18.5903L124.628 19.4801L124.172 20.3699C124.503 20.54 125.009 20.6187 125.462 20.3023C125.886 20.0057 125.998 19.5439 125.998 19.2197H124.998ZM124.628 19.4801L123.92 20.1869L123.926 20.1921L124.633 19.4853L125.34 18.7785L125.335 18.7733L124.628 19.4801Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-28-inside-2_637_1592)"
-    />
-    <path
-      d="M121.009 12C120.962 12.0714 120.911 12.1244 120.861 12.1602C120.783 12.2152 120.672 12.2539 120.524 12.248C120.66 12.2176 120.793 12.1649 120.916 12.0781C120.949 12.0544 120.979 12.0267 121.009 12ZM119.163 8.39746C119.028 8.42835 118.897 8.48227 118.776 8.56836C118.744 8.59085 118.716 8.61651 118.687 8.6416C118.733 8.57328 118.782 8.52201 118.832 8.4873C118.908 8.43304 119.018 8.39298 119.163 8.39746Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <mask id="path-31-inside-3_637_1592" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
-      <path d="M135.671 23.9392C135.467 23.835 135.301 23.5485 135.301 23.3037V18.8242C135.301 18.5742 135.467 18.4596 135.671 18.5638C135.874 18.668 136.04 18.9545 136.04 19.1993V23.6787C136.04 23.9287 135.874 24.0433 135.671 23.9392Z" />
-    </mask>
-    <path
-      d="M135.671 23.9392C135.467 23.835 135.301 23.5485 135.301 23.3037V18.8242C135.301 18.5742 135.467 18.4596 135.671 18.5638C135.874 18.668 136.04 18.9545 136.04 19.1993V23.6787C136.04 23.9287 135.874 24.0433 135.671 23.9392Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M135.671 23.9392L136.127 23.0493C136.19 23.0815 136.227 23.1152 136.243 23.1323C136.261 23.1504 136.27 23.1639 136.274 23.1712C136.278 23.1787 136.283 23.1891 136.288 23.2053C136.293 23.2206 136.301 23.2537 136.301 23.3037H135.301H134.301C134.301 23.6381 134.409 23.9428 134.545 24.1771C134.679 24.4073 134.897 24.6664 135.214 24.829L135.671 23.9392ZM135.301 23.3037H136.301V18.8242H135.301H134.301V23.3037H135.301ZM135.301 18.8242H136.301C136.301 18.8985 136.273 19.1779 135.982 19.3808C135.664 19.6034 135.343 19.5195 135.214 19.4536L135.671 18.5638L136.127 17.674C135.795 17.5039 135.289 17.4252 134.837 17.7416C134.412 18.0382 134.301 18.5 134.301 18.8242H135.301ZM135.671 18.5638L135.214 19.4536C135.151 19.4214 135.115 19.3877 135.098 19.3707C135.08 19.3525 135.072 19.339 135.067 19.3317C135.063 19.3243 135.058 19.3138 135.053 19.2977C135.048 19.2824 135.04 19.2493 135.04 19.1993H136.04H137.04C137.04 18.8649 136.932 18.5601 136.796 18.3258C136.662 18.0956 136.444 17.8366 136.127 17.674L135.671 18.5638ZM136.04 19.1993H135.04V23.6787H136.04H137.04V19.1993H136.04ZM136.04 23.6787H135.04C135.04 23.6045 135.068 23.325 135.359 23.1222C135.677 22.8996 135.998 22.9835 136.127 23.0493L135.671 23.9392L135.214 24.829C135.546 24.999 136.052 25.0777 136.505 24.7614C136.929 24.4647 137.04 24.003 137.04 23.6787H136.04Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-31-inside-3_637_1592)"
-    />
-    <mask id="path-33-inside-4_637_1592" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
-      <path d="M137.879 25.0695C137.675 24.9654 137.509 24.6789 137.509 24.4341V17.2617C137.509 17.0117 137.675 16.8971 137.879 17.0013C138.082 17.1055 138.248 17.392 138.248 17.6368V24.8091C138.248 25.0591 138.082 25.1737 137.879 25.0695Z" />
-    </mask>
-    <path
-      d="M137.879 25.0695C137.675 24.9654 137.509 24.6789 137.509 24.4341V17.2617C137.509 17.0117 137.675 16.8971 137.879 17.0013C138.082 17.1055 138.248 17.392 138.248 17.6368V24.8091C138.248 25.0591 138.082 25.1737 137.879 25.0695Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M137.879 25.0695L138.335 24.1797C138.398 24.2119 138.435 24.2456 138.451 24.2627C138.469 24.2808 138.478 24.2943 138.482 24.3016C138.486 24.3091 138.491 24.3195 138.496 24.3357C138.501 24.351 138.509 24.3841 138.509 24.4341H137.509H136.509C136.509 24.7684 136.617 25.0732 136.753 25.3075C136.887 25.5377 137.105 25.7967 137.422 25.9594L137.879 25.0695ZM137.509 24.4341H138.509V17.2617H137.509H136.509V24.4341H137.509ZM137.509 17.2617H138.509C138.509 17.336 138.481 17.6154 138.19 17.8183C137.872 18.0409 137.551 17.957 137.422 17.8911L137.879 17.0013L138.335 16.1115C138.003 15.9414 137.497 15.8627 137.045 16.1791C136.62 16.4757 136.509 16.9375 136.509 17.2617H137.509ZM137.879 17.0013L137.422 17.8911C137.359 17.8589 137.323 17.8252 137.306 17.8082C137.288 17.7901 137.28 17.7765 137.275 17.7693C137.271 17.7618 137.266 17.7513 137.261 17.7352C137.257 17.7199 137.248 17.6868 137.248 17.6368H138.248H139.248C139.248 17.3024 139.14 16.9976 139.004 16.7633C138.87 16.5331 138.652 16.2741 138.335 16.1115L137.879 17.0013ZM138.248 17.6368H137.248V24.8091H138.248H139.248V17.6368H138.248ZM138.248 24.8091H137.248C137.248 24.7349 137.277 24.4554 137.567 24.2525C137.885 24.0299 138.206 24.1138 138.335 24.1797L137.879 25.0695L137.422 25.9594C137.754 26.1294 138.26 26.2081 138.713 25.8918C139.137 25.5951 139.248 25.1334 139.248 24.8091H138.248Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-33-inside-4_637_1592)"
-    />
-    <mask id="path-35-inside-5_637_1592" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
-      <path d="M133.462 22.814C133.258 22.7098 133.092 22.4233 133.092 22.1785V20.3867C133.092 20.1367 133.258 20.0221 133.462 20.1263C133.665 20.2305 133.831 20.517 133.831 20.7618V22.5535C133.831 22.8036 133.665 22.9182 133.462 22.814Z" />
-    </mask>
-    <path
-      d="M133.462 22.814C133.258 22.7098 133.092 22.4233 133.092 22.1785V20.3867C133.092 20.1367 133.258 20.0221 133.462 20.1263C133.665 20.2305 133.831 20.517 133.831 20.7618V22.5535C133.831 22.8036 133.665 22.9182 133.462 22.814Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M133.462 22.814L133.918 21.9242C133.981 21.9564 134.018 21.9901 134.034 22.0071C134.052 22.0252 134.061 22.0387 134.065 22.046C134.069 22.0535 134.074 22.0639 134.079 22.0801C134.084 22.0954 134.092 22.1285 134.092 22.1785H133.092H132.092C132.092 22.5129 132.2 22.8177 132.336 23.052C132.47 23.2822 132.688 23.5412 133.005 23.7038L133.462 22.814ZM133.092 22.1785H134.092V20.3867H133.092H132.092V22.1785H133.092ZM133.092 20.3867H134.092C134.092 20.461 134.064 20.7404 133.773 20.9433C133.455 21.1659 133.134 21.082 133.005 21.0161L133.462 20.1263L133.918 19.2365C133.586 19.0664 133.08 18.9877 132.628 19.3041C132.203 19.6007 132.092 20.0625 132.092 20.3867H133.092ZM133.462 20.1263L133.005 21.0161C132.942 20.9839 132.906 20.9502 132.889 20.9332C132.871 20.915 132.863 20.9015 132.858 20.8942C132.854 20.8868 132.849 20.8763 132.844 20.8602C132.84 20.8449 132.831 20.8118 132.831 20.7618H133.831H134.831C134.831 20.4274 134.723 20.1226 134.587 19.8883C134.453 19.6581 134.235 19.3991 133.918 19.2365L133.462 20.1263ZM133.831 20.7618H132.831V22.5535H133.831H134.831V20.7618H133.831ZM133.831 22.5535H132.831C132.831 22.4793 132.86 22.1999 133.15 21.997C133.468 21.7744 133.789 21.8583 133.918 21.9242L133.462 22.814L133.005 23.7038C133.337 23.8738 133.843 23.9525 134.296 23.6362C134.72 23.3395 134.831 22.8778 134.831 22.5535H133.831Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      mask="url(#path-35-inside-5_637_1592)"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M33.8041 22.6582C32.6686 22.0801 31.2102 22.127 29.6111 22.9447C26.0015 24.7834 23.0794 29.8358 23.0794 34.2215C23.0794 36.6696 23.9909 38.3989 25.4233 39.1281L23.1003 37.9457C21.6679 37.2165 20.7563 35.4872 20.7563 33.0391C20.7563 28.6482 23.6836 23.5958 27.288 21.7624C28.8819 20.9498 30.3455 20.8977 31.481 21.4759L33.8041 22.6582Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M33.8042 22.6575C35.2366 23.3867 36.1482 25.116 36.1482 27.5641C36.1482 31.955 33.2209 37.0074 29.6165 38.8409C28.0226 39.6534 26.559 39.7055 25.4235 39.1273C23.9911 38.3981 23.0796 36.6688 23.0796 34.2208C23.0796 29.8299 26.0069 24.7775 29.6113 22.944C31.2051 22.1314 32.6688 22.0794 33.8042 22.6575Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M30.658 29.1273C30.7101 29.2367 30.8247 29.2628 30.9601 29.1794C31.1424 29.0648 31.2935 28.7836 31.2935 28.5544V28.1325C31.2935 27.9971 31.2414 27.8981 31.1528 27.8773C31.0643 27.8564 30.9497 27.9137 30.8455 28.0283L28.6891 30.4451C28.5589 30.591 28.4756 30.7941 28.4756 30.966V33.8672C28.4756 34.0131 28.5381 34.1068 28.6371 34.1173C28.736 34.1277 28.861 34.0548 28.96 33.9245L29.2673 33.5287C29.4288 33.3203 29.4913 33.0286 29.4079 32.8776C29.3506 32.7786 29.2465 32.7682 29.1371 32.8307V30.8254L30.6528 29.1221L30.658 29.1273Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M29.3299 28.7328C29.382 28.8422 29.4966 28.8682 29.632 28.7849C29.8143 28.6703 29.9654 28.389 29.9654 28.1599V27.738C29.9654 27.6025 29.9133 27.5036 29.8247 27.4827C29.7362 27.4619 29.6216 27.5192 29.5174 27.6338L27.361 30.0506C27.2308 30.1965 27.1475 30.3996 27.1475 30.5715V33.4727C27.1475 33.6185 27.21 33.7123 27.3089 33.7227C27.4079 33.7331 27.5329 33.6602 27.6319 33.53L27.9392 33.1341C28.1006 32.9258 28.1632 32.6341 28.0798 32.4831C28.0225 32.3841 27.9183 32.3737 27.809 32.4362V30.4308L29.3247 28.7276L29.3299 28.7328Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M32.7627 31.3306C32.7627 31.5025 32.6794 31.7108 32.5492 31.8515L30.398 34.2631C30.2938 34.3777 30.1792 34.435 30.0907 34.4141C30.0021 34.3933 29.9448 34.2995 29.9448 34.1641V31.2629C29.9448 31.091 30.0282 30.8826 30.1584 30.742L32.3148 28.3252C32.4189 28.2106 32.5335 28.1533 32.6221 28.1741C32.7106 28.195 32.7679 28.2887 32.7679 28.4242V31.3306H32.7627ZM32.1012 29.4555L30.6115 31.1275V33.1432L32.1012 31.4712V29.4555Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M153.937 53.9148L154.385 54.8091L155.338 54.332L154.801 53.4109L153.937 53.9148ZM153.249 53.2221L152.795 54.1129L152.802 54.1165L153.249 53.2221ZM152.562 53.2221L153.139 54.0389L153.143 54.0358L152.562 53.2221ZM149.796 55.1753L149.219 54.3585L149.219 54.3587L149.796 55.1753ZM149.796 57.9515L148.929 58.4495L148.931 58.4533L149.796 57.9515ZM152.078 59.1131L151.501 58.2963L151.5 58.2965L152.078 59.1131ZM155.041 57.0192L155.618 57.8359L155.619 57.8352L155.041 57.0192ZM155.5 57.2536L156.368 56.7574L156.363 56.7497L156.359 56.7421L155.5 57.2536ZM155.5 57.8109L156.077 58.6276L156.088 58.6194L156.1 58.6109L155.5 57.8109ZM152.536 59.9048L151.959 59.088L151.954 59.0917L152.536 59.9048ZM149.338 58.2745L148.472 58.7753L148.473 58.7772L149.338 58.2745ZM149.338 54.3888L149.913 55.2066L149.915 55.2051L149.338 54.3888ZM152.098 52.4356L151.521 51.619L151.521 51.6192L152.098 52.4356ZM153.239 52.4356L153.695 51.5455L153.686 51.5411L153.239 52.4356ZM154.38 56.3733L154.956 57.1907L154.966 57.1833L154.38 56.3733ZM151.609 58.3266L151.033 57.5092L151.028 57.5128L151.609 58.3266ZM150.926 58.3266L150.472 59.2173L150.479 59.221L150.487 59.2246L150.926 58.3266ZM150.244 55.967L149.668 55.1499L149.66 55.1555L149.652 55.1614L150.244 55.967ZM152.984 54.0346L153.56 54.8518L153.562 54.8506L152.984 54.0346ZM153.442 54.269L154.31 53.7729L154.306 53.7652L154.302 53.7575L153.442 54.269ZM153.442 54.8211L154.019 55.6383L154.02 55.6372L153.442 54.8211ZM150.702 56.7535L151.257 57.5856L151.268 57.5783L151.279 57.5707L150.702 56.7535ZM150.702 57.3109L149.817 57.7749L149.83 57.8005L149.845 57.8254L150.702 57.3109ZM151.161 57.5401L151.716 58.3721L151.726 58.3649L151.737 58.3574L151.161 57.5401ZM153.932 55.5868L154.508 56.4042L154.513 56.4005L153.932 55.5868ZM153.927 53.92L153.479 53.0257L152.526 53.5029L153.063 54.4239L153.927 53.92ZM153.937 53.9148L154.801 53.4109C154.549 52.9788 154.175 52.5668 153.697 52.3276L153.249 53.2221L152.802 54.1165C152.845 54.1378 152.961 54.2258 153.073 54.4187L153.937 53.9148ZM153.249 53.2221L153.704 52.3313C153.226 52.0872 152.555 51.998 151.981 52.4083L152.562 53.2221L153.143 54.0358C153.051 54.1018 152.952 54.1244 152.878 54.1244C152.811 54.1244 152.782 54.1064 152.795 54.1128L153.249 53.2221ZM152.562 53.2221L151.985 52.4052L149.219 54.3585L149.796 55.1753L150.373 55.9922L153.139 54.0389L152.562 53.2221ZM149.796 55.1753L149.219 54.3587C148.557 54.827 148.322 55.6129 148.322 56.3212H149.322H150.322C150.322 56.1673 150.348 56.0682 150.37 56.0161C150.39 55.9662 150.401 55.9727 150.373 55.9919L149.796 55.1753ZM149.322 56.3212H148.322C148.322 57.0475 148.557 57.8009 148.929 58.4495L149.796 57.9515L150.663 57.4536C150.432 57.05 150.322 56.6367 150.322 56.3212H149.322ZM149.796 57.9515L148.931 58.4533C149.305 59.0985 149.845 59.672 150.481 59.9979L150.937 59.1079L151.393 58.2178C151.175 58.1062 150.891 57.8463 150.661 57.4498L149.796 57.9515ZM150.937 59.1079L150.481 59.9979C151.13 60.3303 151.96 60.4207 152.655 59.9297L152.078 59.1131L151.5 58.2965C151.513 58.2874 151.528 58.2803 151.542 58.2762C151.555 58.2722 151.561 58.2726 151.557 58.2726C151.548 58.2726 151.493 58.2692 151.393 58.2178L150.937 59.1079ZM152.078 59.1131L152.655 59.9298L155.618 57.8359L155.041 57.0192L154.464 56.2025L151.501 58.2963L152.078 59.1131ZM155.041 57.0192L155.619 57.8352C155.271 58.0816 154.927 57.9696 154.813 57.9113C154.693 57.85 154.649 57.78 154.64 57.7651L155.5 57.2536L156.359 56.7421C156.22 56.5084 156.009 56.2769 155.724 56.131C155.445 55.988 154.936 55.8683 154.463 56.2032L155.041 57.0192ZM155.5 57.2536L154.631 57.7497C154.619 57.7282 154.593 57.6748 154.593 57.5791C154.593 57.5061 154.615 57.2241 154.9 57.0109L155.5 57.8109L156.1 58.6109C156.509 58.3039 156.593 57.8526 156.593 57.5791C156.593 57.2829 156.505 56.9977 156.368 56.7574L155.5 57.2536ZM155.5 57.8109L154.923 56.9942L151.959 59.0881L152.536 59.9048L153.113 60.7215L156.077 58.6276L155.5 57.8109ZM152.536 59.9048L151.954 59.0917C151.932 59.1072 151.779 59.2024 151.393 59.0046L150.937 59.8944L150.48 60.7841C151.293 61.201 152.296 61.3066 153.118 60.7178L152.536 59.9048ZM150.937 59.8944L151.393 59.0046C151.002 58.804 150.557 58.3818 150.202 57.7718L149.338 58.2745L148.473 58.7772C148.973 59.636 149.673 60.3701 150.48 60.7841L150.937 59.8944ZM149.338 58.2745L150.203 57.7737C149.855 57.1716 149.676 56.5195 149.676 55.9931H148.676H147.676C147.676 56.925 147.977 57.919 148.472 58.7753L149.338 58.2745ZM148.676 55.9931H149.676C149.676 55.4474 149.856 55.2472 149.913 55.2066L149.338 54.3888L148.762 53.571C147.976 54.1242 147.676 55.0803 147.676 55.9931H148.676ZM149.338 54.3888L149.915 55.2051L152.676 53.2519L152.098 52.4356L151.521 51.6192L148.76 53.5725L149.338 54.3888ZM152.098 52.4356L152.676 53.2521C152.663 53.2613 152.648 53.2681 152.635 53.2721C152.622 53.276 152.617 53.2754 152.622 53.2754C152.633 53.2754 152.69 53.2792 152.792 53.33L153.239 52.4356L153.686 51.5411C153.041 51.2187 152.214 51.129 151.521 51.619L152.098 52.4356ZM153.239 52.4356L152.783 53.3256C153.001 53.4373 153.285 53.6972 153.515 54.0936L154.38 53.5919L155.245 53.0902C154.871 52.4449 154.331 51.8714 153.695 51.5455L153.239 52.4356ZM154.38 53.5919L153.515 54.0936C153.743 54.4874 153.854 54.9047 153.854 55.2222H154.854H155.854C155.854 54.4979 155.621 53.7381 155.245 53.0902L154.38 53.5919ZM154.854 55.2222H153.854C153.854 55.3758 153.828 55.4754 153.806 55.5291C153.785 55.5804 153.772 55.5787 153.793 55.5634L154.38 56.3733L154.966 57.1833C155.617 56.7117 155.854 55.9346 155.854 55.2222H154.854ZM154.38 56.3733L153.804 55.556L151.033 57.5092L151.609 58.3266L152.185 59.1439L154.956 57.1907L154.38 56.3733ZM151.609 58.3266L151.028 57.5128C151.123 57.4444 151.226 57.4219 151.301 57.4223C151.366 57.4227 151.389 57.4398 151.366 57.4285L150.926 58.3266L150.487 59.2246C150.94 59.4468 151.606 59.5576 152.19 59.1403L151.609 58.3266ZM150.926 58.3266L151.381 57.4358C151.333 57.4112 151.214 57.3176 151.114 57.1408L150.244 57.6338L149.374 58.1268C149.628 58.575 150.01 58.9815 150.472 59.2173L150.926 58.3266ZM150.244 57.6338L151.114 57.1408C151.005 56.949 150.963 56.7632 150.963 56.6546H149.963H148.963C148.963 57.171 149.129 57.6936 149.374 58.1268L150.244 57.6338ZM149.963 56.6546H150.963C150.963 56.6066 150.971 56.6004 150.961 56.6245C150.951 56.6503 150.917 56.7137 150.836 56.7727L150.244 55.967L149.652 55.1614C149.133 55.5425 148.963 56.1466 148.963 56.6546H149.963ZM150.244 55.967L150.82 56.7842L153.56 54.8518L152.984 54.0346L152.407 53.2174L149.668 55.1499L150.244 55.967ZM152.984 54.0346L153.562 54.8506C153.214 55.097 152.869 54.985 152.755 54.9268C152.636 54.8655 152.592 54.7954 152.583 54.7805L153.442 54.269L154.302 53.7575C154.162 53.5239 153.952 53.2923 153.667 53.1464C153.387 53.0035 152.879 52.8837 152.406 53.2186L152.984 54.0346ZM153.442 54.269L152.574 54.7651C152.562 54.7442 152.536 54.6907 152.536 54.5939C152.536 54.5239 152.557 54.2227 152.864 54.0051L153.442 54.8211L154.02 55.6372C154.453 55.331 154.536 54.8631 154.536 54.5939C154.536 54.2978 154.447 54.0126 154.31 53.7729L153.442 54.269ZM153.442 54.8211L152.866 54.0039L150.126 55.9364L150.702 56.7535L151.279 57.5707L154.019 55.6383L153.442 54.8211ZM150.702 56.7535L150.148 55.9215C149.682 56.2319 149.609 56.729 149.609 56.9827H150.609H151.609C151.609 57.025 151.603 57.11 151.561 57.2161C151.516 57.3269 151.425 57.4735 151.257 57.5856L150.702 56.7535ZM150.609 56.9827H149.609C149.609 57.3044 149.715 57.5817 149.817 57.7749L150.702 57.3109L151.588 56.8469C151.585 56.8406 151.588 56.8455 151.593 56.8627C151.598 56.8789 151.609 56.9204 151.609 56.9827H150.609ZM150.702 57.3109L149.845 57.8254C149.963 58.0227 150.171 58.2873 150.506 58.4449L150.932 57.5401L151.357 56.6352C151.442 56.6749 151.494 56.7212 151.52 56.7478C151.547 56.7748 151.558 56.7937 151.56 56.7964L150.702 57.3109ZM150.932 57.5401L150.506 58.4449C150.802 58.5843 151.273 58.6669 151.716 58.3721L151.161 57.5401L150.606 56.708C150.745 56.6157 150.904 56.5713 151.056 56.5713C151.198 56.5713 151.302 56.6094 151.357 56.6352L150.932 57.5401ZM151.161 57.5401L151.737 58.3574L154.508 56.4042L153.932 55.5868L153.356 54.7695L150.585 56.7227L151.161 57.5401ZM153.932 55.5868L154.513 56.4005C155.056 56.0125 155.213 55.3916 155.213 54.8993H154.213H153.213C153.213 54.9538 153.204 54.9604 153.215 54.9338C153.227 54.9035 153.265 54.8343 153.351 54.7731L153.932 55.5868ZM154.213 54.8993H155.213C155.213 54.3819 155.047 53.8557 154.79 53.4162L153.927 53.92L153.063 54.4239C153.171 54.6094 153.213 54.7916 153.213 54.8993H154.213ZM153.927 53.92L154.374 54.8143L154.385 54.8091L153.937 53.9148L153.49 53.0205L153.479 53.0257L153.927 53.92Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-22-inside-1_637_1592)"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M145.66 31.3567C147.093 30.6275 148.004 28.9035 148.004 26.4502C148.004 22.0593 145.077 17.0068 141.473 15.1734L117.304 2.85488C115.711 2.04233 114.252 1.99024 113.117 2.56841L115.44 1.38604C116.575 0.807874 118.034 0.859961 119.628 1.67251L143.796 13.9858C147.405 15.8245 150.327 20.8769 150.327 25.2626C150.327 27.7159 149.416 29.4399 147.984 30.1692L145.66 31.3515V31.3567Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M145.661 31.3567C144.525 31.9348 143.067 31.8827 141.473 31.0702L117.305 18.7569C113.695 16.9182 110.773 11.8658 110.773 7.48011C110.773 5.02682 111.684 3.30275 113.117 2.57354C114.252 1.99537 115.711 2.04746 117.305 2.86001L141.473 15.1733C145.082 17.012 148.005 22.0644 148.005 26.4501C148.005 28.9034 147.093 30.6274 145.661 31.3567Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M118.058 13.2158C117.924 13.2467 117.793 13.3006 117.671 13.3867C117.64 13.4092 117.611 13.4349 117.583 13.46C117.629 13.3916 117.678 13.3404 117.727 13.3057C117.804 13.2514 117.913 13.2113 118.058 13.2158Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M123.195 13.1484C123.154 13.2058 123.112 13.2504 123.068 13.2812C122.993 13.3343 122.894 13.3704 122.763 13.3701C122.89 13.3379 123.013 13.2848 123.125 13.2051C123.15 13.1876 123.172 13.1676 123.195 13.1484Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <mask id="path-28-inside-2_637_1592" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path d="M124.633 19.4853C124.43 19.3811 124.263 19.0946 124.263 18.8498V17.9539C124.263 17.3393 123.925 16.6309 123.435 16.2299C123.237 16.0684 123.117 15.7611 123.169 15.5475C123.221 15.334 123.419 15.2923 123.617 15.4538C124.43 16.1257 124.998 17.3029 124.998 18.3238V19.2197C124.998 19.4697 124.831 19.5843 124.628 19.4801L124.633 19.4853Z" />
+      </mask>
+      <path
+        d="M124.633 19.4853C124.43 19.3811 124.263 19.0946 124.263 18.8498V17.9539C124.263 17.3393 123.925 16.6309 123.435 16.2299C123.237 16.0684 123.117 15.7611 123.169 15.5475C123.221 15.334 123.419 15.2923 123.617 15.4538C124.43 16.1257 124.998 17.3029 124.998 18.3238V19.2197C124.998 19.4697 124.831 19.5843 124.628 19.4801L124.633 19.4853Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M124.633 19.4853L124.177 20.3751L125.34 18.7785L124.633 19.4853ZM123.435 16.2299L124.069 15.4563L124.067 15.455L123.435 16.2299ZM123.617 15.4538L124.255 14.6831L124.249 14.6789L123.617 15.4538ZM124.628 19.4801L125.084 18.5903L123.92 20.1869L124.628 19.4801ZM124.633 19.4853L125.089 18.5955C125.152 18.6277 125.189 18.6614 125.206 18.6784C125.223 18.6966 125.232 18.7101 125.236 18.7174C125.241 18.7248 125.246 18.7353 125.251 18.7514C125.255 18.7667 125.263 18.7998 125.263 18.8498H124.263H123.263C123.263 19.1842 123.371 19.489 123.508 19.7233C123.642 19.9535 123.86 20.2125 124.177 20.3751L124.633 19.4853ZM124.263 18.8498H125.263V17.9539H124.263H123.263V18.8498H124.263ZM124.263 17.9539H125.263C125.263 17.0323 124.784 16.0426 124.069 15.4563L123.435 16.2299L122.801 17.0035C123.065 17.2193 123.263 17.6464 123.263 17.9539H124.263ZM123.435 16.2299L124.067 15.455C124.098 15.4805 124.115 15.502 124.123 15.5132C124.131 15.5248 124.136 15.535 124.14 15.5453C124.144 15.5551 124.151 15.5754 124.155 15.6082C124.158 15.6393 124.161 15.7014 124.141 15.7845L123.169 15.5475L122.198 15.3106C122.109 15.6763 122.18 16.0228 122.277 16.2712C122.377 16.5291 122.55 16.7981 122.803 17.0047L123.435 16.2299ZM123.169 15.5475L124.141 15.7845C124.098 15.9613 123.924 16.2591 123.544 16.3387C123.226 16.4054 123.024 16.2604 122.985 16.2287L123.617 15.4538L124.249 14.6789C124.013 14.4858 123.613 14.2808 123.133 14.3813C122.592 14.4948 122.293 14.9203 122.198 15.3106L123.169 15.5475ZM123.617 15.4538L122.98 16.2244C123.573 16.7146 123.998 17.6136 123.998 18.3238H124.998H125.998C125.998 16.9921 125.287 15.5368 124.255 14.6831L123.617 15.4538ZM124.998 18.3238H123.998V19.2197H124.998H125.998V18.3238H124.998ZM124.998 19.2197H123.998C123.998 19.1454 124.026 18.866 124.316 18.6631C124.634 18.4405 124.956 18.5244 125.084 18.5903L124.628 19.4801L124.172 20.3699C124.503 20.54 125.009 20.6187 125.462 20.3023C125.886 20.0057 125.998 19.5439 125.998 19.2197H124.998ZM124.628 19.4801L123.92 20.1869L123.926 20.1921L124.633 19.4853L125.34 18.7785L125.335 18.7733L124.628 19.4801Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-28-inside-2_637_1592)"
+      />
+      <path
+        d="M121.009 12C120.962 12.0714 120.911 12.1244 120.861 12.1602C120.783 12.2152 120.672 12.2539 120.524 12.248C120.66 12.2176 120.793 12.1649 120.916 12.0781C120.949 12.0544 120.979 12.0267 121.009 12ZM119.163 8.39746C119.028 8.42835 118.897 8.48227 118.776 8.56836C118.744 8.59085 118.716 8.61651 118.687 8.6416C118.733 8.57328 118.782 8.52201 118.832 8.4873C118.908 8.43304 119.018 8.39298 119.163 8.39746Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <mask id="path-31-inside-3_637_1592" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path d="M135.671 23.9392C135.467 23.835 135.301 23.5485 135.301 23.3037V18.8242C135.301 18.5742 135.467 18.4596 135.671 18.5638C135.874 18.668 136.04 18.9545 136.04 19.1993V23.6787C136.04 23.9287 135.874 24.0433 135.671 23.9392Z" />
+      </mask>
+      <path
+        d="M135.671 23.9392C135.467 23.835 135.301 23.5485 135.301 23.3037V18.8242C135.301 18.5742 135.467 18.4596 135.671 18.5638C135.874 18.668 136.04 18.9545 136.04 19.1993V23.6787C136.04 23.9287 135.874 24.0433 135.671 23.9392Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M135.671 23.9392L136.127 23.0493C136.19 23.0815 136.227 23.1152 136.243 23.1323C136.261 23.1504 136.27 23.1639 136.274 23.1712C136.278 23.1787 136.283 23.1891 136.288 23.2053C136.293 23.2206 136.301 23.2537 136.301 23.3037H135.301H134.301C134.301 23.6381 134.409 23.9428 134.545 24.1771C134.679 24.4073 134.897 24.6664 135.214 24.829L135.671 23.9392ZM135.301 23.3037H136.301V18.8242H135.301H134.301V23.3037H135.301ZM135.301 18.8242H136.301C136.301 18.8985 136.273 19.1779 135.982 19.3808C135.664 19.6034 135.343 19.5195 135.214 19.4536L135.671 18.5638L136.127 17.674C135.795 17.5039 135.289 17.4252 134.837 17.7416C134.412 18.0382 134.301 18.5 134.301 18.8242H135.301ZM135.671 18.5638L135.214 19.4536C135.151 19.4214 135.115 19.3877 135.098 19.3707C135.08 19.3525 135.072 19.339 135.067 19.3317C135.063 19.3243 135.058 19.3138 135.053 19.2977C135.048 19.2824 135.04 19.2493 135.04 19.1993H136.04H137.04C137.04 18.8649 136.932 18.5601 136.796 18.3258C136.662 18.0956 136.444 17.8366 136.127 17.674L135.671 18.5638ZM136.04 19.1993H135.04V23.6787H136.04H137.04V19.1993H136.04ZM136.04 23.6787H135.04C135.04 23.6045 135.068 23.325 135.359 23.1222C135.677 22.8996 135.998 22.9835 136.127 23.0493L135.671 23.9392L135.214 24.829C135.546 24.999 136.052 25.0777 136.505 24.7614C136.929 24.4647 137.04 24.003 137.04 23.6787H136.04Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-31-inside-3_637_1592)"
+      />
+      <mask id="path-33-inside-4_637_1592" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path d="M137.879 25.0695C137.675 24.9654 137.509 24.6789 137.509 24.4341V17.2617C137.509 17.0117 137.675 16.8971 137.879 17.0013C138.082 17.1055 138.248 17.392 138.248 17.6368V24.8091C138.248 25.0591 138.082 25.1737 137.879 25.0695Z" />
+      </mask>
+      <path
+        d="M137.879 25.0695C137.675 24.9654 137.509 24.6789 137.509 24.4341V17.2617C137.509 17.0117 137.675 16.8971 137.879 17.0013C138.082 17.1055 138.248 17.392 138.248 17.6368V24.8091C138.248 25.0591 138.082 25.1737 137.879 25.0695Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M137.879 25.0695L138.335 24.1797C138.398 24.2119 138.435 24.2456 138.451 24.2627C138.469 24.2808 138.478 24.2943 138.482 24.3016C138.486 24.3091 138.491 24.3195 138.496 24.3357C138.501 24.351 138.509 24.3841 138.509 24.4341H137.509H136.509C136.509 24.7684 136.617 25.0732 136.753 25.3075C136.887 25.5377 137.105 25.7967 137.422 25.9594L137.879 25.0695ZM137.509 24.4341H138.509V17.2617H137.509H136.509V24.4341H137.509ZM137.509 17.2617H138.509C138.509 17.336 138.481 17.6154 138.19 17.8183C137.872 18.0409 137.551 17.957 137.422 17.8911L137.879 17.0013L138.335 16.1115C138.003 15.9414 137.497 15.8627 137.045 16.1791C136.62 16.4757 136.509 16.9375 136.509 17.2617H137.509ZM137.879 17.0013L137.422 17.8911C137.359 17.8589 137.323 17.8252 137.306 17.8082C137.288 17.7901 137.28 17.7765 137.275 17.7693C137.271 17.7618 137.266 17.7513 137.261 17.7352C137.257 17.7199 137.248 17.6868 137.248 17.6368H138.248H139.248C139.248 17.3024 139.14 16.9976 139.004 16.7633C138.87 16.5331 138.652 16.2741 138.335 16.1115L137.879 17.0013ZM138.248 17.6368H137.248V24.8091H138.248H139.248V17.6368H138.248ZM138.248 24.8091H137.248C137.248 24.7349 137.277 24.4554 137.567 24.2525C137.885 24.0299 138.206 24.1138 138.335 24.1797L137.879 25.0695L137.422 25.9594C137.754 26.1294 138.26 26.2081 138.713 25.8918C139.137 25.5951 139.248 25.1334 139.248 24.8091H138.248Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-33-inside-4_637_1592)"
+      />
+      <mask id="path-35-inside-5_637_1592" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}>
+        <path d="M133.462 22.814C133.258 22.7098 133.092 22.4233 133.092 22.1785V20.3867C133.092 20.1367 133.258 20.0221 133.462 20.1263C133.665 20.2305 133.831 20.517 133.831 20.7618V22.5535C133.831 22.8036 133.665 22.9182 133.462 22.814Z" />
+      </mask>
+      <path
+        d="M133.462 22.814C133.258 22.7098 133.092 22.4233 133.092 22.1785V20.3867C133.092 20.1367 133.258 20.0221 133.462 20.1263C133.665 20.2305 133.831 20.517 133.831 20.7618V22.5535C133.831 22.8036 133.665 22.9182 133.462 22.814Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M133.462 22.814L133.918 21.9242C133.981 21.9564 134.018 21.9901 134.034 22.0071C134.052 22.0252 134.061 22.0387 134.065 22.046C134.069 22.0535 134.074 22.0639 134.079 22.0801C134.084 22.0954 134.092 22.1285 134.092 22.1785H133.092H132.092C132.092 22.5129 132.2 22.8177 132.336 23.052C132.47 23.2822 132.688 23.5412 133.005 23.7038L133.462 22.814ZM133.092 22.1785H134.092V20.3867H133.092H132.092V22.1785H133.092ZM133.092 20.3867H134.092C134.092 20.461 134.064 20.7404 133.773 20.9433C133.455 21.1659 133.134 21.082 133.005 21.0161L133.462 20.1263L133.918 19.2365C133.586 19.0664 133.08 18.9877 132.628 19.3041C132.203 19.6007 132.092 20.0625 132.092 20.3867H133.092ZM133.462 20.1263L133.005 21.0161C132.942 20.9839 132.906 20.9502 132.889 20.9332C132.871 20.915 132.863 20.9015 132.858 20.8942C132.854 20.8868 132.849 20.8763 132.844 20.8602C132.84 20.8449 132.831 20.8118 132.831 20.7618H133.831H134.831C134.831 20.4274 134.723 20.1226 134.587 19.8883C134.453 19.6581 134.235 19.3991 133.918 19.2365L133.462 20.1263ZM133.831 20.7618H132.831V22.5535H133.831H134.831V20.7618H133.831ZM133.831 22.5535H132.831C132.831 22.4793 132.86 22.1999 133.15 21.997C133.468 21.7744 133.789 21.8583 133.918 21.9242L133.462 22.814L133.005 23.7038C133.337 23.8738 133.843 23.9525 134.296 23.6362C134.72 23.3395 134.831 22.8778 134.831 22.5535H133.831Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        mask="url(#path-35-inside-5_637_1592)"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M33.8041 22.6582C32.6686 22.0801 31.2102 22.127 29.6111 22.9447C26.0015 24.7834 23.0794 29.8358 23.0794 34.2215C23.0794 36.6696 23.9909 38.3989 25.4233 39.1281L23.1003 37.9457C21.6679 37.2165 20.7563 35.4872 20.7563 33.0391C20.7563 28.6482 23.6836 23.5958 27.288 21.7624C28.8819 20.9498 30.3455 20.8977 31.481 21.4759L33.8041 22.6582Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M33.8042 22.6575C35.2366 23.3867 36.1482 25.116 36.1482 27.5641C36.1482 31.955 33.2209 37.0074 29.6165 38.8409C28.0226 39.6534 26.559 39.7055 25.4235 39.1273C23.9911 38.3981 23.0796 36.6688 23.0796 34.2208C23.0796 29.8299 26.0069 24.7775 29.6113 22.944C31.2051 22.1314 32.6688 22.0794 33.8042 22.6575Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M30.658 29.1273C30.7101 29.2367 30.8247 29.2628 30.9601 29.1794C31.1424 29.0648 31.2935 28.7836 31.2935 28.5544V28.1325C31.2935 27.9971 31.2414 27.8981 31.1528 27.8773C31.0643 27.8564 30.9497 27.9137 30.8455 28.0283L28.6891 30.4451C28.5589 30.591 28.4756 30.7941 28.4756 30.966V33.8672C28.4756 34.0131 28.5381 34.1068 28.6371 34.1173C28.736 34.1277 28.861 34.0548 28.96 33.9245L29.2673 33.5287C29.4288 33.3203 29.4913 33.0286 29.4079 32.8776C29.3506 32.7786 29.2465 32.7682 29.1371 32.8307V30.8254L30.6528 29.1221L30.658 29.1273Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M29.3299 28.7328C29.382 28.8422 29.4966 28.8682 29.632 28.7849C29.8143 28.6703 29.9654 28.389 29.9654 28.1599V27.738C29.9654 27.6025 29.9133 27.5036 29.8247 27.4827C29.7362 27.4619 29.6216 27.5192 29.5174 27.6338L27.361 30.0506C27.2308 30.1965 27.1475 30.3996 27.1475 30.5715V33.4727C27.1475 33.6185 27.21 33.7123 27.3089 33.7227C27.4079 33.7331 27.5329 33.6602 27.6319 33.53L27.9392 33.1341C28.1006 32.9258 28.1632 32.6341 28.0798 32.4831C28.0225 32.3841 27.9183 32.3737 27.809 32.4362V30.4308L29.3247 28.7276L29.3299 28.7328Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M32.7627 31.3306C32.7627 31.5025 32.6794 31.7108 32.5492 31.8515L30.398 34.2631C30.2938 34.3777 30.1792 34.435 30.0907 34.4141C30.0021 34.3933 29.9448 34.2995 29.9448 34.1641V31.2629C29.9448 31.091 30.0282 30.8826 30.1584 30.742L32.3148 28.3252C32.4189 28.2106 32.5335 28.1533 32.6221 28.1741C32.7106 28.195 32.7679 28.2887 32.7679 28.4242V31.3306H32.7627ZM32.1012 29.4555L30.6115 31.1275V33.1432L32.1012 31.4712V29.4555Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx b/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx
index 533624e51..c89a00d15 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const CustomerVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="171"
-    viewBox="0 0 162 171"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function CustomerVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="171"
+      viewBox="0 0 162 171"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M16.4846 137.74C16.4846 139.667 17.9271 141.589 20.8069 143.062L57.8876 161.956C63.6523 164.892 72.9951 164.892 78.7598 161.956L156.678 122.256C159.558 120.788 161 118.866 161 116.939V123.092C161 125.018 159.558 126.94 156.678 128.408L78.7598 168.108C72.9951 171.044 63.6523 171.044 57.8876 168.108L20.8069 149.214C17.922 147.746 16.4846 145.819 16.4846 143.892V137.74Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M16.4846 137.74C16.4846 135.813 17.9271 133.892 20.8069 132.424L98.7248 92.7234C104.49 89.7875 113.832 89.7875 119.597 92.7234L156.678 111.618C159.563 113.086 161 115.013 161 116.939C161 118.866 159.558 120.787 156.678 122.255L78.7598 161.956C72.9951 164.892 63.6523 164.892 57.8876 161.956L20.8069 143.061C17.922 141.593 16.4846 139.667 16.4846 137.74Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M16.4846 118.307C16.4846 120.233 17.9271 122.155 20.8069 123.628L57.8876 142.523C63.6523 145.458 72.9951 145.458 78.7598 142.523L156.678 102.822C159.558 101.354 161 99.4325 161 97.5059V103.658C161 105.585 159.558 107.506 156.678 108.974L78.7598 148.675C72.9951 151.61 63.6523 151.61 57.8876 148.675L20.8069 129.78C17.922 128.312 16.4846 126.385 16.4846 124.459V118.307Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M16.4846 118.306C16.4846 116.38 17.9271 114.458 20.8069 112.99L98.7248 73.2898C104.49 70.3539 113.832 70.3539 119.597 73.2898L156.678 92.1843C159.563 93.6522 161 95.579 161 97.5057C161 99.4323 159.558 101.354 156.678 102.822L78.7598 142.522C72.9951 145.458 63.6523 145.458 57.8876 142.522L20.8069 123.628C17.922 122.16 16.4846 120.233 16.4846 118.306Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M16.4846 137.74C16.4846 139.667 17.9271 141.589 20.8069 143.062L57.8876 161.956C63.6523 164.892 72.9951 164.892 78.7598 161.956L156.678 122.256C159.558 120.788 161 118.866 161 116.939V123.092C161 125.018 159.558 126.94 156.678 128.408L78.7598 168.108C72.9951 171.044 63.6523 171.044 57.8876 168.108L20.8069 149.214C17.922 147.746 16.4846 145.819 16.4846 143.892V137.74Z"
+        d="M16.4846 98.8712C16.4846 100.798 17.9271 102.719 20.8069 104.192L57.8876 123.087C63.6523 126.023 72.9951 126.023 78.7598 123.087L156.678 83.3865C159.558 81.9185 161 79.997 161 78.0703V84.2224C161 86.1491 159.558 88.0706 156.678 89.5386L78.7598 129.239C72.9951 132.175 63.6523 132.175 57.8876 129.239L20.8069 110.345C17.922 108.877 16.4846 106.95 16.4846 105.023V98.8712Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -20,17 +56,197 @@ export const CustomerVerticalStackIllustration = ({ className }: TIllustrationAs
         strokeLinejoin="round"
       />
       <path
-        d="M16.4846 137.74C16.4846 135.813 17.9271 133.892 20.8069 132.424L98.7248 92.7234C104.49 89.7875 113.832 89.7875 119.597 92.7234L156.678 111.618C159.563 113.086 161 115.013 161 116.939C161 118.866 159.558 120.787 156.678 122.255L78.7598 161.956C72.9951 164.892 63.6523 164.892 57.8876 161.956L20.8069 143.061C17.922 141.593 16.4846 139.667 16.4846 137.74Z"
+        d="M16.4846 98.871C16.4846 96.9444 17.9271 95.0228 20.8069 93.5549L98.7248 53.8542C104.49 50.9184 113.832 50.9184 119.597 53.8542L156.678 72.7489C159.563 74.2168 161 76.1435 161 78.0701C161 79.9968 159.558 81.9183 156.678 83.3863L78.7598 123.087C72.9951 126.023 63.6523 126.023 57.8876 123.087L20.8069 104.192C17.922 102.724 16.4846 100.798 16.4846 98.871Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M16.4846 118.307C16.4846 120.233 17.9271 122.155 20.8069 123.628L57.8876 142.523C63.6523 145.458 72.9951 145.458 78.7598 142.523L156.678 102.822C159.558 101.354 161 99.4325 161 97.5059V103.658C161 105.585 159.558 107.506 156.678 108.974L78.7598 148.675C72.9951 151.61 63.6523 151.61 57.8876 148.675L20.8069 129.78C17.922 128.312 16.4846 126.385 16.4846 124.459V118.307Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M64.1877 99.2221C63.9583 99.2221 63.7391 99.1762 63.5353 99.0947C63.4996 99.0845 63.4588 99.0743 63.4231 99.0539L58.8817 96.7399C58.2497 96.4188 57.8827 95.7052 57.8827 94.7826C57.8827 93.2382 58.8868 91.5155 60.1661 90.8631L61.894 89.9813V37.6656L60.8848 37.1508C60.2528 36.8297 59.8909 36.1162 59.8909 35.1885C59.8909 33.6441 60.895 31.9263 62.1744 31.2739L94.26 14.9279C94.6015 14.7546 94.9379 14.668 95.2692 14.668C95.5342 14.668 95.7891 14.7291 96.0134 14.8412L100.555 17.1552V17.1655C101.182 17.4866 101.549 18.2002 101.549 19.1125C101.549 20.5448 100.687 22.1248 99.5405 22.869V26.8753L110.305 21.3909C110.647 21.2176 110.983 21.1309 111.309 21.1309C111.575 21.1309 111.829 21.1921 112.054 21.3043L116.595 23.6182V23.6284C117.222 23.9495 117.589 24.6682 117.589 25.5806C117.589 27.0078 116.728 28.5879 115.586 29.3321V64.9856L118.598 66.5198V66.53C119.22 66.8511 119.592 67.5697 119.592 68.482C119.592 70.0264 118.588 71.7442 117.309 72.3966L65.1714 98.9622C64.835 99.1304 64.5037 99.217 64.1826 99.217L64.1877 99.2221ZM80.2178 76.6628C79.8304 76.8615 79.494 77.4528 79.494 77.937V81.0156L81.9507 79.7618V75.7759L80.2178 76.6577V76.6628Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M95.2692 15.1788C95.4578 15.1788 95.6311 15.2196 95.784 15.296L100.325 17.6101C100.295 17.5948 100.259 17.5897 100.229 17.5744C100.723 17.7681 101.044 18.3083 101.044 19.1137C101.044 20.4644 100.147 22.0139 99.0359 22.5797V27.7072L110.54 21.8456C110.815 21.708 111.075 21.6418 111.31 21.6418C111.498 21.6418 111.671 21.6825 111.824 21.759L116.366 24.073C116.335 24.0578 116.299 24.0526 116.269 24.0373C116.758 24.231 117.084 24.7764 117.084 25.5766C117.084 26.9222 116.187 28.4718 115.081 29.0375V65.2976L118.374 66.9745C118.343 66.9592 118.308 66.9541 118.277 66.9388C118.766 67.1325 119.088 67.6779 119.088 68.4781C119.088 69.8237 118.19 71.3732 117.084 71.939L64.9472 98.5046C64.677 98.6422 64.4222 98.7084 64.1877 98.7084C63.9736 98.7084 63.7748 98.6523 63.6015 98.5504C63.6219 98.5606 63.6372 98.581 63.6576 98.5912L59.1162 96.2772C58.6778 96.0529 58.3975 95.5228 58.3975 94.7736C58.3975 93.4229 59.2997 91.8734 60.4057 91.3076L62.4089 90.2882V37.3508L61.1193 36.6932C60.681 36.469 60.4006 35.9389 60.4006 35.1845C60.4006 33.8389 61.2977 32.2894 62.4038 31.7237L94.4894 15.3775C94.7646 15.2348 95.0246 15.1686 95.2641 15.1686M99.6934 17.5029C99.724 17.5029 99.7495 17.4978 99.775 17.4978C99.7495 17.4978 99.7189 17.4978 99.6934 17.5029ZM100.009 17.5131C100.04 17.5131 100.076 17.5234 100.106 17.5336C100.076 17.5234 100.045 17.5182 100.009 17.5131C99.9788 17.5131 99.9432 17.5029 99.9075 17.5029C99.9432 17.5029 99.9737 17.508 100.009 17.5131ZM99.2296 17.6101C99.1633 17.6356 99.1022 17.661 99.0359 17.6967C99.1022 17.661 99.1684 17.6356 99.2296 17.6101ZM115.744 23.966C115.693 23.9711 115.642 23.9813 115.586 23.9915C115.637 23.9813 115.693 23.9711 115.744 23.966C115.769 23.966 115.795 23.966 115.82 23.9609C115.795 23.9609 115.769 23.9609 115.744 23.966ZM116.06 23.9813C116.024 23.9813 115.994 23.9711 115.958 23.9711C115.994 23.9711 116.029 23.9762 116.06 23.9813ZM115.275 24.073C115.336 24.0476 115.402 24.0271 115.464 24.0118C115.402 24.0271 115.341 24.0476 115.275 24.073ZM90.4424 35.0214C90.4679 35.0418 90.4984 35.0621 90.5239 35.0876C90.4984 35.0621 90.473 35.0418 90.4424 35.0214C90.4169 35.001 90.3863 34.9806 90.3557 34.9653C90.3863 34.9806 90.4118 35.001 90.4424 35.0214ZM90.7584 35.3782C90.7176 35.3119 90.6768 35.2457 90.631 35.1896C90.6768 35.2457 90.7227 35.3119 90.7584 35.3782ZM90.8807 35.633C90.896 35.684 90.9113 35.735 90.9266 35.786C90.9113 35.735 90.896 35.6789 90.8807 35.633C90.8654 35.5922 90.8552 35.5515 90.8348 35.5158C90.8501 35.5515 90.8654 35.5922 90.8807 35.633ZM91.0183 36.4231C91.0183 36.2447 90.9979 36.0816 90.9725 35.9287C91.003 36.0816 91.0183 36.2447 91.0183 36.4231ZM80.4114 40.1286C80.4369 40.149 80.4624 40.1693 80.493 40.1948C80.4675 40.1693 80.442 40.149 80.4114 40.1286C80.386 40.1082 80.3554 40.0878 80.3299 40.0725C80.3605 40.0878 80.386 40.1082 80.4114 40.1286ZM80.6714 40.3886C80.6918 40.4191 80.7122 40.4497 80.7326 40.4854C80.7122 40.4548 80.6918 40.4191 80.6714 40.3886ZM85.8652 41.0461C85.8652 41.0461 85.9111 41.0613 85.9366 41.0715C85.9111 41.0664 85.8856 41.0563 85.8652 41.0461ZM80.9925 41.5303C80.9925 41.3519 80.9721 41.1888 80.9467 41.0359C80.9772 41.1888 80.9925 41.3519 80.9925 41.5303ZM86.6247 41.0563C86.6247 41.0563 86.5839 41.0665 86.5635 41.0665C86.5431 41.0665 86.5228 41.0715 86.5024 41.0766C86.5228 41.0766 86.5431 41.0716 86.5635 41.0665C86.5839 41.0614 86.6043 41.0614 86.6247 41.0563ZM86.1354 41.1021C86.1762 41.1021 86.2118 41.1123 86.2526 41.1123H86.2628C86.2628 41.1123 86.2577 41.1123 86.2526 41.1123C86.2118 41.1123 86.1711 41.1072 86.1303 41.1021C86.1303 41.1021 86.1303 41.1021 86.1252 41.1021C86.1252 41.1021 86.1252 41.1021 86.1303 41.1021M106.493 41.4589C106.493 41.4589 106.503 41.4691 106.508 41.4691C106.503 41.4691 106.498 41.4589 106.493 41.4589ZM106.732 41.6883C106.732 41.6883 106.737 41.6985 106.743 41.6985C106.743 41.6985 106.737 41.6883 106.732 41.6883C106.732 41.6883 106.727 41.6832 106.722 41.6781C106.722 41.6781 106.727 41.6832 106.732 41.6883ZM107.059 42.6006C107.033 42.3355 106.967 42.1113 106.875 41.9177C106.982 42.1521 107.038 42.4069 107.059 42.6006ZM107.079 42.8505C107.079 42.8861 107.079 42.9116 107.079 42.9116C107.079 44.089 106.396 45.4193 105.473 46.1176C106.391 45.4244 107.079 44.089 107.079 42.9116V42.886C107.079 42.886 107.079 42.8656 107.079 42.8554M90.5188 44.8433C90.4678 44.7975 90.4118 44.7567 90.3557 44.721C90.4169 44.7567 90.4678 44.7975 90.5188 44.8433ZM90.7125 45.0676C90.7278 45.0931 90.7431 45.1135 90.7533 45.139C90.738 45.1135 90.7227 45.0931 90.7125 45.0676C90.687 45.0268 90.6564 44.986 90.6259 44.9504C90.6564 44.986 90.6819 45.0268 90.7125 45.0676ZM90.9266 45.5467C90.9011 45.4549 90.8756 45.3581 90.8348 45.2765C90.8705 45.3581 90.9011 45.4498 90.9266 45.5467ZM91.0183 46.1838C91.0183 46.0054 90.9979 45.8423 90.9725 45.6894C91.003 45.8423 91.0183 46.0054 91.0183 46.1838ZM76.5989 46.1685C76.5989 46.1685 76.5581 46.1787 76.5377 46.1787C76.5173 46.1787 76.497 46.1838 76.4766 46.1889C76.497 46.1889 76.5173 46.1838 76.5377 46.1787C76.5581 46.1787 76.5785 46.1736 76.5989 46.1685ZM76.1708 46.2144C76.1708 46.2144 76.2115 46.2144 76.2268 46.2144C76.2268 46.2144 76.2319 46.2144 76.237 46.2144C76.237 46.2144 76.2319 46.2144 76.2268 46.2144C76.2064 46.2144 76.1861 46.2144 76.1708 46.2144C76.1504 46.2144 76.1249 46.2144 76.1045 46.2093C76.1249 46.2093 76.1504 46.2093 76.1708 46.2144ZM103.924 46.5203C103.924 46.5203 103.975 46.5356 104 46.5407C103.975 46.5356 103.949 46.5254 103.924 46.5203C103.898 46.5101 103.868 46.4999 103.842 46.4897C103.868 46.4999 103.893 46.5101 103.924 46.5203ZM104.571 46.5458C104.571 46.5458 104.541 46.5457 104.525 46.5508C104.541 46.5508 104.556 46.5509 104.571 46.5458C104.607 46.5458 104.638 46.5356 104.673 46.5254C104.638 46.5356 104.602 46.5407 104.571 46.5458ZM104.235 46.5763C104.235 46.5763 104.281 46.5763 104.306 46.5763C104.311 46.5763 104.322 46.5763 104.327 46.5763C104.322 46.5763 104.316 46.5763 104.306 46.5763C104.281 46.5763 104.26 46.5763 104.235 46.5763C104.204 46.5763 104.179 46.5712 104.148 46.5661C104.179 46.5661 104.204 46.5712 104.235 46.5763ZM80.493 49.9557C80.442 49.9098 80.386 49.8639 80.3248 49.8282C80.386 49.8639 80.4369 49.9047 80.493 49.9557ZM80.6612 50.1391C80.6867 50.1748 80.7071 50.2155 80.7326 50.2512C80.7071 50.2104 80.6867 50.1748 80.6612 50.1391ZM80.8753 50.5622C80.8855 50.5927 80.8957 50.6233 80.9008 50.659C80.8906 50.6284 80.8855 50.5978 80.8753 50.5622ZM85.8652 50.8068C85.8652 50.8068 85.9162 50.8221 85.9417 50.8323C85.9162 50.8272 85.8907 50.817 85.8652 50.8068ZM80.9925 51.2961C80.9925 51.1177 80.9721 50.9546 80.9467 50.8017C80.9772 50.9546 80.9925 51.1177 80.9925 51.2961ZM86.4973 50.8374C86.538 50.8272 86.5788 50.8272 86.6247 50.817C86.5788 50.8272 86.538 50.8323 86.4973 50.8374ZM86.1864 50.8629C86.1864 50.8629 86.2322 50.8629 86.2577 50.8629C86.2577 50.8629 86.2628 50.8629 86.2679 50.8629C86.2679 50.8629 86.2628 50.8629 86.2577 50.8629C86.2322 50.8629 86.2118 50.8629 86.1864 50.8629C86.166 50.8629 86.1507 50.8629 86.1303 50.8578C86.1507 50.8578 86.166 50.8578 86.1864 50.8629ZM106.539 51.2655C106.539 51.2655 106.574 51.2961 106.59 51.3114C106.574 51.2961 106.554 51.2808 106.539 51.2655C106.498 51.2349 106.457 51.2044 106.416 51.1789C106.462 51.2044 106.503 51.2349 106.539 51.2655ZM106.783 51.5305C106.783 51.5305 106.814 51.5816 106.829 51.6071C106.814 51.5816 106.799 51.556 106.783 51.5305C106.758 51.4847 106.727 51.4439 106.692 51.4082C106.722 51.4439 106.753 51.4898 106.783 51.5305ZM106.977 51.9536C106.987 51.9842 106.992 52.0148 107.003 52.0402C106.997 52.0097 106.987 51.9791 106.977 51.9536ZM107.079 52.652C107.079 53.9976 106.197 55.5317 105.091 56.1127C105.086 56.1127 105.076 56.1179 105.071 56.123H105.061C105.061 56.123 105.081 56.1178 105.091 56.1127C106.192 55.5368 107.079 54.0027 107.079 52.6622V52.6367C107.079 52.4583 107.059 52.2952 107.033 52.1423C107.064 52.3003 107.079 52.4685 107.079 52.652ZM90.5188 54.6092C90.4678 54.5633 90.4118 54.5174 90.3557 54.4868C90.4169 54.5225 90.4678 54.5633 90.5188 54.6092ZM90.7584 54.8997C90.7176 54.8335 90.6768 54.7671 90.631 54.7111C90.6768 54.7671 90.7227 54.8335 90.7584 54.8997ZM90.9266 55.3075C90.9011 55.2107 90.8756 55.1189 90.8348 55.0373C90.8705 55.1189 90.9011 55.2158 90.9266 55.3075ZM91.0183 55.9446C91.0183 55.7662 90.9979 55.6031 90.9725 55.4502C91.003 55.6031 91.0183 55.7662 91.0183 55.9446ZM75.8496 55.9191C75.8496 55.9191 75.8904 55.9344 75.9108 55.9395C75.8904 55.9344 75.87 55.9293 75.8496 55.9191C75.8293 55.914 75.8089 55.9038 75.7885 55.8936C75.8089 55.9038 75.8293 55.9089 75.8496 55.9191ZM76.5989 55.9242C76.5989 55.9242 76.5581 55.9344 76.5428 55.9344C76.5173 55.9344 76.497 55.9395 76.4715 55.9446C76.497 55.9446 76.5173 55.9395 76.5428 55.9344C76.5632 55.9344 76.5785 55.9293 76.5989 55.9242ZM76.1555 55.9752C76.1555 55.9752 76.2013 55.9752 76.2268 55.9752C76.2013 55.9752 76.1809 55.9752 76.1555 55.9752C76.1351 55.9752 76.1198 55.9752 76.0994 55.9701C76.1198 55.9701 76.1351 55.9701 76.1555 55.9752ZM105.066 56.1332C105.066 56.1332 105.02 56.1485 104.999 56.1587C105.02 56.1485 105.04 56.1433 105.061 56.1332H105.066ZM104 56.3014C103.944 56.2861 103.893 56.2708 103.847 56.2504C103.898 56.2708 103.949 56.2912 104 56.3014ZM104.24 56.3371C104.24 56.3371 104.281 56.3371 104.306 56.3371C104.306 56.3371 104.322 56.3371 104.327 56.3371C104.322 56.3371 104.311 56.3371 104.306 56.3371C104.286 56.3371 104.26 56.3371 104.24 56.3371C104.209 56.3371 104.184 56.332 104.153 56.3269C104.184 56.3269 104.209 56.332 104.24 56.3371ZM80.4114 59.6451C80.442 59.6654 80.4675 59.6909 80.493 59.7113C80.4675 59.6858 80.4369 59.6654 80.4114 59.6451C80.386 59.6247 80.3605 59.6093 80.3299 59.5889C80.3554 59.6042 80.386 59.6247 80.4114 59.6451ZM80.7326 60.0069C80.6918 59.9407 80.6561 59.8794 80.6051 59.8234C80.651 59.8794 80.6918 59.9407 80.7326 60.0069ZM85.8652 60.5675C85.8652 60.5675 85.9162 60.5828 85.9417 60.593C85.9162 60.5879 85.8907 60.5777 85.8652 60.5675C85.85 60.5624 85.8347 60.5574 85.8194 60.5472C85.8347 60.5523 85.85 60.5573 85.8652 60.5675ZM80.9925 61.0467C80.9925 60.8683 80.9721 60.7053 80.9467 60.5574C80.9772 60.7104 80.9925 60.8734 80.9925 61.0467ZM86.6247 60.5777C86.5839 60.5879 86.5431 60.593 86.5024 60.5981C86.5431 60.5879 86.5839 60.5879 86.6247 60.5777ZM86.1966 60.6287C86.1966 60.6287 86.2373 60.6287 86.2577 60.6287C86.2577 60.6287 86.2628 60.6287 86.2679 60.6287C86.2679 60.6287 86.2628 60.6287 86.2577 60.6287C86.2373 60.6287 86.2169 60.6287 86.1966 60.6287C86.1762 60.6287 86.1507 60.6287 86.1303 60.6236C86.1507 60.6236 86.1762 60.6236 86.1966 60.6287ZM106.549 61.0314C106.549 61.0314 106.579 61.0569 106.59 61.0671C106.574 61.0519 106.559 61.0416 106.549 61.0314C106.508 60.9958 106.462 60.9652 106.416 60.9346C106.462 60.9601 106.508 60.9958 106.549 61.0314ZM106.829 61.3678C106.788 61.2964 106.743 61.2251 106.692 61.1691C106.743 61.2302 106.783 61.2964 106.829 61.3678ZM107.003 61.8062C106.977 61.694 106.941 61.587 106.901 61.4952C106.941 61.5921 106.977 61.6991 107.003 61.8062ZM107.079 62.4178C107.079 63.7787 106.182 65.3282 105.061 65.8991C105.03 65.9144 105.004 65.9194 104.979 65.9347C105.004 65.9245 105.03 65.9195 105.055 65.9042L105.076 65.894C106.187 65.3282 107.084 63.7787 107.084 62.4331V62.4076C107.084 62.2292 107.064 62.061 107.033 61.9081C107.064 62.0661 107.084 62.2343 107.084 62.4178M76.5989 65.6849C76.5989 65.6849 76.5632 65.6951 76.5428 65.6951C76.5173 65.6951 76.497 65.7002 76.4715 65.7053C76.497 65.7053 76.5173 65.7002 76.5428 65.6951C76.5632 65.6951 76.5785 65.69 76.5989 65.6849ZM76.1555 65.736C76.1555 65.736 76.2013 65.736 76.2268 65.736C76.2268 65.736 76.2319 65.736 76.237 65.736C76.237 65.736 76.2319 65.736 76.2268 65.736C76.2013 65.736 76.1809 65.736 76.1555 65.736C76.1351 65.736 76.1198 65.736 76.0994 65.7309C76.1198 65.7309 76.1351 65.7309 76.1555 65.736ZM103.919 66.0418C103.919 66.0418 103.97 66.057 103.995 66.0672C103.97 66.0621 103.944 66.052 103.919 66.0418C103.893 66.0316 103.873 66.0214 103.847 66.0163C103.873 66.0265 103.893 66.0367 103.919 66.0418ZM104.597 66.0621C104.566 66.0621 104.536 66.0723 104.505 66.0774C104.536 66.0774 104.566 66.0672 104.597 66.0621C104.622 66.0621 104.653 66.0519 104.683 66.0468C104.653 66.057 104.627 66.0621 104.597 66.0621ZM104.25 66.0978C104.25 66.0978 104.286 66.0978 104.306 66.0978C104.306 66.0978 104.322 66.0978 104.327 66.0978C104.322 66.0978 104.311 66.0978 104.306 66.0978C104.286 66.0978 104.271 66.0978 104.25 66.0978C104.22 66.0978 104.184 66.0927 104.153 66.0876C104.184 66.0876 104.22 66.0927 104.25 66.0978ZM117.609 66.893C117.609 66.893 117.599 66.893 117.594 66.893C117.599 66.893 117.604 66.893 117.609 66.893C117.681 66.8777 117.757 66.8675 117.823 66.8675C117.752 66.8675 117.681 66.8828 117.609 66.893ZM118.058 66.8828C118.089 66.8828 118.124 66.893 118.155 66.9032C118.124 66.893 118.094 66.8879 118.058 66.8828C118.022 66.8777 117.992 66.8726 117.961 66.8726C117.992 66.8726 118.027 66.8777 118.058 66.8828ZM117.278 66.9796C117.339 66.9541 117.405 66.9338 117.467 66.9185C117.405 66.9338 117.344 66.9541 117.278 66.9796ZM86.7572 73.1826C86.7572 73.1826 86.7063 73.1419 86.6757 73.1215C86.7063 73.1368 86.7317 73.1571 86.7572 73.1826ZM86.8439 73.2795C86.8439 73.2795 86.8643 73.31 86.8745 73.3253C86.8643 73.31 86.8541 73.2948 86.8439 73.2795C86.8337 73.2643 86.8235 73.2489 86.8133 73.2387C86.8235 73.254 86.8337 73.2643 86.8439 73.2795ZM86.9611 73.5293C86.9509 73.4834 86.9356 73.4375 86.9152 73.3968C86.9356 73.4375 86.9458 73.4834 86.9611 73.5293ZM78.9843 81.8475L82.4604 80.0738V74.9412L79.9833 76.2052C79.4277 76.4856 78.9792 77.2602 78.9792 77.9331V81.8425M63.0256 97.7146C63.0154 97.6738 62.995 97.633 62.9899 97.5871C63.0001 97.633 63.0154 97.6738 63.0256 97.7146ZM63.1836 98.1121C63.1836 98.1121 63.1938 98.1274 63.1989 98.1376C63.1938 98.1274 63.1887 98.1223 63.1836 98.1121C63.1632 98.0765 63.1377 98.0459 63.1224 98.0051C63.1428 98.0459 63.1632 98.0765 63.1836 98.1121ZM63.4384 98.4281C63.4027 98.3975 63.362 98.3618 63.3314 98.3262C63.3671 98.3669 63.4027 98.3975 63.4384 98.4281ZM95.2692 14.1594C94.8615 14.1594 94.4435 14.2664 94.0307 14.4753L61.945 30.8215C60.5077 31.5554 59.3863 33.472 59.3863 35.1896C59.3863 36.311 59.8501 37.1928 60.6606 37.6056L61.3895 37.9777V89.6664L59.9419 90.4054C58.5045 91.1394 57.3781 93.061 57.3781 94.7787C57.3781 95.9 57.8419 96.7767 58.6524 97.1895L63.1938 99.5036C63.2549 99.5342 63.3161 99.5596 63.3773 99.5749C63.6321 99.6768 63.9074 99.7278 64.1877 99.7278C64.5904 99.7278 65.0032 99.6209 65.411 99.417L117.548 72.8514C118.986 72.1174 120.107 70.2009 120.107 68.4832C120.107 67.3669 119.633 66.4852 118.828 66.0774V66.0672L116.096 64.6757V29.5982C117.253 28.7114 118.099 27.0701 118.099 25.5817C118.099 24.4655 117.625 23.5837 116.819 23.176V23.1658L112.283 20.8517C111.982 20.6988 111.651 20.6224 111.304 20.6224C110.897 20.6224 110.484 20.7293 110.071 20.9383L100.05 26.0455V23.1352C101.228 22.2483 102.058 20.6275 102.058 19.1086C102.058 18.0688 101.646 17.2329 100.942 16.7945C100.896 16.7588 100.84 16.7232 100.789 16.6977L96.2478 14.3836C95.9471 14.2307 95.6209 14.1543 95.2692 14.1543V14.1594ZM80.0037 80.186V77.9382C80.0037 77.6221 80.2534 77.2144 80.4471 77.1176L81.441 76.613V79.457L80.0037 80.191V80.186Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M118.374 66.9785C118.027 66.8001 117.579 66.8153 117.084 67.0651L115.081 68.0845L110.54 65.7705L112.543 64.7511C113.032 64.5014 113.481 64.486 113.833 64.6644L118.374 66.9785Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M103.761 65.9848C104.113 66.1632 104.566 66.148 105.066 65.8982C106.187 65.3274 107.084 63.7778 107.084 62.4169C107.084 61.6524 106.809 61.1223 106.371 60.898L101.829 58.584C102.267 58.8083 102.543 59.3383 102.543 60.1029C102.543 61.4638 101.646 63.0133 100.524 63.5842C100.025 63.839 99.5711 63.8543 99.2194 63.6708L103.761 65.9848Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M103.766 56.2192C104.118 56.3976 104.566 56.3822 105.066 56.1274C106.187 55.5565 107.084 54.0071 107.084 52.6462C107.084 51.8868 106.809 51.3567 106.371 51.1324L101.829 48.8184C102.267 49.0426 102.543 49.5727 102.543 50.3322C102.543 51.0916 101.646 53.2425 100.524 53.8133C100.03 54.0682 99.5762 54.0836 99.2245 53.9052L103.766 56.2192Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M107.079 42.9127C107.079 44.2583 106.182 45.8078 105.066 46.3787C104.566 46.6336 104.113 46.6437 103.761 46.4653L99.2194 44.1513C99.5711 44.3296 100.025 44.3195 100.524 44.0646C101.64 43.4938 102.538 41.9443 102.538 40.5987C102.538 40.5987 102.262 39.2887 101.824 39.0645L106.365 41.3785C107.094 41.6945 107.079 42.9127 107.079 42.9127Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M78.9843 86.4761L87.007 82.3883L82.4655 80.0742L74.4429 84.162L78.9843 86.4761Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M87.007 82.3879V73.8504C87.007 73.4732 86.8694 73.2133 86.6502 73.1012L82.1088 70.7871C82.3279 70.8992 82.4656 71.1643 82.4656 71.5364V80.0738L87.007 82.3879Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M116.371 24.0723C116.024 23.8939 115.576 23.9091 115.081 24.1589L99.036 32.3345L94.4945 30.0204L110.54 21.8448C111.029 21.5951 111.478 21.5798 111.829 21.7582L116.371 24.0723Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M85.7175 60.5166C86.0641 60.695 86.5126 60.6797 87.007 60.43L89.0101 59.4106C90.1213 58.8448 91.0184 57.2953 91.0184 55.9446C91.0184 55.1953 90.738 54.6653 90.2997 54.441L85.7583 52.127C86.1966 52.3512 86.4769 52.8813 86.4769 53.6305C86.4769 54.9813 85.5798 56.5308 84.4687 57.0965L82.4656 58.1159C81.9763 58.3657 81.5277 58.3809 81.176 58.2025L85.7175 60.5166Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M85.7175 50.7549C86.0641 50.9333 86.5177 50.918 87.007 50.6683L89.0101 49.6489C90.1213 49.0831 91.0184 47.5336 91.0184 46.188C91.0184 45.4387 90.738 44.9036 90.2997 44.6793L85.7583 42.3652C86.1966 42.5895 86.4769 43.1196 86.4769 43.8739C86.4769 45.2195 85.5798 46.769 84.4687 47.3348L82.4656 48.3542C81.9763 48.604 81.5277 48.6193 81.176 48.4409L85.7175 50.7549Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M66.9503 38.9254V92.6071L62.4089 90.293V36.6113L66.9503 38.9254Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M66.9503 92.607L64.9472 93.6264C63.8411 94.1922 62.9389 95.7417 62.9389 97.0924C62.9389 97.8417 63.2193 98.3717 63.6576 98.596L59.1162 96.2819C58.6778 96.0577 58.3975 95.5276 58.3975 94.7784C58.3975 93.4277 59.2997 91.8781 60.4057 91.3124L62.4089 90.293L66.9503 92.607Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M75.6917 65.6233C76.0383 65.8017 76.4868 65.7863 76.9812 65.5365L78.9894 64.5122C80.0955 63.9464 80.9925 62.3969 80.9925 61.0462C80.9925 60.2969 80.7173 59.7668 80.279 59.5426L75.7375 57.2285C76.1759 57.4528 76.4511 57.9828 76.4511 58.7321C76.4511 59.4814 75.554 61.6323 74.448 62.1981L72.4398 63.2226C71.9505 63.4724 71.5019 63.4876 71.1502 63.3092L75.6917 65.6233Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M85.7175 40.9951C86.0641 41.1735 86.5126 41.1583 87.007 40.9085L89.0101 39.8891C90.1213 39.3233 91.0184 37.7738 91.0184 36.4231C91.0184 35.6739 90.738 35.1438 90.2997 34.9195L85.7583 32.6055C86.1966 32.8297 86.4769 33.3598 86.4769 34.1091C86.4769 35.4598 85.5798 37.0093 84.4687 37.575L82.4656 38.5944C81.9763 38.8442 81.5277 38.8595 81.176 38.6811L85.7175 40.9951Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M75.6917 55.8635C76.0383 56.0419 76.4919 56.0266 76.9812 55.7769L78.9894 54.7524C80.0955 54.1866 80.9925 52.6371 80.9925 51.2915C80.9925 49.9459 80.7122 50.0071 80.2739 49.7828L75.7324 47.4688C76.1708 47.693 76.4511 48.2231 76.4511 48.9774C76.4511 50.3231 75.554 51.8726 74.448 52.4383L72.4398 53.4628C71.9505 53.7126 71.5019 53.728 71.1502 53.5496L75.6917 55.8635Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M75.6917 46.1018C76.0383 46.2802 76.4868 46.2649 76.9812 46.0152L78.9894 44.9907C80.0955 44.4249 80.9925 42.8754 80.9925 41.5247C80.9925 40.7754 80.7173 40.2454 80.279 40.0211L75.7375 37.707C76.1759 37.9313 76.4511 38.4614 76.4511 39.2106C76.4511 40.5613 75.554 42.1108 74.448 42.6766L72.4398 43.7011C71.9505 43.9509 71.5019 43.9661 71.1502 43.7877L75.6917 46.1018Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M100.325 17.6094C99.9788 17.431 99.5252 17.4462 99.0359 17.696L66.9503 34.0421C65.8442 34.6079 64.9471 36.1573 64.9471 37.5029C64.9471 38.8485 65.2275 38.7874 65.6658 39.0117L61.1244 36.6976C60.6861 36.4734 60.4057 35.9433 60.4057 35.1889C60.4057 33.8433 61.3028 32.2938 62.4089 31.728L94.4945 15.3819C94.9838 15.1322 95.4374 15.1169 95.784 15.2953L100.325 17.6094Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M105.056 60.9911L105.076 60.9809C106.187 60.4151 107.084 61.0523 107.084 62.403V62.4285C107.084 63.7741 106.187 65.3236 105.076 65.8894L105.056 65.8996C103.944 66.4654 103.047 65.8282 103.047 64.4826V64.4571C103.047 63.1064 103.944 61.5569 105.056 60.9911ZM103.047 54.7218V54.6964C103.047 53.3508 103.944 51.8013 105.056 51.2355L105.076 51.2253C106.187 50.6595 107.084 51.2967 107.084 52.6423V52.6677C107.084 54.0133 106.187 55.5628 105.076 56.1286L105.056 56.1388C103.944 56.7045 103.047 56.0674 103.047 54.7218ZM107.079 42.907C107.079 44.2526 106.182 45.8021 105.071 46.3678L105.05 46.378C103.939 46.9438 103.042 46.3067 103.042 44.9611V44.9356C103.042 43.5848 103.939 42.0353 105.05 41.4696L105.071 41.4594C106.182 40.8936 107.079 41.5307 107.079 42.8814V42.907ZM76.9812 41.1383L78.9894 40.1138C80.0955 39.548 80.9925 40.1852 80.9925 41.5308C80.9925 42.8764 80.0955 44.431 78.9894 44.9968L76.9812 46.0213C75.8752 46.587 74.9781 45.9499 74.9781 44.5992C74.9781 43.2485 75.8752 41.7041 76.9812 41.1383ZM76.9812 50.8939L78.9894 49.8694C80.0955 49.3036 80.9925 49.9459 80.9925 51.2915C80.9925 52.6371 80.0955 54.1866 78.9894 54.7524L76.9812 55.7769C75.8752 56.3427 74.9781 55.7055 74.9781 54.3599C74.9781 53.0143 75.8752 51.4597 76.9812 50.8939ZM74.973 64.1156C74.973 62.77 75.8701 61.2205 76.9761 60.6548L78.9843 59.6303C80.0904 59.0645 80.9874 59.7016 80.9874 61.0472C80.9874 62.3928 80.0904 63.9475 78.9843 64.5132L76.9761 65.5376C75.8701 66.1034 74.973 65.4663 74.973 64.1156ZM87.007 82.3883L78.9894 86.4761V77.9386C78.9894 77.2607 79.438 76.4912 79.9935 76.2108L86.008 73.1475C86.5585 72.8672 87.0121 73.1831 87.0121 73.8559V82.3934L87.007 82.3883ZM89.0102 59.4111L87.007 60.4305C85.901 60.9963 85.0039 60.3591 85.0039 59.0084C85.0039 57.6577 85.901 56.1133 87.007 55.5475L89.0102 54.5281C90.1213 53.9624 91.0184 54.5995 91.0184 55.9451C91.0184 57.2907 90.1213 58.8453 89.0102 59.4111ZM89.0102 49.6452L87.007 50.6646C85.901 51.2303 85.0039 50.5932 85.0039 49.2476C85.0039 47.902 85.901 46.3475 87.007 45.7817L89.0102 44.7623C90.1213 44.1966 91.0184 44.8336 91.0184 46.1843C91.0184 47.535 90.1213 49.0794 89.0102 49.6452ZM89.0102 39.8896L87.007 40.909C85.901 41.4747 85.0039 40.8376 85.0039 39.4869C85.0039 38.1362 85.901 36.5918 87.007 36.026L89.0102 35.0066C90.1213 34.4408 91.0184 35.078 91.0184 36.4236C91.0184 37.7692 90.1213 39.3238 89.0102 39.8896ZM117.084 67.0617L115.081 68.0811V29.038C116.187 28.4723 117.084 26.9228 117.084 25.5771C117.084 24.2264 116.187 23.5893 115.081 24.1551L99.0359 32.3307V22.57C100.147 22.0042 101.044 20.4547 101.044 19.104C101.044 17.7584 100.147 17.1212 99.0359 17.687L66.9503 34.0331C65.8443 34.5989 64.9472 36.1484 64.9472 37.494C64.9472 38.8396 65.8443 39.4817 66.9503 38.916V92.5976L64.9472 93.617C63.8411 94.1828 62.939 95.7323 62.939 97.083C62.939 98.4337 63.8411 99.0607 64.9472 98.5L117.084 71.9344C118.19 71.3686 119.088 69.8191 119.088 68.4735C119.088 67.1279 118.19 66.4858 117.084 67.0515V67.0617Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M150.704 52.0596C152.106 51.3461 152.998 49.659 152.998 47.2583C152.998 42.9615 150.133 38.0175 146.606 36.2233C145.046 35.4282 143.619 35.3772 142.508 35.943L144.781 34.786C145.892 34.2202 147.32 34.2712 148.879 35.0663C152.412 36.8656 155.271 41.8096 155.271 46.1013C155.271 48.502 154.379 50.189 152.977 50.9026L150.704 52.0596Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -38,337 +254,123 @@ export const CustomerVerticalStackIllustration = ({ className }: TIllustrationAs
         strokeLinejoin="round"
       />
       <path
-        d="M16.4846 118.306C16.4846 116.38 17.9271 114.458 20.8069 112.99L98.7248 73.2898C104.49 70.3539 113.832 70.3539 119.597 73.2898L156.678 92.1843C159.563 93.6522 161 95.579 161 97.5057C161 99.4323 159.558 101.354 156.678 102.822L78.7598 142.522C72.9951 145.458 63.6523 145.458 57.8876 142.522L20.8069 123.628C17.922 122.16 16.4846 120.233 16.4846 118.306Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M150.704 52.0589C149.593 52.6246 148.166 52.5736 146.606 51.7785C143.074 49.9793 140.214 45.0352 140.214 40.7435C140.214 38.3429 141.106 36.6558 142.508 35.9422C143.619 35.3764 145.046 35.4274 146.606 36.2226C150.138 38.0218 152.998 42.9658 152.998 47.2575C152.998 49.6582 152.106 51.3453 150.704 52.0589Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M16.4846 98.8712C16.4846 100.798 17.9271 102.719 20.8069 104.192L57.8876 123.087C63.6523 126.023 72.9951 126.023 78.7598 123.087L156.678 83.3865C159.558 81.9185 161 79.997 161 78.0703V84.2224C161 86.1491 159.558 88.0706 156.678 89.5386L78.7598 129.239C72.9951 132.175 63.6523 132.175 57.8876 129.239L20.8069 110.345C17.922 108.877 16.4846 106.95 16.4846 105.023V98.8712Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M16.4846 98.871C16.4846 96.9444 17.9271 95.0228 20.8069 93.5549L98.7248 53.8542C104.49 50.9184 113.832 50.9184 119.597 53.8542L156.678 72.7489C159.563 74.2168 161 76.1435 161 78.0701C161 79.9968 159.558 81.9183 156.678 83.3863L78.7598 123.087C72.9951 126.023 63.6523 126.023 57.8876 123.087L20.8069 104.192C17.922 102.724 16.4846 100.798 16.4846 98.871Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M64.1877 99.2221C63.9583 99.2221 63.7391 99.1762 63.5353 99.0947C63.4996 99.0845 63.4588 99.0743 63.4231 99.0539L58.8817 96.7399C58.2497 96.4188 57.8827 95.7052 57.8827 94.7826C57.8827 93.2382 58.8868 91.5155 60.1661 90.8631L61.894 89.9813V37.6656L60.8848 37.1508C60.2528 36.8297 59.8909 36.1162 59.8909 35.1885C59.8909 33.6441 60.895 31.9263 62.1744 31.2739L94.26 14.9279C94.6015 14.7546 94.9379 14.668 95.2692 14.668C95.5342 14.668 95.7891 14.7291 96.0134 14.8412L100.555 17.1552V17.1655C101.182 17.4866 101.549 18.2002 101.549 19.1125C101.549 20.5448 100.687 22.1248 99.5405 22.869V26.8753L110.305 21.3909C110.647 21.2176 110.983 21.1309 111.309 21.1309C111.575 21.1309 111.829 21.1921 112.054 21.3043L116.595 23.6182V23.6284C117.222 23.9495 117.589 24.6682 117.589 25.5806C117.589 27.0078 116.728 28.5879 115.586 29.3321V64.9856L118.598 66.5198V66.53C119.22 66.8511 119.592 67.5697 119.592 68.482C119.592 70.0264 118.588 71.7442 117.309 72.3966L65.1714 98.9622C64.835 99.1304 64.5037 99.217 64.1826 99.217L64.1877 99.2221ZM80.2178 76.6628C79.8304 76.8615 79.494 77.4528 79.494 77.937V81.0156L81.9507 79.7618V75.7759L80.2178 76.6577V76.6628Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M95.2692 15.1788C95.4578 15.1788 95.6311 15.2196 95.784 15.296L100.325 17.6101C100.295 17.5948 100.259 17.5897 100.229 17.5744C100.723 17.7681 101.044 18.3083 101.044 19.1137C101.044 20.4644 100.147 22.0139 99.0359 22.5797V27.7072L110.54 21.8456C110.815 21.708 111.075 21.6418 111.31 21.6418C111.498 21.6418 111.671 21.6825 111.824 21.759L116.366 24.073C116.335 24.0578 116.299 24.0526 116.269 24.0373C116.758 24.231 117.084 24.7764 117.084 25.5766C117.084 26.9222 116.187 28.4718 115.081 29.0375V65.2976L118.374 66.9745C118.343 66.9592 118.308 66.9541 118.277 66.9388C118.766 67.1325 119.088 67.6779 119.088 68.4781C119.088 69.8237 118.19 71.3732 117.084 71.939L64.9472 98.5046C64.677 98.6422 64.4222 98.7084 64.1877 98.7084C63.9736 98.7084 63.7748 98.6523 63.6015 98.5504C63.6219 98.5606 63.6372 98.581 63.6576 98.5912L59.1162 96.2772C58.6778 96.0529 58.3975 95.5228 58.3975 94.7736C58.3975 93.4229 59.2997 91.8734 60.4057 91.3076L62.4089 90.2882V37.3508L61.1193 36.6932C60.681 36.469 60.4006 35.9389 60.4006 35.1845C60.4006 33.8389 61.2977 32.2894 62.4038 31.7237L94.4894 15.3775C94.7646 15.2348 95.0246 15.1686 95.2641 15.1686M99.6934 17.5029C99.724 17.5029 99.7495 17.4978 99.775 17.4978C99.7495 17.4978 99.7189 17.4978 99.6934 17.5029ZM100.009 17.5131C100.04 17.5131 100.076 17.5234 100.106 17.5336C100.076 17.5234 100.045 17.5182 100.009 17.5131C99.9788 17.5131 99.9432 17.5029 99.9075 17.5029C99.9432 17.5029 99.9737 17.508 100.009 17.5131ZM99.2296 17.6101C99.1633 17.6356 99.1022 17.661 99.0359 17.6967C99.1022 17.661 99.1684 17.6356 99.2296 17.6101ZM115.744 23.966C115.693 23.9711 115.642 23.9813 115.586 23.9915C115.637 23.9813 115.693 23.9711 115.744 23.966C115.769 23.966 115.795 23.966 115.82 23.9609C115.795 23.9609 115.769 23.9609 115.744 23.966ZM116.06 23.9813C116.024 23.9813 115.994 23.9711 115.958 23.9711C115.994 23.9711 116.029 23.9762 116.06 23.9813ZM115.275 24.073C115.336 24.0476 115.402 24.0271 115.464 24.0118C115.402 24.0271 115.341 24.0476 115.275 24.073ZM90.4424 35.0214C90.4679 35.0418 90.4984 35.0621 90.5239 35.0876C90.4984 35.0621 90.473 35.0418 90.4424 35.0214C90.4169 35.001 90.3863 34.9806 90.3557 34.9653C90.3863 34.9806 90.4118 35.001 90.4424 35.0214ZM90.7584 35.3782C90.7176 35.3119 90.6768 35.2457 90.631 35.1896C90.6768 35.2457 90.7227 35.3119 90.7584 35.3782ZM90.8807 35.633C90.896 35.684 90.9113 35.735 90.9266 35.786C90.9113 35.735 90.896 35.6789 90.8807 35.633C90.8654 35.5922 90.8552 35.5515 90.8348 35.5158C90.8501 35.5515 90.8654 35.5922 90.8807 35.633ZM91.0183 36.4231C91.0183 36.2447 90.9979 36.0816 90.9725 35.9287C91.003 36.0816 91.0183 36.2447 91.0183 36.4231ZM80.4114 40.1286C80.4369 40.149 80.4624 40.1693 80.493 40.1948C80.4675 40.1693 80.442 40.149 80.4114 40.1286C80.386 40.1082 80.3554 40.0878 80.3299 40.0725C80.3605 40.0878 80.386 40.1082 80.4114 40.1286ZM80.6714 40.3886C80.6918 40.4191 80.7122 40.4497 80.7326 40.4854C80.7122 40.4548 80.6918 40.4191 80.6714 40.3886ZM85.8652 41.0461C85.8652 41.0461 85.9111 41.0613 85.9366 41.0715C85.9111 41.0664 85.8856 41.0563 85.8652 41.0461ZM80.9925 41.5303C80.9925 41.3519 80.9721 41.1888 80.9467 41.0359C80.9772 41.1888 80.9925 41.3519 80.9925 41.5303ZM86.6247 41.0563C86.6247 41.0563 86.5839 41.0665 86.5635 41.0665C86.5431 41.0665 86.5228 41.0715 86.5024 41.0766C86.5228 41.0766 86.5431 41.0716 86.5635 41.0665C86.5839 41.0614 86.6043 41.0614 86.6247 41.0563ZM86.1354 41.1021C86.1762 41.1021 86.2118 41.1123 86.2526 41.1123H86.2628C86.2628 41.1123 86.2577 41.1123 86.2526 41.1123C86.2118 41.1123 86.1711 41.1072 86.1303 41.1021C86.1303 41.1021 86.1303 41.1021 86.1252 41.1021C86.1252 41.1021 86.1252 41.1021 86.1303 41.1021M106.493 41.4589C106.493 41.4589 106.503 41.4691 106.508 41.4691C106.503 41.4691 106.498 41.4589 106.493 41.4589ZM106.732 41.6883C106.732 41.6883 106.737 41.6985 106.743 41.6985C106.743 41.6985 106.737 41.6883 106.732 41.6883C106.732 41.6883 106.727 41.6832 106.722 41.6781C106.722 41.6781 106.727 41.6832 106.732 41.6883ZM107.059 42.6006C107.033 42.3355 106.967 42.1113 106.875 41.9177C106.982 42.1521 107.038 42.4069 107.059 42.6006ZM107.079 42.8505C107.079 42.8861 107.079 42.9116 107.079 42.9116C107.079 44.089 106.396 45.4193 105.473 46.1176C106.391 45.4244 107.079 44.089 107.079 42.9116V42.886C107.079 42.886 107.079 42.8656 107.079 42.8554M90.5188 44.8433C90.4678 44.7975 90.4118 44.7567 90.3557 44.721C90.4169 44.7567 90.4678 44.7975 90.5188 44.8433ZM90.7125 45.0676C90.7278 45.0931 90.7431 45.1135 90.7533 45.139C90.738 45.1135 90.7227 45.0931 90.7125 45.0676C90.687 45.0268 90.6564 44.986 90.6259 44.9504C90.6564 44.986 90.6819 45.0268 90.7125 45.0676ZM90.9266 45.5467C90.9011 45.4549 90.8756 45.3581 90.8348 45.2765C90.8705 45.3581 90.9011 45.4498 90.9266 45.5467ZM91.0183 46.1838C91.0183 46.0054 90.9979 45.8423 90.9725 45.6894C91.003 45.8423 91.0183 46.0054 91.0183 46.1838ZM76.5989 46.1685C76.5989 46.1685 76.5581 46.1787 76.5377 46.1787C76.5173 46.1787 76.497 46.1838 76.4766 46.1889C76.497 46.1889 76.5173 46.1838 76.5377 46.1787C76.5581 46.1787 76.5785 46.1736 76.5989 46.1685ZM76.1708 46.2144C76.1708 46.2144 76.2115 46.2144 76.2268 46.2144C76.2268 46.2144 76.2319 46.2144 76.237 46.2144C76.237 46.2144 76.2319 46.2144 76.2268 46.2144C76.2064 46.2144 76.1861 46.2144 76.1708 46.2144C76.1504 46.2144 76.1249 46.2144 76.1045 46.2093C76.1249 46.2093 76.1504 46.2093 76.1708 46.2144ZM103.924 46.5203C103.924 46.5203 103.975 46.5356 104 46.5407C103.975 46.5356 103.949 46.5254 103.924 46.5203C103.898 46.5101 103.868 46.4999 103.842 46.4897C103.868 46.4999 103.893 46.5101 103.924 46.5203ZM104.571 46.5458C104.571 46.5458 104.541 46.5457 104.525 46.5508C104.541 46.5508 104.556 46.5509 104.571 46.5458C104.607 46.5458 104.638 46.5356 104.673 46.5254C104.638 46.5356 104.602 46.5407 104.571 46.5458ZM104.235 46.5763C104.235 46.5763 104.281 46.5763 104.306 46.5763C104.311 46.5763 104.322 46.5763 104.327 46.5763C104.322 46.5763 104.316 46.5763 104.306 46.5763C104.281 46.5763 104.26 46.5763 104.235 46.5763C104.204 46.5763 104.179 46.5712 104.148 46.5661C104.179 46.5661 104.204 46.5712 104.235 46.5763ZM80.493 49.9557C80.442 49.9098 80.386 49.8639 80.3248 49.8282C80.386 49.8639 80.4369 49.9047 80.493 49.9557ZM80.6612 50.1391C80.6867 50.1748 80.7071 50.2155 80.7326 50.2512C80.7071 50.2104 80.6867 50.1748 80.6612 50.1391ZM80.8753 50.5622C80.8855 50.5927 80.8957 50.6233 80.9008 50.659C80.8906 50.6284 80.8855 50.5978 80.8753 50.5622ZM85.8652 50.8068C85.8652 50.8068 85.9162 50.8221 85.9417 50.8323C85.9162 50.8272 85.8907 50.817 85.8652 50.8068ZM80.9925 51.2961C80.9925 51.1177 80.9721 50.9546 80.9467 50.8017C80.9772 50.9546 80.9925 51.1177 80.9925 51.2961ZM86.4973 50.8374C86.538 50.8272 86.5788 50.8272 86.6247 50.817C86.5788 50.8272 86.538 50.8323 86.4973 50.8374ZM86.1864 50.8629C86.1864 50.8629 86.2322 50.8629 86.2577 50.8629C86.2577 50.8629 86.2628 50.8629 86.2679 50.8629C86.2679 50.8629 86.2628 50.8629 86.2577 50.8629C86.2322 50.8629 86.2118 50.8629 86.1864 50.8629C86.166 50.8629 86.1507 50.8629 86.1303 50.8578C86.1507 50.8578 86.166 50.8578 86.1864 50.8629ZM106.539 51.2655C106.539 51.2655 106.574 51.2961 106.59 51.3114C106.574 51.2961 106.554 51.2808 106.539 51.2655C106.498 51.2349 106.457 51.2044 106.416 51.1789C106.462 51.2044 106.503 51.2349 106.539 51.2655ZM106.783 51.5305C106.783 51.5305 106.814 51.5816 106.829 51.6071C106.814 51.5816 106.799 51.556 106.783 51.5305C106.758 51.4847 106.727 51.4439 106.692 51.4082C106.722 51.4439 106.753 51.4898 106.783 51.5305ZM106.977 51.9536C106.987 51.9842 106.992 52.0148 107.003 52.0402C106.997 52.0097 106.987 51.9791 106.977 51.9536ZM107.079 52.652C107.079 53.9976 106.197 55.5317 105.091 56.1127C105.086 56.1127 105.076 56.1179 105.071 56.123H105.061C105.061 56.123 105.081 56.1178 105.091 56.1127C106.192 55.5368 107.079 54.0027 107.079 52.6622V52.6367C107.079 52.4583 107.059 52.2952 107.033 52.1423C107.064 52.3003 107.079 52.4685 107.079 52.652ZM90.5188 54.6092C90.4678 54.5633 90.4118 54.5174 90.3557 54.4868C90.4169 54.5225 90.4678 54.5633 90.5188 54.6092ZM90.7584 54.8997C90.7176 54.8335 90.6768 54.7671 90.631 54.7111C90.6768 54.7671 90.7227 54.8335 90.7584 54.8997ZM90.9266 55.3075C90.9011 55.2107 90.8756 55.1189 90.8348 55.0373C90.8705 55.1189 90.9011 55.2158 90.9266 55.3075ZM91.0183 55.9446C91.0183 55.7662 90.9979 55.6031 90.9725 55.4502C91.003 55.6031 91.0183 55.7662 91.0183 55.9446ZM75.8496 55.9191C75.8496 55.9191 75.8904 55.9344 75.9108 55.9395C75.8904 55.9344 75.87 55.9293 75.8496 55.9191C75.8293 55.914 75.8089 55.9038 75.7885 55.8936C75.8089 55.9038 75.8293 55.9089 75.8496 55.9191ZM76.5989 55.9242C76.5989 55.9242 76.5581 55.9344 76.5428 55.9344C76.5173 55.9344 76.497 55.9395 76.4715 55.9446C76.497 55.9446 76.5173 55.9395 76.5428 55.9344C76.5632 55.9344 76.5785 55.9293 76.5989 55.9242ZM76.1555 55.9752C76.1555 55.9752 76.2013 55.9752 76.2268 55.9752C76.2013 55.9752 76.1809 55.9752 76.1555 55.9752C76.1351 55.9752 76.1198 55.9752 76.0994 55.9701C76.1198 55.9701 76.1351 55.9701 76.1555 55.9752ZM105.066 56.1332C105.066 56.1332 105.02 56.1485 104.999 56.1587C105.02 56.1485 105.04 56.1433 105.061 56.1332H105.066ZM104 56.3014C103.944 56.2861 103.893 56.2708 103.847 56.2504C103.898 56.2708 103.949 56.2912 104 56.3014ZM104.24 56.3371C104.24 56.3371 104.281 56.3371 104.306 56.3371C104.306 56.3371 104.322 56.3371 104.327 56.3371C104.322 56.3371 104.311 56.3371 104.306 56.3371C104.286 56.3371 104.26 56.3371 104.24 56.3371C104.209 56.3371 104.184 56.332 104.153 56.3269C104.184 56.3269 104.209 56.332 104.24 56.3371ZM80.4114 59.6451C80.442 59.6654 80.4675 59.6909 80.493 59.7113C80.4675 59.6858 80.4369 59.6654 80.4114 59.6451C80.386 59.6247 80.3605 59.6093 80.3299 59.5889C80.3554 59.6042 80.386 59.6247 80.4114 59.6451ZM80.7326 60.0069C80.6918 59.9407 80.6561 59.8794 80.6051 59.8234C80.651 59.8794 80.6918 59.9407 80.7326 60.0069ZM85.8652 60.5675C85.8652 60.5675 85.9162 60.5828 85.9417 60.593C85.9162 60.5879 85.8907 60.5777 85.8652 60.5675C85.85 60.5624 85.8347 60.5574 85.8194 60.5472C85.8347 60.5523 85.85 60.5573 85.8652 60.5675ZM80.9925 61.0467C80.9925 60.8683 80.9721 60.7053 80.9467 60.5574C80.9772 60.7104 80.9925 60.8734 80.9925 61.0467ZM86.6247 60.5777C86.5839 60.5879 86.5431 60.593 86.5024 60.5981C86.5431 60.5879 86.5839 60.5879 86.6247 60.5777ZM86.1966 60.6287C86.1966 60.6287 86.2373 60.6287 86.2577 60.6287C86.2577 60.6287 86.2628 60.6287 86.2679 60.6287C86.2679 60.6287 86.2628 60.6287 86.2577 60.6287C86.2373 60.6287 86.2169 60.6287 86.1966 60.6287C86.1762 60.6287 86.1507 60.6287 86.1303 60.6236C86.1507 60.6236 86.1762 60.6236 86.1966 60.6287ZM106.549 61.0314C106.549 61.0314 106.579 61.0569 106.59 61.0671C106.574 61.0519 106.559 61.0416 106.549 61.0314C106.508 60.9958 106.462 60.9652 106.416 60.9346C106.462 60.9601 106.508 60.9958 106.549 61.0314ZM106.829 61.3678C106.788 61.2964 106.743 61.2251 106.692 61.1691C106.743 61.2302 106.783 61.2964 106.829 61.3678ZM107.003 61.8062C106.977 61.694 106.941 61.587 106.901 61.4952C106.941 61.5921 106.977 61.6991 107.003 61.8062ZM107.079 62.4178C107.079 63.7787 106.182 65.3282 105.061 65.8991C105.03 65.9144 105.004 65.9194 104.979 65.9347C105.004 65.9245 105.03 65.9195 105.055 65.9042L105.076 65.894C106.187 65.3282 107.084 63.7787 107.084 62.4331V62.4076C107.084 62.2292 107.064 62.061 107.033 61.9081C107.064 62.0661 107.084 62.2343 107.084 62.4178M76.5989 65.6849C76.5989 65.6849 76.5632 65.6951 76.5428 65.6951C76.5173 65.6951 76.497 65.7002 76.4715 65.7053C76.497 65.7053 76.5173 65.7002 76.5428 65.6951C76.5632 65.6951 76.5785 65.69 76.5989 65.6849ZM76.1555 65.736C76.1555 65.736 76.2013 65.736 76.2268 65.736C76.2268 65.736 76.2319 65.736 76.237 65.736C76.237 65.736 76.2319 65.736 76.2268 65.736C76.2013 65.736 76.1809 65.736 76.1555 65.736C76.1351 65.736 76.1198 65.736 76.0994 65.7309C76.1198 65.7309 76.1351 65.7309 76.1555 65.736ZM103.919 66.0418C103.919 66.0418 103.97 66.057 103.995 66.0672C103.97 66.0621 103.944 66.052 103.919 66.0418C103.893 66.0316 103.873 66.0214 103.847 66.0163C103.873 66.0265 103.893 66.0367 103.919 66.0418ZM104.597 66.0621C104.566 66.0621 104.536 66.0723 104.505 66.0774C104.536 66.0774 104.566 66.0672 104.597 66.0621C104.622 66.0621 104.653 66.0519 104.683 66.0468C104.653 66.057 104.627 66.0621 104.597 66.0621ZM104.25 66.0978C104.25 66.0978 104.286 66.0978 104.306 66.0978C104.306 66.0978 104.322 66.0978 104.327 66.0978C104.322 66.0978 104.311 66.0978 104.306 66.0978C104.286 66.0978 104.271 66.0978 104.25 66.0978C104.22 66.0978 104.184 66.0927 104.153 66.0876C104.184 66.0876 104.22 66.0927 104.25 66.0978ZM117.609 66.893C117.609 66.893 117.599 66.893 117.594 66.893C117.599 66.893 117.604 66.893 117.609 66.893C117.681 66.8777 117.757 66.8675 117.823 66.8675C117.752 66.8675 117.681 66.8828 117.609 66.893ZM118.058 66.8828C118.089 66.8828 118.124 66.893 118.155 66.9032C118.124 66.893 118.094 66.8879 118.058 66.8828C118.022 66.8777 117.992 66.8726 117.961 66.8726C117.992 66.8726 118.027 66.8777 118.058 66.8828ZM117.278 66.9796C117.339 66.9541 117.405 66.9338 117.467 66.9185C117.405 66.9338 117.344 66.9541 117.278 66.9796ZM86.7572 73.1826C86.7572 73.1826 86.7063 73.1419 86.6757 73.1215C86.7063 73.1368 86.7317 73.1571 86.7572 73.1826ZM86.8439 73.2795C86.8439 73.2795 86.8643 73.31 86.8745 73.3253C86.8643 73.31 86.8541 73.2948 86.8439 73.2795C86.8337 73.2643 86.8235 73.2489 86.8133 73.2387C86.8235 73.254 86.8337 73.2643 86.8439 73.2795ZM86.9611 73.5293C86.9509 73.4834 86.9356 73.4375 86.9152 73.3968C86.9356 73.4375 86.9458 73.4834 86.9611 73.5293ZM78.9843 81.8475L82.4604 80.0738V74.9412L79.9833 76.2052C79.4277 76.4856 78.9792 77.2602 78.9792 77.9331V81.8425M63.0256 97.7146C63.0154 97.6738 62.995 97.633 62.9899 97.5871C63.0001 97.633 63.0154 97.6738 63.0256 97.7146ZM63.1836 98.1121C63.1836 98.1121 63.1938 98.1274 63.1989 98.1376C63.1938 98.1274 63.1887 98.1223 63.1836 98.1121C63.1632 98.0765 63.1377 98.0459 63.1224 98.0051C63.1428 98.0459 63.1632 98.0765 63.1836 98.1121ZM63.4384 98.4281C63.4027 98.3975 63.362 98.3618 63.3314 98.3262C63.3671 98.3669 63.4027 98.3975 63.4384 98.4281ZM95.2692 14.1594C94.8615 14.1594 94.4435 14.2664 94.0307 14.4753L61.945 30.8215C60.5077 31.5554 59.3863 33.472 59.3863 35.1896C59.3863 36.311 59.8501 37.1928 60.6606 37.6056L61.3895 37.9777V89.6664L59.9419 90.4054C58.5045 91.1394 57.3781 93.061 57.3781 94.7787C57.3781 95.9 57.8419 96.7767 58.6524 97.1895L63.1938 99.5036C63.2549 99.5342 63.3161 99.5596 63.3773 99.5749C63.6321 99.6768 63.9074 99.7278 64.1877 99.7278C64.5904 99.7278 65.0032 99.6209 65.411 99.417L117.548 72.8514C118.986 72.1174 120.107 70.2009 120.107 68.4832C120.107 67.3669 119.633 66.4852 118.828 66.0774V66.0672L116.096 64.6757V29.5982C117.253 28.7114 118.099 27.0701 118.099 25.5817C118.099 24.4655 117.625 23.5837 116.819 23.176V23.1658L112.283 20.8517C111.982 20.6988 111.651 20.6224 111.304 20.6224C110.897 20.6224 110.484 20.7293 110.071 20.9383L100.05 26.0455V23.1352C101.228 22.2483 102.058 20.6275 102.058 19.1086C102.058 18.0688 101.646 17.2329 100.942 16.7945C100.896 16.7588 100.84 16.7232 100.789 16.6977L96.2478 14.3836C95.9471 14.2307 95.6209 14.1543 95.2692 14.1543V14.1594ZM80.0037 80.186V77.9382C80.0037 77.6221 80.2534 77.2144 80.4471 77.1176L81.441 76.613V79.457L80.0037 80.191V80.186Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M118.374 66.9785C118.027 66.8001 117.579 66.8153 117.084 67.0651L115.081 68.0845L110.54 65.7705L112.543 64.7511C113.032 64.5014 113.481 64.486 113.833 64.6644L118.374 66.9785Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M103.761 65.9848C104.113 66.1632 104.566 66.148 105.066 65.8982C106.187 65.3274 107.084 63.7778 107.084 62.4169C107.084 61.6524 106.809 61.1223 106.371 60.898L101.829 58.584C102.267 58.8083 102.543 59.3383 102.543 60.1029C102.543 61.4638 101.646 63.0133 100.524 63.5842C100.025 63.839 99.5711 63.8543 99.2194 63.6708L103.761 65.9848Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M103.766 56.2192C104.118 56.3976 104.566 56.3822 105.066 56.1274C106.187 55.5565 107.084 54.0071 107.084 52.6462C107.084 51.8868 106.809 51.3567 106.371 51.1324L101.829 48.8184C102.267 49.0426 102.543 49.5727 102.543 50.3322C102.543 51.0916 101.646 53.2425 100.524 53.8133C100.03 54.0682 99.5762 54.0836 99.2245 53.9052L103.766 56.2192Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M107.079 42.9127C107.079 44.2583 106.182 45.8078 105.066 46.3787C104.566 46.6336 104.113 46.6437 103.761 46.4653L99.2194 44.1513C99.5711 44.3296 100.025 44.3195 100.524 44.0646C101.64 43.4938 102.538 41.9443 102.538 40.5987C102.538 40.5987 102.262 39.2887 101.824 39.0645L106.365 41.3785C107.094 41.6945 107.079 42.9127 107.079 42.9127Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M78.9843 86.4761L87.007 82.3883L82.4655 80.0742L74.4429 84.162L78.9843 86.4761Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M87.007 82.3879V73.8504C87.007 73.4732 86.8694 73.2133 86.6502 73.1012L82.1088 70.7871C82.3279 70.8992 82.4656 71.1643 82.4656 71.5364V80.0738L87.007 82.3879Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M116.371 24.0723C116.024 23.8939 115.576 23.9091 115.081 24.1589L99.036 32.3345L94.4945 30.0204L110.54 21.8448C111.029 21.5951 111.478 21.5798 111.829 21.7582L116.371 24.0723Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M85.7175 60.5166C86.0641 60.695 86.5126 60.6797 87.007 60.43L89.0101 59.4106C90.1213 58.8448 91.0184 57.2953 91.0184 55.9446C91.0184 55.1953 90.738 54.6653 90.2997 54.441L85.7583 52.127C86.1966 52.3512 86.4769 52.8813 86.4769 53.6305C86.4769 54.9813 85.5798 56.5308 84.4687 57.0965L82.4656 58.1159C81.9763 58.3657 81.5277 58.3809 81.176 58.2025L85.7175 60.5166Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M85.7175 50.7549C86.0641 50.9333 86.5177 50.918 87.007 50.6683L89.0101 49.6489C90.1213 49.0831 91.0184 47.5336 91.0184 46.188C91.0184 45.4387 90.738 44.9036 90.2997 44.6793L85.7583 42.3652C86.1966 42.5895 86.4769 43.1196 86.4769 43.8739C86.4769 45.2195 85.5798 46.769 84.4687 47.3348L82.4656 48.3542C81.9763 48.604 81.5277 48.6193 81.176 48.4409L85.7175 50.7549Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M66.9503 38.9254V92.6071L62.4089 90.293V36.6113L66.9503 38.9254Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M66.9503 92.607L64.9472 93.6264C63.8411 94.1922 62.9389 95.7417 62.9389 97.0924C62.9389 97.8417 63.2193 98.3717 63.6576 98.596L59.1162 96.2819C58.6778 96.0577 58.3975 95.5276 58.3975 94.7784C58.3975 93.4277 59.2997 91.8781 60.4057 91.3124L62.4089 90.293L66.9503 92.607Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M75.6917 65.6233C76.0383 65.8017 76.4868 65.7863 76.9812 65.5365L78.9894 64.5122C80.0955 63.9464 80.9925 62.3969 80.9925 61.0462C80.9925 60.2969 80.7173 59.7668 80.279 59.5426L75.7375 57.2285C76.1759 57.4528 76.4511 57.9828 76.4511 58.7321C76.4511 59.4814 75.554 61.6323 74.448 62.1981L72.4398 63.2226C71.9505 63.4724 71.5019 63.4876 71.1502 63.3092L75.6917 65.6233Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M85.7175 40.9951C86.0641 41.1735 86.5126 41.1583 87.007 40.9085L89.0101 39.8891C90.1213 39.3233 91.0184 37.7738 91.0184 36.4231C91.0184 35.6739 90.738 35.1438 90.2997 34.9195L85.7583 32.6055C86.1966 32.8297 86.4769 33.3598 86.4769 34.1091C86.4769 35.4598 85.5798 37.0093 84.4687 37.575L82.4656 38.5944C81.9763 38.8442 81.5277 38.8595 81.176 38.6811L85.7175 40.9951Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M75.6917 55.8635C76.0383 56.0419 76.4919 56.0266 76.9812 55.7769L78.9894 54.7524C80.0955 54.1866 80.9925 52.6371 80.9925 51.2915C80.9925 49.9459 80.7122 50.0071 80.2739 49.7828L75.7324 47.4688C76.1708 47.693 76.4511 48.2231 76.4511 48.9774C76.4511 50.3231 75.554 51.8726 74.448 52.4383L72.4398 53.4628C71.9505 53.7126 71.5019 53.728 71.1502 53.5496L75.6917 55.8635Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M75.6917 46.1018C76.0383 46.2802 76.4868 46.2649 76.9812 46.0152L78.9894 44.9907C80.0955 44.4249 80.9925 42.8754 80.9925 41.5247C80.9925 40.7754 80.7173 40.2454 80.279 40.0211L75.7375 37.707C76.1759 37.9313 76.4511 38.4614 76.4511 39.2106C76.4511 40.5613 75.554 42.1108 74.448 42.6766L72.4398 43.7011C71.9505 43.9509 71.5019 43.9661 71.1502 43.7877L75.6917 46.1018Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M100.325 17.6094C99.9788 17.431 99.5252 17.4462 99.0359 17.696L66.9503 34.0421C65.8442 34.6079 64.9471 36.1573 64.9471 37.5029C64.9471 38.8485 65.2275 38.7874 65.6658 39.0117L61.1244 36.6976C60.6861 36.4734 60.4057 35.9433 60.4057 35.1889C60.4057 33.8433 61.3028 32.2938 62.4089 31.728L94.4945 15.3819C94.9838 15.1322 95.4374 15.1169 95.784 15.2953L100.325 17.6094Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M105.056 60.9911L105.076 60.9809C106.187 60.4151 107.084 61.0523 107.084 62.403V62.4285C107.084 63.7741 106.187 65.3236 105.076 65.8894L105.056 65.8996C103.944 66.4654 103.047 65.8282 103.047 64.4826V64.4571C103.047 63.1064 103.944 61.5569 105.056 60.9911ZM103.047 54.7218V54.6964C103.047 53.3508 103.944 51.8013 105.056 51.2355L105.076 51.2253C106.187 50.6595 107.084 51.2967 107.084 52.6423V52.6677C107.084 54.0133 106.187 55.5628 105.076 56.1286L105.056 56.1388C103.944 56.7045 103.047 56.0674 103.047 54.7218ZM107.079 42.907C107.079 44.2526 106.182 45.8021 105.071 46.3678L105.05 46.378C103.939 46.9438 103.042 46.3067 103.042 44.9611V44.9356C103.042 43.5848 103.939 42.0353 105.05 41.4696L105.071 41.4594C106.182 40.8936 107.079 41.5307 107.079 42.8814V42.907ZM76.9812 41.1383L78.9894 40.1138C80.0955 39.548 80.9925 40.1852 80.9925 41.5308C80.9925 42.8764 80.0955 44.431 78.9894 44.9968L76.9812 46.0213C75.8752 46.587 74.9781 45.9499 74.9781 44.5992C74.9781 43.2485 75.8752 41.7041 76.9812 41.1383ZM76.9812 50.8939L78.9894 49.8694C80.0955 49.3036 80.9925 49.9459 80.9925 51.2915C80.9925 52.6371 80.0955 54.1866 78.9894 54.7524L76.9812 55.7769C75.8752 56.3427 74.9781 55.7055 74.9781 54.3599C74.9781 53.0143 75.8752 51.4597 76.9812 50.8939ZM74.973 64.1156C74.973 62.77 75.8701 61.2205 76.9761 60.6548L78.9843 59.6303C80.0904 59.0645 80.9874 59.7016 80.9874 61.0472C80.9874 62.3928 80.0904 63.9475 78.9843 64.5132L76.9761 65.5376C75.8701 66.1034 74.973 65.4663 74.973 64.1156ZM87.007 82.3883L78.9894 86.4761V77.9386C78.9894 77.2607 79.438 76.4912 79.9935 76.2108L86.008 73.1475C86.5585 72.8672 87.0121 73.1831 87.0121 73.8559V82.3934L87.007 82.3883ZM89.0102 59.4111L87.007 60.4305C85.901 60.9963 85.0039 60.3591 85.0039 59.0084C85.0039 57.6577 85.901 56.1133 87.007 55.5475L89.0102 54.5281C90.1213 53.9624 91.0184 54.5995 91.0184 55.9451C91.0184 57.2907 90.1213 58.8453 89.0102 59.4111ZM89.0102 49.6452L87.007 50.6646C85.901 51.2303 85.0039 50.5932 85.0039 49.2476C85.0039 47.902 85.901 46.3475 87.007 45.7817L89.0102 44.7623C90.1213 44.1966 91.0184 44.8336 91.0184 46.1843C91.0184 47.535 90.1213 49.0794 89.0102 49.6452ZM89.0102 39.8896L87.007 40.909C85.901 41.4747 85.0039 40.8376 85.0039 39.4869C85.0039 38.1362 85.901 36.5918 87.007 36.026L89.0102 35.0066C90.1213 34.4408 91.0184 35.078 91.0184 36.4236C91.0184 37.7692 90.1213 39.3238 89.0102 39.8896ZM117.084 67.0617L115.081 68.0811V29.038C116.187 28.4723 117.084 26.9228 117.084 25.5771C117.084 24.2264 116.187 23.5893 115.081 24.1551L99.0359 32.3307V22.57C100.147 22.0042 101.044 20.4547 101.044 19.104C101.044 17.7584 100.147 17.1212 99.0359 17.687L66.9503 34.0331C65.8443 34.5989 64.9472 36.1484 64.9472 37.494C64.9472 38.8396 65.8443 39.4817 66.9503 38.916V92.5976L64.9472 93.617C63.8411 94.1828 62.939 95.7323 62.939 97.083C62.939 98.4337 63.8411 99.0607 64.9472 98.5L117.084 71.9344C118.19 71.3686 119.088 69.8191 119.088 68.4735C119.088 67.1279 118.19 66.4858 117.084 67.0515V67.0617Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M150.704 52.0596C152.106 51.3461 152.998 49.659 152.998 47.2583C152.998 42.9615 150.133 38.0175 146.606 36.2233C145.046 35.4282 143.619 35.3772 142.508 35.943L144.781 34.786C145.892 34.2202 147.32 34.2712 148.879 35.0663C152.412 36.8656 155.271 41.8096 155.271 46.1013C155.271 48.502 154.379 50.189 152.977 50.9026L150.704 52.0596Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M150.704 52.0589C149.593 52.6246 148.166 52.5736 146.606 51.7785C143.074 49.9793 140.214 45.0352 140.214 40.7435C140.214 38.3429 141.106 36.6558 142.508 35.9422C143.619 35.3764 145.046 35.4274 146.606 36.2226C150.138 38.0218 152.998 42.9658 152.998 47.2575C152.998 49.6582 152.106 51.3453 150.704 52.0589Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M146.209 46.1358C146.051 46.0542 145.923 45.8351 145.923 45.6414V43.2101C145.923 43.0164 146.051 42.9297 146.209 43.0062C146.367 43.0826 146.494 43.3069 146.494 43.5005V45.9318C146.494 46.1255 146.367 46.2122 146.209 46.1358Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M149.211 43.8417L144.343 41.3594C144.144 41.2575 143.971 41.0026 143.925 40.7427C143.879 40.4827 143.976 40.2891 144.154 40.2738L146.402 40.08C146.642 40.0597 146.917 40.2024 147.157 40.4674L149.399 42.9497C149.578 43.1485 149.675 43.439 149.629 43.6531C149.583 43.8671 149.409 43.9487 149.211 43.8417ZM144.96 40.9822L148.594 42.8325L146.902 40.9618C146.82 40.8701 146.728 40.8242 146.652 40.8293L144.96 40.9771V40.9822Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M147.35 46.7177C147.192 46.6362 147.065 46.417 147.065 46.2233V43.792C147.065 43.5983 147.192 43.5117 147.35 43.5882C147.508 43.6647 147.636 43.8889 147.636 44.0826V46.5139C147.636 46.7076 147.508 46.7942 147.35 46.7177Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M148.492 47.2979C148.334 47.2163 148.207 46.9971 148.207 46.8034V44.3722C148.207 44.1785 148.334 44.0918 148.492 44.1683C148.65 44.2447 148.777 44.469 148.777 44.6627V47.0939C148.777 47.2876 148.65 47.3743 148.492 47.2979Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M149.348 49.1231L144.21 46.5033C144.052 46.4218 143.925 46.2026 143.925 46.0089C143.925 45.8152 144.052 45.7285 144.21 45.805L149.348 48.4249C149.506 48.5065 149.634 48.7256 149.634 48.9193C149.634 49.113 149.506 49.1996 149.348 49.1231Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M145.067 45.5497C144.909 45.4682 144.781 45.249 144.781 45.0553V42.6241C144.781 42.4304 144.909 42.3438 145.067 42.4202C145.225 42.4967 145.352 42.7209 145.352 42.9146V45.3459C145.352 45.5396 145.225 45.6262 145.067 45.5497Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M8.16802 89.1169C5.96802 87.9969 4.56802 85.349 4.56802 81.581C4.56802 74.837 9.064 67.0771 14.6 64.2611L51.72 45.349C54.168 44.101 56.408 44.0209 58.152 44.9089L54.584 43.0929C52.84 42.2049 50.6 42.2849 48.152 43.5329L11.032 62.445C5.48803 65.269 1 73.029 1 79.765C1 83.533 2.4 86.1809 4.6 87.3009L8.16802 89.1169Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M8.16799 89.1173C9.91199 90.0053 12.152 89.9253 14.6 88.6773L51.72 69.7654C57.264 66.9414 61.752 59.1814 61.752 52.4454C61.752 48.6774 60.352 46.0293 58.152 44.9093C56.408 44.0213 54.168 44.1013 51.72 45.3493L14.6 64.2615C9.05598 67.0855 4.56799 74.8454 4.56799 81.5814C4.56799 85.3494 5.96799 87.9973 8.16799 89.1173Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M24.3996 71.6036C24.0956 71.7556 23.8556 71.5876 23.8556 71.2196V68.5716C23.8556 68.2036 24.0956 67.7876 24.3996 67.6276C24.7036 67.4676 24.9436 67.6436 24.9436 68.0116V70.6596C24.9436 71.0276 24.7036 71.4436 24.3996 71.6036Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M25.4877 77.6756C25.1837 77.8276 24.9436 77.6596 24.9436 77.2916V75.2996C24.9436 74.9316 24.6956 74.7636 24.3996 74.9156C24.1036 75.0676 23.8556 75.4917 23.8556 75.8597V77.8517C23.8556 78.2197 23.6156 78.6357 23.3116 78.7957C23.0076 78.9557 22.7676 78.7797 22.7676 78.4117V76.4197C22.7676 75.3237 23.5036 74.0597 24.3996 73.5957C25.2956 73.1317 26.0317 73.6516 26.0317 74.7476V76.7396C26.0317 77.1076 25.7917 77.5236 25.4877 77.6836V77.6756Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M25.4877 69.7158L23.3116 70.8279C23.0076 70.9799 22.7676 70.812 22.7676 70.444C22.7676 70.076 23.0076 69.6598 23.3116 69.4998L25.4877 68.3879C25.7917 68.2359 26.0317 68.4039 26.0317 68.7719C26.0317 69.1399 25.7917 69.5558 25.4877 69.7158Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M28.7596 76.013L20.0476 80.453C19.1436 80.909 18.4156 80.3969 18.4156 79.3009V73.3329C18.4156 72.2369 19.1516 70.9729 20.0476 70.5089L21.1357 69.957C21.4397 69.805 21.6797 69.9729 21.6797 70.3409C21.6797 70.7089 21.4397 71.1249 21.1357 71.2849L20.0476 71.837C19.7436 71.989 19.5036 72.413 19.5036 72.781V78.7489C19.5036 79.1169 19.7516 79.2849 20.0476 79.1329L28.7596 74.6929C29.0636 74.5409 29.3036 74.1169 29.3036 73.7489V69.773C29.3036 69.405 29.0556 69.237 28.7596 69.389L27.6717 69.9409C27.3677 70.0929 27.1277 69.925 27.1277 69.557C27.1277 69.189 27.3677 68.773 27.6717 68.613L28.7596 68.0611C29.6636 67.6051 30.3916 68.117 30.3916 69.213V73.189C30.3916 74.285 29.6556 75.549 28.7596 76.013Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M27.6636 76.5638C27.3596 76.7158 27.1196 76.5478 27.1196 76.1798V65.5718C27.1196 65.2038 26.8716 65.0358 26.5756 65.1878L22.2156 67.4118C21.9116 67.5638 21.6716 67.9877 21.6716 68.3557V78.9638C21.6716 79.3318 21.4316 79.7477 21.1276 79.9077C20.8236 80.0677 20.5836 79.8917 20.5836 79.5237V68.9157C20.5836 67.8197 21.3196 66.5557 22.2156 66.0917L26.5756 63.8677C27.4796 63.4117 28.2076 63.9238 28.2076 65.0198V75.6278C28.2076 75.9958 27.9676 76.4118 27.6636 76.5718V76.5638Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M43.9842 64.9721C43.6722 65.1321 43.4161 64.9561 43.4161 64.5721C43.4161 64.1881 43.6641 63.7561 43.9761 63.5961C44.2881 63.4361 44.5441 63.6121 44.5441 63.9961C44.5441 64.3801 44.2881 64.8121 43.9761 64.9721H43.9842Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M46.2481 63.8217C45.9361 63.9817 45.6801 63.8057 45.6801 63.4217C45.6801 63.0377 45.9281 62.6057 46.2401 62.4457C46.5521 62.2857 46.8081 62.4617 46.8081 62.8457C46.8081 63.2297 46.5521 63.6617 46.2401 63.8217H46.2481Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M47.9441 66.3976L40.0241 70.4297C39.0881 70.9097 38.3281 70.3657 38.3281 69.2297V59.5896C38.3281 58.4536 39.0881 57.1337 40.0241 56.6617L41.1521 56.0855C42.0881 55.6055 42.8481 56.1495 42.8481 57.2855V60.4457L44.9361 57.7576C45.2641 57.3336 45.7201 57.1656 45.9921 57.3576C46.1521 57.4696 46.2401 57.6856 46.2401 57.9656V58.7176L48.3281 56.0297C48.6561 55.6057 49.1121 55.4377 49.3841 55.6297C49.5441 55.7417 49.6321 55.9577 49.6321 56.2377V63.4617C49.6321 64.5977 48.8721 65.9176 47.9361 66.3896L47.9441 66.3976ZM40.0241 58.0457C39.7121 58.2057 39.4561 58.6457 39.4561 59.0217V68.6617C39.4561 69.0377 39.7121 69.2217 40.0241 69.0617L47.9441 65.0297C48.2561 64.8697 48.5121 64.4297 48.5121 64.0537V57.4537L46.4241 60.1416C46.2321 60.3896 46.0081 60.5497 45.7841 60.6057C45.5601 60.6617 45.3761 60.5977 45.2481 60.4217C45.1601 60.3017 45.1121 60.1336 45.1121 59.9336V59.1816L43.0241 61.8695C42.8321 62.1175 42.6081 62.2776 42.3841 62.3336C42.1601 62.3896 41.9761 62.3256 41.8481 62.1576C41.7601 62.0376 41.7121 61.8617 41.7121 61.6617V57.8775C41.7121 57.5015 41.4561 57.3175 41.1441 57.4775L40.0161 58.0537L40.0241 58.0457Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M41.7281 66.1244C41.4161 66.2844 41.1601 66.1084 41.1601 65.7244C41.1601 65.3404 41.4081 64.9085 41.7201 64.7485C42.0321 64.5885 42.2881 64.7645 42.2881 65.1485C42.2881 65.5325 42.0321 65.9644 41.7201 66.1244H41.7281Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M47.7547 2.22619C46.6435 1.66042 45.2163 1.70632 43.6515 2.50655C40.1193 4.30579 37.2599 9.24996 37.2599 13.5416C37.2599 15.9372 38.1519 17.6294 39.5536 18.343L37.2803 17.1859C35.8786 16.4724 34.9866 14.7802 34.9866 12.3846C34.9866 8.08783 37.8512 3.14366 41.3783 1.34952C42.938 0.554384 44.3702 0.503389 45.4814 1.06916L47.7547 2.22619Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M47.7546 2.22736C49.1563 2.94094 50.0483 4.63323 50.0483 7.02882C50.0483 11.3256 47.1837 16.2696 43.6566 18.0638C42.0969 18.8589 40.6647 18.9099 39.5535 18.3441C38.1519 17.6306 37.2599 15.9384 37.2599 13.5428C37.2599 9.24603 40.1244 4.30187 43.6515 2.50772C45.2112 1.71259 46.6435 1.66159 47.7546 2.22736Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M47.2551 9.3276C47.0564 9.42954 46.8933 9.3174 46.8933 9.07275V6.88101L45.0889 7.7985C44.8901 7.90044 44.7271 7.7883 44.7271 7.54365C44.7271 7.29899 44.8901 7.02364 45.0889 6.9217L47.25 5.82079C47.4488 5.71885 47.6119 5.83099 47.6119 6.07564V8.70565C47.6119 8.95031 47.4488 9.22566 47.25 9.3276H47.2551Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M40.048 14.7549C39.9562 14.8008 39.8645 14.8059 39.7931 14.7549C39.6504 14.653 39.6504 14.3777 39.7931 14.1331L42.1377 10.0912C42.2805 9.84653 42.5047 9.73439 42.6474 9.83123L44.1969 10.927L47.0054 6.07978C47.1481 5.83513 47.3724 5.72299 47.5151 5.81983C47.6578 5.92177 47.6578 6.19699 47.5151 6.44165L44.4518 11.7324C44.3091 11.9771 44.0848 12.0892 43.9421 11.9924L42.3926 10.8964L40.3028 14.5C40.2315 14.6224 40.1397 14.709 40.048 14.76V14.7549Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M146.209 46.1358C146.051 46.0542 145.923 45.8351 145.923 45.6414V43.2101C145.923 43.0164 146.051 42.9297 146.209 43.0062C146.367 43.0826 146.494 43.3069 146.494 43.5005V45.9318C146.494 46.1255 146.367 46.2122 146.209 46.1358Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M149.211 43.8417L144.343 41.3594C144.144 41.2575 143.971 41.0026 143.925 40.7427C143.879 40.4827 143.976 40.2891 144.154 40.2738L146.402 40.08C146.642 40.0597 146.917 40.2024 147.157 40.4674L149.399 42.9497C149.578 43.1485 149.675 43.439 149.629 43.6531C149.583 43.8671 149.409 43.9487 149.211 43.8417ZM144.96 40.9822L148.594 42.8325L146.902 40.9618C146.82 40.8701 146.728 40.8242 146.652 40.8293L144.96 40.9771V40.9822Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M147.35 46.7177C147.192 46.6362 147.065 46.417 147.065 46.2233V43.792C147.065 43.5983 147.192 43.5117 147.35 43.5882C147.508 43.6647 147.636 43.8889 147.636 44.0826V46.5139C147.636 46.7076 147.508 46.7942 147.35 46.7177Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M148.492 47.2979C148.334 47.2163 148.207 46.9971 148.207 46.8034V44.3722C148.207 44.1785 148.334 44.0918 148.492 44.1683C148.65 44.2447 148.777 44.469 148.777 44.6627V47.0939C148.777 47.2876 148.65 47.3743 148.492 47.2979Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M149.348 49.1231L144.21 46.5033C144.052 46.4218 143.925 46.2026 143.925 46.0089C143.925 45.8152 144.052 45.7285 144.21 45.805L149.348 48.4249C149.506 48.5065 149.634 48.7256 149.634 48.9193C149.634 49.113 149.506 49.1996 149.348 49.1231Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M145.067 45.5497C144.909 45.4682 144.781 45.249 144.781 45.0553V42.6241C144.781 42.4304 144.909 42.3438 145.067 42.4202C145.225 42.4967 145.352 42.7209 145.352 42.9146V45.3459C145.352 45.5396 145.225 45.6262 145.067 45.5497Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M8.16802 89.1169C5.96802 87.9969 4.56802 85.349 4.56802 81.581C4.56802 74.837 9.064 67.0771 14.6 64.2611L51.72 45.349C54.168 44.101 56.408 44.0209 58.152 44.9089L54.584 43.0929C52.84 42.2049 50.6 42.2849 48.152 43.5329L11.032 62.445C5.48803 65.269 1 73.029 1 79.765C1 83.533 2.4 86.1809 4.6 87.3009L8.16802 89.1169Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M8.16799 89.1173C9.91199 90.0053 12.152 89.9253 14.6 88.6773L51.72 69.7654C57.264 66.9414 61.752 59.1814 61.752 52.4454C61.752 48.6774 60.352 46.0293 58.152 44.9093C56.408 44.0213 54.168 44.1013 51.72 45.3493L14.6 64.2615C9.05598 67.0855 4.56799 74.8454 4.56799 81.5814C4.56799 85.3494 5.96799 87.9973 8.16799 89.1173Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M24.3996 71.6036C24.0956 71.7556 23.8556 71.5876 23.8556 71.2196V68.5716C23.8556 68.2036 24.0956 67.7876 24.3996 67.6276C24.7036 67.4676 24.9436 67.6436 24.9436 68.0116V70.6596C24.9436 71.0276 24.7036 71.4436 24.3996 71.6036Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M25.4877 77.6756C25.1837 77.8276 24.9436 77.6596 24.9436 77.2916V75.2996C24.9436 74.9316 24.6956 74.7636 24.3996 74.9156C24.1036 75.0676 23.8556 75.4917 23.8556 75.8597V77.8517C23.8556 78.2197 23.6156 78.6357 23.3116 78.7957C23.0076 78.9557 22.7676 78.7797 22.7676 78.4117V76.4197C22.7676 75.3237 23.5036 74.0597 24.3996 73.5957C25.2956 73.1317 26.0317 73.6516 26.0317 74.7476V76.7396C26.0317 77.1076 25.7917 77.5236 25.4877 77.6836V77.6756Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M25.4877 69.7158L23.3116 70.8279C23.0076 70.9799 22.7676 70.812 22.7676 70.444C22.7676 70.076 23.0076 69.6598 23.3116 69.4998L25.4877 68.3879C25.7917 68.2359 26.0317 68.4039 26.0317 68.7719C26.0317 69.1399 25.7917 69.5558 25.4877 69.7158Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M28.7596 76.013L20.0476 80.453C19.1436 80.909 18.4156 80.3969 18.4156 79.3009V73.3329C18.4156 72.2369 19.1516 70.9729 20.0476 70.5089L21.1357 69.957C21.4397 69.805 21.6797 69.9729 21.6797 70.3409C21.6797 70.7089 21.4397 71.1249 21.1357 71.2849L20.0476 71.837C19.7436 71.989 19.5036 72.413 19.5036 72.781V78.7489C19.5036 79.1169 19.7516 79.2849 20.0476 79.1329L28.7596 74.6929C29.0636 74.5409 29.3036 74.1169 29.3036 73.7489V69.773C29.3036 69.405 29.0556 69.237 28.7596 69.389L27.6717 69.9409C27.3677 70.0929 27.1277 69.925 27.1277 69.557C27.1277 69.189 27.3677 68.773 27.6717 68.613L28.7596 68.0611C29.6636 67.6051 30.3916 68.117 30.3916 69.213V73.189C30.3916 74.285 29.6556 75.549 28.7596 76.013Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M27.6636 76.5638C27.3596 76.7158 27.1196 76.5478 27.1196 76.1798V65.5718C27.1196 65.2038 26.8716 65.0358 26.5756 65.1878L22.2156 67.4118C21.9116 67.5638 21.6716 67.9877 21.6716 68.3557V78.9638C21.6716 79.3318 21.4316 79.7477 21.1276 79.9077C20.8236 80.0677 20.5836 79.8917 20.5836 79.5237V68.9157C20.5836 67.8197 21.3196 66.5557 22.2156 66.0917L26.5756 63.8677C27.4796 63.4117 28.2076 63.9238 28.2076 65.0198V75.6278C28.2076 75.9958 27.9676 76.4118 27.6636 76.5718V76.5638Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M43.9842 64.9721C43.6722 65.1321 43.4161 64.9561 43.4161 64.5721C43.4161 64.1881 43.6641 63.7561 43.9761 63.5961C44.2881 63.4361 44.5441 63.6121 44.5441 63.9961C44.5441 64.3801 44.2881 64.8121 43.9761 64.9721H43.9842Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M46.2481 63.8217C45.9361 63.9817 45.6801 63.8057 45.6801 63.4217C45.6801 63.0377 45.9281 62.6057 46.2401 62.4457C46.5521 62.2857 46.8081 62.4617 46.8081 62.8457C46.8081 63.2297 46.5521 63.6617 46.2401 63.8217H46.2481Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M47.9441 66.3976L40.0241 70.4297C39.0881 70.9097 38.3281 70.3657 38.3281 69.2297V59.5896C38.3281 58.4536 39.0881 57.1337 40.0241 56.6617L41.1521 56.0855C42.0881 55.6055 42.8481 56.1495 42.8481 57.2855V60.4457L44.9361 57.7576C45.2641 57.3336 45.7201 57.1656 45.9921 57.3576C46.1521 57.4696 46.2401 57.6856 46.2401 57.9656V58.7176L48.3281 56.0297C48.6561 55.6057 49.1121 55.4377 49.3841 55.6297C49.5441 55.7417 49.6321 55.9577 49.6321 56.2377V63.4617C49.6321 64.5977 48.8721 65.9176 47.9361 66.3896L47.9441 66.3976ZM40.0241 58.0457C39.7121 58.2057 39.4561 58.6457 39.4561 59.0217V68.6617C39.4561 69.0377 39.7121 69.2217 40.0241 69.0617L47.9441 65.0297C48.2561 64.8697 48.5121 64.4297 48.5121 64.0537V57.4537L46.4241 60.1416C46.2321 60.3896 46.0081 60.5497 45.7841 60.6057C45.5601 60.6617 45.3761 60.5977 45.2481 60.4217C45.1601 60.3017 45.1121 60.1336 45.1121 59.9336V59.1816L43.0241 61.8695C42.8321 62.1175 42.6081 62.2776 42.3841 62.3336C42.1601 62.3896 41.9761 62.3256 41.8481 62.1576C41.7601 62.0376 41.7121 61.8617 41.7121 61.6617V57.8775C41.7121 57.5015 41.4561 57.3175 41.1441 57.4775L40.0161 58.0537L40.0241 58.0457Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M41.7281 66.1244C41.4161 66.2844 41.1601 66.1084 41.1601 65.7244C41.1601 65.3404 41.4081 64.9085 41.7201 64.7485C42.0321 64.5885 42.2881 64.7645 42.2881 65.1485C42.2881 65.5325 42.0321 65.9644 41.7201 66.1244H41.7281Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M47.7547 2.22619C46.6435 1.66042 45.2163 1.70632 43.6515 2.50655C40.1193 4.30579 37.2599 9.24996 37.2599 13.5416C37.2599 15.9372 38.1519 17.6294 39.5536 18.343L37.2803 17.1859C35.8786 16.4724 34.9866 14.7802 34.9866 12.3846C34.9866 8.08783 37.8512 3.14366 41.3783 1.34952C42.938 0.554384 44.3702 0.503389 45.4814 1.06916L47.7547 2.22619Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M47.7546 2.22736C49.1563 2.94094 50.0483 4.63323 50.0483 7.02882C50.0483 11.3256 47.1837 16.2696 43.6566 18.0638C42.0969 18.8589 40.6647 18.9099 39.5535 18.3441C38.1519 17.6306 37.2599 15.9384 37.2599 13.5428C37.2599 9.24603 40.1244 4.30187 43.6515 2.50772C45.2112 1.71259 46.6435 1.66159 47.7546 2.22736Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M47.2551 9.3276C47.0564 9.42954 46.8933 9.3174 46.8933 9.07275V6.88101L45.0889 7.7985C44.8901 7.90044 44.7271 7.7883 44.7271 7.54365C44.7271 7.29899 44.8901 7.02364 45.0889 6.9217L47.25 5.82079C47.4488 5.71885 47.6119 5.83099 47.6119 6.07564V8.70565C47.6119 8.95031 47.4488 9.22566 47.25 9.3276H47.2551Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M40.048 14.7549C39.9562 14.8008 39.8645 14.8059 39.7931 14.7549C39.6504 14.653 39.6504 14.3777 39.7931 14.1331L42.1377 10.0912C42.2805 9.84653 42.5047 9.73439 42.6474 9.83123L44.1969 10.927L47.0054 6.07978C47.1481 5.83513 47.3724 5.72299 47.5151 5.81983C47.6578 5.92177 47.6578 6.19699 47.5151 6.44165L44.4518 11.7324C44.3091 11.9771 44.0848 12.0892 43.9421 11.9924L42.3926 10.8964L40.3028 14.5C40.2315 14.6224 40.1397 14.709 40.048 14.76V14.7549Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/cycle.tsx b/packages/propel/src/empty-state/assets/vertical-stack/cycle.tsx
index a4551fc5d..4db79f6c0 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/cycle.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/cycle.tsx
@@ -1,19 +1,55 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const CycleVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="160"
-    height="165"
-    viewBox="0 0 160 165"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g clipPath="url(#clip0_446_128653)">
-      <g opacity="0.2">
+export function CycleVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="160"
+      height="165"
+      viewBox="0 0 160 165"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g clipPath="url(#clip0_446_128653)">
+        <g opacity="0.2">
+          <path
+            d="M10.364 131.59C10.364 133.53 11.8174 135.464 14.7191 136.947L52.0819 155.967C57.8905 158.923 67.3043 158.923 73.1129 155.967L151.624 116.002C154.525 114.525 155.979 112.59 155.979 110.651V116.844C155.979 118.783 154.525 120.718 151.624 122.195L73.1129 162.16C67.3043 165.116 57.8905 165.116 52.0819 162.16L14.7191 143.14C11.8123 141.662 10.364 139.723 10.364 137.783V131.59Z"
+            fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+            stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+            strokeWidth="0.5"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+          <path
+            d="M10.364 131.59C10.364 129.651 11.8174 127.716 14.7191 126.239L93.2298 86.2737C99.0383 83.3183 108.452 83.3183 114.261 86.2737L151.624 105.294C154.53 106.772 155.979 108.711 155.979 110.651C155.979 112.59 154.525 114.525 151.624 116.002L73.1129 155.967C67.3043 158.923 57.8905 158.923 52.0819 155.967L14.7191 136.947C11.8123 135.469 10.364 133.53 10.364 131.59Z"
+            fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+            stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+            strokeWidth="0.5"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+        </g>
+        <g opacity="0.6">
+          <path
+            d="M10.364 112.021C10.364 113.96 11.8174 115.895 14.7191 117.377L52.0819 136.398C57.8905 139.353 67.3043 139.353 73.1129 136.398L151.624 96.433C154.525 94.9553 155.979 93.0209 155.979 91.0814V97.2745C155.979 99.214 154.525 101.148 151.624 102.626L73.1129 142.591C67.3043 145.546 57.8905 145.546 52.0819 142.591L14.7191 123.57C11.8123 122.093 10.364 120.153 10.364 118.214V112.021Z"
+            fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+            stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+            strokeWidth="0.5"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+          <path
+            d="M10.364 112.021C10.364 110.081 11.8174 108.147 14.7191 106.669L93.2298 66.7044C99.0383 63.7489 108.452 63.7489 114.261 66.7044L151.624 85.7247C154.53 87.2024 155.979 89.1419 155.979 91.0814C155.979 93.0209 154.525 94.9553 151.624 96.433L73.1129 136.398C67.3043 139.353 57.8905 139.353 52.0819 136.398L14.7191 117.377C11.8123 115.9 10.364 113.96 10.364 112.021Z"
+            fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+            stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+            strokeWidth="0.5"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+        </g>
         <path
-          d="M10.364 131.59C10.364 133.53 11.8174 135.464 14.7191 136.947L52.0819 155.967C57.8905 158.923 67.3043 158.923 73.1129 155.967L151.624 116.002C154.525 114.525 155.979 112.59 155.979 110.651V116.844C155.979 118.783 154.525 120.718 151.624 122.195L73.1129 162.16C67.3043 165.116 57.8905 165.116 52.0819 162.16L14.7191 143.14C11.8123 141.662 10.364 139.723 10.364 137.783V131.59Z"
+          d="M10.364 92.4565C10.364 94.396 11.8174 96.3304 14.7191 97.8132L52.0819 116.834C57.8905 119.789 67.3043 119.789 73.1129 116.834L151.624 76.8688C154.525 75.3911 155.979 73.4567 155.979 71.5172V77.7102C155.979 79.6497 154.525 81.5841 151.624 83.0618L73.1129 123.027C67.3043 125.982 57.8905 125.982 52.0819 123.027L14.7191 104.006C11.8123 102.529 10.364 100.589 10.364 98.6496V92.4565Z"
           fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
           stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
           strokeWidth="0.5"
@@ -21,17 +57,71 @@ export const CycleVerticalStackIllustration = ({ className }: TIllustrationAsset
           strokeLinejoin="round"
         />
         <path
-          d="M10.364 131.59C10.364 129.651 11.8174 127.716 14.7191 126.239L93.2298 86.2737C99.0383 83.3183 108.452 83.3183 114.261 86.2737L151.624 105.294C154.53 106.772 155.979 108.711 155.979 110.651C155.979 112.59 154.525 114.525 151.624 116.002L73.1129 155.967C67.3043 158.923 57.8905 158.923 52.0819 155.967L14.7191 136.947C11.8123 135.469 10.364 133.53 10.364 131.59Z"
+          d="M10.364 92.4565C10.364 90.5171 11.8174 88.5827 14.7191 87.105L93.2298 47.1401C99.0383 44.1847 108.452 44.1847 114.261 47.1401L151.624 66.1605C154.53 67.6382 155.979 69.5777 155.979 71.5172C155.979 73.4567 154.525 75.3911 151.624 76.8688L73.1129 116.834C67.3043 119.789 57.8905 119.789 52.0819 116.834L14.7191 97.8132C11.8123 96.3355 10.364 94.396 10.364 92.4565Z"
           fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
           stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
           strokeWidth="0.5"
           strokeLinecap="round"
           strokeLinejoin="round"
         />
-      </g>
-      <g opacity="0.6">
         <path
-          d="M10.364 112.021C10.364 113.96 11.8174 115.895 14.7191 117.377L52.0819 136.398C57.8905 139.353 67.3043 139.353 73.1129 136.398L151.624 96.433C154.525 94.9553 155.979 93.0209 155.979 91.0814V97.2745C155.979 99.214 154.525 101.148 151.624 102.626L73.1129 142.591C67.3043 145.546 57.8905 145.546 52.0819 142.591L14.7191 123.57C11.8123 122.093 10.364 120.153 10.364 118.214V112.021Z"
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M75.3829 85.4324C72.8304 85.4324 70.4628 84.868 68.3418 83.7597C68.3418 83.7597 68.3212 83.7494 68.3109 83.7443L64.1818 81.6457C58.0548 78.5261 54.5419 71.2197 54.5419 61.5992C54.5419 43.9231 66.3799 23.5174 80.9347 16.1083C84.4989 14.292 87.9707 13.3735 91.2473 13.3735C93.7433 13.3735 96.0698 13.9123 98.1601 14.9795L102.253 17.0627C102.294 17.0832 102.325 17.1037 102.361 17.1242C108.529 20.1772 112.088 27.5041 112.088 37.2016C112.088 54.8777 100.25 75.2885 85.6956 82.6976C82.1313 84.5139 78.6647 85.4324 75.388 85.4324H75.3829Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        />
+        <path
+          d="M91.2422 13.8867C93.6766 13.8867 95.926 14.4203 97.9187 15.4362L102.012 17.5194C102.043 17.5348 102.063 17.5501 102.089 17.5604C107.882 20.4286 111.57 27.3554 111.57 37.2016C111.57 54.734 99.8754 74.8986 85.4593 82.241C81.8899 84.0573 78.4849 84.9193 75.388 84.9193C72.9023 84.9193 70.6066 84.3652 68.5831 83.3082C68.5677 83.3082 68.5575 83.2979 68.5421 83.2877L64.4129 81.1891C58.6916 78.2747 55.0555 71.3788 55.0555 61.6043C55.0555 44.0719 66.7497 23.9125 81.1658 16.5701C84.7352 14.7538 88.1402 13.8918 91.2422 13.8918M91.2422 12.8605C87.8834 12.8605 84.3346 13.7994 80.6984 15.6517C73.5494 19.2895 66.8421 26.0726 61.8142 34.749C56.7914 43.41 54.0284 52.9433 54.0284 61.5992C54.0284 71.4198 57.6439 78.8904 63.9507 82.1024L68.049 84.1856C68.0798 84.2061 68.1158 84.2215 68.1466 84.2369C70.3293 85.3708 72.7688 85.9455 75.388 85.9455C78.7468 85.9455 82.2905 85.0065 85.9267 83.1543C93.0757 79.5164 99.783 72.7333 104.811 64.0569C109.834 55.3959 112.597 45.8575 112.597 37.2016C112.597 27.3194 108.945 19.8334 102.582 16.6574C102.546 16.6368 102.51 16.6163 102.469 16.5958L98.3861 14.5178C96.2239 13.4146 93.8204 12.8605 91.2422 12.8605Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M102.012 17.5193C100.677 16.8677 99.2283 16.4265 97.6876 16.2212C97.5489 16.2007 97.4103 16.1802 97.2613 16.1699C95.7668 16.0057 94.185 16.057 92.5364 16.3341C92.1615 16.3957 91.7866 16.4675 91.4014 16.5547C91.3244 16.5752 91.2473 16.5906 91.1651 16.606C90.8365 16.6881 90.5026 16.7754 90.1688 16.8728C89.4909 17.0678 88.7976 17.3038 88.094 17.5706C87.6625 17.74 87.2209 17.9247 86.7792 18.1197C86.3427 18.3146 85.8958 18.5301 85.449 18.7559C71.0278 26.0983 59.3387 46.2577 59.3387 63.7901C59.3387 64.4058 59.3541 65.0112 59.3798 65.6116C59.3952 65.8938 59.4106 66.1811 59.4312 66.4582V66.4735C59.4466 66.7096 59.4671 66.9405 59.4877 67.1662C59.4877 67.2586 59.5031 67.3509 59.5185 67.4382C59.539 67.6639 59.5596 67.8846 59.5904 68.1052C59.6263 68.3976 59.6674 68.6901 59.7085 68.9774C59.7393 69.1776 59.7701 69.3777 59.8061 69.5726V69.588C59.8318 69.7266 59.8523 69.8651 59.8831 70.0036C59.9242 70.214 59.9602 70.4295 60.0064 70.6347C60.0475 70.8554 60.104 71.0811 60.1553 71.3018C60.2272 71.6045 60.2991 71.9021 60.3813 72.1945C60.4378 72.3998 60.4994 72.605 60.5611 72.8051C60.633 73.0463 60.7049 73.2823 60.787 73.5132C60.8487 73.7082 60.9103 73.8877 60.9822 74.0776C61.0079 74.1443 61.0284 74.2059 61.0541 74.2726C61.1311 74.4727 61.2133 74.6728 61.2955 74.8678C61.3828 75.0884 61.4752 75.3039 61.5728 75.5245C61.6498 75.7041 61.732 75.8785 61.8193 76.0479C61.8655 76.1556 61.9169 76.2531 61.9734 76.3557C62.035 76.4943 62.1069 76.6277 62.1788 76.7662C62.4664 77.3101 62.7746 77.8232 63.1084 78.3106C63.1649 78.4081 63.2317 78.5056 63.3036 78.5928C63.4217 78.7673 63.5449 78.9366 63.6682 79.1008C63.7504 79.2137 63.8325 79.3111 63.9198 79.4189C64.2023 79.7832 64.5053 80.1321 64.8186 80.4656C64.9162 80.5682 65.0138 80.6708 65.1113 80.7683C65.1524 80.8042 65.1884 80.8402 65.2295 80.8812C65.3065 80.9582 65.3835 81.03 65.4606 81.1018C65.5838 81.2198 65.7122 81.3327 65.8406 81.4456C66.005 81.5893 66.1693 81.7278 66.3388 81.8612C66.4415 81.9433 66.5391 82.0254 66.6469 82.1024C66.8062 82.2204 66.9654 82.3384 67.1348 82.4564C67.2684 82.5488 67.407 82.636 67.5406 82.7232C67.6279 82.7796 67.7203 82.8412 67.8076 82.8874C68.0439 83.0311 68.2853 83.1696 68.5318 83.2979L64.4026 81.1993C58.6814 78.285 55.0452 71.389 55.0452 61.6146C55.0452 44.0822 66.7394 23.9227 81.1555 16.5804C87.5342 13.3376 93.3787 13.1375 97.9136 15.4464L102.007 17.5296L102.012 17.5193Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M111.57 37.2016C111.57 54.734 99.8754 74.8986 85.4593 82.2409C79.0242 85.5145 73.1334 85.6838 68.5831 83.3031C68.5677 83.3031 68.5575 83.2928 68.542 83.2825C68.2955 83.1594 68.0541 83.0157 67.8179 82.872C67.7306 82.8207 67.6381 82.7643 67.5508 82.7079C67.4173 82.6206 67.2786 82.5334 67.1451 82.4411C66.9756 82.323 66.8164 82.2102 66.6572 82.087C66.5494 82.0101 66.4518 81.928 66.3491 81.8459C66.1796 81.7176 66.0152 81.5739 65.8509 81.4303C65.7225 81.3174 65.5941 81.2096 65.4708 81.0865C65.3938 81.0146 65.3168 80.9428 65.2397 80.8659C65.1986 80.8248 65.1627 80.7889 65.1216 80.753C65.024 80.6555 64.9265 80.5529 64.8289 80.4502C64.5156 80.1167 64.2126 79.773 63.9301 79.4035C63.8428 79.2958 63.7606 79.1983 63.6785 79.0854C63.5552 78.9212 63.4319 78.7519 63.3138 78.5775C63.2471 78.4851 63.1854 78.3876 63.1187 78.2953C62.7848 77.8078 62.4767 77.2947 62.1891 76.7508C62.1172 76.6174 62.0453 76.4789 61.9837 76.3404C61.9272 76.2378 61.8758 76.1403 61.8296 76.0325C61.7423 75.8581 61.6601 75.6836 61.5831 75.5092C61.4803 75.2937 61.3879 75.0782 61.3057 74.8524C61.2236 74.6574 61.1414 74.4573 61.0644 74.2572C61.0387 74.1905 61.0181 74.1289 60.9924 74.0622C60.9257 73.8724 60.8641 73.6928 60.7973 73.4978C60.7151 73.2669 60.6432 73.0309 60.5713 72.7898C60.5097 72.5897 60.4532 72.3844 60.3916 72.1792C60.3094 71.8918 60.2375 71.5943 60.1656 71.2864C60.1142 71.0658 60.0577 70.84 60.0167 70.6194C59.9704 70.4141 59.9293 70.1986 59.8934 69.9883C59.8626 69.8549 59.842 69.7163 59.8164 69.5727V69.5573C59.7804 69.3623 59.7496 69.1622 59.7188 68.9621C59.6777 68.6799 59.6315 68.3823 59.6007 68.0898C59.5698 67.8692 59.5493 67.6486 59.5288 67.4228C59.5133 67.3304 59.5031 67.2381 59.4979 67.1509C59.4723 66.9251 59.4569 66.6942 59.4414 66.4582V66.4428C59.4158 66.1657 59.4004 65.8784 59.3901 65.5962C59.3593 65.001 59.349 64.3904 59.349 63.7747C59.349 46.2423 71.0432 26.0829 85.4593 18.7405C85.9061 18.5148 86.3529 18.3044 86.7895 18.1043C87.2311 17.9093 87.6728 17.7246 88.1042 17.5553C88.8027 17.2833 89.496 17.0473 90.1791 16.8575C90.518 16.76 90.8467 16.6728 91.1754 16.5907C91.2576 16.5701 91.3346 16.5547 91.4117 16.5393C91.7917 16.4521 92.1666 16.3803 92.5467 16.3187C94.1952 16.0468 95.7771 15.9903 97.2716 16.1545C97.4154 16.1699 97.554 16.1904 97.6978 16.2058C99.2334 16.4111 100.687 16.8575 102.022 17.504C102.053 17.5194 102.074 17.5348 102.099 17.545C107.892 20.4132 111.58 27.34 111.58 37.1862L111.57 37.2016Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M89.1108 69.7574C88.9618 69.7574 88.8232 69.7266 88.6999 69.6599L84.4064 67.4741C84.0726 67.3048 83.8826 66.9559 83.8826 66.5095V30.1158C83.8826 29.4437 84.3345 28.7099 84.9046 28.4534C86.81 27.5914 88.6742 27.1553 90.4461 27.1553C91.9817 27.1553 93.4094 27.4837 94.6882 28.1353L98.9817 30.3211C99.3515 30.5109 99.7162 30.7315 100.065 30.9727C103.162 33.1636 104.872 37.2632 104.872 42.5224C104.872 47.7816 103.219 53.4051 100.214 58.5822C97.3999 63.4361 93.6559 67.3459 89.6655 69.5984C89.4857 69.701 89.2957 69.7523 89.1108 69.7523V69.7574Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        />
+        <path
+          d="M90.4461 27.6633C91.8893 27.6633 93.24 27.9711 94.452 28.5868L98.7455 30.7726C99.0999 30.9522 99.4389 31.1574 99.7624 31.3883C102.7 33.4664 104.354 37.4685 104.354 42.5225C104.354 47.5764 102.705 53.2564 99.7624 58.3257C96.9942 63.0975 93.3016 66.9559 89.4087 69.1571C89.3008 69.2187 89.1981 69.2443 89.1057 69.2443C89.0389 69.2443 88.9773 69.229 88.9259 69.2033L84.6324 67.0175C84.4835 66.9406 84.391 66.7661 84.391 66.5096V30.1159C84.391 29.6387 84.7197 29.0948 85.1152 28.9204C86.9641 28.084 88.7616 27.6633 90.4461 27.6633ZM90.4461 26.6371C88.6024 26.6371 86.6662 27.0886 84.694 27.9814C83.9391 28.3252 83.369 29.2385 83.369 30.1107V66.5044C83.369 67.1407 83.6669 67.6692 84.1702 67.9257L88.4637 70.1115C88.664 70.2141 88.8797 70.2654 89.1108 70.2654C89.3881 70.2654 89.6552 70.1884 89.9171 70.0448C93.9847 67.7461 97.8006 63.7645 100.656 58.8388C103.707 53.5796 105.381 47.7868 105.381 42.5225C105.381 37.2581 103.599 32.8404 100.358 30.552C99.9935 30.2954 99.6083 30.0594 99.2129 29.8593L94.9194 27.6735C93.5687 26.986 92.0588 26.6371 90.4461 26.6371Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+        />
+        <path
+          d="M98.7455 30.7725C96.1212 29.4385 92.8394 29.5462 89.4087 31.1009C89.0184 31.2805 88.6846 31.8192 88.6846 32.2964V68.6901C88.6846 68.9467 88.777 69.1211 88.9259 69.1981L84.6324 67.0123C84.4835 66.9353 84.3911 66.7609 84.3911 66.5043V30.1158C84.3911 29.6386 84.7197 29.0947 85.1152 28.9203C88.5459 27.3656 91.8277 27.2578 94.452 28.5919L98.7455 30.7777V30.7725Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M98.7456 30.7725C99.0999 30.9521 99.4389 31.1574 99.7624 31.3882C102.7 33.4663 104.349 37.4684 104.349 42.5224C104.349 47.5763 102.7 53.2563 99.7624 58.3256C96.9943 63.0974 93.3016 66.9559 89.4087 69.157C89.2238 69.2597 89.0595 69.2699 88.926 69.2032C88.777 69.1263 88.6846 68.9518 88.6846 68.6953V32.3016C88.6846 31.8244 89.0133 31.2805 89.4087 31.106C92.8394 29.5514 96.1212 29.4436 98.7456 30.7777V30.7725Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M52.5236 2.17268C51.404 1.60315 49.966 1.64933 48.3893 2.45488C44.8302 4.2661 41.949 9.24311 41.949 13.5634C41.949 15.9749 42.8478 17.6784 44.2601 18.3967L41.9695 17.232C40.5572 16.5136 39.6584 14.8102 39.6584 12.3986C39.6584 8.07326 42.5448 3.09625 46.0987 1.29016C47.6703 0.489736 49.1134 0.438427 50.233 1.00796L52.5236 2.17268Z"
           fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
           stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
           strokeWidth="0.5"
@@ -39,205 +129,122 @@ export const CycleVerticalStackIllustration = ({ className }: TIllustrationAsset
           strokeLinejoin="round"
         />
         <path
-          d="M10.364 112.021C10.364 110.081 11.8174 108.147 14.7191 106.669L93.2298 66.7044C99.0383 63.7489 108.452 63.7489 114.261 66.7044L151.624 85.7247C154.53 87.2024 155.979 89.1419 155.979 91.0814C155.979 93.0209 154.525 94.9553 151.624 96.433L73.1129 136.398C67.3043 139.353 57.8905 139.353 52.0819 136.398L14.7191 117.377C11.8123 115.9 10.364 113.96 10.364 112.021Z"
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M52.5236 2.17263C53.9359 2.89096 54.8347 4.59443 54.8347 7.00597C54.8347 11.3313 51.9484 16.3084 48.3944 18.1144C46.8229 18.9149 45.3797 18.9662 44.2601 18.3966C42.8478 17.6783 41.949 15.9748 41.949 13.5633C41.949 9.23793 44.8353 4.26092 48.3893 2.45483C49.9608 1.65441 51.404 1.6031 52.5236 2.17263Z"
           fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
           stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
           strokeWidth="0.5"
           strokeLinecap="round"
           strokeLinejoin="round"
         />
+        <path
+          d="M49.0158 7.01632C50.7363 6.13894 52.1332 7.12407 52.1332 9.21749C52.1332 11.3109 50.7363 13.7173 49.0158 14.5896C47.2953 15.4618 45.8984 14.4818 45.8984 12.3884C45.8984 10.295 47.2953 7.88858 49.0158 7.01632ZM49.0158 7.8578C47.6754 8.54021 46.5917 10.413 46.5917 12.0395C46.5917 13.666 47.6754 14.4357 49.0158 13.7532C50.3563 13.0708 51.4399 11.198 51.4399 9.57153C51.4399 7.94502 50.3563 7.17538 49.0158 7.8578ZM49.8427 8.8532C49.9814 8.60691 50.2073 8.49403 50.3511 8.59665C50.4898 8.69927 50.4898 8.97634 50.3511 9.22263L49.2777 11.0954C49.1391 11.3417 48.908 11.4546 48.7693 11.352C48.6306 11.2493 48.6306 10.9723 48.7693 10.726L49.8478 8.8532H49.8427ZM49.7092 5.10249C49.8992 5.005 50.0532 5.11275 50.0532 5.34877C50.0532 5.58479 49.8992 5.8516 49.7092 5.94396L48.3225 6.6469C48.1325 6.74439 47.9784 6.6315 47.9784 6.40061C47.9784 6.16972 48.1325 5.90291 48.3225 5.80542L49.7092 5.10249Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M156.646 39.1513C157.222 38.8588 157.586 38.1661 157.586 37.181V24.5999C157.586 22.8349 156.41 20.8031 154.957 20.0642L122.375 3.48102C121.733 3.15264 121.143 3.13725 120.686 3.36814L122.976 2.20342C123.433 1.97253 124.024 1.98792 124.666 2.3163L157.252 18.9046C158.706 19.6435 159.882 21.6753 159.882 23.4404V36.0214C159.882 37.0065 159.517 37.6992 158.942 37.9917L156.651 39.1564L156.646 39.1513Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M156.646 39.1512C156.189 39.3821 155.599 39.3667 154.957 39.0383L122.37 22.45C120.917 21.7112 119.741 19.6793 119.741 17.9143V5.33837C119.741 4.35323 120.105 3.66056 120.68 3.36809C121.138 3.1372 121.728 3.15259 122.37 3.48097L154.957 20.0693C156.41 20.8081 157.586 22.84 157.586 24.605V37.1861C157.586 38.1712 157.222 38.8639 156.646 39.1563V39.1512Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M133.628 17.3038L141.188 21.152C141.809 21.4701 142.312 21.111 142.312 20.3567C142.312 19.6025 141.809 18.7302 141.188 18.4172L133.628 14.569C133.006 14.2509 132.503 14.6101 132.503 15.3643C132.503 16.1186 133.006 16.9908 133.628 17.3038Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M134.167 23.6251L144.767 29.0229C145.64 29.4641 146.344 28.9664 146.344 27.9094C146.344 26.8473 145.635 25.6313 144.767 25.1901L134.167 19.7923C133.294 19.351 132.59 19.8488 132.59 20.9057C132.59 21.9678 133.299 23.1839 134.167 23.6251Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M127.285 13.3991C127.336 13.5684 127.455 13.7326 127.588 13.7993C127.773 13.8968 127.927 13.7839 127.927 13.553V13.1271C127.927 12.9886 127.876 12.8295 127.783 12.7064C127.691 12.5832 127.578 12.5063 127.47 12.5011L125.287 12.4396C125.159 12.4396 125.072 12.5473 125.072 12.7218V15.6567C125.072 15.8055 125.133 15.9697 125.231 16.0979C125.333 16.2262 125.457 16.2929 125.559 16.2775L125.873 16.2313C126.037 16.2057 126.099 15.985 126.017 15.7388C125.96 15.5746 125.857 15.4412 125.744 15.3745V13.3478L127.28 13.3888L127.285 13.3991Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M125.939 11.4596C125.991 11.6289 126.109 11.7931 126.242 11.8598C126.427 11.9573 126.581 11.8444 126.581 11.6135V11.1877C126.581 11.0491 126.53 10.8901 126.438 10.7669C126.345 10.6438 126.232 10.5668 126.124 10.5617L123.942 10.5001C123.813 10.5001 123.726 10.6079 123.726 10.7823V13.7172C123.726 13.866 123.788 14.0302 123.885 14.1585C123.988 14.2868 124.111 14.3535 124.214 14.3381L124.527 14.2919C124.691 14.2662 124.753 14.0456 124.671 13.7993C124.614 13.6351 124.512 13.5017 124.399 13.435V11.4083L125.934 11.4493L125.939 11.4596Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M129.267 14.7177C129.175 14.5895 129.062 14.5125 128.959 14.5125L126.777 14.4509C126.648 14.4509 126.561 14.5638 126.561 14.728V17.668C126.561 17.8066 126.612 17.9605 126.705 18.0836C126.802 18.2119 126.915 18.2889 127.018 18.2889L129.196 18.3504C129.329 18.3607 129.416 18.2478 129.416 18.0734V15.1333C129.416 14.9948 129.365 14.8409 129.267 14.7177ZM128.744 17.4474L127.234 17.4012V15.3642L128.744 15.4104V17.4474Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M4.73004 55.0521C3.3177 54.3338 2.41894 52.6354 2.41894 50.2188C2.41894 45.8934 5.30525 40.9164 8.85921 39.1103L32.6892 26.9808C34.2608 26.1803 35.6988 26.129 36.8184 26.6986L34.5278 25.5338C33.4082 24.9643 31.9702 25.0156 30.3987 25.816L6.56865 37.9456C3.01469 39.7517 0.128387 44.7287 0.128387 49.054C0.128387 51.4707 1.02715 53.169 2.43949 53.8874L4.73004 55.0521Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M4.73004 55.052C5.84964 55.6216 7.28766 55.5703 8.85921 54.7698L32.6892 42.6403C36.2483 40.8291 39.1295 35.8521 39.1295 31.5318C39.1295 29.1152 38.2307 27.4168 36.8184 26.6985C35.6988 26.129 34.2608 26.1803 32.6892 26.9807L8.85921 39.1102C5.30012 40.9215 2.41895 45.8985 2.41895 50.2187C2.41895 52.6354 3.31771 54.3337 4.73004 55.052Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M12.1153 43.7692C12.2026 43.6358 12.331 43.5793 12.4132 43.6358C12.4953 43.6922 12.5005 43.8461 12.4286 43.9898L12.4132 44.0206L9.30088 49.3927C9.21357 49.5415 9.07491 49.6133 8.9876 49.5517C8.90029 49.4902 8.90029 49.3208 8.9876 49.1669L12.0999 43.7948L12.1153 43.7692Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          d="M9.80932 45.5548C9.80932 45.329 9.66038 45.2264 9.47549 45.3187C9.29061 45.4111 9.14167 45.6676 9.14167 45.8934C9.14167 46.1192 9.29061 46.2218 9.47549 46.1294C9.66038 46.0371 9.80932 45.7805 9.80932 45.5548ZM10.2561 45.329C10.2561 45.8524 9.9069 46.4527 9.47549 46.6733C9.04409 46.8939 8.69485 46.6476 8.69485 46.1243C8.69485 45.6009 9.04409 45.0006 9.47549 44.78C9.9069 44.5594 10.2561 44.8056 10.2561 45.329Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          d="M12.2591 47.2839C12.2591 47.0581 12.1102 46.9555 11.9253 47.0479C11.7404 47.1402 11.5914 47.3968 11.5914 47.6225C11.5914 47.8483 11.7404 47.9509 11.9253 47.8586C12.1102 47.7662 12.2591 47.5096 12.2591 47.2839ZM12.7008 47.0581C12.7008 47.5815 12.3515 48.1818 11.9201 48.4024C11.4887 48.6231 11.1395 48.3768 11.1395 47.8534C11.1395 47.3301 11.4887 46.7297 11.9201 46.5091C12.3515 46.2885 12.7008 46.5348 12.7008 47.0581Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          d="M10.6259 41.7989C10.6259 41.6552 10.7235 41.491 10.8416 41.4346C11.5349 41.1267 12.2077 41.0241 12.8086 41.1524C13.4711 41.2909 14.0104 41.6963 14.3853 42.3223C14.7551 42.9482 14.94 43.7794 14.9194 44.7184C14.8989 45.6625 14.6678 46.6835 14.262 47.6789C13.8512 48.6743 13.276 49.6082 12.5981 50.3829C11.915 51.1577 11.1549 51.7426 10.3897 52.0762C9.62443 52.4097 8.88488 52.4866 8.24805 52.2917C7.67284 52.1121 7.19521 51.7221 6.86652 51.1475C6.81003 51.05 6.85625 50.8704 6.9641 50.7524C7.07195 50.6344 7.20035 50.6241 7.25684 50.7216C7.55472 51.2295 7.97585 51.5733 8.48943 51.7324C9.06464 51.9068 9.72715 51.8401 10.4153 51.5374C11.1035 51.2347 11.7917 50.7113 12.4029 50.0135C13.014 49.3157 13.5328 48.4794 13.9025 47.5815C14.2723 46.6835 14.4726 45.7651 14.4932 44.9134C14.5137 44.0668 14.3494 43.3177 14.0155 42.7532C13.6817 42.1888 13.1938 41.8246 12.5981 41.7014C12.0639 41.5885 11.4682 41.6758 10.8519 41.9477C10.7338 41.999 10.6362 41.9323 10.6362 41.7886L10.6259 41.7989Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M29.6745 39.0385L20.954 43.4768C20.2349 43.8411 19.6546 43.4306 19.6546 42.5583C19.6546 41.6861 20.2349 40.6855 20.954 40.3212L29.6745 35.883C30.3935 35.5187 30.9739 35.9292 30.9739 36.8014C30.9739 37.6737 30.3935 38.6742 29.6745 39.0385Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
       </g>
-      <path
-        d="M10.364 92.4565C10.364 94.396 11.8174 96.3304 14.7191 97.8132L52.0819 116.834C57.8905 119.789 67.3043 119.789 73.1129 116.834L151.624 76.8688C154.525 75.3911 155.979 73.4567 155.979 71.5172V77.7102C155.979 79.6497 154.525 81.5841 151.624 83.0618L73.1129 123.027C67.3043 125.982 57.8905 125.982 52.0819 123.027L14.7191 104.006C11.8123 102.529 10.364 100.589 10.364 98.6496V92.4565Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M10.364 92.4565C10.364 90.5171 11.8174 88.5827 14.7191 87.105L93.2298 47.1401C99.0383 44.1847 108.452 44.1847 114.261 47.1401L151.624 66.1605C154.53 67.6382 155.979 69.5777 155.979 71.5172C155.979 73.4567 154.525 75.3911 151.624 76.8688L73.1129 116.834C67.3043 119.789 57.8905 119.789 52.0819 116.834L14.7191 97.8132C11.8123 96.3355 10.364 94.396 10.364 92.4565Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M75.3829 85.4324C72.8304 85.4324 70.4628 84.868 68.3418 83.7597C68.3418 83.7597 68.3212 83.7494 68.3109 83.7443L64.1818 81.6457C58.0548 78.5261 54.5419 71.2197 54.5419 61.5992C54.5419 43.9231 66.3799 23.5174 80.9347 16.1083C84.4989 14.292 87.9707 13.3735 91.2473 13.3735C93.7433 13.3735 96.0698 13.9123 98.1601 14.9795L102.253 17.0627C102.294 17.0832 102.325 17.1037 102.361 17.1242C108.529 20.1772 112.088 27.5041 112.088 37.2016C112.088 54.8777 100.25 75.2885 85.6956 82.6976C82.1313 84.5139 78.6647 85.4324 75.388 85.4324H75.3829Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      />
-      <path
-        d="M91.2422 13.8867C93.6766 13.8867 95.926 14.4203 97.9187 15.4362L102.012 17.5194C102.043 17.5348 102.063 17.5501 102.089 17.5604C107.882 20.4286 111.57 27.3554 111.57 37.2016C111.57 54.734 99.8754 74.8986 85.4593 82.241C81.8899 84.0573 78.4849 84.9193 75.388 84.9193C72.9023 84.9193 70.6066 84.3652 68.5831 83.3082C68.5677 83.3082 68.5575 83.2979 68.5421 83.2877L64.4129 81.1891C58.6916 78.2747 55.0555 71.3788 55.0555 61.6043C55.0555 44.0719 66.7497 23.9125 81.1658 16.5701C84.7352 14.7538 88.1402 13.8918 91.2422 13.8918M91.2422 12.8605C87.8834 12.8605 84.3346 13.7994 80.6984 15.6517C73.5494 19.2895 66.8421 26.0726 61.8142 34.749C56.7914 43.41 54.0284 52.9433 54.0284 61.5992C54.0284 71.4198 57.6439 78.8904 63.9507 82.1024L68.049 84.1856C68.0798 84.2061 68.1158 84.2215 68.1466 84.2369C70.3293 85.3708 72.7688 85.9455 75.388 85.9455C78.7468 85.9455 82.2905 85.0065 85.9267 83.1543C93.0757 79.5164 99.783 72.7333 104.811 64.0569C109.834 55.3959 112.597 45.8575 112.597 37.2016C112.597 27.3194 108.945 19.8334 102.582 16.6574C102.546 16.6368 102.51 16.6163 102.469 16.5958L98.3861 14.5178C96.2239 13.4146 93.8204 12.8605 91.2422 12.8605Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M102.012 17.5193C100.677 16.8677 99.2283 16.4265 97.6876 16.2212C97.5489 16.2007 97.4103 16.1802 97.2613 16.1699C95.7668 16.0057 94.185 16.057 92.5364 16.3341C92.1615 16.3957 91.7866 16.4675 91.4014 16.5547C91.3244 16.5752 91.2473 16.5906 91.1651 16.606C90.8365 16.6881 90.5026 16.7754 90.1688 16.8728C89.4909 17.0678 88.7976 17.3038 88.094 17.5706C87.6625 17.74 87.2209 17.9247 86.7792 18.1197C86.3427 18.3146 85.8958 18.5301 85.449 18.7559C71.0278 26.0983 59.3387 46.2577 59.3387 63.7901C59.3387 64.4058 59.3541 65.0112 59.3798 65.6116C59.3952 65.8938 59.4106 66.1811 59.4312 66.4582V66.4735C59.4466 66.7096 59.4671 66.9405 59.4877 67.1662C59.4877 67.2586 59.5031 67.3509 59.5185 67.4382C59.539 67.6639 59.5596 67.8846 59.5904 68.1052C59.6263 68.3976 59.6674 68.6901 59.7085 68.9774C59.7393 69.1776 59.7701 69.3777 59.8061 69.5726V69.588C59.8318 69.7266 59.8523 69.8651 59.8831 70.0036C59.9242 70.214 59.9602 70.4295 60.0064 70.6347C60.0475 70.8554 60.104 71.0811 60.1553 71.3018C60.2272 71.6045 60.2991 71.9021 60.3813 72.1945C60.4378 72.3998 60.4994 72.605 60.5611 72.8051C60.633 73.0463 60.7049 73.2823 60.787 73.5132C60.8487 73.7082 60.9103 73.8877 60.9822 74.0776C61.0079 74.1443 61.0284 74.2059 61.0541 74.2726C61.1311 74.4727 61.2133 74.6728 61.2955 74.8678C61.3828 75.0884 61.4752 75.3039 61.5728 75.5245C61.6498 75.7041 61.732 75.8785 61.8193 76.0479C61.8655 76.1556 61.9169 76.2531 61.9734 76.3557C62.035 76.4943 62.1069 76.6277 62.1788 76.7662C62.4664 77.3101 62.7746 77.8232 63.1084 78.3106C63.1649 78.4081 63.2317 78.5056 63.3036 78.5928C63.4217 78.7673 63.5449 78.9366 63.6682 79.1008C63.7504 79.2137 63.8325 79.3111 63.9198 79.4189C64.2023 79.7832 64.5053 80.1321 64.8186 80.4656C64.9162 80.5682 65.0138 80.6708 65.1113 80.7683C65.1524 80.8042 65.1884 80.8402 65.2295 80.8812C65.3065 80.9582 65.3835 81.03 65.4606 81.1018C65.5838 81.2198 65.7122 81.3327 65.8406 81.4456C66.005 81.5893 66.1693 81.7278 66.3388 81.8612C66.4415 81.9433 66.5391 82.0254 66.6469 82.1024C66.8062 82.2204 66.9654 82.3384 67.1348 82.4564C67.2684 82.5488 67.407 82.636 67.5406 82.7232C67.6279 82.7796 67.7203 82.8412 67.8076 82.8874C68.0439 83.0311 68.2853 83.1696 68.5318 83.2979L64.4026 81.1993C58.6814 78.285 55.0452 71.389 55.0452 61.6146C55.0452 44.0822 66.7394 23.9227 81.1555 16.5804C87.5342 13.3376 93.3787 13.1375 97.9136 15.4464L102.007 17.5296L102.012 17.5193Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M111.57 37.2016C111.57 54.734 99.8754 74.8986 85.4593 82.2409C79.0242 85.5145 73.1334 85.6838 68.5831 83.3031C68.5677 83.3031 68.5575 83.2928 68.542 83.2825C68.2955 83.1594 68.0541 83.0157 67.8179 82.872C67.7306 82.8207 67.6381 82.7643 67.5508 82.7079C67.4173 82.6206 67.2786 82.5334 67.1451 82.4411C66.9756 82.323 66.8164 82.2102 66.6572 82.087C66.5494 82.0101 66.4518 81.928 66.3491 81.8459C66.1796 81.7176 66.0152 81.5739 65.8509 81.4303C65.7225 81.3174 65.5941 81.2096 65.4708 81.0865C65.3938 81.0146 65.3168 80.9428 65.2397 80.8659C65.1986 80.8248 65.1627 80.7889 65.1216 80.753C65.024 80.6555 64.9265 80.5529 64.8289 80.4502C64.5156 80.1167 64.2126 79.773 63.9301 79.4035C63.8428 79.2958 63.7606 79.1983 63.6785 79.0854C63.5552 78.9212 63.4319 78.7519 63.3138 78.5775C63.2471 78.4851 63.1854 78.3876 63.1187 78.2953C62.7848 77.8078 62.4767 77.2947 62.1891 76.7508C62.1172 76.6174 62.0453 76.4789 61.9837 76.3404C61.9272 76.2378 61.8758 76.1403 61.8296 76.0325C61.7423 75.8581 61.6601 75.6836 61.5831 75.5092C61.4803 75.2937 61.3879 75.0782 61.3057 74.8524C61.2236 74.6574 61.1414 74.4573 61.0644 74.2572C61.0387 74.1905 61.0181 74.1289 60.9924 74.0622C60.9257 73.8724 60.8641 73.6928 60.7973 73.4978C60.7151 73.2669 60.6432 73.0309 60.5713 72.7898C60.5097 72.5897 60.4532 72.3844 60.3916 72.1792C60.3094 71.8918 60.2375 71.5943 60.1656 71.2864C60.1142 71.0658 60.0577 70.84 60.0167 70.6194C59.9704 70.4141 59.9293 70.1986 59.8934 69.9883C59.8626 69.8549 59.842 69.7163 59.8164 69.5727V69.5573C59.7804 69.3623 59.7496 69.1622 59.7188 68.9621C59.6777 68.6799 59.6315 68.3823 59.6007 68.0898C59.5698 67.8692 59.5493 67.6486 59.5288 67.4228C59.5133 67.3304 59.5031 67.2381 59.4979 67.1509C59.4723 66.9251 59.4569 66.6942 59.4414 66.4582V66.4428C59.4158 66.1657 59.4004 65.8784 59.3901 65.5962C59.3593 65.001 59.349 64.3904 59.349 63.7747C59.349 46.2423 71.0432 26.0829 85.4593 18.7405C85.9061 18.5148 86.3529 18.3044 86.7895 18.1043C87.2311 17.9093 87.6728 17.7246 88.1042 17.5553C88.8027 17.2833 89.496 17.0473 90.1791 16.8575C90.518 16.76 90.8467 16.6728 91.1754 16.5907C91.2576 16.5701 91.3346 16.5547 91.4117 16.5393C91.7917 16.4521 92.1666 16.3803 92.5467 16.3187C94.1952 16.0468 95.7771 15.9903 97.2716 16.1545C97.4154 16.1699 97.554 16.1904 97.6978 16.2058C99.2334 16.4111 100.687 16.8575 102.022 17.504C102.053 17.5194 102.074 17.5348 102.099 17.545C107.892 20.4132 111.58 27.34 111.58 37.1862L111.57 37.2016Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M89.1108 69.7574C88.9618 69.7574 88.8232 69.7266 88.6999 69.6599L84.4064 67.4741C84.0726 67.3048 83.8826 66.9559 83.8826 66.5095V30.1158C83.8826 29.4437 84.3345 28.7099 84.9046 28.4534C86.81 27.5914 88.6742 27.1553 90.4461 27.1553C91.9817 27.1553 93.4094 27.4837 94.6882 28.1353L98.9817 30.3211C99.3515 30.5109 99.7162 30.7315 100.065 30.9727C103.162 33.1636 104.872 37.2632 104.872 42.5224C104.872 47.7816 103.219 53.4051 100.214 58.5822C97.3999 63.4361 93.6559 67.3459 89.6655 69.5984C89.4857 69.701 89.2957 69.7523 89.1108 69.7523V69.7574Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      />
-      <path
-        d="M90.4461 27.6633C91.8893 27.6633 93.24 27.9711 94.452 28.5868L98.7455 30.7726C99.0999 30.9522 99.4389 31.1574 99.7624 31.3883C102.7 33.4664 104.354 37.4685 104.354 42.5225C104.354 47.5764 102.705 53.2564 99.7624 58.3257C96.9942 63.0975 93.3016 66.9559 89.4087 69.1571C89.3008 69.2187 89.1981 69.2443 89.1057 69.2443C89.0389 69.2443 88.9773 69.229 88.9259 69.2033L84.6324 67.0175C84.4835 66.9406 84.391 66.7661 84.391 66.5096V30.1159C84.391 29.6387 84.7197 29.0948 85.1152 28.9204C86.9641 28.084 88.7616 27.6633 90.4461 27.6633ZM90.4461 26.6371C88.6024 26.6371 86.6662 27.0886 84.694 27.9814C83.9391 28.3252 83.369 29.2385 83.369 30.1107V66.5044C83.369 67.1407 83.6669 67.6692 84.1702 67.9257L88.4637 70.1115C88.664 70.2141 88.8797 70.2654 89.1108 70.2654C89.3881 70.2654 89.6552 70.1884 89.9171 70.0448C93.9847 67.7461 97.8006 63.7645 100.656 58.8388C103.707 53.5796 105.381 47.7868 105.381 42.5225C105.381 37.2581 103.599 32.8404 100.358 30.552C99.9935 30.2954 99.6083 30.0594 99.2129 29.8593L94.9194 27.6735C93.5687 26.986 92.0588 26.6371 90.4461 26.6371Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-      />
-      <path
-        d="M98.7455 30.7725C96.1212 29.4385 92.8394 29.5462 89.4087 31.1009C89.0184 31.2805 88.6846 31.8192 88.6846 32.2964V68.6901C88.6846 68.9467 88.777 69.1211 88.9259 69.1981L84.6324 67.0123C84.4835 66.9353 84.3911 66.7609 84.3911 66.5043V30.1158C84.3911 29.6386 84.7197 29.0947 85.1152 28.9203C88.5459 27.3656 91.8277 27.2578 94.452 28.5919L98.7455 30.7777V30.7725Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M98.7456 30.7725C99.0999 30.9521 99.4389 31.1574 99.7624 31.3882C102.7 33.4663 104.349 37.4684 104.349 42.5224C104.349 47.5763 102.7 53.2563 99.7624 58.3256C96.9943 63.0974 93.3016 66.9559 89.4087 69.157C89.2238 69.2597 89.0595 69.2699 88.926 69.2032C88.777 69.1263 88.6846 68.9518 88.6846 68.6953V32.3016C88.6846 31.8244 89.0133 31.2805 89.4087 31.106C92.8394 29.5514 96.1212 29.4436 98.7456 30.7777V30.7725Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M52.5236 2.17268C51.404 1.60315 49.966 1.64933 48.3893 2.45488C44.8302 4.2661 41.949 9.24311 41.949 13.5634C41.949 15.9749 42.8478 17.6784 44.2601 18.3967L41.9695 17.232C40.5572 16.5136 39.6584 14.8102 39.6584 12.3986C39.6584 8.07326 42.5448 3.09625 46.0987 1.29016C47.6703 0.489736 49.1134 0.438427 50.233 1.00796L52.5236 2.17268Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M52.5236 2.17263C53.9359 2.89096 54.8347 4.59443 54.8347 7.00597C54.8347 11.3313 51.9484 16.3084 48.3944 18.1144C46.8229 18.9149 45.3797 18.9662 44.2601 18.3966C42.8478 17.6783 41.949 15.9748 41.949 13.5633C41.949 9.23793 44.8353 4.26092 48.3893 2.45483C49.9608 1.65441 51.404 1.6031 52.5236 2.17263Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M49.0158 7.01632C50.7363 6.13894 52.1332 7.12407 52.1332 9.21749C52.1332 11.3109 50.7363 13.7173 49.0158 14.5896C47.2953 15.4618 45.8984 14.4818 45.8984 12.3884C45.8984 10.295 47.2953 7.88858 49.0158 7.01632ZM49.0158 7.8578C47.6754 8.54021 46.5917 10.413 46.5917 12.0395C46.5917 13.666 47.6754 14.4357 49.0158 13.7532C50.3563 13.0708 51.4399 11.198 51.4399 9.57153C51.4399 7.94502 50.3563 7.17538 49.0158 7.8578ZM49.8427 8.8532C49.9814 8.60691 50.2073 8.49403 50.3511 8.59665C50.4898 8.69927 50.4898 8.97634 50.3511 9.22263L49.2777 11.0954C49.1391 11.3417 48.908 11.4546 48.7693 11.352C48.6306 11.2493 48.6306 10.9723 48.7693 10.726L49.8478 8.8532H49.8427ZM49.7092 5.10249C49.8992 5.005 50.0532 5.11275 50.0532 5.34877C50.0532 5.58479 49.8992 5.8516 49.7092 5.94396L48.3225 6.6469C48.1325 6.74439 47.9784 6.6315 47.9784 6.40061C47.9784 6.16972 48.1325 5.90291 48.3225 5.80542L49.7092 5.10249Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M156.646 39.1513C157.222 38.8588 157.586 38.1661 157.586 37.181V24.5999C157.586 22.8349 156.41 20.8031 154.957 20.0642L122.375 3.48102C121.733 3.15264 121.143 3.13725 120.686 3.36814L122.976 2.20342C123.433 1.97253 124.024 1.98792 124.666 2.3163L157.252 18.9046C158.706 19.6435 159.882 21.6753 159.882 23.4404V36.0214C159.882 37.0065 159.517 37.6992 158.942 37.9917L156.651 39.1564L156.646 39.1513Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M156.646 39.1512C156.189 39.3821 155.599 39.3667 154.957 39.0383L122.37 22.45C120.917 21.7112 119.741 19.6793 119.741 17.9143V5.33837C119.741 4.35323 120.105 3.66056 120.68 3.36809C121.138 3.1372 121.728 3.15259 122.37 3.48097L154.957 20.0693C156.41 20.8081 157.586 22.84 157.586 24.605V37.1861C157.586 38.1712 157.222 38.8639 156.646 39.1563V39.1512Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M133.628 17.3038L141.188 21.152C141.809 21.4701 142.312 21.111 142.312 20.3567C142.312 19.6025 141.809 18.7302 141.188 18.4172L133.628 14.569C133.006 14.2509 132.503 14.6101 132.503 15.3643C132.503 16.1186 133.006 16.9908 133.628 17.3038Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M134.167 23.6251L144.767 29.0229C145.64 29.4641 146.344 28.9664 146.344 27.9094C146.344 26.8473 145.635 25.6313 144.767 25.1901L134.167 19.7923C133.294 19.351 132.59 19.8488 132.59 20.9057C132.59 21.9678 133.299 23.1839 134.167 23.6251Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M127.285 13.3991C127.336 13.5684 127.455 13.7326 127.588 13.7993C127.773 13.8968 127.927 13.7839 127.927 13.553V13.1271C127.927 12.9886 127.876 12.8295 127.783 12.7064C127.691 12.5832 127.578 12.5063 127.47 12.5011L125.287 12.4396C125.159 12.4396 125.072 12.5473 125.072 12.7218V15.6567C125.072 15.8055 125.133 15.9697 125.231 16.0979C125.333 16.2262 125.457 16.2929 125.559 16.2775L125.873 16.2313C126.037 16.2057 126.099 15.985 126.017 15.7388C125.96 15.5746 125.857 15.4412 125.744 15.3745V13.3478L127.28 13.3888L127.285 13.3991Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M125.939 11.4596C125.991 11.6289 126.109 11.7931 126.242 11.8598C126.427 11.9573 126.581 11.8444 126.581 11.6135V11.1877C126.581 11.0491 126.53 10.8901 126.438 10.7669C126.345 10.6438 126.232 10.5668 126.124 10.5617L123.942 10.5001C123.813 10.5001 123.726 10.6079 123.726 10.7823V13.7172C123.726 13.866 123.788 14.0302 123.885 14.1585C123.988 14.2868 124.111 14.3535 124.214 14.3381L124.527 14.2919C124.691 14.2662 124.753 14.0456 124.671 13.7993C124.614 13.6351 124.512 13.5017 124.399 13.435V11.4083L125.934 11.4493L125.939 11.4596Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M129.267 14.7177C129.175 14.5895 129.062 14.5125 128.959 14.5125L126.777 14.4509C126.648 14.4509 126.561 14.5638 126.561 14.728V17.668C126.561 17.8066 126.612 17.9605 126.705 18.0836C126.802 18.2119 126.915 18.2889 127.018 18.2889L129.196 18.3504C129.329 18.3607 129.416 18.2478 129.416 18.0734V15.1333C129.416 14.9948 129.365 14.8409 129.267 14.7177ZM128.744 17.4474L127.234 17.4012V15.3642L128.744 15.4104V17.4474Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M4.73004 55.0521C3.3177 54.3338 2.41894 52.6354 2.41894 50.2188C2.41894 45.8934 5.30525 40.9164 8.85921 39.1103L32.6892 26.9808C34.2608 26.1803 35.6988 26.129 36.8184 26.6986L34.5278 25.5338C33.4082 24.9643 31.9702 25.0156 30.3987 25.816L6.56865 37.9456C3.01469 39.7517 0.128387 44.7287 0.128387 49.054C0.128387 51.4707 1.02715 53.169 2.43949 53.8874L4.73004 55.0521Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M4.73004 55.052C5.84964 55.6216 7.28766 55.5703 8.85921 54.7698L32.6892 42.6403C36.2483 40.8291 39.1295 35.8521 39.1295 31.5318C39.1295 29.1152 38.2307 27.4168 36.8184 26.6985C35.6988 26.129 34.2608 26.1803 32.6892 26.9807L8.85921 39.1102C5.30012 40.9215 2.41895 45.8985 2.41895 50.2187C2.41895 52.6354 3.31771 54.3337 4.73004 55.052Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M12.1153 43.7692C12.2026 43.6358 12.331 43.5793 12.4132 43.6358C12.4953 43.6922 12.5005 43.8461 12.4286 43.9898L12.4132 44.0206L9.30088 49.3927C9.21357 49.5415 9.07491 49.6133 8.9876 49.5517C8.90029 49.4902 8.90029 49.3208 8.9876 49.1669L12.0999 43.7948L12.1153 43.7692Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        d="M9.80932 45.5548C9.80932 45.329 9.66038 45.2264 9.47549 45.3187C9.29061 45.4111 9.14167 45.6676 9.14167 45.8934C9.14167 46.1192 9.29061 46.2218 9.47549 46.1294C9.66038 46.0371 9.80932 45.7805 9.80932 45.5548ZM10.2561 45.329C10.2561 45.8524 9.9069 46.4527 9.47549 46.6733C9.04409 46.8939 8.69485 46.6476 8.69485 46.1243C8.69485 45.6009 9.04409 45.0006 9.47549 44.78C9.9069 44.5594 10.2561 44.8056 10.2561 45.329Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        d="M12.2591 47.2839C12.2591 47.0581 12.1102 46.9555 11.9253 47.0479C11.7404 47.1402 11.5914 47.3968 11.5914 47.6225C11.5914 47.8483 11.7404 47.9509 11.9253 47.8586C12.1102 47.7662 12.2591 47.5096 12.2591 47.2839ZM12.7008 47.0581C12.7008 47.5815 12.3515 48.1818 11.9201 48.4024C11.4887 48.6231 11.1395 48.3768 11.1395 47.8534C11.1395 47.3301 11.4887 46.7297 11.9201 46.5091C12.3515 46.2885 12.7008 46.5348 12.7008 47.0581Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        d="M10.6259 41.7989C10.6259 41.6552 10.7235 41.491 10.8416 41.4346C11.5349 41.1267 12.2077 41.0241 12.8086 41.1524C13.4711 41.2909 14.0104 41.6963 14.3853 42.3223C14.7551 42.9482 14.94 43.7794 14.9194 44.7184C14.8989 45.6625 14.6678 46.6835 14.262 47.6789C13.8512 48.6743 13.276 49.6082 12.5981 50.3829C11.915 51.1577 11.1549 51.7426 10.3897 52.0762C9.62443 52.4097 8.88488 52.4866 8.24805 52.2917C7.67284 52.1121 7.19521 51.7221 6.86652 51.1475C6.81003 51.05 6.85625 50.8704 6.9641 50.7524C7.07195 50.6344 7.20035 50.6241 7.25684 50.7216C7.55472 51.2295 7.97585 51.5733 8.48943 51.7324C9.06464 51.9068 9.72715 51.8401 10.4153 51.5374C11.1035 51.2347 11.7917 50.7113 12.4029 50.0135C13.014 49.3157 13.5328 48.4794 13.9025 47.5815C14.2723 46.6835 14.4726 45.7651 14.4932 44.9134C14.5137 44.0668 14.3494 43.3177 14.0155 42.7532C13.6817 42.1888 13.1938 41.8246 12.5981 41.7014C12.0639 41.5885 11.4682 41.6758 10.8519 41.9477C10.7338 41.999 10.6362 41.9323 10.6362 41.7886L10.6259 41.7989Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M29.6745 39.0385L20.954 43.4768C20.2349 43.8411 19.6546 43.4306 19.6546 42.5583C19.6546 41.6861 20.2349 40.6855 20.954 40.3212L29.6745 35.883C30.3935 35.5187 30.9739 35.9292 30.9739 36.8014C30.9739 37.6737 30.3935 38.6742 29.6745 39.0385Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_446_128653">
-        <rect width="160" height="164" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary} transform="translate(0 0.5)" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+      <defs>
+        <clipPath id="clip0_446_128653">
+          <rect
+            width="160"
+            height="164"
+            fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+            transform="translate(0 0.5)"
+          />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx b/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx
index 11093ff6e..16cae33ef 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const DashboardVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="165"
-    viewBox="0 0 162 165"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function DashboardVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="165"
+      viewBox="0 0 162 165"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M15.0806 131.544C15.0806 133.489 16.537 135.43 19.4448 136.917L56.8858 155.995C62.7065 158.96 72.1401 158.96 77.9608 155.995L156.636 115.909C159.544 114.427 161 112.486 161 110.541V116.753C161 118.698 159.544 120.638 156.636 122.121L77.9608 162.207C72.1401 165.171 62.7065 165.171 56.8858 162.207L19.4448 143.129C16.5319 141.647 15.0806 139.701 15.0806 137.756V131.544Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M15.0806 131.545C15.0806 129.599 16.537 127.659 19.4448 126.177L98.1197 86.0905C103.94 83.1261 113.374 83.1261 119.195 86.0905L156.636 105.169C159.549 106.651 161 108.596 161 110.542C161 112.487 159.544 114.427 156.636 115.91L77.9608 155.996C72.1401 158.96 62.7065 158.96 56.8858 155.996L19.4448 136.918C16.5319 135.435 15.0806 133.49 15.0806 131.545Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M15.0806 111.921C15.0806 113.866 16.537 115.807 19.4448 117.294L56.8858 136.372C62.7065 139.337 72.1401 139.337 77.9608 136.372L156.636 96.2858C159.544 94.8036 161 92.8634 161 90.918V97.1299C161 99.0752 159.544 101.015 156.636 102.498L77.9608 142.584C72.1401 145.548 62.7065 145.548 56.8858 142.584L19.4448 123.506C16.5319 122.024 15.0806 120.078 15.0806 118.133V111.921Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M15.0806 111.922C15.0806 109.976 16.537 108.036 19.4448 106.554L98.1197 66.4674C103.94 63.503 113.374 63.503 119.195 66.4674L156.636 85.5456C159.549 87.0278 161 88.9732 161 90.9186C161 92.864 159.544 94.8042 156.636 96.2864L77.9608 136.373C72.1401 139.337 62.7065 139.337 56.8858 136.373L19.4448 117.295C16.5319 115.812 15.0806 113.867 15.0806 111.922Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M15.0806 131.544C15.0806 133.489 16.537 135.43 19.4448 136.917L56.8858 155.995C62.7065 158.96 72.1401 158.96 77.9608 155.995L156.636 115.909C159.544 114.427 161 112.486 161 110.541V116.753C161 118.698 159.544 120.638 156.636 122.121L77.9608 162.207C72.1401 165.171 62.7065 165.171 56.8858 162.207L19.4448 143.129C16.5319 141.647 15.0806 139.701 15.0806 137.756V131.544Z"
+        d="M15.0806 92.2979C15.0806 94.2433 16.537 96.1835 19.4448 97.6709L56.8858 116.749C62.7065 119.713 72.1401 119.713 77.9608 116.749L156.636 76.6628C159.544 75.1806 161 73.2403 161 71.2949V77.5068C161 79.4522 159.544 81.3924 156.636 82.8746L77.9608 122.961C72.1401 125.925 62.7065 125.925 56.8858 122.961L19.4448 103.883C16.5319 102.401 15.0806 100.455 15.0806 98.5098V92.2979Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -20,17 +56,145 @@ export const DashboardVerticalStackIllustration = ({ className }: TIllustrationA
         strokeLinejoin="round"
       />
       <path
-        d="M15.0806 131.545C15.0806 129.599 16.537 127.659 19.4448 126.177L98.1197 86.0905C103.94 83.1261 113.374 83.1261 119.195 86.0905L156.636 105.169C159.549 106.651 161 108.596 161 110.542C161 112.487 159.544 114.427 156.636 115.91L77.9608 155.996C72.1401 158.96 62.7065 158.96 56.8858 155.996L19.4448 136.918C16.5319 135.435 15.0806 133.49 15.0806 131.545Z"
+        d="M15.0806 92.2985C15.0806 90.3532 16.537 88.4129 19.4448 86.9308L98.1197 46.8444C103.94 43.88 113.374 43.88 119.195 46.8444L156.636 65.9226C159.549 67.4048 161 69.3502 161 71.2955C161 73.2409 159.544 75.1813 156.636 76.6635L77.9608 116.75C72.1401 119.714 62.7065 119.714 56.8858 116.75L19.4448 97.6715C16.5319 96.1893 15.0806 94.2439 15.0806 92.2985Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M15.0806 111.921C15.0806 113.866 16.537 115.807 19.4448 117.294L56.8858 136.372C62.7065 139.337 72.1401 139.337 77.9608 136.372L156.636 96.2858C159.544 94.8036 161 92.8634 161 90.918V97.1299C161 99.0752 159.544 101.015 156.636 102.498L77.9608 142.584C72.1401 145.548 62.7065 145.548 56.8858 142.584L19.4448 123.506C16.5319 122.024 15.0806 120.078 15.0806 118.133V111.921Z"
+        d="M99.4889 82.3507C98.8198 82.3507 98.1971 82.2067 97.631 81.9185L93.0454 79.5819C91.4242 78.7534 90.4927 76.8543 90.4927 74.3583V64.0652C90.4927 59.6341 93.4623 54.5132 97.1163 52.6553L105.577 48.3477C106.498 47.8794 107.399 47.6426 108.259 47.6426C108.928 47.6426 109.55 47.7867 110.116 48.0749L114.702 50.4115C116.323 51.2401 117.255 53.1391 117.255 55.6351V65.9282C117.255 70.3594 114.285 75.475 110.631 77.338L102.17 81.6457C101.249 82.114 100.348 82.3507 99.4889 82.3507Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M108.259 48.1524C108.85 48.1524 109.396 48.281 109.88 48.528L114.465 50.8646C115.855 51.5748 116.74 53.2474 116.74 55.6251V65.9182C116.74 70.1795 113.899 75.0841 110.394 76.87L101.933 81.1777C101.064 81.6203 100.24 81.8312 99.4837 81.8312C98.8918 81.8312 98.3463 81.7025 97.8625 81.4555L93.277 79.1191C91.8874 78.4089 91.0022 76.7362 91.0022 74.3585V64.0655C91.0022 59.8042 93.8431 54.8995 97.3478 53.1137L105.809 48.806C106.679 48.3634 107.502 48.1524 108.259 48.1524ZM108.259 47.123C107.317 47.123 106.339 47.3804 105.34 47.8847L96.8796 52.1924C93.0094 54.1635 89.9729 59.377 89.9729 64.0603V74.3534C89.9729 77.045 91.0074 79.1138 92.8086 80.035L97.3942 82.3716C98.0324 82.6958 98.7323 82.8605 99.4837 82.8605C100.425 82.8605 101.403 82.6032 102.397 82.0988L110.857 77.7912C114.728 75.8201 117.764 70.6067 117.764 65.9233V55.6303C117.764 52.9386 116.73 50.8697 114.928 49.9485L110.343 47.6119C109.705 47.2877 109.005 47.123 108.253 47.123H108.259Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M99.4889 43.8658C98.8198 43.8658 98.1971 43.7216 97.631 43.4334L93.0454 41.0969C91.4242 40.2683 90.4927 38.3693 90.4927 35.8732V25.5801C90.4927 21.149 93.4623 16.0281 97.1163 14.1702L105.577 9.86263C106.498 9.3943 107.399 9.15234 108.259 9.15234C108.928 9.15234 109.55 9.29649 110.116 9.5847L114.702 11.9212C116.323 12.7498 117.255 14.6488 117.255 17.1449V27.438C117.255 31.8691 114.285 36.99 110.631 38.8479L102.17 43.1555C101.249 43.6238 100.348 43.8606 99.4889 43.8606V43.8658Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M108.259 9.67188C108.85 9.67188 109.396 9.80054 109.88 10.0476L114.465 12.3841C115.855 13.0943 116.74 14.767 116.74 17.1446V27.4377C116.74 31.699 113.899 36.6037 110.394 38.3895L101.933 42.6972C101.064 43.1398 100.24 43.3508 99.4837 43.3508C98.8918 43.3508 98.3463 43.2221 97.8625 42.975L93.277 40.6386C91.8874 39.9284 91.0022 38.2558 91.0022 35.8781V25.585C91.0022 21.3237 93.8431 16.419 97.3478 14.6332L105.809 10.3255C106.679 9.8829 107.502 9.67188 108.259 9.67188ZM108.259 8.64258C107.317 8.64258 106.339 8.89989 105.34 9.40425L96.8796 13.712C93.0094 15.6831 89.9729 20.8965 89.9729 25.5799V35.8729C89.9729 38.5646 91.0074 40.6334 92.8086 41.5546L97.3942 43.8911C98.0324 44.2154 98.7323 44.3801 99.4837 44.3801C100.425 44.3801 101.403 44.1227 102.402 43.6183L110.863 39.3108C114.733 37.3396 117.769 32.1262 117.769 27.4428V17.1498C117.769 14.4582 116.735 12.3892 114.934 11.468L110.348 9.13147C109.71 8.80724 109.01 8.64258 108.259 8.64258Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M68.4862 96.5089C67.8171 96.5089 67.1944 96.3649 66.6283 96.0767L62.0427 93.7401C60.4216 92.9116 59.4901 91.0124 59.4901 88.5163V78.2233C59.4901 73.7921 62.4596 68.6714 66.1136 66.8135L74.5745 62.5059C75.4957 62.0376 76.3964 61.8008 77.2559 61.8008C77.9249 61.8008 78.5476 61.9449 79.1138 62.2331L83.6993 64.5697C85.3205 65.3983 86.252 67.3024 86.252 69.7933V80.0864C86.252 84.5176 83.2824 89.6332 79.6284 91.4962L71.1675 95.8039C70.2463 96.2722 69.3456 96.5089 68.4862 96.5089Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M77.2559 62.3164C77.8477 62.3164 78.3933 62.4451 78.8771 62.6921L83.4626 65.0286C84.8521 65.7389 85.7374 67.4115 85.7374 69.7892V80.0822C85.7374 84.3436 82.8965 89.2482 79.3917 91.034L70.9308 95.3416C70.061 95.7842 69.2376 95.9952 68.481 95.9952C67.8892 95.9952 67.3436 95.8666 66.8599 95.6196L62.2744 93.283C60.8848 92.5728 59.9996 90.9002 59.9996 88.5225V78.2294C59.9996 73.9681 62.8404 69.0636 66.3452 67.2777L74.8061 62.97C75.6759 62.5274 76.4994 62.3164 77.2559 62.3164ZM77.2559 61.2871C76.3141 61.2871 75.3362 61.5444 74.3378 62.0488L65.8769 66.3565C62.0067 68.3276 58.9703 73.5409 58.9703 78.2243V88.5173C58.9703 91.209 60.0047 93.2779 61.806 94.1991L66.3916 96.5357C67.0298 96.8599 67.7297 97.0245 68.481 97.0245C69.4229 97.0245 70.4007 96.7672 71.394 96.2629L79.8549 91.9553C83.725 89.9842 86.7615 84.7707 86.7615 80.0874V69.7943C86.7615 67.1027 85.7271 65.0338 83.9258 64.1125L79.3402 61.776C78.702 61.4518 78.0021 61.2871 77.2507 61.2871H77.2559Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M68.4862 58.0297C67.8171 58.0297 67.1944 57.8857 66.6283 57.5975L62.0427 55.2609C60.4216 54.4323 59.4901 52.5333 59.4901 50.0372V39.7442C59.4901 35.313 62.4596 30.1973 66.1136 28.3343L74.5745 24.0267C75.4957 23.5584 76.3964 23.3164 77.2559 23.3164C77.9249 23.3164 78.5476 23.4606 79.1138 23.7488L83.6993 26.0853C85.3205 26.9139 86.252 28.8181 86.252 31.309V41.602C86.252 46.0332 83.2824 51.1488 79.6284 53.0118L71.1675 57.3195C70.2463 57.7879 69.3456 58.0245 68.4862 58.0245V58.0297Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M77.2559 23.8359C77.8477 23.8359 78.3933 23.9646 78.8771 24.2116L83.4626 26.5482C84.8521 27.2584 85.7374 28.931 85.7374 31.3087V41.6018C85.7374 45.8631 82.8965 50.7677 79.3917 52.5536L70.9308 56.8613C70.061 57.3039 69.2376 57.5148 68.481 57.5148C67.8892 57.5148 67.3436 57.3861 66.8599 57.1391L62.2744 54.8027C60.8848 54.0925 59.9996 52.4198 59.9996 50.0421V39.7491C59.9996 35.4878 62.8404 30.5831 66.3452 28.7973L74.8061 24.4896C75.6759 24.047 76.4994 23.8359 77.2559 23.8359ZM77.2559 22.8066C76.3141 22.8066 75.3362 23.064 74.3378 23.5683L65.8769 27.876C62.0067 29.8471 58.9703 35.0606 58.9703 39.7439V50.037C58.9703 52.7286 60.0047 54.7974 61.806 55.7186L66.3916 58.0552C67.0298 58.3794 67.7297 58.5441 68.481 58.5441C69.4229 58.5441 70.4007 58.2868 71.3991 57.7824L79.86 53.4748C83.7302 51.5037 86.7667 46.2902 86.7667 41.6069V31.3139C86.7667 28.6222 85.7322 26.5533 83.9309 25.6321L79.3454 23.2955C78.7072 22.9713 78.0073 22.8066 77.2559 22.8066Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M114.465 50.8651C113.364 50.3041 111.943 50.3505 110.394 51.143L101.933 55.4506C98.4287 57.2364 95.5878 62.1411 95.5878 66.4024V76.6955C95.5878 79.0732 96.473 80.7509 97.8626 81.456L93.277 79.1196C91.8875 78.4094 91.0023 76.7367 91.0023 74.3591V64.066C91.0023 59.8047 93.8431 54.9 97.3479 53.1142L105.809 48.8065C107.358 48.0191 108.778 47.9676 109.88 48.5285L114.465 50.8651Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M114.465 50.8645C115.855 51.5747 116.74 53.2473 116.74 55.625V65.9181C116.74 70.1794 113.899 75.084 110.394 76.8699L101.933 81.1776C100.384 81.965 98.9639 82.0164 97.8626 81.4554C96.473 80.7452 95.5878 79.0726 95.5878 76.6949V66.4018C95.5878 62.1405 98.4287 57.2358 101.933 55.45L110.394 51.1424C111.943 50.355 113.364 50.3035 114.465 50.8645Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M114.465 12.3846C113.364 11.8237 111.943 11.87 110.394 12.6626L101.933 16.9703C98.4287 18.7561 95.5878 23.6606 95.5878 27.922V38.215C95.5878 40.5927 96.473 42.2705 97.8626 42.9755L93.277 40.6391C91.8875 39.9289 91.0023 38.2563 91.0023 35.8786V25.5855C91.0023 21.3242 93.8431 16.4196 97.3479 14.6337L105.809 10.326C107.358 9.5386 108.778 9.48711 109.88 10.0481L114.465 12.3846Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M114.465 12.384C115.855 13.0942 116.74 14.7669 116.74 17.1446V27.4376C116.74 31.6989 113.899 36.6036 110.394 38.3894L101.933 42.6971C100.384 43.4845 98.9639 43.5359 97.8626 42.9749C96.473 42.2647 95.5878 40.5921 95.5878 38.2144V27.9213C95.5878 23.66 98.4287 18.7555 101.933 16.9697L110.394 12.662C111.943 11.8745 113.364 11.823 114.465 12.384Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M114.465 12.3846C113.364 11.8237 111.943 11.87 110.394 12.6626L101.933 16.9703C98.4287 18.7561 95.5878 23.6606 95.5878 27.922V38.215C95.5878 40.5927 96.473 42.2705 97.8626 42.9755L93.277 40.6391C91.8875 39.9289 91.0023 38.2563 91.0023 35.8786V25.5855C91.0023 21.3242 93.8431 16.4196 97.3479 14.6337L105.809 10.326C107.358 9.5386 108.778 9.48711 109.88 10.0481L114.465 12.3846Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M114.465 12.384C115.855 13.0942 116.74 14.7669 116.74 17.1446V27.4376C116.74 31.6989 113.899 36.6036 110.394 38.3894L101.933 42.6971C100.384 43.4845 98.9639 43.5359 97.8626 42.9749C96.473 42.2647 95.5878 40.5921 95.5878 38.2144V27.9213C95.5878 23.66 98.4287 18.7555 101.933 16.9697L110.394 12.662C111.943 11.8745 113.364 11.823 114.465 12.384Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M83.4626 65.0292C82.3612 64.4682 80.9408 64.5145 79.3917 65.3071L70.9308 69.6147C67.426 71.4005 64.5851 76.3052 64.5851 80.5665V90.8595C64.5851 93.2372 65.4703 94.915 66.8599 95.6201L62.2744 93.2835C60.8848 92.5733 59.9996 90.9007 59.9996 88.523V78.2299C59.9996 73.9686 62.8404 69.0641 66.3452 67.2782L74.8061 62.9705C76.3552 62.1831 77.7757 62.1316 78.8771 62.6926L83.4626 65.0292Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M83.4626 65.0285C84.8521 65.7388 85.7374 67.4114 85.7374 69.7891V80.0821C85.7374 84.3435 82.8965 89.2481 79.3917 91.034L70.9308 95.3415C69.3817 96.129 67.9612 96.1804 66.8599 95.6195C65.4703 94.9092 64.5851 93.2366 64.5851 90.8589V80.5659C64.5851 76.3046 67.426 71.3999 70.9308 69.6141L79.3917 65.3065C80.9408 64.5191 82.3612 64.4676 83.4626 65.0285Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M83.4626 26.5487C82.3612 25.9877 80.9408 26.0341 79.3917 26.8266L70.9308 31.1342C67.426 32.92 64.5851 37.8247 64.5851 42.086V52.3791C64.5851 54.7568 65.4703 56.4345 66.8599 57.1396L62.2744 54.8032C60.8848 54.093 59.9996 52.4203 59.9996 50.0426V39.7496C59.9996 35.4883 62.8404 30.5836 66.3452 28.7978L74.8061 24.4901C76.3552 23.7027 77.7757 23.6512 78.8771 24.2121L83.4626 26.5487Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M83.4626 26.5481C84.8521 27.2583 85.7374 28.9309 85.7374 31.3086V41.6017C85.7374 45.863 82.8965 50.7676 79.3917 52.5535L70.9308 56.8612C69.3817 57.6486 67.9612 57.7 66.8599 57.139C65.4703 56.4288 64.5851 54.7562 64.5851 52.3785V42.0854C64.5851 37.8241 67.426 32.9194 70.9308 31.1336L79.3917 26.826C80.9408 26.0386 82.3612 25.9871 83.4626 26.5481Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M83.4626 26.5487C82.3612 25.9877 80.9408 26.0341 79.3917 26.8266L70.9308 31.1342C67.426 32.92 64.5851 37.8247 64.5851 42.086V52.3791C64.5851 54.7568 65.4703 56.4345 66.8599 57.1396L62.2744 54.8032C60.8848 54.093 59.9996 52.4203 59.9996 50.0426V39.7496C59.9996 35.4883 62.8404 30.5836 66.3452 28.7978L74.8061 24.4901C76.3552 23.7027 77.7757 23.6512 78.8771 24.2121L83.4626 26.5487Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M83.4626 26.5481C84.8521 27.2583 85.7374 28.9309 85.7374 31.3086V41.6017C85.7374 45.863 82.8965 50.7676 79.3917 52.5535L70.9308 56.8612C69.3817 57.6486 67.9612 57.7 66.8599 57.139C65.4703 56.4288 64.5851 54.7562 64.5851 52.3785V42.0854C64.5851 37.8241 67.426 32.9194 70.9308 31.1336L79.3917 26.826C80.9408 26.0386 82.3612 25.9871 83.4626 26.5481Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.6113 65.9744C4.196 65.2539 3.29536 63.5503 3.29536 61.1263C3.29536 56.7878 6.1877 51.7957 9.74909 49.9841L36.3515 36.4539C37.9263 35.651 39.3673 35.5995 40.4893 36.1708L38.1939 35.0025C37.072 34.4312 35.631 34.4827 34.0561 35.2856L7.45376 48.8158C3.88722 50.6326 1 55.6246 1 59.958C1 62.382 1.90064 64.0856 3.31594 64.8061L5.6113 65.9744Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -38,281 +202,119 @@ export const DashboardVerticalStackIllustration = ({ className }: TIllustrationA
         strokeLinejoin="round"
       />
       <path
-        d="M15.0806 111.922C15.0806 109.976 16.537 108.036 19.4448 106.554L98.1197 66.4674C103.94 63.503 113.374 63.503 119.195 66.4674L156.636 85.5456C159.549 87.0278 161 88.9732 161 90.9186C161 92.864 159.544 94.8042 156.636 96.2864L77.9608 136.373C72.1401 139.337 62.7065 139.337 56.8858 136.373L19.4448 117.295C16.5319 115.812 15.0806 113.867 15.0806 111.922Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.61129 65.9741C6.73323 66.5454 8.17424 66.4939 9.74908 65.691L36.3515 52.1608C39.918 50.344 42.8052 45.352 42.8052 41.0186C42.8052 38.5946 41.9046 36.891 40.4893 36.1705C39.3673 35.5992 37.9263 35.6507 36.3515 36.4536L9.74908 49.9838C6.18254 51.8005 3.29535 56.7926 3.29535 61.126C3.29535 63.55 4.19599 65.2536 5.61129 65.9741Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M15.0806 92.2979C15.0806 94.2433 16.537 96.1835 19.4448 97.6709L56.8858 116.749C62.7065 119.713 72.1401 119.713 77.9608 116.749L156.636 76.6628C159.544 75.1806 161 73.2403 161 71.2949V77.5068C161 79.4522 159.544 81.3924 156.636 82.8746L77.9608 122.961C72.1401 125.925 62.7065 125.925 56.8858 122.961L19.4448 103.883C16.5319 102.401 15.0806 100.455 15.0806 98.5098V92.2979Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M15.0806 92.2985C15.0806 90.3532 16.537 88.4129 19.4448 86.9308L98.1197 46.8444C103.94 43.88 113.374 43.88 119.195 46.8444L156.636 65.9226C159.549 67.4048 161 69.3502 161 71.2955C161 73.2409 159.544 75.1813 156.636 76.6635L77.9608 116.75C72.1401 119.714 62.7065 119.714 56.8858 116.75L19.4448 97.6715C16.5319 96.1893 15.0806 94.2439 15.0806 92.2985Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M99.4889 82.3507C98.8198 82.3507 98.1971 82.2067 97.631 81.9185L93.0454 79.5819C91.4242 78.7534 90.4927 76.8543 90.4927 74.3583V64.0652C90.4927 59.6341 93.4623 54.5132 97.1163 52.6553L105.577 48.3477C106.498 47.8794 107.399 47.6426 108.259 47.6426C108.928 47.6426 109.55 47.7867 110.116 48.0749L114.702 50.4115C116.323 51.2401 117.255 53.1391 117.255 55.6351V65.9282C117.255 70.3594 114.285 75.475 110.631 77.338L102.17 81.6457C101.249 82.114 100.348 82.3507 99.4889 82.3507Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M108.259 48.1524C108.85 48.1524 109.396 48.281 109.88 48.528L114.465 50.8646C115.855 51.5748 116.74 53.2474 116.74 55.6251V65.9182C116.74 70.1795 113.899 75.0841 110.394 76.87L101.933 81.1777C101.064 81.6203 100.24 81.8312 99.4837 81.8312C98.8918 81.8312 98.3463 81.7025 97.8625 81.4555L93.277 79.1191C91.8874 78.4089 91.0022 76.7362 91.0022 74.3585V64.0655C91.0022 59.8042 93.8431 54.8995 97.3478 53.1137L105.809 48.806C106.679 48.3634 107.502 48.1524 108.259 48.1524ZM108.259 47.123C107.317 47.123 106.339 47.3804 105.34 47.8847L96.8796 52.1924C93.0094 54.1635 89.9729 59.377 89.9729 64.0603V74.3534C89.9729 77.045 91.0074 79.1138 92.8086 80.035L97.3942 82.3716C98.0324 82.6958 98.7323 82.8605 99.4837 82.8605C100.425 82.8605 101.403 82.6032 102.397 82.0988L110.857 77.7912C114.728 75.8201 117.764 70.6067 117.764 65.9233V55.6303C117.764 52.9386 116.73 50.8697 114.928 49.9485L110.343 47.6119C109.705 47.2877 109.005 47.123 108.253 47.123H108.259Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M99.4889 43.8658C98.8198 43.8658 98.1971 43.7216 97.631 43.4334L93.0454 41.0969C91.4242 40.2683 90.4927 38.3693 90.4927 35.8732V25.5801C90.4927 21.149 93.4623 16.0281 97.1163 14.1702L105.577 9.86263C106.498 9.3943 107.399 9.15234 108.259 9.15234C108.928 9.15234 109.55 9.29649 110.116 9.5847L114.702 11.9212C116.323 12.7498 117.255 14.6488 117.255 17.1449V27.438C117.255 31.8691 114.285 36.99 110.631 38.8479L102.17 43.1555C101.249 43.6238 100.348 43.8606 99.4889 43.8606V43.8658Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M108.259 9.67188C108.85 9.67188 109.396 9.80054 109.88 10.0476L114.465 12.3841C115.855 13.0943 116.74 14.767 116.74 17.1446V27.4377C116.74 31.699 113.899 36.6037 110.394 38.3895L101.933 42.6972C101.064 43.1398 100.24 43.3508 99.4837 43.3508C98.8918 43.3508 98.3463 43.2221 97.8625 42.975L93.277 40.6386C91.8874 39.9284 91.0022 38.2558 91.0022 35.8781V25.585C91.0022 21.3237 93.8431 16.419 97.3478 14.6332L105.809 10.3255C106.679 9.8829 107.502 9.67188 108.259 9.67188ZM108.259 8.64258C107.317 8.64258 106.339 8.89989 105.34 9.40425L96.8796 13.712C93.0094 15.6831 89.9729 20.8965 89.9729 25.5799V35.8729C89.9729 38.5646 91.0074 40.6334 92.8086 41.5546L97.3942 43.8911C98.0324 44.2154 98.7323 44.3801 99.4837 44.3801C100.425 44.3801 101.403 44.1227 102.402 43.6183L110.863 39.3108C114.733 37.3396 117.769 32.1262 117.769 27.4428V17.1498C117.769 14.4582 116.735 12.3892 114.934 11.468L110.348 9.13147C109.71 8.80724 109.01 8.64258 108.259 8.64258Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M68.4862 96.5089C67.8171 96.5089 67.1944 96.3649 66.6283 96.0767L62.0427 93.7401C60.4216 92.9116 59.4901 91.0124 59.4901 88.5163V78.2233C59.4901 73.7921 62.4596 68.6714 66.1136 66.8135L74.5745 62.5059C75.4957 62.0376 76.3964 61.8008 77.2559 61.8008C77.9249 61.8008 78.5476 61.9449 79.1138 62.2331L83.6993 64.5697C85.3205 65.3983 86.252 67.3024 86.252 69.7933V80.0864C86.252 84.5176 83.2824 89.6332 79.6284 91.4962L71.1675 95.8039C70.2463 96.2722 69.3456 96.5089 68.4862 96.5089Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M77.2559 62.3164C77.8477 62.3164 78.3933 62.4451 78.8771 62.6921L83.4626 65.0286C84.8521 65.7389 85.7374 67.4115 85.7374 69.7892V80.0822C85.7374 84.3436 82.8965 89.2482 79.3917 91.034L70.9308 95.3416C70.061 95.7842 69.2376 95.9952 68.481 95.9952C67.8892 95.9952 67.3436 95.8666 66.8599 95.6196L62.2744 93.283C60.8848 92.5728 59.9996 90.9002 59.9996 88.5225V78.2294C59.9996 73.9681 62.8404 69.0636 66.3452 67.2777L74.8061 62.97C75.6759 62.5274 76.4994 62.3164 77.2559 62.3164ZM77.2559 61.2871C76.3141 61.2871 75.3362 61.5444 74.3378 62.0488L65.8769 66.3565C62.0067 68.3276 58.9703 73.5409 58.9703 78.2243V88.5173C58.9703 91.209 60.0047 93.2779 61.806 94.1991L66.3916 96.5357C67.0298 96.8599 67.7297 97.0245 68.481 97.0245C69.4229 97.0245 70.4007 96.7672 71.394 96.2629L79.8549 91.9553C83.725 89.9842 86.7615 84.7707 86.7615 80.0874V69.7943C86.7615 67.1027 85.7271 65.0338 83.9258 64.1125L79.3402 61.776C78.702 61.4518 78.0021 61.2871 77.2507 61.2871H77.2559Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M68.4862 58.0297C67.8171 58.0297 67.1944 57.8857 66.6283 57.5975L62.0427 55.2609C60.4216 54.4323 59.4901 52.5333 59.4901 50.0372V39.7442C59.4901 35.313 62.4596 30.1973 66.1136 28.3343L74.5745 24.0267C75.4957 23.5584 76.3964 23.3164 77.2559 23.3164C77.9249 23.3164 78.5476 23.4606 79.1138 23.7488L83.6993 26.0853C85.3205 26.9139 86.252 28.8181 86.252 31.309V41.602C86.252 46.0332 83.2824 51.1488 79.6284 53.0118L71.1675 57.3195C70.2463 57.7879 69.3456 58.0245 68.4862 58.0245V58.0297Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M77.2559 23.8359C77.8477 23.8359 78.3933 23.9646 78.8771 24.2116L83.4626 26.5482C84.8521 27.2584 85.7374 28.931 85.7374 31.3087V41.6018C85.7374 45.8631 82.8965 50.7677 79.3917 52.5536L70.9308 56.8613C70.061 57.3039 69.2376 57.5148 68.481 57.5148C67.8892 57.5148 67.3436 57.3861 66.8599 57.1391L62.2744 54.8027C60.8848 54.0925 59.9996 52.4198 59.9996 50.0421V39.7491C59.9996 35.4878 62.8404 30.5831 66.3452 28.7973L74.8061 24.4896C75.6759 24.047 76.4994 23.8359 77.2559 23.8359ZM77.2559 22.8066C76.3141 22.8066 75.3362 23.064 74.3378 23.5683L65.8769 27.876C62.0067 29.8471 58.9703 35.0606 58.9703 39.7439V50.037C58.9703 52.7286 60.0047 54.7974 61.806 55.7186L66.3916 58.0552C67.0298 58.3794 67.7297 58.5441 68.481 58.5441C69.4229 58.5441 70.4007 58.2868 71.3991 57.7824L79.86 53.4748C83.7302 51.5037 86.7667 46.2902 86.7667 41.6069V31.3139C86.7667 28.6222 85.7322 26.5533 83.9309 25.6321L79.3454 23.2955C78.7072 22.9713 78.0073 22.8066 77.2559 22.8066Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M114.465 50.8651C113.364 50.3041 111.943 50.3505 110.394 51.143L101.933 55.4506C98.4287 57.2364 95.5878 62.1411 95.5878 66.4024V76.6955C95.5878 79.0732 96.473 80.7509 97.8626 81.456L93.277 79.1196C91.8875 78.4094 91.0023 76.7367 91.0023 74.3591V64.066C91.0023 59.8047 93.8431 54.9 97.3479 53.1142L105.809 48.8065C107.358 48.0191 108.778 47.9676 109.88 48.5285L114.465 50.8651Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M114.465 50.8645C115.855 51.5747 116.74 53.2473 116.74 55.625V65.9181C116.74 70.1794 113.899 75.084 110.394 76.8699L101.933 81.1776C100.384 81.965 98.9639 82.0164 97.8626 81.4554C96.473 80.7452 95.5878 79.0726 95.5878 76.6949V66.4018C95.5878 62.1405 98.4287 57.2358 101.933 55.45L110.394 51.1424C111.943 50.355 113.364 50.3035 114.465 50.8645Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M114.465 12.3846C113.364 11.8237 111.943 11.87 110.394 12.6626L101.933 16.9703C98.4287 18.7561 95.5878 23.6606 95.5878 27.922V38.215C95.5878 40.5927 96.473 42.2705 97.8626 42.9755L93.277 40.6391C91.8875 39.9289 91.0023 38.2563 91.0023 35.8786V25.5855C91.0023 21.3242 93.8431 16.4196 97.3479 14.6337L105.809 10.326C107.358 9.5386 108.778 9.48711 109.88 10.0481L114.465 12.3846Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M114.465 12.384C115.855 13.0942 116.74 14.7669 116.74 17.1446V27.4376C116.74 31.6989 113.899 36.6036 110.394 38.3894L101.933 42.6971C100.384 43.4845 98.9639 43.5359 97.8626 42.9749C96.473 42.2647 95.5878 40.5921 95.5878 38.2144V27.9213C95.5878 23.66 98.4287 18.7555 101.933 16.9697L110.394 12.662C111.943 11.8745 113.364 11.823 114.465 12.384Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M114.465 12.3846C113.364 11.8237 111.943 11.87 110.394 12.6626L101.933 16.9703C98.4287 18.7561 95.5878 23.6606 95.5878 27.922V38.215C95.5878 40.5927 96.473 42.2705 97.8626 42.9755L93.277 40.6391C91.8875 39.9289 91.0023 38.2563 91.0023 35.8786V25.5855C91.0023 21.3242 93.8431 16.4196 97.3479 14.6337L105.809 10.326C107.358 9.5386 108.778 9.48711 109.88 10.0481L114.465 12.3846Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M114.465 12.384C115.855 13.0942 116.74 14.7669 116.74 17.1446V27.4376C116.74 31.6989 113.899 36.6036 110.394 38.3894L101.933 42.6971C100.384 43.4845 98.9639 43.5359 97.8626 42.9749C96.473 42.2647 95.5878 40.5921 95.5878 38.2144V27.9213C95.5878 23.66 98.4287 18.7555 101.933 16.9697L110.394 12.662C111.943 11.8745 113.364 11.823 114.465 12.384Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M83.4626 65.0292C82.3612 64.4682 80.9408 64.5145 79.3917 65.3071L70.9308 69.6147C67.426 71.4005 64.5851 76.3052 64.5851 80.5665V90.8595C64.5851 93.2372 65.4703 94.915 66.8599 95.6201L62.2744 93.2835C60.8848 92.5733 59.9996 90.9007 59.9996 88.523V78.2299C59.9996 73.9686 62.8404 69.0641 66.3452 67.2782L74.8061 62.9705C76.3552 62.1831 77.7757 62.1316 78.8771 62.6926L83.4626 65.0292Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M83.4626 65.0285C84.8521 65.7388 85.7374 67.4114 85.7374 69.7891V80.0821C85.7374 84.3435 82.8965 89.2481 79.3917 91.034L70.9308 95.3415C69.3817 96.129 67.9612 96.1804 66.8599 95.6195C65.4703 94.9092 64.5851 93.2366 64.5851 90.8589V80.5659C64.5851 76.3046 67.426 71.3999 70.9308 69.6141L79.3917 65.3065C80.9408 64.5191 82.3612 64.4676 83.4626 65.0285Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M83.4626 26.5487C82.3612 25.9877 80.9408 26.0341 79.3917 26.8266L70.9308 31.1342C67.426 32.92 64.5851 37.8247 64.5851 42.086V52.3791C64.5851 54.7568 65.4703 56.4345 66.8599 57.1396L62.2744 54.8032C60.8848 54.093 59.9996 52.4203 59.9996 50.0426V39.7496C59.9996 35.4883 62.8404 30.5836 66.3452 28.7978L74.8061 24.4901C76.3552 23.7027 77.7757 23.6512 78.8771 24.2121L83.4626 26.5487Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M83.4626 26.5481C84.8521 27.2583 85.7374 28.9309 85.7374 31.3086V41.6017C85.7374 45.863 82.8965 50.7676 79.3917 52.5535L70.9308 56.8612C69.3817 57.6486 67.9612 57.7 66.8599 57.139C65.4703 56.4288 64.5851 54.7562 64.5851 52.3785V42.0854C64.5851 37.8241 67.426 32.9194 70.9308 31.1336L79.3917 26.826C80.9408 26.0386 82.3612 25.9871 83.4626 26.5481Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M83.4626 26.5487C82.3612 25.9877 80.9408 26.0341 79.3917 26.8266L70.9308 31.1342C67.426 32.92 64.5851 37.8247 64.5851 42.086V52.3791C64.5851 54.7568 65.4703 56.4345 66.8599 57.1396L62.2744 54.8032C60.8848 54.093 59.9996 52.4203 59.9996 50.0426V39.7496C59.9996 35.4883 62.8404 30.5836 66.3452 28.7978L74.8061 24.4901C76.3552 23.7027 77.7757 23.6512 78.8771 24.2121L83.4626 26.5487Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M83.4626 26.5481C84.8521 27.2583 85.7374 28.9309 85.7374 31.3086V41.6017C85.7374 45.863 82.8965 50.7676 79.3917 52.5535L70.9308 56.8612C69.3817 57.6486 67.9612 57.7 66.8599 57.139C65.4703 56.4288 64.5851 54.7562 64.5851 52.3785V42.0854C64.5851 37.8241 67.426 32.9194 70.9308 31.1336L79.3917 26.826C80.9408 26.0386 82.3612 25.9871 83.4626 26.5481Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.6113 65.9744C4.196 65.2539 3.29536 63.5503 3.29536 61.1263C3.29536 56.7878 6.1877 51.7957 9.74909 49.9841L36.3515 36.4539C37.9263 35.651 39.3673 35.5995 40.4893 36.1708L38.1939 35.0025C37.072 34.4312 35.631 34.4827 34.0561 35.2856L7.45376 48.8158C3.88722 50.6326 1 55.6246 1 59.958C1 62.382 1.90064 64.0856 3.31594 64.8061L5.6113 65.9744Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.61129 65.9741C6.73323 66.5454 8.17424 66.4939 9.74908 65.691L36.3515 52.1608C39.918 50.344 42.8052 45.352 42.8052 41.0186C42.8052 38.5946 41.9046 36.891 40.4893 36.1705C39.3673 35.5992 37.9263 35.6507 36.3515 36.4536L9.74908 49.9838C6.18254 51.8005 3.29535 56.7926 3.29535 61.126C3.29535 63.55 4.19599 65.2536 5.61129 65.9741Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M13.4083 56.0933C13.0634 56.2683 12.7804 56.0728 12.7804 55.6508V52.5938C12.7804 52.3777 12.8525 52.1357 12.9811 51.9299C13.1046 51.7292 13.2693 51.5799 13.4391 51.513C15.0654 50.88 16.3675 51.8012 16.5322 53.7003C16.5476 53.8958 16.4962 54.1223 16.383 54.3333C16.2646 54.5494 16.0999 54.7244 15.9249 54.8119L13.4134 56.0933H13.4083ZM13.4083 52.2901V55.3265L15.9043 54.0553C15.7602 52.5423 14.7155 51.8012 13.4083 52.2901Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M13.0892 60.071C12.6414 60.2975 12.1886 60.4261 11.746 60.421C10.8968 60.421 10.238 59.9371 9.88807 59.0725C9.5381 58.2079 9.54839 57.0602 9.90864 55.8456C10.2535 54.6722 10.8916 53.5607 11.7099 52.7115C11.8695 52.5468 12.0547 52.5416 12.1216 52.696C12.1885 52.8504 12.1217 53.118 11.957 53.2827C11.2931 53.9775 10.7681 54.8884 10.4851 55.8456C10.1917 56.8389 10.1866 57.7808 10.4696 58.4859C10.7527 59.191 11.2931 59.582 11.9879 59.5872C13.4237 59.5923 15.086 57.9249 15.6933 55.8714C15.7602 55.645 15.9455 55.4597 16.1051 55.4597C16.2646 55.4597 16.3418 55.645 16.2697 55.8766C15.7139 57.7602 14.4324 59.3814 13.084 60.0659L13.0892 60.071Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M23.444 50.0725C23.269 50.16 23.1249 50.0622 23.1249 49.846V48.3021C23.1249 48.0911 23.269 47.844 23.444 47.7565C23.6189 47.669 23.763 47.7669 23.763 47.9831V49.527C23.763 49.738 23.6189 49.985 23.444 50.0725Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M23.7579 52.2282L23.1249 52.5524C22.7749 52.7325 22.4919 52.5318 22.4919 52.1046V50.5607C22.4919 50.1335 22.7749 49.6446 23.1249 49.4645L23.7579 49.1403C24.1079 48.9602 24.3909 49.1609 24.3909 49.588V51.132C24.3909 51.5591 24.1079 52.0481 23.7579 52.2282ZM23.1249 50.2365V51.7804L23.7579 51.4563V49.9123L23.1249 50.2365Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M23.444 53.1599C23.269 53.2473 23.1249 53.1496 23.1249 52.9334V52.1615C23.1249 51.9505 23.269 51.7034 23.444 51.6159C23.6189 51.5284 23.763 51.6263 23.763 51.8424V52.6144C23.763 52.8254 23.6189 53.0724 23.444 53.1599Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M25.9761 47.2419C25.8011 47.3294 25.657 47.2316 25.657 47.0155V46.2435C25.657 46.0325 25.8011 45.7854 25.9761 45.6979C26.151 45.6104 26.2951 45.7083 26.2951 45.9245V46.6965C26.2951 46.9075 26.151 47.1544 25.9761 47.2419Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M26.2951 50.165L25.6621 50.4892C25.3122 50.6693 25.0291 50.4686 25.0291 50.0415V47.7306C25.0291 47.3034 25.3122 46.8146 25.6621 46.6344L26.2951 46.3103C26.6451 46.1301 26.9282 46.3308 26.9282 46.7579V49.0687C26.9282 49.4959 26.6451 49.9849 26.2951 50.165ZM25.6621 47.4013V49.712L26.2951 49.3879V47.0771L25.6621 47.4013Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M25.9761 51.4833C25.8011 51.5708 25.657 51.4731 25.657 51.2569V50.099C25.657 49.888 25.8011 49.6409 25.9761 49.5534C26.151 49.4659 26.2951 49.5638 26.2951 49.7799V50.9379C26.2951 51.1489 26.151 51.3959 25.9761 51.4833Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M27.2421 52.7632L22.1728 55.3468C21.6479 55.6144 21.2207 55.3109 21.2207 54.6727V48.5071C21.2207 48.296 21.3648 48.0491 21.5398 47.9616C21.7148 47.8741 21.8589 47.9719 21.8589 48.188V54.3536C21.8589 54.5646 22.003 54.6675 22.1779 54.58L27.2473 51.9964C27.4222 51.9089 27.5663 52.0068 27.5663 52.223C27.5663 52.4391 27.4222 52.6809 27.2473 52.7684L27.2421 52.7632Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M36.6139 48.178L31.8585 50.602C31.3696 50.8541 30.9682 50.5711 30.9682 49.9741V44.1894C30.9682 43.9887 31.1021 43.7622 31.2667 43.6748C31.4314 43.5873 31.5652 43.685 31.5652 43.8857V49.6704C31.5652 49.8711 31.699 49.9638 31.8637 49.8815L36.6191 47.4575C36.7838 47.3752 36.9176 47.4677 36.9176 47.6685C36.9176 47.8692 36.7838 48.0956 36.6191 48.1831L36.6139 48.178Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M32.4556 48.4928C32.4556 48.4928 32.4092 48.5133 32.3835 48.5184C32.224 48.5493 32.1262 48.4052 32.1674 48.1891L32.2034 47.9883C32.3835 46.9796 32.7232 45.1012 33.6444 44.6329C34.1025 44.4013 34.3238 44.6945 34.4833 44.9055C34.6326 45.1011 34.7046 45.1732 34.8281 45.1115C35.2758 44.885 35.8369 43.2638 36.0273 42.2448C36.0684 42.0287 36.228 41.8332 36.3875 41.7971C36.547 41.7663 36.6449 41.9103 36.6037 42.1265C36.5985 42.1573 35.9964 45.2401 34.8281 45.8319C34.3701 46.0635 34.1487 45.7702 33.9892 45.5591C33.84 45.3636 33.7679 45.2916 33.6444 45.3533C33.1915 45.5849 32.893 47.242 32.7798 47.8648L32.7438 48.0707C32.7078 48.2508 32.5894 48.4259 32.4556 48.4928Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M144.032 28.6205C145.252 27.9978 146.827 28.0493 148.545 28.9242C152.431 30.9056 155.581 36.3403 155.581 41.0648C155.581 43.6998 154.603 45.5628 153.059 46.3451L155.555 45.0739C157.094 44.2865 158.077 42.4286 158.077 39.7936C158.077 35.0691 154.927 29.6293 151.042 27.653C149.323 26.7781 147.753 26.7266 146.528 27.3493L144.032 28.6205Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M144.032 28.6208C142.493 29.4082 141.51 31.2661 141.51 33.9012C141.51 38.6257 144.66 44.0656 148.546 46.0419C150.264 46.9168 151.834 46.9682 153.059 46.3454C154.598 45.558 155.581 43.7001 155.581 41.0651C155.581 36.3406 152.431 30.9008 148.546 28.9245C146.827 28.0496 145.257 27.9981 144.032 28.6208Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M144.773 36.3409C144.773 38.5899 146.271 41.1786 148.123 42.1204C149.976 43.0622 151.474 42.002 151.474 39.753C151.474 37.5039 149.976 34.9152 148.123 33.9734C146.276 33.0316 144.773 34.0919 144.773 36.3409ZM148.123 43.0262C145.864 41.8734 144.032 38.7083 144.032 35.96C144.032 33.2118 145.864 31.9148 148.123 33.0625C150.383 34.2102 152.215 37.3805 152.215 40.1288C152.215 42.877 150.383 44.1739 148.123 43.0262Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M146.26 37.0973C146.26 38.3479 147.094 39.7838 148.118 40.3087C149.148 40.8336 149.981 40.2418 149.981 38.9912C149.981 37.7406 149.148 36.3047 148.118 35.7797C147.089 35.2548 146.26 35.8467 146.26 37.0973ZM148.123 41.2145C146.682 40.4837 145.519 38.4663 145.519 36.7164C145.519 34.9666 146.688 34.1431 148.123 34.8739C149.559 35.6047 150.728 37.6222 150.728 39.372C150.728 41.1218 149.559 41.9453 148.123 41.2145Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M48.0959 2.1161C46.9739 1.54483 45.5329 1.59118 43.9529 2.39918C40.3863 4.2159 37.4992 9.20798 37.4992 13.5414C37.4992 15.9602 38.3998 17.669 39.8151 18.3895L37.5197 17.2212C36.1044 16.5007 35.2038 14.792 35.2038 12.3731C35.2038 8.03457 38.0962 3.04249 41.6576 1.23091C43.2324 0.428053 44.6786 0.376562 45.8005 0.947826L48.0959 2.1161Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M48.0959 2.1158C49.5112 2.83631 50.4118 4.54492 50.4118 6.96378C50.4118 11.3023 47.5195 16.2945 43.9581 18.1061C42.3832 18.9089 40.9371 18.9604 39.8151 18.3892C38.3998 17.6687 37.4992 15.9599 37.4992 13.5411C37.4992 9.20254 40.3915 4.21046 43.9529 2.39888C45.5277 1.59602 46.9739 1.54453 48.0959 2.1158Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M47.5915 9.28574C47.3908 9.38867 47.2262 9.27544 47.2262 9.02841V6.81538L45.4043 7.74178C45.2035 7.84471 45.0389 7.73149 45.0389 7.48445C45.0389 7.23742 45.2035 6.95952 45.4043 6.85659L47.5864 5.74499C47.7871 5.64206 47.9518 5.75528 47.9518 6.00231V8.65787C47.9518 8.90491 47.7871 9.18281 47.5864 9.28574H47.5915Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M40.3144 14.7678C40.2217 14.8141 40.1291 14.8193 40.0571 14.7678C39.9129 14.6649 39.9129 14.387 40.0571 14.14L42.4244 10.0587C42.5685 9.81164 42.795 9.69842 42.9391 9.7962L44.5037 10.9028L47.3394 6.00843C47.4835 5.76139 47.7099 5.64817 47.854 5.74595C47.9982 5.84888 47.9982 6.12678 47.854 6.37381L44.761 11.7158C44.6169 11.9629 44.3904 12.0761 44.2463 11.9783L42.6818 10.8719L40.5717 14.5105C40.4997 14.634 40.407 14.7215 40.3144 14.773V14.7678Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M13.4083 56.0933C13.0634 56.2683 12.7804 56.0728 12.7804 55.6508V52.5938C12.7804 52.3777 12.8525 52.1357 12.9811 51.9299C13.1046 51.7292 13.2693 51.5799 13.4391 51.513C15.0654 50.88 16.3675 51.8012 16.5322 53.7003C16.5476 53.8958 16.4962 54.1223 16.383 54.3333C16.2646 54.5494 16.0999 54.7244 15.9249 54.8119L13.4134 56.0933H13.4083ZM13.4083 52.2901V55.3265L15.9043 54.0553C15.7602 52.5423 14.7155 51.8012 13.4083 52.2901Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M13.0892 60.071C12.6414 60.2975 12.1886 60.4261 11.746 60.421C10.8968 60.421 10.238 59.9371 9.88807 59.0725C9.5381 58.2079 9.54839 57.0602 9.90864 55.8456C10.2535 54.6722 10.8916 53.5607 11.7099 52.7115C11.8695 52.5468 12.0547 52.5416 12.1216 52.696C12.1885 52.8504 12.1217 53.118 11.957 53.2827C11.2931 53.9775 10.7681 54.8884 10.4851 55.8456C10.1917 56.8389 10.1866 57.7808 10.4696 58.4859C10.7527 59.191 11.2931 59.582 11.9879 59.5872C13.4237 59.5923 15.086 57.9249 15.6933 55.8714C15.7602 55.645 15.9455 55.4597 16.1051 55.4597C16.2646 55.4597 16.3418 55.645 16.2697 55.8766C15.7139 57.7602 14.4324 59.3814 13.084 60.0659L13.0892 60.071Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M23.444 50.0725C23.269 50.16 23.1249 50.0622 23.1249 49.846V48.3021C23.1249 48.0911 23.269 47.844 23.444 47.7565C23.6189 47.669 23.763 47.7669 23.763 47.9831V49.527C23.763 49.738 23.6189 49.985 23.444 50.0725Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M23.7579 52.2282L23.1249 52.5524C22.7749 52.7325 22.4919 52.5318 22.4919 52.1046V50.5607C22.4919 50.1335 22.7749 49.6446 23.1249 49.4645L23.7579 49.1403C24.1079 48.9602 24.3909 49.1609 24.3909 49.588V51.132C24.3909 51.5591 24.1079 52.0481 23.7579 52.2282ZM23.1249 50.2365V51.7804L23.7579 51.4563V49.9123L23.1249 50.2365Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M23.444 53.1599C23.269 53.2473 23.1249 53.1496 23.1249 52.9334V52.1615C23.1249 51.9505 23.269 51.7034 23.444 51.6159C23.6189 51.5284 23.763 51.6263 23.763 51.8424V52.6144C23.763 52.8254 23.6189 53.0724 23.444 53.1599Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M25.9761 47.2419C25.8011 47.3294 25.657 47.2316 25.657 47.0155V46.2435C25.657 46.0325 25.8011 45.7854 25.9761 45.6979C26.151 45.6104 26.2951 45.7083 26.2951 45.9245V46.6965C26.2951 46.9075 26.151 47.1544 25.9761 47.2419Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M26.2951 50.165L25.6621 50.4892C25.3122 50.6693 25.0291 50.4686 25.0291 50.0415V47.7306C25.0291 47.3034 25.3122 46.8146 25.6621 46.6344L26.2951 46.3103C26.6451 46.1301 26.9282 46.3308 26.9282 46.7579V49.0687C26.9282 49.4959 26.6451 49.9849 26.2951 50.165ZM25.6621 47.4013V49.712L26.2951 49.3879V47.0771L25.6621 47.4013Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M25.9761 51.4833C25.8011 51.5708 25.657 51.4731 25.657 51.2569V50.099C25.657 49.888 25.8011 49.6409 25.9761 49.5534C26.151 49.4659 26.2951 49.5638 26.2951 49.7799V50.9379C26.2951 51.1489 26.151 51.3959 25.9761 51.4833Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M27.2421 52.7632L22.1728 55.3468C21.6479 55.6144 21.2207 55.3109 21.2207 54.6727V48.5071C21.2207 48.296 21.3648 48.0491 21.5398 47.9616C21.7148 47.8741 21.8589 47.9719 21.8589 48.188V54.3536C21.8589 54.5646 22.003 54.6675 22.1779 54.58L27.2473 51.9964C27.4222 51.9089 27.5663 52.0068 27.5663 52.223C27.5663 52.4391 27.4222 52.6809 27.2473 52.7684L27.2421 52.7632Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M36.6139 48.178L31.8585 50.602C31.3696 50.8541 30.9682 50.5711 30.9682 49.9741V44.1894C30.9682 43.9887 31.1021 43.7622 31.2667 43.6748C31.4314 43.5873 31.5652 43.685 31.5652 43.8857V49.6704C31.5652 49.8711 31.699 49.9638 31.8637 49.8815L36.6191 47.4575C36.7838 47.3752 36.9176 47.4677 36.9176 47.6685C36.9176 47.8692 36.7838 48.0956 36.6191 48.1831L36.6139 48.178Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M32.4556 48.4928C32.4556 48.4928 32.4092 48.5133 32.3835 48.5184C32.224 48.5493 32.1262 48.4052 32.1674 48.1891L32.2034 47.9883C32.3835 46.9796 32.7232 45.1012 33.6444 44.6329C34.1025 44.4013 34.3238 44.6945 34.4833 44.9055C34.6326 45.1011 34.7046 45.1732 34.8281 45.1115C35.2758 44.885 35.8369 43.2638 36.0273 42.2448C36.0684 42.0287 36.228 41.8332 36.3875 41.7971C36.547 41.7663 36.6449 41.9103 36.6037 42.1265C36.5985 42.1573 35.9964 45.2401 34.8281 45.8319C34.3701 46.0635 34.1487 45.7702 33.9892 45.5591C33.84 45.3636 33.7679 45.2916 33.6444 45.3533C33.1915 45.5849 32.893 47.242 32.7798 47.8648L32.7438 48.0707C32.7078 48.2508 32.5894 48.4259 32.4556 48.4928Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M144.032 28.6205C145.252 27.9978 146.827 28.0493 148.545 28.9242C152.431 30.9056 155.581 36.3403 155.581 41.0648C155.581 43.6998 154.603 45.5628 153.059 46.3451L155.555 45.0739C157.094 44.2865 158.077 42.4286 158.077 39.7936C158.077 35.0691 154.927 29.6293 151.042 27.653C149.323 26.7781 147.753 26.7266 146.528 27.3493L144.032 28.6205Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M144.032 28.6208C142.493 29.4082 141.51 31.2661 141.51 33.9012C141.51 38.6257 144.66 44.0656 148.546 46.0419C150.264 46.9168 151.834 46.9682 153.059 46.3454C154.598 45.558 155.581 43.7001 155.581 41.0651C155.581 36.3406 152.431 30.9008 148.546 28.9245C146.827 28.0496 145.257 27.9981 144.032 28.6208Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M144.773 36.3409C144.773 38.5899 146.271 41.1786 148.123 42.1204C149.976 43.0622 151.474 42.002 151.474 39.753C151.474 37.5039 149.976 34.9152 148.123 33.9734C146.276 33.0316 144.773 34.0919 144.773 36.3409ZM148.123 43.0262C145.864 41.8734 144.032 38.7083 144.032 35.96C144.032 33.2118 145.864 31.9148 148.123 33.0625C150.383 34.2102 152.215 37.3805 152.215 40.1288C152.215 42.877 150.383 44.1739 148.123 43.0262Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M146.26 37.0973C146.26 38.3479 147.094 39.7838 148.118 40.3087C149.148 40.8336 149.981 40.2418 149.981 38.9912C149.981 37.7406 149.148 36.3047 148.118 35.7797C147.089 35.2548 146.26 35.8467 146.26 37.0973ZM148.123 41.2145C146.682 40.4837 145.519 38.4663 145.519 36.7164C145.519 34.9666 146.688 34.1431 148.123 34.8739C149.559 35.6047 150.728 37.6222 150.728 39.372C150.728 41.1218 149.559 41.9453 148.123 41.2145Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M48.0959 2.1161C46.9739 1.54483 45.5329 1.59118 43.9529 2.39918C40.3863 4.2159 37.4992 9.20798 37.4992 13.5414C37.4992 15.9602 38.3998 17.669 39.8151 18.3895L37.5197 17.2212C36.1044 16.5007 35.2038 14.792 35.2038 12.3731C35.2038 8.03457 38.0962 3.04249 41.6576 1.23091C43.2324 0.428053 44.6786 0.376562 45.8005 0.947826L48.0959 2.1161Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M48.0959 2.1158C49.5112 2.83631 50.4118 4.54492 50.4118 6.96378C50.4118 11.3023 47.5195 16.2945 43.9581 18.1061C42.3832 18.9089 40.9371 18.9604 39.8151 18.3892C38.3998 17.6687 37.4992 15.9599 37.4992 13.5411C37.4992 9.20254 40.3915 4.21046 43.9529 2.39888C45.5277 1.59602 46.9739 1.54453 48.0959 2.1158Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M47.5915 9.28574C47.3908 9.38867 47.2262 9.27544 47.2262 9.02841V6.81538L45.4043 7.74178C45.2035 7.84471 45.0389 7.73149 45.0389 7.48445C45.0389 7.23742 45.2035 6.95952 45.4043 6.85659L47.5864 5.74499C47.7871 5.64206 47.9518 5.75528 47.9518 6.00231V8.65787C47.9518 8.90491 47.7871 9.18281 47.5864 9.28574H47.5915Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M40.3144 14.7678C40.2217 14.8141 40.1291 14.8193 40.0571 14.7678C39.9129 14.6649 39.9129 14.387 40.0571 14.14L42.4244 10.0587C42.5685 9.81164 42.795 9.69842 42.9391 9.7962L44.5037 10.9028L47.3394 6.00843C47.4835 5.76139 47.7099 5.64817 47.854 5.74595C47.9982 5.84888 47.9982 6.12678 47.854 6.37381L44.761 11.7158C44.6169 11.9629 44.3904 12.0761 44.2463 11.9783L42.6818 10.8719L40.5717 14.5105C40.4997 14.634 40.407 14.7215 40.3144 14.773V14.7678Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/draft.tsx b/packages/propel/src/empty-state/assets/vertical-stack/draft.tsx
index 2c47e6e73..f2ffcf8f6 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/draft.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/draft.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const DraftVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="175"
-    viewBox="0 0 162 175"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function DraftVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="175"
+      viewBox="0 0 162 175"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M14.7751 141.405C14.7751 143.355 16.2347 145.299 19.1485 146.79L56.6679 165.908C62.5008 168.878 71.9541 168.878 77.787 165.908L156.627 125.737C159.54 124.252 161 122.308 161 120.358V126.583C161 128.533 159.54 130.477 156.627 131.962L77.787 172.133C71.9541 175.103 62.5008 175.103 56.6679 172.133L19.1485 153.014C16.2295 151.529 14.7751 149.58 14.7751 147.63V141.405Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M14.7751 141.405C14.7751 139.456 16.2347 137.511 19.1485 136.026L97.9882 95.8559C103.821 92.8853 113.274 92.8853 119.107 95.8559L156.627 114.974C159.546 116.459 161 118.409 161 120.358C161 122.308 159.54 124.252 156.627 125.737L77.787 165.907C71.9541 168.878 62.5008 168.878 56.6679 165.907L19.1485 146.789C16.2295 145.304 14.7751 143.355 14.7751 141.405Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M14.7751 121.74C14.7751 123.69 16.2347 125.634 19.1485 127.125L56.6679 146.243C62.5008 149.213 71.9541 149.213 77.787 146.243L156.627 106.072C159.54 104.587 161 102.643 161 100.693V106.918C161 108.868 159.54 110.812 156.627 112.297L77.787 152.467C71.9541 155.438 62.5008 155.438 56.6679 152.467L19.1485 133.349C16.2295 131.864 14.7751 129.915 14.7751 127.965V121.74Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M14.7751 121.74C14.7751 119.791 16.2347 117.846 19.1485 116.361L97.9882 76.1908C103.821 73.2202 113.274 73.2202 119.107 76.1908L156.627 95.3089C159.546 96.7942 161 98.7437 161 100.693C161 102.643 159.54 104.587 156.627 106.072L77.787 146.242C71.9541 149.213 62.5008 149.213 56.6679 146.242L19.1485 127.124C16.2295 125.639 14.7751 123.69 14.7751 121.74Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M14.7751 141.405C14.7751 143.355 16.2347 145.299 19.1485 146.79L56.6679 165.908C62.5008 168.878 71.9541 168.878 77.787 165.908L156.627 125.737C159.54 124.252 161 122.308 161 120.358V126.583C161 128.533 159.54 130.477 156.627 131.962L77.787 172.133C71.9541 175.103 62.5008 175.103 56.6679 172.133L19.1485 153.014C16.2295 151.529 14.7751 149.58 14.7751 147.63V141.405Z"
+        d="M14.7751 102.075C14.7751 104.025 16.2347 105.969 19.1485 107.459L56.6679 126.578C62.5008 129.548 71.9541 129.548 77.787 126.578L156.627 86.4074C159.54 84.9221 161 82.9778 161 81.0283V87.2532C161 89.2026 159.54 91.1469 156.627 92.6322L77.787 132.802C71.9541 135.773 62.5008 135.773 56.6679 132.802L19.1485 113.684C16.2295 112.199 14.7751 110.25 14.7751 108.3V102.075Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -20,17 +56,97 @@ export const DraftVerticalStackIllustration = ({ className }: TIllustrationAsset
         strokeLinejoin="round"
       />
       <path
-        d="M14.7751 141.405C14.7751 139.456 16.2347 137.511 19.1485 136.026L97.9882 95.8559C103.821 92.8853 113.274 92.8853 119.107 95.8559L156.627 114.974C159.546 116.459 161 118.409 161 120.358C161 122.308 159.54 124.252 156.627 125.737L77.787 165.907C71.9541 168.878 62.5008 168.878 56.6679 165.907L19.1485 146.789C16.2295 145.304 14.7751 143.355 14.7751 141.405Z"
+        d="M14.7751 102.075C14.7751 100.126 16.2347 98.1813 19.1485 96.696L97.9882 56.5258C103.821 53.5552 113.274 53.5552 119.107 56.5258L156.627 75.6439C159.546 77.1292 161 79.0787 161 81.0281C161 82.9776 159.54 84.9219 156.627 86.4072L77.787 126.577C71.9541 129.548 62.5008 129.548 56.6679 126.577L19.1485 107.459C16.2295 105.974 14.7751 104.025 14.7751 102.075Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M14.7751 121.74C14.7751 123.69 16.2347 125.634 19.1485 127.125L56.6679 146.243C62.5008 149.213 71.9541 149.213 77.787 146.243L156.627 106.072C159.54 104.587 161 102.643 161 100.693V106.918C161 108.868 159.54 110.812 156.627 112.297L77.787 152.467C71.9541 155.438 62.5008 155.438 56.6679 152.467L19.1485 133.349C16.2295 131.864 14.7751 129.915 14.7751 127.965V121.74Z"
+        d="M72.3151 95.154C71.4126 95.154 70.5668 94.9581 69.8087 94.5713L65.5023 92.3743C63.3001 91.25 62.0366 88.6507 62.0366 85.2417V52.6992C62.0366 46.562 66.1521 39.4707 71.2063 36.892L97.952 23.2664C99.2156 22.6218 100.448 22.2969 101.619 22.2969C102.521 22.2969 103.367 22.4929 104.125 22.8797L108.432 25.0767C110.634 26.2009 111.897 28.8002 111.897 32.2092V64.7518C111.897 70.8889 107.782 77.9802 102.728 80.5589L75.9819 94.1845C74.7184 94.8291 73.4858 95.154 72.3151 95.154Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M101.614 22.8127C102.444 22.8127 103.207 22.9932 103.888 23.3388L108.194 25.5358C110.139 26.526 111.382 28.8777 111.382 32.2093V64.7519C111.382 70.7292 107.4 77.5987 102.49 80.1L75.7447 93.7256C74.5276 94.3444 73.3672 94.6384 72.3151 94.6384C71.4848 94.6384 70.7215 94.4579 70.0408 94.1124L65.7344 91.9153C63.785 90.9251 62.5472 88.5734 62.5472 85.2418V52.6993C62.5472 46.7219 66.5286 39.8524 71.4384 37.3511L98.1841 23.7256C99.4012 23.1067 100.556 22.8127 101.614 22.8127ZM101.614 21.7812C100.361 21.7812 99.0506 22.1268 97.7148 22.8076L70.9691 36.4331C65.7551 39.0891 61.5157 46.3867 61.5157 52.6993V85.2418C61.5157 88.8519 62.8824 91.6214 65.2651 92.8333L69.5714 95.0304C70.4069 95.4533 71.3249 95.6699 72.3151 95.6699C73.5684 95.6699 74.8783 95.3243 76.214 94.6436L102.96 81.018C108.174 78.362 112.413 71.0644 112.413 64.7519V32.2093C112.413 28.5992 111.046 25.8297 108.664 24.6178L104.357 22.4208C103.522 21.9979 102.604 21.7812 101.614 21.7812Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M108.194 25.5359C106.652 24.7468 104.662 24.8139 102.49 25.9227L75.7447 39.5483C70.835 42.0496 66.8535 48.9191 66.8535 54.8964V87.4389C66.8535 90.7706 68.0913 93.1223 70.0407 94.1125L65.7344 91.9155C63.7849 90.9253 62.5472 88.5735 62.5472 85.2419V52.6994C62.5472 46.7221 66.5286 39.8526 71.4384 37.3513L98.1841 23.7257C100.355 22.6169 102.346 22.555 103.888 23.3389L108.194 25.5359Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M108.194 25.5352C110.144 26.5254 111.382 28.8771 111.382 32.2087V64.7513C111.382 70.7286 107.4 77.5981 102.49 80.0994L75.7447 93.725C73.5735 94.8338 71.5828 94.8957 70.0408 94.1118C68.0913 93.1216 66.8535 90.7698 66.8535 87.4382V54.8957C66.8535 48.9184 70.835 42.0488 75.7447 39.5476L102.49 25.922C104.662 24.8132 106.652 24.7513 108.194 25.5352Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M125.497 23.1279C125.42 23.1279 125.337 23.1073 125.265 23.0712L120.443 20.6163C120.443 20.6163 120.402 20.5906 120.381 20.5802L112.037 14.6751C111.82 14.5204 111.753 14.2264 111.887 13.9944L114.486 9.50236C115.652 7.49101 117.209 5.91804 118.87 5.07224C119.731 4.63387 120.577 4.41211 121.382 4.41211C122.011 4.41211 122.599 4.55136 123.13 4.81954L127.952 7.27441C128.102 7.35177 128.251 7.4446 128.396 7.54259C129.649 8.42964 130.34 10.0697 130.34 12.1635C130.34 14.2574 129.7 16.377 128.54 18.3832L125.941 22.8752C125.848 23.0403 125.673 23.1331 125.492 23.1331L125.497 23.1279Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M121.382 4.92794C121.928 4.92794 122.439 5.04656 122.893 5.27864L127.715 7.73352C127.849 7.80056 127.973 7.87792 128.096 7.96559C129.205 8.7495 129.824 10.2606 129.824 12.1636C129.824 14.0667 129.2 16.2121 128.096 18.1203L125.497 22.6123L120.675 20.1574L112.331 14.2523L114.93 9.76033C116.039 7.85213 117.539 6.33073 119.102 5.53135C119.891 5.12908 120.665 4.92794 121.382 4.92794ZM121.382 3.89648C120.489 3.89648 119.566 4.13888 118.633 4.61335C116.879 5.50556 115.25 7.15074 114.038 9.2446L111.438 13.7366C111.17 14.2008 111.299 14.7887 111.737 15.0981L120.082 21.0032C120.123 21.0342 120.165 21.06 120.211 21.0806L125.033 23.5355C125.183 23.6128 125.342 23.6489 125.502 23.6489C125.858 23.6489 126.204 23.4633 126.395 23.1332L128.994 18.6412C130.195 16.5628 130.861 14.2627 130.861 12.1636C130.861 9.89958 130.092 8.11 128.695 7.12495C128.53 7.00634 128.359 6.90319 128.184 6.81551L123.362 4.36064C122.759 4.05636 122.093 3.89648 121.382 3.89648Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M92.0727 71.7772C91.8303 71.7772 91.6085 71.7205 91.4023 71.6122C91.3919 71.6122 91.3455 71.5813 91.2991 71.5555L86.477 69.0954C86.477 69.0954 86.4358 69.0697 86.4152 69.0593C86.1006 68.8376 85.8685 68.4714 85.7705 68.0279C85.6777 67.6411 85.6828 67.1769 85.786 66.7025L87.5858 58.4405C88.1583 55.8102 89.2053 53.1439 90.608 50.72L109.499 18.1104C109.592 17.9454 109.767 17.8525 109.948 17.8525C110.025 17.8525 110.108 17.8732 110.18 17.9093L115.002 20.3693C115.002 20.3693 115.043 20.3951 115.064 20.4054L123.408 26.3053C123.625 26.4601 123.692 26.754 123.558 26.9861L116.529 39.1315L104.672 59.5957C103.259 62.0299 101.505 64.2012 99.5869 65.8721L93.5477 71.1377C93.1867 71.4472 92.7947 71.6535 92.4182 71.736C92.2996 71.7618 92.1862 71.7721 92.0727 71.7721V71.7772Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M109.943 18.3723L114.765 20.8323L123.109 26.7323L116.08 38.8777L111.346 47.0469L104.223 59.3419C102.836 61.7348 101.124 63.8493 99.2466 65.4894L93.2073 70.755C92.9134 71.0077 92.6039 71.1727 92.31 71.2346C92.2275 71.2501 92.1449 71.2604 92.0676 71.2604C91.9129 71.2604 91.7685 71.2243 91.6395 71.1572C91.6034 71.1418 91.5673 71.116 91.5312 71.0953L86.7091 68.6353C86.4977 68.4857 86.343 68.233 86.2708 67.9133C86.1934 67.5935 86.1986 67.2119 86.2863 66.8148L88.0862 58.5528C88.6483 55.9793 89.6643 53.3749 91.0516 50.9819L109.943 18.3723ZM109.943 17.3408C109.587 17.3408 109.241 17.5265 109.051 17.8566L90.1594 50.4661C88.7308 52.9313 87.6632 55.6544 87.0805 58.3362L85.2806 66.5982C85.162 67.1449 85.1568 67.6864 85.2703 68.1608C85.394 68.7075 85.6932 69.182 86.1161 69.4811C86.1573 69.512 86.1986 69.5378 86.245 69.5585L91.0361 72.003C91.0722 72.0237 91.1238 72.0598 91.1908 72.0907C91.4642 72.2299 91.7581 72.297 92.0727 72.297C92.2223 72.297 92.3719 72.2815 92.5214 72.2506C92.9856 72.1526 93.4549 71.9102 93.883 71.544L99.9273 66.2733C101.887 64.561 103.682 62.3486 105.121 59.8679L112.243 47.5729L116.977 39.4037L124.007 27.2583C124.275 26.7942 124.146 26.2062 123.708 25.9019L115.363 20.002C115.322 19.971 115.281 19.9504 115.234 19.9246L110.412 17.4646C110.263 17.3872 110.103 17.3511 109.943 17.3511V17.3408Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M127.715 7.73365C126.658 7.19213 125.317 7.2798 123.924 7.98635C122.356 8.78573 120.856 10.3071 119.752 12.2153L117.153 16.7073L112.331 14.2525L114.93 9.76046C116.039 7.85226 117.539 6.33086 119.102 5.53148C120.495 4.81977 121.835 4.73725 122.893 5.27877L127.715 7.73365Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M117.153 16.712L125.497 22.6119L120.675 20.1571L112.331 14.252L117.153 16.712Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M127.715 7.73287C127.849 7.79992 127.973 7.87728 128.096 7.96495C129.205 8.74886 129.824 10.2599 129.824 12.163C129.824 14.066 129.2 16.2115 128.096 18.1197L125.497 22.6117L117.153 16.7066L119.752 12.2146C120.861 10.3064 122.362 8.78496 123.924 7.98558C125.317 7.27387 126.658 7.19136 127.715 7.73287Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M114.765 20.8279L95.8788 53.4375C94.4915 55.8305 93.4703 58.4349 92.9082 61.0084L91.1083 69.2704C91.0206 69.6675 91.0155 70.0492 91.0877 70.3689C91.1599 70.6887 91.3146 70.9414 91.5312 71.0909L86.7091 68.6361C86.4925 68.4814 86.343 68.2338 86.2656 67.9141C86.1934 67.5943 86.1986 67.2127 86.2862 66.8155L88.0861 58.5536C88.6483 55.9801 89.6643 53.3756 91.0567 50.9826L109.943 18.373L114.765 20.8279Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M114.765 20.8271L123.109 26.7323L104.223 59.3418C102.836 61.74 101.124 63.8493 99.2465 65.4893L93.2073 70.7549C92.9185 71.0077 92.6091 71.1727 92.31 71.2346C92.0624 71.2861 91.8355 71.2604 91.6395 71.1572C91.6034 71.1366 91.5673 71.116 91.5312 71.0902C91.3146 70.9355 91.1651 70.6879 91.0877 70.3681C91.0155 70.0484 91.0206 69.6668 91.1083 69.2696L92.9082 61.0077C93.4703 58.4342 94.4863 55.8297 95.8788 53.4367L114.765 20.8271Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M146.936 37.7746C148.06 37.2022 149.504 37.2486 151.088 38.0583C154.662 39.8788 157.555 44.8814 157.555 49.2238C157.555 51.6477 156.652 53.36 155.234 54.082L157.534 52.9113C158.953 52.1893 159.855 50.477 159.855 48.0531C159.855 43.7055 156.957 38.7029 153.388 36.8876C151.81 36.083 150.36 36.0314 149.236 36.6039L146.936 37.7746Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -38,229 +154,115 @@ export const DraftVerticalStackIllustration = ({ className }: TIllustrationAsset
         strokeLinejoin="round"
       />
       <path
-        d="M14.7751 121.74C14.7751 119.791 16.2347 117.846 19.1485 116.361L97.9882 76.1908C103.821 73.2202 113.274 73.2202 119.107 76.1908L156.627 95.3089C159.546 96.7942 161 98.7437 161 100.693C161 102.643 159.54 104.587 156.627 106.072L77.787 146.242C71.9541 149.213 62.5008 149.213 56.6679 146.242L19.1485 127.124C16.2295 125.639 14.7751 123.69 14.7751 121.74Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M146.936 37.7738C145.518 38.4959 144.615 40.2081 144.615 42.632C144.615 46.9796 147.514 51.9822 151.083 53.7976C152.661 54.6021 154.11 54.6537 155.234 54.0812C156.652 53.3592 157.555 51.647 157.555 49.223C157.555 44.8754 154.657 39.8729 151.088 38.0575C149.51 37.2529 148.06 37.2014 146.936 37.7738Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M14.7751 102.075C14.7751 104.025 16.2347 105.969 19.1485 107.459L56.6679 126.578C62.5008 129.548 71.9541 129.548 77.787 126.578L156.627 86.4074C159.54 84.9221 161 82.9778 161 81.0283V87.2532C161 89.2026 159.54 91.1469 156.627 92.6322L77.787 132.802C71.9541 135.773 62.5008 135.773 56.6679 132.802L19.1485 113.684C16.2295 112.199 14.7751 110.25 14.7751 108.3V102.075Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M14.7751 102.075C14.7751 100.126 16.2347 98.1813 19.1485 96.696L97.9882 56.5258C103.821 53.5552 113.274 53.5552 119.107 56.5258L156.627 75.6439C159.546 77.1292 161 79.0787 161 81.0281C161 82.9776 159.54 84.9219 156.627 86.4072L77.787 126.577C71.9541 129.548 62.5008 129.548 56.6679 126.577L19.1485 107.459C16.2295 105.974 14.7751 104.025 14.7751 102.075Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M72.3151 95.154C71.4126 95.154 70.5668 94.9581 69.8087 94.5713L65.5023 92.3743C63.3001 91.25 62.0366 88.6507 62.0366 85.2417V52.6992C62.0366 46.562 66.1521 39.4707 71.2063 36.892L97.952 23.2664C99.2156 22.6218 100.448 22.2969 101.619 22.2969C102.521 22.2969 103.367 22.4929 104.125 22.8797L108.432 25.0767C110.634 26.2009 111.897 28.8002 111.897 32.2092V64.7518C111.897 70.8889 107.782 77.9802 102.728 80.5589L75.9819 94.1845C74.7184 94.8291 73.4858 95.154 72.3151 95.154Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M101.614 22.8127C102.444 22.8127 103.207 22.9932 103.888 23.3388L108.194 25.5358C110.139 26.526 111.382 28.8777 111.382 32.2093V64.7519C111.382 70.7292 107.4 77.5987 102.49 80.1L75.7447 93.7256C74.5276 94.3444 73.3672 94.6384 72.3151 94.6384C71.4848 94.6384 70.7215 94.4579 70.0408 94.1124L65.7344 91.9153C63.785 90.9251 62.5472 88.5734 62.5472 85.2418V52.6993C62.5472 46.7219 66.5286 39.8524 71.4384 37.3511L98.1841 23.7256C99.4012 23.1067 100.556 22.8127 101.614 22.8127ZM101.614 21.7812C100.361 21.7812 99.0506 22.1268 97.7148 22.8076L70.9691 36.4331C65.7551 39.0891 61.5157 46.3867 61.5157 52.6993V85.2418C61.5157 88.8519 62.8824 91.6214 65.2651 92.8333L69.5714 95.0304C70.4069 95.4533 71.3249 95.6699 72.3151 95.6699C73.5684 95.6699 74.8783 95.3243 76.214 94.6436L102.96 81.018C108.174 78.362 112.413 71.0644 112.413 64.7519V32.2093C112.413 28.5992 111.046 25.8297 108.664 24.6178L104.357 22.4208C103.522 21.9979 102.604 21.7812 101.614 21.7812Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M108.194 25.5359C106.652 24.7468 104.662 24.8139 102.49 25.9227L75.7447 39.5483C70.835 42.0496 66.8535 48.9191 66.8535 54.8964V87.4389C66.8535 90.7706 68.0913 93.1223 70.0407 94.1125L65.7344 91.9155C63.7849 90.9253 62.5472 88.5735 62.5472 85.2419V52.6994C62.5472 46.7221 66.5286 39.8526 71.4384 37.3513L98.1841 23.7257C100.355 22.6169 102.346 22.555 103.888 23.3389L108.194 25.5359Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M108.194 25.5352C110.144 26.5254 111.382 28.8771 111.382 32.2087V64.7513C111.382 70.7286 107.4 77.5981 102.49 80.0994L75.7447 93.725C73.5735 94.8338 71.5828 94.8957 70.0408 94.1118C68.0913 93.1216 66.8535 90.7698 66.8535 87.4382V54.8957C66.8535 48.9184 70.835 42.0488 75.7447 39.5476L102.49 25.922C104.662 24.8132 106.652 24.7513 108.194 25.5352Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M125.497 23.1279C125.42 23.1279 125.337 23.1073 125.265 23.0712L120.443 20.6163C120.443 20.6163 120.402 20.5906 120.381 20.5802L112.037 14.6751C111.82 14.5204 111.753 14.2264 111.887 13.9944L114.486 9.50236C115.652 7.49101 117.209 5.91804 118.87 5.07224C119.731 4.63387 120.577 4.41211 121.382 4.41211C122.011 4.41211 122.599 4.55136 123.13 4.81954L127.952 7.27441C128.102 7.35177 128.251 7.4446 128.396 7.54259C129.649 8.42964 130.34 10.0697 130.34 12.1635C130.34 14.2574 129.7 16.377 128.54 18.3832L125.941 22.8752C125.848 23.0403 125.673 23.1331 125.492 23.1331L125.497 23.1279Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M121.382 4.92794C121.928 4.92794 122.439 5.04656 122.893 5.27864L127.715 7.73352C127.849 7.80056 127.973 7.87792 128.096 7.96559C129.205 8.7495 129.824 10.2606 129.824 12.1636C129.824 14.0667 129.2 16.2121 128.096 18.1203L125.497 22.6123L120.675 20.1574L112.331 14.2523L114.93 9.76033C116.039 7.85213 117.539 6.33073 119.102 5.53135C119.891 5.12908 120.665 4.92794 121.382 4.92794ZM121.382 3.89648C120.489 3.89648 119.566 4.13888 118.633 4.61335C116.879 5.50556 115.25 7.15074 114.038 9.2446L111.438 13.7366C111.17 14.2008 111.299 14.7887 111.737 15.0981L120.082 21.0032C120.123 21.0342 120.165 21.06 120.211 21.0806L125.033 23.5355C125.183 23.6128 125.342 23.6489 125.502 23.6489C125.858 23.6489 126.204 23.4633 126.395 23.1332L128.994 18.6412C130.195 16.5628 130.861 14.2627 130.861 12.1636C130.861 9.89958 130.092 8.11 128.695 7.12495C128.53 7.00634 128.359 6.90319 128.184 6.81551L123.362 4.36064C122.759 4.05636 122.093 3.89648 121.382 3.89648Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M92.0727 71.7772C91.8303 71.7772 91.6085 71.7205 91.4023 71.6122C91.3919 71.6122 91.3455 71.5813 91.2991 71.5555L86.477 69.0954C86.477 69.0954 86.4358 69.0697 86.4152 69.0593C86.1006 68.8376 85.8685 68.4714 85.7705 68.0279C85.6777 67.6411 85.6828 67.1769 85.786 66.7025L87.5858 58.4405C88.1583 55.8102 89.2053 53.1439 90.608 50.72L109.499 18.1104C109.592 17.9454 109.767 17.8525 109.948 17.8525C110.025 17.8525 110.108 17.8732 110.18 17.9093L115.002 20.3693C115.002 20.3693 115.043 20.3951 115.064 20.4054L123.408 26.3053C123.625 26.4601 123.692 26.754 123.558 26.9861L116.529 39.1315L104.672 59.5957C103.259 62.0299 101.505 64.2012 99.5869 65.8721L93.5477 71.1377C93.1867 71.4472 92.7947 71.6535 92.4182 71.736C92.2996 71.7618 92.1862 71.7721 92.0727 71.7721V71.7772Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M109.943 18.3723L114.765 20.8323L123.109 26.7323L116.08 38.8777L111.346 47.0469L104.223 59.3419C102.836 61.7348 101.124 63.8493 99.2466 65.4894L93.2073 70.755C92.9134 71.0077 92.6039 71.1727 92.31 71.2346C92.2275 71.2501 92.1449 71.2604 92.0676 71.2604C91.9129 71.2604 91.7685 71.2243 91.6395 71.1572C91.6034 71.1418 91.5673 71.116 91.5312 71.0953L86.7091 68.6353C86.4977 68.4857 86.343 68.233 86.2708 67.9133C86.1934 67.5935 86.1986 67.2119 86.2863 66.8148L88.0862 58.5528C88.6483 55.9793 89.6643 53.3749 91.0516 50.9819L109.943 18.3723ZM109.943 17.3408C109.587 17.3408 109.241 17.5265 109.051 17.8566L90.1594 50.4661C88.7308 52.9313 87.6632 55.6544 87.0805 58.3362L85.2806 66.5982C85.162 67.1449 85.1568 67.6864 85.2703 68.1608C85.394 68.7075 85.6932 69.182 86.1161 69.4811C86.1573 69.512 86.1986 69.5378 86.245 69.5585L91.0361 72.003C91.0722 72.0237 91.1238 72.0598 91.1908 72.0907C91.4642 72.2299 91.7581 72.297 92.0727 72.297C92.2223 72.297 92.3719 72.2815 92.5214 72.2506C92.9856 72.1526 93.4549 71.9102 93.883 71.544L99.9273 66.2733C101.887 64.561 103.682 62.3486 105.121 59.8679L112.243 47.5729L116.977 39.4037L124.007 27.2583C124.275 26.7942 124.146 26.2062 123.708 25.9019L115.363 20.002C115.322 19.971 115.281 19.9504 115.234 19.9246L110.412 17.4646C110.263 17.3872 110.103 17.3511 109.943 17.3511V17.3408Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M127.715 7.73365C126.658 7.19213 125.317 7.2798 123.924 7.98635C122.356 8.78573 120.856 10.3071 119.752 12.2153L117.153 16.7073L112.331 14.2525L114.93 9.76046C116.039 7.85226 117.539 6.33086 119.102 5.53148C120.495 4.81977 121.835 4.73725 122.893 5.27877L127.715 7.73365Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M117.153 16.712L125.497 22.6119L120.675 20.1571L112.331 14.252L117.153 16.712Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M127.715 7.73287C127.849 7.79992 127.973 7.87728 128.096 7.96495C129.205 8.74886 129.824 10.2599 129.824 12.163C129.824 14.066 129.2 16.2115 128.096 18.1197L125.497 22.6117L117.153 16.7066L119.752 12.2146C120.861 10.3064 122.362 8.78496 123.924 7.98558C125.317 7.27387 126.658 7.19136 127.715 7.73287Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M114.765 20.8279L95.8788 53.4375C94.4915 55.8305 93.4703 58.4349 92.9082 61.0084L91.1083 69.2704C91.0206 69.6675 91.0155 70.0492 91.0877 70.3689C91.1599 70.6887 91.3146 70.9414 91.5312 71.0909L86.7091 68.6361C86.4925 68.4814 86.343 68.2338 86.2656 67.9141C86.1934 67.5943 86.1986 67.2127 86.2862 66.8155L88.0861 58.5536C88.6483 55.9801 89.6643 53.3756 91.0567 50.9826L109.943 18.373L114.765 20.8279Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M114.765 20.8271L123.109 26.7323L104.223 59.3418C102.836 61.74 101.124 63.8493 99.2465 65.4893L93.2073 70.7549C92.9185 71.0077 92.6091 71.1727 92.31 71.2346C92.0624 71.2861 91.8355 71.2604 91.6395 71.1572C91.6034 71.1366 91.5673 71.116 91.5312 71.0902C91.3146 70.9355 91.1651 70.6879 91.0877 70.3681C91.0155 70.0484 91.0206 69.6668 91.1083 69.2696L92.9082 61.0077C93.4703 58.4342 94.4863 55.8297 95.8788 53.4367L114.765 20.8271Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M146.936 37.7746C148.06 37.2022 149.504 37.2486 151.088 38.0583C154.662 39.8788 157.555 44.8814 157.555 49.2238C157.555 51.6477 156.652 53.36 155.234 54.082L157.534 52.9113C158.953 52.1893 159.855 50.477 159.855 48.0531C159.855 43.7055 156.957 38.7029 153.388 36.8876C151.81 36.083 150.36 36.0314 149.236 36.6039L146.936 37.7746Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M146.936 37.7738C145.518 38.4959 144.615 40.2081 144.615 42.632C144.615 46.9796 147.514 51.9822 151.083 53.7976C152.661 54.6021 154.11 54.6537 155.234 54.0812C156.652 53.3592 157.555 51.647 157.555 49.223C157.555 44.8754 154.657 39.8729 151.088 38.0575C149.51 37.2529 148.06 37.2014 146.936 37.7738Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M152.867 44.0461C152.686 43.7367 152.444 43.4891 152.186 43.3602C151.933 43.2313 151.686 43.2313 151.505 43.3602L148.767 45.2942C148.468 45.5056 148.298 45.9131 148.298 46.4288C148.298 46.9445 148.468 47.5221 148.767 48.043C149.066 48.5588 149.473 48.9713 149.896 49.1879C150.319 49.4045 150.727 49.4045 151.026 49.1931L153.96 47.1199C154.084 47.0322 154.285 47.1353 154.414 47.3519C154.538 47.5685 154.538 47.8109 154.414 47.9038L151.48 49.977C151.062 50.2761 150.489 50.271 149.896 49.9667C149.303 49.6624 148.736 49.09 148.313 48.3628C147.895 47.6408 147.658 46.8259 147.658 46.1039C147.658 45.3819 147.895 44.8094 148.313 44.5154L151.046 42.5814C151.346 42.37 151.753 42.37 152.176 42.5814C152.599 42.798 153.006 43.2106 153.305 43.7264C153.604 44.2421 153.775 44.8249 153.775 45.3406C153.775 45.8563 153.604 46.2637 153.305 46.4804L150.562 48.4143C150.381 48.5433 150.139 48.5381 149.886 48.4143C149.633 48.2906 149.386 48.0379 149.21 47.7284C149.035 47.419 148.932 47.0683 148.932 46.7589C148.932 46.4494 149.035 46.207 149.21 46.0781L151.923 44.1647C152.047 44.0771 152.248 44.1802 152.377 44.3968C152.501 44.6134 152.501 44.8558 152.377 44.9435L149.664 46.8568C149.602 46.8981 149.571 46.9806 149.571 47.0838C149.571 47.1869 149.608 47.3004 149.664 47.4087C149.726 47.5118 149.803 47.5943 149.891 47.6356C149.979 47.6769 150.056 47.6769 150.118 47.6356L152.862 45.7016C153.042 45.5727 153.14 45.3303 153.14 45.0208C153.14 44.7114 153.037 44.3607 152.857 44.0513L152.867 44.0461Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M23.8262 37.9394C23.2486 37.6454 22.8824 36.9492 22.8824 35.959V23.3133C22.8824 21.5392 24.0635 19.4969 25.523 18.7542L58.246 2.08067C58.8907 1.75061 59.4838 1.73514 59.9428 1.96722L57.6426 0.796508C57.1836 0.564429 56.5905 0.579902 55.9459 0.909969L23.2228 17.5835C21.7633 18.3262 20.5823 20.3685 20.5823 22.1426V34.7883C20.5823 35.7785 20.9485 36.4747 21.5261 36.7687L23.8262 37.9394Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M23.8262 37.9386C24.2852 38.1707 24.8783 38.1552 25.523 37.8251L58.246 21.1516C59.7056 20.4089 60.8866 18.3666 60.8866 16.5925V3.94683C60.8866 2.95663 60.5204 2.2604 59.9428 1.96643C59.4838 1.73435 58.8907 1.74982 58.246 2.07989L25.523 18.7534C24.0635 19.4961 22.8824 21.5384 22.8824 23.3125V35.9582C22.8824 36.9484 23.2486 37.6446 23.8262 37.9386Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M47.4982 15.6389L39.9066 19.5069C39.2826 19.8266 38.7772 19.4656 38.7772 18.7075C38.7772 17.9494 39.2826 17.0726 39.9066 16.758L47.4982 12.8901C48.1222 12.5703 48.6276 12.9313 48.6276 13.6894C48.6276 14.4476 48.1222 15.3243 47.4982 15.6389Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M51.0052 20.2192L40.3605 25.6447C39.4837 26.0883 38.7772 25.588 38.7772 24.5256C38.7772 23.458 39.4889 22.2358 40.3605 21.7922L51.0052 16.3667C51.8819 15.9232 52.5884 16.4235 52.5884 17.4859C52.5884 18.5534 51.8767 19.7757 51.0052 20.2192Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M31.459 23.711C31.526 23.8606 31.6704 23.9121 31.8406 23.8296C32.0727 23.711 32.2635 23.3809 32.2635 23.0921V22.5558C32.2635 22.3804 32.2016 22.2515 32.0882 22.2102C31.9747 22.169 31.8251 22.2205 31.6962 22.3495L28.9628 25.057C28.803 25.2169 28.6946 25.4696 28.6946 25.6862V29.3685C28.6946 29.5542 28.772 29.6831 28.8958 29.7141C29.0196 29.745 29.1794 29.6728 29.3084 29.5181L29.7003 29.0643C29.9066 28.827 29.984 28.466 29.8808 28.2649C29.8086 28.1308 29.6797 28.0999 29.5353 28.1566V25.614L31.4641 23.7058L31.459 23.711Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M29.7778 22.9883C29.8448 23.1379 29.9892 23.1895 30.1594 23.107C30.3915 22.9883 30.5823 22.6583 30.5823 22.3695V21.8331C30.5823 21.6577 30.5204 21.5288 30.4069 21.4876C30.2935 21.4463 30.1439 21.4979 30.015 21.6268L27.2816 24.3344C27.1217 24.4943 27.0134 24.747 27.0134 24.9636V28.6459C27.0134 28.8316 27.0908 28.9605 27.2146 28.9914C27.3383 29.0224 27.4982 28.9502 27.6271 28.7955L28.0191 28.3416C28.2254 28.1044 28.3028 27.7434 28.1996 27.5422C28.1274 27.4081 27.9985 27.3772 27.8541 27.4339V24.8914L29.7829 22.9832L29.7778 22.9883Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M34.1305 26.8511C34.1305 27.0677 34.0221 27.3204 33.8623 27.4803L31.1289 30.1878C31 30.3168 30.8556 30.3683 30.7421 30.3271C30.6286 30.2858 30.5616 30.1621 30.5616 29.9867V26.3044C30.5616 26.0878 30.6699 25.8351 30.8298 25.6752L33.5631 22.9676C33.6921 22.8387 33.8365 22.7871 33.9499 22.8284C34.0634 22.8696 34.1305 22.9986 34.1305 23.1688V26.8562V26.8511ZM33.2898 24.3601L31.3971 26.2373V28.7954L33.2898 26.9233V24.3653V24.3601Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.62093 81.4623C4.20268 80.7403 3.30015 79.0332 3.30015 76.6041C3.30015 72.2565 6.19856 67.254 9.76741 65.4386L33.6973 53.2467C35.2754 52.4422 36.7194 52.3906 37.8437 52.9631L35.5436 51.7924C34.4193 51.2199 32.9752 51.2715 31.3971 52.076L7.46726 64.2679C3.89325 66.0884 1 71.091 1 75.4334C1 77.8625 1.90253 79.5696 3.32078 80.2916L5.62093 81.4623Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.62095 81.4615C6.74525 82.034 8.18929 81.9824 9.76743 81.1779L33.6973 68.986C37.2713 67.1655 40.1645 62.1629 40.1645 57.8205C40.1645 55.3914 39.262 53.6843 37.8437 52.9623C36.7195 52.3898 35.2754 52.4414 33.6973 53.246L9.76743 65.4378C6.19342 67.2583 3.30017 72.2609 3.30017 76.6034C3.30017 79.0324 4.2027 80.7395 5.62095 81.4615Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M30.6699 65.3707L21.9128 69.8318C21.1908 70.1979 20.608 69.7854 20.608 68.9086C20.608 68.0319 21.1908 67.0262 21.9128 66.66L30.6699 62.199C31.3919 61.8328 31.9747 62.2454 31.9747 63.1221C31.9747 63.9989 31.3919 65.0045 30.6699 65.3707Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M9.87575 73.9533C9.6282 74.3865 9.4838 74.8661 9.4838 75.2993C9.4838 75.7274 9.62304 76.0678 9.87575 76.2483C10.1233 76.4236 10.4637 76.4236 10.8195 76.2483C11.1754 76.0729 11.5106 75.7274 11.7633 75.2942L12.2326 74.4793C12.3616 74.2524 12.573 74.1492 12.702 74.2369C12.8309 74.3298 12.8309 74.5876 12.702 74.8094L12.2326 75.6242C11.8562 76.2689 11.3507 76.7846 10.8195 77.058C10.2883 77.3261 9.78291 77.3313 9.40643 77.0631C9.02995 76.8001 8.82367 76.2895 8.82367 75.6449C8.82367 75.0002 9.03511 74.273 9.40643 73.6284L9.87575 72.8135C10.0047 72.5866 10.2161 72.4834 10.3451 72.5711C10.474 72.6588 10.474 72.9218 10.3451 73.1436L9.87575 73.9584V73.9533Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M11.2888 70.9456C11.1599 70.8528 11.1599 70.5949 11.2888 70.3732L11.7582 69.5583C12.1346 68.9137 12.64 68.3979 13.1712 68.1246C13.7025 67.8513 14.2079 67.8513 14.5843 68.1194C14.9608 68.3825 15.1671 68.893 15.1671 69.5377C15.1671 70.1824 14.9557 70.9095 14.5843 71.5542L14.115 72.3691C13.9861 72.596 13.7746 72.6991 13.6457 72.6115C13.5168 72.5186 13.5168 72.2608 13.6457 72.039L14.115 71.2241C14.3626 70.7909 14.507 70.3113 14.507 69.8781C14.507 69.4449 14.3677 69.1096 14.115 68.9291C13.8675 68.7538 13.5271 68.7538 13.1712 68.9291C12.8206 69.1096 12.4802 69.45 12.2275 69.8832L11.7582 70.6981C11.6292 70.925 11.4178 71.0282 11.2888 70.9405V70.9456Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M10.8195 74.6185C10.6906 74.5256 10.6906 74.2678 10.8195 74.046L12.7019 70.7969C12.8309 70.57 13.0423 70.4668 13.1713 70.5545C13.3002 70.6473 13.3002 70.9052 13.1713 71.127L11.2889 74.3761C11.1599 74.603 10.9485 74.7061 10.8195 74.6185Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M152.867 44.0461C152.686 43.7367 152.444 43.4891 152.186 43.3602C151.933 43.2313 151.686 43.2313 151.505 43.3602L148.767 45.2942C148.468 45.5056 148.298 45.9131 148.298 46.4288C148.298 46.9445 148.468 47.5221 148.767 48.043C149.066 48.5588 149.473 48.9713 149.896 49.1879C150.319 49.4045 150.727 49.4045 151.026 49.1931L153.96 47.1199C154.084 47.0322 154.285 47.1353 154.414 47.3519C154.538 47.5685 154.538 47.8109 154.414 47.9038L151.48 49.977C151.062 50.2761 150.489 50.271 149.896 49.9667C149.303 49.6624 148.736 49.09 148.313 48.3628C147.895 47.6408 147.658 46.8259 147.658 46.1039C147.658 45.3819 147.895 44.8094 148.313 44.5154L151.046 42.5814C151.346 42.37 151.753 42.37 152.176 42.5814C152.599 42.798 153.006 43.2106 153.305 43.7264C153.604 44.2421 153.775 44.8249 153.775 45.3406C153.775 45.8563 153.604 46.2637 153.305 46.4804L150.562 48.4143C150.381 48.5433 150.139 48.5381 149.886 48.4143C149.633 48.2906 149.386 48.0379 149.21 47.7284C149.035 47.419 148.932 47.0683 148.932 46.7589C148.932 46.4494 149.035 46.207 149.21 46.0781L151.923 44.1647C152.047 44.0771 152.248 44.1802 152.377 44.3968C152.501 44.6134 152.501 44.8558 152.377 44.9435L149.664 46.8568C149.602 46.8981 149.571 46.9806 149.571 47.0838C149.571 47.1869 149.608 47.3004 149.664 47.4087C149.726 47.5118 149.803 47.5943 149.891 47.6356C149.979 47.6769 150.056 47.6769 150.118 47.6356L152.862 45.7016C153.042 45.5727 153.14 45.3303 153.14 45.0208C153.14 44.7114 153.037 44.3607 152.857 44.0513L152.867 44.0461Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M23.8262 37.9394C23.2486 37.6454 22.8824 36.9492 22.8824 35.959V23.3133C22.8824 21.5392 24.0635 19.4969 25.523 18.7542L58.246 2.08067C58.8907 1.75061 59.4838 1.73514 59.9428 1.96722L57.6426 0.796508C57.1836 0.564429 56.5905 0.579902 55.9459 0.909969L23.2228 17.5835C21.7633 18.3262 20.5823 20.3685 20.5823 22.1426V34.7883C20.5823 35.7785 20.9485 36.4747 21.5261 36.7687L23.8262 37.9394Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M23.8262 37.9386C24.2852 38.1707 24.8783 38.1552 25.523 37.8251L58.246 21.1516C59.7056 20.4089 60.8866 18.3666 60.8866 16.5925V3.94683C60.8866 2.95663 60.5204 2.2604 59.9428 1.96643C59.4838 1.73435 58.8907 1.74982 58.246 2.07989L25.523 18.7534C24.0635 19.4961 22.8824 21.5384 22.8824 23.3125V35.9582C22.8824 36.9484 23.2486 37.6446 23.8262 37.9386Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M47.4982 15.6389L39.9066 19.5069C39.2826 19.8266 38.7772 19.4656 38.7772 18.7075C38.7772 17.9494 39.2826 17.0726 39.9066 16.758L47.4982 12.8901C48.1222 12.5703 48.6276 12.9313 48.6276 13.6894C48.6276 14.4476 48.1222 15.3243 47.4982 15.6389Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M51.0052 20.2192L40.3605 25.6447C39.4837 26.0883 38.7772 25.588 38.7772 24.5256C38.7772 23.458 39.4889 22.2358 40.3605 21.7922L51.0052 16.3667C51.8819 15.9232 52.5884 16.4235 52.5884 17.4859C52.5884 18.5534 51.8767 19.7757 51.0052 20.2192Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M31.459 23.711C31.526 23.8606 31.6704 23.9121 31.8406 23.8296C32.0727 23.711 32.2635 23.3809 32.2635 23.0921V22.5558C32.2635 22.3804 32.2016 22.2515 32.0882 22.2102C31.9747 22.169 31.8251 22.2205 31.6962 22.3495L28.9628 25.057C28.803 25.2169 28.6946 25.4696 28.6946 25.6862V29.3685C28.6946 29.5542 28.772 29.6831 28.8958 29.7141C29.0196 29.745 29.1794 29.6728 29.3084 29.5181L29.7003 29.0643C29.9066 28.827 29.984 28.466 29.8808 28.2649C29.8086 28.1308 29.6797 28.0999 29.5353 28.1566V25.614L31.4641 23.7058L31.459 23.711Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M29.7778 22.9883C29.8448 23.1379 29.9892 23.1895 30.1594 23.107C30.3915 22.9883 30.5823 22.6583 30.5823 22.3695V21.8331C30.5823 21.6577 30.5204 21.5288 30.4069 21.4876C30.2935 21.4463 30.1439 21.4979 30.015 21.6268L27.2816 24.3344C27.1217 24.4943 27.0134 24.747 27.0134 24.9636V28.6459C27.0134 28.8316 27.0908 28.9605 27.2146 28.9914C27.3383 29.0224 27.4982 28.9502 27.6271 28.7955L28.0191 28.3416C28.2254 28.1044 28.3028 27.7434 28.1996 27.5422C28.1274 27.4081 27.9985 27.3772 27.8541 27.4339V24.8914L29.7829 22.9832L29.7778 22.9883Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M34.1305 26.8511C34.1305 27.0677 34.0221 27.3204 33.8623 27.4803L31.1289 30.1878C31 30.3168 30.8556 30.3683 30.7421 30.3271C30.6286 30.2858 30.5616 30.1621 30.5616 29.9867V26.3044C30.5616 26.0878 30.6699 25.8351 30.8298 25.6752L33.5631 22.9676C33.6921 22.8387 33.8365 22.7871 33.9499 22.8284C34.0634 22.8696 34.1305 22.9986 34.1305 23.1688V26.8562V26.8511ZM33.2898 24.3601L31.3971 26.2373V28.7954L33.2898 26.9233V24.3653V24.3601Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.62093 81.4623C4.20268 80.7403 3.30015 79.0332 3.30015 76.6041C3.30015 72.2565 6.19856 67.254 9.76741 65.4386L33.6973 53.2467C35.2754 52.4422 36.7194 52.3906 37.8437 52.9631L35.5436 51.7924C34.4193 51.2199 32.9752 51.2715 31.3971 52.076L7.46726 64.2679C3.89325 66.0884 1 71.091 1 75.4334C1 77.8625 1.90253 79.5696 3.32078 80.2916L5.62093 81.4623Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.62095 81.4615C6.74525 82.034 8.18929 81.9824 9.76743 81.1779L33.6973 68.986C37.2713 67.1655 40.1645 62.1629 40.1645 57.8205C40.1645 55.3914 39.262 53.6843 37.8437 52.9623C36.7195 52.3898 35.2754 52.4414 33.6973 53.246L9.76743 65.4378C6.19342 67.2583 3.30017 72.2609 3.30017 76.6034C3.30017 79.0324 4.2027 80.7395 5.62095 81.4615Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M30.6699 65.3707L21.9128 69.8318C21.1908 70.1979 20.608 69.7854 20.608 68.9086C20.608 68.0319 21.1908 67.0262 21.9128 66.66L30.6699 62.199C31.3919 61.8328 31.9747 62.2454 31.9747 63.1221C31.9747 63.9989 31.3919 65.0045 30.6699 65.3707Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M9.87575 73.9533C9.6282 74.3865 9.4838 74.8661 9.4838 75.2993C9.4838 75.7274 9.62304 76.0678 9.87575 76.2483C10.1233 76.4236 10.4637 76.4236 10.8195 76.2483C11.1754 76.0729 11.5106 75.7274 11.7633 75.2942L12.2326 74.4793C12.3616 74.2524 12.573 74.1492 12.702 74.2369C12.8309 74.3298 12.8309 74.5876 12.702 74.8094L12.2326 75.6242C11.8562 76.2689 11.3507 76.7846 10.8195 77.058C10.2883 77.3261 9.78291 77.3313 9.40643 77.0631C9.02995 76.8001 8.82367 76.2895 8.82367 75.6449C8.82367 75.0002 9.03511 74.273 9.40643 73.6284L9.87575 72.8135C10.0047 72.5866 10.2161 72.4834 10.3451 72.5711C10.474 72.6588 10.474 72.9218 10.3451 73.1436L9.87575 73.9584V73.9533Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M11.2888 70.9456C11.1599 70.8528 11.1599 70.5949 11.2888 70.3732L11.7582 69.5583C12.1346 68.9137 12.64 68.3979 13.1712 68.1246C13.7025 67.8513 14.2079 67.8513 14.5843 68.1194C14.9608 68.3825 15.1671 68.893 15.1671 69.5377C15.1671 70.1824 14.9557 70.9095 14.5843 71.5542L14.115 72.3691C13.9861 72.596 13.7746 72.6991 13.6457 72.6115C13.5168 72.5186 13.5168 72.2608 13.6457 72.039L14.115 71.2241C14.3626 70.7909 14.507 70.3113 14.507 69.8781C14.507 69.4449 14.3677 69.1096 14.115 68.9291C13.8675 68.7538 13.5271 68.7538 13.1712 68.9291C12.8206 69.1096 12.4802 69.45 12.2275 69.8832L11.7582 70.6981C11.6292 70.925 11.4178 71.0282 11.2888 70.9405V70.9456Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M10.8195 74.6185C10.6906 74.5256 10.6906 74.2678 10.8195 74.046L12.7019 70.7969C12.8309 70.57 13.0423 70.4668 13.1713 70.5545C13.3002 70.6473 13.3002 70.9052 13.1713 71.127L11.2889 74.3761C11.1599 74.603 10.9485 74.7061 10.8195 74.6185Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx b/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx
index f261b2738..e0c7c662f 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx
@@ -1,68 +1,20 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const EpicVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="166"
-    viewBox="0 0 162 166"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M146.362 35.9625C146.905 35.6869 147.249 35.0343 147.249 34.1061V22.2529C147.249 20.5899 146.139 18.6756 144.766 17.9795L114.001 2.35075C113.395 2.04136 112.837 2.02685 112.406 2.24438L114.568 1.14702C115 0.929488 115.557 0.944006 116.163 1.25339L146.929 16.8822C148.301 17.5783 149.411 19.4926 149.411 21.1555V33.0088C149.411 33.937 149.067 34.5896 148.524 34.8651L146.362 35.9625Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M146.362 35.9625C145.93 36.18 145.372 36.1655 144.766 35.8561L114.001 20.2274C112.629 19.5312 111.518 17.6169 111.518 15.954V4.1007C111.518 3.17254 111.863 2.51992 112.406 2.24438C112.837 2.02684 113.395 2.04136 114.001 2.35074L144.766 17.9795C146.139 18.6756 147.249 20.5899 147.249 22.2529V34.1061C147.249 35.0343 146.905 35.6869 146.362 35.9625Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M124.634 15.3787L131.772 19.0043C132.358 19.304 132.833 18.9657 132.833 18.255C132.833 17.5444 132.358 16.7226 131.772 16.4277L124.634 12.8021C124.048 12.5024 123.572 12.8408 123.572 13.5514C123.572 14.2621 124.048 15.0838 124.634 15.3787Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M125.143 21.3344L135.151 26.4199C135.976 26.8356 136.64 26.3667 136.64 25.3709C136.64 24.3702 135.971 23.2245 135.151 22.8088L125.143 17.7233C124.319 17.3075 123.655 17.7765 123.655 18.7723C123.655 19.7729 124.324 20.9186 125.143 21.3344Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M118.641 11.6999C118.69 11.8595 118.801 12.0142 118.927 12.077C119.102 12.1689 119.247 12.0625 119.247 11.845V11.4437C119.247 11.3132 119.199 11.1634 119.111 11.0473C119.024 10.9313 118.918 10.8588 118.816 10.854L116.755 10.796C116.634 10.796 116.551 10.8975 116.551 11.0618V13.827C116.551 13.9672 116.609 14.1218 116.702 14.2427C116.799 14.3636 116.915 14.4264 117.012 14.4119L117.308 14.3684C117.463 14.3442 117.521 14.1363 117.443 13.9043C117.39 13.7496 117.293 13.6239 117.186 13.5611V11.6516L118.636 11.6903L118.641 11.6999Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M117.376 9.87267C117.424 10.0322 117.536 10.1869 117.662 10.2497C117.836 10.3416 117.982 10.2352 117.982 10.0177V9.61645C117.982 9.48592 117.933 9.33606 117.846 9.22004C117.759 9.10402 117.652 9.03153 117.55 9.0267L115.489 8.96866C115.368 8.96866 115.286 9.0702 115.286 9.23456V11.9997C115.286 12.1399 115.344 12.2945 115.436 12.4154C115.533 12.5363 115.649 12.5991 115.746 12.5846L116.042 12.5411C116.197 12.5169 116.256 12.3091 116.178 12.077C116.125 11.9223 116.028 11.7966 115.921 11.7338V9.82431L117.371 9.86299L117.376 9.87267Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M120.518 12.9423C120.43 12.8215 120.324 12.749 120.227 12.749L118.166 12.6909C118.045 12.6909 117.962 12.7973 117.962 12.952V15.722C117.962 15.8525 118.011 15.9975 118.098 16.1135C118.19 16.2344 118.297 16.3069 118.394 16.3069L120.45 16.3649C120.576 16.3746 120.658 16.2682 120.658 16.1038V13.3339C120.658 13.2034 120.61 13.0584 120.518 12.9423ZM120.023 15.5141L118.597 15.4706V13.5514L120.023 13.5949V15.5141Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <g opacity="0.2">
+export function EpicVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="166"
+      viewBox="0 0 162 166"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
       <path
-        d="M7.92419 134.11C7.92419 135.937 9.29639 137.76 12.0359 139.157L47.3107 157.077C52.7947 159.861 61.6825 159.861 67.1664 157.077L141.29 119.424C144.029 118.032 145.401 116.209 145.401 114.382V120.217C145.401 122.044 144.029 123.866 141.29 125.259L67.1664 162.912C61.6825 165.696 52.7947 165.696 47.3107 162.912L12.0359 144.991C9.29155 143.599 7.92419 141.772 7.92419 139.945V134.11Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M146.362 35.9625C146.905 35.6869 147.249 35.0343 147.249 34.1061V22.2529C147.249 20.5899 146.139 18.6756 144.766 17.9795L114.001 2.35075C113.395 2.04136 112.837 2.02685 112.406 2.24438L114.568 1.14702C115 0.929488 115.557 0.944006 116.163 1.25339L146.929 16.8822C148.301 17.5783 149.411 19.4926 149.411 21.1555V33.0088C149.411 33.937 149.067 34.5896 148.524 34.8651L146.362 35.9625Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
@@ -70,17 +22,83 @@ export const EpicVerticalStackIllustration = ({ className }: TIllustrationAssetP
         strokeLinejoin="round"
       />
       <path
-        d="M7.92419 134.11C7.92419 132.283 9.29639 130.46 12.0359 129.068L86.1591 91.4148C91.643 88.6304 100.531 88.6304 106.015 91.4148L141.29 109.335C144.034 110.727 145.401 112.554 145.401 114.382C145.401 116.209 144.029 118.032 141.29 119.424L67.1664 157.077C61.6825 159.861 52.7947 159.861 47.3107 157.077L12.0359 139.157C9.29154 137.764 7.92419 135.937 7.92419 134.11Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M146.362 35.9625C145.93 36.18 145.372 36.1655 144.766 35.8561L114.001 20.2274C112.629 19.5312 111.518 17.6169 111.518 15.954V4.1007C111.518 3.17254 111.863 2.51992 112.406 2.24438C112.837 2.02684 113.395 2.04136 114.001 2.35074L144.766 17.9795C146.139 18.6756 147.249 20.5899 147.249 22.2529V34.1061C147.249 35.0343 146.905 35.6869 146.362 35.9625Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M7.92419 115.677C7.92419 117.505 9.29639 119.327 12.0359 120.724L47.3107 138.644C52.7947 141.429 61.6825 141.429 67.1664 138.644L141.29 100.991C144.029 99.599 145.401 97.7765 145.401 95.9492V101.784C145.401 103.611 144.029 105.434 141.29 106.826L67.1664 144.479C61.6825 147.264 52.7947 147.264 47.3107 144.479L12.0359 126.559C9.29155 125.167 7.92419 123.339 7.92419 121.512V115.677Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M124.634 15.3787L131.772 19.0043C132.358 19.304 132.833 18.9657 132.833 18.255C132.833 17.5444 132.358 16.7226 131.772 16.4277L124.634 12.8021C124.048 12.5024 123.572 12.8408 123.572 13.5514C123.572 14.2621 124.048 15.0838 124.634 15.3787Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M125.143 21.3344L135.151 26.4199C135.976 26.8356 136.64 26.3667 136.64 25.3709C136.64 24.3702 135.971 23.2245 135.151 22.8088L125.143 17.7233C124.319 17.3075 123.655 17.7765 123.655 18.7723C123.655 19.7729 124.324 20.9186 125.143 21.3344Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M118.641 11.6999C118.69 11.8595 118.801 12.0142 118.927 12.077C119.102 12.1689 119.247 12.0625 119.247 11.845V11.4437C119.247 11.3132 119.199 11.1634 119.111 11.0473C119.024 10.9313 118.918 10.8588 118.816 10.854L116.755 10.796C116.634 10.796 116.551 10.8975 116.551 11.0618V13.827C116.551 13.9672 116.609 14.1218 116.702 14.2427C116.799 14.3636 116.915 14.4264 117.012 14.4119L117.308 14.3684C117.463 14.3442 117.521 14.1363 117.443 13.9043C117.39 13.7496 117.293 13.6239 117.186 13.5611V11.6516L118.636 11.6903L118.641 11.6999Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M117.376 9.87267C117.424 10.0322 117.536 10.1869 117.662 10.2497C117.836 10.3416 117.982 10.2352 117.982 10.0177V9.61645C117.982 9.48592 117.933 9.33606 117.846 9.22004C117.759 9.10402 117.652 9.03153 117.55 9.0267L115.489 8.96866C115.368 8.96866 115.286 9.0702 115.286 9.23456V11.9997C115.286 12.1399 115.344 12.2945 115.436 12.4154C115.533 12.5363 115.649 12.5991 115.746 12.5846L116.042 12.5411C116.197 12.5169 116.256 12.3091 116.178 12.077C116.125 11.9223 116.028 11.7966 115.921 11.7338V9.82431L117.371 9.86299L117.376 9.87267Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M120.518 12.9423C120.43 12.8215 120.324 12.749 120.227 12.749L118.166 12.6909C118.045 12.6909 117.962 12.7973 117.962 12.952V15.722C117.962 15.8525 118.011 15.9975 118.098 16.1135C118.19 16.2344 118.297 16.3069 118.394 16.3069L120.45 16.3649C120.576 16.3746 120.658 16.2682 120.658 16.1038V13.3339C120.658 13.2034 120.61 13.0584 120.518 12.9423ZM120.023 15.5141L118.597 15.4706V13.5514L120.023 13.5949V15.5141Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <g opacity="0.2">
+        <path
+          d="M7.92419 134.11C7.92419 135.937 9.29639 137.76 12.0359 139.157L47.3107 157.077C52.7947 159.861 61.6825 159.861 67.1664 157.077L141.29 119.424C144.029 118.032 145.401 116.209 145.401 114.382V120.217C145.401 122.044 144.029 123.866 141.29 125.259L67.1664 162.912C61.6825 165.696 52.7947 165.696 47.3107 162.912L12.0359 144.991C9.29155 143.599 7.92419 141.772 7.92419 139.945V134.11Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M7.92419 134.11C7.92419 132.283 9.29639 130.46 12.0359 129.068L86.1591 91.4148C91.643 88.6304 100.531 88.6304 106.015 91.4148L141.29 109.335C144.034 110.727 145.401 112.554 145.401 114.382C145.401 116.209 144.029 118.032 141.29 119.424L67.1664 157.077C61.6825 159.861 52.7947 159.861 47.3107 157.077L12.0359 139.157C9.29154 137.764 7.92419 135.937 7.92419 134.11Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M7.92419 115.677C7.92419 117.505 9.29639 119.327 12.0359 120.724L47.3107 138.644C52.7947 141.429 61.6825 141.429 67.1664 138.644L141.29 100.991C144.029 99.599 145.401 97.7765 145.401 95.9492V101.784C145.401 103.611 144.029 105.434 141.29 106.826L67.1664 144.479C61.6825 147.264 52.7947 147.264 47.3107 144.479L12.0359 126.559C9.29155 125.167 7.92419 123.339 7.92419 121.512V115.677Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M7.92419 115.677C7.92419 113.85 9.29639 112.028 12.0359 110.635L86.1591 72.9823C91.643 70.1978 100.531 70.1978 106.015 72.9823L141.29 90.9024C144.034 92.2946 145.401 94.1219 145.401 95.9492C145.401 97.7765 144.029 99.599 141.29 100.991L67.1664 138.644C61.6825 141.429 52.7947 141.429 47.3107 138.644L12.0359 120.724C9.29154 119.332 7.92419 117.505 7.92419 115.677Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <path
+        d="M7.92419 97.2399C7.92419 99.0672 9.29639 100.89 12.0359 102.287L47.3107 120.207C52.7947 122.991 61.6825 122.991 67.1664 120.207L141.29 82.5538C144.029 81.1616 145.401 79.3391 145.401 77.5118V83.3466C145.401 85.1739 144.029 86.9964 141.29 88.3886L67.1664 126.042C61.6825 128.826 52.7947 128.826 47.3107 126.042L12.0359 108.122C9.29154 106.729 7.92419 104.902 7.92419 103.075V97.2399Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
@@ -88,137 +106,121 @@ export const EpicVerticalStackIllustration = ({ className }: TIllustrationAssetP
         strokeLinejoin="round"
       />
       <path
-        d="M7.92419 115.677C7.92419 113.85 9.29639 112.028 12.0359 110.635L86.1591 72.9823C91.643 70.1978 100.531 70.1978 106.015 72.9823L141.29 90.9024C144.034 92.2946 145.401 94.1219 145.401 95.9492C145.401 97.7765 144.029 99.599 141.29 100.991L67.1664 138.644C61.6825 141.429 52.7947 141.429 47.3107 138.644L12.0359 120.724C9.29154 119.332 7.92419 117.505 7.92419 115.677Z"
+        d="M7.92418 97.24C7.92418 95.4127 9.29638 93.5902 12.0359 92.198L86.1591 54.5449C91.643 51.7604 100.531 51.7604 106.015 54.5449L141.29 72.465C144.034 73.8573 145.401 75.6846 145.401 77.5119C145.401 79.3392 144.029 81.1616 141.29 82.5539L67.1664 120.207C61.6825 122.991 52.7947 122.991 47.3107 120.207L12.0359 102.287C9.29153 100.895 7.92418 99.0673 7.92418 97.24Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M7.92419 97.2399C7.92419 99.0672 9.29639 100.89 12.0359 102.287L47.3107 120.207C52.7947 122.991 61.6825 122.991 67.1664 120.207L141.29 82.5538C144.029 81.1616 145.401 79.3391 145.401 77.5118V83.3466C145.401 85.1739 144.029 86.9964 141.29 88.3886L67.1664 126.042C61.6825 128.826 52.7947 128.826 47.3107 126.042L12.0359 108.122C9.29154 106.729 7.92419 104.902 7.92419 103.075V97.2399Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M7.92418 97.24C7.92418 95.4127 9.29638 93.5902 12.0359 92.198L86.1591 54.5449C91.643 51.7604 100.531 51.7604 106.015 54.5449L141.29 72.465C144.034 73.8573 145.401 75.6846 145.401 77.5119C145.401 79.3392 144.029 81.1616 141.29 82.5539L67.1664 120.207C61.6825 122.991 52.7947 122.991 47.3107 120.207L12.0359 102.287C9.29153 100.895 7.92418 99.0673 7.92418 97.24Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M45.6234 106.575C45.2695 106.575 44.9397 106.497 44.6391 106.343L40.3189 104.148C39.4121 103.689 38.8933 102.62 38.8933 101.228V85.0918C38.8933 85.0241 38.9079 84.9516 38.937 84.8887L59.1418 41.1447C60.5867 38.5391 61.9395 36.997 63.4039 36.2525C64.0148 35.9431 64.6306 35.7836 65.2318 35.7836C65.8331 35.7836 66.4004 35.9334 66.9725 36.2235L71.2928 38.4182C71.6177 38.5826 71.9377 38.7904 72.2771 39.0611C72.3159 39.0901 72.345 39.124 72.3741 39.1627L86.4064 59.0648L92.2589 49.7253C93.4371 47.6031 95.0324 45.9498 96.7343 45.0845C97.5634 44.6639 98.3829 44.4512 99.1684 44.4512C99.7987 44.4512 100.385 44.5865 100.919 44.8621L105.239 47.0568C105.452 47.168 105.661 47.2985 105.855 47.4484L116.726 55.9758C116.842 56.0676 116.91 56.2078 116.91 56.3577V66.49C116.91 67.6164 116.575 68.8442 115.96 69.9464C115.344 71.0583 114.51 71.9236 113.613 72.378L46.9471 106.246C46.4962 106.473 46.0501 106.589 45.6186 106.589L45.6234 106.575Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M65.2318 36.2622C65.7749 36.2622 66.2792 36.4072 66.7543 36.6489L71.0746 38.8436C71.3898 39.0031 71.6904 39.2062 71.9813 39.4334L86.4307 59.9301L92.671 49.9718C93.8056 47.9269 95.3475 46.322 96.9525 45.505C97.7186 45.1183 98.4701 44.9249 99.1684 44.9249C99.7163 44.9249 100.235 45.0458 100.701 45.2827L105.021 47.4774C105.205 47.5741 105.384 47.6853 105.554 47.8206L116.425 56.348V66.4804C116.425 67.5197 116.11 68.675 115.538 69.7047C114.971 70.7247 114.2 71.5272 113.395 71.9381L46.7289 105.806C46.3362 106.004 45.9628 106.096 45.6186 106.096C45.3422 106.096 45.0852 106.033 44.8525 105.917L40.5322 103.723C39.8243 103.365 39.3733 102.48 39.3733 101.233V85.0966L59.5782 41.3525C60.7128 39.3077 62.0122 37.5046 63.6172 36.6876C64.1893 36.3975 64.7227 36.2719 65.227 36.2719M65.2318 35.2954C64.553 35.2954 63.8645 35.4694 63.1808 35.8174C61.1395 36.8568 59.6654 39.2013 58.7345 40.8739C58.7248 40.8933 58.7102 40.9174 58.7005 40.9368L38.4957 84.6809C38.4375 84.8066 38.4084 84.9467 38.4084 85.0869V101.223C38.4084 102.809 39.0242 104.032 40.0958 104.578L44.4161 106.773C44.7894 106.961 45.1919 107.058 45.6234 107.058C46.1325 107.058 46.6514 106.923 47.1702 106.662L113.836 72.7937C114.815 72.2958 115.722 71.3628 116.386 70.1688C117.036 68.9989 117.395 67.684 117.395 66.4755V56.3432C117.395 56.0483 117.259 55.7679 117.026 55.5842L106.155 47.0568C105.937 46.8876 105.705 46.7378 105.462 46.6121L101.142 44.4174C100.541 44.1128 99.8763 43.9533 99.1684 43.9533C98.3053 43.9533 97.4131 44.1853 96.5112 44.6397C94.7318 45.5437 93.0686 47.2598 91.8322 49.4739L86.3773 58.1753L72.7668 38.8678C72.7135 38.7904 72.6456 38.7228 72.5729 38.6648C72.2092 38.3795 71.8601 38.1523 71.5061 37.9735L67.1859 35.7788C66.541 35.45 65.8816 35.2857 65.2221 35.2857L65.2318 35.2954Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M105.026 47.4774C103.964 46.936 102.645 47.0085 101.278 47.7046C99.6726 48.5215 98.1307 50.1265 96.9961 52.1713L89.4514 64.2083L85.1311 62.0136L92.6758 49.9766C93.8104 47.9318 95.3523 46.3269 96.9573 45.5099C98.3246 44.8186 99.6435 44.7461 100.705 45.2827L105.026 47.4774Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M71.0746 38.8485C70.163 38.3844 69.1351 38.2732 67.9423 38.8775C66.3325 39.6944 65.0379 41.4975 63.9033 43.5424L43.6984 87.2865L39.3782 85.0918L59.583 41.3477C60.7176 39.3029 62.0171 37.4997 63.622 36.6827C64.8148 36.0785 65.8379 36.1897 66.7543 36.6537L71.0746 38.8485Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M43.6984 87.2865V103.423C43.6984 104.67 44.1542 105.555 44.8573 105.912L40.537 103.718C39.8291 103.36 39.3782 102.475 39.3782 101.228V85.0918L43.6984 87.2865Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M105.026 47.4774C105.21 47.5741 105.389 47.6853 105.559 47.8206L116.43 56.348V66.4804C116.43 67.5197 116.115 68.6751 115.543 69.7047C114.975 70.7247 114.204 71.5272 113.399 71.9381L46.7337 105.806C46.0258 106.164 45.3761 106.183 44.8621 105.922C44.1542 105.564 43.7033 104.68 43.7033 103.432V87.2962L63.9081 43.5521C65.0427 41.5072 66.3422 39.7041 67.9471 38.8871C69.1399 38.2829 70.163 38.394 71.0794 38.8581C71.3946 39.0176 71.6952 39.2207 71.9861 39.4479L89.4514 64.2228L96.9961 52.1858C98.1307 50.141 99.6726 48.5361 101.278 47.7191C102.645 47.0278 103.964 46.9553 105.026 47.4919V47.4774Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.34449 57.5372C4.01108 56.8604 3.16255 55.2603 3.16255 52.9834C3.16255 48.9083 5.88756 44.2191 9.24291 42.5175L31.7412 31.0896C33.2249 30.3355 34.5826 30.2872 35.6396 30.8238L33.4771 29.7264C32.42 29.1898 31.0624 29.2382 29.5786 29.9923L7.08035 41.4202C3.72016 43.1266 1 47.8157 1 51.8861C1 54.163 1.84853 55.7631 3.18195 56.4398L5.34449 57.5372Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.34449 57.5372C6.40152 58.0738 7.75918 58.0254 9.2429 57.2713L31.7412 45.8434C35.1014 44.137 37.8215 39.4479 37.8215 35.3775C37.8215 33.1006 36.973 31.5005 35.6396 30.8238C34.5826 30.2872 33.2249 30.3355 31.7412 31.0896L9.2429 42.5175C5.88271 44.224 3.16254 48.9131 3.16254 52.9834C3.16254 55.2603 4.01108 56.8604 5.34449 57.5372Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M12.317 46.9069C12.3995 46.7812 12.5207 46.7281 12.5983 46.7812C12.6758 46.8344 12.6807 46.9794 12.6128 47.1148L12.5983 47.1438L9.6599 52.2051C9.57748 52.3453 9.44656 52.413 9.36413 52.355C9.2817 52.297 9.2817 52.1375 9.36413 51.9924L12.3025 46.9311L12.317 46.9069Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M10.1399 48.5941C10.1399 48.3814 9.99932 48.2847 9.82476 48.3717C9.6502 48.4587 9.50959 48.7004 9.50959 48.9131C9.50959 49.1258 9.6502 49.2225 9.82476 49.1355C9.99932 49.0485 10.1399 48.8068 10.1399 48.5941ZM10.5618 48.3765C10.5618 48.8696 10.2321 49.4352 9.82476 49.6431C9.41746 49.8509 9.08775 49.6189 9.08775 49.1258C9.08775 48.6327 9.41746 48.0671 9.82476 47.8593C10.2321 47.6514 10.5618 47.8834 10.5618 48.3765Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M12.4528 50.2232C12.4528 50.0105 12.3122 49.9138 12.1376 50.0008C11.9631 50.0878 11.8225 50.3295 11.8225 50.5422C11.8225 50.7549 11.9631 50.8516 12.1376 50.7646C12.3122 50.6776 12.4528 50.4359 12.4528 50.2232ZM12.8698 50.0056C12.8698 50.4987 12.5401 51.0643 12.1328 51.2722C11.7255 51.48 11.3958 51.248 11.3958 50.7549C11.3958 50.2618 11.7255 49.6963 12.1328 49.4884C12.5401 49.2805 12.8698 49.5126 12.8698 50.0056Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M10.9109 45.0554C10.9109 44.9201 11.003 44.7654 11.1145 44.7122C11.7691 44.4222 12.4043 44.3255 12.9716 44.4463C13.5971 44.5769 14.1062 44.9588 14.4602 45.5485C14.8093 46.1383 14.9839 46.9214 14.9645 47.8061C14.9451 48.6955 14.7269 49.6575 14.3438 50.5954C13.9559 51.5332 13.4129 52.413 12.7728 53.1429C12.1279 53.8729 11.4103 54.424 10.6878 54.7382C9.96538 55.0524 9.26716 55.1249 8.66591 54.9412C8.12285 54.7721 7.67191 54.4047 7.36159 53.8632C7.30825 53.7714 7.35189 53.6022 7.45372 53.491C7.55554 53.3798 7.67676 53.3702 7.7301 53.462C8.01133 53.9406 8.40893 54.2645 8.8938 54.4143C9.43686 54.5787 10.0624 54.5158 10.7121 54.2306C11.3618 53.9454 12.0116 53.4523 12.5886 52.7949C13.1656 52.1375 13.6553 51.3495 14.0044 50.5035C14.3535 49.6575 14.5426 48.7922 14.562 47.9898C14.5814 47.1921 14.4262 46.4863 14.1111 45.9546C13.7959 45.4228 13.3353 45.0796 12.7728 44.9636C12.2685 44.8572 11.7061 44.9394 11.1242 45.1956C11.0127 45.244 10.9206 45.1811 10.9206 45.0458L10.9109 45.0554Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M28.895 42.4547L20.6618 46.6363C19.9829 46.9795 19.435 46.5927 19.435 45.7709C19.435 44.9491 19.9829 44.0065 20.6618 43.6632L28.895 39.4817C29.5738 39.1385 30.1217 39.5252 30.1217 40.347C30.1217 41.1688 29.5738 42.1115 28.895 42.4547Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M148.854 47.9076C149.911 47.371 151.269 47.4145 152.757 48.1735C156.117 49.88 158.837 54.569 158.837 58.6394C158.837 60.9114 157.989 62.5164 156.655 63.1932L158.818 62.0958C160.151 61.419 161 59.8141 161 57.5421C161 53.4669 158.275 48.7778 154.92 47.0761C153.436 46.322 152.073 46.2737 151.016 46.8103L148.854 47.9076Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M148.854 47.9076C147.52 48.5844 146.672 50.1893 146.672 52.4614C146.672 56.5365 149.397 61.2257 152.752 62.9273C154.236 63.6814 155.598 63.7297 156.655 63.1932C157.989 62.5164 158.837 60.9114 158.837 58.6394C158.837 54.5642 156.112 49.8751 152.757 48.1735C151.273 47.4194 149.911 47.371 148.854 47.9076Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M152.151 51.6299C152.296 51.7024 152.418 51.9103 152.418 52.0892V52.4131L154.013 53.2252V52.9013C154.013 52.7224 154.134 52.6403 154.28 52.7128C154.425 52.7853 154.546 52.9931 154.546 53.172V53.4959L155.08 53.7666C155.293 53.873 155.497 54.0808 155.642 54.3371C155.792 54.5933 155.875 54.8833 155.875 55.1395V56.4302V57.7209C155.875 57.8998 155.754 57.982 155.608 57.9095C155.463 57.837 155.341 57.6291 155.341 57.4502V56.4834L151.084 54.3177V57.223C151.084 57.31 151.113 57.4067 151.162 57.4889C151.21 57.5759 151.278 57.6436 151.351 57.6774L153.48 58.7603C153.625 58.8328 153.746 59.0407 153.746 59.2195C153.746 59.3984 153.625 59.4806 153.48 59.4081L151.351 58.3252C151.138 58.2189 150.934 58.011 150.788 57.7548C150.638 57.4986 150.556 57.2085 150.556 56.9523V52.4324C150.556 52.1762 150.638 51.9732 150.788 51.8668C150.939 51.7605 151.142 51.7605 151.351 51.8668L151.884 52.1375V51.8136C151.884 51.6348 152.006 51.5526 152.151 51.6251V51.6299ZM155.346 54.864V55.8308L151.089 53.6651V52.6983C151.089 52.6113 151.118 52.5436 151.167 52.5097C151.215 52.4759 151.283 52.4759 151.356 52.5097L151.889 52.7804V53.1044C151.889 53.2832 152.01 53.4862 152.156 53.5636C152.301 53.6409 152.423 53.5539 152.423 53.3751V53.0512L154.018 53.8633V54.1872C154.018 54.3661 154.139 54.5691 154.284 54.6464C154.43 54.7238 154.551 54.6368 154.551 54.4579V54.134L155.084 54.4047C155.157 54.4386 155.225 54.5111 155.274 54.5932C155.322 54.6803 155.351 54.777 155.351 54.8591L155.346 54.864ZM156.064 59.3355C156.166 59.263 156.166 59.06 156.064 58.8811C155.962 58.7023 155.792 58.6153 155.686 58.6878L154.808 59.3065L154.464 58.7119C154.362 58.5331 154.192 58.4461 154.086 58.5186C153.984 58.5911 153.984 58.7941 154.086 58.973L154.619 59.8915C154.721 60.0703 154.891 60.1574 154.997 60.0848L156.064 59.3355Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M45.6234 106.575C45.2695 106.575 44.9397 106.497 44.6391 106.343L40.3189 104.148C39.4121 103.689 38.8933 102.62 38.8933 101.228V85.0918C38.8933 85.0241 38.9079 84.9516 38.937 84.8887L59.1418 41.1447C60.5867 38.5391 61.9395 36.997 63.4039 36.2525C64.0148 35.9431 64.6306 35.7836 65.2318 35.7836C65.8331 35.7836 66.4004 35.9334 66.9725 36.2235L71.2928 38.4182C71.6177 38.5826 71.9377 38.7904 72.2771 39.0611C72.3159 39.0901 72.345 39.124 72.3741 39.1627L86.4064 59.0648L92.2589 49.7253C93.4371 47.6031 95.0324 45.9498 96.7343 45.0845C97.5634 44.6639 98.3829 44.4512 99.1684 44.4512C99.7987 44.4512 100.385 44.5865 100.919 44.8621L105.239 47.0568C105.452 47.168 105.661 47.2985 105.855 47.4484L116.726 55.9758C116.842 56.0676 116.91 56.2078 116.91 56.3577V66.49C116.91 67.6164 116.575 68.8442 115.96 69.9464C115.344 71.0583 114.51 71.9236 113.613 72.378L46.9471 106.246C46.4962 106.473 46.0501 106.589 45.6186 106.589L45.6234 106.575Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M65.2318 36.2622C65.7749 36.2622 66.2792 36.4072 66.7543 36.6489L71.0746 38.8436C71.3898 39.0031 71.6904 39.2062 71.9813 39.4334L86.4307 59.9301L92.671 49.9718C93.8056 47.9269 95.3475 46.322 96.9525 45.505C97.7186 45.1183 98.4701 44.9249 99.1684 44.9249C99.7163 44.9249 100.235 45.0458 100.701 45.2827L105.021 47.4774C105.205 47.5741 105.384 47.6853 105.554 47.8206L116.425 56.348V66.4804C116.425 67.5197 116.11 68.675 115.538 69.7047C114.971 70.7247 114.2 71.5272 113.395 71.9381L46.7289 105.806C46.3362 106.004 45.9628 106.096 45.6186 106.096C45.3422 106.096 45.0852 106.033 44.8525 105.917L40.5322 103.723C39.8243 103.365 39.3733 102.48 39.3733 101.233V85.0966L59.5782 41.3525C60.7128 39.3077 62.0122 37.5046 63.6172 36.6876C64.1893 36.3975 64.7227 36.2719 65.227 36.2719M65.2318 35.2954C64.553 35.2954 63.8645 35.4694 63.1808 35.8174C61.1395 36.8568 59.6654 39.2013 58.7345 40.8739C58.7248 40.8933 58.7102 40.9174 58.7005 40.9368L38.4957 84.6809C38.4375 84.8066 38.4084 84.9467 38.4084 85.0869V101.223C38.4084 102.809 39.0242 104.032 40.0958 104.578L44.4161 106.773C44.7894 106.961 45.1919 107.058 45.6234 107.058C46.1325 107.058 46.6514 106.923 47.1702 106.662L113.836 72.7937C114.815 72.2958 115.722 71.3628 116.386 70.1688C117.036 68.9989 117.395 67.684 117.395 66.4755V56.3432C117.395 56.0483 117.259 55.7679 117.026 55.5842L106.155 47.0568C105.937 46.8876 105.705 46.7378 105.462 46.6121L101.142 44.4174C100.541 44.1128 99.8763 43.9533 99.1684 43.9533C98.3053 43.9533 97.4131 44.1853 96.5112 44.6397C94.7318 45.5437 93.0686 47.2598 91.8322 49.4739L86.3773 58.1753L72.7668 38.8678C72.7135 38.7904 72.6456 38.7228 72.5729 38.6648C72.2092 38.3795 71.8601 38.1523 71.5061 37.9735L67.1859 35.7788C66.541 35.45 65.8816 35.2857 65.2221 35.2857L65.2318 35.2954Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M105.026 47.4774C103.964 46.936 102.645 47.0085 101.278 47.7046C99.6726 48.5215 98.1307 50.1265 96.9961 52.1713L89.4514 64.2083L85.1311 62.0136L92.6758 49.9766C93.8104 47.9318 95.3523 46.3269 96.9573 45.5099C98.3246 44.8186 99.6435 44.7461 100.705 45.2827L105.026 47.4774Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M71.0746 38.8485C70.163 38.3844 69.1351 38.2732 67.9423 38.8775C66.3325 39.6944 65.0379 41.4975 63.9033 43.5424L43.6984 87.2865L39.3782 85.0918L59.583 41.3477C60.7176 39.3029 62.0171 37.4997 63.622 36.6827C64.8148 36.0785 65.8379 36.1897 66.7543 36.6537L71.0746 38.8485Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M43.6984 87.2865V103.423C43.6984 104.67 44.1542 105.555 44.8573 105.912L40.537 103.718C39.8291 103.36 39.3782 102.475 39.3782 101.228V85.0918L43.6984 87.2865Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M105.026 47.4774C105.21 47.5741 105.389 47.6853 105.559 47.8206L116.43 56.348V66.4804C116.43 67.5197 116.115 68.6751 115.543 69.7047C114.975 70.7247 114.204 71.5272 113.399 71.9381L46.7337 105.806C46.0258 106.164 45.3761 106.183 44.8621 105.922C44.1542 105.564 43.7033 104.68 43.7033 103.432V87.2962L63.9081 43.5521C65.0427 41.5072 66.3422 39.7041 67.9471 38.8871C69.1399 38.2829 70.163 38.394 71.0794 38.8581C71.3946 39.0176 71.6952 39.2207 71.9861 39.4479L89.4514 64.2228L96.9961 52.1858C98.1307 50.141 99.6726 48.5361 101.278 47.7191C102.645 47.0278 103.964 46.9553 105.026 47.4919V47.4774Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.34449 57.5372C4.01108 56.8604 3.16255 55.2603 3.16255 52.9834C3.16255 48.9083 5.88756 44.2191 9.24291 42.5175L31.7412 31.0896C33.2249 30.3355 34.5826 30.2872 35.6396 30.8238L33.4771 29.7264C32.42 29.1898 31.0624 29.2382 29.5786 29.9923L7.08035 41.4202C3.72016 43.1266 1 47.8157 1 51.8861C1 54.163 1.84853 55.7631 3.18195 56.4398L5.34449 57.5372Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.34449 57.5372C6.40152 58.0738 7.75918 58.0254 9.2429 57.2713L31.7412 45.8434C35.1014 44.137 37.8215 39.4479 37.8215 35.3775C37.8215 33.1006 36.973 31.5005 35.6396 30.8238C34.5826 30.2872 33.2249 30.3355 31.7412 31.0896L9.2429 42.5175C5.88271 44.224 3.16254 48.9131 3.16254 52.9834C3.16254 55.2603 4.01108 56.8604 5.34449 57.5372Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M12.317 46.9069C12.3995 46.7812 12.5207 46.7281 12.5983 46.7812C12.6758 46.8344 12.6807 46.9794 12.6128 47.1148L12.5983 47.1438L9.6599 52.2051C9.57748 52.3453 9.44656 52.413 9.36413 52.355C9.2817 52.297 9.2817 52.1375 9.36413 51.9924L12.3025 46.9311L12.317 46.9069Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M10.1399 48.5941C10.1399 48.3814 9.99932 48.2847 9.82476 48.3717C9.6502 48.4587 9.50959 48.7004 9.50959 48.9131C9.50959 49.1258 9.6502 49.2225 9.82476 49.1355C9.99932 49.0485 10.1399 48.8068 10.1399 48.5941ZM10.5618 48.3765C10.5618 48.8696 10.2321 49.4352 9.82476 49.6431C9.41746 49.8509 9.08775 49.6189 9.08775 49.1258C9.08775 48.6327 9.41746 48.0671 9.82476 47.8593C10.2321 47.6514 10.5618 47.8834 10.5618 48.3765Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M12.4528 50.2232C12.4528 50.0105 12.3122 49.9138 12.1376 50.0008C11.9631 50.0878 11.8225 50.3295 11.8225 50.5422C11.8225 50.7549 11.9631 50.8516 12.1376 50.7646C12.3122 50.6776 12.4528 50.4359 12.4528 50.2232ZM12.8698 50.0056C12.8698 50.4987 12.5401 51.0643 12.1328 51.2722C11.7255 51.48 11.3958 51.248 11.3958 50.7549C11.3958 50.2618 11.7255 49.6963 12.1328 49.4884C12.5401 49.2805 12.8698 49.5126 12.8698 50.0056Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M10.9109 45.0554C10.9109 44.9201 11.003 44.7654 11.1145 44.7122C11.7691 44.4222 12.4043 44.3255 12.9716 44.4463C13.5971 44.5769 14.1062 44.9588 14.4602 45.5485C14.8093 46.1383 14.9839 46.9214 14.9645 47.8061C14.9451 48.6955 14.7269 49.6575 14.3438 50.5954C13.9559 51.5332 13.4129 52.413 12.7728 53.1429C12.1279 53.8729 11.4103 54.424 10.6878 54.7382C9.96538 55.0524 9.26716 55.1249 8.66591 54.9412C8.12285 54.7721 7.67191 54.4047 7.36159 53.8632C7.30825 53.7714 7.35189 53.6022 7.45372 53.491C7.55554 53.3798 7.67676 53.3702 7.7301 53.462C8.01133 53.9406 8.40893 54.2645 8.8938 54.4143C9.43686 54.5787 10.0624 54.5158 10.7121 54.2306C11.3618 53.9454 12.0116 53.4523 12.5886 52.7949C13.1656 52.1375 13.6553 51.3495 14.0044 50.5035C14.3535 49.6575 14.5426 48.7922 14.562 47.9898C14.5814 47.1921 14.4262 46.4863 14.1111 45.9546C13.7959 45.4228 13.3353 45.0796 12.7728 44.9636C12.2685 44.8572 11.7061 44.9394 11.1242 45.1956C11.0127 45.244 10.9206 45.1811 10.9206 45.0458L10.9109 45.0554Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M28.895 42.4547L20.6618 46.6363C19.9829 46.9795 19.435 46.5927 19.435 45.7709C19.435 44.9491 19.9829 44.0065 20.6618 43.6632L28.895 39.4817C29.5738 39.1385 30.1217 39.5252 30.1217 40.347C30.1217 41.1688 29.5738 42.1115 28.895 42.4547Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M148.854 47.9076C149.911 47.371 151.269 47.4145 152.757 48.1735C156.117 49.88 158.837 54.569 158.837 58.6394C158.837 60.9114 157.989 62.5164 156.655 63.1932L158.818 62.0958C160.151 61.419 161 59.8141 161 57.5421C161 53.4669 158.275 48.7778 154.92 47.0761C153.436 46.322 152.073 46.2737 151.016 46.8103L148.854 47.9076Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M148.854 47.9076C147.52 48.5844 146.672 50.1893 146.672 52.4614C146.672 56.5365 149.397 61.2257 152.752 62.9273C154.236 63.6814 155.598 63.7297 156.655 63.1932C157.989 62.5164 158.837 60.9114 158.837 58.6394C158.837 54.5642 156.112 49.8751 152.757 48.1735C151.273 47.4194 149.911 47.371 148.854 47.9076Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M152.151 51.6299C152.296 51.7024 152.418 51.9103 152.418 52.0892V52.4131L154.013 53.2252V52.9013C154.013 52.7224 154.134 52.6403 154.28 52.7128C154.425 52.7853 154.546 52.9931 154.546 53.172V53.4959L155.08 53.7666C155.293 53.873 155.497 54.0808 155.642 54.3371C155.792 54.5933 155.875 54.8833 155.875 55.1395V56.4302V57.7209C155.875 57.8998 155.754 57.982 155.608 57.9095C155.463 57.837 155.341 57.6291 155.341 57.4502V56.4834L151.084 54.3177V57.223C151.084 57.31 151.113 57.4067 151.162 57.4889C151.21 57.5759 151.278 57.6436 151.351 57.6774L153.48 58.7603C153.625 58.8328 153.746 59.0407 153.746 59.2195C153.746 59.3984 153.625 59.4806 153.48 59.4081L151.351 58.3252C151.138 58.2189 150.934 58.011 150.788 57.7548C150.638 57.4986 150.556 57.2085 150.556 56.9523V52.4324C150.556 52.1762 150.638 51.9732 150.788 51.8668C150.939 51.7605 151.142 51.7605 151.351 51.8668L151.884 52.1375V51.8136C151.884 51.6348 152.006 51.5526 152.151 51.6251V51.6299ZM155.346 54.864V55.8308L151.089 53.6651V52.6983C151.089 52.6113 151.118 52.5436 151.167 52.5097C151.215 52.4759 151.283 52.4759 151.356 52.5097L151.889 52.7804V53.1044C151.889 53.2832 152.01 53.4862 152.156 53.5636C152.301 53.6409 152.423 53.5539 152.423 53.3751V53.0512L154.018 53.8633V54.1872C154.018 54.3661 154.139 54.5691 154.284 54.6464C154.43 54.7238 154.551 54.6368 154.551 54.4579V54.134L155.084 54.4047C155.157 54.4386 155.225 54.5111 155.274 54.5932C155.322 54.6803 155.351 54.777 155.351 54.8591L155.346 54.864ZM156.064 59.3355C156.166 59.263 156.166 59.06 156.064 58.8811C155.962 58.7023 155.792 58.6153 155.686 58.6878L154.808 59.3065L154.464 58.7119C154.362 58.5331 154.192 58.4461 154.086 58.5186C153.984 58.5911 153.984 58.7941 154.086 58.973L154.619 59.8915C154.721 60.0703 154.891 60.1574 154.997 60.0848L156.064 59.3355Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx b/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx
index d8cc14486..431998d20 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const InitiativeVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="171"
-    viewBox="0 0 162 171"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function InitiativeVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="171"
+      viewBox="0 0 162 171"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M11.214 138.932C11.214 140.799 12.6117 142.661 15.4023 144.088L51.3337 162.397C56.9198 165.242 65.973 165.242 71.5591 162.397L147.062 123.927C149.853 122.504 151.25 120.642 151.25 118.775V124.737C151.25 126.604 149.853 128.466 147.062 129.888L71.5591 168.358C65.973 171.203 56.9198 171.203 51.3337 168.358L15.4023 150.049C12.6068 148.627 11.214 146.76 11.214 144.893V138.932Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M11.214 138.931C11.214 137.064 12.6117 135.202 15.4023 133.78L90.9053 95.3094C96.4913 92.4646 105.545 92.4646 111.131 95.3094L147.062 113.618C149.858 115.041 151.25 116.908 151.25 118.775C151.25 120.642 149.853 122.504 147.062 123.926L71.5591 162.396C65.973 165.241 56.9198 165.241 51.3337 162.396L15.4023 144.087C12.6068 142.665 11.214 140.798 11.214 138.931Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M11.214 120.094C11.214 121.961 12.6117 123.823 15.4023 125.25L51.3337 143.559C56.9198 146.404 65.973 146.404 71.5591 143.559L147.062 105.089C149.853 103.666 151.25 101.804 151.25 99.9375V105.899C151.25 107.766 149.853 109.628 147.062 111.05L71.5591 149.52C65.973 152.365 56.9198 152.365 51.3337 149.52L15.4023 131.211C12.6068 129.789 11.214 127.922 11.214 126.055V120.094Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M11.2139 120.094C11.2139 118.227 12.6117 116.365 15.4022 114.943L90.9052 76.4725C96.4913 73.6276 105.545 73.6276 111.131 76.4725L147.062 94.7815C149.858 96.204 151.25 98.0709 151.25 99.9379C151.25 101.805 149.853 103.667 147.062 105.089L71.559 143.559C65.973 146.404 56.9197 146.404 51.3337 143.559L15.4022 125.25C12.6067 123.828 11.2139 121.961 11.2139 120.094Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M11.214 138.932C11.214 140.799 12.6117 142.661 15.4023 144.088L51.3337 162.397C56.9198 165.242 65.973 165.242 71.5591 162.397L147.062 123.927C149.853 122.504 151.25 120.642 151.25 118.775V124.737C151.25 126.604 149.853 128.466 147.062 129.888L71.5591 168.358C65.973 171.203 56.9198 171.203 51.3337 168.358L15.4023 150.049C12.6068 148.627 11.214 146.76 11.214 144.893V138.932Z"
+        d="M11.214 101.262C11.214 103.129 12.6117 104.991 15.4023 106.418L51.3337 124.727C56.9198 127.572 65.973 127.572 71.5591 124.727L147.062 86.2569C149.853 84.8344 151.25 82.9724 151.25 81.1055V87.0669C151.25 88.9338 149.853 90.7959 147.062 92.2183L71.5591 130.688C65.973 133.533 56.9198 133.533 51.3337 130.688L15.4023 112.379C12.6068 110.957 11.214 109.09 11.214 107.223V101.262Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -20,17 +56,17 @@ export const InitiativeVerticalStackIllustration = ({ className }: TIllustration
         strokeLinejoin="round"
       />
       <path
-        d="M11.214 138.931C11.214 137.064 12.6117 135.202 15.4023 133.78L90.9053 95.3094C96.4913 92.4646 105.545 92.4646 111.131 95.3094L147.062 113.618C149.858 115.041 151.25 116.908 151.25 118.775C151.25 120.642 149.853 122.504 147.062 123.926L71.5591 162.396C65.973 165.241 56.9198 165.241 51.3337 162.396L15.4023 144.087C12.6068 142.665 11.214 140.798 11.214 138.931Z"
+        d="M11.214 101.262C11.214 99.3951 12.6117 97.5331 15.4023 96.1106L90.9053 57.6405C96.4913 54.7956 105.545 54.7956 111.131 57.6405L147.062 75.9495C149.858 77.3719 151.25 79.2389 151.25 81.1058C151.25 82.9728 149.853 84.8348 147.062 86.2573L71.5591 124.727C65.973 127.572 56.9198 127.572 51.3337 124.727L15.4023 106.418C12.6068 104.996 11.214 103.129 11.214 101.262Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M11.214 120.094C11.214 121.961 12.6117 123.823 15.4023 125.25L51.3337 143.559C56.9198 146.404 65.973 146.404 71.5591 143.559L147.062 105.089C149.853 103.666 151.25 101.804 151.25 99.9375V105.899C151.25 107.766 149.853 109.628 147.062 111.05L71.5591 149.52C65.973 152.365 56.9198 152.365 51.3337 149.52L15.4023 131.211C12.6068 129.789 11.214 127.922 11.214 126.055V120.094Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M148.628 49.0214C149.704 48.4732 151.087 48.5176 152.604 49.293C156.026 51.0365 158.797 55.8274 158.797 59.986C158.797 62.3074 157.933 63.9472 156.575 64.6386L158.777 63.5175C160.136 62.826 161 61.1862 161 58.8649C161 54.7013 158.224 49.9104 154.806 48.1719C153.295 47.4014 151.907 47.352 150.83 47.9002L148.628 49.0214Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -38,211 +74,177 @@ export const InitiativeVerticalStackIllustration = ({ className }: TIllustration
         strokeLinejoin="round"
       />
       <path
-        d="M11.2139 120.094C11.2139 118.227 12.6117 116.365 15.4022 114.943L90.9052 76.4725C96.4913 73.6276 105.545 73.6276 111.131 76.4725L147.062 94.7815C149.858 96.204 151.25 98.0709 151.25 99.9379C151.25 101.805 149.853 103.667 147.062 105.089L71.559 143.559C65.973 146.404 56.9197 146.404 51.3337 143.559L15.4022 125.25C12.6067 123.828 11.2139 121.961 11.2139 120.094Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M148.628 49.0213C147.269 49.7128 146.405 51.3525 146.405 53.6739C146.405 57.8375 149.181 62.6284 152.599 64.3669C154.11 65.1374 155.498 65.1868 156.575 64.6385C157.933 63.9471 158.797 62.3073 158.797 59.986C158.797 55.8224 156.021 51.0315 152.604 49.293C151.092 48.5225 149.704 48.4731 148.628 49.0213Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M11.214 101.262C11.214 103.129 12.6117 104.991 15.4023 106.418L51.3337 124.727C56.9198 127.572 65.973 127.572 71.5591 124.727L147.062 86.2569C149.853 84.8344 151.25 82.9724 151.25 81.1055V87.0669C151.25 88.9338 149.853 90.7959 147.062 92.2183L71.5591 130.688C65.973 133.533 56.9198 133.533 51.3337 130.688L15.4023 112.379C12.6068 110.957 11.214 109.09 11.214 107.223V101.262Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M11.214 101.262C11.214 99.3951 12.6117 97.5331 15.4023 96.1106L90.9053 57.6405C96.4913 54.7956 105.545 54.7956 111.131 57.6405L147.062 75.9495C149.858 77.3719 151.25 79.2389 151.25 81.1058C151.25 82.9728 149.853 84.8348 147.062 86.2573L71.5591 124.727C65.973 127.572 56.9198 127.572 51.3337 124.727L15.4023 106.418C12.6068 104.996 11.214 103.129 11.214 101.262Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M148.628 49.0214C149.704 48.4732 151.087 48.5176 152.604 49.293C156.026 51.0365 158.797 55.8274 158.797 59.986C158.797 62.3074 157.933 63.9472 156.575 64.6386L158.777 63.5175C160.136 62.826 161 61.1862 161 58.8649C161 54.7013 158.224 49.9104 154.806 48.1719C153.295 47.4014 151.907 47.352 150.83 47.9002L148.628 49.0214Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M148.628 49.0213C147.269 49.7128 146.405 51.3525 146.405 53.6739C146.405 57.8375 149.181 62.6284 152.599 64.3669C154.11 65.1374 155.498 65.1868 156.575 64.6385C157.933 63.9471 158.797 62.3073 158.797 59.986C158.797 55.8224 156.021 51.0315 152.604 49.293C151.092 48.5225 149.704 48.4731 148.628 49.0213Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M154.308 55.0311C154.135 54.7348 153.903 54.4977 153.656 54.3742C153.414 54.2508 153.177 54.2508 153.004 54.3742L150.381 56.2264C150.095 56.4289 149.932 56.8191 149.932 57.313C149.932 57.8069 150.095 58.36 150.381 58.8589C150.668 59.3528 151.058 59.7479 151.463 59.9553C151.868 60.1628 152.258 60.1628 152.544 59.9603L155.355 57.9748C155.473 57.8908 155.666 57.9896 155.789 58.197C155.908 58.4045 155.908 58.6366 155.789 58.7255L152.979 60.711C152.579 60.9975 152.031 60.9925 151.463 60.7011C150.895 60.4097 150.351 59.8615 149.946 59.1651C149.546 58.4736 149.319 57.6933 149.319 57.0018C149.319 56.3103 149.546 55.7621 149.946 55.4806L152.564 53.6284C152.851 53.4259 153.241 53.4259 153.646 53.6284C154.051 53.8359 154.441 54.231 154.727 54.7249C155.014 55.2188 155.177 55.7769 155.177 56.2708C155.177 56.7647 155.014 57.1549 154.727 57.3623L152.1 59.2145C151.927 59.338 151.695 59.333 151.453 59.2145C151.211 59.0959 150.974 58.8539 150.806 58.5576C150.638 58.2612 150.539 57.9254 150.539 57.6291C150.539 57.3327 150.638 57.1006 150.806 56.9771L153.404 55.1447C153.522 55.0608 153.715 55.1595 153.838 55.367C153.957 55.5744 153.957 55.8065 153.838 55.8905L151.24 57.7229C151.181 57.7624 151.152 57.8414 151.152 57.9402C151.152 58.039 151.186 58.1477 151.24 58.2514C151.3 58.3502 151.374 58.4292 151.458 58.4687C151.542 58.5082 151.616 58.5082 151.675 58.4687L154.303 56.6166C154.476 56.4931 154.569 56.2609 154.569 55.9646C154.569 55.6683 154.471 55.3324 154.298 55.0361L154.308 55.0311Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M78.8145 95.4679C78.7256 95.4679 78.6416 95.463 78.5576 95.4482C78.4095 95.4284 78.2514 95.379 78.0934 95.3099L73.6828 93.0626C73.5494 92.9935 73.4309 92.9045 73.3124 92.7959C73.0704 92.544 72.9123 92.2575 72.8234 91.9266C72.7345 91.6155 72.7049 91.2648 72.7345 90.8845C72.7691 90.4992 72.853 90.1239 72.9913 89.7534C73.1346 89.3731 73.3124 89.0175 73.5297 88.6965C73.7371 88.3804 73.989 88.0939 74.2705 87.842L71.7516 86.5579C71.564 86.469 71.3861 86.3208 71.233 86.1233C70.8577 85.654 70.7144 84.9478 70.828 84.1427C70.8774 83.7822 70.9811 83.4068 71.1441 83.0215C71.2923 82.661 71.4948 82.3153 71.7368 81.9893C71.964 81.6732 72.2357 81.3966 72.532 81.1743C72.8234 80.9472 73.1346 80.7842 73.4507 80.7002C73.6532 80.6409 73.8606 80.5817 74.073 80.5175L71.7467 79.3321C71.6282 79.2778 71.5047 79.1889 71.3763 79.0703C71.0058 78.7048 70.8033 78.1763 70.7836 77.5293C70.7688 76.9416 70.6404 76.4181 70.4082 75.9587C70.0773 75.8254 69.781 75.692 69.5093 75.5537L65.1086 73.3114C62.3823 71.9235 60.219 69.4441 58.8608 66.1449C57.0481 61.7146 56.7222 55.8667 57.947 49.6781C59.1769 43.5043 61.9081 37.1379 65.647 31.7494C69.3908 26.3412 74.0631 22.0393 78.8046 19.629C81.7186 18.1424 84.5635 17.3867 87.2651 17.3867C89.0185 17.3867 90.678 17.7127 92.1943 18.3548C92.4462 18.4634 92.6981 18.582 92.9401 18.7054L97.3408 20.9478C100.847 22.7357 103.322 26.1831 104.497 30.9098C105.727 35.8488 105.416 42.0078 103.608 48.2507C101.806 54.4739 98.5706 60.623 94.4909 65.5719C92.7771 67.6562 91.7251 70.0121 91.6757 71.8692C91.6609 72.4668 91.4831 73.1237 91.1818 73.7164C90.8854 74.319 90.4755 74.8376 89.9964 75.2179C89.6458 75.4945 89.2704 75.7809 88.8456 76.097L90.762 77.0749C90.9694 77.1836 91.1522 77.3318 91.3003 77.5244C91.4979 77.7911 91.6263 78.1023 91.6905 78.4628C91.7448 78.8234 91.7448 79.1889 91.6806 79.5692C91.6214 79.9396 91.5028 80.3248 91.33 80.7051C91.162 81.0805 90.9546 81.4312 90.7076 81.7423C90.4459 82.0683 90.1644 82.335 89.8779 82.5326C88.9148 83.2487 87.8924 83.9451 86.8305 84.607L88.7567 85.5898C89.3 85.8615 89.6507 86.4492 89.7198 87.2049C89.784 87.8865 89.6161 88.6718 89.2506 89.4127C88.8802 90.1535 88.3517 90.761 87.764 91.1364C85.0376 92.8749 82.2668 94.2875 79.5207 95.3346C79.2837 95.4284 79.0416 95.4728 78.8046 95.4728L78.8145 95.4679Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M87.2701 17.8707C88.9494 17.8707 90.5447 18.177 92.0066 18.7993C92.2486 18.903 92.4907 19.0166 92.7228 19.1351L97.1235 21.3774C100.472 23.0864 102.887 26.4449 104.023 31.0184C105.243 35.9081 104.927 41.9189 103.139 48.1026C101.346 54.2961 98.1755 60.3217 94.1156 65.2459C92.3425 67.4043 91.2411 69.8837 91.1868 71.8445C91.1719 72.368 91.0188 72.9459 90.7472 73.4842C90.4805 74.0226 90.11 74.4918 89.6952 74.8227C89.1074 75.2919 88.5098 75.7315 87.9072 76.1612L90.5447 77.5046C90.6879 77.5787 90.8114 77.6824 90.9151 77.8158C91.0583 78.0084 91.1571 78.2504 91.2065 78.5369C91.251 78.8233 91.251 79.1444 91.1966 79.4802C91.1423 79.8161 91.0336 80.1618 90.8855 80.4927C90.7373 80.8286 90.5496 81.1447 90.3274 81.4262C90.1051 81.7028 89.8631 81.9399 89.6063 82.1177C88.3567 83.0462 87.0923 83.8809 85.8279 84.6366L88.5394 86.0195C88.9346 86.2171 89.1815 86.6566 89.2358 87.2395C89.2902 87.8321 89.1371 88.5335 88.816 89.1854C88.49 89.8374 88.0208 90.3856 87.5072 90.7116C84.8006 92.4353 82.0644 93.8281 79.3528 94.8653C79.1701 94.9394 78.9873 94.974 78.8145 94.974C78.7503 94.974 78.691 94.974 78.6317 94.9592C78.5181 94.9443 78.4095 94.9098 78.3058 94.8604L73.9051 92.6181C73.8112 92.5687 73.7273 92.5045 73.6482 92.4304C73.4902 92.2674 73.3667 92.055 73.2976 91.7932C73.2235 91.5315 73.1988 91.2351 73.2235 90.9141C73.2531 90.5881 73.3272 90.2523 73.4507 89.9164C73.5742 89.5855 73.7372 89.2595 73.9347 88.9632C74.1323 88.6668 74.3595 88.41 74.6015 88.1927C74.8139 88.0149 75.0312 87.8766 75.2485 87.7827L71.969 86.1084C71.8356 86.0442 71.7171 85.9405 71.6183 85.8121C71.3269 85.4466 71.2182 84.8638 71.3121 84.2019C71.3565 83.876 71.4553 83.5352 71.5936 83.2043C71.7319 82.8733 71.9146 82.5622 72.127 82.2807C72.3345 81.9942 72.5715 81.7522 72.8234 81.5645C73.0704 81.3719 73.3272 81.2385 73.5791 81.1694C74.1619 81.0064 74.7546 80.8138 75.3423 80.6014L71.969 78.8826C71.8751 78.8382 71.7912 78.7739 71.7121 78.6999C71.4405 78.4332 71.2923 78.0133 71.2775 77.5046C71.2578 76.7638 71.075 76.1019 70.7589 75.5537C70.4132 75.4203 70.0674 75.2722 69.7365 75.1042L65.3359 72.8619C62.7132 71.5284 60.6438 69.1626 59.3201 65.9473C57.5322 61.5812 57.221 55.8963 58.436 49.7621C59.656 43.6278 62.3329 37.3898 66.057 32.0211C69.776 26.6523 74.3397 22.4443 79.0318 20.0587C81.8767 18.6066 84.6771 17.8707 87.2701 17.8707ZM87.2701 16.8829C84.4894 16.8829 81.5655 17.6534 78.5823 19.1796C73.7717 21.6244 69.0352 25.9856 65.247 31.458C61.4735 36.9008 58.7077 43.3314 57.468 49.5694C56.2233 55.8568 56.5543 61.8034 58.4064 66.3226C59.814 69.7355 62.0514 72.3038 64.8864 73.7411L69.2871 75.9834C69.5242 76.1019 69.7711 76.2155 70.0427 76.3291C70.1959 76.6847 70.2749 77.0848 70.2897 77.5293C70.3144 78.3097 70.5663 78.9567 71.0207 79.4012C71.1985 79.5691 71.3615 79.6827 71.5294 79.7667L72.7987 80.4137C72.6012 80.5125 72.4036 80.636 72.2159 80.7841C71.8949 81.0212 71.5936 81.3324 71.3269 81.6979C71.0701 82.0387 70.8478 82.4239 70.6799 82.819C70.5021 83.2388 70.3835 83.6587 70.3292 84.0637C70.1959 85.0021 70.3786 85.8417 70.8429 86.4245C71.0306 86.6665 71.2676 86.8641 71.5393 86.9974L73.4457 87.9704C73.3272 88.1137 73.2136 88.2618 73.1148 88.4149C72.8778 88.7706 72.6802 89.1558 72.5271 89.5707C72.374 89.9856 72.2801 90.4054 72.2406 90.8252C72.2061 91.2796 72.2406 91.6895 72.3493 92.0649C72.453 92.465 72.6555 92.8255 72.942 93.1218C72.9518 93.1317 72.9667 93.1465 72.9765 93.1564C73.1296 93.2996 73.2828 93.4083 73.4457 93.4972L77.8563 95.7445C77.8563 95.7445 77.8711 95.7543 77.881 95.7543C78.0786 95.8482 78.286 95.9124 78.4934 95.9371C78.5972 95.9519 78.7058 95.9618 78.8145 95.9618C79.1108 95.9618 79.417 95.9025 79.7134 95.784C82.4792 94.727 85.2846 93.2996 88.0357 91.5414C88.6975 91.1215 89.2902 90.4399 89.6952 89.625C90.1002 88.8002 90.2879 87.921 90.2138 87.1456C90.1249 86.2171 89.6754 85.4812 88.9741 85.1305L87.8282 84.5427C88.6382 84.0192 89.4235 83.471 90.1792 82.9129C90.5002 82.6906 90.8064 82.3943 91.0929 82.0387C91.3695 81.688 91.6016 81.3027 91.7844 80.8829C91.9721 80.468 92.1005 80.0433 92.1647 79.6284C92.2338 79.1987 92.2388 78.7789 92.1746 78.3788C92.0955 77.9244 91.9375 77.5392 91.7004 77.2182C91.4979 76.9564 91.2608 76.7588 90.9892 76.6205L89.7742 76.0032C89.9569 75.8599 90.1347 75.7266 90.3027 75.5883C90.8361 75.1635 91.2905 74.5856 91.6214 73.9139C91.9572 73.2521 92.1449 72.5409 92.1647 71.8642C92.2141 70.1356 93.2513 67.8389 94.8713 65.8633C98.9904 60.87 102.26 54.6567 104.083 48.3693C105.91 42.0424 106.231 35.7945 104.977 30.7715C103.766 25.9016 101.203 22.3455 97.568 20.4884L93.1673 18.2461C92.9154 18.1177 92.6536 17.9942 92.3919 17.8806C90.8114 17.2138 89.0877 16.873 87.2652 16.873L87.2701 16.8829Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M88.5394 86.019C88.1295 85.8215 87.6208 85.8955 87.1071 86.2215C84.6623 87.7773 82.2026 89.0318 79.7578 89.9703C79.5059 90.0641 79.2491 90.2221 79.0071 90.4345C78.7601 90.6518 78.5329 90.9087 78.3354 91.205C78.1427 91.5014 77.9748 91.8273 77.8563 92.1582C77.7328 92.4941 77.6587 92.8299 77.6291 93.1559C77.6044 93.477 77.6291 93.7733 77.6982 94.0351C77.7723 94.2968 77.8909 94.5092 78.0489 94.6722C78.1279 94.7463 78.2168 94.8105 78.3107 94.8599L73.91 92.6176C73.8161 92.5682 73.7272 92.504 73.6482 92.4299C73.4902 92.2669 73.3716 92.0545 73.2976 91.7928C73.2235 91.531 73.2037 91.2346 73.2284 90.9136C73.258 90.5876 73.3321 90.2518 73.4556 89.9159C73.5741 89.585 73.7421 89.259 73.9347 88.9627C74.1322 88.6663 74.3594 88.4095 74.6064 88.1922C74.8138 88.0095 75.0312 87.8662 75.2485 87.7773C75.283 87.7576 75.3226 87.7427 75.3571 87.7279C75.4954 87.6736 75.6337 87.6193 75.772 87.5649C78.0785 86.6463 80.3999 85.4461 82.7064 83.9792C83.2201 83.6532 83.7288 83.5791 84.1387 83.7767L85.8378 84.641L88.5394 86.019Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M88.5394 86.0192C88.9346 86.2217 89.1815 86.6563 89.2358 87.2391C89.2902 87.8367 89.1371 88.5331 88.816 89.1851C88.49 89.837 88.0208 90.3853 87.5121 90.7113C84.8006 92.435 82.0693 93.8327 79.3578 94.865C79.1059 94.9638 78.8589 94.9934 78.6367 94.9588C78.5231 94.9391 78.4144 94.9045 78.3156 94.8551C78.2218 94.8057 78.1329 94.7464 78.0539 94.6674C77.8958 94.5094 77.7723 94.2921 77.7032 94.0303C77.6291 93.7735 77.6094 93.4722 77.634 93.1511C77.6637 92.8301 77.7378 92.4942 77.8612 92.1584C77.9798 91.8225 78.1477 91.5015 78.3403 91.2052C78.5379 90.9088 78.7651 90.647 79.012 90.4347C79.259 90.2223 79.5109 90.0642 79.7677 89.9655C82.2125 89.032 84.6722 87.7775 87.117 86.2217C87.6307 85.8957 88.1394 85.8216 88.5493 86.0142L88.5394 86.0192Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M76.3697 81.1249L75.3522 80.6063C75.5053 80.557 75.6535 80.4977 75.8066 80.4434C75.8264 80.4927 75.8461 80.5421 75.8659 80.5866C75.9103 80.6755 75.9647 80.7595 76.0239 80.8335C76.0536 80.8731 76.0832 80.9076 76.1178 80.9422C76.1919 81.0163 76.2808 81.0805 76.3697 81.1249Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M76.3746 88.3507L75.2485 87.7778C75.283 87.7581 75.3226 87.7432 75.3571 87.7284C75.4954 87.6741 75.6337 87.6198 75.772 87.5654C75.7868 87.6099 75.8016 87.6543 75.8165 87.6938C75.8313 87.7334 75.851 87.7729 75.8659 87.8124C75.9103 87.9013 75.9597 87.9803 76.019 88.0544C76.1177 88.1828 76.2412 88.2865 76.3746 88.3507Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M91.1967 79.4801C91.1423 79.816 91.0386 80.1617 90.8904 80.4926C90.7373 80.8285 90.5496 81.1446 90.3323 81.4261C90.1101 81.7027 89.8631 81.9397 89.6112 82.1175C88.3616 83.0411 87.1022 83.8857 85.8378 84.6414C82.9732 86.3552 80.0888 87.6246 77.2587 88.4148C76.9278 88.5037 76.6265 88.479 76.3746 88.3506C76.2413 88.2864 76.1178 88.1827 76.019 88.0543C75.9597 87.9802 75.9103 87.9012 75.8659 87.8122C75.8511 87.7727 75.8313 87.7332 75.8165 87.6937C75.8017 87.6542 75.7869 87.6097 75.7721 87.5653C75.7671 87.5505 75.7622 87.5357 75.7622 87.5208C75.7474 87.4813 75.7375 87.4418 75.7325 87.4023C75.7177 87.3529 75.7128 87.2986 75.7029 87.2443C75.6733 87.0023 75.6733 86.7306 75.7177 86.4441C75.7622 86.1182 75.856 85.7774 75.9992 85.4465C76.1375 85.1155 76.3153 84.8044 76.5277 84.5229C76.7401 84.2364 76.9722 83.9944 77.2241 83.8067C77.476 83.6141 77.7328 83.4807 77.9847 83.4116C81.5853 82.409 85.2846 80.5222 88.8852 77.8552C89.1371 77.6576 89.3988 77.5193 89.6557 77.4502C89.9125 77.3761 90.1545 77.3711 90.3718 77.4353C90.4015 77.4452 90.4311 77.4551 90.4607 77.465C90.4904 77.4798 90.5151 77.4897 90.5447 77.5045C90.6879 77.5786 90.8114 77.6823 90.9151 77.8156C91.0584 78.0083 91.1571 78.2503 91.2065 78.5367C91.2559 78.8232 91.251 79.1442 91.1967 79.4801Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M76.3697 81.1248L75.3522 80.6062L71.969 78.8825C71.8801 78.838 71.7912 78.7738 71.7171 78.6998C71.4454 78.4331 71.2923 78.0132 71.2775 77.5045C71.2578 76.7637 71.08 76.1117 70.7639 75.5635C71.3961 75.8104 72.0628 76.003 72.7493 76.1364C73.1198 76.2105 73.4655 76.329 73.7767 76.4871C74.9423 77.0798 75.6387 78.2404 75.6782 79.7468C75.6782 79.9246 75.7078 80.0926 75.7424 80.2457C75.7622 80.3148 75.7819 80.379 75.8066 80.4432C75.8264 80.4926 75.8461 80.542 75.8659 80.5865C75.9103 80.6754 75.9647 80.7593 76.0239 80.8334C76.0536 80.8729 76.0832 80.9075 76.1178 80.9421C76.1919 81.0162 76.2808 81.0804 76.3697 81.1248Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M90.4608 77.465C90.4311 77.4551 90.4015 77.4452 90.3718 77.4354C90.1545 77.3712 89.9125 77.3761 89.6557 77.4502C89.3989 77.5193 89.1371 77.6576 88.8852 77.8552C85.2846 80.5223 81.5853 82.409 77.9847 83.4116C77.7329 83.4807 77.476 83.6141 77.2241 83.8067C76.9722 83.9944 76.7401 84.2364 76.5277 84.5229C76.3154 84.8044 76.1376 85.1156 75.9993 85.4465C75.856 85.7774 75.7622 86.1182 75.7177 86.4442C75.6733 86.7257 75.6683 87.0023 75.7029 87.2443C75.7128 87.2986 75.7177 87.3529 75.7325 87.4023C75.7325 87.4418 75.7474 87.4814 75.7622 87.5209C75.7622 87.5357 75.7622 87.5505 75.7721 87.5653C75.6338 87.6197 75.4955 87.674 75.3572 87.7283C75.3226 87.7431 75.2831 87.7579 75.2485 87.7777L71.9739 86.1083C71.8406 86.0441 71.7171 85.9404 71.6183 85.812C71.3269 85.4465 71.2183 84.8637 71.3171 84.2018C71.3615 83.8759 71.4553 83.5351 71.5986 83.2042C71.7369 82.8732 71.9147 82.5621 72.1271 82.2806C72.3394 81.9941 72.5716 81.7521 72.8235 81.5644C73.0753 81.3718 73.3322 81.2384 73.5791 81.1693C74.1669 81.0063 74.7596 80.8186 75.3522 80.6062L76.3697 81.1248C76.6018 81.2434 76.8735 81.273 77.1698 81.2088C78.0786 81.0063 79.0071 80.7396 79.9455 80.4087C80.7802 80.1123 81.4964 78.9319 81.4964 77.9046V63.2505C81.3235 63.3147 81.1507 63.3789 80.9729 63.4381C80.3357 63.6505 79.6986 63.8234 79.0713 63.9469C78.8293 63.9913 78.5972 63.9765 78.3898 63.8925C78.37 63.8876 78.3453 63.8777 78.3255 63.8629C78.3157 63.858 78.3009 63.853 78.291 63.8431C78.1329 63.7592 77.9946 63.6258 77.8909 63.4628C77.7576 63.2653 77.6736 63.0134 77.639 62.722C77.6044 62.4355 77.6143 62.1145 77.6835 61.7836C77.7082 61.6453 77.7427 61.502 77.7872 61.3637C77.8465 61.1711 77.9205 60.9736 78.0094 60.7859C78.1626 60.4599 78.3502 60.1537 78.5725 59.887C78.7898 59.6153 79.0318 59.3881 79.2837 59.2202C79.5405 59.0473 79.7924 58.9337 80.0394 58.8844C80.6963 58.7559 81.3631 58.5633 82.0348 58.3016C83.635 57.6891 85.2599 56.7211 86.8256 55.427C87.0775 55.2097 87.3393 55.0517 87.5961 54.9578C87.8529 54.864 88.0999 54.8393 88.3221 54.8837C88.4259 54.8986 88.5197 54.9331 88.6086 54.9776C88.7173 55.0319 88.816 55.1109 88.9049 55.2048C89.063 55.3727 89.1766 55.5999 89.2408 55.8715C89.305 56.1481 89.3198 56.4593 89.2803 56.7902C89.2408 57.1211 89.1519 57.4669 89.0186 57.8027C88.8803 58.1435 88.7074 58.4645 88.495 58.7559C88.2826 59.0473 88.0456 59.2992 87.7937 59.5017C86.9985 60.1537 86.1885 60.7464 85.3735 61.2748V75.929C85.3735 76.4673 85.5662 76.8476 85.8773 77.0057C86.1589 77.1489 86.5243 77.1143 86.9244 76.8526C87.2553 76.6303 87.5862 76.4031 87.9171 76.166L90.4608 77.465Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M97.1284 21.3777C96.8913 21.2592 96.6543 21.1456 96.4073 21.0419C92.6882 19.4663 88.1246 19.9059 83.4325 22.3013C78.7404 24.6869 74.1817 28.8949 70.4576 34.2637C66.7336 39.6324 64.0616 45.8704 62.8416 52.0047C61.6217 58.1389 61.9329 63.8238 63.7257 68.1899C65.0445 71.4052 67.1188 73.771 69.7415 75.1045L65.3408 72.8622C62.7182 71.5287 60.6438 69.1629 59.3251 65.9476C57.5322 61.5815 57.221 55.8966 58.441 49.7623C59.6609 43.6281 62.3329 37.3901 66.057 32.0213C69.781 26.6526 74.3397 22.4445 79.0318 20.059C83.7239 17.6636 88.2875 17.224 92.0066 18.7995C92.2536 18.9033 92.4907 19.0169 92.7277 19.1354L97.1284 21.3777Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M103.144 48.1027C101.351 54.2962 98.1804 60.3219 94.1206 65.2461C92.3474 67.4044 91.2411 69.8838 91.1868 71.8446C91.1769 72.3682 91.0238 72.946 90.7521 73.4844C90.4805 74.0227 90.115 74.492 89.6952 74.8229C89.1074 75.2921 88.5148 75.7415 87.9171 76.1663C87.5862 76.4034 87.2553 76.6306 86.9244 76.8528C86.5243 77.1146 86.1588 77.1492 85.8773 77.0059C85.5662 76.8479 85.3735 76.4676 85.3735 75.9292V61.2751C86.1885 60.7466 86.9985 60.1539 87.7937 59.502C88.0456 59.2995 88.2826 59.0476 88.495 58.7562C88.7074 58.4648 88.8803 58.1438 89.0185 57.803C89.1519 57.4671 89.2408 57.1214 89.2803 56.7905C89.3198 56.4595 89.305 56.1484 89.2408 55.8718C89.1766 55.6001 89.063 55.373 88.9049 55.205C88.816 55.1112 88.7173 55.0322 88.6086 54.9778C88.5197 54.9334 88.4259 54.8988 88.3221 54.884C88.0999 54.8395 87.8529 54.8642 87.5961 54.9581C87.3393 55.0519 87.0775 55.21 86.8256 55.4273C85.2599 56.7213 83.635 57.6894 82.0348 58.3018C81.363 58.5636 80.6963 58.7562 80.0394 58.8846C79.7924 58.934 79.5405 59.0476 79.2837 59.2205C79.0318 59.3884 78.7898 59.6156 78.5725 59.8872C78.3502 60.1539 78.1625 60.4602 78.0094 60.7861C77.9205 60.9738 77.8464 61.1714 77.7872 61.364C77.7427 61.5023 77.7082 61.6455 77.6835 61.7838C77.6143 62.1147 77.6044 62.4358 77.639 62.7222C77.6736 63.0136 77.7575 63.2655 77.8909 63.4631C77.9946 63.6261 78.1329 63.7594 78.291 63.8434C78.3008 63.8533 78.3157 63.8582 78.3255 63.8632C78.3453 63.878 78.37 63.8878 78.3897 63.8928C78.5972 63.9768 78.8293 63.9916 79.0713 63.9471C79.6986 63.8236 80.3357 63.6508 80.9729 63.4384C81.1507 63.3791 81.3235 63.3149 81.4964 63.2507V77.9048C81.4964 78.9321 80.7802 80.1126 79.9455 80.4089C79.0071 80.7398 78.0786 81.0065 77.1698 81.209C76.8735 81.2732 76.6018 81.2436 76.3697 81.1251C76.2808 81.0806 76.1919 81.0164 76.1178 80.9423C76.0832 80.9078 76.0536 80.8732 76.0239 80.8337C75.9647 80.7596 75.9103 80.6756 75.8659 80.5867C75.8461 80.5423 75.8264 80.4929 75.8066 80.4435C75.7819 80.3793 75.7622 80.3151 75.7424 80.2459C75.7078 80.0928 75.6832 79.9249 75.6782 79.7471C75.6387 78.2407 74.9423 77.08 73.7767 76.4873C73.4655 76.3293 73.1198 76.2107 72.7494 76.1367C72.0628 76.0033 71.3961 75.8107 70.7639 75.5637C70.4132 75.4254 70.0724 75.2723 69.7415 75.1044C67.1189 73.7709 65.0445 71.4051 63.7258 68.1897C61.9329 63.8236 61.6217 58.1388 62.8417 52.0045C64.0616 45.8703 66.7336 39.6322 70.4577 34.2635C74.1817 28.8948 78.7404 24.6867 83.4325 22.3012C88.1246 19.9058 92.6882 19.4662 96.4073 21.0417C96.6543 21.1454 96.8914 21.259 97.1284 21.3776C100.477 23.0865 102.892 26.445 104.028 31.0186C105.243 35.9082 104.932 41.919 103.144 48.1027Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.42537 64.2881C4.06714 63.5967 3.20281 61.9618 3.20281 59.6356C3.20281 55.472 5.97855 50.6811 9.39636 48.9425L32.3135 37.2667C33.8248 36.4962 35.2077 36.4468 36.2845 36.995L34.0816 35.8739C33.0049 35.3256 31.622 35.375 30.1107 36.1455L7.19355 47.8214C3.77574 49.5599 1 54.3508 1 58.5144C1 60.8407 1.86433 62.4755 3.22257 63.167L5.42537 64.2881Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.42538 64.2881C6.50209 64.8363 7.88502 64.7869 9.39637 64.0164L32.3135 52.3405C35.7362 50.5971 38.507 45.8062 38.507 41.6475C38.507 39.3212 37.6427 37.6864 36.2845 36.995C35.2078 36.4467 33.8248 36.4961 32.3135 37.2666L9.39637 48.9425C5.97362 50.686 3.20282 55.4768 3.20282 59.6355C3.20282 61.9618 4.06715 63.5966 5.42538 64.2881Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M12.5277 53.4267C12.6117 53.2983 12.7351 53.244 12.8142 53.2983C12.8932 53.3526 12.8981 53.5008 12.829 53.6391L12.8142 53.6687L9.8211 58.8399C9.73714 58.9831 9.60378 59.0523 9.51982 58.993C9.43586 58.9337 9.43586 58.7707 9.51982 58.6226L12.5129 53.4514L12.5277 53.4267Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M10.3101 55.1508C10.3101 54.9335 10.1669 54.8347 9.98905 54.9236C9.81124 55.0125 9.66801 55.2595 9.66801 55.4768C9.66801 55.6941 9.81124 55.7929 9.98905 55.704C10.1669 55.6151 10.3101 55.3681 10.3101 55.1508ZM10.7398 54.9335C10.7398 55.4373 10.4039 56.0151 9.98905 56.2275C9.57417 56.4399 9.23831 56.2028 9.23831 55.699C9.23831 55.1953 9.57417 54.6174 9.98905 54.405C10.4039 54.1926 10.7398 54.4297 10.7398 54.9335Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M12.666 56.8159C12.666 56.5985 12.5227 56.4998 12.3449 56.5887C12.1671 56.6776 12.0239 56.9245 12.0239 57.1418C12.0239 57.3591 12.1671 57.4579 12.3449 57.369C12.5227 57.2801 12.666 57.0332 12.666 56.8159ZM13.0907 56.5985C13.0907 57.1023 12.7549 57.6802 12.34 57.8926C11.9251 58.1049 11.5893 57.8679 11.5893 57.3641C11.5893 56.8603 11.9251 56.2824 12.34 56.0701C12.7549 55.8577 13.0907 56.0948 13.0907 56.5985Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M11.0953 51.5356C11.0953 51.3973 11.1892 51.2393 11.3028 51.185C11.9696 50.8886 12.6166 50.7898 13.1944 50.9133C13.8316 51.0467 14.3502 51.4369 14.7107 52.0394C15.0663 52.642 15.2441 53.4421 15.2244 54.3459C15.2046 55.2547 14.9824 56.2376 14.5922 57.1958C14.1971 58.1539 13.6439 59.0528 12.9919 59.7986C12.335 60.5444 11.6041 61.1075 10.8682 61.4285C10.1322 61.7496 9.42101 61.8236 8.80857 61.636C8.2554 61.4631 7.79607 61.0877 7.47997 60.5346C7.42564 60.4407 7.4701 60.2678 7.57382 60.1543C7.67754 60.0407 7.80101 60.0308 7.85534 60.1246C8.1418 60.6136 8.54681 60.9445 9.04071 61.0976C9.59388 61.2655 10.231 61.2013 10.8928 60.9099C11.5547 60.6185 12.2165 60.1147 12.8043 59.443C13.392 58.7713 13.8908 57.9663 14.2464 57.1019C14.6021 56.2376 14.7947 55.3535 14.8144 54.5336C14.8342 53.7187 14.6761 52.9976 14.3551 52.4543C14.0341 51.911 13.5649 51.5603 12.9919 51.4418C12.4783 51.3331 11.9053 51.4171 11.3127 51.6789C11.1991 51.7283 11.1052 51.6641 11.1052 51.5258L11.0953 51.5356Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M29.4143 48.8783L21.0278 53.1505C20.3363 53.5012 19.7782 53.1061 19.7782 52.2665C19.7782 51.4268 20.3363 50.4637 21.0278 50.113L29.4143 45.8408C30.1057 45.4901 30.6639 45.8852 30.6639 46.7249C30.6639 47.5645 30.1057 48.5276 29.4143 48.8783Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M113.63 2.0262C114.79 1.43351 116.292 1.4829 117.927 2.3176L149.225 18.2657C152.92 20.1475 155.918 25.3187 155.918 29.8181C155.918 32.3272 154.984 34.0953 153.522 34.8411L155.725 33.72C157.192 32.9742 158.121 31.206 158.121 28.697C158.121 24.2025 155.123 19.0264 151.428 17.1446L120.125 1.19644C118.49 0.361744 116.993 0.312354 115.828 0.905038L113.625 2.0262H113.63Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M113.63 2.02613C112.163 2.77193 111.234 4.5401 111.234 7.04913C111.234 11.5436 114.232 16.7198 117.927 18.6015L149.225 34.5497C150.86 35.3844 152.357 35.4338 153.522 34.8411C154.989 34.0953 155.918 32.3271 155.918 29.8181C155.918 25.3236 152.92 20.1474 149.225 18.2657L117.922 2.31753C116.287 1.48284 114.79 1.43345 113.625 2.02613H113.63Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M120.179 10.3487V15.0309C120.179 15.8063 120.693 16.7003 121.335 17.0263L127.494 20.1626C128.131 20.4885 128.649 20.1231 128.649 19.3476V14.6654C128.649 13.8949 128.131 12.996 127.494 12.67L126.338 12.0823V11.6131C126.338 10.8426 125.819 9.9437 125.182 9.61773L123.641 8.83242C123.004 8.50644 122.485 8.87687 122.485 9.64736V10.1166L121.33 9.52882C120.693 9.20285 120.174 9.57328 120.174 10.3438L120.179 10.3487ZM127.494 19.2291L126.338 18.6413V13.0207L127.494 13.6085C127.706 13.7171 127.879 14.0135 127.879 14.2752V18.9574C127.879 19.2143 127.706 19.3377 127.494 19.2291ZM123.261 11.4501L125.572 12.6256V18.2462L123.261 17.0707V11.4501ZM123.261 10.0425C123.261 9.78565 123.434 9.66218 123.646 9.77084L125.187 10.5561C125.399 10.6648 125.572 10.9611 125.572 11.2229V11.6921L123.261 10.5166V10.0474V10.0425ZM120.949 10.7389C120.949 10.4821 121.122 10.3586 121.335 10.4672L122.49 11.055V16.6756L121.335 16.0879C121.122 15.9792 120.949 15.6829 120.949 15.4211V10.7389Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M145.398 26.5392V27.9617C145.398 28.1098 145.353 28.2234 145.274 28.2876C145.195 28.3469 145.086 28.3519 144.978 28.2926L135.653 23.5412C135.421 23.4227 135.233 23.077 135.233 22.7757V20.5136L138.058 17.2538C138.216 17.1304 138.399 17.0612 138.621 17.1748C138.844 17.2884 139.026 17.5452 139.184 17.8317L141.629 23.7981L142.686 23.1856C142.844 23.0572 143.061 23.0523 143.284 23.1659C143.506 23.2795 143.723 23.5067 143.881 23.7981L145.403 26.5392H145.398Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M154.308 55.0311C154.135 54.7348 153.903 54.4977 153.656 54.3742C153.414 54.2508 153.177 54.2508 153.004 54.3742L150.381 56.2264C150.095 56.4289 149.932 56.8191 149.932 57.313C149.932 57.8069 150.095 58.36 150.381 58.8589C150.668 59.3528 151.058 59.7479 151.463 59.9553C151.868 60.1628 152.258 60.1628 152.544 59.9603L155.355 57.9748C155.473 57.8908 155.666 57.9896 155.789 58.197C155.908 58.4045 155.908 58.6366 155.789 58.7255L152.979 60.711C152.579 60.9975 152.031 60.9925 151.463 60.7011C150.895 60.4097 150.351 59.8615 149.946 59.1651C149.546 58.4736 149.319 57.6933 149.319 57.0018C149.319 56.3103 149.546 55.7621 149.946 55.4806L152.564 53.6284C152.851 53.4259 153.241 53.4259 153.646 53.6284C154.051 53.8359 154.441 54.231 154.727 54.7249C155.014 55.2188 155.177 55.7769 155.177 56.2708C155.177 56.7647 155.014 57.1549 154.727 57.3623L152.1 59.2145C151.927 59.338 151.695 59.333 151.453 59.2145C151.211 59.0959 150.974 58.8539 150.806 58.5576C150.638 58.2612 150.539 57.9254 150.539 57.6291C150.539 57.3327 150.638 57.1006 150.806 56.9771L153.404 55.1447C153.522 55.0608 153.715 55.1595 153.838 55.367C153.957 55.5744 153.957 55.8065 153.838 55.8905L151.24 57.7229C151.181 57.7624 151.152 57.8414 151.152 57.9402C151.152 58.039 151.186 58.1477 151.24 58.2514C151.3 58.3502 151.374 58.4292 151.458 58.4687C151.542 58.5082 151.616 58.5082 151.675 58.4687L154.303 56.6166C154.476 56.4931 154.569 56.2609 154.569 55.9646C154.569 55.6683 154.471 55.3324 154.298 55.0361L154.308 55.0311Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M78.8145 95.4679C78.7256 95.4679 78.6416 95.463 78.5576 95.4482C78.4095 95.4284 78.2514 95.379 78.0934 95.3099L73.6828 93.0626C73.5494 92.9935 73.4309 92.9045 73.3124 92.7959C73.0704 92.544 72.9123 92.2575 72.8234 91.9266C72.7345 91.6155 72.7049 91.2648 72.7345 90.8845C72.7691 90.4992 72.853 90.1239 72.9913 89.7534C73.1346 89.3731 73.3124 89.0175 73.5297 88.6965C73.7371 88.3804 73.989 88.0939 74.2705 87.842L71.7516 86.5579C71.564 86.469 71.3861 86.3208 71.233 86.1233C70.8577 85.654 70.7144 84.9478 70.828 84.1427C70.8774 83.7822 70.9811 83.4068 71.1441 83.0215C71.2923 82.661 71.4948 82.3153 71.7368 81.9893C71.964 81.6732 72.2357 81.3966 72.532 81.1743C72.8234 80.9472 73.1346 80.7842 73.4507 80.7002C73.6532 80.6409 73.8606 80.5817 74.073 80.5175L71.7467 79.3321C71.6282 79.2778 71.5047 79.1889 71.3763 79.0703C71.0058 78.7048 70.8033 78.1763 70.7836 77.5293C70.7688 76.9416 70.6404 76.4181 70.4082 75.9587C70.0773 75.8254 69.781 75.692 69.5093 75.5537L65.1086 73.3114C62.3823 71.9235 60.219 69.4441 58.8608 66.1449C57.0481 61.7146 56.7222 55.8667 57.947 49.6781C59.1769 43.5043 61.9081 37.1379 65.647 31.7494C69.3908 26.3412 74.0631 22.0393 78.8046 19.629C81.7186 18.1424 84.5635 17.3867 87.2651 17.3867C89.0185 17.3867 90.678 17.7127 92.1943 18.3548C92.4462 18.4634 92.6981 18.582 92.9401 18.7054L97.3408 20.9478C100.847 22.7357 103.322 26.1831 104.497 30.9098C105.727 35.8488 105.416 42.0078 103.608 48.2507C101.806 54.4739 98.5706 60.623 94.4909 65.5719C92.7771 67.6562 91.7251 70.0121 91.6757 71.8692C91.6609 72.4668 91.4831 73.1237 91.1818 73.7164C90.8854 74.319 90.4755 74.8376 89.9964 75.2179C89.6458 75.4945 89.2704 75.7809 88.8456 76.097L90.762 77.0749C90.9694 77.1836 91.1522 77.3318 91.3003 77.5244C91.4979 77.7911 91.6263 78.1023 91.6905 78.4628C91.7448 78.8234 91.7448 79.1889 91.6806 79.5692C91.6214 79.9396 91.5028 80.3248 91.33 80.7051C91.162 81.0805 90.9546 81.4312 90.7076 81.7423C90.4459 82.0683 90.1644 82.335 89.8779 82.5326C88.9148 83.2487 87.8924 83.9451 86.8305 84.607L88.7567 85.5898C89.3 85.8615 89.6507 86.4492 89.7198 87.2049C89.784 87.8865 89.6161 88.6718 89.2506 89.4127C88.8802 90.1535 88.3517 90.761 87.764 91.1364C85.0376 92.8749 82.2668 94.2875 79.5207 95.3346C79.2837 95.4284 79.0416 95.4728 78.8046 95.4728L78.8145 95.4679Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M87.2701 17.8707C88.9494 17.8707 90.5447 18.177 92.0066 18.7993C92.2486 18.903 92.4907 19.0166 92.7228 19.1351L97.1235 21.3774C100.472 23.0864 102.887 26.4449 104.023 31.0184C105.243 35.9081 104.927 41.9189 103.139 48.1026C101.346 54.2961 98.1755 60.3217 94.1156 65.2459C92.3425 67.4043 91.2411 69.8837 91.1868 71.8445C91.1719 72.368 91.0188 72.9459 90.7472 73.4842C90.4805 74.0226 90.11 74.4918 89.6952 74.8227C89.1074 75.2919 88.5098 75.7315 87.9072 76.1612L90.5447 77.5046C90.6879 77.5787 90.8114 77.6824 90.9151 77.8158C91.0583 78.0084 91.1571 78.2504 91.2065 78.5369C91.251 78.8233 91.251 79.1444 91.1966 79.4802C91.1423 79.8161 91.0336 80.1618 90.8855 80.4927C90.7373 80.8286 90.5496 81.1447 90.3274 81.4262C90.1051 81.7028 89.8631 81.9399 89.6063 82.1177C88.3567 83.0462 87.0923 83.8809 85.8279 84.6366L88.5394 86.0195C88.9346 86.2171 89.1815 86.6566 89.2358 87.2395C89.2902 87.8321 89.1371 88.5335 88.816 89.1854C88.49 89.8374 88.0208 90.3856 87.5072 90.7116C84.8006 92.4353 82.0644 93.8281 79.3528 94.8653C79.1701 94.9394 78.9873 94.974 78.8145 94.974C78.7503 94.974 78.691 94.974 78.6317 94.9592C78.5181 94.9443 78.4095 94.9098 78.3058 94.8604L73.9051 92.6181C73.8112 92.5687 73.7273 92.5045 73.6482 92.4304C73.4902 92.2674 73.3667 92.055 73.2976 91.7932C73.2235 91.5315 73.1988 91.2351 73.2235 90.9141C73.2531 90.5881 73.3272 90.2523 73.4507 89.9164C73.5742 89.5855 73.7372 89.2595 73.9347 88.9632C74.1323 88.6668 74.3595 88.41 74.6015 88.1927C74.8139 88.0149 75.0312 87.8766 75.2485 87.7827L71.969 86.1084C71.8356 86.0442 71.7171 85.9405 71.6183 85.8121C71.3269 85.4466 71.2182 84.8638 71.3121 84.2019C71.3565 83.876 71.4553 83.5352 71.5936 83.2043C71.7319 82.8733 71.9146 82.5622 72.127 82.2807C72.3345 81.9942 72.5715 81.7522 72.8234 81.5645C73.0704 81.3719 73.3272 81.2385 73.5791 81.1694C74.1619 81.0064 74.7546 80.8138 75.3423 80.6014L71.969 78.8826C71.8751 78.8382 71.7912 78.7739 71.7121 78.6999C71.4405 78.4332 71.2923 78.0133 71.2775 77.5046C71.2578 76.7638 71.075 76.1019 70.7589 75.5537C70.4132 75.4203 70.0674 75.2722 69.7365 75.1042L65.3359 72.8619C62.7132 71.5284 60.6438 69.1626 59.3201 65.9473C57.5322 61.5812 57.221 55.8963 58.436 49.7621C59.656 43.6278 62.3329 37.3898 66.057 32.0211C69.776 26.6523 74.3397 22.4443 79.0318 20.0587C81.8767 18.6066 84.6771 17.8707 87.2701 17.8707ZM87.2701 16.8829C84.4894 16.8829 81.5655 17.6534 78.5823 19.1796C73.7717 21.6244 69.0352 25.9856 65.247 31.458C61.4735 36.9008 58.7077 43.3314 57.468 49.5694C56.2233 55.8568 56.5543 61.8034 58.4064 66.3226C59.814 69.7355 62.0514 72.3038 64.8864 73.7411L69.2871 75.9834C69.5242 76.1019 69.7711 76.2155 70.0427 76.3291C70.1959 76.6847 70.2749 77.0848 70.2897 77.5293C70.3144 78.3097 70.5663 78.9567 71.0207 79.4012C71.1985 79.5691 71.3615 79.6827 71.5294 79.7667L72.7987 80.4137C72.6012 80.5125 72.4036 80.636 72.2159 80.7841C71.8949 81.0212 71.5936 81.3324 71.3269 81.6979C71.0701 82.0387 70.8478 82.4239 70.6799 82.819C70.5021 83.2388 70.3835 83.6587 70.3292 84.0637C70.1959 85.0021 70.3786 85.8417 70.8429 86.4245C71.0306 86.6665 71.2676 86.8641 71.5393 86.9974L73.4457 87.9704C73.3272 88.1137 73.2136 88.2618 73.1148 88.4149C72.8778 88.7706 72.6802 89.1558 72.5271 89.5707C72.374 89.9856 72.2801 90.4054 72.2406 90.8252C72.2061 91.2796 72.2406 91.6895 72.3493 92.0649C72.453 92.465 72.6555 92.8255 72.942 93.1218C72.9518 93.1317 72.9667 93.1465 72.9765 93.1564C73.1296 93.2996 73.2828 93.4083 73.4457 93.4972L77.8563 95.7445C77.8563 95.7445 77.8711 95.7543 77.881 95.7543C78.0786 95.8482 78.286 95.9124 78.4934 95.9371C78.5972 95.9519 78.7058 95.9618 78.8145 95.9618C79.1108 95.9618 79.417 95.9025 79.7134 95.784C82.4792 94.727 85.2846 93.2996 88.0357 91.5414C88.6975 91.1215 89.2902 90.4399 89.6952 89.625C90.1002 88.8002 90.2879 87.921 90.2138 87.1456C90.1249 86.2171 89.6754 85.4812 88.9741 85.1305L87.8282 84.5427C88.6382 84.0192 89.4235 83.471 90.1792 82.9129C90.5002 82.6906 90.8064 82.3943 91.0929 82.0387C91.3695 81.688 91.6016 81.3027 91.7844 80.8829C91.9721 80.468 92.1005 80.0433 92.1647 79.6284C92.2338 79.1987 92.2388 78.7789 92.1746 78.3788C92.0955 77.9244 91.9375 77.5392 91.7004 77.2182C91.4979 76.9564 91.2608 76.7588 90.9892 76.6205L89.7742 76.0032C89.9569 75.8599 90.1347 75.7266 90.3027 75.5883C90.8361 75.1635 91.2905 74.5856 91.6214 73.9139C91.9572 73.2521 92.1449 72.5409 92.1647 71.8642C92.2141 70.1356 93.2513 67.8389 94.8713 65.8633C98.9904 60.87 102.26 54.6567 104.083 48.3693C105.91 42.0424 106.231 35.7945 104.977 30.7715C103.766 25.9016 101.203 22.3455 97.568 20.4884L93.1673 18.2461C92.9154 18.1177 92.6536 17.9942 92.3919 17.8806C90.8114 17.2138 89.0877 16.873 87.2652 16.873L87.2701 16.8829Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M88.5394 86.019C88.1295 85.8215 87.6208 85.8955 87.1071 86.2215C84.6623 87.7773 82.2026 89.0318 79.7578 89.9703C79.5059 90.0641 79.2491 90.2221 79.0071 90.4345C78.7601 90.6518 78.5329 90.9087 78.3354 91.205C78.1427 91.5014 77.9748 91.8273 77.8563 92.1582C77.7328 92.4941 77.6587 92.8299 77.6291 93.1559C77.6044 93.477 77.6291 93.7733 77.6982 94.0351C77.7723 94.2968 77.8909 94.5092 78.0489 94.6722C78.1279 94.7463 78.2168 94.8105 78.3107 94.8599L73.91 92.6176C73.8161 92.5682 73.7272 92.504 73.6482 92.4299C73.4902 92.2669 73.3716 92.0545 73.2976 91.7928C73.2235 91.531 73.2037 91.2346 73.2284 90.9136C73.258 90.5876 73.3321 90.2518 73.4556 89.9159C73.5741 89.585 73.7421 89.259 73.9347 88.9627C74.1322 88.6663 74.3594 88.4095 74.6064 88.1922C74.8138 88.0095 75.0312 87.8662 75.2485 87.7773C75.283 87.7576 75.3226 87.7427 75.3571 87.7279C75.4954 87.6736 75.6337 87.6193 75.772 87.5649C78.0785 86.6463 80.3999 85.4461 82.7064 83.9792C83.2201 83.6532 83.7288 83.5791 84.1387 83.7767L85.8378 84.641L88.5394 86.019Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M88.5394 86.0192C88.9346 86.2217 89.1815 86.6563 89.2358 87.2391C89.2902 87.8367 89.1371 88.5331 88.816 89.1851C88.49 89.837 88.0208 90.3853 87.5121 90.7113C84.8006 92.435 82.0693 93.8327 79.3578 94.865C79.1059 94.9638 78.8589 94.9934 78.6367 94.9588C78.5231 94.9391 78.4144 94.9045 78.3156 94.8551C78.2218 94.8057 78.1329 94.7464 78.0539 94.6674C77.8958 94.5094 77.7723 94.2921 77.7032 94.0303C77.6291 93.7735 77.6094 93.4722 77.634 93.1511C77.6637 92.8301 77.7378 92.4942 77.8612 92.1584C77.9798 91.8225 78.1477 91.5015 78.3403 91.2052C78.5379 90.9088 78.7651 90.647 79.012 90.4347C79.259 90.2223 79.5109 90.0642 79.7677 89.9655C82.2125 89.032 84.6722 87.7775 87.117 86.2217C87.6307 85.8957 88.1394 85.8216 88.5493 86.0142L88.5394 86.0192Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M76.3697 81.1249L75.3522 80.6063C75.5053 80.557 75.6535 80.4977 75.8066 80.4434C75.8264 80.4927 75.8461 80.5421 75.8659 80.5866C75.9103 80.6755 75.9647 80.7595 76.0239 80.8335C76.0536 80.8731 76.0832 80.9076 76.1178 80.9422C76.1919 81.0163 76.2808 81.0805 76.3697 81.1249Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M76.3746 88.3507L75.2485 87.7778C75.283 87.7581 75.3226 87.7432 75.3571 87.7284C75.4954 87.6741 75.6337 87.6198 75.772 87.5654C75.7868 87.6099 75.8016 87.6543 75.8165 87.6938C75.8313 87.7334 75.851 87.7729 75.8659 87.8124C75.9103 87.9013 75.9597 87.9803 76.019 88.0544C76.1177 88.1828 76.2412 88.2865 76.3746 88.3507Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M91.1967 79.4801C91.1423 79.816 91.0386 80.1617 90.8904 80.4926C90.7373 80.8285 90.5496 81.1446 90.3323 81.4261C90.1101 81.7027 89.8631 81.9397 89.6112 82.1175C88.3616 83.0411 87.1022 83.8857 85.8378 84.6414C82.9732 86.3552 80.0888 87.6246 77.2587 88.4148C76.9278 88.5037 76.6265 88.479 76.3746 88.3506C76.2413 88.2864 76.1178 88.1827 76.019 88.0543C75.9597 87.9802 75.9103 87.9012 75.8659 87.8122C75.8511 87.7727 75.8313 87.7332 75.8165 87.6937C75.8017 87.6542 75.7869 87.6097 75.7721 87.5653C75.7671 87.5505 75.7622 87.5357 75.7622 87.5208C75.7474 87.4813 75.7375 87.4418 75.7325 87.4023C75.7177 87.3529 75.7128 87.2986 75.7029 87.2443C75.6733 87.0023 75.6733 86.7306 75.7177 86.4441C75.7622 86.1182 75.856 85.7774 75.9992 85.4465C76.1375 85.1155 76.3153 84.8044 76.5277 84.5229C76.7401 84.2364 76.9722 83.9944 77.2241 83.8067C77.476 83.6141 77.7328 83.4807 77.9847 83.4116C81.5853 82.409 85.2846 80.5222 88.8852 77.8552C89.1371 77.6576 89.3988 77.5193 89.6557 77.4502C89.9125 77.3761 90.1545 77.3711 90.3718 77.4353C90.4015 77.4452 90.4311 77.4551 90.4607 77.465C90.4904 77.4798 90.5151 77.4897 90.5447 77.5045C90.6879 77.5786 90.8114 77.6823 90.9151 77.8156C91.0584 78.0083 91.1571 78.2503 91.2065 78.5367C91.2559 78.8232 91.251 79.1442 91.1967 79.4801Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M76.3697 81.1248L75.3522 80.6062L71.969 78.8825C71.8801 78.838 71.7912 78.7738 71.7171 78.6998C71.4454 78.4331 71.2923 78.0132 71.2775 77.5045C71.2578 76.7637 71.08 76.1117 70.7639 75.5635C71.3961 75.8104 72.0628 76.003 72.7493 76.1364C73.1198 76.2105 73.4655 76.329 73.7767 76.4871C74.9423 77.0798 75.6387 78.2404 75.6782 79.7468C75.6782 79.9246 75.7078 80.0926 75.7424 80.2457C75.7622 80.3148 75.7819 80.379 75.8066 80.4432C75.8264 80.4926 75.8461 80.542 75.8659 80.5865C75.9103 80.6754 75.9647 80.7593 76.0239 80.8334C76.0536 80.8729 76.0832 80.9075 76.1178 80.9421C76.1919 81.0162 76.2808 81.0804 76.3697 81.1248Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M90.4608 77.465C90.4311 77.4551 90.4015 77.4452 90.3718 77.4354C90.1545 77.3712 89.9125 77.3761 89.6557 77.4502C89.3989 77.5193 89.1371 77.6576 88.8852 77.8552C85.2846 80.5223 81.5853 82.409 77.9847 83.4116C77.7329 83.4807 77.476 83.6141 77.2241 83.8067C76.9722 83.9944 76.7401 84.2364 76.5277 84.5229C76.3154 84.8044 76.1376 85.1156 75.9993 85.4465C75.856 85.7774 75.7622 86.1182 75.7177 86.4442C75.6733 86.7257 75.6683 87.0023 75.7029 87.2443C75.7128 87.2986 75.7177 87.3529 75.7325 87.4023C75.7325 87.4418 75.7474 87.4814 75.7622 87.5209C75.7622 87.5357 75.7622 87.5505 75.7721 87.5653C75.6338 87.6197 75.4955 87.674 75.3572 87.7283C75.3226 87.7431 75.2831 87.7579 75.2485 87.7777L71.9739 86.1083C71.8406 86.0441 71.7171 85.9404 71.6183 85.812C71.3269 85.4465 71.2183 84.8637 71.3171 84.2018C71.3615 83.8759 71.4553 83.5351 71.5986 83.2042C71.7369 82.8732 71.9147 82.5621 72.1271 82.2806C72.3394 81.9941 72.5716 81.7521 72.8235 81.5644C73.0753 81.3718 73.3322 81.2384 73.5791 81.1693C74.1669 81.0063 74.7596 80.8186 75.3522 80.6062L76.3697 81.1248C76.6018 81.2434 76.8735 81.273 77.1698 81.2088C78.0786 81.0063 79.0071 80.7396 79.9455 80.4087C80.7802 80.1123 81.4964 78.9319 81.4964 77.9046V63.2505C81.3235 63.3147 81.1507 63.3789 80.9729 63.4381C80.3357 63.6505 79.6986 63.8234 79.0713 63.9469C78.8293 63.9913 78.5972 63.9765 78.3898 63.8925C78.37 63.8876 78.3453 63.8777 78.3255 63.8629C78.3157 63.858 78.3009 63.853 78.291 63.8431C78.1329 63.7592 77.9946 63.6258 77.8909 63.4628C77.7576 63.2653 77.6736 63.0134 77.639 62.722C77.6044 62.4355 77.6143 62.1145 77.6835 61.7836C77.7082 61.6453 77.7427 61.502 77.7872 61.3637C77.8465 61.1711 77.9205 60.9736 78.0094 60.7859C78.1626 60.4599 78.3502 60.1537 78.5725 59.887C78.7898 59.6153 79.0318 59.3881 79.2837 59.2202C79.5405 59.0473 79.7924 58.9337 80.0394 58.8844C80.6963 58.7559 81.3631 58.5633 82.0348 58.3016C83.635 57.6891 85.2599 56.7211 86.8256 55.427C87.0775 55.2097 87.3393 55.0517 87.5961 54.9578C87.8529 54.864 88.0999 54.8393 88.3221 54.8837C88.4259 54.8986 88.5197 54.9331 88.6086 54.9776C88.7173 55.0319 88.816 55.1109 88.9049 55.2048C89.063 55.3727 89.1766 55.5999 89.2408 55.8715C89.305 56.1481 89.3198 56.4593 89.2803 56.7902C89.2408 57.1211 89.1519 57.4669 89.0186 57.8027C88.8803 58.1435 88.7074 58.4645 88.495 58.7559C88.2826 59.0473 88.0456 59.2992 87.7937 59.5017C86.9985 60.1537 86.1885 60.7464 85.3735 61.2748V75.929C85.3735 76.4673 85.5662 76.8476 85.8773 77.0057C86.1589 77.1489 86.5243 77.1143 86.9244 76.8526C87.2553 76.6303 87.5862 76.4031 87.9171 76.166L90.4608 77.465Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M97.1284 21.3777C96.8913 21.2592 96.6543 21.1456 96.4073 21.0419C92.6882 19.4663 88.1246 19.9059 83.4325 22.3013C78.7404 24.6869 74.1817 28.8949 70.4576 34.2637C66.7336 39.6324 64.0616 45.8704 62.8416 52.0047C61.6217 58.1389 61.9329 63.8238 63.7257 68.1899C65.0445 71.4052 67.1188 73.771 69.7415 75.1045L65.3408 72.8622C62.7182 71.5287 60.6438 69.1629 59.3251 65.9476C57.5322 61.5815 57.221 55.8966 58.441 49.7623C59.6609 43.6281 62.3329 37.3901 66.057 32.0213C69.781 26.6526 74.3397 22.4445 79.0318 20.059C83.7239 17.6636 88.2875 17.224 92.0066 18.7995C92.2536 18.9033 92.4907 19.0169 92.7277 19.1354L97.1284 21.3777Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M103.144 48.1027C101.351 54.2962 98.1804 60.3219 94.1206 65.2461C92.3474 67.4044 91.2411 69.8838 91.1868 71.8446C91.1769 72.3682 91.0238 72.946 90.7521 73.4844C90.4805 74.0227 90.115 74.492 89.6952 74.8229C89.1074 75.2921 88.5148 75.7415 87.9171 76.1663C87.5862 76.4034 87.2553 76.6306 86.9244 76.8528C86.5243 77.1146 86.1588 77.1492 85.8773 77.0059C85.5662 76.8479 85.3735 76.4676 85.3735 75.9292V61.2751C86.1885 60.7466 86.9985 60.1539 87.7937 59.502C88.0456 59.2995 88.2826 59.0476 88.495 58.7562C88.7074 58.4648 88.8803 58.1438 89.0185 57.803C89.1519 57.4671 89.2408 57.1214 89.2803 56.7905C89.3198 56.4595 89.305 56.1484 89.2408 55.8718C89.1766 55.6001 89.063 55.373 88.9049 55.205C88.816 55.1112 88.7173 55.0322 88.6086 54.9778C88.5197 54.9334 88.4259 54.8988 88.3221 54.884C88.0999 54.8395 87.8529 54.8642 87.5961 54.9581C87.3393 55.0519 87.0775 55.21 86.8256 55.4273C85.2599 56.7213 83.635 57.6894 82.0348 58.3018C81.363 58.5636 80.6963 58.7562 80.0394 58.8846C79.7924 58.934 79.5405 59.0476 79.2837 59.2205C79.0318 59.3884 78.7898 59.6156 78.5725 59.8872C78.3502 60.1539 78.1625 60.4602 78.0094 60.7861C77.9205 60.9738 77.8464 61.1714 77.7872 61.364C77.7427 61.5023 77.7082 61.6455 77.6835 61.7838C77.6143 62.1147 77.6044 62.4358 77.639 62.7222C77.6736 63.0136 77.7575 63.2655 77.8909 63.4631C77.9946 63.6261 78.1329 63.7594 78.291 63.8434C78.3008 63.8533 78.3157 63.8582 78.3255 63.8632C78.3453 63.878 78.37 63.8878 78.3897 63.8928C78.5972 63.9768 78.8293 63.9916 79.0713 63.9471C79.6986 63.8236 80.3357 63.6508 80.9729 63.4384C81.1507 63.3791 81.3235 63.3149 81.4964 63.2507V77.9048C81.4964 78.9321 80.7802 80.1126 79.9455 80.4089C79.0071 80.7398 78.0786 81.0065 77.1698 81.209C76.8735 81.2732 76.6018 81.2436 76.3697 81.1251C76.2808 81.0806 76.1919 81.0164 76.1178 80.9423C76.0832 80.9078 76.0536 80.8732 76.0239 80.8337C75.9647 80.7596 75.9103 80.6756 75.8659 80.5867C75.8461 80.5423 75.8264 80.4929 75.8066 80.4435C75.7819 80.3793 75.7622 80.3151 75.7424 80.2459C75.7078 80.0928 75.6832 79.9249 75.6782 79.7471C75.6387 78.2407 74.9423 77.08 73.7767 76.4873C73.4655 76.3293 73.1198 76.2107 72.7494 76.1367C72.0628 76.0033 71.3961 75.8107 70.7639 75.5637C70.4132 75.4254 70.0724 75.2723 69.7415 75.1044C67.1189 73.7709 65.0445 71.4051 63.7258 68.1897C61.9329 63.8236 61.6217 58.1388 62.8417 52.0045C64.0616 45.8703 66.7336 39.6322 70.4577 34.2635C74.1817 28.8948 78.7404 24.6867 83.4325 22.3012C88.1246 19.9058 92.6882 19.4662 96.4073 21.0417C96.6543 21.1454 96.8914 21.259 97.1284 21.3776C100.477 23.0865 102.892 26.445 104.028 31.0186C105.243 35.9082 104.932 41.919 103.144 48.1027Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.42537 64.2881C4.06714 63.5967 3.20281 61.9618 3.20281 59.6356C3.20281 55.472 5.97855 50.6811 9.39636 48.9425L32.3135 37.2667C33.8248 36.4962 35.2077 36.4468 36.2845 36.995L34.0816 35.8739C33.0049 35.3256 31.622 35.375 30.1107 36.1455L7.19355 47.8214C3.77574 49.5599 1 54.3508 1 58.5144C1 60.8407 1.86433 62.4755 3.22257 63.167L5.42537 64.2881Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.42538 64.2881C6.50209 64.8363 7.88502 64.7869 9.39637 64.0164L32.3135 52.3405C35.7362 50.5971 38.507 45.8062 38.507 41.6475C38.507 39.3212 37.6427 37.6864 36.2845 36.995C35.2078 36.4467 33.8248 36.4961 32.3135 37.2666L9.39637 48.9425C5.97362 50.686 3.20282 55.4768 3.20282 59.6355C3.20282 61.9618 4.06715 63.5966 5.42538 64.2881Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M12.5277 53.4267C12.6117 53.2983 12.7351 53.244 12.8142 53.2983C12.8932 53.3526 12.8981 53.5008 12.829 53.6391L12.8142 53.6687L9.8211 58.8399C9.73714 58.9831 9.60378 59.0523 9.51982 58.993C9.43586 58.9337 9.43586 58.7707 9.51982 58.6226L12.5129 53.4514L12.5277 53.4267Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M10.3101 55.1508C10.3101 54.9335 10.1669 54.8347 9.98905 54.9236C9.81124 55.0125 9.66801 55.2595 9.66801 55.4768C9.66801 55.6941 9.81124 55.7929 9.98905 55.704C10.1669 55.6151 10.3101 55.3681 10.3101 55.1508ZM10.7398 54.9335C10.7398 55.4373 10.4039 56.0151 9.98905 56.2275C9.57417 56.4399 9.23831 56.2028 9.23831 55.699C9.23831 55.1953 9.57417 54.6174 9.98905 54.405C10.4039 54.1926 10.7398 54.4297 10.7398 54.9335Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M12.666 56.8159C12.666 56.5985 12.5227 56.4998 12.3449 56.5887C12.1671 56.6776 12.0239 56.9245 12.0239 57.1418C12.0239 57.3591 12.1671 57.4579 12.3449 57.369C12.5227 57.2801 12.666 57.0332 12.666 56.8159ZM13.0907 56.5985C13.0907 57.1023 12.7549 57.6802 12.34 57.8926C11.9251 58.1049 11.5893 57.8679 11.5893 57.3641C11.5893 56.8603 11.9251 56.2824 12.34 56.0701C12.7549 55.8577 13.0907 56.0948 13.0907 56.5985Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M11.0953 51.5356C11.0953 51.3973 11.1892 51.2393 11.3028 51.185C11.9696 50.8886 12.6166 50.7898 13.1944 50.9133C13.8316 51.0467 14.3502 51.4369 14.7107 52.0394C15.0663 52.642 15.2441 53.4421 15.2244 54.3459C15.2046 55.2547 14.9824 56.2376 14.5922 57.1958C14.1971 58.1539 13.6439 59.0528 12.9919 59.7986C12.335 60.5444 11.6041 61.1075 10.8682 61.4285C10.1322 61.7496 9.42101 61.8236 8.80857 61.636C8.2554 61.4631 7.79607 61.0877 7.47997 60.5346C7.42564 60.4407 7.4701 60.2678 7.57382 60.1543C7.67754 60.0407 7.80101 60.0308 7.85534 60.1246C8.1418 60.6136 8.54681 60.9445 9.04071 61.0976C9.59388 61.2655 10.231 61.2013 10.8928 60.9099C11.5547 60.6185 12.2165 60.1147 12.8043 59.443C13.392 58.7713 13.8908 57.9663 14.2464 57.1019C14.6021 56.2376 14.7947 55.3535 14.8144 54.5336C14.8342 53.7187 14.6761 52.9976 14.3551 52.4543C14.0341 51.911 13.5649 51.5603 12.9919 51.4418C12.4783 51.3331 11.9053 51.4171 11.3127 51.6789C11.1991 51.7283 11.1052 51.6641 11.1052 51.5258L11.0953 51.5356Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M29.4143 48.8783L21.0278 53.1505C20.3363 53.5012 19.7782 53.1061 19.7782 52.2665C19.7782 51.4268 20.3363 50.4637 21.0278 50.113L29.4143 45.8408C30.1057 45.4901 30.6639 45.8852 30.6639 46.7249C30.6639 47.5645 30.1057 48.5276 29.4143 48.8783Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M113.63 2.0262C114.79 1.43351 116.292 1.4829 117.927 2.3176L149.225 18.2657C152.92 20.1475 155.918 25.3187 155.918 29.8181C155.918 32.3272 154.984 34.0953 153.522 34.8411L155.725 33.72C157.192 32.9742 158.121 31.206 158.121 28.697C158.121 24.2025 155.123 19.0264 151.428 17.1446L120.125 1.19644C118.49 0.361744 116.993 0.312354 115.828 0.905038L113.625 2.0262H113.63Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M113.63 2.02613C112.163 2.77193 111.234 4.5401 111.234 7.04913C111.234 11.5436 114.232 16.7198 117.927 18.6015L149.225 34.5497C150.86 35.3844 152.357 35.4338 153.522 34.8411C154.989 34.0953 155.918 32.3271 155.918 29.8181C155.918 25.3236 152.92 20.1474 149.225 18.2657L117.922 2.31753C116.287 1.48284 114.79 1.43345 113.625 2.02613H113.63Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M120.179 10.3487V15.0309C120.179 15.8063 120.693 16.7003 121.335 17.0263L127.494 20.1626C128.131 20.4885 128.649 20.1231 128.649 19.3476V14.6654C128.649 13.8949 128.131 12.996 127.494 12.67L126.338 12.0823V11.6131C126.338 10.8426 125.819 9.9437 125.182 9.61773L123.641 8.83242C123.004 8.50644 122.485 8.87687 122.485 9.64736V10.1166L121.33 9.52882C120.693 9.20285 120.174 9.57328 120.174 10.3438L120.179 10.3487ZM127.494 19.2291L126.338 18.6413V13.0207L127.494 13.6085C127.706 13.7171 127.879 14.0135 127.879 14.2752V18.9574C127.879 19.2143 127.706 19.3377 127.494 19.2291ZM123.261 11.4501L125.572 12.6256V18.2462L123.261 17.0707V11.4501ZM123.261 10.0425C123.261 9.78565 123.434 9.66218 123.646 9.77084L125.187 10.5561C125.399 10.6648 125.572 10.9611 125.572 11.2229V11.6921L123.261 10.5166V10.0474V10.0425ZM120.949 10.7389C120.949 10.4821 121.122 10.3586 121.335 10.4672L122.49 11.055V16.6756L121.335 16.0879C121.122 15.9792 120.949 15.6829 120.949 15.4211V10.7389Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M145.398 26.5392V27.9617C145.398 28.1098 145.353 28.2234 145.274 28.2876C145.195 28.3469 145.086 28.3519 144.978 28.2926L135.653 23.5412C135.421 23.4227 135.233 23.077 135.233 22.7757V20.5136L138.058 17.2538C138.216 17.1304 138.399 17.0612 138.621 17.1748C138.844 17.2884 139.026 17.5452 139.184 17.8317L141.629 23.7981L142.686 23.1856C142.844 23.0572 143.061 23.0523 143.284 23.1659C143.506 23.2795 143.723 23.5067 143.881 23.7981L145.403 26.5392H145.398Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/invalid-link.tsx b/packages/propel/src/empty-state/assets/vertical-stack/invalid-link.tsx
index 1483041e8..d2563cc9c 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/invalid-link.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/invalid-link.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const InvalidLinkVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="161"
-    height="151"
-    viewBox="0 0 161 151"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function InvalidLinkVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="161"
+      height="151"
+      viewBox="0 0 161 151"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M0.5 113.76C0.5 115.893 2.09703 118.021 5.28541 119.652L46.3393 140.571C52.7217 143.821 63.0656 143.821 69.4479 140.571L155.715 96.6163C158.903 94.991 160.5 92.8636 160.5 90.7305V97.5417C160.5 99.6749 158.903 101.802 155.715 103.428L69.4479 147.382C63.0656 150.632 52.7217 150.632 46.3393 147.382L5.28541 126.463C2.09139 124.838 0.5 122.705 0.5 120.571V113.76Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M0.5 113.76C0.5 111.627 2.09703 109.499 5.28541 107.874L91.5521 63.9198C97.9345 60.6693 108.278 60.6693 114.661 63.9198L155.715 84.8389C158.909 86.4641 160.5 88.5972 160.5 90.7303C160.5 92.8634 158.903 94.9909 155.715 96.6161L69.4479 140.571C63.0656 143.821 52.7217 143.821 46.3393 140.571L5.28541 119.651C2.09139 118.026 0.5 115.893 0.5 113.76Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M0.5 92.2428C0.5 94.3759 2.09703 96.5034 5.28541 98.1342L46.3393 119.053C52.7217 122.304 63.0656 122.304 69.4479 119.053L155.715 75.0989C158.903 73.4737 160.5 71.3462 160.5 69.2131V76.0244C160.5 78.1575 158.903 80.285 155.715 81.9102L69.4479 125.865C63.0656 129.115 52.7217 129.115 46.3393 125.865L5.28541 104.946C2.09139 103.32 0.5 101.187 0.5 99.0541V92.2428Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M0.5 92.2427C0.5 90.1096 2.09703 87.9821 5.28541 86.3569L91.5521 42.4024C97.9345 39.152 108.278 39.152 114.661 42.4024L155.715 63.3216C158.909 64.9468 160.5 67.0799 160.5 69.213C160.5 71.3461 158.903 73.4736 155.715 75.0988L69.4479 119.053C63.0656 122.304 52.7217 122.304 46.3393 119.053L5.28541 98.1341C2.09139 96.5089 0.5 94.3758 0.5 92.2427Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M0.5 113.76C0.5 115.893 2.09703 118.021 5.28541 119.652L46.3393 140.571C52.7217 143.821 63.0656 143.821 69.4479 140.571L155.715 96.6163C158.903 94.991 160.5 92.8636 160.5 90.7305V97.5417C160.5 99.6749 158.903 101.802 155.715 103.428L69.4479 147.382C63.0656 150.632 52.7217 150.632 46.3393 147.382L5.28541 126.463C2.09139 124.838 0.5 122.705 0.5 120.571V113.76Z"
+        d="M0.5 70.7255C0.5 72.8586 2.09703 74.986 5.28541 76.6169L46.3393 97.536C52.7217 100.786 63.0656 100.786 69.4479 97.536L155.715 53.5816C158.903 51.9564 160.5 49.8289 160.5 47.6958V54.5071C160.5 56.6402 158.903 58.7676 155.715 60.3929L69.4479 104.347C63.0656 107.598 52.7217 107.598 46.3393 104.347L5.28541 83.4282C2.09139 81.8029 0.5 79.6698 0.5 77.5367V70.7255Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -20,159 +56,125 @@ export const InvalidLinkVerticalStackIllustration = ({ className }: TIllustratio
         strokeLinejoin="round"
       />
       <path
-        d="M0.5 113.76C0.5 111.627 2.09703 109.499 5.28541 107.874L91.5521 63.9198C97.9345 60.6693 108.278 60.6693 114.661 63.9198L155.715 84.8389C158.909 86.4641 160.5 88.5972 160.5 90.7303C160.5 92.8634 158.903 94.9909 155.715 96.6161L69.4479 140.571C63.0656 143.821 52.7217 143.821 46.3393 140.571L5.28541 119.651C2.09139 118.026 0.5 115.893 0.5 113.76Z"
+        d="M0.5 70.7253C0.5 68.5922 2.09703 66.4648 5.28541 64.8395L91.5521 20.8851C97.9345 17.6347 108.278 17.6347 114.661 20.8851L155.715 41.8042C158.909 43.4295 160.5 45.5626 160.5 47.6957C160.5 49.8288 158.903 51.9562 155.715 53.5815L69.4479 97.5359C63.0656 100.786 52.7217 100.786 46.3393 97.5359L5.28541 76.6168C2.09139 74.9916 0.5 72.8584 0.5 70.7253Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M0.5 92.2428C0.5 94.3759 2.09703 96.5034 5.28541 98.1342L46.3393 119.053C52.7217 122.304 63.0656 122.304 69.4479 119.053L155.715 75.0989C158.903 73.4737 160.5 71.3462 160.5 69.2131V76.0244C160.5 78.1575 158.903 80.285 155.715 81.9102L69.4479 125.865C63.0656 129.115 52.7217 129.115 46.3393 125.865L5.28541 104.946C2.09139 103.32 0.5 101.187 0.5 99.0541V92.2428Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        d="M110.58 39.925C110.264 39.925 109.959 39.8686 109.683 39.7557C109.621 39.7331 109.564 39.7049 109.508 39.6767L104.48 37.1147C102.877 36.2965 102.55 33.8022 103.718 31.3079C105.332 27.8656 106.224 24.1693 106.224 20.902C106.224 17.9111 105.507 15.4168 104.153 13.6675C104.085 13.6675 104.011 13.6675 103.938 13.6675C102.465 13.6675 100.891 14.085 99.2656 14.9146L92.8663 18.1763C92.3584 18.4359 91.8562 18.5657 91.3765 18.5657C90.9871 18.5657 90.6259 18.4811 90.2986 18.3118L85.2706 15.7498C84.3508 15.2814 83.8203 14.2205 83.8203 12.8436C83.8203 10.4678 85.3609 7.82116 87.3304 6.81668L93.7297 3.55494C96.3707 2.21187 98.9439 1.52905 101.376 1.52905C103.244 1.52905 104.988 1.93536 106.551 2.73104L111.579 5.29303C116.15 7.62365 118.774 13.058 118.774 20.2022C118.774 25.3093 117.391 31.0653 114.88 36.4206C114.22 37.8314 113.193 38.9713 112.064 39.5469C111.556 39.8065 111.06 39.9363 110.58 39.9363V39.925Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M101.382 2.08786C103.176 2.08786 104.83 2.47723 106.303 3.22777L111.331 5.78976C115.541 7.93415 118.215 13.0073 118.215 20.1967C118.215 25.2191 116.85 30.8961 114.372 36.1724C113.746 37.5099 112.781 38.5369 111.81 39.0335C111.393 39.248 110.975 39.3608 110.58 39.3608C110.343 39.3608 110.112 39.3213 109.892 39.231C109.847 39.2141 109.801 39.1915 109.756 39.1689L104.728 36.607C103.43 35.9467 103.199 33.729 104.226 31.5394C105.874 28.0237 106.788 24.2428 106.788 20.8908C106.788 17.5388 105.913 14.8921 104.435 13.1033C104.271 13.092 104.107 13.0863 103.944 13.0863C102.426 13.0863 100.761 13.5039 99.0174 14.3956L92.6181 17.6573C92.1779 17.883 91.7659 17.9846 91.3822 17.9846C91.0831 17.9846 90.8066 17.9169 90.5583 17.7927L85.5303 15.2307C84.8305 14.8752 84.3903 14.0287 84.3903 12.8324C84.3903 10.6824 85.8237 8.21067 87.59 7.30777L93.9893 4.04603C96.6078 2.71425 99.102 2.08221 101.382 2.08221M101.382 0.959229C98.8594 0.959229 96.1958 1.66462 93.4758 3.04719L87.0765 6.30893C84.9377 7.39806 83.2617 10.2648 83.2617 12.838C83.2617 14.4351 83.905 15.6765 85.0224 16.2465L90.0504 18.8085C90.4567 19.0173 90.9082 19.1245 91.3878 19.1245C91.9578 19.1245 92.5447 18.9721 93.1372 18.6731L99.5365 15.4113C101.055 14.6382 102.516 14.2375 103.876 14.2263C105.05 15.8628 105.665 18.1539 105.665 20.8965C105.665 24.0848 104.796 27.6964 103.21 31.0654C101.907 33.8418 102.347 36.6577 104.226 37.6171L109.254 40.1791C109.327 40.2186 109.401 40.2524 109.48 40.2806C109.83 40.4217 110.202 40.4894 110.586 40.4894C111.156 40.4894 111.743 40.3371 112.33 40.038C113.565 39.406 114.688 38.1701 115.399 36.6521C117.944 31.229 119.344 25.3828 119.344 20.1967C119.344 12.8324 116.607 7.21747 111.839 4.78528L106.811 2.22329C105.163 1.38246 103.334 0.959229 101.376 0.959229H101.382Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M59.6229 72.1755C57.755 72.1755 56.0113 71.7692 54.4482 70.9735L49.4201 68.4115C44.8492 66.0809 42.2251 60.6465 42.2251 53.5023C42.2251 40.4272 50.9776 25.3318 61.7334 19.8523C62.2413 19.5927 62.7436 19.4629 63.2232 19.4629C63.6126 19.4629 63.9738 19.5475 64.3011 19.7168L69.3291 22.2788C70.249 22.7472 70.7794 23.8081 70.7794 25.185C70.7794 27.5608 69.2388 30.2074 67.2694 31.2119C60.3791 34.7219 54.7755 44.4112 54.7755 52.8082C54.7755 55.7991 55.4921 58.2934 56.8465 60.0427C56.9142 60.0427 56.9876 60.0427 57.0609 60.0427C58.5338 60.0427 60.1082 59.6251 61.7334 58.7956L68.1328 55.5339C68.6407 55.2743 69.1429 55.1445 69.6226 55.1445C70.012 55.1445 70.3731 55.2291 70.7004 55.3984L75.7284 57.9604C76.6483 58.4288 77.1787 59.4897 77.1787 60.861C77.1787 63.2367 75.6382 65.8834 73.6687 66.8879L67.2694 70.1496C64.6284 71.4927 62.0551 72.1755 59.6229 72.1755Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M63.2231 20.033C63.5222 20.033 63.7987 20.1007 64.047 20.2248L69.075 22.7868C69.7748 23.1423 70.2206 23.9888 70.2206 25.1851C70.2206 27.3352 68.7872 29.8069 67.0209 30.7098C59.9614 34.3045 54.2223 44.2195 54.2223 52.8083C54.2223 56.1547 55.097 58.807 56.5755 60.5959C56.7392 60.6071 56.9028 60.6128 57.0665 60.6128C58.5845 60.6128 60.2492 60.1952 61.9929 59.3036L68.3922 56.0419C68.8324 55.8161 69.2443 55.7145 69.6281 55.7145C69.9271 55.7145 70.2037 55.7823 70.452 55.9064L75.48 58.4684C76.1798 58.8239 76.6256 59.6704 76.6256 60.8667C76.6256 63.0168 75.1922 65.4885 73.4259 66.3914L67.0266 69.6531C64.4082 70.9849 61.9139 71.6169 59.6341 71.6169C57.8396 71.6169 56.1861 71.2275 54.7132 70.477L49.6852 67.915C45.4754 65.7706 42.8006 60.6974 42.8006 53.5081C42.8006 40.6248 51.412 25.7551 61.9986 20.3603C62.4387 20.1345 62.8507 20.033 63.2344 20.033M63.2231 18.9043C62.6531 18.9043 62.0663 19.0567 61.4737 19.3558C50.5486 24.9256 41.6606 40.241 41.6606 53.5081C41.6606 60.8724 44.3976 66.4873 49.1661 68.9195L54.1941 71.4815C55.8419 72.3223 57.6703 72.7455 59.6284 72.7455C62.1509 72.7455 64.8145 72.0402 67.5345 70.6576L73.9338 67.3959C76.0725 66.3067 77.7485 63.4344 77.7485 60.8667C77.7485 59.2697 77.1052 58.0282 75.9879 57.4583L70.9599 54.8963C70.5536 54.6875 70.1021 54.5803 69.6224 54.5803C69.0525 54.5803 68.4656 54.7326 67.873 55.0317L61.4737 58.2935C59.9557 59.0666 58.4942 59.4672 57.1342 59.4785C55.9604 57.842 55.3453 55.5509 55.3453 52.8083C55.3453 44.6032 60.8135 35.1396 67.5288 31.7143C69.6676 30.6251 71.3436 27.7528 71.3436 25.1851C71.3436 23.5881 70.7003 22.3466 69.5829 21.7767L64.5549 19.2147C64.1486 19.0059 63.6971 18.8987 63.2175 18.8987L63.2231 18.9043Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M68.9849 49.4395C68.5955 49.4395 68.2343 49.3548 67.907 49.1855L62.879 46.6235C61.9592 46.1552 61.4287 45.0942 61.4287 43.7173C61.4287 41.3416 62.9693 38.6949 64.9387 37.6904L77.7374 31.167C78.2453 30.9074 78.7475 30.7776 79.2272 30.7776C79.6165 30.7776 79.9777 30.8622 80.305 31.0315L85.3331 33.5935C86.2529 34.0619 86.7833 35.1228 86.7833 36.4997C86.7833 38.8755 85.2428 41.5221 83.2733 42.5266L70.4747 49.0501C69.9668 49.3097 69.4646 49.4395 68.9849 49.4395Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M79.2217 31.3474C79.5207 31.3474 79.7973 31.4151 80.0456 31.5392L85.0736 34.1012C85.7734 34.4567 86.2135 35.3032 86.2135 36.4996C86.2135 38.6496 84.7802 41.1213 83.0139 42.0242L70.2152 48.5477C69.7751 48.7734 69.3631 48.875 68.9794 48.875C68.6803 48.875 68.4038 48.8073 68.1555 48.6831L63.1274 46.1211C62.4277 45.7656 61.9875 44.9191 61.9875 43.7228C61.9875 41.5728 63.4209 39.1011 65.1872 38.1982L77.9858 31.6747C78.426 31.449 78.8379 31.3474 79.2217 31.3474ZM79.2217 30.2188C78.6517 30.2188 78.0648 30.3711 77.4723 30.6702L64.6737 37.1937C62.5349 38.2828 60.8589 41.1495 60.8589 43.7228C60.8589 45.3198 61.5022 46.5613 62.6195 47.1312L67.6476 49.6932C68.0539 49.902 68.5054 50.0093 68.985 50.0093C69.555 50.0093 70.1419 49.8569 70.7344 49.5578L83.533 43.0343C85.6718 41.9452 87.3478 39.0785 87.3478 36.5052C87.3478 34.9082 86.7045 33.6667 85.5871 33.0968L80.5591 30.5348C80.1528 30.326 79.7013 30.2188 79.2217 30.2188Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M107.222 13.8535C110.027 15.2812 111.816 18.6671 111.816 23.4581C111.816 26.8101 110.907 30.5911 109.254 34.1067C108.227 36.2963 108.464 38.514 109.756 39.1743L104.728 36.6123C103.43 35.952 103.199 33.7343 104.226 31.5447C105.874 28.0291 106.788 24.2482 106.788 20.8961C106.788 16.1051 104.999 12.7192 102.194 11.2915L107.222 13.8535Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M111.331 5.79515C107.995 4.09657 103.701 4.232 99.0172 6.61905L92.6178 9.88078C90.8515 10.7837 89.4182 13.2554 89.4182 15.4054C89.4182 16.6018 89.864 17.4482 90.5637 17.8038L85.5357 15.2418C84.8359 14.8863 84.3901 14.0398 84.3901 12.8434C84.3901 10.6934 85.8235 8.2217 87.5898 7.3188L93.9891 4.05706C98.6729 1.67001 102.967 1.53458 106.302 3.23316L111.331 5.79515Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M111.331 5.7952C115.54 7.9396 118.215 13.0128 118.215 20.2021C118.215 25.2245 116.85 30.9015 114.372 36.1779C113.746 37.5153 112.781 38.5424 111.81 39.039C111.144 39.3775 110.467 39.4678 109.892 39.2365C109.846 39.2195 109.801 39.197 109.756 39.1744C108.458 38.5141 108.227 36.2964 109.254 34.1068C110.902 30.5912 111.816 26.8103 111.816 23.4582C111.816 18.6672 110.027 15.2813 107.222 13.8536C104.999 12.7193 102.138 12.8153 99.0172 14.401L92.6179 17.6627C91.8335 18.0634 91.1168 18.086 90.5582 17.7982C89.8584 17.4427 89.4126 16.5962 89.4126 15.3998C89.4126 13.2498 90.846 10.7781 92.6123 9.8752L99.0116 6.61346C103.695 4.22641 107.99 4.09097 111.325 5.78956L111.331 5.7952Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M75.474 58.4626C74.9153 58.1805 74.1986 58.2031 73.4142 58.5981L67.0149 61.8598C63.8943 63.4512 61.0332 63.5415 58.8098 62.4072L53.7817 59.8452C56.0051 60.9795 58.8662 60.8835 61.9869 59.2978L68.3862 56.0361C69.1706 55.6354 69.8872 55.6129 70.4459 55.9007L75.474 58.4626Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M69.0748 22.7869C68.5162 22.5047 67.7995 22.5273 67.0151 22.9223C56.4286 28.3171 47.8171 43.1868 47.8171 56.0701C47.8171 63.2538 50.4976 68.3327 54.7018 70.4771L49.6737 67.9151C45.4639 65.7707 42.7891 60.6975 42.7891 53.5081C42.7891 40.6248 51.4005 25.7552 61.987 20.3603C62.7714 19.9596 63.4881 19.9371 64.0468 20.2249L69.0748 22.7869Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M69.075 22.7869C69.7748 23.1424 70.2206 23.9889 70.2206 25.1852C70.2206 27.3353 68.7872 29.807 67.0209 30.7099C59.9613 34.3045 54.2223 44.2195 54.2223 52.8084C54.2223 57.5994 56.0112 60.9853 58.8158 62.413C61.0392 63.5473 63.9003 63.4514 67.0209 61.8657L73.4202 58.6039C74.2046 58.2033 74.9213 58.1807 75.48 58.4685C76.1798 58.824 76.6256 59.6705 76.6256 60.8668C76.6256 63.0168 75.1922 65.4885 73.4259 66.3915L67.0266 69.6532C62.3428 72.0402 58.0483 72.1757 54.7132 70.4771C50.5034 68.3327 47.8286 63.2595 47.8286 56.0701C47.8286 43.1868 56.44 28.3172 67.0266 22.9223C67.811 22.5217 68.5277 22.4991 69.0863 22.7869H69.075Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M85.0729 34.1013C84.5143 33.8192 83.7976 33.8417 83.0132 34.2368L70.2145 40.7602C68.4482 41.6631 67.0149 44.1348 67.0149 46.2849C67.0149 47.4812 67.4607 48.3277 68.1604 48.6832L63.1324 46.1212C62.4326 45.7657 61.9868 44.9192 61.9868 43.7229C61.9868 41.5728 63.4202 39.1011 65.1865 38.1982L77.9851 31.6748C78.7695 31.2741 79.4862 31.2515 80.0449 31.5393L85.0729 34.1013Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
-        d="M0.5 92.2427C0.5 90.1096 2.09703 87.9821 5.28541 86.3569L91.5521 42.4024C97.9345 39.152 108.278 39.152 114.661 42.4024L155.715 63.3216C158.909 64.9468 160.5 67.0799 160.5 69.213C160.5 71.3461 158.903 73.4736 155.715 75.0988L69.4479 119.053C63.0656 122.304 52.7217 122.304 46.3393 119.053L5.28541 98.1341C2.09139 96.5089 0.5 94.3758 0.5 92.2427Z"
+        d="M85.0727 34.1013C85.7725 34.4569 86.2182 35.3033 86.2182 36.4997C86.2182 38.6497 84.7849 41.1214 83.0186 42.0243L70.2199 48.5478C69.4356 48.9485 68.7189 48.971 68.1602 48.6832C67.4604 48.3277 67.0146 47.4812 67.0146 46.2849C67.0146 44.1348 68.448 41.6632 70.2143 40.7602L83.0129 34.2368C83.7973 33.8361 84.514 33.8135 85.0727 34.1013Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M0.5 70.7255C0.5 72.8586 2.09703 74.986 5.28541 76.6169L46.3393 97.536C52.7217 100.786 63.0656 100.786 69.4479 97.536L155.715 53.5816C158.903 51.9564 160.5 49.8289 160.5 47.6958V54.5071C160.5 56.6402 158.903 58.7676 155.715 60.3929L69.4479 104.347C63.0656 107.598 52.7217 107.598 46.3393 104.347L5.28541 83.4282C2.09139 81.8029 0.5 79.6698 0.5 77.5367V70.7255Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M0.5 70.7253C0.5 68.5922 2.09703 66.4648 5.28541 64.8395L91.5521 20.8851C97.9345 17.6347 108.278 17.6347 114.661 20.8851L155.715 41.8042C158.909 43.4295 160.5 45.5626 160.5 47.6957C160.5 49.8288 158.903 51.9562 155.715 53.5815L69.4479 97.5359C63.0656 100.786 52.7217 100.786 46.3393 97.5359L5.28541 76.6168C2.09139 74.9916 0.5 72.8584 0.5 70.7253Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M110.58 39.925C110.264 39.925 109.959 39.8686 109.683 39.7557C109.621 39.7331 109.564 39.7049 109.508 39.6767L104.48 37.1147C102.877 36.2965 102.55 33.8022 103.718 31.3079C105.332 27.8656 106.224 24.1693 106.224 20.902C106.224 17.9111 105.507 15.4168 104.153 13.6675C104.085 13.6675 104.011 13.6675 103.938 13.6675C102.465 13.6675 100.891 14.085 99.2656 14.9146L92.8663 18.1763C92.3584 18.4359 91.8562 18.5657 91.3765 18.5657C90.9871 18.5657 90.6259 18.4811 90.2986 18.3118L85.2706 15.7498C84.3508 15.2814 83.8203 14.2205 83.8203 12.8436C83.8203 10.4678 85.3609 7.82116 87.3304 6.81668L93.7297 3.55494C96.3707 2.21187 98.9439 1.52905 101.376 1.52905C103.244 1.52905 104.988 1.93536 106.551 2.73104L111.579 5.29303C116.15 7.62365 118.774 13.058 118.774 20.2022C118.774 25.3093 117.391 31.0653 114.88 36.4206C114.22 37.8314 113.193 38.9713 112.064 39.5469C111.556 39.8065 111.06 39.9363 110.58 39.9363V39.925Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M101.382 2.08786C103.176 2.08786 104.83 2.47723 106.303 3.22777L111.331 5.78976C115.541 7.93415 118.215 13.0073 118.215 20.1967C118.215 25.2191 116.85 30.8961 114.372 36.1724C113.746 37.5099 112.781 38.5369 111.81 39.0335C111.393 39.248 110.975 39.3608 110.58 39.3608C110.343 39.3608 110.112 39.3213 109.892 39.231C109.847 39.2141 109.801 39.1915 109.756 39.1689L104.728 36.607C103.43 35.9467 103.199 33.729 104.226 31.5394C105.874 28.0237 106.788 24.2428 106.788 20.8908C106.788 17.5388 105.913 14.8921 104.435 13.1033C104.271 13.092 104.107 13.0863 103.944 13.0863C102.426 13.0863 100.761 13.5039 99.0174 14.3956L92.6181 17.6573C92.1779 17.883 91.7659 17.9846 91.3822 17.9846C91.0831 17.9846 90.8066 17.9169 90.5583 17.7927L85.5303 15.2307C84.8305 14.8752 84.3903 14.0287 84.3903 12.8324C84.3903 10.6824 85.8237 8.21067 87.59 7.30777L93.9893 4.04603C96.6078 2.71425 99.102 2.08221 101.382 2.08221M101.382 0.959229C98.8594 0.959229 96.1958 1.66462 93.4758 3.04719L87.0765 6.30893C84.9377 7.39806 83.2617 10.2648 83.2617 12.838C83.2617 14.4351 83.905 15.6765 85.0224 16.2465L90.0504 18.8085C90.4567 19.0173 90.9082 19.1245 91.3878 19.1245C91.9578 19.1245 92.5447 18.9721 93.1372 18.6731L99.5365 15.4113C101.055 14.6382 102.516 14.2375 103.876 14.2263C105.05 15.8628 105.665 18.1539 105.665 20.8965C105.665 24.0848 104.796 27.6964 103.21 31.0654C101.907 33.8418 102.347 36.6577 104.226 37.6171L109.254 40.1791C109.327 40.2186 109.401 40.2524 109.48 40.2806C109.83 40.4217 110.202 40.4894 110.586 40.4894C111.156 40.4894 111.743 40.3371 112.33 40.038C113.565 39.406 114.688 38.1701 115.399 36.6521C117.944 31.229 119.344 25.3828 119.344 20.1967C119.344 12.8324 116.607 7.21747 111.839 4.78528L106.811 2.22329C105.163 1.38246 103.334 0.959229 101.376 0.959229H101.382Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M59.6229 72.1755C57.755 72.1755 56.0113 71.7692 54.4482 70.9735L49.4201 68.4115C44.8492 66.0809 42.2251 60.6465 42.2251 53.5023C42.2251 40.4272 50.9776 25.3318 61.7334 19.8523C62.2413 19.5927 62.7436 19.4629 63.2232 19.4629C63.6126 19.4629 63.9738 19.5475 64.3011 19.7168L69.3291 22.2788C70.249 22.7472 70.7794 23.8081 70.7794 25.185C70.7794 27.5608 69.2388 30.2074 67.2694 31.2119C60.3791 34.7219 54.7755 44.4112 54.7755 52.8082C54.7755 55.7991 55.4921 58.2934 56.8465 60.0427C56.9142 60.0427 56.9876 60.0427 57.0609 60.0427C58.5338 60.0427 60.1082 59.6251 61.7334 58.7956L68.1328 55.5339C68.6407 55.2743 69.1429 55.1445 69.6226 55.1445C70.012 55.1445 70.3731 55.2291 70.7004 55.3984L75.7284 57.9604C76.6483 58.4288 77.1787 59.4897 77.1787 60.861C77.1787 63.2367 75.6382 65.8834 73.6687 66.8879L67.2694 70.1496C64.6284 71.4927 62.0551 72.1755 59.6229 72.1755Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M63.2231 20.033C63.5222 20.033 63.7987 20.1007 64.047 20.2248L69.075 22.7868C69.7748 23.1423 70.2206 23.9888 70.2206 25.1851C70.2206 27.3352 68.7872 29.8069 67.0209 30.7098C59.9614 34.3045 54.2223 44.2195 54.2223 52.8083C54.2223 56.1547 55.097 58.807 56.5755 60.5959C56.7392 60.6071 56.9028 60.6128 57.0665 60.6128C58.5845 60.6128 60.2492 60.1952 61.9929 59.3036L68.3922 56.0419C68.8324 55.8161 69.2443 55.7145 69.6281 55.7145C69.9271 55.7145 70.2037 55.7823 70.452 55.9064L75.48 58.4684C76.1798 58.8239 76.6256 59.6704 76.6256 60.8667C76.6256 63.0168 75.1922 65.4885 73.4259 66.3914L67.0266 69.6531C64.4082 70.9849 61.9139 71.6169 59.6341 71.6169C57.8396 71.6169 56.1861 71.2275 54.7132 70.477L49.6852 67.915C45.4754 65.7706 42.8006 60.6974 42.8006 53.5081C42.8006 40.6248 51.412 25.7551 61.9986 20.3603C62.4387 20.1345 62.8507 20.033 63.2344 20.033M63.2231 18.9043C62.6531 18.9043 62.0663 19.0567 61.4737 19.3558C50.5486 24.9256 41.6606 40.241 41.6606 53.5081C41.6606 60.8724 44.3976 66.4873 49.1661 68.9195L54.1941 71.4815C55.8419 72.3223 57.6703 72.7455 59.6284 72.7455C62.1509 72.7455 64.8145 72.0402 67.5345 70.6576L73.9338 67.3959C76.0725 66.3067 77.7485 63.4344 77.7485 60.8667C77.7485 59.2697 77.1052 58.0282 75.9879 57.4583L70.9599 54.8963C70.5536 54.6875 70.1021 54.5803 69.6224 54.5803C69.0525 54.5803 68.4656 54.7326 67.873 55.0317L61.4737 58.2935C59.9557 59.0666 58.4942 59.4672 57.1342 59.4785C55.9604 57.842 55.3453 55.5509 55.3453 52.8083C55.3453 44.6032 60.8135 35.1396 67.5288 31.7143C69.6676 30.6251 71.3436 27.7528 71.3436 25.1851C71.3436 23.5881 70.7003 22.3466 69.5829 21.7767L64.5549 19.2147C64.1486 19.0059 63.6971 18.8987 63.2175 18.8987L63.2231 18.9043Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M68.9849 49.4395C68.5955 49.4395 68.2343 49.3548 67.907 49.1855L62.879 46.6235C61.9592 46.1552 61.4287 45.0942 61.4287 43.7173C61.4287 41.3416 62.9693 38.6949 64.9387 37.6904L77.7374 31.167C78.2453 30.9074 78.7475 30.7776 79.2272 30.7776C79.6165 30.7776 79.9777 30.8622 80.305 31.0315L85.3331 33.5935C86.2529 34.0619 86.7833 35.1228 86.7833 36.4997C86.7833 38.8755 85.2428 41.5221 83.2733 42.5266L70.4747 49.0501C69.9668 49.3097 69.4646 49.4395 68.9849 49.4395Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M79.2217 31.3474C79.5207 31.3474 79.7973 31.4151 80.0456 31.5392L85.0736 34.1012C85.7734 34.4567 86.2135 35.3032 86.2135 36.4996C86.2135 38.6496 84.7802 41.1213 83.0139 42.0242L70.2152 48.5477C69.7751 48.7734 69.3631 48.875 68.9794 48.875C68.6803 48.875 68.4038 48.8073 68.1555 48.6831L63.1274 46.1211C62.4277 45.7656 61.9875 44.9191 61.9875 43.7228C61.9875 41.5728 63.4209 39.1011 65.1872 38.1982L77.9858 31.6747C78.426 31.449 78.8379 31.3474 79.2217 31.3474ZM79.2217 30.2188C78.6517 30.2188 78.0648 30.3711 77.4723 30.6702L64.6737 37.1937C62.5349 38.2828 60.8589 41.1495 60.8589 43.7228C60.8589 45.3198 61.5022 46.5613 62.6195 47.1312L67.6476 49.6932C68.0539 49.902 68.5054 50.0093 68.985 50.0093C69.555 50.0093 70.1419 49.8569 70.7344 49.5578L83.533 43.0343C85.6718 41.9452 87.3478 39.0785 87.3478 36.5052C87.3478 34.9082 86.7045 33.6667 85.5871 33.0968L80.5591 30.5348C80.1528 30.326 79.7013 30.2188 79.2217 30.2188Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M107.222 13.8535C110.027 15.2812 111.816 18.6671 111.816 23.4581C111.816 26.8101 110.907 30.5911 109.254 34.1067C108.227 36.2963 108.464 38.514 109.756 39.1743L104.728 36.6123C103.43 35.952 103.199 33.7343 104.226 31.5447C105.874 28.0291 106.788 24.2482 106.788 20.8961C106.788 16.1051 104.999 12.7192 102.194 11.2915L107.222 13.8535Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M111.331 5.79515C107.995 4.09657 103.701 4.232 99.0172 6.61905L92.6178 9.88078C90.8515 10.7837 89.4182 13.2554 89.4182 15.4054C89.4182 16.6018 89.864 17.4482 90.5637 17.8038L85.5357 15.2418C84.8359 14.8863 84.3901 14.0398 84.3901 12.8434C84.3901 10.6934 85.8235 8.2217 87.5898 7.3188L93.9891 4.05706C98.6729 1.67001 102.967 1.53458 106.302 3.23316L111.331 5.79515Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M111.331 5.7952C115.54 7.9396 118.215 13.0128 118.215 20.2021C118.215 25.2245 116.85 30.9015 114.372 36.1779C113.746 37.5153 112.781 38.5424 111.81 39.039C111.144 39.3775 110.467 39.4678 109.892 39.2365C109.846 39.2195 109.801 39.197 109.756 39.1744C108.458 38.5141 108.227 36.2964 109.254 34.1068C110.902 30.5912 111.816 26.8103 111.816 23.4582C111.816 18.6672 110.027 15.2813 107.222 13.8536C104.999 12.7193 102.138 12.8153 99.0172 14.401L92.6179 17.6627C91.8335 18.0634 91.1168 18.086 90.5582 17.7982C89.8584 17.4427 89.4126 16.5962 89.4126 15.3998C89.4126 13.2498 90.846 10.7781 92.6123 9.8752L99.0116 6.61346C103.695 4.22641 107.99 4.09097 111.325 5.78956L111.331 5.7952Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M75.474 58.4626C74.9153 58.1805 74.1986 58.2031 73.4142 58.5981L67.0149 61.8598C63.8943 63.4512 61.0332 63.5415 58.8098 62.4072L53.7817 59.8452C56.0051 60.9795 58.8662 60.8835 61.9869 59.2978L68.3862 56.0361C69.1706 55.6354 69.8872 55.6129 70.4459 55.9007L75.474 58.4626Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M69.0748 22.7869C68.5162 22.5047 67.7995 22.5273 67.0151 22.9223C56.4286 28.3171 47.8171 43.1868 47.8171 56.0701C47.8171 63.2538 50.4976 68.3327 54.7018 70.4771L49.6737 67.9151C45.4639 65.7707 42.7891 60.6975 42.7891 53.5081C42.7891 40.6248 51.4005 25.7552 61.987 20.3603C62.7714 19.9596 63.4881 19.9371 64.0468 20.2249L69.0748 22.7869Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M69.075 22.7869C69.7748 23.1424 70.2206 23.9889 70.2206 25.1852C70.2206 27.3353 68.7872 29.807 67.0209 30.7099C59.9613 34.3045 54.2223 44.2195 54.2223 52.8084C54.2223 57.5994 56.0112 60.9853 58.8158 62.413C61.0392 63.5473 63.9003 63.4514 67.0209 61.8657L73.4202 58.6039C74.2046 58.2033 74.9213 58.1807 75.48 58.4685C76.1798 58.824 76.6256 59.6705 76.6256 60.8668C76.6256 63.0168 75.1922 65.4885 73.4259 66.3915L67.0266 69.6532C62.3428 72.0402 58.0483 72.1757 54.7132 70.4771C50.5034 68.3327 47.8286 63.2595 47.8286 56.0701C47.8286 43.1868 56.44 28.3172 67.0266 22.9223C67.811 22.5217 68.5277 22.4991 69.0863 22.7869H69.075Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M85.0729 34.1013C84.5143 33.8192 83.7976 33.8417 83.0132 34.2368L70.2145 40.7602C68.4482 41.6631 67.0149 44.1348 67.0149 46.2849C67.0149 47.4812 67.4607 48.3277 68.1604 48.6832L63.1324 46.1212C62.4326 45.7657 61.9868 44.9192 61.9868 43.7229C61.9868 41.5728 63.4202 39.1011 65.1865 38.1982L77.9851 31.6748C78.7695 31.2741 79.4862 31.2515 80.0449 31.5393L85.0729 34.1013Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M85.0727 34.1013C85.7725 34.4569 86.2182 35.3033 86.2182 36.4997C86.2182 38.6497 84.7849 41.1214 83.0186 42.0243L70.2199 48.5478C69.4356 48.9485 68.7189 48.971 68.1602 48.6832C67.4604 48.3277 67.0146 47.4812 67.0146 46.2849C67.0146 44.1348 68.448 41.6632 70.2143 40.7602L83.0129 34.2368C83.7973 33.8361 84.514 33.8135 85.0727 34.1013Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M111.269 58.1467C110.885 58.1467 110.518 58.062 110.191 57.8927L105.163 55.3307C105.067 55.28 104.977 55.2292 104.886 55.1614L40.8876 9.89216C39.3808 8.82561 39.3131 6.08304 40.7239 3.6452C41.7453 1.88454 43.3085 0.744629 44.7136 0.744629C45.0974 0.744629 45.4585 0.829275 45.7858 0.99857L50.8139 3.56056C50.9098 3.61135 51.0001 3.66778 51.0904 3.72985L115.089 48.9991C116.596 50.0657 116.664 52.8083 115.253 55.2461C114.593 56.3804 113.707 57.2776 112.759 57.7573C112.251 58.0169 111.748 58.1467 111.269 58.1467Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M44.7138 1.30905C45.0016 1.30905 45.2781 1.37112 45.532 1.50092L50.56 4.0629C50.6334 4.09676 50.7011 4.14191 50.7688 4.18705L114.768 49.4563C116.021 50.3423 116.021 52.8027 114.768 54.964C114.141 56.0419 113.323 56.8432 112.505 57.2552C112.082 57.4696 111.664 57.5825 111.269 57.5825C110.976 57.5825 110.699 57.5204 110.451 57.3906L105.423 54.8286C105.349 54.7948 105.282 54.7496 105.214 54.7045L41.215 9.43517C39.9622 8.5492 39.9622 6.08879 41.215 3.92747C42.1631 2.29095 43.5513 1.30905 44.7138 1.30905ZM44.7138 0.18042C43.0885 0.18042 41.373 1.39934 40.2388 3.36315C38.6812 6.05493 38.8223 9.1248 40.566 10.355L104.565 55.6243C104.678 55.7033 104.791 55.771 104.909 55.8331L109.937 58.3951C110.343 58.6039 110.795 58.7111 111.269 58.7111C111.839 58.7111 112.431 58.5587 113.018 58.2596C114.062 57.7292 115.033 56.7586 115.744 55.5284C117.301 52.8366 117.16 49.7667 115.417 48.5365L51.4178 3.26722C51.305 3.18821 51.1921 3.1205 51.0736 3.05842L46.0455 0.496436C45.6392 0.287639 45.1934 0.186063 44.7138 0.186063V0.18042Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M50.56 4.06297C49.3016 3.41966 47.4281 4.45235 46.243 6.49517C44.9902 8.65085 44.9902 11.1169 46.243 12.0029L110.242 57.2722C110.31 57.3173 110.377 57.3625 110.451 57.3963L105.423 54.8343C105.349 54.8005 105.282 54.7553 105.214 54.7102L41.215 9.44089C39.9622 8.55492 39.9622 6.09451 41.215 3.93318C42.4 1.89036 44.2736 0.857669 45.532 1.50099L50.56 4.06297Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M50.5598 4.06278C50.6332 4.09664 50.7009 4.14179 50.7686 4.18693L114.768 49.4562C116.02 50.3422 116.02 52.8026 114.768 54.9639C114.141 56.0418 113.323 56.8431 112.505 57.255C111.771 57.6275 111.043 57.6952 110.451 57.3905C110.377 57.3566 110.309 57.3115 110.242 57.2663L46.2428 11.997C44.99 11.1111 44.99 8.65066 46.2428 6.48934C47.4279 4.44652 49.3014 3.41382 50.5598 4.05714V4.06278Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+      <path
+        d="M111.269 58.1467C110.885 58.1467 110.518 58.062 110.191 57.8927L105.163 55.3307C105.067 55.28 104.977 55.2292 104.886 55.1614L40.8876 9.89216C39.3808 8.82561 39.3131 6.08304 40.7239 3.6452C41.7453 1.88454 43.3085 0.744629 44.7136 0.744629C45.0974 0.744629 45.4585 0.829275 45.7858 0.99857L50.8139 3.56056C50.9098 3.61135 51.0001 3.66778 51.0904 3.72985L115.089 48.9991C116.596 50.0657 116.664 52.8083 115.253 55.2461C114.593 56.3804 113.707 57.2776 112.759 57.7573C112.251 58.0169 111.748 58.1467 111.269 58.1467Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M44.7138 1.30905C45.0016 1.30905 45.2781 1.37112 45.532 1.50092L50.56 4.0629C50.6334 4.09676 50.7011 4.14191 50.7688 4.18705L114.768 49.4563C116.021 50.3423 116.021 52.8027 114.768 54.964C114.141 56.0419 113.323 56.8432 112.505 57.2552C112.082 57.4696 111.664 57.5825 111.269 57.5825C110.976 57.5825 110.699 57.5204 110.451 57.3906L105.423 54.8286C105.349 54.7948 105.282 54.7496 105.214 54.7045L41.215 9.43517C39.9622 8.5492 39.9622 6.08879 41.215 3.92747C42.1631 2.29095 43.5513 1.30905 44.7138 1.30905ZM44.7138 0.18042C43.0885 0.18042 41.373 1.39934 40.2388 3.36315C38.6812 6.05493 38.8223 9.1248 40.566 10.355L104.565 55.6243C104.678 55.7033 104.791 55.771 104.909 55.8331L109.937 58.3951C110.343 58.6039 110.795 58.7111 111.269 58.7111C111.839 58.7111 112.431 58.5587 113.018 58.2596C114.062 57.7292 115.033 56.7586 115.744 55.5284C117.301 52.8366 117.16 49.7667 115.417 48.5365L51.4178 3.26722C51.305 3.18821 51.1921 3.1205 51.0736 3.05842L46.0455 0.496436C45.6392 0.287639 45.1934 0.186063 44.7138 0.186063V0.18042Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M50.56 4.06297C49.3016 3.41966 47.4281 4.45235 46.243 6.49517C44.9902 8.65085 44.9902 11.1169 46.243 12.0029L110.242 57.2722C110.31 57.3173 110.377 57.3625 110.451 57.3963L105.423 54.8343C105.349 54.8005 105.282 54.7553 105.214 54.7102L41.215 9.44089C39.9622 8.55492 39.9622 6.09451 41.215 3.93318C42.4 1.89036 44.2736 0.857669 45.532 1.50099L50.56 4.06297Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M50.5598 4.06278C50.6332 4.09664 50.7009 4.14179 50.7686 4.18693L114.768 49.4562C116.02 50.3422 116.02 52.8026 114.768 54.9639C114.141 56.0418 113.323 56.8431 112.505 57.255C111.771 57.6275 111.043 57.6952 110.451 57.3905C110.377 57.3566 110.309 57.3115 110.242 57.2663L46.2428 11.997C44.99 11.1111 44.99 8.65066 46.2428 6.48934C47.4279 4.44652 49.3014 3.41382 50.5598 4.05714V4.06278Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/module.tsx b/packages/propel/src/empty-state/assets/vertical-stack/module.tsx
index 38de28f7f..328f125bb 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/module.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/module.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const ModuleVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="168"
-    viewBox="0 0 162 168"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function ModuleVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="168"
+      viewBox="0 0 162 168"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M13.5711 136.431C13.5711 138.262 14.9421 140.088 17.6793 141.489L52.9231 159.447C58.4023 162.238 67.2823 162.238 72.7614 159.447L146.82 121.713C149.557 120.318 150.928 118.492 150.928 116.66V122.508C150.928 124.339 149.557 126.165 146.82 127.561L72.7614 165.294C67.2823 168.085 58.4023 168.085 52.9231 165.294L17.6793 147.336C14.9373 145.941 13.5711 144.109 13.5711 142.278V136.431Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M13.5711 136.431C13.5711 134.599 14.9421 132.773 17.6793 131.378L91.7374 93.644C97.2166 90.8536 106.097 90.8536 111.576 93.644L146.82 111.603C149.562 112.998 150.928 114.829 150.928 116.66C150.928 118.492 149.557 120.318 146.82 121.713L72.7614 159.447C67.2823 162.237 58.4023 162.237 52.9231 159.447L17.6793 141.488C14.9373 140.093 13.5711 138.262 13.5711 136.431Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M13.5711 117.959C13.5711 119.79 14.9421 121.616 17.6793 123.016L52.9231 140.975C58.4023 143.765 67.2823 143.765 72.7614 140.975L146.82 103.241C149.557 101.846 150.928 100.019 150.928 98.1882V104.036C150.928 105.867 149.557 107.693 146.82 109.088L72.7614 146.822C67.2823 149.613 58.4023 149.613 52.9231 146.822L17.6793 128.864C14.9373 127.468 13.5711 125.637 13.5711 123.806V117.959Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M13.5711 117.959C13.5711 116.127 14.9421 114.301 17.6793 112.906L91.7374 75.1718C97.2166 72.3814 106.097 72.3814 111.576 75.1718L146.82 93.1305C149.562 94.5257 150.928 96.3569 150.928 98.1881C150.928 100.019 149.557 101.846 146.82 103.241L72.7614 140.975C67.2823 143.765 58.4023 143.765 52.9231 140.975L17.6793 123.016C14.9373 121.621 13.5711 119.79 13.5711 117.959Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.35"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M13.5711 136.431C13.5711 138.262 14.9421 140.088 17.6793 141.489L52.9231 159.447C58.4023 162.238 67.2823 162.238 72.7614 159.447L146.82 121.713C149.557 120.318 150.928 118.492 150.928 116.66V122.508C150.928 124.339 149.557 126.165 146.82 127.561L72.7614 165.294C67.2823 168.085 58.4023 168.085 52.9231 165.294L17.6793 147.336C14.9373 145.941 13.5711 144.109 13.5711 142.278V136.431Z"
+        d="M13.5711 99.4866C13.5711 101.318 14.9421 103.144 17.6793 104.544L52.9231 122.503C58.4023 125.293 67.2823 125.293 72.7614 122.503L146.82 84.7688C149.557 83.3736 150.928 81.5473 150.928 79.716V85.5633C150.928 87.3945 149.557 89.221 146.82 90.6162L72.7614 128.35C67.2823 131.141 58.4023 131.141 52.9231 128.35L17.6793 110.391C14.9373 108.996 13.5711 107.165 13.5711 105.334V99.4866Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
@@ -20,17 +56,159 @@ export const ModuleVerticalStackIllustration = ({ className }: TIllustrationAsse
         strokeLinejoin="round"
       />
       <path
-        d="M13.5711 136.431C13.5711 134.599 14.9421 132.773 17.6793 131.378L91.7374 93.644C97.2166 90.8536 106.097 90.8536 111.576 93.644L146.82 111.603C149.562 112.998 150.928 114.829 150.928 116.66C150.928 118.492 149.557 120.318 146.82 121.713L72.7614 159.447C67.2823 162.237 58.4023 162.237 52.9231 159.447L17.6793 141.488C14.9373 140.093 13.5711 138.262 13.5711 136.431Z"
+        d="M13.5711 99.4865C13.5711 97.6553 14.9421 95.8288 17.6793 94.4336L91.7374 56.6997C97.2166 53.9092 106.097 53.9092 111.576 56.6997L146.82 74.6584C149.562 76.0536 150.928 77.8848 150.928 79.716C150.928 81.5472 149.557 83.3736 146.82 84.7688L72.7614 122.503C67.2823 125.293 58.4023 125.293 52.9231 122.503L17.6793 104.544C14.9373 103.149 13.5711 101.318 13.5711 99.4865Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M13.5711 117.959C13.5711 119.79 14.9421 121.616 17.6793 123.016L52.9231 140.975C58.4023 143.765 67.2823 143.765 72.7614 140.975L146.82 103.241C149.557 101.846 150.928 100.019 150.928 98.1882V104.036C150.928 105.867 149.557 107.693 146.82 109.088L72.7614 146.822C67.2823 149.613 58.4023 149.613 52.9231 146.822L17.6793 128.864C14.9373 127.468 13.5711 125.637 13.5711 123.806V117.959Z"
+        d="M64.7245 99.2927C63.9446 99.2927 63.2179 99.1134 62.5687 98.7646L58.3346 96.6088C56.5228 95.6835 55.4812 93.5472 55.4812 90.747V49.6509C55.4812 44.6272 58.8433 38.8283 62.9805 36.7258L96.7565 19.518C97.7932 18.99 98.8057 18.7235 99.765 18.7235C100.516 18.7235 101.213 18.8882 101.843 19.2079L106.097 21.3783C107.947 22.2793 109.013 24.4304 109.013 27.2693V68.3605C109.013 73.3794 105.651 79.1783 101.514 81.2857L67.7378 98.4934C66.7011 99.0215 65.6886 99.2927 64.7245 99.2927Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M99.7698 19.2079C100.448 19.2079 101.073 19.3582 101.625 19.6392L105.879 21.8095C107.497 22.5991 108.529 24.5273 108.529 27.2693V68.3605C108.529 73.2244 105.288 78.8197 101.296 80.8544L67.5199 98.0622C66.5316 98.566 65.5869 98.8083 64.7246 98.8083C64.0173 98.8083 63.373 98.6484 62.8013 98.3384L58.5575 96.1777C56.9733 95.3687 55.9705 93.4551 55.9705 90.747V49.6509C55.9705 44.787 59.2067 39.1916 63.2034 37.1569L96.9794 19.9492C97.9677 19.4453 98.9075 19.2079 99.7698 19.2079ZM99.7698 18.239C98.7331 18.239 97.6479 18.5249 96.5434 19.0868L62.7674 36.2946C58.417 38.5085 55.0065 44.3801 55.0065 49.6509V90.747C55.0065 93.7361 56.1401 96.0276 58.1215 97.0401L62.3653 99.2007C63.0629 99.5786 63.8671 99.7772 64.7294 99.7772C65.771 99.7772 66.861 99.4913 67.9656 98.9245L101.742 81.7168C106.092 79.498 109.502 73.6314 109.502 68.3605V27.2693C109.502 24.2366 108.34 21.9306 106.31 20.9375L102.071 18.7768C101.373 18.4183 100.598 18.239 99.7747 18.239H99.7698Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M102.909 27.9572C102.88 27.9378 102.851 27.9233 102.822 27.9088L102.846 27.9184C102.87 27.9281 102.89 27.9426 102.909 27.9572Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M105.879 21.8095C105.811 21.7756 105.743 21.7466 105.675 21.7175C105.607 21.6884 105.535 21.6593 105.462 21.6351C105.181 21.5333 104.886 21.4704 104.58 21.4365C104.517 21.4268 104.45 21.4219 104.382 21.4171C103.447 21.3541 102.4 21.5867 101.296 22.1486L67.5199 39.3564C63.5231 41.3911 60.287 46.9865 60.287 51.8504V92.9465C60.287 93.1354 60.2918 93.3243 60.3015 93.5036C60.3112 93.6489 60.3209 93.7893 60.3354 93.925V93.9347C60.35 94.0703 60.3645 94.2011 60.3839 94.3319C60.4275 94.6517 60.4905 94.957 60.568 95.2476C60.6019 95.3687 60.6358 95.485 60.6745 95.5964C60.7085 95.7127 60.7472 95.8192 60.7908 95.9258C60.8247 96.0082 60.8586 96.0905 60.8926 96.1729C60.9652 96.3328 61.0427 96.4878 61.1251 96.6331C61.159 96.7009 61.2026 96.7687 61.2414 96.8365C61.2462 96.8462 61.251 96.8559 61.2607 96.8656C61.2995 96.9286 61.3431 96.9916 61.3867 97.0546C61.4594 97.1612 61.5369 97.2629 61.6192 97.3598C61.6774 97.4324 61.7403 97.5002 61.8033 97.5681C61.8663 97.6359 61.9341 97.7038 62.0019 97.7668C62.0601 97.82 62.1182 97.8684 62.1763 97.9168C62.3701 98.0767 62.5784 98.2173 62.8013 98.3384L58.5575 96.1777C56.9733 95.3687 55.9705 93.4551 55.9705 90.7471V49.651C55.9705 44.7871 59.2067 39.1916 63.2034 37.1569L96.9794 19.9492C98.7476 19.0481 100.366 18.9949 101.625 19.6392L105.879 21.8095Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M102.846 27.9184L102.822 27.9088C102.851 27.9233 102.88 27.9378 102.909 27.9572C102.89 27.9426 102.87 27.9281 102.846 27.9184Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M105.879 21.8095C105.811 21.7756 105.743 21.7465 105.675 21.7174C105.607 21.6884 105.535 21.6592 105.462 21.635C105.181 21.5333 104.886 21.4703 104.58 21.4364C104.517 21.4267 104.45 21.4219 104.382 21.417C103.447 21.3541 102.4 21.5866 101.296 22.1486L67.5199 39.3563C63.5231 41.391 60.287 46.9864 60.287 51.8503V92.9464C60.287 93.1354 60.2918 93.3243 60.3015 93.5035C60.3112 93.6488 60.3209 93.7893 60.3354 93.9249V93.9346C60.35 94.0703 60.3645 94.2011 60.3839 94.3319C60.4275 94.6516 60.4905 94.9569 60.568 95.2476C60.6019 95.3687 60.6358 95.4849 60.6745 95.5964C60.7085 95.7126 60.7472 95.8192 60.7908 95.9258C60.8247 96.0081 60.8586 96.0905 60.8926 96.1728C60.9652 96.3327 61.0427 96.4877 61.1251 96.633C61.159 96.7009 61.2026 96.7687 61.2414 96.8365C61.2462 96.8462 61.251 96.8559 61.2607 96.8656C61.2995 96.9286 61.3431 96.9916 61.3867 97.0546C61.4594 97.1612 61.5369 97.2628 61.6192 97.3597C61.6774 97.4324 61.7403 97.5002 61.8033 97.568C61.8663 97.6358 61.9341 97.7037 62.0019 97.7667C62.0601 97.82 62.1182 97.8684 62.1763 97.9168C62.3701 98.0767 62.5784 98.2172 62.8013 98.3383C64.0657 99.0214 65.7177 98.9826 67.5199 98.0622L101.296 80.8544C105.288 78.8197 108.529 73.2244 108.529 68.3605V27.2692C108.529 24.5273 107.497 22.5991 105.879 21.8095Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M94.1502 73.9753C94.0097 73.9753 93.8741 73.9414 93.7529 73.8832L89.4365 71.6838C89.1167 71.5191 88.9278 71.1703 88.9278 70.7392V63.5983C88.9278 62.954 89.3347 62.2612 89.8773 61.9851L95.744 58.996C95.9039 58.9137 96.0686 58.8749 96.2285 58.8749C96.369 58.8749 96.5046 58.9088 96.6257 58.9669L100.942 61.1664C101.262 61.3262 101.451 61.6799 101.451 62.111V69.2519C101.451 69.8962 101.044 70.589 100.501 70.8651L94.6347 73.8541C94.4748 73.9365 94.3101 73.9753 94.1502 73.9753Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M96.2285 59.3594C96.2915 59.3594 96.3545 59.3739 96.4078 59.3982L100.724 61.5975C100.874 61.675 100.966 61.8543 100.966 62.111V69.2518C100.966 69.7121 100.661 70.2401 100.283 70.4339L94.4167 73.423C94.3246 73.4715 94.2326 73.4908 94.1551 73.4908C94.0921 73.4908 94.0291 73.4762 93.9758 73.452L89.6593 71.2527C89.5092 71.1752 89.4171 70.9959 89.4171 70.7391V63.5983C89.4171 63.1381 89.7223 62.6101 90.1002 62.4163L95.9669 59.4271C96.059 59.3787 96.151 59.3594 96.2285 59.3594ZM96.2285 58.3905C95.9911 58.3905 95.7538 58.4485 95.5261 58.5648L89.6593 61.554C88.9569 61.9125 88.4434 62.7748 88.4434 63.5983V70.7391C88.4434 71.3544 88.734 71.868 89.2185 72.115L93.535 74.3143C93.7287 74.4112 93.9322 74.4597 94.1502 74.4597C94.3876 74.4597 94.625 74.4016 94.8527 74.2854L100.719 71.2962C101.422 70.9377 101.935 70.0754 101.935 69.2518V62.111C101.935 61.4958 101.645 60.9822 101.165 60.7351L96.8486 58.5358C96.6548 58.4389 96.4514 58.3905 96.2334 58.3905H96.2285Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M94.1502 53.4297C94.0097 53.4297 93.8741 53.3958 93.7529 53.3377L89.4365 51.1382C89.1167 50.9735 88.9278 50.6247 88.9278 50.1936V43.0526C88.9278 42.4083 89.3347 41.7156 89.8773 41.4395L95.744 38.4504C95.9039 38.368 96.0686 38.3292 96.2285 38.3292C96.369 38.3292 96.5046 38.3632 96.6257 38.4214L100.942 40.6208C101.262 40.7807 101.451 41.1343 101.451 41.5655V48.7063C101.451 49.3506 101.044 50.0433 100.501 50.3194L94.6347 53.3086C94.4748 53.3909 94.3101 53.4297 94.1502 53.4297Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M96.2285 38.809C96.2915 38.809 96.3545 38.8234 96.4078 38.8476L100.724 41.0471C100.874 41.1246 100.966 41.3039 100.966 41.5606V48.7014C100.966 49.1617 100.661 49.6897 100.283 49.8835L94.4167 52.8725C94.3246 52.9209 94.2326 52.9404 94.1551 52.9404C94.0921 52.9404 94.0291 52.9258 93.9758 52.9016L89.6593 50.7022C89.5092 50.6247 89.4171 50.4455 89.4171 50.1887V43.0479C89.4171 42.5877 89.7223 42.0595 90.1002 41.8658L95.9669 38.8767C96.059 38.8283 96.151 38.809 96.2285 38.809ZM96.2285 37.8401C95.9911 37.8401 95.7538 37.8981 95.5261 38.0144L89.6593 41.0034C88.9569 41.3619 88.4434 42.2243 88.4434 43.0479V50.1887C88.4434 50.804 88.734 51.3174 89.2185 51.5645L93.535 53.7639C93.7287 53.8608 93.9322 53.9093 94.1502 53.9093C94.3876 53.9093 94.625 53.8511 94.8527 53.7348L100.719 50.7458C101.422 50.3873 101.935 49.525 101.935 48.7014V41.5606C101.935 40.9454 101.645 40.4318 101.165 40.1847L96.8486 37.9853C96.6548 37.8884 96.4514 37.8401 96.2334 37.8401H96.2285Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M77.267 82.5791C77.1265 82.5791 76.9909 82.5452 76.8698 82.4871L72.5533 80.2877C72.2335 80.1278 72.0446 79.7742 72.0446 79.343V72.2022C72.0446 71.5579 72.4516 70.8651 72.9941 70.5889L78.8608 67.5999C79.0207 67.5176 79.1854 67.4788 79.3453 67.4788C79.4858 67.4788 79.6214 67.5127 79.7426 67.5708L84.059 69.7702C84.3788 69.9301 84.5677 70.2837 84.5677 70.7149V77.8557C84.5677 78.5 84.1608 79.1928 83.6182 79.469L77.7515 82.458C77.5916 82.5404 77.4269 82.5791 77.267 82.5791Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M79.3453 67.9632C79.4083 67.9632 79.4713 67.9777 79.5246 68.0019L83.841 70.2013C83.9912 70.2789 84.0833 70.4581 84.0833 70.7149V77.8557C84.0833 78.3159 83.7781 78.844 83.4002 79.0377L77.5335 82.0269C77.4414 82.0753 77.3494 82.0947 77.2719 82.0947C77.2089 82.0947 77.1459 82.0801 77.0926 82.0559L72.7761 79.8566C72.626 79.779 72.5339 79.5998 72.5339 79.343V72.2022C72.5339 71.742 72.8391 71.2139 73.217 71.0202L79.0837 68.031C79.1758 67.9826 79.2678 67.9632 79.3453 67.9632ZM79.3453 66.9943C79.1079 66.9943 78.8706 67.0524 78.6429 67.1687L72.7761 70.1578C72.0737 70.5163 71.5602 71.3786 71.5602 72.2022V79.343C71.5602 79.9583 71.8508 80.4717 72.3353 80.7188L76.6518 82.9182C76.8407 83.0151 77.049 83.0636 77.267 83.0636C77.5044 83.0636 77.7418 83.0055 77.9695 82.8892L83.8362 79.9001C84.5386 79.5416 85.0522 78.6793 85.0522 77.8557V70.7149C85.0522 70.0996 84.7615 69.5861 84.277 69.339L79.9606 67.1397C79.7716 67.0428 79.5633 66.9943 79.3453 66.9943Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M77.267 62.0335C77.1265 62.0335 76.9909 61.9997 76.8698 61.9415L72.5533 59.7421C72.2335 59.5822 72.0446 59.2285 72.0446 58.7973V51.6565C72.0446 51.0122 72.4516 50.3195 72.9941 50.0434L78.8608 47.0542C79.0207 46.9719 79.1854 46.9331 79.3453 46.9331C79.4858 46.9331 79.6214 46.9671 79.7426 47.0252L84.059 49.2247C84.3788 49.3845 84.5677 49.7382 84.5677 50.1693V57.3101C84.5677 57.9545 84.1608 58.6471 83.6182 58.9233L77.7515 61.9124C77.5916 61.9948 77.4269 62.0335 77.267 62.0335Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M79.3453 47.4127C79.4083 47.4127 79.4713 47.4273 79.5246 47.4564L83.841 49.6558C83.9912 49.7333 84.0833 49.9126 84.0833 50.1693V57.3102C84.0833 57.7704 83.7781 58.2984 83.4002 58.4922L77.5335 61.4812C77.4414 61.5297 77.3494 61.5491 77.2719 61.5491C77.2089 61.5491 77.1459 61.5345 77.0926 61.5103L72.7761 59.3109C72.626 59.2334 72.5339 59.0541 72.5339 58.7973V51.6565C72.5339 51.1963 72.8391 50.6683 73.217 50.4745L79.0837 47.4855C79.1758 47.437 79.2678 47.4127 79.3453 47.4127ZM79.3453 46.4438C79.1079 46.4438 78.8706 46.502 78.6429 46.6183L72.7761 49.6073C72.0737 49.9658 71.5602 50.8281 71.5602 51.6517V58.7926C71.5602 59.4079 71.8508 59.9213 72.3353 60.1684L76.6518 62.3678C76.8407 62.4647 77.049 62.5132 77.267 62.5132C77.5044 62.5132 77.7418 62.455 77.9695 62.3387L83.8362 59.3497C84.5386 58.9912 85.0522 58.1289 85.0522 57.3053V50.1645C85.0522 49.5492 84.7615 49.0357 84.277 48.7886L79.9606 46.5892C79.7716 46.4923 79.5633 46.4438 79.3453 46.4438Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M100.724 61.5975C100.603 61.5345 100.453 61.5393 100.283 61.6265L94.4167 64.6156C94.0388 64.8094 93.7336 65.3375 93.7336 65.7977V72.9385C93.7336 73.1953 93.8256 73.3745 93.9758 73.452L89.6593 71.2527C89.5092 71.1752 89.4171 70.9959 89.4171 70.7391V63.5983C89.4171 63.1381 89.7223 62.61 90.1002 62.4163L95.9669 59.4271C96.1365 59.3399 96.2866 59.3352 96.4078 59.3981L100.724 61.5975Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M100.724 61.5975C100.874 61.675 100.966 61.8543 100.966 62.1111V69.2519C100.966 69.7121 100.661 70.2401 100.283 70.4339L94.4167 73.4231C94.2471 73.5103 94.0969 73.515 93.9758 73.4521C93.8256 73.3745 93.7336 73.1954 93.7336 72.9386V65.7978C93.7336 65.3376 94.0388 64.8094 94.4167 64.6157L100.283 61.6266C100.453 61.5394 100.603 61.5346 100.724 61.5975Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M100.724 41.052C100.603 40.989 100.453 40.9939 100.283 41.0811L94.4167 44.0701C94.0388 44.2639 93.7336 44.7919 93.7336 45.2521V52.3929C93.7336 52.6497 93.8256 52.829 93.9758 52.9065L89.6593 50.7071C89.5092 50.6295 89.4171 50.4504 89.4171 50.1936V43.0527C89.4171 42.5925 89.7223 42.0644 90.1002 41.8707L95.9669 38.8816C96.1365 38.7944 96.2866 38.7895 96.4078 38.8525L100.724 41.052Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M100.724 41.052C100.874 41.1295 100.966 41.3087 100.966 41.5655V48.7063C100.966 49.1666 100.661 49.6946 100.283 49.8884L94.4167 52.8774C94.2471 52.9646 94.0969 52.9695 93.9758 52.9065C93.8256 52.829 93.7336 52.6497 93.7336 52.3929V45.2521C93.7336 44.7919 94.0388 44.2639 94.4167 44.0701L100.283 41.0811C100.453 40.9939 100.603 40.989 100.724 41.052Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M83.8362 70.2014C83.7151 70.1384 83.5649 70.1433 83.3954 70.2305L77.5286 73.2195C77.1508 73.4133 76.8456 73.9414 76.8456 74.4017V81.5425C76.8456 81.7993 76.9376 81.9784 77.0878 82.0559L72.7713 79.8566C72.6212 79.7791 72.5291 79.5998 72.5291 79.3431V72.2022C72.5291 71.742 72.8343 71.214 73.2122 71.0202L79.0789 68.0311C79.2485 67.9439 79.3986 67.939 79.5198 68.002L83.8362 70.2014Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M83.8362 70.2014C83.9864 70.2789 84.0784 70.4582 84.0784 70.7149V77.8558C84.0784 78.316 83.7732 78.844 83.3954 79.0378L77.5286 82.0269C77.3591 82.1141 77.2089 82.1189 77.0878 82.0559C76.9376 81.9784 76.8456 81.7993 76.8456 81.5425V74.4017C76.8456 73.9414 77.1508 73.4133 77.5286 73.2195L83.3954 70.2305C83.5649 70.1433 83.7151 70.1384 83.8362 70.2014Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M83.8362 49.6558C83.7151 49.5928 83.5649 49.5977 83.3954 49.6849L77.5286 52.674C77.1508 52.8677 76.8456 53.3958 76.8456 53.856V60.9968C76.8456 61.2536 76.9376 61.4328 77.0878 61.5104L72.7713 59.3109C72.6212 59.2334 72.5291 59.0541 72.5291 58.7974V51.6566C72.5291 51.1963 72.8343 50.6683 73.2122 50.4745L79.0789 47.4855C79.2485 47.3983 79.3986 47.3934 79.5198 47.4564L83.8362 49.6558Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M83.8362 49.6558C83.9864 49.7333 84.0784 49.9126 84.0784 50.1694V57.3102C84.0784 57.7704 83.7732 58.2984 83.3954 58.4922L77.5286 61.4812C77.3591 61.5684 77.2089 61.5733 77.0878 61.5103C76.9376 61.4328 76.8456 61.2536 76.8456 60.9968V53.856C76.8456 53.3958 77.1508 52.8677 77.5286 52.6739L83.3954 49.6849C83.5649 49.5977 83.7151 49.5928 83.8362 49.6558Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M52.2549 9.2767C51.1164 8.69536 49.6437 8.74379 48.0401 9.56251L11.6675 28.0977C8.04379 29.9434 5.10316 35.0156 5.10316 39.4289C5.10316 41.8899 6.01877 43.6244 7.45275 44.3559L5.2921 43.2562C3.85328 42.5246 2.9425 40.7902 2.9425 38.3292C2.9425 33.9207 5.88313 28.8437 9.50683 26.9979L45.8795 8.4628C47.483 7.64407 48.9509 7.59565 50.0942 8.17699L52.2549 9.2767Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
@@ -38,337 +216,161 @@ export const ModuleVerticalStackIllustration = ({ className }: TIllustrationAsse
         strokeLinejoin="round"
       />
       <path
-        d="M13.5711 117.959C13.5711 116.127 14.9421 114.301 17.6793 112.906L91.7374 75.1718C97.2166 72.3814 106.097 72.3814 111.576 75.1718L146.82 93.1305C149.562 94.5257 150.928 96.3569 150.928 98.1881C150.928 100.019 149.557 101.846 146.82 103.241L72.7614 140.975C67.2823 143.765 58.4023 143.765 52.9231 140.975L17.6793 123.016C14.9373 121.621 13.5711 119.79 13.5711 117.959Z"
+        d="M52.2549 9.2767C53.6937 10.0082 54.6044 11.7425 54.6044 14.2035C54.6044 18.6121 51.6638 23.6891 48.0401 25.5349L11.6675 44.07C10.0639 44.8887 8.59604 44.9372 7.45274 44.3559C6.01391 43.6244 5.10315 41.8899 5.10315 39.4289C5.10315 35.0204 8.04377 29.9434 11.6675 28.0976L48.0401 9.56251C49.6437 8.74379 51.1116 8.69536 52.2549 9.2767Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.35"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M13.5711 99.4866C13.5711 101.318 14.9421 103.144 17.6793 104.544L52.9231 122.503C58.4023 125.293 67.2823 125.293 72.7614 122.503L146.82 84.7688C149.557 83.3736 150.928 81.5473 150.928 79.716V85.5633C150.928 87.3945 149.557 89.221 146.82 90.6162L72.7614 128.35C67.2823 131.141 58.4023 131.141 52.9231 128.35L17.6793 110.391C14.9373 108.996 13.5711 107.165 13.5711 105.334V99.4866Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M13.5711 99.4865C13.5711 97.6553 14.9421 95.8288 17.6793 94.4336L91.7374 56.6997C97.2166 53.9092 106.097 53.9092 111.576 56.6997L146.82 74.6584C149.562 76.0536 150.928 77.8848 150.928 79.716C150.928 81.5472 149.557 83.3736 146.82 84.7688L72.7614 122.503C67.2823 125.293 58.4023 125.293 52.9231 122.503L17.6793 104.544C14.9373 103.149 13.5711 101.318 13.5711 99.4865Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M64.7245 99.2927C63.9446 99.2927 63.2179 99.1134 62.5687 98.7646L58.3346 96.6088C56.5228 95.6835 55.4812 93.5472 55.4812 90.747V49.6509C55.4812 44.6272 58.8433 38.8283 62.9805 36.7258L96.7565 19.518C97.7932 18.99 98.8057 18.7235 99.765 18.7235C100.516 18.7235 101.213 18.8882 101.843 19.2079L106.097 21.3783C107.947 22.2793 109.013 24.4304 109.013 27.2693V68.3605C109.013 73.3794 105.651 79.1783 101.514 81.2857L67.7378 98.4934C66.7011 99.0215 65.6886 99.2927 64.7245 99.2927Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M99.7698 19.2079C100.448 19.2079 101.073 19.3582 101.625 19.6392L105.879 21.8095C107.497 22.5991 108.529 24.5273 108.529 27.2693V68.3605C108.529 73.2244 105.288 78.8197 101.296 80.8544L67.5199 98.0622C66.5316 98.566 65.5869 98.8083 64.7246 98.8083C64.0173 98.8083 63.373 98.6484 62.8013 98.3384L58.5575 96.1777C56.9733 95.3687 55.9705 93.4551 55.9705 90.747V49.6509C55.9705 44.787 59.2067 39.1916 63.2034 37.1569L96.9794 19.9492C97.9677 19.4453 98.9075 19.2079 99.7698 19.2079ZM99.7698 18.239C98.7331 18.239 97.6479 18.5249 96.5434 19.0868L62.7674 36.2946C58.417 38.5085 55.0065 44.3801 55.0065 49.6509V90.747C55.0065 93.7361 56.1401 96.0276 58.1215 97.0401L62.3653 99.2007C63.0629 99.5786 63.8671 99.7772 64.7294 99.7772C65.771 99.7772 66.861 99.4913 67.9656 98.9245L101.742 81.7168C106.092 79.498 109.502 73.6314 109.502 68.3605V27.2693C109.502 24.2366 108.34 21.9306 106.31 20.9375L102.071 18.7768C101.373 18.4183 100.598 18.239 99.7747 18.239H99.7698Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M102.909 27.9572C102.88 27.9378 102.851 27.9233 102.822 27.9088L102.846 27.9184C102.87 27.9281 102.89 27.9426 102.909 27.9572Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M105.879 21.8095C105.811 21.7756 105.743 21.7466 105.675 21.7175C105.607 21.6884 105.535 21.6593 105.462 21.6351C105.181 21.5333 104.886 21.4704 104.58 21.4365C104.517 21.4268 104.45 21.4219 104.382 21.4171C103.447 21.3541 102.4 21.5867 101.296 22.1486L67.5199 39.3564C63.5231 41.3911 60.287 46.9865 60.287 51.8504V92.9465C60.287 93.1354 60.2918 93.3243 60.3015 93.5036C60.3112 93.6489 60.3209 93.7893 60.3354 93.925V93.9347C60.35 94.0703 60.3645 94.2011 60.3839 94.3319C60.4275 94.6517 60.4905 94.957 60.568 95.2476C60.6019 95.3687 60.6358 95.485 60.6745 95.5964C60.7085 95.7127 60.7472 95.8192 60.7908 95.9258C60.8247 96.0082 60.8586 96.0905 60.8926 96.1729C60.9652 96.3328 61.0427 96.4878 61.1251 96.6331C61.159 96.7009 61.2026 96.7687 61.2414 96.8365C61.2462 96.8462 61.251 96.8559 61.2607 96.8656C61.2995 96.9286 61.3431 96.9916 61.3867 97.0546C61.4594 97.1612 61.5369 97.2629 61.6192 97.3598C61.6774 97.4324 61.7403 97.5002 61.8033 97.5681C61.8663 97.6359 61.9341 97.7038 62.0019 97.7668C62.0601 97.82 62.1182 97.8684 62.1763 97.9168C62.3701 98.0767 62.5784 98.2173 62.8013 98.3384L58.5575 96.1777C56.9733 95.3687 55.9705 93.4551 55.9705 90.7471V49.651C55.9705 44.7871 59.2067 39.1916 63.2034 37.1569L96.9794 19.9492C98.7476 19.0481 100.366 18.9949 101.625 19.6392L105.879 21.8095Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M102.846 27.9184L102.822 27.9088C102.851 27.9233 102.88 27.9378 102.909 27.9572C102.89 27.9426 102.87 27.9281 102.846 27.9184Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M105.879 21.8095C105.811 21.7756 105.743 21.7465 105.675 21.7174C105.607 21.6884 105.535 21.6592 105.462 21.635C105.181 21.5333 104.886 21.4703 104.58 21.4364C104.517 21.4267 104.45 21.4219 104.382 21.417C103.447 21.3541 102.4 21.5866 101.296 22.1486L67.5199 39.3563C63.5231 41.391 60.287 46.9864 60.287 51.8503V92.9464C60.287 93.1354 60.2918 93.3243 60.3015 93.5035C60.3112 93.6488 60.3209 93.7893 60.3354 93.9249V93.9346C60.35 94.0703 60.3645 94.2011 60.3839 94.3319C60.4275 94.6516 60.4905 94.9569 60.568 95.2476C60.6019 95.3687 60.6358 95.4849 60.6745 95.5964C60.7085 95.7126 60.7472 95.8192 60.7908 95.9258C60.8247 96.0081 60.8586 96.0905 60.8926 96.1728C60.9652 96.3327 61.0427 96.4877 61.1251 96.633C61.159 96.7009 61.2026 96.7687 61.2414 96.8365C61.2462 96.8462 61.251 96.8559 61.2607 96.8656C61.2995 96.9286 61.3431 96.9916 61.3867 97.0546C61.4594 97.1612 61.5369 97.2628 61.6192 97.3597C61.6774 97.4324 61.7403 97.5002 61.8033 97.568C61.8663 97.6358 61.9341 97.7037 62.0019 97.7667C62.0601 97.82 62.1182 97.8684 62.1763 97.9168C62.3701 98.0767 62.5784 98.2172 62.8013 98.3383C64.0657 99.0214 65.7177 98.9826 67.5199 98.0622L101.296 80.8544C105.288 78.8197 108.529 73.2244 108.529 68.3605V27.2692C108.529 24.5273 107.497 22.5991 105.879 21.8095Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M94.1502 73.9753C94.0097 73.9753 93.8741 73.9414 93.7529 73.8832L89.4365 71.6838C89.1167 71.5191 88.9278 71.1703 88.9278 70.7392V63.5983C88.9278 62.954 89.3347 62.2612 89.8773 61.9851L95.744 58.996C95.9039 58.9137 96.0686 58.8749 96.2285 58.8749C96.369 58.8749 96.5046 58.9088 96.6257 58.9669L100.942 61.1664C101.262 61.3262 101.451 61.6799 101.451 62.111V69.2519C101.451 69.8962 101.044 70.589 100.501 70.8651L94.6347 73.8541C94.4748 73.9365 94.3101 73.9753 94.1502 73.9753Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M96.2285 59.3594C96.2915 59.3594 96.3545 59.3739 96.4078 59.3982L100.724 61.5975C100.874 61.675 100.966 61.8543 100.966 62.111V69.2518C100.966 69.7121 100.661 70.2401 100.283 70.4339L94.4167 73.423C94.3246 73.4715 94.2326 73.4908 94.1551 73.4908C94.0921 73.4908 94.0291 73.4762 93.9758 73.452L89.6593 71.2527C89.5092 71.1752 89.4171 70.9959 89.4171 70.7391V63.5983C89.4171 63.1381 89.7223 62.6101 90.1002 62.4163L95.9669 59.4271C96.059 59.3787 96.151 59.3594 96.2285 59.3594ZM96.2285 58.3905C95.9911 58.3905 95.7538 58.4485 95.5261 58.5648L89.6593 61.554C88.9569 61.9125 88.4434 62.7748 88.4434 63.5983V70.7391C88.4434 71.3544 88.734 71.868 89.2185 72.115L93.535 74.3143C93.7287 74.4112 93.9322 74.4597 94.1502 74.4597C94.3876 74.4597 94.625 74.4016 94.8527 74.2854L100.719 71.2962C101.422 70.9377 101.935 70.0754 101.935 69.2518V62.111C101.935 61.4958 101.645 60.9822 101.165 60.7351L96.8486 58.5358C96.6548 58.4389 96.4514 58.3905 96.2334 58.3905H96.2285Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M94.1502 53.4297C94.0097 53.4297 93.8741 53.3958 93.7529 53.3377L89.4365 51.1382C89.1167 50.9735 88.9278 50.6247 88.9278 50.1936V43.0526C88.9278 42.4083 89.3347 41.7156 89.8773 41.4395L95.744 38.4504C95.9039 38.368 96.0686 38.3292 96.2285 38.3292C96.369 38.3292 96.5046 38.3632 96.6257 38.4214L100.942 40.6208C101.262 40.7807 101.451 41.1343 101.451 41.5655V48.7063C101.451 49.3506 101.044 50.0433 100.501 50.3194L94.6347 53.3086C94.4748 53.3909 94.3101 53.4297 94.1502 53.4297Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M96.2285 38.809C96.2915 38.809 96.3545 38.8234 96.4078 38.8476L100.724 41.0471C100.874 41.1246 100.966 41.3039 100.966 41.5606V48.7014C100.966 49.1617 100.661 49.6897 100.283 49.8835L94.4167 52.8725C94.3246 52.9209 94.2326 52.9404 94.1551 52.9404C94.0921 52.9404 94.0291 52.9258 93.9758 52.9016L89.6593 50.7022C89.5092 50.6247 89.4171 50.4455 89.4171 50.1887V43.0479C89.4171 42.5877 89.7223 42.0595 90.1002 41.8658L95.9669 38.8767C96.059 38.8283 96.151 38.809 96.2285 38.809ZM96.2285 37.8401C95.9911 37.8401 95.7538 37.8981 95.5261 38.0144L89.6593 41.0034C88.9569 41.3619 88.4434 42.2243 88.4434 43.0479V50.1887C88.4434 50.804 88.734 51.3174 89.2185 51.5645L93.535 53.7639C93.7287 53.8608 93.9322 53.9093 94.1502 53.9093C94.3876 53.9093 94.625 53.8511 94.8527 53.7348L100.719 50.7458C101.422 50.3873 101.935 49.525 101.935 48.7014V41.5606C101.935 40.9454 101.645 40.4318 101.165 40.1847L96.8486 37.9853C96.6548 37.8884 96.4514 37.8401 96.2334 37.8401H96.2285Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M77.267 82.5791C77.1265 82.5791 76.9909 82.5452 76.8698 82.4871L72.5533 80.2877C72.2335 80.1278 72.0446 79.7742 72.0446 79.343V72.2022C72.0446 71.5579 72.4516 70.8651 72.9941 70.5889L78.8608 67.5999C79.0207 67.5176 79.1854 67.4788 79.3453 67.4788C79.4858 67.4788 79.6214 67.5127 79.7426 67.5708L84.059 69.7702C84.3788 69.9301 84.5677 70.2837 84.5677 70.7149V77.8557C84.5677 78.5 84.1608 79.1928 83.6182 79.469L77.7515 82.458C77.5916 82.5404 77.4269 82.5791 77.267 82.5791Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M79.3453 67.9632C79.4083 67.9632 79.4713 67.9777 79.5246 68.0019L83.841 70.2013C83.9912 70.2789 84.0833 70.4581 84.0833 70.7149V77.8557C84.0833 78.3159 83.7781 78.844 83.4002 79.0377L77.5335 82.0269C77.4414 82.0753 77.3494 82.0947 77.2719 82.0947C77.2089 82.0947 77.1459 82.0801 77.0926 82.0559L72.7761 79.8566C72.626 79.779 72.5339 79.5998 72.5339 79.343V72.2022C72.5339 71.742 72.8391 71.2139 73.217 71.0202L79.0837 68.031C79.1758 67.9826 79.2678 67.9632 79.3453 67.9632ZM79.3453 66.9943C79.1079 66.9943 78.8706 67.0524 78.6429 67.1687L72.7761 70.1578C72.0737 70.5163 71.5602 71.3786 71.5602 72.2022V79.343C71.5602 79.9583 71.8508 80.4717 72.3353 80.7188L76.6518 82.9182C76.8407 83.0151 77.049 83.0636 77.267 83.0636C77.5044 83.0636 77.7418 83.0055 77.9695 82.8892L83.8362 79.9001C84.5386 79.5416 85.0522 78.6793 85.0522 77.8557V70.7149C85.0522 70.0996 84.7615 69.5861 84.277 69.339L79.9606 67.1397C79.7716 67.0428 79.5633 66.9943 79.3453 66.9943Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M77.267 62.0335C77.1265 62.0335 76.9909 61.9997 76.8698 61.9415L72.5533 59.7421C72.2335 59.5822 72.0446 59.2285 72.0446 58.7973V51.6565C72.0446 51.0122 72.4516 50.3195 72.9941 50.0434L78.8608 47.0542C79.0207 46.9719 79.1854 46.9331 79.3453 46.9331C79.4858 46.9331 79.6214 46.9671 79.7426 47.0252L84.059 49.2247C84.3788 49.3845 84.5677 49.7382 84.5677 50.1693V57.3101C84.5677 57.9545 84.1608 58.6471 83.6182 58.9233L77.7515 61.9124C77.5916 61.9948 77.4269 62.0335 77.267 62.0335Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M79.3453 47.4127C79.4083 47.4127 79.4713 47.4273 79.5246 47.4564L83.841 49.6558C83.9912 49.7333 84.0833 49.9126 84.0833 50.1693V57.3102C84.0833 57.7704 83.7781 58.2984 83.4002 58.4922L77.5335 61.4812C77.4414 61.5297 77.3494 61.5491 77.2719 61.5491C77.2089 61.5491 77.1459 61.5345 77.0926 61.5103L72.7761 59.3109C72.626 59.2334 72.5339 59.0541 72.5339 58.7973V51.6565C72.5339 51.1963 72.8391 50.6683 73.217 50.4745L79.0837 47.4855C79.1758 47.437 79.2678 47.4127 79.3453 47.4127ZM79.3453 46.4438C79.1079 46.4438 78.8706 46.502 78.6429 46.6183L72.7761 49.6073C72.0737 49.9658 71.5602 50.8281 71.5602 51.6517V58.7926C71.5602 59.4079 71.8508 59.9213 72.3353 60.1684L76.6518 62.3678C76.8407 62.4647 77.049 62.5132 77.267 62.5132C77.5044 62.5132 77.7418 62.455 77.9695 62.3387L83.8362 59.3497C84.5386 58.9912 85.0522 58.1289 85.0522 57.3053V50.1645C85.0522 49.5492 84.7615 49.0357 84.277 48.7886L79.9606 46.5892C79.7716 46.4923 79.5633 46.4438 79.3453 46.4438Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M100.724 61.5975C100.603 61.5345 100.453 61.5393 100.283 61.6265L94.4167 64.6156C94.0388 64.8094 93.7336 65.3375 93.7336 65.7977V72.9385C93.7336 73.1953 93.8256 73.3745 93.9758 73.452L89.6593 71.2527C89.5092 71.1752 89.4171 70.9959 89.4171 70.7391V63.5983C89.4171 63.1381 89.7223 62.61 90.1002 62.4163L95.9669 59.4271C96.1365 59.3399 96.2866 59.3352 96.4078 59.3981L100.724 61.5975Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M100.724 61.5975C100.874 61.675 100.966 61.8543 100.966 62.1111V69.2519C100.966 69.7121 100.661 70.2401 100.283 70.4339L94.4167 73.4231C94.2471 73.5103 94.0969 73.515 93.9758 73.4521C93.8256 73.3745 93.7336 73.1954 93.7336 72.9386V65.7978C93.7336 65.3376 94.0388 64.8094 94.4167 64.6157L100.283 61.6266C100.453 61.5394 100.603 61.5346 100.724 61.5975Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M100.724 41.052C100.603 40.989 100.453 40.9939 100.283 41.0811L94.4167 44.0701C94.0388 44.2639 93.7336 44.7919 93.7336 45.2521V52.3929C93.7336 52.6497 93.8256 52.829 93.9758 52.9065L89.6593 50.7071C89.5092 50.6295 89.4171 50.4504 89.4171 50.1936V43.0527C89.4171 42.5925 89.7223 42.0644 90.1002 41.8707L95.9669 38.8816C96.1365 38.7944 96.2866 38.7895 96.4078 38.8525L100.724 41.052Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M100.724 41.052C100.874 41.1295 100.966 41.3087 100.966 41.5655V48.7063C100.966 49.1666 100.661 49.6946 100.283 49.8884L94.4167 52.8774C94.2471 52.9646 94.0969 52.9695 93.9758 52.9065C93.8256 52.829 93.7336 52.6497 93.7336 52.3929V45.2521C93.7336 44.7919 94.0388 44.2639 94.4167 44.0701L100.283 41.0811C100.453 40.9939 100.603 40.989 100.724 41.052Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M83.8362 70.2014C83.7151 70.1384 83.5649 70.1433 83.3954 70.2305L77.5286 73.2195C77.1508 73.4133 76.8456 73.9414 76.8456 74.4017V81.5425C76.8456 81.7993 76.9376 81.9784 77.0878 82.0559L72.7713 79.8566C72.6212 79.7791 72.5291 79.5998 72.5291 79.3431V72.2022C72.5291 71.742 72.8343 71.214 73.2122 71.0202L79.0789 68.0311C79.2485 67.9439 79.3986 67.939 79.5198 68.002L83.8362 70.2014Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M83.8362 70.2014C83.9864 70.2789 84.0784 70.4582 84.0784 70.7149V77.8558C84.0784 78.316 83.7732 78.844 83.3954 79.0378L77.5286 82.0269C77.3591 82.1141 77.2089 82.1189 77.0878 82.0559C76.9376 81.9784 76.8456 81.7993 76.8456 81.5425V74.4017C76.8456 73.9414 77.1508 73.4133 77.5286 73.2195L83.3954 70.2305C83.5649 70.1433 83.7151 70.1384 83.8362 70.2014Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M83.8362 49.6558C83.7151 49.5928 83.5649 49.5977 83.3954 49.6849L77.5286 52.674C77.1508 52.8677 76.8456 53.3958 76.8456 53.856V60.9968C76.8456 61.2536 76.9376 61.4328 77.0878 61.5104L72.7713 59.3109C72.6212 59.2334 72.5291 59.0541 72.5291 58.7974V51.6566C72.5291 51.1963 72.8343 50.6683 73.2122 50.4745L79.0789 47.4855C79.2485 47.3983 79.3986 47.3934 79.5198 47.4564L83.8362 49.6558Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M83.8362 49.6558C83.9864 49.7333 84.0784 49.9126 84.0784 50.1694V57.3102C84.0784 57.7704 83.7732 58.2984 83.3954 58.4922L77.5286 61.4812C77.3591 61.5684 77.2089 61.5733 77.0878 61.5103C76.9376 61.4328 76.8456 61.2536 76.8456 60.9968V53.856C76.8456 53.3958 77.1508 52.8677 77.5286 52.6739L83.3954 49.6849C83.5649 49.5977 83.7151 49.5928 83.8362 49.6558Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M52.2549 9.2767C51.1164 8.69536 49.6437 8.74379 48.0401 9.56251L11.6675 28.0977C8.04379 29.9434 5.10316 35.0156 5.10316 39.4289C5.10316 41.8899 6.01877 43.6244 7.45275 44.3559L5.2921 43.2562C3.85328 42.5246 2.9425 40.7902 2.9425 38.3292C2.9425 33.9207 5.88313 28.8437 9.50683 26.9979L45.8795 8.4628C47.483 7.64407 48.9509 7.59565 50.0942 8.17699L52.2549 9.2767Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M52.2549 9.2767C53.6937 10.0082 54.6044 11.7425 54.6044 14.2035C54.6044 18.6121 51.6638 23.6891 48.0401 25.5349L11.6675 44.07C10.0639 44.8887 8.59604 44.9372 7.45274 44.3559C6.01391 43.6244 5.10315 41.8899 5.10315 39.4289C5.10315 35.0204 8.04377 29.9434 11.6675 28.0976L48.0401 9.56251C49.6437 8.74379 51.1116 8.69536 52.2549 9.2767Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M13.2275 35.8925C12.9852 36.0136 12.7914 35.8779 12.7914 35.5872C12.7914 35.2966 12.9852 34.9574 13.2226 34.8363C13.4648 34.7104 13.6586 34.8509 13.6586 35.1416C13.6586 35.4322 13.4648 35.7714 13.2226 35.8925H13.2275Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M13.2275 39.0704C12.9852 39.1915 12.7914 39.0559 12.7914 38.7653C12.7914 38.4746 12.9852 38.1355 13.2226 38.0143C13.4648 37.8884 13.6586 38.0289 13.6586 38.3196C13.6586 38.6103 13.4648 38.9493 13.2226 39.0704H13.2275Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M13.2275 32.7145C12.9852 32.8356 12.7914 32.6999 12.7914 32.4092C12.7914 32.1185 12.9852 31.7795 13.2226 31.6584C13.4648 31.5325 13.6586 31.6729 13.6586 31.9636C13.6586 32.2542 13.4648 32.5934 13.2226 32.7145H13.2275Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M21.061 31.9006L15.4026 34.7831C15.1604 34.9042 14.9666 34.7685 14.9666 34.473C14.9666 34.1775 15.1604 33.8433 15.4026 33.7222L21.061 30.8396C21.3032 30.7185 21.497 30.8542 21.497 31.1497C21.497 31.4452 21.3032 31.7795 21.061 31.9006Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M21.061 35.0785L15.4026 37.9611C15.1604 38.0822 14.9666 37.9465 14.9666 37.651C14.9666 37.3555 15.1604 37.0212 15.4026 36.9001L21.061 34.0176C21.3032 33.8965 21.497 34.0322 21.497 34.3277C21.497 34.6233 21.3032 34.9574 21.061 35.0785Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M21.061 28.7226L15.4026 31.6051C15.1604 31.7262 14.9666 31.5906 14.9666 31.2951C14.9666 30.9996 15.1604 30.6653 15.4026 30.5442L21.061 27.6617C21.3032 27.5406 21.497 27.6762 21.497 27.9717C21.497 28.2672 21.3032 28.6015 21.061 28.7226Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M46.0878 23.2968L41.2917 25.7383C40.7249 26.029 40.2647 25.6996 40.2647 25.0116V19.1741C40.2647 18.4862 40.7249 17.6867 41.2917 17.4009L46.0878 14.9593C46.6546 14.6686 47.1149 14.9981 47.1149 15.686V21.5236C47.1149 22.2115 46.6546 23.0109 46.0878 23.2968ZM41.2917 18.239C41.1028 18.3359 40.9478 18.6023 40.9478 18.83V24.6677C40.9478 24.8954 41.1028 25.0068 41.2917 24.9099L46.0878 22.4683C46.2768 22.3714 46.4318 22.1049 46.4318 21.8772V16.0396C46.4318 15.8119 46.2768 15.7005 46.0878 15.7974L41.2917 18.239Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M45.0608 18.3989L42.6628 19.6198C42.4738 19.7167 42.3188 19.6101 42.3188 19.3775C42.3188 19.145 42.4738 18.8834 42.6628 18.7865L45.0608 17.5657C45.2497 17.4688 45.4048 17.5754 45.4048 17.8079C45.4048 18.0405 45.2497 18.302 45.0608 18.3989Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M44.3729 20.4191L42.3188 21.4656C42.1299 21.5624 41.9749 21.4559 41.9749 21.2233C41.9749 20.9908 42.1299 20.7292 42.3188 20.6323L44.3729 19.5858C44.5618 19.4889 44.7169 19.5955 44.7169 19.828C44.7169 20.0606 44.5618 20.3222 44.3729 20.4191Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M45.0608 21.7368L43.3459 22.6088C43.1569 22.7057 43.0019 22.5991 43.0019 22.3666C43.0019 22.134 43.1569 21.8724 43.3459 21.7756L45.0608 20.9035C45.2497 20.8066 45.4048 20.9132 45.4048 21.1457C45.4048 21.3783 45.2497 21.6399 45.0608 21.7368Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M29.8538 26.9205L28.1388 27.7925C27.761 27.9862 27.4557 27.7682 27.4557 27.308V25.225C27.4557 24.7647 27.761 24.2366 28.1388 24.0428L29.8538 23.1709C30.2317 22.9771 30.5369 23.1951 30.5369 23.6553V25.7384C30.5369 26.1986 30.2317 26.7268 29.8538 26.9205ZM28.1388 24.8762V26.9592L29.8538 26.0873V24.0041L28.1388 24.8762Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M33.618 24.9973L31.903 25.8692C31.5252 26.063 31.22 25.845 31.22 25.3847V23.3017C31.22 22.8415 31.5252 22.3133 31.903 22.1195L33.618 21.2476C33.9959 21.0538 34.3011 21.2718 34.3011 21.7321V23.8151C34.3011 24.2754 33.9959 24.8035 33.618 24.9973ZM31.9079 22.9528V25.036L33.6228 24.1639V22.0809L31.9079 22.9528Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M33.618 29.585L31.903 30.4569C31.5252 30.6507 31.22 30.4327 31.22 29.9725V27.8894C31.22 27.4292 31.5252 26.9011 31.903 26.7073L33.618 25.8354C33.9959 25.6416 34.3011 25.8596 34.3011 26.3198V28.4029C34.3011 28.8631 33.9959 29.3912 33.618 29.585ZM31.9079 27.5406V29.6237L33.6228 28.7518V26.6686L31.9079 27.5406Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M29.8538 31.5034L28.1388 32.3755C27.761 32.5693 27.4557 32.3512 27.4557 31.891V29.8079C27.4557 29.3476 27.761 28.8196 28.1388 28.6258L29.8538 27.7538C30.2317 27.56 30.5369 27.778 30.5369 28.2382V30.3214C30.5369 30.7816 30.2317 31.3097 29.8538 31.5034ZM28.1388 29.4591V31.5422L29.8538 30.6702V28.587L28.1388 29.4591Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.34069 77.846C4.00845 77.1677 3.16066 75.5642 3.16066 73.2825C3.16066 69.1985 5.88328 64.4993 9.23568 62.794L31.7143 51.3416C33.1967 50.5859 34.5531 50.5374 35.6092 51.0752L33.4486 49.9754C32.3925 49.4377 31.036 49.4862 29.5536 50.2419L7.07502 61.6944C3.71777 63.4045 1 68.1037 1 72.1828C1 74.4645 1.84779 76.068 3.18003 76.7463L5.34069 77.846Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.34068 77.846C6.39678 78.3837 7.75325 78.3352 9.23567 77.5795L31.7142 66.1271C35.0715 64.417 37.7893 59.7179 37.7893 55.6388C37.7893 53.357 36.9415 51.7534 35.6092 51.0751C34.5531 50.5374 33.1967 50.5859 31.7142 51.3416L9.23567 62.794C5.87842 64.5041 3.16064 69.2034 3.16064 73.2825C3.16064 75.5642 4.00844 77.1677 5.34068 77.846Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M12.312 67.1929C12.3944 67.0669 12.5155 67.0137 12.593 67.0669C12.6705 67.1202 12.6754 67.2655 12.6075 67.4012L12.593 67.4303L9.65721 72.5025C9.57485 72.643 9.44405 72.7108 9.36169 72.6527C9.27934 72.5946 9.27934 72.4347 9.36169 72.2893L12.2975 67.2171L12.312 67.1929Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M10.1368 68.8836C10.1368 68.6705 9.99631 68.5736 9.82191 68.6608C9.6475 68.748 9.50701 68.9903 9.50701 69.2035C9.50701 69.4166 9.6475 69.5135 9.82191 69.4263C9.99631 69.3391 10.1368 69.0968 10.1368 68.8836ZM10.5534 68.6705C10.5534 69.1646 10.224 69.7314 9.81706 69.9397C9.41012 70.148 9.08069 69.9156 9.08069 69.4214C9.08069 68.9273 9.41012 68.3604 9.81706 68.1521C10.224 67.9438 10.5534 68.1764 10.5534 68.6705Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M12.4428 70.5163C12.4428 70.3032 12.3023 70.2063 12.1279 70.2935C11.9535 70.3807 11.813 70.6229 11.813 70.836C11.813 71.0492 11.9535 71.146 12.1279 71.0588C12.3023 70.9716 12.4428 70.7295 12.4428 70.5163ZM12.8643 70.3031C12.8643 70.7972 12.5348 71.3641 12.1279 71.5724C11.721 71.7807 11.3915 71.5481 11.3915 71.054C11.3915 70.5599 11.721 69.9931 12.1279 69.7848C12.5348 69.5765 12.8643 69.8089 12.8643 70.3031Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M10.9071 65.3375C10.9071 65.2018 10.9991 65.0468 11.1105 64.9935C11.7645 64.7029 12.3992 64.6061 12.966 64.7272C13.5909 64.858 14.0996 65.2406 14.4533 65.8316C14.8021 66.4227 14.9765 67.2075 14.9571 68.0941C14.9377 68.9855 14.7197 69.9496 14.337 70.8894C13.9494 71.8292 13.4068 72.7109 12.7674 73.4425C12.123 74.174 11.4061 74.7262 10.6842 75.0411C9.96238 75.356 9.26477 75.4287 8.66405 75.2446C8.12146 75.0751 7.67093 74.7069 7.36088 74.1643C7.30759 74.0722 7.35118 73.9027 7.45292 73.7913C7.55465 73.6798 7.67577 73.6701 7.72906 73.7622C8.01004 74.2418 8.40729 74.5663 8.89174 74.7165C9.43433 74.8812 10.0593 74.8183 10.7084 74.5325C11.3576 74.2467 12.0068 73.7524 12.5833 73.0936C13.1598 72.4347 13.6491 71.645 13.9979 70.7973C14.3467 69.9495 14.5356 69.0823 14.555 68.2781C14.5744 67.4788 14.4193 66.7715 14.1044 66.2386C13.7896 65.7057 13.3293 65.3617 12.7674 65.2455C12.2635 65.1389 11.7016 65.2212 11.1202 65.478C11.0088 65.5264 10.9168 65.4635 10.9168 65.3279L10.9071 65.3375Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M28.8705 62.7311L20.6445 66.9216C19.9663 67.2655 19.4189 66.8781 19.4189 66.0545C19.4189 65.2309 19.9663 64.2862 20.6445 63.9422L28.8705 59.7518C29.5488 59.4078 30.0962 59.7953 30.0962 60.6188C30.0962 61.4424 29.5488 62.3871 28.8705 62.7311Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M157.953 35.6503C158.495 35.3742 158.839 34.7201 158.839 33.79V21.9112C158.839 20.2447 157.73 18.3262 156.359 17.6286L125.62 1.96632C125.015 1.65627 124.458 1.64175 124.027 1.85975L126.187 0.760037C126.618 0.542033 127.176 0.556612 127.781 0.866661L158.52 16.5289C159.891 17.2265 161 19.145 161 20.8115V32.6903C161 33.6204 160.656 34.2745 160.113 34.5506L157.953 35.6503Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M157.953 35.6503C157.522 35.8683 156.965 35.8537 156.359 35.5436L125.62 19.8814C124.249 19.1838 123.14 17.2653 123.14 15.5988V3.72C123.14 2.78985 123.484 2.13585 124.027 1.85972C124.458 1.64171 125.015 1.65623 125.62 1.96628L156.359 17.6286C157.73 18.3262 158.839 20.2447 158.839 21.9112V33.79C158.839 34.7201 158.495 35.3742 157.953 35.6503Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.35"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M136.244 15.0223L143.376 18.6557C143.962 18.9561 144.437 18.6169 144.437 17.9048C144.437 17.1927 143.962 16.3691 143.376 16.0736L136.244 12.4402C135.658 12.1398 135.184 12.4789 135.184 13.1911C135.184 13.9032 135.658 14.7268 136.244 15.0223Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M136.753 20.9908L146.752 26.0872C147.576 26.5039 148.24 26.0339 148.24 25.0359C148.24 24.0331 147.571 22.8849 146.752 22.4683L136.753 17.372C135.93 16.9553 135.266 17.4252 135.266 18.4232C135.266 19.426 135.934 20.5742 136.753 20.9908Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M130.262 11.3356C130.31 11.4955 130.421 11.6505 130.547 11.7135C130.722 11.8055 130.867 11.699 130.867 11.4809V11.0789C130.867 10.9481 130.819 10.7979 130.731 10.6817C130.644 10.5654 130.538 10.4927 130.436 10.4879L128.377 10.4297C128.256 10.4297 128.174 10.5314 128.174 10.6961V13.4672C128.174 13.6077 128.232 13.7628 128.324 13.8839C128.421 14.005 128.537 14.068 128.634 14.0534L128.929 14.0098C129.084 13.9856 129.142 13.7773 129.065 13.5447C129.012 13.3897 128.915 13.2638 128.808 13.2008V11.2872L130.257 11.3259L130.262 11.3356Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M128.992 9.5044C129.041 9.66427 129.152 9.81931 129.278 9.88229C129.453 9.97434 129.598 9.86777 129.598 9.64976V9.24763C129.598 9.11683 129.549 8.96667 129.462 8.8504C129.375 8.73414 129.268 8.66146 129.167 8.65661L127.108 8.59848C126.987 8.59848 126.904 8.70024 126.904 8.86495V11.636C126.904 11.7765 126.962 11.9315 127.054 12.0526C127.151 12.1737 127.268 12.2367 127.365 12.2222L127.66 12.1786C127.815 12.1544 127.873 11.946 127.796 11.7135C127.742 11.5584 127.646 11.4325 127.539 11.3695V9.45597L128.987 9.4947L128.992 9.5044Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M132.132 12.5807C132.044 12.4596 131.938 12.3869 131.841 12.3869L129.782 12.3287C129.661 12.3287 129.578 12.4353 129.578 12.5904V15.3663C129.578 15.4971 129.627 15.6424 129.714 15.7587C129.806 15.8798 129.913 15.9524 130.01 15.9524L132.064 16.0106C132.19 16.0203 132.272 15.9137 132.272 15.749V12.9731C132.272 12.8423 132.224 12.6969 132.132 12.5807ZM131.637 15.158L130.213 15.1143V13.1911L131.637 13.2347V15.158Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M13.2275 35.8925C12.9852 36.0136 12.7914 35.8779 12.7914 35.5872C12.7914 35.2966 12.9852 34.9574 13.2226 34.8363C13.4648 34.7104 13.6586 34.8509 13.6586 35.1416C13.6586 35.4322 13.4648 35.7714 13.2226 35.8925H13.2275Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M13.2275 39.0704C12.9852 39.1915 12.7914 39.0559 12.7914 38.7653C12.7914 38.4746 12.9852 38.1355 13.2226 38.0143C13.4648 37.8884 13.6586 38.0289 13.6586 38.3196C13.6586 38.6103 13.4648 38.9493 13.2226 39.0704H13.2275Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M13.2275 32.7145C12.9852 32.8356 12.7914 32.6999 12.7914 32.4092C12.7914 32.1185 12.9852 31.7795 13.2226 31.6584C13.4648 31.5325 13.6586 31.6729 13.6586 31.9636C13.6586 32.2542 13.4648 32.5934 13.2226 32.7145H13.2275Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M21.061 31.9006L15.4026 34.7831C15.1604 34.9042 14.9666 34.7685 14.9666 34.473C14.9666 34.1775 15.1604 33.8433 15.4026 33.7222L21.061 30.8396C21.3032 30.7185 21.497 30.8542 21.497 31.1497C21.497 31.4452 21.3032 31.7795 21.061 31.9006Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M21.061 35.0785L15.4026 37.9611C15.1604 38.0822 14.9666 37.9465 14.9666 37.651C14.9666 37.3555 15.1604 37.0212 15.4026 36.9001L21.061 34.0176C21.3032 33.8965 21.497 34.0322 21.497 34.3277C21.497 34.6233 21.3032 34.9574 21.061 35.0785Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M21.061 28.7226L15.4026 31.6051C15.1604 31.7262 14.9666 31.5906 14.9666 31.2951C14.9666 30.9996 15.1604 30.6653 15.4026 30.5442L21.061 27.6617C21.3032 27.5406 21.497 27.6762 21.497 27.9717C21.497 28.2672 21.3032 28.6015 21.061 28.7226Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M46.0878 23.2968L41.2917 25.7383C40.7249 26.029 40.2647 25.6996 40.2647 25.0116V19.1741C40.2647 18.4862 40.7249 17.6867 41.2917 17.4009L46.0878 14.9593C46.6546 14.6686 47.1149 14.9981 47.1149 15.686V21.5236C47.1149 22.2115 46.6546 23.0109 46.0878 23.2968ZM41.2917 18.239C41.1028 18.3359 40.9478 18.6023 40.9478 18.83V24.6677C40.9478 24.8954 41.1028 25.0068 41.2917 24.9099L46.0878 22.4683C46.2768 22.3714 46.4318 22.1049 46.4318 21.8772V16.0396C46.4318 15.8119 46.2768 15.7005 46.0878 15.7974L41.2917 18.239Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M45.0608 18.3989L42.6628 19.6198C42.4738 19.7167 42.3188 19.6101 42.3188 19.3775C42.3188 19.145 42.4738 18.8834 42.6628 18.7865L45.0608 17.5657C45.2497 17.4688 45.4048 17.5754 45.4048 17.8079C45.4048 18.0405 45.2497 18.302 45.0608 18.3989Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M44.3729 20.4191L42.3188 21.4656C42.1299 21.5624 41.9749 21.4559 41.9749 21.2233C41.9749 20.9908 42.1299 20.7292 42.3188 20.6323L44.3729 19.5858C44.5618 19.4889 44.7169 19.5955 44.7169 19.828C44.7169 20.0606 44.5618 20.3222 44.3729 20.4191Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M45.0608 21.7368L43.3459 22.6088C43.1569 22.7057 43.0019 22.5991 43.0019 22.3666C43.0019 22.134 43.1569 21.8724 43.3459 21.7756L45.0608 20.9035C45.2497 20.8066 45.4048 20.9132 45.4048 21.1457C45.4048 21.3783 45.2497 21.6399 45.0608 21.7368Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M29.8538 26.9205L28.1388 27.7925C27.761 27.9862 27.4557 27.7682 27.4557 27.308V25.225C27.4557 24.7647 27.761 24.2366 28.1388 24.0428L29.8538 23.1709C30.2317 22.9771 30.5369 23.1951 30.5369 23.6553V25.7384C30.5369 26.1986 30.2317 26.7268 29.8538 26.9205ZM28.1388 24.8762V26.9592L29.8538 26.0873V24.0041L28.1388 24.8762Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M33.618 24.9973L31.903 25.8692C31.5252 26.063 31.22 25.845 31.22 25.3847V23.3017C31.22 22.8415 31.5252 22.3133 31.903 22.1195L33.618 21.2476C33.9959 21.0538 34.3011 21.2718 34.3011 21.7321V23.8151C34.3011 24.2754 33.9959 24.8035 33.618 24.9973ZM31.9079 22.9528V25.036L33.6228 24.1639V22.0809L31.9079 22.9528Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M33.618 29.585L31.903 30.4569C31.5252 30.6507 31.22 30.4327 31.22 29.9725V27.8894C31.22 27.4292 31.5252 26.9011 31.903 26.7073L33.618 25.8354C33.9959 25.6416 34.3011 25.8596 34.3011 26.3198V28.4029C34.3011 28.8631 33.9959 29.3912 33.618 29.585ZM31.9079 27.5406V29.6237L33.6228 28.7518V26.6686L31.9079 27.5406Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M29.8538 31.5034L28.1388 32.3755C27.761 32.5693 27.4557 32.3512 27.4557 31.891V29.8079C27.4557 29.3476 27.761 28.8196 28.1388 28.6258L29.8538 27.7538C30.2317 27.56 30.5369 27.778 30.5369 28.2382V30.3214C30.5369 30.7816 30.2317 31.3097 29.8538 31.5034ZM28.1388 29.4591V31.5422L29.8538 30.6702V28.587L28.1388 29.4591Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.34069 77.846C4.00845 77.1677 3.16066 75.5642 3.16066 73.2825C3.16066 69.1985 5.88328 64.4993 9.23568 62.794L31.7143 51.3416C33.1967 50.5859 34.5531 50.5374 35.6092 51.0752L33.4486 49.9754C32.3925 49.4377 31.036 49.4862 29.5536 50.2419L7.07502 61.6944C3.71777 63.4045 1 68.1037 1 72.1828C1 74.4645 1.84779 76.068 3.18003 76.7463L5.34069 77.846Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.34068 77.846C6.39678 78.3837 7.75325 78.3352 9.23567 77.5795L31.7142 66.1271C35.0715 64.417 37.7893 59.7179 37.7893 55.6388C37.7893 53.357 36.9415 51.7534 35.6092 51.0751C34.5531 50.5374 33.1967 50.5859 31.7142 51.3416L9.23567 62.794C5.87842 64.5041 3.16064 69.2034 3.16064 73.2825C3.16064 75.5642 4.00844 77.1677 5.34068 77.846Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M12.312 67.1929C12.3944 67.0669 12.5155 67.0137 12.593 67.0669C12.6705 67.1202 12.6754 67.2655 12.6075 67.4012L12.593 67.4303L9.65721 72.5025C9.57485 72.643 9.44405 72.7108 9.36169 72.6527C9.27934 72.5946 9.27934 72.4347 9.36169 72.2893L12.2975 67.2171L12.312 67.1929Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M10.1368 68.8836C10.1368 68.6705 9.99631 68.5736 9.82191 68.6608C9.6475 68.748 9.50701 68.9903 9.50701 69.2035C9.50701 69.4166 9.6475 69.5135 9.82191 69.4263C9.99631 69.3391 10.1368 69.0968 10.1368 68.8836ZM10.5534 68.6705C10.5534 69.1646 10.224 69.7314 9.81706 69.9397C9.41012 70.148 9.08069 69.9156 9.08069 69.4214C9.08069 68.9273 9.41012 68.3604 9.81706 68.1521C10.224 67.9438 10.5534 68.1764 10.5534 68.6705Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M12.4428 70.5163C12.4428 70.3032 12.3023 70.2063 12.1279 70.2935C11.9535 70.3807 11.813 70.6229 11.813 70.836C11.813 71.0492 11.9535 71.146 12.1279 71.0588C12.3023 70.9716 12.4428 70.7295 12.4428 70.5163ZM12.8643 70.3031C12.8643 70.7972 12.5348 71.3641 12.1279 71.5724C11.721 71.7807 11.3915 71.5481 11.3915 71.054C11.3915 70.5599 11.721 69.9931 12.1279 69.7848C12.5348 69.5765 12.8643 69.8089 12.8643 70.3031Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M10.9071 65.3375C10.9071 65.2018 10.9991 65.0468 11.1105 64.9935C11.7645 64.7029 12.3992 64.6061 12.966 64.7272C13.5909 64.858 14.0996 65.2406 14.4533 65.8316C14.8021 66.4227 14.9765 67.2075 14.9571 68.0941C14.9377 68.9855 14.7197 69.9496 14.337 70.8894C13.9494 71.8292 13.4068 72.7109 12.7674 73.4425C12.123 74.174 11.4061 74.7262 10.6842 75.0411C9.96238 75.356 9.26477 75.4287 8.66405 75.2446C8.12146 75.0751 7.67093 74.7069 7.36088 74.1643C7.30759 74.0722 7.35118 73.9027 7.45292 73.7913C7.55465 73.6798 7.67577 73.6701 7.72906 73.7622C8.01004 74.2418 8.40729 74.5663 8.89174 74.7165C9.43433 74.8812 10.0593 74.8183 10.7084 74.5325C11.3576 74.2467 12.0068 73.7524 12.5833 73.0936C13.1598 72.4347 13.6491 71.645 13.9979 70.7973C14.3467 69.9495 14.5356 69.0823 14.555 68.2781C14.5744 67.4788 14.4193 66.7715 14.1044 66.2386C13.7896 65.7057 13.3293 65.3617 12.7674 65.2455C12.2635 65.1389 11.7016 65.2212 11.1202 65.478C11.0088 65.5264 10.9168 65.4635 10.9168 65.3279L10.9071 65.3375Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M28.8705 62.7311L20.6445 66.9216C19.9663 67.2655 19.4189 66.8781 19.4189 66.0545C19.4189 65.2309 19.9663 64.2862 20.6445 63.9422L28.8705 59.7518C29.5488 59.4078 30.0962 59.7953 30.0962 60.6188C30.0962 61.4424 29.5488 62.3871 28.8705 62.7311Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M157.953 35.6503C158.495 35.3742 158.839 34.7201 158.839 33.79V21.9112C158.839 20.2447 157.73 18.3262 156.359 17.6286L125.62 1.96632C125.015 1.65627 124.458 1.64175 124.027 1.85975L126.187 0.760037C126.618 0.542033 127.176 0.556612 127.781 0.866661L158.52 16.5289C159.891 17.2265 161 19.145 161 20.8115V32.6903C161 33.6204 160.656 34.2745 160.113 34.5506L157.953 35.6503Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M157.953 35.6503C157.522 35.8683 156.965 35.8537 156.359 35.5436L125.62 19.8814C124.249 19.1838 123.14 17.2653 123.14 15.5988V3.72C123.14 2.78985 123.484 2.13585 124.027 1.85972C124.458 1.64171 125.015 1.65623 125.62 1.96628L156.359 17.6286C157.73 18.3262 158.839 20.2447 158.839 21.9112V33.79C158.839 34.7201 158.495 35.3742 157.953 35.6503Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.35"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M136.244 15.0223L143.376 18.6557C143.962 18.9561 144.437 18.6169 144.437 17.9048C144.437 17.1927 143.962 16.3691 143.376 16.0736L136.244 12.4402C135.658 12.1398 135.184 12.4789 135.184 13.1911C135.184 13.9032 135.658 14.7268 136.244 15.0223Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M136.753 20.9908L146.752 26.0872C147.576 26.5039 148.24 26.0339 148.24 25.0359C148.24 24.0331 147.571 22.8849 146.752 22.4683L136.753 17.372C135.93 16.9553 135.266 17.4252 135.266 18.4232C135.266 19.426 135.934 20.5742 136.753 20.9908Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M130.262 11.3356C130.31 11.4955 130.421 11.6505 130.547 11.7135C130.722 11.8055 130.867 11.699 130.867 11.4809V11.0789C130.867 10.9481 130.819 10.7979 130.731 10.6817C130.644 10.5654 130.538 10.4927 130.436 10.4879L128.377 10.4297C128.256 10.4297 128.174 10.5314 128.174 10.6961V13.4672C128.174 13.6077 128.232 13.7628 128.324 13.8839C128.421 14.005 128.537 14.068 128.634 14.0534L128.929 14.0098C129.084 13.9856 129.142 13.7773 129.065 13.5447C129.012 13.3897 128.915 13.2638 128.808 13.2008V11.2872L130.257 11.3259L130.262 11.3356Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M128.992 9.5044C129.041 9.66427 129.152 9.81931 129.278 9.88229C129.453 9.97434 129.598 9.86777 129.598 9.64976V9.24763C129.598 9.11683 129.549 8.96667 129.462 8.8504C129.375 8.73414 129.268 8.66146 129.167 8.65661L127.108 8.59848C126.987 8.59848 126.904 8.70024 126.904 8.86495V11.636C126.904 11.7765 126.962 11.9315 127.054 12.0526C127.151 12.1737 127.268 12.2367 127.365 12.2222L127.66 12.1786C127.815 12.1544 127.873 11.946 127.796 11.7135C127.742 11.5584 127.646 11.4325 127.539 11.3695V9.45597L128.987 9.4947L128.992 9.5044Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M132.132 12.5807C132.044 12.4596 131.938 12.3869 131.841 12.3869L129.782 12.3287C129.661 12.3287 129.578 12.4353 129.578 12.5904V15.3663C129.578 15.4971 129.627 15.6424 129.714 15.7587C129.806 15.8798 129.913 15.9524 130.01 15.9524L132.064 16.0106C132.19 16.0203 132.272 15.9137 132.272 15.749V12.9731C132.272 12.8423 132.224 12.6969 132.132 12.5807ZM131.637 15.158L130.213 15.1143V13.1911L131.637 13.2347V15.158Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx b/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx
index 1e4969a7f..25bbe5675 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const NoAccessVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="161"
-    height="169"
-    viewBox="0 0 161 169"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function NoAccessVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="161"
+      height="169"
+      viewBox="0 0 161 169"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M0.5 131.812C0.5 133.945 2.097 136.072 5.28537 137.703L46.3392 158.622C52.7216 161.873 63.0656 161.873 69.4479 158.622L155.715 114.668C158.903 113.043 160.5 110.915 160.5 108.782V115.593C160.5 117.726 158.903 119.854 155.715 121.479L69.4479 165.433C63.0656 168.684 52.7216 168.684 46.3392 165.433L5.28537 144.514C2.09135 142.889 0.5 140.756 0.5 138.623V131.812Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M0.5 131.811C0.5 129.678 2.097 127.551 5.28537 125.926L91.5521 81.9713C97.9344 78.7208 108.278 78.7208 114.661 81.9713L155.715 102.89C158.909 104.516 160.5 106.649 160.5 108.782C160.5 110.915 158.903 113.042 155.715 114.668L69.4479 158.622C63.0656 161.872 52.7216 161.872 46.3392 158.622L5.28537 137.703C2.09135 136.078 0.5 133.944 0.5 131.811Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M0.5 110.294C0.5 112.427 2.097 114.555 5.28537 116.186L46.3392 137.105C52.7216 140.355 63.0656 140.355 69.4479 137.105L155.715 93.1504C158.903 91.5252 160.5 89.3978 160.5 87.2646V94.076C160.5 96.2091 158.903 98.3365 155.715 99.9617L69.4479 143.916C63.0656 147.167 52.7216 147.167 46.3392 143.916L5.28537 122.997C2.09135 121.372 0.5 119.239 0.5 117.106V110.294Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M0.5 110.294C0.5 108.161 2.097 106.034 5.28537 104.408L91.5521 60.4539C97.9344 57.2035 108.278 57.2035 114.661 60.4539L155.715 81.3731C158.909 82.9983 160.5 85.1314 160.5 87.2645C160.5 89.3976 158.903 91.525 155.715 93.1502L69.4479 137.105C63.0656 140.355 52.7216 140.355 46.3392 137.105L5.28537 116.186C2.09135 114.56 0.5 112.427 0.5 110.294Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M0.5 131.812C0.5 133.945 2.097 136.072 5.28537 137.703L46.3392 158.622C52.7216 161.873 63.0656 161.873 69.4479 158.622L155.715 114.668C158.903 113.043 160.5 110.915 160.5 108.782V115.593C160.5 117.726 158.903 119.854 155.715 121.479L69.4479 165.433C63.0656 168.684 52.7216 168.684 46.3392 165.433L5.28537 144.514C2.09135 142.889 0.5 140.756 0.5 138.623V131.812Z"
+        d="M0.5 88.7768C0.5 90.91 2.097 93.0375 5.28537 94.6684L46.3392 115.587C52.7216 118.838 63.0656 118.838 69.4479 115.587L155.715 71.6331C158.903 70.0078 160.5 67.8804 160.5 65.7473V72.5585C160.5 74.6916 158.903 76.8191 155.715 78.4444L69.4479 122.399C63.0656 125.649 52.7216 125.649 46.3392 122.399L5.28537 101.48C2.09135 99.8543 0.5 97.7213 0.5 95.5882V88.7768Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -20,145 +56,111 @@ export const NoAccessVerticalStackIllustration = ({ className }: TIllustrationAs
         strokeLinejoin="round"
       />
       <path
-        d="M0.5 131.811C0.5 129.678 2.097 127.551 5.28537 125.926L91.5521 81.9713C97.9344 78.7208 108.278 78.7208 114.661 81.9713L155.715 102.89C158.909 104.516 160.5 106.649 160.5 108.782C160.5 110.915 158.903 113.042 155.715 114.668L69.4479 158.622C63.0656 161.872 52.7216 161.872 46.3392 158.622L5.28537 137.703C2.09135 136.078 0.5 133.944 0.5 131.811Z"
+        d="M0.5 88.7767C0.5 86.6436 2.097 84.5162 5.28537 82.8909L91.5521 38.9366C97.9344 35.6862 108.278 35.6862 114.661 38.9366L155.715 59.8556C158.909 61.4808 160.5 63.6141 160.5 65.7472C160.5 67.8803 158.903 70.0077 155.715 71.6329L69.4479 115.587C63.0656 118.838 52.7216 118.838 46.3392 115.587L5.28537 94.6682C2.09135 93.043 0.5 90.9098 0.5 88.7767Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M0.5 110.294C0.5 112.427 2.097 114.555 5.28537 116.186L46.3392 137.105C52.7216 140.355 63.0656 140.355 69.4479 137.105L155.715 93.1504C158.903 91.5252 160.5 89.3978 160.5 87.2646V94.076C160.5 96.2091 158.903 98.3365 155.715 99.9617L69.4479 143.916C63.0656 147.167 52.7216 147.167 46.3392 143.916L5.28537 122.997C2.09135 121.372 0.5 119.239 0.5 117.106V110.294Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        d="M79.0808 85.8819C76.1633 85.8819 73.4546 85.2611 71.0055 84.0366C70.966 84.0253 70.9323 84.0139 70.8928 83.9914L65.8646 81.4295C58.6245 77.7389 54.4712 69.1104 54.4712 57.7508C54.4712 47.7794 57.637 36.7415 63.3817 26.6685C63.3817 26.6685 63.7767 25.9856 63.805 25.9349C69.6625 15.9465 77.4276 8.11946 85.6666 3.91532C89.8651 1.77658 93.9562 0.693115 97.8162 0.693115C100.768 0.693115 103.516 1.33071 105.982 2.58913L111.004 5.14549C111.004 5.14549 111.038 5.16245 111.055 5.17373C118.267 8.87563 122.403 17.487 122.403 28.8297C122.403 38.8181 119.232 49.8674 113.47 59.946C113.385 60.1097 113.165 60.4878 113.064 60.6514C107.206 70.6511 99.4414 78.4668 91.2081 82.6653C87.0209 84.7984 82.9351 85.8819 79.0808 85.8819ZM72.6422 74.3473C73.7765 74.6351 74.9728 74.7875 76.2031 74.7875C79.1996 74.7875 82.3822 73.9409 85.6721 72.2649C91.1685 69.4659 96.5689 64.4606 100.914 58.1403L71.0903 37.0349C67.9189 43.8856 66.2427 50.9282 66.2427 57.4517C66.2427 64.9514 68.5114 70.9445 72.6422 74.353V74.3473ZM105.801 49.5513C108.967 42.6949 110.643 35.6466 110.643 29.1345C110.643 21.6404 108.375 15.6474 104.244 12.239C103.109 11.9455 101.907 11.7988 100.672 11.7988C97.6751 11.7988 94.4922 12.6452 91.2136 14.3212C85.7228 17.1202 80.328 22.1257 75.9771 28.446L105.801 49.5513Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M97.8215 1.25753C100.705 1.25753 103.369 1.88956 105.733 3.09155L110.761 5.65356C110.733 5.63663 110.699 5.6253 110.671 5.61402C117.494 9.0394 121.845 17.2219 121.845 28.8355C121.845 39.0721 118.464 50.0876 112.985 59.6696C112.973 59.6979 112.601 60.3412 112.579 60.3694C107.009 69.8724 99.3678 77.8743 90.9539 82.1631C86.7497 84.3075 82.7374 85.3177 79.0807 85.3177C76.0503 85.3177 73.2627 84.6235 70.8136 83.2974C70.9264 83.3595 71.0393 83.4329 71.1522 83.4893L66.1241 80.9273C59.3523 77.4737 55.0354 69.3137 55.0354 57.7509C55.0354 47.5255 58.41 36.5215 63.8726 26.9508C63.8782 26.9395 64.2675 26.2679 64.2788 26.251C69.8598 16.731 77.5065 8.71768 85.926 4.42326C90.1414 2.27886 94.1591 1.26318 97.8215 1.26318M102.85 3.81954C102.443 3.81954 102.031 3.83073 101.614 3.85894C102.031 3.83637 102.443 3.81954 102.85 3.81954ZM104.244 3.87024C103.894 3.84767 103.544 3.83083 103.188 3.82519C103.544 3.83083 103.894 3.84202 104.244 3.87024ZM101.247 3.89283C100.92 3.92105 100.587 3.94922 100.254 3.98872C100.587 3.94922 100.92 3.91541 101.247 3.89283H101.264C101.264 3.89283 101.253 3.89283 101.247 3.89283ZM105.096 3.96062C105.237 3.97755 105.372 3.99439 105.508 4.01132C105.372 3.99439 105.231 3.97755 105.096 3.96062C104.955 3.94369 104.819 3.93236 104.678 3.91543C104.819 3.92672 104.955 3.94369 105.096 3.96062ZM99.3114 4.1298C99.1647 4.15237 99.0179 4.18067 98.8656 4.20888C99.0123 4.18067 99.1647 4.15802 99.3114 4.1298ZM107.59 4.4402C107.471 4.40634 107.347 4.37817 107.229 4.34431C107.347 4.37253 107.471 4.40634 107.59 4.4402ZM96.2529 4.84649C96.1682 4.86906 96.0892 4.89735 96.0046 4.91992C96.0892 4.89171 96.1682 4.86906 96.2529 4.84649C96.4617 4.78442 96.6649 4.72809 96.8737 4.67166C96.6705 4.72809 96.4617 4.78442 96.2529 4.84649ZM108.803 4.82403C108.911 4.86354 109.018 4.90302 109.119 4.94252C109.012 4.90302 108.905 4.86354 108.803 4.82403C108.674 4.77889 108.549 4.73361 108.419 4.68847C108.549 4.73361 108.679 4.77325 108.803 4.82403ZM95.4064 5.1117C95.1073 5.20764 94.8138 5.32053 94.5147 5.42775C94.8138 5.31489 95.1129 5.20764 95.4064 5.1117C95.4064 5.1117 95.4063 5.1117 95.4119 5.1117C95.4119 5.1117 95.412 5.1117 95.4064 5.1117ZM110.287 5.4334C110.05 5.32054 109.808 5.20764 109.565 5.1117C109.808 5.21328 110.05 5.32618 110.287 5.4334ZM91.8568 6.53943C92.06 6.4435 92.2575 6.35321 92.455 6.26292C92.2575 6.35321 92.0543 6.4435 91.8568 6.53943ZM106.021 50.4035C109.272 43.5753 111.202 36.1377 111.202 29.1346C111.202 21.11 108.657 15.0945 104.503 11.7256C103.29 11.4039 102.009 11.2346 100.671 11.2346C97.6806 11.2346 94.3963 12.0641 90.9597 13.8135C85.0005 16.8495 79.5209 22.1653 75.1983 28.5816L106.027 50.3979M109.683 14.4061C109.745 14.4569 109.808 14.5075 109.87 14.564C109.808 14.5132 109.745 14.4569 109.683 14.4061C109.582 14.3214 109.475 14.2367 109.368 14.152C109.475 14.2367 109.576 14.3214 109.683 14.4061ZM110.705 15.3428C110.552 15.1904 110.394 15.038 110.236 14.8913C110.394 15.038 110.547 15.1904 110.705 15.3428ZM111.489 16.2062H111.495C111.495 16.2062 111.495 16.2062 111.489 16.2062C111.348 16.0369 111.202 15.8675 111.055 15.7039C111.202 15.8675 111.348 16.0313 111.489 16.2062ZM112.245 17.1768C112.104 16.9793 111.958 16.7818 111.811 16.5899C111.958 16.7761 112.104 16.9793 112.245 17.1768ZM112.996 18.3167C112.838 18.0571 112.68 17.8031 112.516 17.5548C112.686 17.8031 112.844 18.0571 112.996 18.3167ZM113.752 19.6823C113.566 19.3042 113.369 18.9375 113.165 18.5876C113.369 18.9431 113.566 19.3099 113.752 19.6823ZM114.65 21.7985C114.689 21.9001 114.723 22.0017 114.762 22.1089C114.728 22.0073 114.689 21.9001 114.65 21.7985C114.593 21.6461 114.537 21.4937 114.475 21.3414C114.531 21.4937 114.593 21.6461 114.65 21.7985ZM115.169 23.4294C115.095 23.1642 115.016 22.9102 114.932 22.6506C115.011 22.9046 115.095 23.1642 115.169 23.4294ZM115.423 24.4113C115.457 24.5468 115.485 24.6822 115.519 24.8176C115.49 24.6822 115.457 24.5468 115.423 24.4113C115.389 24.2759 115.355 24.1405 115.321 24.0107C115.355 24.1461 115.389 24.2759 115.423 24.4113ZM115.795 26.268C115.75 25.9858 115.699 25.7035 115.643 25.427C115.699 25.7035 115.744 25.9858 115.795 26.268ZM116.015 27.831C115.981 27.5206 115.942 27.2046 115.902 26.8999C115.947 27.2046 115.981 27.515 116.015 27.831ZM116.156 29.5071C116.134 29.1459 116.111 28.7904 116.077 28.4405C116.111 28.7904 116.134 29.1516 116.156 29.5071ZM116.23 31.6514C116.23 31.6514 116.23 31.6796 116.23 31.6909C116.23 31.6796 116.23 31.6627 116.23 31.6514C116.23 31.104 116.213 30.5623 116.19 30.0319C116.213 30.5623 116.23 31.0984 116.23 31.6514ZM76.2029 75.3519C79.1994 75.3519 82.4837 74.5224 85.926 72.7673C91.8852 69.7313 97.3703 64.4155 101.693 57.9993L70.8643 36.1885C67.6082 43.0167 65.6782 50.4543 65.6782 57.4518C65.6782 65.482 68.2234 71.4976 72.3767 74.8666C73.5843 75.1882 74.8653 75.3519 76.1971 75.3519M60.1536 62.9821C60.1423 62.7677 60.1198 62.5533 60.1142 62.3388C60.1255 62.5589 60.1423 62.7677 60.1536 62.9821ZM60.2498 64.3026C60.2723 64.5453 60.3003 64.788 60.3286 65.0306C60.3003 64.788 60.2723 64.5509 60.2498 64.3026C60.2498 64.3026 60.2498 64.297 60.2498 64.2913C60.2498 64.2913 60.2498 64.297 60.2498 64.3026ZM60.5939 66.9153C60.5544 66.667 60.5093 66.4188 60.4754 66.1705C60.5093 66.4245 60.5544 66.6727 60.5939 66.9153ZM60.9381 68.71C60.8873 68.4673 60.8308 68.2246 60.7857 67.982C60.8365 68.2303 60.8873 68.4729 60.9381 68.71ZM61.3613 70.4029C61.2992 70.1772 61.2371 69.9458 61.175 69.7088C61.2371 69.9402 61.2936 70.1715 61.3613 70.4029ZM63.0939 74.9851C63.0375 74.8666 62.9809 74.7368 62.9245 74.6183C62.9809 74.7425 63.0318 74.8666 63.0939 74.9851ZM89.3232 76.0854C89.4586 76.029 89.5941 75.9727 89.7238 75.9106C89.5884 75.9727 89.453 76.0234 89.3232 76.0854ZM63.9627 76.5765C63.9176 76.4975 63.8669 76.4241 63.8161 76.3451C63.8613 76.4241 63.9119 76.4975 63.9627 76.5765ZM88.5104 76.4241C88.3918 76.4692 88.2735 76.5144 88.1607 76.5539C88.2792 76.5087 88.3975 76.4692 88.5104 76.4241ZM75.1476 76.5934C75.0404 76.5426 74.933 76.4975 74.8257 76.4467C74.933 76.4975 75.0404 76.5483 75.1476 76.5934ZM76.1012 76.9997C75.9771 76.9546 75.8473 76.9038 75.7232 76.853C75.8473 76.9038 75.9714 76.9489 76.1012 76.9997ZM87.066 76.9376C86.9869 76.9658 86.9022 76.9884 86.8232 77.011C86.9022 76.9884 86.9869 76.9601 87.066 76.9376ZM76.9025 77.2762C76.8235 77.2536 76.7388 77.2255 76.6598 77.1973C76.7388 77.2255 76.8235 77.248 76.9025 77.2762ZM78.0537 77.5753C77.9127 77.5471 77.7715 77.5133 77.636 77.4738C77.7771 77.5076 77.9127 77.5415 78.0537 77.5753ZM64.6174 77.6092C64.7133 77.7446 64.8094 77.8744 64.9053 78.0098C64.8094 77.8744 64.7077 77.7446 64.6174 77.6092C64.6174 77.6092 64.6174 77.6092 64.6174 77.6035C64.6174 77.6035 64.6174 77.6036 64.6174 77.6092ZM78.9002 77.7333C78.951 77.7446 79.0073 77.7503 79.0581 77.7559C79.0073 77.7503 78.951 77.739 78.9002 77.7333C78.8099 77.7164 78.7253 77.7051 78.6406 77.6881C78.7253 77.7051 78.8156 77.7164 78.9002 77.7333ZM83.776 77.7107C83.6292 77.7333 83.4825 77.7558 83.3414 77.7727C83.4881 77.7558 83.6349 77.7277 83.776 77.7107ZM79.8145 77.8405C79.775 77.8405 79.741 77.8349 79.7015 77.8292C79.741 77.8292 79.775 77.8349 79.8145 77.8405ZM82.2296 77.8801C82.3425 77.8744 82.4554 77.8575 82.5683 77.8518C82.4554 77.8631 82.3425 77.8744 82.2296 77.8801ZM81.152 77.9138C81.0617 77.9138 80.9768 77.9083 80.8921 77.9026C80.9768 77.9026 81.0673 77.9138 81.152 77.9138ZM65.6556 78.9917C65.5936 78.9184 65.5374 78.8506 65.481 78.7772C65.5374 78.8506 65.5992 78.924 65.6556 78.9917ZM66.8069 80.2727C66.6714 80.1373 66.5418 80.0019 66.412 79.8608C66.5418 80.0019 66.6771 80.1373 66.8069 80.2727ZM67.4109 80.8596C67.5519 80.9894 67.6872 81.1135 67.8283 81.2377C67.6872 81.1135 67.5463 80.9894 67.4109 80.8596C67.4109 80.8596 67.4107 80.8596 67.4051 80.854C67.4051 80.854 67.4052 80.854 67.4109 80.8596ZM68.7991 82.0164C68.6862 81.9317 68.5788 81.8471 68.4659 81.7568C68.5788 81.8415 68.6862 81.9317 68.7991 82.0164ZM69.9164 82.7783C69.9615 82.8065 70.001 82.8346 70.0462 82.8572C70.001 82.829 69.9615 82.8008 69.9164 82.7783ZM97.8215 0.128906C93.8657 0.128906 89.6956 1.235 85.4124 3.41325C77.0775 7.66253 69.2278 15.5685 63.3025 25.6754C63.2066 25.8334 62.9696 26.251 62.8906 26.3864C57.0951 36.5384 53.9067 47.6779 53.9067 57.7452C53.9067 69.325 58.1731 78.1396 65.6107 81.9318L70.6386 84.4938V84.4825C73.2006 85.7861 76.0334 86.4463 79.0807 86.4463C83.0309 86.4463 87.1956 85.3402 91.4675 83.1676C99.7968 78.924 107.641 71.0293 113.555 60.9394C113.673 60.7475 113.865 60.4202 113.967 60.2283C119.774 50.0707 122.973 38.9198 122.973 28.8355C122.973 17.2501 118.707 8.44126 111.269 4.65471L106.241 2.08706C103.691 0.789137 100.858 0.128906 97.816 0.128906H97.8215ZM76.7559 28.305C80.9996 22.2725 86.1912 17.5098 91.4675 14.818C94.6671 13.1871 97.7653 12.3575 100.671 12.3575C101.817 12.3575 102.929 12.4873 103.978 12.7469C107.912 16.0594 110.073 21.8606 110.073 29.1233C110.073 35.3646 108.515 42.1026 105.564 48.6881L76.7501 28.2994L76.7559 28.305ZM72.9016 73.8338C68.9684 70.527 66.8069 64.7202 66.8069 57.4518C66.8069 51.2105 68.3644 44.4726 71.3214 37.8927L100.135 58.2758C95.8916 64.3027 90.6999 69.0711 85.4179 71.7628C82.2126 73.3937 79.1146 74.2233 76.2084 74.2233C75.0685 74.2233 73.9624 74.0934 72.9071 73.8338H72.9016Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M110.693 53.7047C114.158 46.679 116.229 38.9479 116.229 31.6909C116.229 22.233 112.702 15.5516 107.161 12.7244L102.133 10.1624C107.674 12.9839 111.202 19.6653 111.202 29.1289C111.202 36.3859 109.13 44.117 105.666 51.1427L110.693 53.7047Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
-        d="M0.5 110.294C0.5 108.161 2.097 106.034 5.28537 104.408L91.5521 60.4539C97.9344 57.2035 108.278 57.2035 114.661 60.4539L155.715 81.3731C158.909 82.9983 160.5 85.1314 160.5 87.2645C160.5 89.3976 158.903 91.525 155.715 93.1502L69.4479 137.105C63.0656 140.355 52.7216 140.355 46.3392 137.105L5.28537 116.186C2.09135 114.56 0.5 112.427 0.5 110.294Z"
+        d="M74.7525 76.4128C79.1428 78.6531 84.7974 78.4669 90.9597 75.3293C96.9188 72.2933 102.404 66.9774 106.727 60.5611L101.698 57.9993C97.3758 64.4155 91.8907 69.7313 85.9315 72.7673C79.7692 75.9049 74.115 76.0911 69.7246 73.8507L74.7525 76.4128Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M106.721 60.5611L71.22 35.438L66.1919 32.876L101.693 57.9992L106.721 60.5611Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M110.761 5.65368C105.395 2.9224 98.4873 3.14804 90.9537 6.97973C82.5341 11.2742 74.8877 19.2875 69.3067 28.8075C69.2954 28.8244 68.9059 29.4959 68.9002 29.5072C63.4377 39.078 60.0633 50.082 60.0633 60.3074C60.0633 71.8702 64.3802 80.0358 71.152 83.4838L66.1239 80.9218C59.3521 77.4738 55.0352 69.3082 55.0352 57.7454C55.0352 47.52 58.4098 36.516 63.8724 26.9452C63.878 26.9339 64.2673 26.2624 64.2785 26.2455C69.8596 16.7255 77.5063 8.71215 85.9258 4.41772C93.4594 0.580392 100.366 0.354749 105.733 3.09167L110.761 5.65368Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M90.9539 75.3238C77.021 82.4228 65.6782 74.404 65.6782 57.4464C65.6782 50.1949 67.7494 42.4638 71.22 35.4381L106.721 60.5556C102.398 66.9718 96.913 72.2878 90.9539 75.3238ZM110.694 53.7049L75.1928 28.5816C79.5154 22.1654 84.9947 16.8496 90.9539 13.8136C104.892 6.70888 116.229 14.7334 116.229 31.691C116.229 38.9481 114.158 46.6792 110.694 53.7049ZM90.9539 6.97969C82.5343 11.2741 74.8879 19.2875 69.3069 28.8074C69.2956 28.8244 68.9061 29.4959 68.9004 29.5072C63.4379 39.0779 60.0635 50.082 60.0635 60.3073C60.0635 81.0346 73.9229 90.8367 90.9539 82.1575C99.3678 77.8688 107.009 69.8669 112.579 60.3638C112.601 60.3356 112.973 59.6923 112.985 59.6641C118.464 50.082 121.845 39.0665 121.845 28.8299C121.845 8.10265 107.99 -1.69946 90.9539 6.97969Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M0.5 88.7768C0.5 90.91 2.097 93.0375 5.28537 94.6684L46.3392 115.587C52.7216 118.838 63.0656 118.838 69.4479 115.587L155.715 71.6331C158.903 70.0078 160.5 67.8804 160.5 65.7473V72.5585C160.5 74.6916 158.903 76.8191 155.715 78.4444L69.4479 122.399C63.0656 125.649 52.7216 125.649 46.3392 122.399L5.28537 101.48C2.09135 99.8543 0.5 97.7213 0.5 95.5882V88.7768Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M0.5 88.7767C0.5 86.6436 2.097 84.5162 5.28537 82.8909L91.5521 38.9366C97.9344 35.6862 108.278 35.6862 114.661 38.9366L155.715 59.8556C158.909 61.4808 160.5 63.6141 160.5 65.7472C160.5 67.8803 158.903 70.0077 155.715 71.6329L69.4479 115.587C63.0656 118.838 52.7216 118.838 46.3392 115.587L5.28537 94.6682C2.09135 93.043 0.5 90.9098 0.5 88.7767Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M79.0808 85.8819C76.1633 85.8819 73.4546 85.2611 71.0055 84.0366C70.966 84.0253 70.9323 84.0139 70.8928 83.9914L65.8646 81.4295C58.6245 77.7389 54.4712 69.1104 54.4712 57.7508C54.4712 47.7794 57.637 36.7415 63.3817 26.6685C63.3817 26.6685 63.7767 25.9856 63.805 25.9349C69.6625 15.9465 77.4276 8.11946 85.6666 3.91532C89.8651 1.77658 93.9562 0.693115 97.8162 0.693115C100.768 0.693115 103.516 1.33071 105.982 2.58913L111.004 5.14549C111.004 5.14549 111.038 5.16245 111.055 5.17373C118.267 8.87563 122.403 17.487 122.403 28.8297C122.403 38.8181 119.232 49.8674 113.47 59.946C113.385 60.1097 113.165 60.4878 113.064 60.6514C107.206 70.6511 99.4414 78.4668 91.2081 82.6653C87.0209 84.7984 82.9351 85.8819 79.0808 85.8819ZM72.6422 74.3473C73.7765 74.6351 74.9728 74.7875 76.2031 74.7875C79.1996 74.7875 82.3822 73.9409 85.6721 72.2649C91.1685 69.4659 96.5689 64.4606 100.914 58.1403L71.0903 37.0349C67.9189 43.8856 66.2427 50.9282 66.2427 57.4517C66.2427 64.9514 68.5114 70.9445 72.6422 74.353V74.3473ZM105.801 49.5513C108.967 42.6949 110.643 35.6466 110.643 29.1345C110.643 21.6404 108.375 15.6474 104.244 12.239C103.109 11.9455 101.907 11.7988 100.672 11.7988C97.6751 11.7988 94.4922 12.6452 91.2136 14.3212C85.7228 17.1202 80.328 22.1257 75.9771 28.446L105.801 49.5513Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M97.8215 1.25753C100.705 1.25753 103.369 1.88956 105.733 3.09155L110.761 5.65356C110.733 5.63663 110.699 5.6253 110.671 5.61402C117.494 9.0394 121.845 17.2219 121.845 28.8355C121.845 39.0721 118.464 50.0876 112.985 59.6696C112.973 59.6979 112.601 60.3412 112.579 60.3694C107.009 69.8724 99.3678 77.8743 90.9539 82.1631C86.7497 84.3075 82.7374 85.3177 79.0807 85.3177C76.0503 85.3177 73.2627 84.6235 70.8136 83.2974C70.9264 83.3595 71.0393 83.4329 71.1522 83.4893L66.1241 80.9273C59.3523 77.4737 55.0354 69.3137 55.0354 57.7509C55.0354 47.5255 58.41 36.5215 63.8726 26.9508C63.8782 26.9395 64.2675 26.2679 64.2788 26.251C69.8598 16.731 77.5065 8.71768 85.926 4.42326C90.1414 2.27886 94.1591 1.26318 97.8215 1.26318M102.85 3.81954C102.443 3.81954 102.031 3.83073 101.614 3.85894C102.031 3.83637 102.443 3.81954 102.85 3.81954ZM104.244 3.87024C103.894 3.84767 103.544 3.83083 103.188 3.82519C103.544 3.83083 103.894 3.84202 104.244 3.87024ZM101.247 3.89283C100.92 3.92105 100.587 3.94922 100.254 3.98872C100.587 3.94922 100.92 3.91541 101.247 3.89283H101.264C101.264 3.89283 101.253 3.89283 101.247 3.89283ZM105.096 3.96062C105.237 3.97755 105.372 3.99439 105.508 4.01132C105.372 3.99439 105.231 3.97755 105.096 3.96062C104.955 3.94369 104.819 3.93236 104.678 3.91543C104.819 3.92672 104.955 3.94369 105.096 3.96062ZM99.3114 4.1298C99.1647 4.15237 99.0179 4.18067 98.8656 4.20888C99.0123 4.18067 99.1647 4.15802 99.3114 4.1298ZM107.59 4.4402C107.471 4.40634 107.347 4.37817 107.229 4.34431C107.347 4.37253 107.471 4.40634 107.59 4.4402ZM96.2529 4.84649C96.1682 4.86906 96.0892 4.89735 96.0046 4.91992C96.0892 4.89171 96.1682 4.86906 96.2529 4.84649C96.4617 4.78442 96.6649 4.72809 96.8737 4.67166C96.6705 4.72809 96.4617 4.78442 96.2529 4.84649ZM108.803 4.82403C108.911 4.86354 109.018 4.90302 109.119 4.94252C109.012 4.90302 108.905 4.86354 108.803 4.82403C108.674 4.77889 108.549 4.73361 108.419 4.68847C108.549 4.73361 108.679 4.77325 108.803 4.82403ZM95.4064 5.1117C95.1073 5.20764 94.8138 5.32053 94.5147 5.42775C94.8138 5.31489 95.1129 5.20764 95.4064 5.1117C95.4064 5.1117 95.4063 5.1117 95.4119 5.1117C95.4119 5.1117 95.412 5.1117 95.4064 5.1117ZM110.287 5.4334C110.05 5.32054 109.808 5.20764 109.565 5.1117C109.808 5.21328 110.05 5.32618 110.287 5.4334ZM91.8568 6.53943C92.06 6.4435 92.2575 6.35321 92.455 6.26292C92.2575 6.35321 92.0543 6.4435 91.8568 6.53943ZM106.021 50.4035C109.272 43.5753 111.202 36.1377 111.202 29.1346C111.202 21.11 108.657 15.0945 104.503 11.7256C103.29 11.4039 102.009 11.2346 100.671 11.2346C97.6806 11.2346 94.3963 12.0641 90.9597 13.8135C85.0005 16.8495 79.5209 22.1653 75.1983 28.5816L106.027 50.3979M109.683 14.4061C109.745 14.4569 109.808 14.5075 109.87 14.564C109.808 14.5132 109.745 14.4569 109.683 14.4061C109.582 14.3214 109.475 14.2367 109.368 14.152C109.475 14.2367 109.576 14.3214 109.683 14.4061ZM110.705 15.3428C110.552 15.1904 110.394 15.038 110.236 14.8913C110.394 15.038 110.547 15.1904 110.705 15.3428ZM111.489 16.2062H111.495C111.495 16.2062 111.495 16.2062 111.489 16.2062C111.348 16.0369 111.202 15.8675 111.055 15.7039C111.202 15.8675 111.348 16.0313 111.489 16.2062ZM112.245 17.1768C112.104 16.9793 111.958 16.7818 111.811 16.5899C111.958 16.7761 112.104 16.9793 112.245 17.1768ZM112.996 18.3167C112.838 18.0571 112.68 17.8031 112.516 17.5548C112.686 17.8031 112.844 18.0571 112.996 18.3167ZM113.752 19.6823C113.566 19.3042 113.369 18.9375 113.165 18.5876C113.369 18.9431 113.566 19.3099 113.752 19.6823ZM114.65 21.7985C114.689 21.9001 114.723 22.0017 114.762 22.1089C114.728 22.0073 114.689 21.9001 114.65 21.7985C114.593 21.6461 114.537 21.4937 114.475 21.3414C114.531 21.4937 114.593 21.6461 114.65 21.7985ZM115.169 23.4294C115.095 23.1642 115.016 22.9102 114.932 22.6506C115.011 22.9046 115.095 23.1642 115.169 23.4294ZM115.423 24.4113C115.457 24.5468 115.485 24.6822 115.519 24.8176C115.49 24.6822 115.457 24.5468 115.423 24.4113C115.389 24.2759 115.355 24.1405 115.321 24.0107C115.355 24.1461 115.389 24.2759 115.423 24.4113ZM115.795 26.268C115.75 25.9858 115.699 25.7035 115.643 25.427C115.699 25.7035 115.744 25.9858 115.795 26.268ZM116.015 27.831C115.981 27.5206 115.942 27.2046 115.902 26.8999C115.947 27.2046 115.981 27.515 116.015 27.831ZM116.156 29.5071C116.134 29.1459 116.111 28.7904 116.077 28.4405C116.111 28.7904 116.134 29.1516 116.156 29.5071ZM116.23 31.6514C116.23 31.6514 116.23 31.6796 116.23 31.6909C116.23 31.6796 116.23 31.6627 116.23 31.6514C116.23 31.104 116.213 30.5623 116.19 30.0319C116.213 30.5623 116.23 31.0984 116.23 31.6514ZM76.2029 75.3519C79.1994 75.3519 82.4837 74.5224 85.926 72.7673C91.8852 69.7313 97.3703 64.4155 101.693 57.9993L70.8643 36.1885C67.6082 43.0167 65.6782 50.4543 65.6782 57.4518C65.6782 65.482 68.2234 71.4976 72.3767 74.8666C73.5843 75.1882 74.8653 75.3519 76.1971 75.3519M60.1536 62.9821C60.1423 62.7677 60.1198 62.5533 60.1142 62.3388C60.1255 62.5589 60.1423 62.7677 60.1536 62.9821ZM60.2498 64.3026C60.2723 64.5453 60.3003 64.788 60.3286 65.0306C60.3003 64.788 60.2723 64.5509 60.2498 64.3026C60.2498 64.3026 60.2498 64.297 60.2498 64.2913C60.2498 64.2913 60.2498 64.297 60.2498 64.3026ZM60.5939 66.9153C60.5544 66.667 60.5093 66.4188 60.4754 66.1705C60.5093 66.4245 60.5544 66.6727 60.5939 66.9153ZM60.9381 68.71C60.8873 68.4673 60.8308 68.2246 60.7857 67.982C60.8365 68.2303 60.8873 68.4729 60.9381 68.71ZM61.3613 70.4029C61.2992 70.1772 61.2371 69.9458 61.175 69.7088C61.2371 69.9402 61.2936 70.1715 61.3613 70.4029ZM63.0939 74.9851C63.0375 74.8666 62.9809 74.7368 62.9245 74.6183C62.9809 74.7425 63.0318 74.8666 63.0939 74.9851ZM89.3232 76.0854C89.4586 76.029 89.5941 75.9727 89.7238 75.9106C89.5884 75.9727 89.453 76.0234 89.3232 76.0854ZM63.9627 76.5765C63.9176 76.4975 63.8669 76.4241 63.8161 76.3451C63.8613 76.4241 63.9119 76.4975 63.9627 76.5765ZM88.5104 76.4241C88.3918 76.4692 88.2735 76.5144 88.1607 76.5539C88.2792 76.5087 88.3975 76.4692 88.5104 76.4241ZM75.1476 76.5934C75.0404 76.5426 74.933 76.4975 74.8257 76.4467C74.933 76.4975 75.0404 76.5483 75.1476 76.5934ZM76.1012 76.9997C75.9771 76.9546 75.8473 76.9038 75.7232 76.853C75.8473 76.9038 75.9714 76.9489 76.1012 76.9997ZM87.066 76.9376C86.9869 76.9658 86.9022 76.9884 86.8232 77.011C86.9022 76.9884 86.9869 76.9601 87.066 76.9376ZM76.9025 77.2762C76.8235 77.2536 76.7388 77.2255 76.6598 77.1973C76.7388 77.2255 76.8235 77.248 76.9025 77.2762ZM78.0537 77.5753C77.9127 77.5471 77.7715 77.5133 77.636 77.4738C77.7771 77.5076 77.9127 77.5415 78.0537 77.5753ZM64.6174 77.6092C64.7133 77.7446 64.8094 77.8744 64.9053 78.0098C64.8094 77.8744 64.7077 77.7446 64.6174 77.6092C64.6174 77.6092 64.6174 77.6092 64.6174 77.6035C64.6174 77.6035 64.6174 77.6036 64.6174 77.6092ZM78.9002 77.7333C78.951 77.7446 79.0073 77.7503 79.0581 77.7559C79.0073 77.7503 78.951 77.739 78.9002 77.7333C78.8099 77.7164 78.7253 77.7051 78.6406 77.6881C78.7253 77.7051 78.8156 77.7164 78.9002 77.7333ZM83.776 77.7107C83.6292 77.7333 83.4825 77.7558 83.3414 77.7727C83.4881 77.7558 83.6349 77.7277 83.776 77.7107ZM79.8145 77.8405C79.775 77.8405 79.741 77.8349 79.7015 77.8292C79.741 77.8292 79.775 77.8349 79.8145 77.8405ZM82.2296 77.8801C82.3425 77.8744 82.4554 77.8575 82.5683 77.8518C82.4554 77.8631 82.3425 77.8744 82.2296 77.8801ZM81.152 77.9138C81.0617 77.9138 80.9768 77.9083 80.8921 77.9026C80.9768 77.9026 81.0673 77.9138 81.152 77.9138ZM65.6556 78.9917C65.5936 78.9184 65.5374 78.8506 65.481 78.7772C65.5374 78.8506 65.5992 78.924 65.6556 78.9917ZM66.8069 80.2727C66.6714 80.1373 66.5418 80.0019 66.412 79.8608C66.5418 80.0019 66.6771 80.1373 66.8069 80.2727ZM67.4109 80.8596C67.5519 80.9894 67.6872 81.1135 67.8283 81.2377C67.6872 81.1135 67.5463 80.9894 67.4109 80.8596C67.4109 80.8596 67.4107 80.8596 67.4051 80.854C67.4051 80.854 67.4052 80.854 67.4109 80.8596ZM68.7991 82.0164C68.6862 81.9317 68.5788 81.8471 68.4659 81.7568C68.5788 81.8415 68.6862 81.9317 68.7991 82.0164ZM69.9164 82.7783C69.9615 82.8065 70.001 82.8346 70.0462 82.8572C70.001 82.829 69.9615 82.8008 69.9164 82.7783ZM97.8215 0.128906C93.8657 0.128906 89.6956 1.235 85.4124 3.41325C77.0775 7.66253 69.2278 15.5685 63.3025 25.6754C63.2066 25.8334 62.9696 26.251 62.8906 26.3864C57.0951 36.5384 53.9067 47.6779 53.9067 57.7452C53.9067 69.325 58.1731 78.1396 65.6107 81.9318L70.6386 84.4938V84.4825C73.2006 85.7861 76.0334 86.4463 79.0807 86.4463C83.0309 86.4463 87.1956 85.3402 91.4675 83.1676C99.7968 78.924 107.641 71.0293 113.555 60.9394C113.673 60.7475 113.865 60.4202 113.967 60.2283C119.774 50.0707 122.973 38.9198 122.973 28.8355C122.973 17.2501 118.707 8.44126 111.269 4.65471L106.241 2.08706C103.691 0.789137 100.858 0.128906 97.816 0.128906H97.8215ZM76.7559 28.305C80.9996 22.2725 86.1912 17.5098 91.4675 14.818C94.6671 13.1871 97.7653 12.3575 100.671 12.3575C101.817 12.3575 102.929 12.4873 103.978 12.7469C107.912 16.0594 110.073 21.8606 110.073 29.1233C110.073 35.3646 108.515 42.1026 105.564 48.6881L76.7501 28.2994L76.7559 28.305ZM72.9016 73.8338C68.9684 70.527 66.8069 64.7202 66.8069 57.4518C66.8069 51.2105 68.3644 44.4726 71.3214 37.8927L100.135 58.2758C95.8916 64.3027 90.6999 69.0711 85.4179 71.7628C82.2126 73.3937 79.1146 74.2233 76.2084 74.2233C75.0685 74.2233 73.9624 74.0934 72.9071 73.8338H72.9016Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M110.693 53.7047C114.158 46.679 116.229 38.9479 116.229 31.6909C116.229 22.233 112.702 15.5516 107.161 12.7244L102.133 10.1624C107.674 12.9839 111.202 19.6653 111.202 29.1289C111.202 36.3859 109.13 44.117 105.666 51.1427L110.693 53.7047Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M74.7525 76.4128C79.1428 78.6531 84.7974 78.4669 90.9597 75.3293C96.9188 72.2933 102.404 66.9774 106.727 60.5611L101.698 57.9993C97.3758 64.4155 91.8907 69.7313 85.9315 72.7673C79.7692 75.9049 74.115 76.0911 69.7246 73.8507L74.7525 76.4128Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M106.721 60.5611L71.22 35.438L66.1919 32.876L101.693 57.9992L106.721 60.5611Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M110.761 5.65368C105.395 2.9224 98.4873 3.14804 90.9537 6.97973C82.5341 11.2742 74.8877 19.2875 69.3067 28.8075C69.2954 28.8244 68.9059 29.4959 68.9002 29.5072C63.4377 39.078 60.0633 50.082 60.0633 60.3074C60.0633 71.8702 64.3802 80.0358 71.152 83.4838L66.1239 80.9218C59.3521 77.4738 55.0352 69.3082 55.0352 57.7454C55.0352 47.52 58.4098 36.516 63.8724 26.9452C63.878 26.9339 64.2673 26.2624 64.2785 26.2455C69.8596 16.7255 77.5063 8.71215 85.9258 4.41772C93.4594 0.580392 100.366 0.354749 105.733 3.09167L110.761 5.65368Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M90.9539 75.3238C77.021 82.4228 65.6782 74.404 65.6782 57.4464C65.6782 50.1949 67.7494 42.4638 71.22 35.4381L106.721 60.5556C102.398 66.9718 96.913 72.2878 90.9539 75.3238ZM110.694 53.7049L75.1928 28.5816C79.5154 22.1654 84.9947 16.8496 90.9539 13.8136C104.892 6.70888 116.229 14.7334 116.229 31.691C116.229 38.9481 114.158 46.6792 110.694 53.7049ZM90.9539 6.97969C82.5343 11.2741 74.8879 19.2875 69.3069 28.8074C69.2956 28.8244 68.9061 29.4959 68.9004 29.5072C63.4379 39.0779 60.0635 50.082 60.0635 60.3073C60.0635 81.0346 73.9229 90.8367 90.9539 82.1575C99.3678 77.8688 107.009 69.8669 112.579 60.3638C112.601 60.3356 112.973 59.6923 112.985 59.6641C118.464 50.082 121.845 39.0665 121.845 28.8299C121.845 8.10265 107.99 -1.69946 90.9539 6.97969Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M88.9565 64.3195C88.697 64.3195 88.4431 64.3139 88.1892 64.3026C88.0311 64.297 87.8788 64.2575 87.7433 64.1841L82.7152 61.6221C82.2976 61.4077 82.055 60.9393 82.0663 60.3694C82.1566 53.4339 86.6033 45.573 92.1675 42.2548L89.2445 40.7651C87.7378 39.9976 86.8743 38.2369 86.8743 35.9345C86.8743 31.8771 89.6 27.182 92.9464 25.4778C93.7985 25.0433 94.6337 24.8232 95.4293 24.8232C96.0557 24.8232 96.6369 24.9587 97.1617 25.2295L102.19 27.7915C103.697 28.559 104.56 30.3196 104.56 32.622C104.56 35.7483 102.963 39.2922 100.599 41.5494L105.277 43.9308C107.827 45.2287 109.317 48.2309 109.368 52.1642C109.379 52.7737 109.103 53.4508 108.657 53.9248C105.452 57.3502 102.032 59.9969 98.4879 61.7914C95.1979 63.4674 91.9871 64.3195 88.9623 64.3195H88.9565Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M95.4233 25.3877C95.9594 25.3877 96.4617 25.5061 96.9019 25.7318L101.93 28.2938C103.194 28.9371 103.995 30.4607 103.995 32.6221C103.995 35.9346 102.11 39.6647 99.5711 41.6963C99.7121 41.7527 99.8533 41.8035 99.9888 41.8712L105.017 44.4332C107.291 45.5901 108.753 48.3101 108.803 52.17C108.809 52.6327 108.589 53.1688 108.245 53.5412C105.101 56.8932 101.687 59.5399 98.2336 61.2949C94.9493 62.9709 91.8175 63.761 88.9621 63.761C88.7138 63.761 88.4654 63.7553 88.2228 63.744C88.1438 63.744 88.0705 63.7214 88.0084 63.6876L82.9803 61.1255C82.7602 61.0127 82.6305 60.7476 82.6361 60.3864C82.7264 53.2365 87.5344 45.116 93.3694 42.2549C93.3694 42.2549 93.375 42.2549 93.3807 42.2549L89.5038 40.2798C88.2397 39.6365 87.4383 38.1129 87.4383 35.9516C87.4383 32.0748 90.0173 27.6166 93.2057 25.997C93.9958 25.5964 94.7463 25.4046 95.4291 25.4046M95.4233 24.259C94.5373 24.259 93.6177 24.5017 92.6866 24.9757C89.1088 26.7985 86.3042 31.612 86.3042 35.9346C86.3042 38.4571 87.2804 40.3983 88.9847 41.2674L91.0331 42.3114C85.7116 45.9851 81.5864 53.6033 81.5017 60.3582C81.4904 61.1482 81.8517 61.8084 82.4612 62.1187L87.4893 64.6808C87.6981 64.788 87.9238 64.8444 88.1608 64.8614C88.426 64.8727 88.6911 64.8783 88.9563 64.8783C92.0769 64.8783 95.3671 64.0092 98.7417 62.2881C102.336 60.4597 105.813 57.7736 109.063 54.3031C109.605 53.7218 109.938 52.8979 109.926 52.1474C109.875 47.9997 108.267 44.8226 105.525 43.4231L101.535 41.3915C103.696 39.0327 105.124 35.6411 105.124 32.6221C105.124 30.0996 104.148 28.1584 102.444 27.2893L97.4155 24.7273C96.8117 24.4169 96.14 24.259 95.4233 24.259Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M105.011 44.4331C103.216 43.5189 100.908 43.5697 98.3914 44.8112C92.5564 47.6722 87.7485 55.7928 87.6582 62.9426C87.6582 63.3038 87.7823 63.5746 88.0023 63.6818L82.9745 61.1198C82.7544 61.0069 82.6244 60.7361 82.6301 60.3806C82.7203 53.2308 87.5283 45.1102 93.3633 42.2491C95.8858 41.0133 98.1882 40.9569 99.9827 41.8711L105.011 44.4331Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M105.011 44.4331C107.285 45.5899 108.747 48.3099 108.798 52.1698C108.803 52.6325 108.583 53.1686 108.239 53.541C105.096 56.8931 101.682 59.5397 98.228 61.2947C94.6559 63.1118 91.2642 63.8962 88.2169 63.7439C88.1379 63.7439 88.0646 63.7212 88.0025 63.6874C87.7825 63.5745 87.6527 63.3038 87.6584 62.9482C87.7487 55.7984 92.5566 47.6778 98.3916 44.8168C100.914 43.5809 103.217 43.5245 105.011 44.4387V44.4331Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M101.93 28.2937C100.925 27.7858 99.6387 27.8253 98.2279 28.5419C95.0451 30.1672 92.4605 34.6197 92.4605 38.4965C92.4605 40.6578 93.2619 42.1814 94.5259 42.8247L89.4978 40.2627C88.2338 39.6194 87.4326 38.0958 87.4326 35.9345C87.4326 32.0577 90.0114 27.5996 93.1997 25.9801C94.6105 25.2634 95.9028 25.2181 96.9017 25.7317L101.93 28.2937Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M101.93 28.2937C103.194 28.937 103.995 30.4606 103.995 32.622C103.995 36.4988 101.416 40.957 98.2279 42.5765C96.8171 43.2932 95.5248 43.3383 94.5259 42.8248C93.2619 42.1815 92.4604 40.6579 92.4604 38.4966C92.4604 34.6197 95.0395 30.1616 98.2279 28.542C99.6386 27.8253 100.931 27.7802 101.93 28.2937Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M88.9565 64.3195C88.697 64.3195 88.4431 64.3139 88.1892 64.3026C88.0311 64.297 87.8788 64.2575 87.7433 64.1841L82.7152 61.6221C82.2976 61.4077 82.055 60.9393 82.0663 60.3694C82.1566 53.4339 86.6033 45.573 92.1675 42.2548L89.2445 40.7651C87.7378 39.9976 86.8743 38.2369 86.8743 35.9345C86.8743 31.8771 89.6 27.182 92.9464 25.4778C93.7985 25.0433 94.6337 24.8232 95.4293 24.8232C96.0557 24.8232 96.6369 24.9587 97.1617 25.2295L102.19 27.7915C103.697 28.559 104.56 30.3196 104.56 32.622C104.56 35.7483 102.963 39.2922 100.599 41.5494L105.277 43.9308C107.827 45.2287 109.317 48.2309 109.368 52.1642C109.379 52.7737 109.103 53.4508 108.657 53.9248C105.452 57.3502 102.032 59.9969 98.4879 61.7914C95.1979 63.4674 91.9871 64.3195 88.9623 64.3195H88.9565Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M95.4233 25.3877C95.9594 25.3877 96.4617 25.5061 96.9019 25.7318L101.93 28.2938C103.194 28.9371 103.995 30.4607 103.995 32.6221C103.995 35.9346 102.11 39.6647 99.5711 41.6963C99.7121 41.7527 99.8533 41.8035 99.9888 41.8712L105.017 44.4332C107.291 45.5901 108.753 48.3101 108.803 52.17C108.809 52.6327 108.589 53.1688 108.245 53.5412C105.101 56.8932 101.687 59.5399 98.2336 61.2949C94.9493 62.9709 91.8175 63.761 88.9621 63.761C88.7138 63.761 88.4654 63.7553 88.2228 63.744C88.1438 63.744 88.0705 63.7214 88.0084 63.6876L82.9803 61.1255C82.7602 61.0127 82.6305 60.7476 82.6361 60.3864C82.7264 53.2365 87.5344 45.116 93.3694 42.2549C93.3694 42.2549 93.375 42.2549 93.3807 42.2549L89.5038 40.2798C88.2397 39.6365 87.4383 38.1129 87.4383 35.9516C87.4383 32.0748 90.0173 27.6166 93.2057 25.997C93.9958 25.5964 94.7463 25.4046 95.4291 25.4046M95.4233 24.259C94.5373 24.259 93.6177 24.5017 92.6866 24.9757C89.1088 26.7985 86.3042 31.612 86.3042 35.9346C86.3042 38.4571 87.2804 40.3983 88.9847 41.2674L91.0331 42.3114C85.7116 45.9851 81.5864 53.6033 81.5017 60.3582C81.4904 61.1482 81.8517 61.8084 82.4612 62.1187L87.4893 64.6808C87.6981 64.788 87.9238 64.8444 88.1608 64.8614C88.426 64.8727 88.6911 64.8783 88.9563 64.8783C92.0769 64.8783 95.3671 64.0092 98.7417 62.2881C102.336 60.4597 105.813 57.7736 109.063 54.3031C109.605 53.7218 109.938 52.8979 109.926 52.1474C109.875 47.9997 108.267 44.8226 105.525 43.4231L101.535 41.3915C103.696 39.0327 105.124 35.6411 105.124 32.6221C105.124 30.0996 104.148 28.1584 102.444 27.2893L97.4155 24.7273C96.8117 24.4169 96.14 24.259 95.4233 24.259Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M105.011 44.4331C103.216 43.5189 100.908 43.5697 98.3914 44.8112C92.5564 47.6722 87.7485 55.7928 87.6582 62.9426C87.6582 63.3038 87.7823 63.5746 88.0023 63.6818L82.9745 61.1198C82.7544 61.0069 82.6244 60.7361 82.6301 60.3806C82.7203 53.2308 87.5283 45.1102 93.3633 42.2491C95.8858 41.0133 98.1882 40.9569 99.9827 41.8711L105.011 44.4331Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M105.011 44.4331C107.285 45.5899 108.747 48.3099 108.798 52.1698C108.803 52.6325 108.583 53.1686 108.239 53.541C105.096 56.8931 101.682 59.5397 98.228 61.2947C94.6559 63.1118 91.2642 63.8962 88.2169 63.7439C88.1379 63.7439 88.0646 63.7212 88.0025 63.6874C87.7825 63.5745 87.6527 63.3038 87.6584 62.9482C87.7487 55.7984 92.5566 47.6778 98.3916 44.8168C100.914 43.5809 103.217 43.5245 105.011 44.4387V44.4331Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M101.93 28.2937C100.925 27.7858 99.6387 27.8253 98.2279 28.5419C95.0451 30.1672 92.4605 34.6197 92.4605 38.4965C92.4605 40.6578 93.2619 42.1814 94.5259 42.8247L89.4978 40.2627C88.2338 39.6194 87.4326 38.0958 87.4326 35.9345C87.4326 32.0577 90.0114 27.5996 93.1997 25.9801C94.6105 25.2634 95.9028 25.2181 96.9017 25.7317L101.93 28.2937Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M101.93 28.2937C103.194 28.937 103.995 30.4606 103.995 32.622C103.995 36.4988 101.416 40.957 98.2279 42.5765C96.8171 43.2932 95.5248 43.3383 94.5259 42.8248C93.2619 42.1815 92.4604 40.6579 92.4604 38.4966C92.4604 34.6197 95.0395 30.1616 98.2279 28.542C99.6386 27.8253 100.931 27.7802 101.93 28.2937Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/page.tsx b/packages/propel/src/empty-state/assets/vertical-stack/page.tsx
index b93cc5ec1..d790f529c 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/page.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/page.tsx
@@ -1,62 +1,20 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const PageVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="177"
-    viewBox="0 0 162 177"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M15.0958 52.8764C13.8691 52.2518 12.2935 52.3024 10.566 53.1859C6.66646 55.1722 3.50967 60.6305 3.50967 65.3685C3.50967 68.0132 4.4944 69.8814 6.04185 70.6692L3.53218 69.3918C1.98474 68.604 1 66.7359 1 64.0911C1 59.3475 4.1624 53.8893 8.05633 51.9085C9.77821 51.0307 11.3594 50.9744 12.5861 51.5991L15.0958 52.8764Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M15.0957 52.8766C16.6432 53.6644 17.6279 55.5326 17.6279 58.1773C17.6279 62.921 14.4655 68.3792 10.5715 70.3599C8.84966 71.2378 7.26846 71.294 6.04176 70.6694C4.49432 69.8816 3.50958 68.0135 3.50958 65.3687C3.50958 60.6251 6.672 55.1669 10.5659 53.1861C12.2878 52.3083 13.869 52.252 15.0957 52.8766Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M12.2541 62.4879C12.451 62.1503 12.7155 61.8802 12.9969 61.7339L14.5837 60.9236C14.775 60.8279 14.9326 60.9348 14.9326 61.1712C14.9326 61.4075 14.775 61.6776 14.5837 61.7733L12.9969 62.5836C12.9068 62.6286 12.8168 62.7186 12.7493 62.8368C12.6818 62.955 12.648 63.0787 12.648 63.1913V65.1214C12.648 65.3577 12.4904 65.6278 12.2991 65.7235C12.1078 65.8191 11.9502 65.7122 11.9502 65.4759V63.5458C11.9502 63.2082 12.0628 62.8255 12.2597 62.4879H12.2541Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M9.50252 58.5546C9.69384 58.4589 9.85139 58.5658 9.85139 58.8022V59.5112C9.85139 59.7363 9.92455 59.9163 10.054 60.0064C10.1834 60.0964 10.3635 60.0964 10.5492 60.0064C10.8249 59.8657 11.095 59.8657 11.2919 60.0064C11.4889 60.147 11.6014 60.4115 11.6014 60.7548C11.6014 60.9855 11.759 61.098 11.9503 61.0024C12.0403 60.9573 12.1304 60.8673 12.1979 60.7491C12.2654 60.6366 12.2992 60.5072 12.2992 60.3946C12.2992 59.6913 12.7719 58.8753 13.3458 58.5827L14.4543 58.02C14.6457 57.9244 14.8032 58.0313 14.8032 58.2676C14.8032 58.5039 14.6457 58.774 14.4543 58.8697L13.3458 59.4324C13.1545 59.5281 12.9969 59.8038 12.9969 60.0345C12.9969 60.3721 12.8844 60.7548 12.6874 61.0924C12.4905 61.43 12.226 61.7001 11.9447 61.8464C11.3651 62.139 10.898 61.807 10.898 61.1036C10.898 60.9911 10.8587 60.9011 10.7968 60.8561C10.7349 60.811 10.6448 60.811 10.5492 60.8561C10.1778 61.0474 9.82326 61.0474 9.55879 60.8561C9.29432 60.6704 9.14801 60.3102 9.14801 59.8601V59.1511C9.14801 58.9147 9.30557 58.6446 9.49689 58.549L9.50252 58.5546Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M7.42047 63.2983C7.42047 63.062 7.57803 62.7919 7.76935 62.6962L8.79909 62.1729C9.07482 62.0322 9.34492 62.0322 9.54187 62.1729C9.73882 62.3136 9.85135 62.578 9.85135 62.9213V63.3489C9.85135 63.4615 9.89075 63.5515 9.95265 63.5965C10.0202 63.6416 10.1046 63.6416 10.2002 63.5965C10.476 63.4559 10.7461 63.4559 10.943 63.5965C11.14 63.7372 11.2525 64.0017 11.2525 64.3449V66.0274C11.2525 66.2638 11.0949 66.5339 10.9036 66.6295C10.7123 66.7252 10.5547 66.6183 10.5547 66.3819V64.6994C10.5547 64.5869 10.5153 64.4969 10.4535 64.4519C10.3859 64.4068 10.3015 64.4068 10.2059 64.4519C9.93013 64.5925 9.66003 64.5925 9.46308 64.4519C9.26614 64.3112 9.1536 64.0467 9.1536 63.7035V63.2758C9.1536 63.1633 9.11422 63.0732 9.05232 63.0282C8.98479 62.9832 8.90039 62.9832 8.80473 63.0282L7.77496 63.5515C7.58364 63.6472 7.42609 63.5403 7.42609 63.3039L7.42047 63.2983Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M11.2469 57.9466C9.50811 58.8301 8.10135 61.2666 8.10135 63.3824C8.10135 65.4981 9.50811 66.4941 11.2469 65.6107C12.9856 64.7272 14.3924 62.2907 14.3924 60.1749C14.3924 58.0591 12.9856 57.0632 11.2469 57.9466ZM7.40359 63.7369C7.40359 61.154 9.12548 58.1773 11.2525 57.0969C13.3795 56.0165 15.1014 57.232 15.1014 59.8204C15.1014 62.4089 13.3795 65.38 11.2525 66.4604C9.12548 67.5408 7.40359 66.3253 7.40359 63.7369Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <g opacity="0.2">
+export function PageVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="177"
+      viewBox="0 0 162 177"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
       <path
-        d="M1.45563 140.366C1.45563 142.493 3.04808 144.614 6.22737 146.241L47.1643 167.1C53.5285 170.341 63.8429 170.341 70.2071 167.1L156.228 123.271C159.407 121.65 161 119.529 161 117.402V124.194C161 126.321 159.407 128.442 156.228 130.063L70.2071 173.892C63.8429 177.133 53.5285 177.133 47.1643 173.892L6.22737 153.033C3.04245 151.412 1.45563 149.285 1.45563 147.158V140.366Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M15.0958 52.8764C13.8691 52.2518 12.2935 52.3024 10.566 53.1859C6.66646 55.1722 3.50967 60.6305 3.50967 65.3685C3.50967 68.0132 4.4944 69.8814 6.04185 70.6692L3.53218 69.3918C1.98474 68.604 1 66.7359 1 64.0911C1 59.3475 4.1624 53.8893 8.05633 51.9085C9.77821 51.0307 11.3594 50.9744 12.5861 51.5991L15.0958 52.8764Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -64,17 +22,77 @@ export const PageVerticalStackIllustration = ({ className }: TIllustrationAssetP
         strokeLinejoin="round"
       />
       <path
-        d="M1.45569 140.366C1.45569 138.239 3.04814 136.118 6.22743 134.497L92.2484 90.6678C98.6126 87.4266 108.927 87.4266 115.291 90.6678L156.228 111.527C159.413 113.148 161 115.275 161 117.402C161 119.529 159.407 121.65 156.228 123.271L70.2072 167.1C63.843 170.341 53.5286 170.341 47.1644 167.1L6.22743 146.241C3.04251 144.62 1.45569 142.493 1.45569 140.366Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M15.0957 52.8766C16.6432 53.6644 17.6279 55.5326 17.6279 58.1773C17.6279 62.921 14.4655 68.3792 10.5715 70.3599C8.84966 71.2378 7.26846 71.294 6.04176 70.6694C4.49432 69.8816 3.50958 68.0135 3.50958 65.3687C3.50958 60.6251 6.672 55.1669 10.5659 53.1861C12.2878 52.3083 13.869 52.252 15.0957 52.8766Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M1.45563 118.91C1.45563 121.037 3.04808 123.159 6.22737 124.785L47.1643 145.644C53.5285 148.886 63.8429 148.886 70.2071 145.644L156.228 101.815C159.407 100.195 161 98.0732 161 95.9462V102.738C161 104.865 159.407 106.986 156.228 108.607L70.2071 152.436C63.8429 155.677 53.5285 155.677 47.1643 152.436L6.22737 131.577C3.04245 129.956 1.45563 127.829 1.45563 125.702V118.91Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M12.2541 62.4879C12.451 62.1503 12.7155 61.8802 12.9969 61.7339L14.5837 60.9236C14.775 60.8279 14.9326 60.9348 14.9326 61.1712C14.9326 61.4075 14.775 61.6776 14.5837 61.7733L12.9969 62.5836C12.9068 62.6286 12.8168 62.7186 12.7493 62.8368C12.6818 62.955 12.648 63.0787 12.648 63.1913V65.1214C12.648 65.3577 12.4904 65.6278 12.2991 65.7235C12.1078 65.8191 11.9502 65.7122 11.9502 65.4759V63.5458C11.9502 63.2082 12.0628 62.8255 12.2597 62.4879H12.2541Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M9.50252 58.5546C9.69384 58.4589 9.85139 58.5658 9.85139 58.8022V59.5112C9.85139 59.7363 9.92455 59.9163 10.054 60.0064C10.1834 60.0964 10.3635 60.0964 10.5492 60.0064C10.8249 59.8657 11.095 59.8657 11.2919 60.0064C11.4889 60.147 11.6014 60.4115 11.6014 60.7548C11.6014 60.9855 11.759 61.098 11.9503 61.0024C12.0403 60.9573 12.1304 60.8673 12.1979 60.7491C12.2654 60.6366 12.2992 60.5072 12.2992 60.3946C12.2992 59.6913 12.7719 58.8753 13.3458 58.5827L14.4543 58.02C14.6457 57.9244 14.8032 58.0313 14.8032 58.2676C14.8032 58.5039 14.6457 58.774 14.4543 58.8697L13.3458 59.4324C13.1545 59.5281 12.9969 59.8038 12.9969 60.0345C12.9969 60.3721 12.8844 60.7548 12.6874 61.0924C12.4905 61.43 12.226 61.7001 11.9447 61.8464C11.3651 62.139 10.898 61.807 10.898 61.1036C10.898 60.9911 10.8587 60.9011 10.7968 60.8561C10.7349 60.811 10.6448 60.811 10.5492 60.8561C10.1778 61.0474 9.82326 61.0474 9.55879 60.8561C9.29432 60.6704 9.14801 60.3102 9.14801 59.8601V59.1511C9.14801 58.9147 9.30557 58.6446 9.49689 58.549L9.50252 58.5546Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M7.42047 63.2983C7.42047 63.062 7.57803 62.7919 7.76935 62.6962L8.79909 62.1729C9.07482 62.0322 9.34492 62.0322 9.54187 62.1729C9.73882 62.3136 9.85135 62.578 9.85135 62.9213V63.3489C9.85135 63.4615 9.89075 63.5515 9.95265 63.5965C10.0202 63.6416 10.1046 63.6416 10.2002 63.5965C10.476 63.4559 10.7461 63.4559 10.943 63.5965C11.14 63.7372 11.2525 64.0017 11.2525 64.3449V66.0274C11.2525 66.2638 11.0949 66.5339 10.9036 66.6295C10.7123 66.7252 10.5547 66.6183 10.5547 66.3819V64.6994C10.5547 64.5869 10.5153 64.4969 10.4535 64.4519C10.3859 64.4068 10.3015 64.4068 10.2059 64.4519C9.93013 64.5925 9.66003 64.5925 9.46308 64.4519C9.26614 64.3112 9.1536 64.0467 9.1536 63.7035V63.2758C9.1536 63.1633 9.11422 63.0732 9.05232 63.0282C8.98479 62.9832 8.90039 62.9832 8.80473 63.0282L7.77496 63.5515C7.58364 63.6472 7.42609 63.5403 7.42609 63.3039L7.42047 63.2983Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M11.2469 57.9466C9.50811 58.8301 8.10135 61.2666 8.10135 63.3824C8.10135 65.4981 9.50811 66.4941 11.2469 65.6107C12.9856 64.7272 14.3924 62.2907 14.3924 60.1749C14.3924 58.0591 12.9856 57.0632 11.2469 57.9466ZM7.40359 63.7369C7.40359 61.154 9.12548 58.1773 11.2525 57.0969C13.3795 56.0165 15.1014 57.232 15.1014 59.8204C15.1014 62.4089 13.3795 65.38 11.2525 66.4604C9.12548 67.5408 7.40359 66.3253 7.40359 63.7369Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <g opacity="0.2">
+        <path
+          d="M1.45563 140.366C1.45563 142.493 3.04808 144.614 6.22737 146.241L47.1643 167.1C53.5285 170.341 63.8429 170.341 70.2071 167.1L156.228 123.271C159.407 121.65 161 119.529 161 117.402V124.194C161 126.321 159.407 128.442 156.228 130.063L70.2071 173.892C63.8429 177.133 53.5285 177.133 47.1643 173.892L6.22737 153.033C3.04245 151.412 1.45563 149.285 1.45563 147.158V140.366Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1.45569 140.366C1.45569 138.239 3.04814 136.118 6.22743 134.497L92.2484 90.6678C98.6126 87.4266 108.927 87.4266 115.291 90.6678L156.228 111.527C159.413 113.148 161 115.275 161 117.402C161 119.529 159.407 121.65 156.228 123.271L70.2072 167.1C63.843 170.341 53.5286 170.341 47.1644 167.1L6.22743 146.241C3.04251 144.62 1.45569 142.493 1.45569 140.366Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M1.45563 118.91C1.45563 121.037 3.04808 123.159 6.22737 124.785L47.1643 145.644C53.5285 148.886 63.8429 148.886 70.2071 145.644L156.228 101.815C159.407 100.195 161 98.0732 161 95.9462V102.738C161 104.865 159.407 106.986 156.228 108.607L70.2071 152.436C63.8429 155.677 53.5285 155.677 47.1643 152.436L6.22737 131.577C3.04245 129.956 1.45563 127.829 1.45563 125.702V118.91Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1.45569 118.91C1.45569 116.783 3.04814 114.662 6.22743 113.041L92.2484 69.2119C98.6126 65.9707 108.927 65.9707 115.291 69.2119L156.228 90.0714C159.413 91.692 161 93.8191 161 95.9461C161 98.0731 159.407 100.195 156.228 101.815L70.2072 145.644C63.843 148.886 53.5286 148.886 47.1644 145.644L6.22743 124.785C3.04251 123.164 1.45569 121.037 1.45569 118.91Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <path
+        d="M1.45569 97.4541C1.45569 99.5811 3.04814 101.702 6.22743 103.329L47.1644 124.188C53.5286 127.429 63.843 127.429 70.2072 124.188L156.228 80.359C159.407 78.7384 161 76.617 161 74.49V81.2819C161 83.4089 159.407 85.5303 156.228 87.1509L70.2072 130.98C63.843 134.221 53.5286 134.221 47.1644 130.98L6.22743 110.121C3.04251 108.5 1.45569 106.373 1.45569 104.246V97.4541Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -82,176 +100,160 @@ export const PageVerticalStackIllustration = ({ className }: TIllustrationAssetP
         strokeLinejoin="round"
       />
       <path
-        d="M1.45569 118.91C1.45569 116.783 3.04814 114.662 6.22743 113.041L92.2484 69.2119C98.6126 65.9707 108.927 65.9707 115.291 69.2119L156.228 90.0714C159.413 91.692 161 93.8191 161 95.9461C161 98.0731 159.407 100.195 156.228 101.815L70.2072 145.644C63.843 148.886 53.5286 148.886 47.1644 145.644L6.22743 124.785C3.04251 123.164 1.45569 121.037 1.45569 118.91Z"
+        d="M1.45575 97.454C1.45575 95.327 3.0482 93.2056 6.22749 91.585L92.2485 47.7557C98.6127 44.5145 108.927 44.5145 115.291 47.7557L156.228 68.6153C159.413 70.2359 161 72.3629 161 74.4899C161 76.617 159.408 78.7384 156.228 80.359L70.2073 124.188C63.8431 127.429 53.5286 127.429 47.1644 124.188L6.22749 103.329C3.04257 101.708 1.45575 99.581 1.45575 97.454Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M1.45569 97.4541C1.45569 99.5811 3.04814 101.702 6.22743 103.329L47.1644 124.188C53.5286 127.429 63.843 127.429 70.2072 124.188L156.228 80.359C159.407 78.7384 161 76.617 161 74.49V81.2819C161 83.4089 159.407 85.5303 156.228 87.1509L70.2072 130.98C63.843 134.221 53.5286 134.221 47.1644 130.98L6.22743 110.121C3.04251 108.5 1.45569 106.373 1.45569 104.246V97.4541Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M1.45575 97.454C1.45575 95.327 3.0482 93.2056 6.22749 91.585L92.2485 47.7557C98.6127 44.5145 108.927 44.5145 115.291 47.7557L156.228 68.6153C159.413 70.2359 161 72.3629 161 74.4899C161 76.617 159.408 78.7384 156.228 80.359L70.2073 124.188C63.8431 127.429 53.5286 127.429 47.1644 124.188L6.22749 103.329C3.04257 101.708 1.45575 99.581 1.45575 97.454Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M69.352 97.8585C68.7049 97.8585 68.0972 97.7178 67.5514 97.4364L62.5377 94.8818C60.9677 94.0827 60.0674 92.2483 60.0674 89.8512V31.1046C60.0674 26.8674 62.9147 21.9662 66.4091 20.1824L93.5653 6.34547C93.6441 6.30608 93.7341 6.28357 93.8185 6.28357C93.9029 6.28357 93.993 6.30608 94.0717 6.34547L99.0855 8.90016C99.0855 8.90016 99.1305 8.92829 99.153 8.93954L114.239 19.6085C114.391 19.7154 114.475 19.8842 114.475 20.0699V67.8043C114.475 72.0415 111.628 76.9427 108.134 78.7264L71.9236 97.1776C71.0345 97.6278 70.168 97.8585 69.3408 97.8585H69.352Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M93.8241 6.84648L98.8378 9.40117L113.924 20.0701V67.8045C113.924 71.8616 111.223 76.5265 107.886 78.2258L71.676 96.677C70.8488 97.099 70.061 97.296 69.3464 97.296C68.7837 97.296 68.266 97.1722 67.8046 96.9358L62.7908 94.3811C61.4685 93.7059 60.6301 92.1134 60.6301 89.8514V31.1048C60.6301 27.0477 63.331 22.3828 66.6623 20.6834L93.8185 6.84648M93.8241 5.72107C93.6497 5.72107 93.4752 5.76046 93.3121 5.84486L66.1558 19.6818C62.4251 21.5838 59.5046 26.5975 59.5046 31.1048V89.8514C59.5046 92.4679 60.5175 94.4881 62.2844 95.3828L67.2981 97.9375C67.9227 98.2582 68.6148 98.4158 69.352 98.4158C70.2692 98.4158 71.2258 98.1682 72.1937 97.673L108.404 79.2218C112.135 77.3199 115.055 72.3062 115.055 67.7989V20.0757C115.055 19.71 114.881 19.3667 114.577 19.1585L99.4906 8.48959C99.4455 8.45582 99.4005 8.42769 99.3499 8.40518L94.3362 5.85049C94.173 5.76609 93.9985 5.7267 93.8241 5.7267V5.72107Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M98.8378 9.40088L71.6816 23.2378C68.3503 24.9372 65.6493 29.6021 65.6493 33.6592V92.4058C65.6493 94.6678 66.4878 96.2603 67.8101 96.9356L62.7964 94.3809C61.4741 93.7056 60.6356 92.1132 60.6356 89.8511V31.1045C60.6356 27.0474 63.3366 22.3825 66.6678 20.6832L93.8241 6.84619L98.8378 9.40088Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M98.8376 9.40088L113.924 20.0754V67.8098C113.924 71.867 111.223 76.5318 107.892 78.2312L71.6814 96.6823C70.2071 97.4307 68.8566 97.4757 67.81 96.9468C66.4876 96.2716 65.6492 94.6791 65.6492 92.417V33.6704C65.6492 29.6133 68.3502 24.9485 71.6814 23.2491L98.8376 9.41213V9.40088Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M98.8376 9.40088V20.4187C98.8376 24.4758 101.539 26.3834 104.87 24.6896L113.924 20.0754"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M98.8376 9.40088V20.4187C98.8376 24.4758 101.539 26.3834 104.87 24.6896L113.924 20.0754"
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M94.3305 36.4898L77.0329 45.3018C75.9638 45.8476 75.0972 45.2343 75.0972 43.9344C75.0972 42.6346 75.9638 41.1434 77.0329 40.5976L94.3305 31.7856C95.3997 31.2398 96.2663 31.8531 96.2663 33.153C96.2663 34.4528 95.3997 35.944 94.3305 36.4898Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M102.535 48.1601L77.033 61.153C75.9639 61.6988 75.0973 61.0855 75.0973 59.7856C75.0973 58.4858 75.9639 56.9946 77.033 56.4488L102.535 43.4559C103.604 42.9101 104.471 43.5234 104.471 44.8233C104.471 46.1231 103.604 47.6143 102.535 48.1601Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M102.535 61.9242L77.033 74.9171C75.9639 75.4629 75.0973 74.8495 75.0973 73.5497C75.0973 72.2498 75.9639 70.7587 77.033 70.2128L102.535 57.2199C103.604 56.6741 104.471 57.2875 104.471 58.5873C104.471 59.8872 103.604 61.3783 102.535 61.9242Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M137.828 7.34112C139.054 6.71651 140.63 6.76716 142.357 7.65061C146.257 9.63696 149.414 15.0952 149.414 19.8332C149.414 22.4779 148.429 24.3461 146.882 25.1339L149.391 23.8566C150.939 23.0688 151.923 21.2006 151.923 18.5559C151.923 13.8122 148.761 8.35399 144.867 6.37326C143.145 5.49544 141.564 5.43917 140.337 6.06377L137.828 7.34112Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M137.828 7.34148C136.28 8.12927 135.295 9.99746 135.295 12.6422C135.295 17.3858 138.458 22.8441 142.352 24.8248C144.074 25.7026 145.655 25.7589 146.882 25.1343C148.429 24.3465 149.414 22.4783 149.414 19.8336C149.414 15.09 146.251 9.6317 142.357 7.65097C140.636 6.77315 139.054 6.71688 137.828 7.34148Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M138.711 12.13C138.711 11.8712 138.886 11.7474 139.094 11.8599L146.021 15.3881C146.235 15.495 146.403 15.7932 146.403 16.0521C146.403 16.3109 146.229 16.4347 146.021 16.3222L139.094 12.794C138.88 12.6871 138.711 12.3889 138.711 12.13ZM138.711 14.4709C138.711 14.212 138.886 14.0882 139.094 14.2008L142.943 16.1646C143.157 16.2715 143.325 16.5698 143.325 16.8286C143.325 17.0875 143.151 17.2113 142.943 17.0987L139.094 15.1349C138.88 15.028 138.711 14.7297 138.711 14.4709ZM139.099 16.0746C138.886 15.9677 138.717 16.0858 138.717 16.3447C138.717 16.6035 138.891 16.9018 139.099 17.0087L141.795 18.3817C142.009 18.4886 142.177 18.3704 142.177 18.1116C142.177 17.8527 142.003 17.5545 141.795 17.4476L139.099 16.0746ZM138.711 18.2185C138.711 17.9597 138.886 17.8359 139.094 17.9484L140.636 18.7306C140.849 18.8375 141.018 19.1357 141.018 19.3946C141.018 19.6534 140.844 19.7772 140.636 19.6647L139.094 18.8825C138.88 18.7756 138.711 18.4773 138.711 18.2185ZM145.497 18.1679C145.638 18.241 145.773 18.3761 145.869 18.5449C145.97 18.7137 146.021 18.905 146.021 19.0794C146.021 19.2539 145.964 19.3833 145.869 19.4565L145.638 19.6196L144.895 18.331L145.126 18.1679C145.227 18.1003 145.357 18.1003 145.497 18.1679ZM144.681 18.4773L145.424 19.7659L143.736 20.9589C143.612 21.0489 143.46 21.0771 143.292 21.0545L142.751 20.9758C142.751 20.9758 142.695 20.9589 142.673 20.9364C142.644 20.9139 142.622 20.8857 142.605 20.852C142.588 20.8182 142.571 20.7844 142.566 20.7451C142.56 20.7113 142.56 20.6775 142.566 20.6494L142.729 20.0754C142.779 19.8954 142.87 19.7547 142.993 19.6703L144.681 18.4773Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M8.24198 41.3744C7.61174 41.0537 7.21221 40.294 7.21221 39.2136V25.4161C7.21221 23.4803 8.50083 21.252 10.0933 20.4417L45.797 2.24941C46.5004 1.88928 47.1475 1.8724 47.6483 2.12562L45.1387 0.848271C44.6379 0.595053 43.9907 0.611935 43.2874 0.972067L7.5836 19.1644C5.99114 19.9747 4.70255 22.203 4.70255 24.1387V37.9363C4.70255 39.0167 5.10208 39.7763 5.73231 40.0971L8.24198 41.3744Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M8.2418 41.3747C8.74261 41.6279 9.38973 41.611 10.0931 41.2509L45.7968 23.0586C47.3893 22.2483 48.6779 20.0199 48.6779 18.0842V4.28665C48.6779 3.20626 48.2784 2.4466 47.6482 2.12586C47.1474 1.87264 46.5002 1.88952 45.7968 2.24965L10.0931 20.442C8.50065 21.2523 7.21204 23.4806 7.21204 25.4163V39.2139C7.21204 40.2943 7.61157 41.0539 8.2418 41.3747Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M29.6699 20.87C29.6699 20.628 29.5067 20.5155 29.3098 20.6168L25.7028 22.4568C25.5059 22.5581 25.3427 22.8395 25.3427 23.0814C25.3427 23.3234 25.5059 23.4359 25.7028 23.3347L29.3098 21.4946C29.5067 21.3933 29.6699 21.112 29.6699 20.87Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M30.3902 23.1375C30.3902 22.8955 30.227 22.783 30.0301 22.8842L24.9769 25.4558C24.78 25.5571 24.6168 25.8384 24.6168 26.0804C24.6168 26.3224 24.78 26.4349 24.9769 26.3336L30.0301 23.7621C30.227 23.6608 30.3902 23.3794 30.3902 23.1375Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M31.1105 17.4994C31.1105 17.2574 30.9473 17.1449 30.7504 17.2462L24.2567 20.5549C24.0598 20.6562 23.8966 20.9375 23.8966 21.1795C23.8966 21.4215 24.0598 21.534 24.2567 21.4327L30.7504 18.124C30.9473 18.0227 31.1105 17.7414 31.1105 17.4994Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M15.6305 28.0209C15.6305 27.7789 15.4673 27.6664 15.2703 27.7677L10.9431 29.9735C10.7462 30.0748 10.583 30.3561 10.583 30.5981C10.583 30.84 10.7462 30.9526 10.9431 30.8513L15.2703 28.6455C15.4673 28.5442 15.6305 28.2628 15.6305 28.0209Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M16.3507 30.2891C16.3507 30.0471 16.1875 29.9346 15.9906 30.0358L10.9375 32.6074C10.7405 32.7087 10.5773 32.9901 10.5773 33.232C10.5773 33.474 10.7405 33.5865 10.9375 33.4852L15.9906 30.9137C16.1875 30.8124 16.3507 30.531 16.3507 30.2891Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M17.7911 24.2848C17.7911 24.0428 17.628 23.9303 17.431 24.0316L10.9374 27.3403C10.7404 27.4416 10.5772 27.7229 10.5772 27.9649C10.5772 28.2069 10.7404 28.3194 10.9374 28.2181L17.431 24.9094C17.628 24.8081 17.7911 24.5268 17.7911 24.2848Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M45.3018 12.9015C45.3018 12.6595 45.1387 12.547 44.9417 12.6483L40.6145 14.8541C40.4176 14.9554 40.2544 15.2367 40.2544 15.4787C40.2544 15.7207 40.4176 15.8332 40.6145 15.7319L44.9417 13.5261C45.1387 13.4248 45.3018 13.1435 45.3018 12.9015Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M45.3017 15.535C45.3017 15.2931 45.1385 15.1805 44.9416 15.2818L39.8884 17.8534C39.6915 17.9547 39.5283 18.236 39.5283 18.478C39.5283 18.72 39.6915 18.8325 39.8884 18.7312L44.9416 16.1596C45.1385 16.0584 45.3017 15.777 45.3017 15.535Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M45.3019 10.2681C45.3019 10.0261 45.1387 9.91357 44.9418 10.0149L38.4481 13.3236C38.2512 13.4249 38.088 13.7062 38.088 13.9482C38.088 14.1901 38.2512 14.3027 38.4481 14.2014L44.9418 10.8927C45.1387 10.7914 45.3019 10.51 45.3019 10.2681Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M69.352 97.8585C68.7049 97.8585 68.0972 97.7178 67.5514 97.4364L62.5377 94.8818C60.9677 94.0827 60.0674 92.2483 60.0674 89.8512V31.1046C60.0674 26.8674 62.9147 21.9662 66.4091 20.1824L93.5653 6.34547C93.6441 6.30608 93.7341 6.28357 93.8185 6.28357C93.9029 6.28357 93.993 6.30608 94.0717 6.34547L99.0855 8.90016C99.0855 8.90016 99.1305 8.92829 99.153 8.93954L114.239 19.6085C114.391 19.7154 114.475 19.8842 114.475 20.0699V67.8043C114.475 72.0415 111.628 76.9427 108.134 78.7264L71.9236 97.1776C71.0345 97.6278 70.168 97.8585 69.3408 97.8585H69.352Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M93.8241 6.84648L98.8378 9.40117L113.924 20.0701V67.8045C113.924 71.8616 111.223 76.5265 107.886 78.2258L71.676 96.677C70.8488 97.099 70.061 97.296 69.3464 97.296C68.7837 97.296 68.266 97.1722 67.8046 96.9358L62.7908 94.3811C61.4685 93.7059 60.6301 92.1134 60.6301 89.8514V31.1048C60.6301 27.0477 63.331 22.3828 66.6623 20.6834L93.8185 6.84648M93.8241 5.72107C93.6497 5.72107 93.4752 5.76046 93.3121 5.84486L66.1558 19.6818C62.4251 21.5838 59.5046 26.5975 59.5046 31.1048V89.8514C59.5046 92.4679 60.5175 94.4881 62.2844 95.3828L67.2981 97.9375C67.9227 98.2582 68.6148 98.4158 69.352 98.4158C70.2692 98.4158 71.2258 98.1682 72.1937 97.673L108.404 79.2218C112.135 77.3199 115.055 72.3062 115.055 67.7989V20.0757C115.055 19.71 114.881 19.3667 114.577 19.1585L99.4906 8.48959C99.4455 8.45582 99.4005 8.42769 99.3499 8.40518L94.3362 5.85049C94.173 5.76609 93.9985 5.7267 93.8241 5.7267V5.72107Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M98.8378 9.40088L71.6816 23.2378C68.3503 24.9372 65.6493 29.6021 65.6493 33.6592V92.4058C65.6493 94.6678 66.4878 96.2603 67.8101 96.9356L62.7964 94.3809C61.4741 93.7056 60.6356 92.1132 60.6356 89.8511V31.1045C60.6356 27.0474 63.3366 22.3825 66.6678 20.6832L93.8241 6.84619L98.8378 9.40088Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M98.8376 9.40088L113.924 20.0754V67.8098C113.924 71.867 111.223 76.5318 107.892 78.2312L71.6814 96.6823C70.2071 97.4307 68.8566 97.4757 67.81 96.9468C66.4876 96.2716 65.6492 94.6791 65.6492 92.417V33.6704C65.6492 29.6133 68.3502 24.9485 71.6814 23.2491L98.8376 9.41213V9.40088Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M98.8376 9.40088V20.4187C98.8376 24.4758 101.539 26.3834 104.87 24.6896L113.924 20.0754"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M98.8376 9.40088V20.4187C98.8376 24.4758 101.539 26.3834 104.87 24.6896L113.924 20.0754"
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M94.3305 36.4898L77.0329 45.3018C75.9638 45.8476 75.0972 45.2343 75.0972 43.9344C75.0972 42.6346 75.9638 41.1434 77.0329 40.5976L94.3305 31.7856C95.3997 31.2398 96.2663 31.8531 96.2663 33.153C96.2663 34.4528 95.3997 35.944 94.3305 36.4898Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M102.535 48.1601L77.033 61.153C75.9639 61.6988 75.0973 61.0855 75.0973 59.7856C75.0973 58.4858 75.9639 56.9946 77.033 56.4488L102.535 43.4559C103.604 42.9101 104.471 43.5234 104.471 44.8233C104.471 46.1231 103.604 47.6143 102.535 48.1601Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M102.535 61.9242L77.033 74.9171C75.9639 75.4629 75.0973 74.8495 75.0973 73.5497C75.0973 72.2498 75.9639 70.7587 77.033 70.2128L102.535 57.2199C103.604 56.6741 104.471 57.2875 104.471 58.5873C104.471 59.8872 103.604 61.3783 102.535 61.9242Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M137.828 7.34112C139.054 6.71651 140.63 6.76716 142.357 7.65061C146.257 9.63696 149.414 15.0952 149.414 19.8332C149.414 22.4779 148.429 24.3461 146.882 25.1339L149.391 23.8566C150.939 23.0688 151.923 21.2006 151.923 18.5559C151.923 13.8122 148.761 8.35399 144.867 6.37326C143.145 5.49544 141.564 5.43917 140.337 6.06377L137.828 7.34112Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M137.828 7.34148C136.28 8.12927 135.295 9.99746 135.295 12.6422C135.295 17.3858 138.458 22.8441 142.352 24.8248C144.074 25.7026 145.655 25.7589 146.882 25.1343C148.429 24.3465 149.414 22.4783 149.414 19.8336C149.414 15.09 146.251 9.6317 142.357 7.65097C140.636 6.77315 139.054 6.71688 137.828 7.34148Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M138.711 12.13C138.711 11.8712 138.886 11.7474 139.094 11.8599L146.021 15.3881C146.235 15.495 146.403 15.7932 146.403 16.0521C146.403 16.3109 146.229 16.4347 146.021 16.3222L139.094 12.794C138.88 12.6871 138.711 12.3889 138.711 12.13ZM138.711 14.4709C138.711 14.212 138.886 14.0882 139.094 14.2008L142.943 16.1646C143.157 16.2715 143.325 16.5698 143.325 16.8286C143.325 17.0875 143.151 17.2113 142.943 17.0987L139.094 15.1349C138.88 15.028 138.711 14.7297 138.711 14.4709ZM139.099 16.0746C138.886 15.9677 138.717 16.0858 138.717 16.3447C138.717 16.6035 138.891 16.9018 139.099 17.0087L141.795 18.3817C142.009 18.4886 142.177 18.3704 142.177 18.1116C142.177 17.8527 142.003 17.5545 141.795 17.4476L139.099 16.0746ZM138.711 18.2185C138.711 17.9597 138.886 17.8359 139.094 17.9484L140.636 18.7306C140.849 18.8375 141.018 19.1357 141.018 19.3946C141.018 19.6534 140.844 19.7772 140.636 19.6647L139.094 18.8825C138.88 18.7756 138.711 18.4773 138.711 18.2185ZM145.497 18.1679C145.638 18.241 145.773 18.3761 145.869 18.5449C145.97 18.7137 146.021 18.905 146.021 19.0794C146.021 19.2539 145.964 19.3833 145.869 19.4565L145.638 19.6196L144.895 18.331L145.126 18.1679C145.227 18.1003 145.357 18.1003 145.497 18.1679ZM144.681 18.4773L145.424 19.7659L143.736 20.9589C143.612 21.0489 143.46 21.0771 143.292 21.0545L142.751 20.9758C142.751 20.9758 142.695 20.9589 142.673 20.9364C142.644 20.9139 142.622 20.8857 142.605 20.852C142.588 20.8182 142.571 20.7844 142.566 20.7451C142.56 20.7113 142.56 20.6775 142.566 20.6494L142.729 20.0754C142.779 19.8954 142.87 19.7547 142.993 19.6703L144.681 18.4773Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M8.24198 41.3744C7.61174 41.0537 7.21221 40.294 7.21221 39.2136V25.4161C7.21221 23.4803 8.50083 21.252 10.0933 20.4417L45.797 2.24941C46.5004 1.88928 47.1475 1.8724 47.6483 2.12562L45.1387 0.848271C44.6379 0.595053 43.9907 0.611935 43.2874 0.972067L7.5836 19.1644C5.99114 19.9747 4.70255 22.203 4.70255 24.1387V37.9363C4.70255 39.0167 5.10208 39.7763 5.73231 40.0971L8.24198 41.3744Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M8.2418 41.3747C8.74261 41.6279 9.38973 41.611 10.0931 41.2509L45.7968 23.0586C47.3893 22.2483 48.6779 20.0199 48.6779 18.0842V4.28665C48.6779 3.20626 48.2784 2.4466 47.6482 2.12586C47.1474 1.87264 46.5002 1.88952 45.7968 2.24965L10.0931 20.442C8.50065 21.2523 7.21204 23.4806 7.21204 25.4163V39.2139C7.21204 40.2943 7.61157 41.0539 8.2418 41.3747Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M29.6699 20.87C29.6699 20.628 29.5067 20.5155 29.3098 20.6168L25.7028 22.4568C25.5059 22.5581 25.3427 22.8395 25.3427 23.0814C25.3427 23.3234 25.5059 23.4359 25.7028 23.3347L29.3098 21.4946C29.5067 21.3933 29.6699 21.112 29.6699 20.87Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M30.3902 23.1375C30.3902 22.8955 30.227 22.783 30.0301 22.8842L24.9769 25.4558C24.78 25.5571 24.6168 25.8384 24.6168 26.0804C24.6168 26.3224 24.78 26.4349 24.9769 26.3336L30.0301 23.7621C30.227 23.6608 30.3902 23.3794 30.3902 23.1375Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M31.1105 17.4994C31.1105 17.2574 30.9473 17.1449 30.7504 17.2462L24.2567 20.5549C24.0598 20.6562 23.8966 20.9375 23.8966 21.1795C23.8966 21.4215 24.0598 21.534 24.2567 21.4327L30.7504 18.124C30.9473 18.0227 31.1105 17.7414 31.1105 17.4994Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M15.6305 28.0209C15.6305 27.7789 15.4673 27.6664 15.2703 27.7677L10.9431 29.9735C10.7462 30.0748 10.583 30.3561 10.583 30.5981C10.583 30.84 10.7462 30.9526 10.9431 30.8513L15.2703 28.6455C15.4673 28.5442 15.6305 28.2628 15.6305 28.0209Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M16.3507 30.2891C16.3507 30.0471 16.1875 29.9346 15.9906 30.0358L10.9375 32.6074C10.7405 32.7087 10.5773 32.9901 10.5773 33.232C10.5773 33.474 10.7405 33.5865 10.9375 33.4852L15.9906 30.9137C16.1875 30.8124 16.3507 30.531 16.3507 30.2891Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M17.7911 24.2848C17.7911 24.0428 17.628 23.9303 17.431 24.0316L10.9374 27.3403C10.7404 27.4416 10.5772 27.7229 10.5772 27.9649C10.5772 28.2069 10.7404 28.3194 10.9374 28.2181L17.431 24.9094C17.628 24.8081 17.7911 24.5268 17.7911 24.2848Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M45.3018 12.9015C45.3018 12.6595 45.1387 12.547 44.9417 12.6483L40.6145 14.8541C40.4176 14.9554 40.2544 15.2367 40.2544 15.4787C40.2544 15.7207 40.4176 15.8332 40.6145 15.7319L44.9417 13.5261C45.1387 13.4248 45.3018 13.1435 45.3018 12.9015Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M45.3017 15.535C45.3017 15.2931 45.1385 15.1805 44.9416 15.2818L39.8884 17.8534C39.6915 17.9547 39.5283 18.236 39.5283 18.478C39.5283 18.72 39.6915 18.8325 39.8884 18.7312L44.9416 16.1596C45.1385 16.0584 45.3017 15.777 45.3017 15.535Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M45.3019 10.2681C45.3019 10.0261 45.1387 9.91357 44.9418 10.0149L38.4481 13.3236C38.2512 13.4249 38.088 13.7062 38.088 13.9482C38.088 14.1901 38.2512 14.3027 38.4481 14.2014L44.9418 10.8927C45.1387 10.7914 45.3019 10.51 45.3019 10.2681Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/project.tsx b/packages/propel/src/empty-state/assets/vertical-stack/project.tsx
index e2863ea2e..2186a5e7a 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/project.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/project.tsx
@@ -1,19 +1,55 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const ProjectVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="160"
-    height="143"
-    viewBox="0 0 160 143"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g clipPath="url(#clip0_145_15535)">
-      <g opacity="0.2">
+export function ProjectVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="160"
+      height="143"
+      viewBox="0 0 160 143"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g clipPath="url(#clip0_145_15535)">
+        <g opacity="0.2">
+          <path
+            d="M16.9216 113.94C16.9216 115.622 18.1809 117.299 20.6948 118.585L53.0651 135.079C58.0975 137.642 66.2534 137.642 71.2858 135.079L139.306 100.422C141.82 99.1406 143.079 97.4632 143.079 95.7812V101.152C143.079 102.834 141.82 104.511 139.306 105.793L71.2858 140.45C66.2534 143.013 58.0975 143.013 53.0651 140.45L20.6948 123.956C18.1764 122.674 16.9216 120.992 16.9216 119.31V113.94Z"
+            fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+            stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+            strokeWidth="0.4"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+          <path
+            d="M16.9216 113.94C16.9216 112.258 18.1809 110.581 20.6948 109.299L88.7146 74.6419C93.747 72.079 101.903 72.079 106.935 74.6419L139.306 91.1363C141.824 92.4178 143.079 94.0996 143.079 95.7816C143.079 97.4635 141.82 99.1409 139.306 100.422L71.2858 135.08C66.2534 137.643 58.0975 137.643 53.0651 135.08L20.6948 118.585C18.1764 117.304 16.9216 115.622 16.9216 113.94Z"
+            fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+            stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+            strokeWidth="0.4"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+        </g>
+        <g opacity="0.6">
+          <path
+            d="M16.9216 96.9689C16.9216 98.6509 18.1809 100.328 20.6948 101.614L53.0651 118.109C58.0975 120.672 66.2534 120.672 71.2858 118.109L139.306 83.4514C141.82 82.1699 143.079 80.4925 143.079 78.8105V84.181C143.079 85.8629 141.82 87.5405 139.306 88.822L71.2858 123.479C66.2534 126.042 58.0975 126.042 53.0651 123.479L20.6948 106.985C18.1764 105.703 16.9216 104.021 16.9216 102.34V96.9689Z"
+            fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+            stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+            strokeWidth="0.4"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+          <path
+            d="M16.9216 96.9692C16.9216 95.2873 18.1809 93.6099 20.6948 92.3284L88.7146 57.6712C93.747 55.1083 101.903 55.1083 106.935 57.6712L139.306 74.1655C141.824 75.4469 143.079 77.1289 143.079 78.8109C143.079 80.4928 141.82 82.1702 139.306 83.4517L71.2858 118.109C66.2534 120.672 58.0975 120.672 53.0651 118.109L20.6948 101.615C18.1764 100.333 16.9216 98.6512 16.9216 96.9692Z"
+            fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+            stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+            strokeWidth="0.4"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+        </g>
         <path
-          d="M16.9216 113.94C16.9216 115.622 18.1809 117.299 20.6948 118.585L53.0651 135.079C58.0975 137.642 66.2534 137.642 71.2858 135.079L139.306 100.422C141.82 99.1406 143.079 97.4632 143.079 95.7812V101.152C143.079 102.834 141.82 104.511 139.306 105.793L71.2858 140.45C66.2534 143.013 58.0975 143.013 53.0651 140.45L20.6948 123.956C18.1764 122.674 16.9216 120.992 16.9216 119.31V113.94Z"
+          d="M16.9216 80.0032C16.9216 81.6851 18.1809 83.3626 20.6948 84.6485L53.0651 101.143C58.0975 103.706 66.2534 103.706 71.2858 101.143L139.306 66.4855C141.82 65.2041 143.079 63.5266 143.079 61.8447V67.2153C143.079 68.8972 141.82 70.5747 139.306 71.8561L71.2858 106.513C66.2534 109.076 58.0975 109.076 53.0651 106.513L20.6948 90.0191C18.1764 88.7376 16.9216 87.0557 16.9216 85.3738V80.0032Z"
           fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
           stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
           strokeWidth="0.4"
@@ -21,17 +57,73 @@ export const ProjectVerticalStackIllustration = ({ className }: TIllustrationAss
           strokeLinejoin="round"
         />
         <path
-          d="M16.9216 113.94C16.9216 112.258 18.1809 110.581 20.6948 109.299L88.7146 74.6419C93.747 72.079 101.903 72.079 106.935 74.6419L139.306 91.1363C141.824 92.4178 143.079 94.0996 143.079 95.7816C143.079 97.4635 141.82 99.1409 139.306 100.422L71.2858 135.08C66.2534 137.643 58.0975 137.643 53.0651 135.08L20.6948 118.585C18.1764 117.304 16.9216 115.622 16.9216 113.94Z"
+          d="M16.9216 80.0035C16.9216 78.3216 18.1809 76.6442 20.6948 75.3627L88.7146 40.7054C93.747 38.1425 101.903 38.1425 106.935 40.7054L139.306 57.1998C141.824 58.4812 143.079 60.1631 143.079 61.845C143.079 63.527 141.82 65.2044 139.306 66.4859L71.2858 101.143C66.2534 103.706 58.0975 103.706 53.0651 101.143L20.6948 84.6488C18.1764 83.3673 16.9216 81.6855 16.9216 80.0035Z"
           fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
           stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
           strokeWidth="0.4"
           strokeLinecap="round"
           strokeLinejoin="round"
         />
-      </g>
-      <g opacity="0.6">
         <path
-          d="M16.9216 96.9689C16.9216 98.6509 18.1809 100.328 20.6948 101.614L53.0651 118.109C58.0975 120.672 66.2534 120.672 71.2858 118.109L139.306 83.4514C141.82 82.1699 143.079 80.4925 143.079 78.8105V84.181C143.079 85.8629 141.82 87.5405 139.306 88.822L71.2858 123.479C66.2534 126.042 58.0975 126.042 53.0651 123.479L20.6948 106.985C18.1764 105.703 16.9216 104.021 16.9216 102.34V96.9689Z"
+          d="M64.2952 82.8691C63.8191 82.8691 63.3697 82.7712 62.9648 82.5755C62.9381 82.5666 62.9114 82.5576 62.8847 82.5443L58.9202 80.5242C57.701 79.9012 57.0024 78.4774 57.0024 76.6175V49.3954C57.0024 46.1072 59.2094 42.3028 61.9236 40.9235L70.9072 36.3449V28.9009C70.9072 25.6127 73.1141 21.8084 75.8283 20.429L86.3114 15.0851C87.0011 14.7336 87.6774 14.5557 88.3181 14.5557C88.8209 14.5557 89.2926 14.6669 89.7197 14.8805L93.6842 16.9006C93.6842 16.9006 93.7065 16.9139 93.7154 16.9184C94.9168 17.5502 95.602 18.9607 95.602 20.8073V23.7572L100.221 21.4035C100.91 21.052 101.587 20.874 102.227 20.874C102.73 20.874 103.202 20.9852 103.629 21.1988C103.629 21.1988 107.611 23.2278 107.62 23.2367C108.821 23.8685 109.511 25.279 109.511 27.13V54.3521C109.511 57.6403 107.304 61.4446 104.59 62.824L66.293 82.3352C65.6078 82.6822 64.9359 82.8602 64.2952 82.8602V82.8691ZM80.9809 26.7918C80.0153 27.2813 79.2011 28.7007 79.2011 29.8887V32.1223L87.317 27.9887V23.5659L80.9809 26.7918Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        />
+        <path
+          d="M88.3226 15.0003C88.7586 15.0003 89.1635 15.0937 89.5195 15.2762L93.484 17.2963C93.484 17.2963 93.4751 17.2963 93.4707 17.2918C94.503 17.8124 95.1615 19.0493 95.1615 20.8113V24.4911L100.425 21.808C101.066 21.4832 101.676 21.3275 102.232 21.3275C102.668 21.3275 103.073 21.4209 103.429 21.6034L107.393 23.6235C107.393 23.6235 107.384 23.6235 107.38 23.619C108.412 24.1352 109.071 25.3765 109.071 27.1385V54.3606C109.071 57.5065 106.975 61.1195 104.394 62.4366L66.0973 81.9476C65.461 82.2725 64.8558 82.4238 64.3041 82.4238C63.828 82.4238 63.3875 82.3081 63.0048 82.0945C63.036 82.1123 63.0627 82.1346 63.0938 82.1524L59.1293 80.1323C58.1059 79.6117 57.4563 78.3747 57.4563 76.6216V49.3995C57.4563 46.2537 59.552 42.6407 62.1328 41.3237L71.361 36.6205V28.9005C71.361 25.7547 73.4568 22.1418 76.0375 20.8247L86.5205 15.4808C87.1613 15.156 87.7709 15.0003 88.327 15.0003M91.9756 17.0426C92.0557 17.0337 92.1358 17.0293 92.2115 17.0293C92.1314 17.0293 92.0557 17.0382 91.9756 17.0426ZM92.6075 17.0426C92.5318 17.0337 92.4562 17.0293 92.3805 17.0248C92.4562 17.0248 92.5318 17.0337 92.6075 17.0426ZM91.6731 17.0826C91.7176 17.0737 91.7576 17.0649 91.8021 17.0604C91.7621 17.0649 91.7176 17.0737 91.6731 17.0826ZM92.9901 17.1138C92.9189 17.096 92.8433 17.0738 92.7676 17.0649C92.8433 17.0782 92.9145 17.096 92.9901 17.1138ZM91.0813 17.2473C91.1792 17.2117 91.2771 17.1806 91.3749 17.1539C91.2771 17.1806 91.1792 17.2161 91.0813 17.2473ZM93.3728 17.2517C93.2927 17.2161 93.2126 17.1806 93.1325 17.1539C93.2171 17.1806 93.2927 17.2161 93.3728 17.2517ZM90.4806 17.5009C90.6319 17.4208 90.7832 17.3586 90.9345 17.2963C90.7832 17.3541 90.6363 17.4208 90.4806 17.5009ZM91.1436 21.8526C91.1124 21.8303 91.0813 21.8125 91.0457 21.7902C91.0768 21.808 91.1124 21.8303 91.1436 21.8526ZM91.2815 21.9683C91.2593 21.946 91.2326 21.9237 91.2103 21.9059C91.2326 21.9282 91.2593 21.946 91.2815 21.9683ZM91.4016 22.1106C91.3838 22.0839 91.3616 22.0617 91.3438 22.035C91.366 22.0572 91.3838 22.0839 91.4016 22.1106ZM91.504 22.2753C91.4862 22.2441 91.4728 22.2174 91.455 22.1863C91.4728 22.213 91.4906 22.2441 91.504 22.2753ZM91.5885 22.4666C91.5752 22.431 91.5618 22.3954 91.544 22.3642C91.5574 22.3998 91.5707 22.431 91.5885 22.4666ZM91.6553 22.6846C91.6464 22.6401 91.633 22.6 91.6197 22.56C91.633 22.6 91.6419 22.6445 91.6553 22.6846ZM91.6998 22.9382C91.6909 22.8848 91.6864 22.8314 91.6775 22.7825C91.6864 22.8314 91.6953 22.8848 91.6998 22.9382ZM78.7561 32.8473L87.7619 28.2598V22.8404L80.7807 26.4C79.6638 26.9695 78.7561 28.5312 78.7561 29.8928V32.8518M91.7264 23.2808C91.7264 23.1919 91.722 23.1028 91.7131 23.0227C91.722 23.1073 91.7264 23.1919 91.7264 23.2808ZM106 23.3565C105.96 23.3565 105.92 23.3609 105.88 23.3654C105.92 23.3654 105.96 23.3565 106 23.3565C106.041 23.3565 106.081 23.3565 106.121 23.352C106.081 23.352 106.041 23.352 106 23.3565ZM106.517 23.3698C106.441 23.3609 106.365 23.3565 106.29 23.352C106.365 23.352 106.441 23.3609 106.517 23.3698ZM105.453 23.4365C105.538 23.4187 105.627 23.401 105.711 23.3876C105.627 23.401 105.542 23.4187 105.453 23.4365ZM106.899 23.441C106.828 23.4232 106.752 23.4054 106.677 23.3921C106.752 23.4054 106.824 23.4232 106.899 23.441ZM107.278 23.5745C107.197 23.5389 107.117 23.5033 107.037 23.4766C107.122 23.5033 107.197 23.5389 107.278 23.5745ZM104.39 23.8237C104.541 23.7436 104.692 23.6813 104.844 23.619C104.692 23.6769 104.546 23.7436 104.39 23.8237ZM61.4653 79.4293C61.4564 79.367 61.4475 79.3047 61.4386 79.2424C61.4431 79.3092 61.4564 79.367 61.4653 79.4293ZM61.7234 80.506C61.6967 80.4393 61.6744 80.377 61.6522 80.3058C61.6744 80.3725 61.6967 80.4393 61.7234 80.506ZM62.1594 81.3337C62.1238 81.2803 62.0882 81.2268 62.0526 81.1734C62.0882 81.2268 62.1238 81.2847 62.1594 81.3337ZM62.4398 81.6674C62.3953 81.6229 62.3597 81.5784 62.3196 81.5339C62.3597 81.5784 62.3997 81.6273 62.4398 81.6674ZM62.7512 81.9387C62.7067 81.9076 62.6667 81.8675 62.6266 81.8319C62.6667 81.8675 62.7067 81.9031 62.7512 81.9387ZM88.3226 14.1104C87.6107 14.1104 86.8631 14.3062 86.1156 14.6888L75.6326 20.0327C72.7359 21.5099 70.4667 25.4032 70.4667 28.9005V36.0732L61.7234 40.5272C58.8267 42.0044 56.5575 45.8977 56.5575 49.395V76.6171C56.5575 78.655 57.3451 80.2213 58.72 80.9199L62.6845 82.9399C63.1739 83.1846 63.7168 83.3092 64.2952 83.3092C65.0071 83.3092 65.7458 83.1179 66.4933 82.7352L104.79 63.2242C107.687 61.7469 109.956 57.8535 109.956 54.3562V27.1341C109.956 25.1229 109.186 23.5656 107.843 22.8537C107.829 22.8448 107.811 22.8359 107.794 22.827L103.829 20.8069C103.34 20.5577 102.801 20.4331 102.227 20.4331C101.515 20.4331 100.768 20.6289 100.02 21.0116L96.0514 23.0361V20.8113C96.0514 18.7957 95.2816 17.2428 93.9334 16.5309C93.9245 16.5309 93.9201 16.5221 93.9112 16.5176C93.9023 16.5176 93.8934 16.5087 93.8889 16.5042L89.9289 14.4841C89.4394 14.235 88.901 14.1104 88.327 14.1104H88.3226ZM79.646 31.3923V29.8839C79.646 28.8649 80.3624 27.6013 81.1811 27.1875L86.8676 24.2909V27.7125L79.6416 31.3923H79.646Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+        />
+        <path
+          d="M107.393 23.6231C106.579 23.2093 105.533 23.2449 104.39 23.8278L95.1614 28.531L91.1969 26.5109L100.425 21.8077C101.569 21.2248 102.614 21.1892 103.429 21.6031L107.393 23.6231Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M78.756 36.8834L91.7264 30.276L87.7619 28.2559L74.7915 34.8634L78.756 36.8834Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M91.7263 30.2757V23.2766C91.7263 22.5202 91.446 21.9862 91.0055 21.7592L87.041 19.7393C87.4815 19.9662 87.7618 20.5001 87.7618 21.2565V28.2556L91.7263 30.2757Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M93.4839 17.296C92.6697 16.8822 91.624 16.9178 90.4805 17.5007L79.9975 22.8445C77.4123 24.1616 75.321 27.779 75.321 30.9204V38.6403L71.3565 36.6202V28.9003C71.3565 25.7545 73.4522 22.1415 76.033 20.8244L86.516 15.4806C87.6595 14.8977 88.7052 14.8621 89.5194 15.2759L93.4839 17.296Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M75.321 38.6363L66.0927 43.3394C63.5076 44.6564 61.4163 48.2739 61.4163 51.4153V78.6374C61.4163 80.3905 62.0659 81.6275 63.0893 82.1481L59.1248 80.128C58.1014 79.6074 57.4518 78.3704 57.4518 76.6173V49.3952C57.4518 46.2494 59.5475 42.6364 62.1282 41.3194L71.3565 36.6162L75.321 38.6363Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M95.1615 28.5268V20.8068C95.1615 17.661 93.0657 16.1794 90.485 17.4964L80.002 22.8403C77.4168 24.1574 75.3255 27.7748 75.3255 30.9161V38.6361L66.0972 43.3391C63.5121 44.6562 61.4208 48.2737 61.4208 51.4151V78.6372C61.4208 81.783 63.5165 83.2646 66.0972 81.9476L104.394 62.4365C106.979 61.1195 109.071 57.5019 109.071 54.3606V27.1385C109.071 23.9927 106.975 22.511 104.394 23.8281L95.1659 28.5312L95.1615 28.5268ZM78.7561 36.8829V29.8838C78.7561 28.5267 79.6638 26.9605 80.7806 26.391L89.7063 21.8436C90.8232 21.2741 91.7309 21.9148 91.7309 23.2763V30.2754L78.7605 36.8829H78.7561Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M144.881 26.5558C146.104 25.9328 146.883 24.4601 146.883 22.3644C146.883 18.6134 144.382 14.2974 141.303 12.7312L120.657 2.21249C119.296 1.51836 118.05 1.47385 117.08 1.96774L119.064 0.957693C120.034 0.463797 121.28 0.508314 122.642 1.20244L143.288 11.7212C146.371 13.2918 148.867 17.6078 148.867 21.3543C148.867 23.45 148.089 24.9228 146.865 25.5457L144.881 26.5558Z"
           fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
           stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
           strokeWidth="0.4"
@@ -39,210 +131,120 @@ export const ProjectVerticalStackIllustration = ({ className }: TIllustrationAss
           strokeLinejoin="round"
         />
         <path
-          d="M16.9216 96.9692C16.9216 95.2873 18.1809 93.6099 20.6948 92.3284L88.7146 57.6712C93.747 55.1083 101.903 55.1083 106.935 57.6712L139.306 74.1655C141.824 75.4469 143.079 77.1289 143.079 78.8109C143.079 80.4928 141.82 82.1702 139.306 83.4517L71.2858 118.109C66.2534 120.672 58.0975 120.672 53.0651 118.109L20.6948 101.615C18.1764 100.333 16.9216 98.6512 16.9216 96.9692Z"
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M144.881 26.5555C143.911 27.0494 142.665 27.005 141.303 26.3108L120.657 15.7921C117.574 14.2215 115.078 9.90547 115.078 6.15898C115.078 4.06325 115.856 2.59039 117.08 1.96746C118.05 1.47356 119.296 1.51808 120.657 2.2122L141.303 12.7309C144.387 14.3016 146.883 18.6176 146.883 22.3641C146.883 24.4598 146.104 25.9326 144.881 26.5555Z"
           fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
           stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
           strokeWidth="0.4"
           strokeLinecap="round"
           strokeLinejoin="round"
         />
-      </g>
-      <path
-        d="M16.9216 80.0032C16.9216 81.6851 18.1809 83.3626 20.6948 84.6485L53.0651 101.143C58.0975 103.706 66.2534 103.706 71.2858 101.143L139.306 66.4855C141.82 65.2041 143.079 63.5266 143.079 61.8447V67.2153C143.079 68.8972 141.82 70.5747 139.306 71.8561L71.2858 106.513C66.2534 109.076 58.0975 109.076 53.0651 106.513L20.6948 90.0191C18.1764 88.7376 16.9216 87.0557 16.9216 85.3738V80.0032Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M16.9216 80.0035C16.9216 78.3216 18.1809 76.6442 20.6948 75.3627L88.7146 40.7054C93.747 38.1425 101.903 38.1425 106.935 40.7054L139.306 57.1998C141.824 58.4812 143.079 60.1631 143.079 61.845C143.079 63.527 141.82 65.2044 139.306 66.4859L71.2858 101.143C66.2534 103.706 58.0975 103.706 53.0651 101.143L20.6948 84.6488C18.1764 83.3673 16.9216 81.6855 16.9216 80.0035Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M64.2952 82.8691C63.8191 82.8691 63.3697 82.7712 62.9648 82.5755C62.9381 82.5666 62.9114 82.5576 62.8847 82.5443L58.9202 80.5242C57.701 79.9012 57.0024 78.4774 57.0024 76.6175V49.3954C57.0024 46.1072 59.2094 42.3028 61.9236 40.9235L70.9072 36.3449V28.9009C70.9072 25.6127 73.1141 21.8084 75.8283 20.429L86.3114 15.0851C87.0011 14.7336 87.6774 14.5557 88.3181 14.5557C88.8209 14.5557 89.2926 14.6669 89.7197 14.8805L93.6842 16.9006C93.6842 16.9006 93.7065 16.9139 93.7154 16.9184C94.9168 17.5502 95.602 18.9607 95.602 20.8073V23.7572L100.221 21.4035C100.91 21.052 101.587 20.874 102.227 20.874C102.73 20.874 103.202 20.9852 103.629 21.1988C103.629 21.1988 107.611 23.2278 107.62 23.2367C108.821 23.8685 109.511 25.279 109.511 27.13V54.3521C109.511 57.6403 107.304 61.4446 104.59 62.824L66.293 82.3352C65.6078 82.6822 64.9359 82.8602 64.2952 82.8602V82.8691ZM80.9809 26.7918C80.0153 27.2813 79.2011 28.7007 79.2011 29.8887V32.1223L87.317 27.9887V23.5659L80.9809 26.7918Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      />
-      <path
-        d="M88.3226 15.0003C88.7586 15.0003 89.1635 15.0937 89.5195 15.2762L93.484 17.2963C93.484 17.2963 93.4751 17.2963 93.4707 17.2918C94.503 17.8124 95.1615 19.0493 95.1615 20.8113V24.4911L100.425 21.808C101.066 21.4832 101.676 21.3275 102.232 21.3275C102.668 21.3275 103.073 21.4209 103.429 21.6034L107.393 23.6235C107.393 23.6235 107.384 23.6235 107.38 23.619C108.412 24.1352 109.071 25.3765 109.071 27.1385V54.3606C109.071 57.5065 106.975 61.1195 104.394 62.4366L66.0973 81.9476C65.461 82.2725 64.8558 82.4238 64.3041 82.4238C63.828 82.4238 63.3875 82.3081 63.0048 82.0945C63.036 82.1123 63.0627 82.1346 63.0938 82.1524L59.1293 80.1323C58.1059 79.6117 57.4563 78.3747 57.4563 76.6216V49.3995C57.4563 46.2537 59.552 42.6407 62.1328 41.3237L71.361 36.6205V28.9005C71.361 25.7547 73.4568 22.1418 76.0375 20.8247L86.5205 15.4808C87.1613 15.156 87.7709 15.0003 88.327 15.0003M91.9756 17.0426C92.0557 17.0337 92.1358 17.0293 92.2115 17.0293C92.1314 17.0293 92.0557 17.0382 91.9756 17.0426ZM92.6075 17.0426C92.5318 17.0337 92.4562 17.0293 92.3805 17.0248C92.4562 17.0248 92.5318 17.0337 92.6075 17.0426ZM91.6731 17.0826C91.7176 17.0737 91.7576 17.0649 91.8021 17.0604C91.7621 17.0649 91.7176 17.0737 91.6731 17.0826ZM92.9901 17.1138C92.9189 17.096 92.8433 17.0738 92.7676 17.0649C92.8433 17.0782 92.9145 17.096 92.9901 17.1138ZM91.0813 17.2473C91.1792 17.2117 91.2771 17.1806 91.3749 17.1539C91.2771 17.1806 91.1792 17.2161 91.0813 17.2473ZM93.3728 17.2517C93.2927 17.2161 93.2126 17.1806 93.1325 17.1539C93.2171 17.1806 93.2927 17.2161 93.3728 17.2517ZM90.4806 17.5009C90.6319 17.4208 90.7832 17.3586 90.9345 17.2963C90.7832 17.3541 90.6363 17.4208 90.4806 17.5009ZM91.1436 21.8526C91.1124 21.8303 91.0813 21.8125 91.0457 21.7902C91.0768 21.808 91.1124 21.8303 91.1436 21.8526ZM91.2815 21.9683C91.2593 21.946 91.2326 21.9237 91.2103 21.9059C91.2326 21.9282 91.2593 21.946 91.2815 21.9683ZM91.4016 22.1106C91.3838 22.0839 91.3616 22.0617 91.3438 22.035C91.366 22.0572 91.3838 22.0839 91.4016 22.1106ZM91.504 22.2753C91.4862 22.2441 91.4728 22.2174 91.455 22.1863C91.4728 22.213 91.4906 22.2441 91.504 22.2753ZM91.5885 22.4666C91.5752 22.431 91.5618 22.3954 91.544 22.3642C91.5574 22.3998 91.5707 22.431 91.5885 22.4666ZM91.6553 22.6846C91.6464 22.6401 91.633 22.6 91.6197 22.56C91.633 22.6 91.6419 22.6445 91.6553 22.6846ZM91.6998 22.9382C91.6909 22.8848 91.6864 22.8314 91.6775 22.7825C91.6864 22.8314 91.6953 22.8848 91.6998 22.9382ZM78.7561 32.8473L87.7619 28.2598V22.8404L80.7807 26.4C79.6638 26.9695 78.7561 28.5312 78.7561 29.8928V32.8518M91.7264 23.2808C91.7264 23.1919 91.722 23.1028 91.7131 23.0227C91.722 23.1073 91.7264 23.1919 91.7264 23.2808ZM106 23.3565C105.96 23.3565 105.92 23.3609 105.88 23.3654C105.92 23.3654 105.96 23.3565 106 23.3565C106.041 23.3565 106.081 23.3565 106.121 23.352C106.081 23.352 106.041 23.352 106 23.3565ZM106.517 23.3698C106.441 23.3609 106.365 23.3565 106.29 23.352C106.365 23.352 106.441 23.3609 106.517 23.3698ZM105.453 23.4365C105.538 23.4187 105.627 23.401 105.711 23.3876C105.627 23.401 105.542 23.4187 105.453 23.4365ZM106.899 23.441C106.828 23.4232 106.752 23.4054 106.677 23.3921C106.752 23.4054 106.824 23.4232 106.899 23.441ZM107.278 23.5745C107.197 23.5389 107.117 23.5033 107.037 23.4766C107.122 23.5033 107.197 23.5389 107.278 23.5745ZM104.39 23.8237C104.541 23.7436 104.692 23.6813 104.844 23.619C104.692 23.6769 104.546 23.7436 104.39 23.8237ZM61.4653 79.4293C61.4564 79.367 61.4475 79.3047 61.4386 79.2424C61.4431 79.3092 61.4564 79.367 61.4653 79.4293ZM61.7234 80.506C61.6967 80.4393 61.6744 80.377 61.6522 80.3058C61.6744 80.3725 61.6967 80.4393 61.7234 80.506ZM62.1594 81.3337C62.1238 81.2803 62.0882 81.2268 62.0526 81.1734C62.0882 81.2268 62.1238 81.2847 62.1594 81.3337ZM62.4398 81.6674C62.3953 81.6229 62.3597 81.5784 62.3196 81.5339C62.3597 81.5784 62.3997 81.6273 62.4398 81.6674ZM62.7512 81.9387C62.7067 81.9076 62.6667 81.8675 62.6266 81.8319C62.6667 81.8675 62.7067 81.9031 62.7512 81.9387ZM88.3226 14.1104C87.6107 14.1104 86.8631 14.3062 86.1156 14.6888L75.6326 20.0327C72.7359 21.5099 70.4667 25.4032 70.4667 28.9005V36.0732L61.7234 40.5272C58.8267 42.0044 56.5575 45.8977 56.5575 49.395V76.6171C56.5575 78.655 57.3451 80.2213 58.72 80.9199L62.6845 82.9399C63.1739 83.1846 63.7168 83.3092 64.2952 83.3092C65.0071 83.3092 65.7458 83.1179 66.4933 82.7352L104.79 63.2242C107.687 61.7469 109.956 57.8535 109.956 54.3562V27.1341C109.956 25.1229 109.186 23.5656 107.843 22.8537C107.829 22.8448 107.811 22.8359 107.794 22.827L103.829 20.8069C103.34 20.5577 102.801 20.4331 102.227 20.4331C101.515 20.4331 100.768 20.6289 100.02 21.0116L96.0514 23.0361V20.8113C96.0514 18.7957 95.2816 17.2428 93.9334 16.5309C93.9245 16.5309 93.9201 16.5221 93.9112 16.5176C93.9023 16.5176 93.8934 16.5087 93.8889 16.5042L89.9289 14.4841C89.4394 14.235 88.901 14.1104 88.327 14.1104H88.3226ZM79.646 31.3923V29.8839C79.646 28.8649 80.3624 27.6013 81.1811 27.1875L86.8676 24.2909V27.7125L79.6416 31.3923H79.646Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-      />
-      <path
-        d="M107.393 23.6231C106.579 23.2093 105.533 23.2449 104.39 23.8278L95.1614 28.531L91.1969 26.5109L100.425 21.8077C101.569 21.2248 102.614 21.1892 103.429 21.6031L107.393 23.6231Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M78.756 36.8834L91.7264 30.276L87.7619 28.2559L74.7915 34.8634L78.756 36.8834Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M91.7263 30.2757V23.2766C91.7263 22.5202 91.446 21.9862 91.0055 21.7592L87.041 19.7393C87.4815 19.9662 87.7618 20.5001 87.7618 21.2565V28.2556L91.7263 30.2757Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M93.4839 17.296C92.6697 16.8822 91.624 16.9178 90.4805 17.5007L79.9975 22.8445C77.4123 24.1616 75.321 27.779 75.321 30.9204V38.6403L71.3565 36.6202V28.9003C71.3565 25.7545 73.4522 22.1415 76.033 20.8244L86.516 15.4806C87.6595 14.8977 88.7052 14.8621 89.5194 15.2759L93.4839 17.296Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M75.321 38.6363L66.0927 43.3394C63.5076 44.6564 61.4163 48.2739 61.4163 51.4153V78.6374C61.4163 80.3905 62.0659 81.6275 63.0893 82.1481L59.1248 80.128C58.1014 79.6074 57.4518 78.3704 57.4518 76.6173V49.3952C57.4518 46.2494 59.5475 42.6364 62.1282 41.3194L71.3565 36.6162L75.321 38.6363Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M95.1615 28.5268V20.8068C95.1615 17.661 93.0657 16.1794 90.485 17.4964L80.002 22.8403C77.4168 24.1574 75.3255 27.7748 75.3255 30.9161V38.6361L66.0972 43.3391C63.5121 44.6562 61.4208 48.2737 61.4208 51.4151V78.6372C61.4208 81.783 63.5165 83.2646 66.0972 81.9476L104.394 62.4365C106.979 61.1195 109.071 57.5019 109.071 54.3606V27.1385C109.071 23.9927 106.975 22.511 104.394 23.8281L95.1659 28.5312L95.1615 28.5268ZM78.7561 36.8829V29.8838C78.7561 28.5267 79.6638 26.9605 80.7806 26.391L89.7063 21.8436C90.8232 21.2741 91.7309 21.9148 91.7309 23.2763V30.2754L78.7605 36.8829H78.7561Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M144.881 26.5558C146.104 25.9328 146.883 24.4601 146.883 22.3644C146.883 18.6134 144.382 14.2974 141.303 12.7312L120.657 2.21249C119.296 1.51836 118.05 1.47385 117.08 1.96774L119.064 0.957693C120.034 0.463797 121.28 0.508314 122.642 1.20244L143.288 11.7212C146.371 13.2918 148.867 17.6078 148.867 21.3543C148.867 23.45 148.089 24.9228 146.865 25.5457L144.881 26.5558Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M144.881 26.5555C143.911 27.0494 142.665 27.005 141.303 26.3108L120.657 15.7921C117.574 14.2215 115.078 9.90547 115.078 6.15898C115.078 4.06325 115.856 2.59039 117.08 1.96746C118.05 1.47356 119.296 1.51808 120.657 2.2122L141.303 12.7309C144.387 14.3016 146.883 18.6176 146.883 22.3641C146.883 24.4598 146.104 25.9326 144.881 26.5555Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M121.218 6.35522C120.795 6.14164 120.453 6.38191 120.453 6.89805V8.23736C120.453 8.48653 120.533 8.7624 120.675 9.01157L123.118 13.2297C123.354 13.6346 123.728 13.9105 124.021 13.826C124.573 13.6658 125.049 13.3321 125.41 12.8426C125.601 12.5801 125.534 12.0906 125.298 11.6857L122.856 7.4676C122.713 7.21843 122.517 7.02266 122.313 6.92032L121.209 6.35968L121.218 6.35522ZM121.507 8.13057C121.668 8.21066 121.797 8.12169 121.797 7.92591C121.797 7.73013 121.668 7.51206 121.507 7.43197C121.347 7.35188 121.218 7.44085 121.218 7.63663C121.218 7.83241 121.347 8.05048 121.507 8.13057Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M139.71 20.6159L130.108 15.7215C129.196 15.2543 128.453 13.9772 128.453 12.8693C128.453 11.7569 129.192 11.2364 130.108 11.6991L139.71 16.5936C140.622 17.0608 141.365 18.3377 141.365 19.4457C141.365 20.558 140.627 21.0787 139.71 20.6159Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M46.1459 19.1032C45.5986 18.8229 44.8956 18.8496 44.1258 19.2411L5.13028 39.1126C3.39052 39.9981 1.98447 42.4321 1.98447 44.5456V59.616C1.98447 60.7952 2.42053 61.6272 3.11021 61.9787L1.12571 60.9687C0.436038 60.6172 0 59.7851 0 58.606V43.5355C0 41.422 1.4105 38.9881 3.14581 38.1027L42.1413 18.2311C42.9111 17.8395 43.6141 17.8173 44.1614 18.0931L46.1459 19.1032Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M46.1459 19.1029C46.8355 19.4544 47.2716 20.2865 47.2716 21.4656V36.5362C47.2716 38.6497 45.8611 41.0836 44.1258 41.969L5.13025 61.8405C4.36048 62.2321 3.65747 62.2543 3.11018 61.9785C2.4205 61.627 1.98444 60.7949 1.98444 59.6157V44.5453C1.98444 42.4318 3.39494 39.9978 5.13025 39.1124L44.1258 19.2409C44.8956 18.8493 45.5986 18.827 46.1459 19.1029Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M9.63761 42.8364C9.69545 42.9654 9.82449 43.0144 9.97132 42.9387C10.176 42.8364 10.3406 42.5472 10.3451 42.2891V41.8174C10.3451 41.6617 10.2872 41.5505 10.1893 41.5149C10.087 41.4793 9.95799 41.5238 9.84675 41.6395L7.444 44.0199C7.30162 44.1623 7.20819 44.3803 7.20819 44.5717V47.8109C7.20819 47.9711 7.27492 48.0868 7.38616 48.1179C7.49739 48.1446 7.63533 48.0824 7.75102 47.9489L8.09364 47.5485C8.27607 47.3393 8.3428 47.0234 8.24936 46.8454C8.18707 46.7297 8.07138 46.6986 7.9468 46.752V44.5139L9.64206 42.8364H9.63761Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M8.16037 42.2007C8.21822 42.3297 8.34725 42.3786 8.49409 42.303C8.69877 42.2006 8.86341 41.9114 8.86786 41.6534V41.1817C8.86786 41.026 8.81003 40.9148 8.71214 40.8792C8.61425 40.8436 8.48075 40.888 8.36952 41.0037L5.96677 43.3842C5.82438 43.5266 5.73096 43.7446 5.73096 43.9359V47.1752C5.73096 47.3354 5.79768 47.451 5.90892 47.4822C6.02016 47.5089 6.1581 47.4466 6.27378 47.3131L6.61641 46.9126C6.79884 46.7035 6.86557 46.3877 6.77213 46.2097C6.70984 46.094 6.59415 46.0627 6.46956 46.1161V43.8781L8.16483 42.2007H8.16037Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M11.8268 42.0622C11.7289 42.0222 11.5998 42.0667 11.4841 42.1868L9.08139 44.5672C8.93901 44.7096 8.84558 44.9321 8.84558 45.1145V48.3582C8.84558 48.5095 8.90341 48.6208 9.0013 48.6564C9.10809 48.692 9.23269 48.6475 9.34838 48.5318L11.7466 46.1513C11.8935 46.0133 11.9869 45.7909 11.9869 45.5995V42.3558C11.9869 42.2045 11.9291 42.0933 11.8223 42.0622H11.8268ZM11.2483 45.6574L9.58419 47.3037V45.0567L11.2483 43.4104V45.6574Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M24.37 39.6108L16.6501 43.5442C16.0138 43.869 15.5021 43.5041 15.5021 42.7299C15.5021 41.9557 16.0182 41.0703 16.6501 40.7454L24.37 36.812C25.0062 36.4872 25.5179 36.8521 25.5179 37.6263C25.5179 38.4006 25.0018 39.286 24.37 39.6108Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M41.0556 38.0092L16.877 50.33C16.1161 50.7171 15.5021 50.281 15.5021 49.3599C15.5021 48.4344 16.1161 47.3755 16.877 46.9884L41.0556 34.6676C41.8165 34.2805 42.4305 34.7167 42.4305 35.6377C42.4305 36.5632 41.8165 37.6221 41.0556 38.0092Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M156.013 57.7686C157.237 57.1457 158.016 55.6728 158.016 53.5771C158.016 49.8261 155.515 45.5102 152.436 43.9439C151.074 43.2498 149.828 43.2053 148.858 43.6992L150.843 42.6891C151.813 42.1952 153.059 42.2398 154.42 42.9339C157.504 44.5046 160 48.8205 160 52.567C160 54.6628 159.221 56.1356 157.998 56.7586L156.013 57.7686Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M156.013 57.7683C155.043 58.2622 153.797 58.2177 152.436 57.5236C149.352 55.9529 146.856 51.6369 146.856 47.8904C146.856 45.7947 147.635 44.3218 148.858 43.6989C149.828 43.205 151.074 43.2495 152.436 43.9436C155.519 45.5143 158.016 49.8303 158.016 53.5768C158.016 55.6725 157.237 57.1454 156.013 57.7683Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.4"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M155.212 51.0894L149.659 48.2594C149.49 48.1704 149.352 47.9346 149.352 47.7255C149.352 47.5164 149.49 47.4185 149.659 47.5075L155.212 50.3374C155.381 50.4264 155.519 50.6622 155.519 50.8714C155.519 51.0805 155.381 51.1784 155.212 51.0894Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        d="M153.98 52.7139L150.896 51.1432C150.727 51.0542 150.589 50.8184 150.589 50.6093C150.589 50.4002 150.727 50.3023 150.896 50.3913L153.98 51.962C154.149 52.051 154.287 52.2868 154.287 52.4959C154.287 52.705 154.149 52.8029 153.98 52.7139Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-      <path
-        d="M153.054 54.4932L151.822 53.8659C151.653 53.7769 151.515 53.5411 151.515 53.332C151.515 53.1228 151.653 53.025 151.822 53.1139L153.054 53.7413C153.223 53.8303 153.361 54.0661 153.361 54.2752C153.361 54.4843 153.223 54.5822 153.054 54.4932Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_145_15535">
-        <rect
-          width="160"
-          height="141.745"
-          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-          transform="translate(0 0.62793)"
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M121.218 6.35522C120.795 6.14164 120.453 6.38191 120.453 6.89805V8.23736C120.453 8.48653 120.533 8.7624 120.675 9.01157L123.118 13.2297C123.354 13.6346 123.728 13.9105 124.021 13.826C124.573 13.6658 125.049 13.3321 125.41 12.8426C125.601 12.5801 125.534 12.0906 125.298 11.6857L122.856 7.4676C122.713 7.21843 122.517 7.02266 122.313 6.92032L121.209 6.35968L121.218 6.35522ZM121.507 8.13057C121.668 8.21066 121.797 8.12169 121.797 7.92591C121.797 7.73013 121.668 7.51206 121.507 7.43197C121.347 7.35188 121.218 7.44085 121.218 7.63663C121.218 7.83241 121.347 8.05048 121.507 8.13057Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         />
-      </clipPath>
-    </defs>
-  </svg>
-);
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M139.71 20.6159L130.108 15.7215C129.196 15.2543 128.453 13.9772 128.453 12.8693C128.453 11.7569 129.192 11.2364 130.108 11.6991L139.71 16.5936C140.622 17.0608 141.365 18.3377 141.365 19.4457C141.365 20.558 140.627 21.0787 139.71 20.6159Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M46.1459 19.1032C45.5986 18.8229 44.8956 18.8496 44.1258 19.2411L5.13028 39.1126C3.39052 39.9981 1.98447 42.4321 1.98447 44.5456V59.616C1.98447 60.7952 2.42053 61.6272 3.11021 61.9787L1.12571 60.9687C0.436038 60.6172 0 59.7851 0 58.606V43.5355C0 41.422 1.4105 38.9881 3.14581 38.1027L42.1413 18.2311C42.9111 17.8395 43.6141 17.8173 44.1614 18.0931L46.1459 19.1032Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M46.1459 19.1029C46.8355 19.4544 47.2716 20.2865 47.2716 21.4656V36.5362C47.2716 38.6497 45.8611 41.0836 44.1258 41.969L5.13025 61.8405C4.36048 62.2321 3.65747 62.2543 3.11018 61.9785C2.4205 61.627 1.98444 60.7949 1.98444 59.6157V44.5453C1.98444 42.4318 3.39494 39.9978 5.13025 39.1124L44.1258 19.2409C44.8956 18.8493 45.5986 18.827 46.1459 19.1029Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M9.63761 42.8364C9.69545 42.9654 9.82449 43.0144 9.97132 42.9387C10.176 42.8364 10.3406 42.5472 10.3451 42.2891V41.8174C10.3451 41.6617 10.2872 41.5505 10.1893 41.5149C10.087 41.4793 9.95799 41.5238 9.84675 41.6395L7.444 44.0199C7.30162 44.1623 7.20819 44.3803 7.20819 44.5717V47.8109C7.20819 47.9711 7.27492 48.0868 7.38616 48.1179C7.49739 48.1446 7.63533 48.0824 7.75102 47.9489L8.09364 47.5485C8.27607 47.3393 8.3428 47.0234 8.24936 46.8454C8.18707 46.7297 8.07138 46.6986 7.9468 46.752V44.5139L9.64206 42.8364H9.63761Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M8.16037 42.2007C8.21822 42.3297 8.34725 42.3786 8.49409 42.303C8.69877 42.2006 8.86341 41.9114 8.86786 41.6534V41.1817C8.86786 41.026 8.81003 40.9148 8.71214 40.8792C8.61425 40.8436 8.48075 40.888 8.36952 41.0037L5.96677 43.3842C5.82438 43.5266 5.73096 43.7446 5.73096 43.9359V47.1752C5.73096 47.3354 5.79768 47.451 5.90892 47.4822C6.02016 47.5089 6.1581 47.4466 6.27378 47.3131L6.61641 46.9126C6.79884 46.7035 6.86557 46.3877 6.77213 46.2097C6.70984 46.094 6.59415 46.0627 6.46956 46.1161V43.8781L8.16483 42.2007H8.16037Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M11.8268 42.0622C11.7289 42.0222 11.5998 42.0667 11.4841 42.1868L9.08139 44.5672C8.93901 44.7096 8.84558 44.9321 8.84558 45.1145V48.3582C8.84558 48.5095 8.90341 48.6208 9.0013 48.6564C9.10809 48.692 9.23269 48.6475 9.34838 48.5318L11.7466 46.1513C11.8935 46.0133 11.9869 45.7909 11.9869 45.5995V42.3558C11.9869 42.2045 11.9291 42.0933 11.8223 42.0622H11.8268ZM11.2483 45.6574L9.58419 47.3037V45.0567L11.2483 43.4104V45.6574Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M24.37 39.6108L16.6501 43.5442C16.0138 43.869 15.5021 43.5041 15.5021 42.7299C15.5021 41.9557 16.0182 41.0703 16.6501 40.7454L24.37 36.812C25.0062 36.4872 25.5179 36.8521 25.5179 37.6263C25.5179 38.4006 25.0018 39.286 24.37 39.6108Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M41.0556 38.0092L16.877 50.33C16.1161 50.7171 15.5021 50.281 15.5021 49.3599C15.5021 48.4344 16.1161 47.3755 16.877 46.9884L41.0556 34.6676C41.8165 34.2805 42.4305 34.7167 42.4305 35.6377C42.4305 36.5632 41.8165 37.6221 41.0556 38.0092Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M156.013 57.7686C157.237 57.1457 158.016 55.6728 158.016 53.5771C158.016 49.8261 155.515 45.5102 152.436 43.9439C151.074 43.2498 149.828 43.2053 148.858 43.6992L150.843 42.6891C151.813 42.1952 153.059 42.2398 154.42 42.9339C157.504 44.5046 160 48.8205 160 52.567C160 54.6628 159.221 56.1356 157.998 56.7586L156.013 57.7686Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M156.013 57.7683C155.043 58.2622 153.797 58.2177 152.436 57.5236C149.352 55.9529 146.856 51.6369 146.856 47.8904C146.856 45.7947 147.635 44.3218 148.858 43.6989C149.828 43.205 151.074 43.2495 152.436 43.9436C155.519 45.5143 158.016 49.8303 158.016 53.5768C158.016 55.6725 157.237 57.1454 156.013 57.7683Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M155.212 51.0894L149.659 48.2594C149.49 48.1704 149.352 47.9346 149.352 47.7255C149.352 47.5164 149.49 47.4185 149.659 47.5075L155.212 50.3374C155.381 50.4264 155.519 50.6622 155.519 50.8714C155.519 51.0805 155.381 51.1784 155.212 51.0894Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          d="M153.98 52.7139L150.896 51.1432C150.727 51.0542 150.589 50.8184 150.589 50.6093C150.589 50.4002 150.727 50.3023 150.896 50.3913L153.98 51.962C154.149 52.051 154.287 52.2868 154.287 52.4959C154.287 52.705 154.149 52.8029 153.98 52.7139Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+        <path
+          d="M153.054 54.4932L151.822 53.8659C151.653 53.7769 151.515 53.5411 151.515 53.332C151.515 53.1228 151.653 53.025 151.822 53.1139L153.054 53.7413C153.223 53.8303 153.361 54.0661 153.361 54.2752C153.361 54.4843 153.223 54.5822 153.054 54.4932Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_145_15535">
+          <rect
+            width="160"
+            height="141.745"
+            fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+            transform="translate(0 0.62793)"
+          />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/server-error.tsx b/packages/propel/src/empty-state/assets/vertical-stack/server-error.tsx
index 1685d18dc..cdf0cadcd 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/server-error.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/server-error.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const ServerErrorVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="184"
-    viewBox="0 0 162 184"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function ServerErrorVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="184"
+      viewBox="0 0 162 184"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M1 147.661C1 149.794 2.597 151.922 5.78537 153.552L46.8392 174.472C53.2216 177.722 63.5656 177.722 69.9479 174.472L156.215 130.517C159.403 128.892 161 126.764 161 124.631V131.443C161 133.576 159.403 135.703 156.215 137.328L69.9479 181.283C63.5656 184.533 53.2216 184.533 46.8392 181.283L5.78537 160.364C2.59135 158.738 1 156.605 1 154.472V147.661Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 147.661C1 145.528 2.597 143.401 5.78537 141.775L92.0521 97.8209C98.4344 94.5704 108.778 94.5704 115.161 97.8209L156.215 118.74C159.409 120.365 161 122.498 161 124.631C161 126.765 159.403 128.892 156.215 130.517L69.9479 174.472C63.5656 177.722 53.2216 177.722 46.8392 174.472L5.78537 153.553C2.59135 151.927 1 149.794 1 147.661Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M1 126.144C1 128.277 2.597 130.404 5.78537 132.035L46.8392 152.954C53.2216 156.205 63.5656 156.205 69.9479 152.954L156.215 109C159.403 107.375 161 105.247 161 103.114V109.925C161 112.058 159.403 114.186 156.215 115.811L69.9479 159.766C63.5656 163.016 53.2216 163.016 46.8392 159.766L5.78537 138.846C2.59135 137.221 1 135.088 1 132.955V126.144Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 126.144C1 124.011 2.597 121.883 5.78537 120.258L92.0521 76.3036C98.4344 73.0531 108.778 73.0531 115.161 76.3036L156.215 97.2226C159.409 98.8479 161 100.981 161 103.114C161 105.247 159.403 107.375 156.215 109L69.9479 152.954C63.5656 156.205 53.2216 156.205 46.8392 152.954L5.78537 132.035C2.59135 130.41 1 128.277 1 126.144Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.5"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M1 147.661C1 149.794 2.597 151.922 5.78537 153.552L46.8392 174.472C53.2216 177.722 63.5656 177.722 69.9479 174.472L156.215 130.517C159.403 128.892 161 126.764 161 124.631V131.443C161 133.576 159.403 135.703 156.215 137.328L69.9479 181.283C63.5656 184.533 53.2216 184.533 46.8392 181.283L5.78537 160.364C2.59135 158.738 1 156.605 1 154.472V147.661Z"
+        d="M1 104.621C1 106.754 2.597 108.881 5.78537 110.512L46.8392 131.431C53.2216 134.682 63.5656 134.682 69.9479 131.431L156.215 87.4769C159.403 85.8516 161 83.7242 161 81.5911V88.4023C161 90.5354 159.403 92.6629 156.215 94.2881L69.9479 138.243C63.5656 141.493 53.2216 141.493 46.8392 138.243L5.78537 117.323C2.59135 115.698 1 113.565 1 111.432V104.621Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
@@ -20,311 +56,277 @@ export const ServerErrorVerticalStackIllustration = ({ className }: TIllustratio
         strokeLinejoin="round"
       />
       <path
-        d="M1 147.661C1 145.528 2.597 143.401 5.78537 141.775L92.0521 97.8209C98.4344 94.5704 108.778 94.5704 115.161 97.8209L156.215 118.74C159.409 120.365 161 122.498 161 124.631C161 126.765 159.403 128.892 156.215 130.517L69.9479 174.472C63.5656 177.722 53.2216 177.722 46.8392 174.472L5.78537 153.553C2.59135 151.927 1 149.794 1 147.661Z"
+        d="M1 104.621C1 102.488 2.597 100.36 5.78537 98.735L92.0521 54.7806C98.4344 51.5302 108.778 51.5302 115.161 54.7806L156.215 75.6997C159.409 77.3249 161 79.458 161 81.5912C161 83.7243 159.403 85.8517 156.215 87.4769L69.9479 131.431C63.5656 134.682 53.2216 134.682 46.8392 131.431L5.78537 110.512C2.59135 108.887 1 106.754 1 104.621Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M1 126.144C1 128.277 2.597 130.404 5.78537 132.035L46.8392 152.954C53.2216 156.205 63.5656 156.205 69.9479 152.954L156.215 109C159.403 107.375 161 105.247 161 103.114V109.925C161 112.058 159.403 114.186 156.215 115.811L69.9479 159.766C63.5656 163.016 53.2216 163.016 46.8392 159.766L5.78537 138.846C2.59135 137.221 1 135.088 1 132.955V126.144Z"
-        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-        strokeWidth="0.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
+        d="M81.0027 111.782C78.8075 111.782 76.7308 111.342 75.162 110.541L42.2571 93.7749C40.5642 92.9115 39.6328 91.7208 39.6328 90.4229V79.1366C39.6328 77.8387 40.5642 76.6536 42.2571 75.7902L43.2333 75.2936L42.2571 74.797C40.5642 73.9336 39.6328 72.7429 39.6328 71.445V60.1587C39.6328 58.8608 40.5642 57.6757 42.2571 56.8123L43.2333 56.3157L42.2571 55.8191C40.5642 54.9557 39.6328 53.765 39.6328 52.4671V41.1808C39.6328 39.8829 40.5642 38.6979 42.2571 37.8345L43.2333 37.3379L42.2571 36.8413C40.5642 35.9779 39.6328 34.7872 39.6328 33.4893V22.203C39.6328 20.9051 40.5642 19.72 42.2571 18.8566L75.162 2.09086C76.7308 1.28954 78.8075 0.849365 81.0027 0.849365C83.1979 0.849365 85.2746 1.28954 86.8434 2.09086L119.749 18.8566C121.441 19.72 122.373 20.9107 122.373 22.2086V33.4949C122.373 34.7928 121.441 35.9779 119.749 36.8413L118.772 37.3379L119.749 37.8345C121.441 38.6979 122.373 39.8886 122.373 41.1865V52.4728C122.373 53.7707 121.441 54.9557 119.749 55.8191L118.772 56.3157L119.749 56.8123C121.441 57.6757 122.373 58.8664 122.373 60.1644V71.4506C122.373 72.7486 121.441 73.9336 119.749 74.797L118.772 75.2936L119.749 75.7902C121.441 76.6536 122.373 77.8443 122.373 79.1422V90.4285C122.373 91.7264 121.441 92.9115 119.749 93.7749L86.8434 110.541C85.2746 111.342 83.1979 111.782 81.0027 111.782Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
       />
       <path
-        d="M1 126.144C1 124.011 2.597 121.883 5.78537 120.258L92.0521 76.3036C98.4344 73.0531 108.778 73.0531 115.161 76.3036L156.215 97.2226C159.409 98.8479 161 100.981 161 103.114C161 105.247 159.403 107.375 156.215 109L69.9479 152.954C63.5656 156.205 53.2216 156.205 46.8392 152.954L5.78537 132.035C2.59135 130.41 1 128.277 1 126.144Z"
+        d="M81.0028 1.40792C83.023 1.40792 85.0489 1.80296 86.5894 2.58735L119.495 19.3531C121.041 20.1375 121.808 21.1702 121.808 22.2029V33.4892C121.808 34.5162 121.035 35.5489 119.495 36.3333L117.531 37.3321L119.495 38.331C121.041 39.1154 121.808 40.148 121.808 41.1807V52.467C121.808 53.4941 121.035 54.5268 119.495 55.3112L117.531 56.31L119.495 57.3088C121.041 58.0932 121.808 59.1259 121.808 60.1586V71.4449C121.808 72.4719 121.035 73.5046 119.495 74.289L117.531 75.2879L119.495 76.2867C121.041 77.0711 121.808 78.1038 121.808 79.1365V90.4228C121.808 91.4498 121.035 92.4825 119.495 93.2669L86.5894 110.033C85.0489 110.817 83.023 111.212 81.0028 111.212C78.9825 111.212 76.9567 110.817 75.4161 110.033L42.511 93.2669C40.9648 92.4825 40.1972 91.4498 40.1972 90.4171V79.1308C40.1972 78.1038 40.9704 77.0711 42.511 76.2867L44.4748 75.2879L42.511 74.289C40.9648 73.5046 40.1972 72.472 40.1972 71.4393V60.153C40.1972 59.1259 40.9704 58.0932 42.511 57.3088L44.4748 56.31L42.511 55.3112C40.9648 54.5268 40.1972 53.4941 40.1972 52.4614V41.1751C40.1972 40.1481 40.9704 39.1154 42.511 38.331L44.4748 37.3321L42.511 36.3333C40.9648 35.5489 40.1972 34.5162 40.1972 33.4835V22.1973C40.1972 21.1702 40.9704 20.1375 42.511 19.3531L75.4161 2.58735C76.9567 1.80296 78.9825 1.40792 81.0028 1.40792ZM81.0028 0.279297C78.7173 0.279297 76.5503 0.742033 74.9025 1.58286L41.9974 18.3486C40.1069 19.3136 39.0686 20.6793 39.0686 22.1973V33.4835C39.0686 34.3639 39.4468 36.0342 41.9918 37.3321C39.4524 38.6301 39.0686 40.3004 39.0686 41.1751V52.4614C39.0686 53.3417 39.4468 55.0121 41.9918 56.31C39.4524 57.6079 39.0686 59.2783 39.0686 60.153V71.4393C39.0686 72.3196 39.4468 73.9899 41.9918 75.2879C39.4524 76.5858 39.0686 78.2561 39.0686 79.1308V90.4171C39.0686 91.2974 39.4467 92.9735 41.9974 94.2714L74.9025 111.037C76.5503 111.878 78.7173 112.341 81.0028 112.341C83.2883 112.341 85.4552 111.878 87.103 111.037L120.008 94.2714C122.559 92.9735 122.937 91.3031 122.937 90.4228V79.1365C122.937 78.2561 122.559 76.5858 120.014 75.2879C122.553 73.9899 122.937 72.3196 122.937 71.4449V60.1586C122.937 59.2783 122.559 57.6079 120.014 56.31C122.553 55.0121 122.937 53.3417 122.937 52.467V41.1807C122.937 40.3004 122.559 38.6301 120.014 37.3321C122.553 36.0342 122.937 34.3639 122.937 33.4892V22.2029C122.937 21.3226 122.559 19.6466 120.008 18.3486L87.103 1.58286C85.4552 0.742033 83.2883 0.279297 81.0028 0.279297Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M40.1973 79.1365C40.1973 80.1692 40.9648 81.1962 42.511 81.9863L75.4162 98.752C78.503 100.326 83.5027 100.326 86.5895 98.752L119.495 81.9863C121.035 81.2019 121.808 80.1692 121.808 79.1421V90.4284C121.808 91.4554 121.035 92.4881 119.495 93.2725L86.5895 110.038C83.5027 111.613 78.503 111.613 75.4162 110.038L42.511 93.2725C40.9648 92.4881 40.1973 91.4554 40.1973 90.4227V79.1365Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M1 104.621C1 106.754 2.597 108.881 5.78537 110.512L46.8392 131.431C53.2216 134.682 63.5656 134.682 69.9479 131.431L156.215 87.4769C159.403 85.8516 161 83.7242 161 81.5911V88.4023C161 90.5354 159.403 92.6629 156.215 94.2881L69.9479 138.243C63.5656 141.493 53.2216 141.493 46.8392 138.243L5.78537 117.323C2.59135 115.698 1 113.565 1 111.432V104.621Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M1 104.621C1 102.488 2.597 100.36 5.78537 98.735L92.0521 54.7806C98.4344 51.5302 108.778 51.5302 115.161 54.7806L156.215 75.6997C159.409 77.3249 161 79.458 161 81.5912C161 83.7243 159.403 85.8517 156.215 87.4769L69.9479 131.431C63.5656 134.682 53.2216 134.682 46.8392 131.431L5.78537 110.512C2.59135 108.887 1 106.754 1 104.621Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M81.0027 111.782C78.8075 111.782 76.7308 111.342 75.162 110.541L42.2571 93.7749C40.5642 92.9115 39.6328 91.7208 39.6328 90.4229V79.1366C39.6328 77.8387 40.5642 76.6536 42.2571 75.7902L43.2333 75.2936L42.2571 74.797C40.5642 73.9336 39.6328 72.7429 39.6328 71.445V60.1587C39.6328 58.8608 40.5642 57.6757 42.2571 56.8123L43.2333 56.3157L42.2571 55.8191C40.5642 54.9557 39.6328 53.765 39.6328 52.4671V41.1808C39.6328 39.8829 40.5642 38.6979 42.2571 37.8345L43.2333 37.3379L42.2571 36.8413C40.5642 35.9779 39.6328 34.7872 39.6328 33.4893V22.203C39.6328 20.9051 40.5642 19.72 42.2571 18.8566L75.162 2.09086C76.7308 1.28954 78.8075 0.849365 81.0027 0.849365C83.1979 0.849365 85.2746 1.28954 86.8434 2.09086L119.749 18.8566C121.441 19.72 122.373 20.9107 122.373 22.2086V33.4949C122.373 34.7928 121.441 35.9779 119.749 36.8413L118.772 37.3379L119.749 37.8345C121.441 38.6979 122.373 39.8886 122.373 41.1865V52.4728C122.373 53.7707 121.441 54.9557 119.749 55.8191L118.772 56.3157L119.749 56.8123C121.441 57.6757 122.373 58.8664 122.373 60.1644V71.4506C122.373 72.7486 121.441 73.9336 119.749 74.797L118.772 75.2936L119.749 75.7902C121.441 76.6536 122.373 77.8443 122.373 79.1422V90.4285C122.373 91.7264 121.441 92.9115 119.749 93.7749L86.8434 110.541C85.2746 111.342 83.1979 111.782 81.0027 111.782Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M81.0028 1.40792C83.023 1.40792 85.0489 1.80296 86.5894 2.58735L119.495 19.3531C121.041 20.1375 121.808 21.1702 121.808 22.2029V33.4892C121.808 34.5162 121.035 35.5489 119.495 36.3333L117.531 37.3321L119.495 38.331C121.041 39.1154 121.808 40.148 121.808 41.1807V52.467C121.808 53.4941 121.035 54.5268 119.495 55.3112L117.531 56.31L119.495 57.3088C121.041 58.0932 121.808 59.1259 121.808 60.1586V71.4449C121.808 72.4719 121.035 73.5046 119.495 74.289L117.531 75.2879L119.495 76.2867C121.041 77.0711 121.808 78.1038 121.808 79.1365V90.4228C121.808 91.4498 121.035 92.4825 119.495 93.2669L86.5894 110.033C85.0489 110.817 83.023 111.212 81.0028 111.212C78.9825 111.212 76.9567 110.817 75.4161 110.033L42.511 93.2669C40.9648 92.4825 40.1972 91.4498 40.1972 90.4171V79.1308C40.1972 78.1038 40.9704 77.0711 42.511 76.2867L44.4748 75.2879L42.511 74.289C40.9648 73.5046 40.1972 72.472 40.1972 71.4393V60.153C40.1972 59.1259 40.9704 58.0932 42.511 57.3088L44.4748 56.31L42.511 55.3112C40.9648 54.5268 40.1972 53.4941 40.1972 52.4614V41.1751C40.1972 40.1481 40.9704 39.1154 42.511 38.331L44.4748 37.3321L42.511 36.3333C40.9648 35.5489 40.1972 34.5162 40.1972 33.4835V22.1973C40.1972 21.1702 40.9704 20.1375 42.511 19.3531L75.4161 2.58735C76.9567 1.80296 78.9825 1.40792 81.0028 1.40792ZM81.0028 0.279297C78.7173 0.279297 76.5503 0.742033 74.9025 1.58286L41.9974 18.3486C40.1069 19.3136 39.0686 20.6793 39.0686 22.1973V33.4835C39.0686 34.3639 39.4468 36.0342 41.9918 37.3321C39.4524 38.6301 39.0686 40.3004 39.0686 41.1751V52.4614C39.0686 53.3417 39.4468 55.0121 41.9918 56.31C39.4524 57.6079 39.0686 59.2783 39.0686 60.153V71.4393C39.0686 72.3196 39.4468 73.9899 41.9918 75.2879C39.4524 76.5858 39.0686 78.2561 39.0686 79.1308V90.4171C39.0686 91.2974 39.4467 92.9735 41.9974 94.2714L74.9025 111.037C76.5503 111.878 78.7173 112.341 81.0028 112.341C83.2883 112.341 85.4552 111.878 87.103 111.037L120.008 94.2714C122.559 92.9735 122.937 91.3031 122.937 90.4228V79.1365C122.937 78.2561 122.559 76.5858 120.014 75.2879C122.553 73.9899 122.937 72.3196 122.937 71.4449V60.1586C122.937 59.2783 122.559 57.6079 120.014 56.31C122.553 55.0121 122.937 53.3417 122.937 52.467V41.1807C122.937 40.3004 122.559 38.6301 120.014 37.3321C122.553 36.0342 122.937 34.3639 122.937 33.4892V22.2029C122.937 21.3226 122.559 19.6466 120.008 18.3486L87.103 1.58286C85.4552 0.742033 83.2883 0.279297 81.0028 0.279297Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M40.1973 79.1365C40.1973 80.1692 40.9648 81.1962 42.511 81.9863L75.4162 98.752C78.503 100.326 83.5027 100.326 86.5895 98.752L119.495 81.9863C121.035 81.2019 121.808 80.1692 121.808 79.1421V90.4284C121.808 91.4554 121.035 92.4881 119.495 93.2725L86.5895 110.038C83.5027 111.613 78.503 111.613 75.4162 110.038L42.511 93.2725C40.9648 92.4881 40.1973 91.4554 40.1973 90.4227V79.1365Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M40.1973 79.1364C40.1973 78.1094 40.9704 77.0767 42.511 76.2923L75.4162 59.5265C78.503 57.9521 83.5027 57.9521 86.5895 59.5265L119.495 76.2923C121.041 77.0767 121.808 78.1094 121.808 79.1421C121.808 80.1748 121.035 81.2018 119.495 81.9862L86.5895 98.752C83.5027 100.326 78.503 100.326 75.4162 98.752L42.511 81.9862C40.9648 81.2018 40.1973 80.1691 40.1973 79.1364Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M105.946 97.2058L104.856 97.7588C104.636 97.8717 104.456 97.7475 104.456 97.4766V92.7477C104.456 92.4768 104.636 92.1721 104.856 92.0592L105.946 91.5062C106.166 91.3934 106.346 91.5175 106.346 91.7884V96.5173C106.346 96.7882 106.166 97.0929 105.946 97.2058Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M108.463 95.9248L107.373 96.4778C107.153 96.5907 106.973 96.4665 106.973 96.1957V91.4667C106.973 91.1958 107.153 90.8911 107.373 90.7782L108.463 90.2252C108.683 90.1123 108.863 90.2365 108.863 90.5074V95.2363C108.863 95.5072 108.683 95.8119 108.463 95.9248Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M110.979 94.6438L109.89 95.1968C109.67 95.3097 109.49 95.1855 109.49 94.9147V90.1857C109.49 89.9148 109.67 89.6101 109.89 89.4973L110.979 88.9442C111.199 88.8313 111.38 88.9555 111.38 89.2264V93.9553C111.38 94.2262 111.199 94.5309 110.979 94.6438Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M113.502 93.3571L112.413 93.9102C112.193 94.023 112.012 93.8989 112.012 93.628V88.899C112.012 88.6282 112.193 88.3235 112.413 88.2106L113.502 87.6576C113.722 87.5447 113.902 87.6689 113.902 87.9397V92.6687C113.902 92.9396 113.722 93.2443 113.502 93.3571Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M116.019 92.0761L114.929 92.6292C114.709 92.742 114.529 92.6179 114.529 92.347V87.6181C114.529 87.3472 114.709 87.0425 114.929 86.9296L116.019 86.3766C116.239 86.2637 116.419 86.3879 116.419 86.6587V91.3877C116.419 91.6586 116.239 91.9633 116.019 92.0761Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M118.536 90.7952L117.446 91.3482C117.226 91.461 117.046 91.3369 117.046 91.066V86.3371C117.046 86.0662 117.226 85.7615 117.446 85.6486L118.536 85.0956C118.756 84.9827 118.936 85.1069 118.936 85.3777V90.1067C118.936 90.3776 118.756 90.6823 118.536 90.7952Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M88.593 103.148C88.593 104.051 87.9893 105.089 87.25 105.467C86.5108 105.845 85.9067 105.422 85.9067 104.519C85.9067 103.616 86.5108 102.578 87.25 102.2C87.9893 101.822 88.593 102.245 88.593 103.148Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M92.7688 101.02C92.7688 101.923 92.165 102.962 91.4258 103.34C90.6865 103.718 90.0828 103.295 90.0828 102.392C90.0828 101.489 90.6865 100.451 91.4258 100.072C92.165 99.6943 92.7688 100.118 92.7688 101.02Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M96.9448 98.893C96.9448 99.7959 96.341 100.834 95.6018 101.212C94.8625 101.59 94.2588 101.167 94.2588 100.264C94.2588 99.3614 94.8625 98.3231 95.6018 97.945C96.341 97.5669 96.9448 97.9901 96.9448 98.893Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M40.1973 60.1587C40.1973 61.1914 40.9648 62.2185 42.511 63.0085L75.4162 79.7742C78.503 81.3487 83.5027 81.3487 86.5895 79.7742L119.495 63.0085C121.035 62.2241 121.808 61.1914 121.808 60.1643V71.4506C121.808 72.4777 121.035 73.5104 119.495 74.2948L86.5895 91.0605C83.5027 92.6349 78.503 92.6349 75.4162 91.0605L42.511 74.2948C40.9648 73.5104 40.1973 72.4777 40.1973 71.445V60.1587Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M40.1973 60.1586C40.1973 59.1316 40.9704 58.0989 42.511 57.3145L75.4162 40.5487C78.503 38.9743 83.5027 38.9743 86.5895 40.5487L119.495 57.3145C121.041 58.0989 121.808 59.1316 121.808 60.1643C121.808 61.197 121.035 62.2241 119.495 63.0085L86.5895 79.7742C83.5027 81.3486 78.503 81.3486 75.4162 79.7742L42.511 63.0085C40.9648 62.2241 40.1973 61.1913 40.1973 60.1586Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M105.946 78.228L104.856 78.781C104.636 78.8939 104.456 78.7697 104.456 78.4988V73.7699C104.456 73.499 104.636 73.1943 104.856 73.0815L105.946 72.5284C106.166 72.4156 106.346 72.5397 106.346 72.8106V77.5395C106.346 77.8104 106.166 78.1151 105.946 78.228Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M108.463 76.9414L107.373 77.4944C107.153 77.6073 106.973 77.4831 106.973 77.2123V72.4833C106.973 72.2124 107.153 71.9077 107.373 71.7948L108.463 71.2418C108.683 71.129 108.863 71.2531 108.863 71.524V76.2529C108.863 76.5238 108.683 76.8285 108.463 76.9414Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M110.979 75.6604L109.89 76.2134C109.67 76.3263 109.49 76.2021 109.49 75.9313V71.2023C109.49 70.9314 109.67 70.6267 109.89 70.5139L110.979 69.9608C111.199 69.8479 111.38 69.9721 111.38 70.243V74.9719C111.38 75.2428 111.199 75.5475 110.979 75.6604Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M113.502 74.3794L112.413 74.9324C112.193 75.0452 112.012 74.9211 112.012 74.6502V69.9213C112.012 69.6504 112.193 69.3457 112.413 69.2328L113.502 68.6798C113.722 68.5669 113.902 68.6911 113.902 68.962V73.6909C113.902 73.9618 113.722 74.2665 113.502 74.3794Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M116.019 73.0928L114.929 73.6458C114.709 73.7586 114.529 73.6345 114.529 73.3636V68.6347C114.529 68.3638 114.709 68.0591 114.929 67.9462L116.019 67.3932C116.239 67.2803 116.419 67.4045 116.419 67.6753V72.4043C116.419 72.6752 116.239 72.9799 116.019 73.0928Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M118.536 71.8117L117.446 72.3647C117.226 72.4776 117.046 72.3535 117.046 72.0826V67.3536C117.046 67.0828 117.226 66.7781 117.446 66.6652L118.536 66.1122C118.756 65.9993 118.936 66.1235 118.936 66.3943V71.1232C118.936 71.3941 118.756 71.6989 118.536 71.8117Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M88.593 84.1645C88.593 85.0674 87.9893 86.1058 87.25 86.4838C86.5108 86.8619 85.9067 86.4387 85.9067 85.5358C85.9067 84.6329 86.5108 83.5946 87.25 83.2165C87.9893 82.8384 88.593 83.2616 88.593 84.1645Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M92.7688 82.0371C92.7688 82.94 92.165 83.9783 91.4258 84.3564C90.6865 84.7345 90.0828 84.3113 90.0828 83.4084C90.0828 82.5055 90.6865 81.4671 91.4258 81.089C92.165 80.7109 92.7688 81.1342 92.7688 82.0371Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M96.9448 79.9096C96.9448 80.8125 96.341 81.8509 95.6018 82.229C94.8625 82.6071 94.2588 82.1838 94.2588 81.2809C94.2588 80.378 94.8625 79.3397 95.6018 78.9616C96.341 78.5835 96.9448 79.0067 96.9448 79.9096Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M40.1973 41.175C40.1973 42.2077 40.9648 43.2348 42.511 44.0248L75.4162 60.7906C78.503 62.365 83.5027 62.365 86.5895 60.7906L119.495 44.0248C121.035 43.2404 121.808 42.2077 121.808 41.1807V52.4669C121.808 53.494 121.035 54.5267 119.495 55.3111L86.5895 72.0768C83.5027 73.6513 78.503 73.6513 75.4162 72.0768L42.511 55.3111C40.9648 54.5267 40.1973 53.494 40.1973 52.4613V41.175Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M40.1973 41.175C40.1973 40.148 40.9704 39.1152 42.511 38.3308L75.4162 21.5651C78.503 19.9907 83.5027 19.9907 86.5895 21.5651L119.495 38.3308C121.041 39.1152 121.808 40.1479 121.808 41.1806C121.808 42.2133 121.035 43.2404 119.495 44.0248L86.5895 60.7905C83.5027 62.365 78.503 62.365 75.4162 60.7905L42.511 44.0248C40.9648 43.2404 40.1973 42.2077 40.1973 41.175Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M105.946 59.2443L104.856 59.7974C104.636 59.9103 104.456 59.7861 104.456 59.5152V54.7863C104.456 54.5154 104.636 54.2107 104.856 54.0978L105.946 53.5448C106.166 53.4319 106.346 53.5561 106.346 53.8269V58.5559C106.346 58.8268 106.166 59.1315 105.946 59.2443Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M108.463 57.9634L107.373 58.5164C107.153 58.6293 106.973 58.5051 106.973 58.2342V53.5053C106.973 53.2344 107.153 52.9297 107.373 52.8168L108.463 52.2638C108.683 52.1509 108.863 52.2751 108.863 52.5459V57.2749C108.863 57.5458 108.683 57.8505 108.463 57.9634Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M110.979 56.6767L109.89 57.2297C109.67 57.3426 109.49 57.2184 109.49 56.9476V52.2186C109.49 51.9478 109.67 51.643 109.89 51.5302L110.979 50.9772C111.199 50.8643 111.38 50.9885 111.38 51.2593V55.9883C111.38 56.2591 111.199 56.5639 110.979 56.6767Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M113.502 55.3957L112.413 55.9488C112.193 56.0616 112.012 55.9375 112.012 55.6666V50.9377C112.012 50.6668 112.193 50.362 112.413 50.2492L113.502 49.6962C113.722 49.5833 113.902 49.7074 113.902 49.9783V54.7073C113.902 54.9781 113.722 55.2829 113.502 55.3957Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M116.019 54.1147L114.929 54.6678C114.709 54.7806 114.529 54.6565 114.529 54.3856V49.6567C114.529 49.3858 114.709 49.0811 114.929 48.9682L116.019 48.4152C116.239 48.3023 116.419 48.4264 116.419 48.6973V53.4263C116.419 53.6971 116.239 54.0019 116.019 54.1147Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M118.536 52.8281L117.446 53.3811C117.226 53.494 117.046 53.3699 117.046 53.099V48.37C117.046 48.0992 117.226 47.7944 117.446 47.6815L118.536 47.1285C118.756 47.0157 118.936 47.1398 118.936 47.4107V52.1396C118.936 52.4105 118.756 52.7152 118.536 52.8281Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M88.593 65.1865C88.593 66.0894 87.9893 67.1277 87.25 67.5058C86.5108 67.8839 85.9067 67.4607 85.9067 66.5578C85.9067 65.6549 86.5108 64.6165 87.25 64.2384C87.9893 63.8604 88.593 64.2836 88.593 65.1865Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M92.7688 63.0534C92.7688 63.9563 92.165 64.9947 91.4258 65.3728C90.6865 65.7509 90.0828 65.3276 90.0828 64.4247C90.0828 63.5218 90.6865 62.4835 91.4258 62.1054C92.165 61.7273 92.7688 62.1505 92.7688 63.0534Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M96.9448 60.926C96.9448 61.8289 96.341 62.8673 95.6018 63.2453C94.8625 63.6234 94.2588 63.2002 94.2588 62.2973C94.2588 61.3944 94.8625 60.356 95.6018 59.9779C96.341 59.5999 96.9448 60.0231 96.9448 60.926Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M40.1973 22.1973C40.1973 23.23 40.9648 24.257 42.511 25.047L75.4162 41.8128C78.503 43.3872 83.5027 43.3872 86.5895 41.8128L119.495 25.047C121.035 24.2626 121.808 23.23 121.808 22.2029V33.4892C121.808 34.5162 121.035 35.5489 119.495 36.3333L86.5895 53.0991C83.5027 54.6735 78.503 54.6735 75.4162 53.0991L42.511 36.3333C40.9648 35.5489 40.1973 34.5162 40.1973 33.4835V22.1973Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M40.1973 22.1972C40.1973 21.1702 40.9704 20.1375 42.511 19.3531L75.4162 2.58732C78.503 1.01289 83.5027 1.01289 86.5895 2.58732L119.495 19.3531C121.041 20.1375 121.808 21.1702 121.808 22.2029C121.808 23.2356 121.035 24.2626 119.495 25.047L86.5895 41.8128C83.5027 43.3872 78.503 43.3872 75.4162 41.8128L42.511 25.047C40.9648 24.2626 40.1973 23.2299 40.1973 22.1972Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M105.946 40.261L104.856 40.814C104.636 40.9269 104.456 40.8027 104.456 40.5318V35.8029C104.456 35.532 104.636 35.2273 104.856 35.1144L105.946 34.5614C106.166 34.4485 106.346 34.5727 106.346 34.8436V39.5725C106.346 39.8434 106.166 40.1481 105.946 40.261Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M108.463 38.98L107.373 39.533C107.153 39.6459 106.973 39.5217 106.973 39.2508V34.5219C106.973 34.251 107.153 33.9463 107.373 33.8334L108.463 33.2804C108.683 33.1675 108.863 33.2917 108.863 33.5625V38.2915C108.863 38.5624 108.683 38.8671 108.463 38.98Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M110.979 37.6989L109.89 38.252C109.67 38.3648 109.49 38.2407 109.49 37.9698V33.2409C109.49 32.97 109.67 32.6653 109.89 32.5524L110.979 31.9994C111.199 31.8865 111.38 32.0107 111.38 32.2815V37.0105C111.38 37.2814 111.199 37.5861 110.979 37.6989Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M113.502 36.4123L112.413 36.9654C112.193 37.0782 112.012 36.9541 112.012 36.6832V31.9543C112.012 31.6834 112.193 31.3787 112.413 31.2658L113.502 30.7128C113.722 30.5999 113.902 30.724 113.902 30.9949V35.7239C113.902 35.9947 113.722 36.2995 113.502 36.4123Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M116.019 35.1313L114.929 35.6843C114.709 35.7972 114.529 35.673 114.529 35.4022V30.6732C114.529 30.4023 114.709 30.0976 114.929 29.9848L116.019 29.4318C116.239 29.3189 116.419 29.443 116.419 29.7139V34.4428C116.419 34.7137 116.239 35.0184 116.019 35.1313Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M118.536 33.8503L117.446 34.4034C117.226 34.5162 117.046 34.3921 117.046 34.1212V29.3922C117.046 29.1214 117.226 28.8166 117.446 28.7038L118.536 28.1507C118.756 28.0379 118.936 28.162 118.936 28.4329V33.1619C118.936 33.4327 118.756 33.7374 118.536 33.8503Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M88.593 46.2031C88.593 47.106 87.9893 48.1443 87.25 48.5224C86.5108 48.9005 85.9067 48.4773 85.9067 47.5744C85.9067 46.6715 86.5108 45.6331 87.25 45.2551C87.9893 44.877 88.593 45.3002 88.593 46.2031Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M92.7688 44.0757C92.7688 44.9786 92.165 46.0169 91.4258 46.395C90.6865 46.7731 90.0828 46.3498 90.0828 45.4469C90.0828 44.544 90.6865 43.5057 91.4258 43.1276C92.165 42.7495 92.7688 43.1728 92.7688 44.0757Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M96.9448 41.9482C96.9448 42.8511 96.341 43.8894 95.6018 44.2675C94.8625 44.6456 94.2588 44.2224 94.2588 43.3195C94.2588 42.4166 94.8625 41.3783 95.6018 41.0002C96.341 40.6221 96.9448 41.0453 96.9448 41.9482Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M111.323 50.7628C110.945 50.7628 110.584 50.6782 110.263 50.5145L105.234 47.9525C105.139 47.9017 105.048 47.851 104.958 47.7832C103.474 46.7336 103.406 44.0306 104.8 41.6209L111.216 30.5378L104.958 26.1136C103.474 25.064 103.401 22.3553 104.794 19.9513C105.799 18.2188 107.339 17.0959 108.722 17.0959C109.106 17.0959 109.461 17.1805 109.783 17.3442L114.811 19.9062C114.907 19.9513 114.997 20.0077 115.082 20.0698L116.634 21.1702L122.593 10.8828C123.603 9.14468 125.143 8.02173 126.526 8.02173C126.904 8.02173 127.26 8.10638 127.581 8.27003L132.609 10.832C132.705 10.8828 132.796 10.9336 132.886 10.9956C134.37 12.0453 134.443 14.754 133.049 17.158L126.633 28.2411L132.892 32.6653C134.376 33.7149 134.443 36.418 133.055 38.8163C132.045 40.5544 130.504 41.683 129.122 41.683C128.744 41.683 128.388 41.5984 128.067 41.4347L123.039 38.8727C122.943 38.8276 122.852 38.7712 122.762 38.7091L121.21 37.6087L115.251 47.8961C114.247 49.6342 112.7 50.7572 111.318 50.7572L111.323 50.7628Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M126.543 8.58594C126.825 8.58594 127.096 8.64799 127.344 8.77213L132.372 11.3341C132.446 11.368 132.513 11.4131 132.581 11.4583C133.811 12.3273 133.811 14.7595 132.581 16.8757L125.905 28.4046L132.581 33.1279C133.811 33.997 133.811 36.4179 132.581 38.5397C131.65 40.148 130.279 41.1242 129.139 41.1242C128.857 41.1242 128.586 41.0622 128.337 40.938L123.309 38.376C123.236 38.3422 123.168 38.297 123.101 38.2519L121.041 36.796L114.771 47.6195C113.84 49.2278 112.469 50.1984 111.323 50.1984C111.035 50.1984 110.765 50.1363 110.522 50.0122L105.494 47.4502C105.426 47.4164 105.353 47.3712 105.291 47.326C104.061 46.457 104.066 44.0305 105.291 41.9086L111.967 30.3797L105.291 25.6564C104.061 24.7874 104.061 22.3608 105.291 20.239C106.222 18.6363 107.588 17.6657 108.733 17.6657C109.021 17.6657 109.292 17.7278 109.54 17.852L114.568 20.4139C114.636 20.4478 114.704 20.493 114.771 20.5381L116.831 21.994L123.101 11.1705C124.032 9.56217 125.403 8.58594 126.548 8.58594M126.543 7.45731C124.94 7.45731 123.247 8.66491 122.118 10.6005L116.47 20.3519L115.42 19.6126C115.307 19.5336 115.194 19.4659 115.076 19.4038L110.048 16.8418C109.647 16.6387 109.201 16.5314 108.727 16.5314C107.125 16.5314 105.432 17.7334 104.309 19.669C102.768 22.3269 102.915 25.3573 104.636 26.5763L110.471 30.7014L104.309 41.3387C102.768 43.9966 102.909 47.027 104.631 48.2402C104.738 48.3192 104.856 48.387 104.975 48.449L110.003 51.011C110.403 51.2142 110.849 51.3214 111.318 51.3214C112.92 51.3214 114.619 50.1194 115.742 48.1782L121.391 38.4268L122.44 39.1661C122.553 39.2451 122.672 39.3185 122.79 39.3749L127.818 41.9369C128.219 42.14 128.659 42.2472 129.133 42.2472C130.736 42.2472 132.429 41.0396 133.552 39.0983C135.087 36.4461 134.945 33.4157 133.224 32.2024L127.389 28.0773L133.552 17.44C135.092 14.7821 134.945 11.7517 133.224 10.5328C133.111 10.4538 132.999 10.3861 132.88 10.324L127.852 7.76203C127.451 7.55887 127.011 7.45166 126.543 7.45166V7.45731Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      d="M121.447 36.0906L128.123 40.8139C128.191 40.859 128.258 40.9041 128.332 40.938L123.304 38.376C123.23 38.3422 123.163 38.297 123.095 38.2519L116.419 33.5286L121.447 36.0906Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M132.367 11.3341C131.131 10.702 129.285 11.7234 128.123 13.7324L121.447 25.2613L116.419 22.6993L123.095 11.1704C124.258 9.16709 126.103 8.14568 127.338 8.77207L132.367 11.3341Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M114.568 20.4139C113.332 19.7818 111.481 20.792 110.319 22.8009C109.089 24.9284 109.089 27.3549 110.319 28.2183L116.995 32.9416L111.967 30.3797L105.291 25.6564C104.061 24.7873 104.061 22.3607 105.291 20.2389C106.453 18.23 108.299 17.2255 109.54 17.8519L114.568 20.4139Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M117 32.9416L110.324 44.4705C109.094 46.5924 109.094 49.0189 110.324 49.888C110.392 49.9331 110.46 49.9782 110.528 50.0121L105.5 47.4501C105.426 47.4163 105.359 47.3711 105.297 47.326C104.066 46.4569 104.072 44.0304 105.297 41.9086L111.972 30.3796L117 32.9416Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M132.367 11.3341C132.44 11.3679 132.508 11.4131 132.575 11.4582C133.806 12.3273 133.806 14.7595 132.575 16.8756L125.9 28.4046L132.575 33.1279C133.806 33.9969 133.806 36.4178 132.575 38.5396C131.413 40.5486 129.568 41.5643 128.332 40.938C128.258 40.9041 128.191 40.859 128.123 40.8138L121.447 36.0905L114.771 47.6194C113.609 49.6228 111.763 50.6442 110.522 50.0121C110.449 49.9783 110.381 49.9331 110.319 49.888C109.089 49.0189 109.094 46.5924 110.319 44.4706L116.995 32.9416L110.319 28.2183C109.089 27.3493 109.089 24.9228 110.319 22.8009C111.481 20.792 113.327 19.7875 114.568 20.4139C114.636 20.4477 114.704 20.4929 114.771 20.538L121.447 25.2613L128.123 13.7324C129.285 11.7291 131.131 10.7077 132.367 11.3341Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+      <path
+        d="M40.1973 79.1364C40.1973 78.1094 40.9704 77.0767 42.511 76.2923L75.4162 59.5265C78.503 57.9521 83.5027 57.9521 86.5895 59.5265L119.495 76.2923C121.041 77.0767 121.808 78.1094 121.808 79.1421C121.808 80.1748 121.035 81.2018 119.495 81.9862L86.5895 98.752C83.5027 100.326 78.503 100.326 75.4162 98.752L42.511 81.9862C40.9648 81.2018 40.1973 80.1691 40.1973 79.1364Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M105.946 97.2058L104.856 97.7588C104.636 97.8717 104.456 97.7475 104.456 97.4766V92.7477C104.456 92.4768 104.636 92.1721 104.856 92.0592L105.946 91.5062C106.166 91.3934 106.346 91.5175 106.346 91.7884V96.5173C106.346 96.7882 106.166 97.0929 105.946 97.2058Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M108.463 95.9248L107.373 96.4778C107.153 96.5907 106.973 96.4665 106.973 96.1957V91.4667C106.973 91.1958 107.153 90.8911 107.373 90.7782L108.463 90.2252C108.683 90.1123 108.863 90.2365 108.863 90.5074V95.2363C108.863 95.5072 108.683 95.8119 108.463 95.9248Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M110.979 94.6438L109.89 95.1968C109.67 95.3097 109.49 95.1855 109.49 94.9147V90.1857C109.49 89.9148 109.67 89.6101 109.89 89.4973L110.979 88.9442C111.199 88.8313 111.38 88.9555 111.38 89.2264V93.9553C111.38 94.2262 111.199 94.5309 110.979 94.6438Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M113.502 93.3571L112.413 93.9102C112.193 94.023 112.012 93.8989 112.012 93.628V88.899C112.012 88.6282 112.193 88.3235 112.413 88.2106L113.502 87.6576C113.722 87.5447 113.902 87.6689 113.902 87.9397V92.6687C113.902 92.9396 113.722 93.2443 113.502 93.3571Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M116.019 92.0761L114.929 92.6292C114.709 92.742 114.529 92.6179 114.529 92.347V87.6181C114.529 87.3472 114.709 87.0425 114.929 86.9296L116.019 86.3766C116.239 86.2637 116.419 86.3879 116.419 86.6587V91.3877C116.419 91.6586 116.239 91.9633 116.019 92.0761Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M118.536 90.7952L117.446 91.3482C117.226 91.461 117.046 91.3369 117.046 91.066V86.3371C117.046 86.0662 117.226 85.7615 117.446 85.6486L118.536 85.0956C118.756 84.9827 118.936 85.1069 118.936 85.3777V90.1067C118.936 90.3776 118.756 90.6823 118.536 90.7952Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M88.593 103.148C88.593 104.051 87.9893 105.089 87.25 105.467C86.5108 105.845 85.9067 105.422 85.9067 104.519C85.9067 103.616 86.5108 102.578 87.25 102.2C87.9893 101.822 88.593 102.245 88.593 103.148Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M92.7688 101.02C92.7688 101.923 92.165 102.962 91.4258 103.34C90.6865 103.718 90.0828 103.295 90.0828 102.392C90.0828 101.489 90.6865 100.451 91.4258 100.072C92.165 99.6943 92.7688 100.118 92.7688 101.02Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M96.9448 98.893C96.9448 99.7959 96.341 100.834 95.6018 101.212C94.8625 101.59 94.2588 101.167 94.2588 100.264C94.2588 99.3614 94.8625 98.3231 95.6018 97.945C96.341 97.5669 96.9448 97.9901 96.9448 98.893Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M40.1973 60.1587C40.1973 61.1914 40.9648 62.2185 42.511 63.0085L75.4162 79.7742C78.503 81.3487 83.5027 81.3487 86.5895 79.7742L119.495 63.0085C121.035 62.2241 121.808 61.1914 121.808 60.1643V71.4506C121.808 72.4777 121.035 73.5104 119.495 74.2948L86.5895 91.0605C83.5027 92.6349 78.503 92.6349 75.4162 91.0605L42.511 74.2948C40.9648 73.5104 40.1973 72.4777 40.1973 71.445V60.1587Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M40.1973 60.1586C40.1973 59.1316 40.9704 58.0989 42.511 57.3145L75.4162 40.5487C78.503 38.9743 83.5027 38.9743 86.5895 40.5487L119.495 57.3145C121.041 58.0989 121.808 59.1316 121.808 60.1643C121.808 61.197 121.035 62.2241 119.495 63.0085L86.5895 79.7742C83.5027 81.3486 78.503 81.3486 75.4162 79.7742L42.511 63.0085C40.9648 62.2241 40.1973 61.1913 40.1973 60.1586Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M105.946 78.228L104.856 78.781C104.636 78.8939 104.456 78.7697 104.456 78.4988V73.7699C104.456 73.499 104.636 73.1943 104.856 73.0815L105.946 72.5284C106.166 72.4156 106.346 72.5397 106.346 72.8106V77.5395C106.346 77.8104 106.166 78.1151 105.946 78.228Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M108.463 76.9414L107.373 77.4944C107.153 77.6073 106.973 77.4831 106.973 77.2123V72.4833C106.973 72.2124 107.153 71.9077 107.373 71.7948L108.463 71.2418C108.683 71.129 108.863 71.2531 108.863 71.524V76.2529C108.863 76.5238 108.683 76.8285 108.463 76.9414Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M110.979 75.6604L109.89 76.2134C109.67 76.3263 109.49 76.2021 109.49 75.9313V71.2023C109.49 70.9314 109.67 70.6267 109.89 70.5139L110.979 69.9608C111.199 69.8479 111.38 69.9721 111.38 70.243V74.9719C111.38 75.2428 111.199 75.5475 110.979 75.6604Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M113.502 74.3794L112.413 74.9324C112.193 75.0452 112.012 74.9211 112.012 74.6502V69.9213C112.012 69.6504 112.193 69.3457 112.413 69.2328L113.502 68.6798C113.722 68.5669 113.902 68.6911 113.902 68.962V73.6909C113.902 73.9618 113.722 74.2665 113.502 74.3794Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M116.019 73.0928L114.929 73.6458C114.709 73.7586 114.529 73.6345 114.529 73.3636V68.6347C114.529 68.3638 114.709 68.0591 114.929 67.9462L116.019 67.3932C116.239 67.2803 116.419 67.4045 116.419 67.6753V72.4043C116.419 72.6752 116.239 72.9799 116.019 73.0928Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M118.536 71.8117L117.446 72.3647C117.226 72.4776 117.046 72.3535 117.046 72.0826V67.3536C117.046 67.0828 117.226 66.7781 117.446 66.6652L118.536 66.1122C118.756 65.9993 118.936 66.1235 118.936 66.3943V71.1232C118.936 71.3941 118.756 71.6989 118.536 71.8117Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M88.593 84.1645C88.593 85.0674 87.9893 86.1058 87.25 86.4838C86.5108 86.8619 85.9067 86.4387 85.9067 85.5358C85.9067 84.6329 86.5108 83.5946 87.25 83.2165C87.9893 82.8384 88.593 83.2616 88.593 84.1645Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M92.7688 82.0371C92.7688 82.94 92.165 83.9783 91.4258 84.3564C90.6865 84.7345 90.0828 84.3113 90.0828 83.4084C90.0828 82.5055 90.6865 81.4671 91.4258 81.089C92.165 80.7109 92.7688 81.1342 92.7688 82.0371Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M96.9448 79.9096C96.9448 80.8125 96.341 81.8509 95.6018 82.229C94.8625 82.6071 94.2588 82.1838 94.2588 81.2809C94.2588 80.378 94.8625 79.3397 95.6018 78.9616C96.341 78.5835 96.9448 79.0067 96.9448 79.9096Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M40.1973 41.175C40.1973 42.2077 40.9648 43.2348 42.511 44.0248L75.4162 60.7906C78.503 62.365 83.5027 62.365 86.5895 60.7906L119.495 44.0248C121.035 43.2404 121.808 42.2077 121.808 41.1807V52.4669C121.808 53.494 121.035 54.5267 119.495 55.3111L86.5895 72.0768C83.5027 73.6513 78.503 73.6513 75.4162 72.0768L42.511 55.3111C40.9648 54.5267 40.1973 53.494 40.1973 52.4613V41.175Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M40.1973 41.175C40.1973 40.148 40.9704 39.1152 42.511 38.3308L75.4162 21.5651C78.503 19.9907 83.5027 19.9907 86.5895 21.5651L119.495 38.3308C121.041 39.1152 121.808 40.1479 121.808 41.1806C121.808 42.2133 121.035 43.2404 119.495 44.0248L86.5895 60.7905C83.5027 62.365 78.503 62.365 75.4162 60.7905L42.511 44.0248C40.9648 43.2404 40.1973 42.2077 40.1973 41.175Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M105.946 59.2443L104.856 59.7974C104.636 59.9103 104.456 59.7861 104.456 59.5152V54.7863C104.456 54.5154 104.636 54.2107 104.856 54.0978L105.946 53.5448C106.166 53.4319 106.346 53.5561 106.346 53.8269V58.5559C106.346 58.8268 106.166 59.1315 105.946 59.2443Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M108.463 57.9634L107.373 58.5164C107.153 58.6293 106.973 58.5051 106.973 58.2342V53.5053C106.973 53.2344 107.153 52.9297 107.373 52.8168L108.463 52.2638C108.683 52.1509 108.863 52.2751 108.863 52.5459V57.2749C108.863 57.5458 108.683 57.8505 108.463 57.9634Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M110.979 56.6767L109.89 57.2297C109.67 57.3426 109.49 57.2184 109.49 56.9476V52.2186C109.49 51.9478 109.67 51.643 109.89 51.5302L110.979 50.9772C111.199 50.8643 111.38 50.9885 111.38 51.2593V55.9883C111.38 56.2591 111.199 56.5639 110.979 56.6767Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M113.502 55.3957L112.413 55.9488C112.193 56.0616 112.012 55.9375 112.012 55.6666V50.9377C112.012 50.6668 112.193 50.362 112.413 50.2492L113.502 49.6962C113.722 49.5833 113.902 49.7074 113.902 49.9783V54.7073C113.902 54.9781 113.722 55.2829 113.502 55.3957Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M116.019 54.1147L114.929 54.6678C114.709 54.7806 114.529 54.6565 114.529 54.3856V49.6567C114.529 49.3858 114.709 49.0811 114.929 48.9682L116.019 48.4152C116.239 48.3023 116.419 48.4264 116.419 48.6973V53.4263C116.419 53.6971 116.239 54.0019 116.019 54.1147Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M118.536 52.8281L117.446 53.3811C117.226 53.494 117.046 53.3699 117.046 53.099V48.37C117.046 48.0992 117.226 47.7944 117.446 47.6815L118.536 47.1285C118.756 47.0157 118.936 47.1398 118.936 47.4107V52.1396C118.936 52.4105 118.756 52.7152 118.536 52.8281Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M88.593 65.1865C88.593 66.0894 87.9893 67.1277 87.25 67.5058C86.5108 67.8839 85.9067 67.4607 85.9067 66.5578C85.9067 65.6549 86.5108 64.6165 87.25 64.2384C87.9893 63.8604 88.593 64.2836 88.593 65.1865Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M92.7688 63.0534C92.7688 63.9563 92.165 64.9947 91.4258 65.3728C90.6865 65.7509 90.0828 65.3276 90.0828 64.4247C90.0828 63.5218 90.6865 62.4835 91.4258 62.1054C92.165 61.7273 92.7688 62.1505 92.7688 63.0534Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M96.9448 60.926C96.9448 61.8289 96.341 62.8673 95.6018 63.2453C94.8625 63.6234 94.2588 63.2002 94.2588 62.2973C94.2588 61.3944 94.8625 60.356 95.6018 59.9779C96.341 59.5999 96.9448 60.0231 96.9448 60.926Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M40.1973 22.1973C40.1973 23.23 40.9648 24.257 42.511 25.047L75.4162 41.8128C78.503 43.3872 83.5027 43.3872 86.5895 41.8128L119.495 25.047C121.035 24.2626 121.808 23.23 121.808 22.2029V33.4892C121.808 34.5162 121.035 35.5489 119.495 36.3333L86.5895 53.0991C83.5027 54.6735 78.503 54.6735 75.4162 53.0991L42.511 36.3333C40.9648 35.5489 40.1973 34.5162 40.1973 33.4835V22.1973Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M40.1973 22.1972C40.1973 21.1702 40.9704 20.1375 42.511 19.3531L75.4162 2.58732C78.503 1.01289 83.5027 1.01289 86.5895 2.58732L119.495 19.3531C121.041 20.1375 121.808 21.1702 121.808 22.2029C121.808 23.2356 121.035 24.2626 119.495 25.047L86.5895 41.8128C83.5027 43.3872 78.503 43.3872 75.4162 41.8128L42.511 25.047C40.9648 24.2626 40.1973 23.2299 40.1973 22.1972Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M105.946 40.261L104.856 40.814C104.636 40.9269 104.456 40.8027 104.456 40.5318V35.8029C104.456 35.532 104.636 35.2273 104.856 35.1144L105.946 34.5614C106.166 34.4485 106.346 34.5727 106.346 34.8436V39.5725C106.346 39.8434 106.166 40.1481 105.946 40.261Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M108.463 38.98L107.373 39.533C107.153 39.6459 106.973 39.5217 106.973 39.2508V34.5219C106.973 34.251 107.153 33.9463 107.373 33.8334L108.463 33.2804C108.683 33.1675 108.863 33.2917 108.863 33.5625V38.2915C108.863 38.5624 108.683 38.8671 108.463 38.98Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M110.979 37.6989L109.89 38.252C109.67 38.3648 109.49 38.2407 109.49 37.9698V33.2409C109.49 32.97 109.67 32.6653 109.89 32.5524L110.979 31.9994C111.199 31.8865 111.38 32.0107 111.38 32.2815V37.0105C111.38 37.2814 111.199 37.5861 110.979 37.6989Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M113.502 36.4123L112.413 36.9654C112.193 37.0782 112.012 36.9541 112.012 36.6832V31.9543C112.012 31.6834 112.193 31.3787 112.413 31.2658L113.502 30.7128C113.722 30.5999 113.902 30.724 113.902 30.9949V35.7239C113.902 35.9947 113.722 36.2995 113.502 36.4123Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M116.019 35.1313L114.929 35.6843C114.709 35.7972 114.529 35.673 114.529 35.4022V30.6732C114.529 30.4023 114.709 30.0976 114.929 29.9848L116.019 29.4318C116.239 29.3189 116.419 29.443 116.419 29.7139V34.4428C116.419 34.7137 116.239 35.0184 116.019 35.1313Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M118.536 33.8503L117.446 34.4034C117.226 34.5162 117.046 34.3921 117.046 34.1212V29.3922C117.046 29.1214 117.226 28.8166 117.446 28.7038L118.536 28.1507C118.756 28.0379 118.936 28.162 118.936 28.4329V33.1619C118.936 33.4327 118.756 33.7374 118.536 33.8503Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M88.593 46.2031C88.593 47.106 87.9893 48.1443 87.25 48.5224C86.5108 48.9005 85.9067 48.4773 85.9067 47.5744C85.9067 46.6715 86.5108 45.6331 87.25 45.2551C87.9893 44.877 88.593 45.3002 88.593 46.2031Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M92.7688 44.0757C92.7688 44.9786 92.165 46.0169 91.4258 46.395C90.6865 46.7731 90.0828 46.3498 90.0828 45.4469C90.0828 44.544 90.6865 43.5057 91.4258 43.1276C92.165 42.7495 92.7688 43.1728 92.7688 44.0757Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M96.9448 41.9482C96.9448 42.8511 96.341 43.8894 95.6018 44.2675C94.8625 44.6456 94.2588 44.2224 94.2588 43.3195C94.2588 42.4166 94.8625 41.3783 95.6018 41.0002C96.341 40.6221 96.9448 41.0453 96.9448 41.9482Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M111.323 50.7628C110.945 50.7628 110.584 50.6782 110.263 50.5145L105.234 47.9525C105.139 47.9017 105.048 47.851 104.958 47.7832C103.474 46.7336 103.406 44.0306 104.8 41.6209L111.216 30.5378L104.958 26.1136C103.474 25.064 103.401 22.3553 104.794 19.9513C105.799 18.2188 107.339 17.0959 108.722 17.0959C109.106 17.0959 109.461 17.1805 109.783 17.3442L114.811 19.9062C114.907 19.9513 114.997 20.0077 115.082 20.0698L116.634 21.1702L122.593 10.8828C123.603 9.14468 125.143 8.02173 126.526 8.02173C126.904 8.02173 127.26 8.10638 127.581 8.27003L132.609 10.832C132.705 10.8828 132.796 10.9336 132.886 10.9956C134.37 12.0453 134.443 14.754 133.049 17.158L126.633 28.2411L132.892 32.6653C134.376 33.7149 134.443 36.418 133.055 38.8163C132.045 40.5544 130.504 41.683 129.122 41.683C128.744 41.683 128.388 41.5984 128.067 41.4347L123.039 38.8727C122.943 38.8276 122.852 38.7712 122.762 38.7091L121.21 37.6087L115.251 47.8961C114.247 49.6342 112.7 50.7572 111.318 50.7572L111.323 50.7628Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M126.543 8.58594C126.825 8.58594 127.096 8.64799 127.344 8.77213L132.372 11.3341C132.446 11.368 132.513 11.4131 132.581 11.4583C133.811 12.3273 133.811 14.7595 132.581 16.8757L125.905 28.4046L132.581 33.1279C133.811 33.997 133.811 36.4179 132.581 38.5397C131.65 40.148 130.279 41.1242 129.139 41.1242C128.857 41.1242 128.586 41.0622 128.337 40.938L123.309 38.376C123.236 38.3422 123.168 38.297 123.101 38.2519L121.041 36.796L114.771 47.6195C113.84 49.2278 112.469 50.1984 111.323 50.1984C111.035 50.1984 110.765 50.1363 110.522 50.0122L105.494 47.4502C105.426 47.4164 105.353 47.3712 105.291 47.326C104.061 46.457 104.066 44.0305 105.291 41.9086L111.967 30.3797L105.291 25.6564C104.061 24.7874 104.061 22.3608 105.291 20.239C106.222 18.6363 107.588 17.6657 108.733 17.6657C109.021 17.6657 109.292 17.7278 109.54 17.852L114.568 20.4139C114.636 20.4478 114.704 20.493 114.771 20.5381L116.831 21.994L123.101 11.1705C124.032 9.56217 125.403 8.58594 126.548 8.58594M126.543 7.45731C124.94 7.45731 123.247 8.66491 122.118 10.6005L116.47 20.3519L115.42 19.6126C115.307 19.5336 115.194 19.4659 115.076 19.4038L110.048 16.8418C109.647 16.6387 109.201 16.5314 108.727 16.5314C107.125 16.5314 105.432 17.7334 104.309 19.669C102.768 22.3269 102.915 25.3573 104.636 26.5763L110.471 30.7014L104.309 41.3387C102.768 43.9966 102.909 47.027 104.631 48.2402C104.738 48.3192 104.856 48.387 104.975 48.449L110.003 51.011C110.403 51.2142 110.849 51.3214 111.318 51.3214C112.92 51.3214 114.619 50.1194 115.742 48.1782L121.391 38.4268L122.44 39.1661C122.553 39.2451 122.672 39.3185 122.79 39.3749L127.818 41.9369C128.219 42.14 128.659 42.2472 129.133 42.2472C130.736 42.2472 132.429 41.0396 133.552 39.0983C135.087 36.4461 134.945 33.4157 133.224 32.2024L127.389 28.0773L133.552 17.44C135.092 14.7821 134.945 11.7517 133.224 10.5328C133.111 10.4538 132.999 10.3861 132.88 10.324L127.852 7.76203C127.451 7.55887 127.011 7.45166 126.543 7.45166V7.45731Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        d="M121.447 36.0906L128.123 40.8139C128.191 40.859 128.258 40.9041 128.332 40.938L123.304 38.376C123.23 38.3422 123.163 38.297 123.095 38.2519L116.419 33.5286L121.447 36.0906Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M132.367 11.3341C131.131 10.702 129.285 11.7234 128.123 13.7324L121.447 25.2613L116.419 22.6993L123.095 11.1704C124.258 9.16709 126.103 8.14568 127.338 8.77207L132.367 11.3341Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M114.568 20.4139C113.332 19.7818 111.481 20.792 110.319 22.8009C109.089 24.9284 109.089 27.3549 110.319 28.2183L116.995 32.9416L111.967 30.3797L105.291 25.6564C104.061 24.7873 104.061 22.3607 105.291 20.2389C106.453 18.23 108.299 17.2255 109.54 17.8519L114.568 20.4139Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M117 32.9416L110.324 44.4705C109.094 46.5924 109.094 49.0189 110.324 49.888C110.392 49.9331 110.46 49.9782 110.528 50.0121L105.5 47.4501C105.426 47.4163 105.359 47.3711 105.297 47.326C104.066 46.4569 104.072 44.0304 105.297 41.9086L111.972 30.3796L117 32.9416Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M132.367 11.3341C132.44 11.3679 132.508 11.4131 132.575 11.4582C133.806 12.3273 133.806 14.7595 132.575 16.8756L125.9 28.4046L132.575 33.1279C133.806 33.9969 133.806 36.4178 132.575 38.5396C131.413 40.5486 129.568 41.5643 128.332 40.938C128.258 40.9041 128.191 40.859 128.123 40.8138L121.447 36.0905L114.771 47.6194C113.609 49.6228 111.763 50.6442 110.522 50.0121C110.449 49.9783 110.381 49.9331 110.319 49.888C109.089 49.0189 109.094 46.5924 110.319 44.4706L116.995 32.9416L110.319 28.2183C109.089 27.3493 109.089 24.9228 110.319 22.8009C111.481 20.792 113.327 19.7875 114.568 20.4139C114.636 20.4477 114.704 20.4929 114.771 20.538L121.447 25.2613L128.123 13.7324C129.285 11.7291 131.131 10.7077 132.367 11.3341Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx b/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx
index bf1ba1fa8..adf19b290 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="188"
-    viewBox="0 0 162 188"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function TeamspaceVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="188"
+      viewBox="0 0 162 188"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M13.3344 153.703C13.3344 155.665 14.8035 157.623 17.7366 159.123L55.503 178.367C61.3744 181.357 70.8899 181.357 76.7613 178.367L156.12 137.932C159.053 136.437 160.522 134.48 160.522 132.518V138.783C160.522 140.746 159.053 142.703 156.12 144.198L76.7613 184.633C70.8899 187.623 61.3744 187.623 55.503 184.633L17.7366 165.389C14.7983 163.894 13.3344 161.931 13.3344 159.969V153.703Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M13.3344 153.703C13.3344 151.741 14.8035 149.784 17.7366 148.289L97.0955 107.854C102.967 104.864 112.482 104.864 118.354 107.854L156.12 127.098C159.058 128.593 160.522 130.555 160.522 132.518C160.522 134.48 159.053 136.437 156.12 137.932L76.7613 178.367C70.89 181.357 61.3744 181.357 55.5031 178.367L17.7366 159.123C14.7983 157.628 13.3344 155.666 13.3344 153.703Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M13.3344 133.909C13.3344 135.871 14.8035 137.829 17.7366 139.329L55.503 158.573C61.3744 161.563 70.8899 161.563 76.7613 158.573L156.12 118.138C159.053 116.643 160.522 114.686 160.522 112.724V118.989C160.522 120.952 159.053 122.909 156.12 124.404L76.7613 164.839C70.8899 167.829 61.3744 167.829 55.503 164.839L17.7366 145.595C14.7983 144.1 13.3344 142.137 13.3344 140.175V133.909Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M13.3344 133.909C13.3344 131.947 14.8035 129.99 17.7366 128.495L97.0955 88.06C102.967 85.0698 112.482 85.0698 118.354 88.06L156.12 107.304C159.058 108.799 160.522 110.761 160.522 112.724C160.522 114.686 159.053 116.643 156.12 118.138L76.7613 158.573C70.8899 161.563 61.3744 161.563 55.503 158.573L17.7366 139.329C14.7983 137.834 13.3344 135.872 13.3344 133.909Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M13.3344 153.703C13.3344 155.665 14.8035 157.623 17.7366 159.123L55.503 178.367C61.3744 181.357 70.8899 181.357 76.7613 178.367L156.12 137.932C159.053 136.437 160.522 134.48 160.522 132.518V138.783C160.522 140.746 159.053 142.703 156.12 144.198L76.7613 184.633C70.8899 187.623 61.3744 187.623 55.503 184.633L17.7366 165.389C14.7983 163.894 13.3344 161.931 13.3344 159.969V153.703Z"
+        d="M13.3344 114.109C13.3344 116.072 14.8035 118.029 17.7366 119.529L55.5031 138.773C61.3744 141.763 70.89 141.763 76.7613 138.773L156.12 98.3383C159.053 96.8432 160.522 94.8861 160.522 92.9238V99.1897C160.522 101.152 159.053 103.109 156.12 104.604L76.7613 145.039C70.89 148.029 61.3744 148.029 55.5031 145.039L17.7366 125.795C14.7983 124.3 13.3344 122.338 13.3344 120.375V114.109Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -20,17 +56,177 @@ export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationA
         strokeLinejoin="round"
       />
       <path
-        d="M13.3344 153.703C13.3344 151.741 14.8035 149.784 17.7366 148.289L97.0955 107.854C102.967 104.864 112.482 104.864 118.354 107.854L156.12 127.098C159.058 128.593 160.522 130.555 160.522 132.518C160.522 134.48 159.053 136.437 156.12 137.932L76.7613 178.367C70.89 181.357 61.3744 181.357 55.5031 178.367L17.7366 159.123C14.7983 157.628 13.3344 155.666 13.3344 153.703Z"
+        d="M13.3344 114.109C13.3344 112.147 14.8036 110.19 17.7366 108.695L97.0955 68.2602C102.967 65.27 112.482 65.27 118.354 68.2602L156.12 87.5042C159.058 88.9993 160.522 90.9616 160.522 92.9239C160.522 94.8862 159.053 96.8433 156.12 98.3384L76.7613 138.773C70.89 141.763 61.3744 141.763 55.5031 138.773L17.7366 119.529C14.7984 118.034 13.3344 116.072 13.3344 114.109Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M13.3344 133.909C13.3344 135.871 14.8035 137.829 17.7366 139.329L55.503 158.573C61.3744 161.563 70.8899 161.563 76.7613 158.573L156.12 118.138C159.053 116.643 160.522 114.686 160.522 112.724V118.989C160.522 120.952 159.053 122.909 156.12 124.404L76.7613 164.839C70.8899 167.829 61.3744 167.829 55.503 164.839L17.7366 145.595C14.7983 144.1 13.3344 142.137 13.3344 140.175V133.909Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M54.2572 118.419C53.3643 118.419 52.487 118.336 51.646 118.18C51.5266 118.16 51.4176 118.118 51.3138 118.066L47.2231 115.979C47.0517 115.891 46.9064 115.767 46.787 115.606C46.6157 115.377 46.5119 115.076 46.4807 114.744C46.2575 112.371 47.3009 107.923 47.9446 105.483C48.2042 104.496 48.5157 103.624 48.8998 102.814C49.9433 100.618 51.2359 98.6042 52.7466 96.8288C54.5479 94.7056 56.5933 93.0288 58.6646 91.9802C60.3362 91.1288 61.9766 90.6927 63.534 90.6927C63.6275 90.6927 63.7157 90.6927 63.8092 90.6927C64.8993 90.7291 65.9168 90.9834 66.8357 91.4558L70.9316 93.5427C71.404 93.7815 71.8504 94.0826 72.2657 94.4304C72.3021 94.4616 72.3384 94.4927 72.3695 94.5239C72.7174 93.5012 73.1275 92.5252 73.5791 91.622C74.9444 88.8965 76.5952 86.3944 78.4849 84.1725C80.9507 81.2706 83.7488 78.976 86.5832 77.5329C88.8622 76.37 91.0841 75.7782 93.1969 75.7782C93.3215 75.7782 93.4513 75.7782 93.5759 75.7834C95.0398 75.8301 96.4155 76.1779 97.6562 76.8113L101.269 78.649C101.295 78.5452 101.321 78.4517 101.347 78.3583C101.607 77.3719 101.918 76.4998 102.302 75.69C103.346 73.4941 104.638 71.4799 106.149 69.7044C107.95 67.5812 109.996 65.9044 112.067 64.8558C113.739 64.0044 115.374 63.5684 116.937 63.5684C117.03 63.5684 117.118 63.5684 117.212 63.5684C118.302 63.6047 119.319 63.8591 120.238 64.3263L124.334 66.4132C124.807 66.652 125.253 66.9531 125.668 67.3061C126.878 68.3339 127.766 69.7667 128.311 71.5681C128.845 73.3331 129.017 75.3525 128.825 77.5692C128.799 77.8859 128.71 78.2233 128.575 78.54C128.44 78.8566 128.259 79.1629 128.046 79.4173C124.583 83.5963 120.638 86.8823 116.641 88.9121C113.645 90.4384 110.723 91.2378 107.945 91.2845C107.961 92.193 107.93 93.1274 107.847 94.0722C107.81 94.4875 107.696 94.934 107.52 95.3545C107.343 95.775 107.099 96.1747 106.819 96.5121C102.064 102.254 96.6491 106.765 91.1567 109.553C86.9103 111.717 82.7832 112.813 78.8898 112.813C77.675 112.813 76.4758 112.704 75.3286 112.486C75.1936 112.46 75.0638 112.418 74.9392 112.356L71.0665 110.383C68.554 112.771 65.9272 114.666 63.2485 116.031C60.1493 117.609 57.1332 118.409 54.2832 118.409L54.2572 118.419Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M116.916 64.0968C117.004 64.0968 117.087 64.0968 117.175 64.0968C118.188 64.1332 119.132 64.372 119.984 64.8029L124.08 66.8897C124.516 67.113 124.931 67.3881 125.31 67.7152C126.431 68.6704 127.278 70.0408 127.791 71.7332C128.305 73.4255 128.472 75.4034 128.285 77.537C128.264 77.8018 128.191 78.0821 128.077 78.3521C127.963 78.622 127.807 78.8816 127.625 79.0996C124.204 83.2318 120.326 86.4608 116.381 88.4647C113.287 90.0376 110.344 90.7851 107.655 90.7851C107.566 90.7851 107.478 90.7851 107.39 90.7851C107.431 91.8338 107.405 92.9239 107.307 94.0453C107.276 94.4086 107.177 94.798 107.016 95.1718C106.86 95.5455 106.647 95.8985 106.393 96.1996C101.679 101.894 96.3324 106.349 90.8972 109.105C86.6351 111.275 82.5704 112.308 78.8638 112.308C77.6698 112.308 76.5122 112.199 75.4012 111.991C75.3078 111.976 75.2195 111.945 75.1365 111.903C75.0015 111.836 74.8821 111.732 74.7835 111.597C74.7835 111.597 74.7835 111.597 74.7835 111.592V111.597C74.8769 111.722 74.9911 111.825 75.1261 111.893L71.0406 109.811C71.0146 109.796 70.9887 109.775 70.9627 109.759C68.4242 112.215 65.7247 114.193 62.9941 115.579C59.9001 117.152 56.9515 117.904 54.2676 117.904C53.4007 117.904 52.5597 117.826 51.755 117.676C51.6875 117.666 51.6201 117.64 51.563 117.608L47.467 115.522C47.3684 115.47 47.2802 115.397 47.2075 115.298C47.0933 115.143 47.0206 114.935 46.9998 114.696C46.7818 112.37 47.8668 107.844 48.4534 105.617C48.687 104.734 48.9829 103.867 49.3774 103.042C50.3897 100.908 51.6772 98.9043 53.1463 97.1704C54.9113 95.0939 56.8892 93.469 58.9034 92.4464C60.4971 91.6313 62.0701 91.216 63.534 91.216C63.6223 91.216 63.7053 91.216 63.7936 91.216C64.8059 91.2524 65.7507 91.4912 66.602 91.922L70.698 94.0089C71.134 94.2321 71.5493 94.5073 71.9283 94.8343C72.1671 95.0368 72.3903 95.2652 72.6031 95.504C72.9821 94.2529 73.4597 93.033 74.0463 91.8649C75.3857 89.2018 77.0261 86.7048 78.8846 84.5193C81.3141 81.6589 84.0447 79.4163 86.822 78.0094C89.0127 76.8881 91.1827 76.3119 93.2021 76.3119C93.3215 76.3119 93.4409 76.3119 93.5603 76.3171C94.9567 76.3638 96.2597 76.6961 97.4226 77.2879L101.519 79.3747C101.394 79.3124 101.264 79.2502 101.129 79.193C101.259 79.2502 101.389 79.3124 101.519 79.3799C101.55 79.3955 101.581 79.4163 101.612 79.4318C101.695 79.0944 101.778 78.7881 101.851 78.513C102.084 77.6305 102.38 76.7635 102.775 75.9381C103.787 73.8045 105.075 71.8007 106.544 70.0668C108.309 67.9903 110.287 66.3654 112.301 65.3427C113.894 64.5277 115.467 64.1124 116.931 64.1124M98.6945 78.487C98.6945 78.487 98.6737 78.487 98.6685 78.487C98.6789 78.487 98.6893 78.487 98.6945 78.487ZM101.056 79.1567C101.056 79.1567 101.02 79.1411 101.005 79.1359C101.02 79.1411 101.041 79.1515 101.056 79.1567ZM79.1649 92.0207C79.248 91.8701 79.3362 91.7248 79.4193 91.5742C79.331 91.7196 79.248 91.8701 79.1649 92.0207ZM78.8119 92.6384C78.7133 92.8149 78.625 92.9914 78.5264 93.1679C78.6198 92.9914 78.7133 92.8149 78.8119 92.6384ZM78.0592 94.0868C78.0176 94.1699 77.9761 94.2529 77.9346 94.3412C77.9761 94.2581 78.0176 94.175 78.0592 94.0868C78.1215 93.9622 78.1786 93.8428 78.2409 93.7234C78.1786 93.8428 78.1163 93.9674 78.0592 94.0868ZM75.801 101.007C76.045 99.9529 76.2889 99.0029 76.4914 98.2398C76.8029 97.051 77.2078 95.8882 77.7269 94.772C77.6906 94.8499 77.6491 94.9278 77.6127 95.0056C77.1922 95.9141 76.8548 96.8589 76.6004 97.8297C76.3824 98.6395 76.0969 99.7505 75.8062 101.002M75.7854 101.069C75.7594 101.178 75.7335 101.282 75.7127 101.391C75.6868 101.515 75.6556 101.635 75.6297 101.759C75.6556 101.635 75.6868 101.51 75.7127 101.391C75.7387 101.282 75.7646 101.173 75.7854 101.069ZM75.3857 102.881C75.3493 103.057 75.313 103.239 75.2767 103.421C75.313 103.239 75.3493 103.062 75.3857 102.881C75.3857 102.881 75.3857 102.876 75.3857 102.87C75.3857 102.87 75.3857 102.876 75.3857 102.881ZM74.9392 105.181C74.9652 105.03 74.9911 104.879 75.0223 104.729C74.9963 104.879 74.9652 105.03 74.9392 105.181ZM74.5239 108.29C74.5135 108.399 74.5032 108.508 74.498 108.612C74.5032 108.508 74.5187 108.394 74.5239 108.29ZM74.472 109.095C74.472 109.147 74.4668 109.204 74.4616 109.256C74.4616 109.302 74.4616 109.344 74.4564 109.391C74.4564 109.349 74.4564 109.302 74.4616 109.256C74.4616 109.204 74.4668 109.147 74.472 109.095ZM74.4772 110.564C74.4772 110.626 74.4772 110.699 74.4876 110.756C74.4876 110.756 74.4876 110.756 74.4876 110.761C74.4876 110.761 74.4876 110.761 74.4876 110.751C74.4824 110.688 74.4824 110.621 74.4772 110.559M75.1209 111.888H75.1313C75.1313 111.888 75.1261 111.888 75.1209 111.888ZM116.916 63.0586C115.275 63.0586 113.557 63.5102 111.813 64.4031C109.684 65.4829 107.587 67.2064 105.739 69.3764C104.202 71.1881 102.884 73.2387 101.82 75.4761C101.467 76.2236 101.171 77.0231 100.922 77.9056L97.8846 76.3586C96.5712 75.6889 95.1229 75.3256 93.5811 75.2788C93.4513 75.2788 93.3215 75.2736 93.1865 75.2736C90.9906 75.2736 88.6857 75.881 86.334 77.0854C83.4425 78.5545 80.5873 80.8958 78.0799 83.8496C76.1644 86.1026 74.4928 88.6411 73.1067 91.4029C72.7433 92.1245 72.4163 92.8824 72.1152 93.6819C71.8089 93.4586 71.487 93.2666 71.1548 93.0953L67.0589 91.0084C66.0725 90.5048 64.9824 90.2297 63.8143 90.1933C63.7157 90.1933 63.6171 90.1933 63.5236 90.1933C61.8832 90.1933 60.1649 90.645 58.4206 91.5379C56.2922 92.6177 54.1949 94.3412 52.3468 96.5111C50.8102 98.3229 49.4916 100.373 48.4274 102.611C48.0277 103.452 47.7058 104.35 47.4359 105.367C46.7818 107.844 45.7228 112.36 45.9564 114.81C45.9979 115.241 46.1381 115.631 46.3665 115.932C46.5326 116.16 46.7455 116.337 46.9894 116.461L51.0854 118.548C51.2359 118.626 51.3916 118.678 51.5578 118.709C52.4299 118.875 53.3384 118.958 54.2624 118.958C57.1955 118.958 60.2895 118.138 63.4613 116.523C66.0881 115.189 68.6682 113.346 71.134 111.041L74.6537 112.832C74.6537 112.832 74.6641 112.838 74.6693 112.838C74.6745 112.838 74.6797 112.843 74.6848 112.848C74.851 112.931 75.0275 112.988 75.2092 113.025C76.3876 113.248 77.6179 113.362 78.8638 113.362C82.8455 113.362 87.0504 112.246 91.3696 110.045C96.9242 107.226 102.396 102.668 107.198 96.8745C107.509 96.4955 107.779 96.0543 107.976 95.5871C108.174 95.1147 108.303 94.6163 108.345 94.1491C108.412 93.3652 108.449 92.5813 108.449 91.8182C111.148 91.6832 113.972 90.8734 116.853 89.4043C120.918 87.3433 124.916 84.0105 128.425 79.7797C128.674 79.4786 128.876 79.1411 129.032 78.7777C129.188 78.404 129.287 78.025 129.318 77.646C129.52 75.3671 129.338 73.2802 128.783 71.4529C128.207 69.5581 127.267 68.0422 125.98 66.9469C125.538 66.5679 125.056 66.246 124.547 65.9917L120.451 63.9048C119.465 63.4012 118.375 63.1261 117.207 63.0897C117.108 63.0897 117.009 63.0897 116.916 63.0897V63.0586Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M114.019 63.3399C113.318 63.3399 112.664 63.1893 112.078 62.8883L107.982 60.8014C107.81 60.7131 107.644 60.6145 107.488 60.5003C106.092 59.5087 105.318 57.6814 105.318 55.3453C105.318 53.0093 106.035 50.6161 107.338 48.3683C108.646 46.1153 110.39 44.3502 112.254 43.4002C113.214 42.9123 114.159 42.6631 115.057 42.6631C115.758 42.6631 116.412 42.8136 116.999 43.1147L121.095 45.2016C121.266 45.2899 121.432 45.3885 121.588 45.5027C122.984 46.4942 123.758 48.3216 123.758 50.6576C123.758 52.9937 123.041 55.3869 121.738 57.6347C120.43 59.8877 118.686 61.6579 116.822 62.6027C115.862 63.0907 114.917 63.3399 114.019 63.3399Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M115.057 43.1818C115.67 43.1818 116.246 43.3116 116.76 43.5763L120.856 45.6632C121.007 45.7411 121.147 45.8242 121.287 45.9228C122.533 46.8053 123.234 48.508 123.234 50.652C123.234 52.796 122.533 55.2152 121.287 57.3695C120.041 59.5239 118.349 61.237 116.584 62.1351C115.691 62.5868 114.819 62.8152 114.014 62.8152C113.401 62.8152 112.825 62.6854 112.311 62.4206L108.215 60.3338C108.065 60.2559 107.925 60.1728 107.784 60.0742C106.538 59.1917 105.838 57.4889 105.838 55.3449C105.838 53.201 106.538 50.7818 107.784 48.6274C109.03 46.4731 110.723 44.76 112.488 43.8619C113.381 43.4102 114.253 43.1818 115.057 43.1818ZM115.057 42.1436C114.076 42.1436 113.053 42.4083 112.015 42.9378C110.063 43.9345 108.241 45.7722 106.886 48.1083C105.542 50.434 104.799 53.0037 104.799 55.3449C104.799 57.8523 105.646 59.8354 107.187 60.9256C107.364 61.0501 107.556 61.1644 107.748 61.263L111.844 63.3499C112.503 63.6873 113.235 63.8586 114.019 63.8586C115 63.8586 116.023 63.5939 117.061 63.0644C119.013 62.0676 120.835 60.2299 122.19 57.8939C123.535 55.5682 124.277 52.9985 124.277 50.6572C124.277 48.1499 123.431 46.1668 121.889 45.0766C121.713 44.952 121.52 44.8378 121.328 44.7392L117.232 42.6523C116.573 42.3149 115.841 42.1436 115.057 42.1436Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M60.6269 90.459C59.9261 90.459 59.272 90.3085 58.6854 90.0074L54.5894 87.9205C54.4181 87.8323 54.252 87.7336 54.0963 87.6194C52.6998 86.6331 51.9315 84.8006 51.9315 82.4645C51.9315 80.1284 52.6479 77.7352 53.9509 75.4874C55.2591 73.2344 57.0034 71.4694 58.8671 70.5194C59.8274 70.0314 60.7722 69.7822 61.6703 69.7822C62.3712 69.7822 63.0253 69.9328 63.6119 70.2339L67.7078 72.3208C67.8791 72.409 68.0452 72.5076 68.2009 72.6218C69.5974 73.6082 70.3709 75.4407 70.3709 77.7768C70.3709 80.1128 69.6545 82.506 68.3515 84.7538C67.0433 87.0068 65.299 88.7719 63.4354 89.7219C62.475 90.2099 61.5302 90.459 60.6321 90.459H60.6269Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M61.6704 70.3009C62.2829 70.3009 62.8592 70.4307 63.3731 70.6955L67.469 72.7824C67.6195 72.8602 67.7597 72.9433 67.8999 73.0419C69.1458 73.9245 69.8466 75.6272 69.8466 77.7712C69.8466 79.9152 69.1458 82.3343 67.8999 84.4887C66.654 86.6431 64.9616 88.3562 63.1966 89.2543C62.3037 89.7059 61.4316 89.9343 60.6269 89.9343C60.0143 89.9343 59.4381 89.8045 58.9242 89.5398L54.8283 87.4529C54.6777 87.375 54.5376 87.292 54.3974 87.1933C53.1515 86.3108 52.4507 84.6081 52.4507 82.4641C52.4507 80.3201 53.1515 77.901 54.3974 75.7466C55.6433 73.5922 57.3356 71.8791 59.1007 70.981C59.9936 70.5294 60.8657 70.3009 61.6704 70.3009ZM61.6704 69.2627C60.6892 69.2627 59.6665 69.5274 58.6283 70.057C56.6764 71.0537 54.8542 72.8914 53.4993 75.2275C52.1548 77.5531 51.4124 80.1228 51.4124 82.4641C51.4124 84.9715 52.2586 86.9545 53.8004 88.0447C53.9769 88.1693 54.169 88.2835 54.3611 88.3821L58.457 90.469C59.1163 90.8064 59.8482 90.9778 60.6321 90.9778C61.6133 90.9778 62.6359 90.713 63.6742 90.1835C65.6261 89.1868 67.4482 87.3491 68.8032 85.013C70.1477 82.6873 70.89 80.1176 70.89 77.7764C70.89 75.269 70.0439 73.2859 68.5021 72.1958C68.3256 72.0712 68.1387 71.957 67.9414 71.8583L63.8455 69.7714C63.1862 69.434 62.4542 69.2627 61.6704 69.2627Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M87.6423 74.2721C86.7078 74.2721 85.8409 74.0697 85.057 73.67L80.9611 71.5831C80.7379 71.4689 80.5147 71.3339 80.3018 71.1833C78.4278 69.8596 77.3947 67.3885 77.3947 64.2374C77.3947 61.0863 78.3759 57.7847 80.1513 54.7166C81.9319 51.6434 84.3095 49.2347 86.848 47.942C88.1458 47.2827 89.4125 46.9453 90.6272 46.9453C91.5617 46.9453 92.4338 47.1478 93.2125 47.5475L97.3084 49.6344C97.5368 49.7486 97.7549 49.8836 97.9677 50.0341C99.8417 51.3579 100.875 53.8289 100.875 56.98C100.875 60.1311 99.8989 63.4328 98.1182 66.5008C96.3376 69.574 93.96 71.9828 91.4215 73.2754C90.1237 73.9347 88.857 74.2721 87.6423 74.2721Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M90.6272 47.4748C91.4734 47.4748 92.2676 47.6565 92.9788 48.0199L97.0748 50.1067C97.2824 50.2106 97.4797 50.33 97.6666 50.4649C99.3849 51.6797 100.35 54.0262 100.35 56.9852C100.35 59.9442 99.3849 63.277 97.6666 66.2464C95.9483 69.2158 93.6122 71.5778 91.1827 72.8185C89.9523 73.4467 88.7532 73.7582 87.6422 73.7582C86.7961 73.7582 86.0018 73.5765 85.2906 73.2131L81.1947 71.1262C80.9922 71.0224 80.7898 70.903 80.6029 70.768C78.8846 69.5532 77.919 67.2068 77.919 64.2478C77.919 61.2887 78.8846 57.9559 80.6029 54.9865C82.3212 52.0171 84.6573 49.6551 87.0868 48.4144C88.3171 47.7863 89.5163 47.4748 90.6272 47.4748ZM90.6272 46.4365C89.3346 46.4365 87.9849 46.7895 86.6144 47.4903C83.9876 48.8297 81.5321 51.3059 79.7048 54.4674C77.8827 57.6133 76.8807 61.0863 76.8807 64.2478C76.8807 67.5754 77.9917 70.1918 80.0059 71.6194C80.2343 71.7803 80.4783 71.9308 80.7275 72.0554L84.8234 74.1423C85.6799 74.5784 86.6299 74.8016 87.6422 74.8016C88.9349 74.8016 90.2846 74.4486 91.6551 73.7478C94.2819 72.4084 96.7373 69.9322 98.5647 66.7707C100.387 63.6248 101.389 60.1518 101.389 56.9904C101.389 53.6628 100.278 51.0464 98.2636 49.6188C98.03 49.4527 97.7912 49.3073 97.542 49.1827L93.4461 47.0958C92.5895 46.6598 91.6395 46.4365 90.6272 46.4365Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M124.075 66.89C123.228 66.4591 122.284 66.2203 121.266 66.184C119.729 66.1321 118.063 66.5474 116.376 67.4091C114.362 68.4318 112.384 70.0567 110.619 72.1332C109.144 73.8671 107.862 75.8657 106.85 78.0045C106.455 78.8299 106.159 79.6969 105.926 80.5794C105.339 82.8064 104.254 87.3332 104.472 89.6589C104.493 89.8977 104.566 90.1053 104.68 90.2611C104.753 90.3597 104.836 90.4324 104.94 90.4843L100.844 88.3974C100.745 88.3455 100.657 88.2728 100.584 88.1742C100.47 88.0184 100.397 87.8108 100.376 87.572C100.158 85.2463 101.243 80.7195 101.83 78.4925C102.064 77.61 102.359 76.743 102.754 75.9176C103.766 73.784 105.054 71.7802 106.523 70.0463C108.288 67.9698 110.266 66.3449 112.28 65.3222C113.967 64.4605 115.634 64.0452 117.17 64.0971C118.182 64.1334 119.127 64.3722 119.979 64.8031L124.075 66.89Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M124.075 66.8897C124.511 67.1129 124.926 67.3881 125.305 67.7151C126.426 68.6703 127.272 70.0408 127.786 71.7332C128.3 73.4255 128.466 75.4034 128.28 77.537C128.259 77.8018 128.186 78.0821 128.072 78.352C127.958 78.622 127.802 78.8815 127.62 79.0996C124.199 83.2318 120.321 86.4608 116.376 88.4646C112.285 90.5463 108.444 91.1848 105.132 90.5567C105.064 90.5463 104.997 90.5204 104.94 90.4892C104.841 90.4373 104.753 90.3646 104.68 90.266C104.566 90.1103 104.493 89.9026 104.472 89.6638C104.254 87.3381 105.339 82.8113 105.926 80.5843C106.16 79.7018 106.455 78.8348 106.85 78.0094C107.862 75.8758 109.15 73.872 110.619 72.1381C112.384 70.0616 114.362 68.4367 116.376 67.414C118.063 66.5523 119.729 66.137 121.266 66.1889C122.278 66.2252 123.223 66.464 124.075 66.8949V66.8897Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M120.861 45.6629C119.667 45.0555 118.157 45.149 116.589 45.9484C114.824 46.8465 113.131 48.5648 111.886 50.714C110.64 52.8684 109.939 55.2823 109.939 57.4315C109.939 59.5807 110.64 61.2782 111.886 62.1607C112.026 62.2594 112.166 62.3476 112.316 62.4203L108.22 60.3334C108.07 60.2556 107.93 60.1725 107.79 60.0739C106.544 59.1913 105.843 57.4886 105.843 55.3446C105.843 53.1954 106.544 50.7815 107.79 48.6271C109.036 46.4727 110.728 44.7596 112.493 43.8615C114.061 43.0621 115.571 42.9686 116.765 43.576L120.861 45.6629Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M120.861 45.6629C121.012 45.7408 121.152 45.8239 121.292 45.9225C122.538 46.805 123.239 48.5077 123.239 50.6517C123.239 52.7957 122.538 55.2149 121.292 57.3692C120.046 59.5236 118.354 61.2367 116.589 62.1348C115.021 62.9343 113.51 63.0277 112.316 62.4203C112.166 62.3425 112.026 62.2594 111.886 62.1608C110.64 61.2783 109.939 59.5755 109.939 57.4315C109.939 55.2823 110.64 52.8684 111.886 50.714C113.131 48.5597 114.824 46.8465 116.589 45.9484C118.157 45.149 119.667 45.0556 120.861 45.6629Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M70.6824 94.0091C69.8362 93.5783 68.8914 93.3395 67.8739 93.3031C66.3373 93.2512 64.6709 93.6665 62.9838 94.5283C60.9695 95.551 58.9917 97.1758 57.2266 99.2523C55.7523 100.986 54.4701 102.985 53.4578 105.124C53.0632 105.949 52.7673 106.816 52.5337 107.699C51.9471 109.926 50.8621 114.452 51.0802 116.778C51.1009 117.017 51.1736 117.224 51.2878 117.38C51.3605 117.479 51.4436 117.552 51.5474 117.603L47.4515 115.517C47.3529 115.465 47.2646 115.392 47.1919 115.293C47.0777 115.138 47.005 114.93 46.9843 114.691C46.7662 112.365 47.8512 107.839 48.4378 105.612C48.6714 104.729 48.9673 103.862 49.3619 103.037C50.3742 100.903 51.6616 98.8993 53.1307 97.1654C54.8958 95.0889 56.8736 93.4641 58.8878 92.4414C60.575 91.5796 62.2414 91.1643 63.778 91.2162C64.7903 91.2526 65.7351 91.4914 66.5865 91.9223L70.6824 94.0091Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M70.6824 94.0089C71.1184 94.2321 71.5337 94.5072 71.9127 94.8343C73.034 95.7895 73.8802 97.16 74.3941 98.8523C74.9081 100.545 75.0742 102.523 74.8873 104.656C74.8665 104.921 74.7939 105.201 74.6796 105.471C74.5654 105.741 74.4097 106.001 74.228 106.219C70.807 110.351 66.9291 113.58 62.9837 115.584C58.893 117.665 55.0515 118.304 51.7394 117.676C51.672 117.665 51.6045 117.64 51.5474 117.608C51.4487 117.556 51.3605 117.484 51.2878 117.385C51.1736 117.229 51.1009 117.022 51.0802 116.783C50.8621 114.457 51.9471 109.93 52.5337 107.703C52.7673 106.821 53.0632 105.954 53.4578 105.129C54.4701 102.995 55.7575 100.991 57.2266 99.2572C58.9916 97.1807 60.9695 95.5559 62.9837 94.5332C64.6709 93.6714 66.3373 93.2561 67.8739 93.308C68.8862 93.3444 69.831 93.5832 70.6824 94.014V94.0089Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M67.469 72.7772C66.275 72.1698 64.7643 72.2632 63.1965 73.0627C61.4315 73.9608 59.7392 75.6791 58.4933 77.8283C57.2474 79.9826 56.5465 82.3966 56.5465 84.5458C56.5465 86.6949 57.2474 88.3925 58.4933 89.275C58.6334 89.3736 58.7736 89.4619 58.9241 89.5346L54.8282 87.4477C54.6777 87.3698 54.5375 87.2867 54.3973 87.1881C53.1514 86.3056 52.4506 84.6029 52.4506 82.4589C52.4506 80.3097 53.1514 77.8957 54.3973 75.7414C55.6433 73.587 57.3356 71.8739 59.1006 70.9758C60.6684 70.1763 62.1791 70.0829 63.373 70.6903L67.469 72.7772Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M67.469 72.7772C67.6195 72.8551 67.7597 72.9381 67.8999 73.0367C69.1458 73.9193 69.8466 75.622 69.8466 77.766C69.8466 79.91 69.1458 82.3291 67.8999 84.4835C66.654 86.6379 64.9616 88.351 63.1966 89.2491C61.6288 90.0485 60.1182 90.142 58.9242 89.5346C58.7736 89.4567 58.6335 89.3737 58.4933 89.275C57.2474 88.3925 56.5466 86.6898 56.5466 84.5458C56.5466 82.3966 57.2474 79.9827 58.4933 77.8283C59.7392 75.6739 61.4315 73.9608 63.1966 73.0627C64.7643 72.2633 66.275 72.1698 67.469 72.7772Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M101.503 79.3645C100.335 78.7727 99.0371 78.4405 97.6406 78.3937C95.5174 78.3211 93.2177 78.8973 90.8972 80.0861C88.1199 81.4981 85.3945 83.7355 82.9597 86.5959C80.8573 89.0722 79.03 91.9429 77.6076 95.0058C77.1871 95.9143 76.8496 96.8591 76.5953 97.8298C75.8218 100.716 74.1709 107.397 74.4876 110.756C74.5187 111.088 74.6226 111.374 74.7783 111.587C74.8769 111.716 74.9963 111.82 75.1313 111.888L71.0354 109.801C70.8952 109.733 70.7758 109.624 70.6824 109.5C70.5215 109.282 70.4228 109.001 70.3917 108.669C70.1062 105.601 71.4559 99.761 72.2813 96.5735C72.7018 94.9435 73.2728 93.3602 74.0308 91.8547C75.3701 89.1916 77.0106 86.6946 78.869 84.509C81.2985 81.6487 84.0291 79.406 86.8065 77.9992C89.127 76.8156 91.4267 76.2342 93.5499 76.3068C94.9464 76.3536 96.2494 76.6858 97.4122 77.2776L101.508 79.3645H101.503Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M101.503 79.3703C102.105 79.6766 102.676 80.0555 103.2 80.5072C104.747 81.8258 105.916 83.7102 106.622 86.0463C107.328 88.3771 107.561 91.1026 107.302 94.046C107.27 94.4094 107.172 94.7987 107.011 95.1725C106.85 95.5463 106.642 95.8993 106.388 96.2004C101.669 101.895 96.3272 106.349 90.892 109.106C85.2543 111.977 79.9592 112.854 75.3961 111.992C75.3026 111.977 75.2144 111.945 75.1313 111.904C74.9963 111.836 74.8769 111.733 74.7783 111.598C74.6226 111.385 74.5187 111.099 74.4876 110.767C74.1865 107.559 75.6816 101.319 76.4862 98.2509C76.8081 97.031 77.2182 95.837 77.7581 94.7001C79.1545 91.7567 80.9248 88.9949 82.9545 86.6069C85.3892 83.7465 88.1147 81.5091 90.8868 80.0971C93.2073 78.9135 95.507 78.3372 97.6302 78.4047C99.0267 78.4514 100.33 78.7785 101.498 79.3755L101.503 79.3703Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M97.0748 50.1017C95.4292 49.2659 93.3475 49.3957 91.1827 50.4963C88.748 51.737 86.4171 54.099 84.6988 57.0684C82.9805 60.0378 82.0149 63.3706 82.0149 66.3296C82.0149 69.2886 82.9805 71.6351 84.6988 72.8498C84.8909 72.9848 85.0881 73.1042 85.2906 73.208L81.1947 71.1212C80.9922 71.0173 80.7898 70.8979 80.6029 70.763C78.8846 69.5482 77.919 67.2017 77.919 64.2427C77.919 61.2837 78.8846 57.9509 80.6029 54.9815C82.3212 52.0121 84.6573 49.6501 87.0868 48.4094C89.2515 47.3088 91.3332 47.179 92.9789 48.0148L97.0748 50.1017Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M97.0748 50.1017C97.2773 50.2056 97.4797 50.325 97.6666 50.4599C99.3849 51.6747 100.351 54.0211 100.351 56.9802C100.351 59.9392 99.3849 63.272 97.6666 66.2414C95.9483 69.2108 93.6122 71.5728 91.1827 72.8135C89.018 73.9141 86.9363 74.0439 85.2906 73.2081C85.0882 73.1042 84.8857 72.9848 84.6988 72.8499C82.9805 71.6351 82.015 69.2887 82.015 66.3296C82.015 63.3706 82.9805 60.0378 84.6988 57.0684C86.4171 54.099 88.7532 51.737 91.1827 50.4963C93.3475 49.3957 95.4292 49.2659 97.0748 50.1017Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M156.157 76.1567C157.641 75.3988 158.591 73.6078 158.591 71.0641C158.591 66.5061 155.554 61.2629 151.811 59.3578C150.155 58.5168 148.64 58.4597 147.466 59.0618L149.875 57.8367C151.054 57.2397 152.569 57.2916 154.22 58.1326C157.963 60.043 161 65.281 161 69.8389C161 72.3826 160.05 74.1736 158.565 74.9315L156.157 76.1567Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -38,315 +234,121 @@ export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationA
         strokeLinejoin="round"
       />
       <path
-        d="M13.3344 133.909C13.3344 131.947 14.8035 129.99 17.7366 128.495L97.0955 88.06C102.967 85.0698 112.482 85.0698 118.354 88.06L156.12 107.304C159.058 108.799 160.522 110.761 160.522 112.724C160.522 114.686 159.053 116.643 156.12 118.138L76.7613 158.573C70.8899 161.563 61.3744 161.563 55.503 158.573L17.7366 139.329C14.7983 137.834 13.3344 135.872 13.3344 133.909Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M156.157 76.1571C154.978 76.7541 153.462 76.7022 151.811 75.8612C148.069 73.9509 145.032 68.7129 145.032 64.1549C145.032 61.6112 145.982 59.8202 147.466 59.0623C148.645 58.4653 150.161 58.5172 151.811 59.3582C155.554 61.2686 158.591 66.5066 158.591 71.0645C158.591 73.6082 157.641 75.3992 156.157 76.1571Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M13.3344 114.109C13.3344 116.072 14.8035 118.029 17.7366 119.529L55.5031 138.773C61.3744 141.763 70.89 141.763 76.7613 138.773L156.12 98.3383C159.053 96.8432 160.522 94.8861 160.522 92.9238V99.1897C160.522 101.152 159.053 103.109 156.12 104.604L76.7613 145.039C70.89 148.029 61.3744 148.029 55.5031 145.039L17.7366 125.795C14.7983 124.3 13.3344 122.338 13.3344 120.375V114.109Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M13.3344 114.109C13.3344 112.147 14.8036 110.19 17.7366 108.695L97.0955 68.2602C102.967 65.27 112.482 65.27 118.354 68.2602L156.12 87.5042C159.058 88.9993 160.522 90.9616 160.522 92.9239C160.522 94.8862 159.053 96.8433 156.12 98.3384L76.7613 138.773C70.89 141.763 61.3744 141.763 55.5031 138.773L17.7366 119.529C14.7984 118.034 13.3344 116.072 13.3344 114.109Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M54.2572 118.419C53.3643 118.419 52.487 118.336 51.646 118.18C51.5266 118.16 51.4176 118.118 51.3138 118.066L47.2231 115.979C47.0517 115.891 46.9064 115.767 46.787 115.606C46.6157 115.377 46.5119 115.076 46.4807 114.744C46.2575 112.371 47.3009 107.923 47.9446 105.483C48.2042 104.496 48.5157 103.624 48.8998 102.814C49.9433 100.618 51.2359 98.6042 52.7466 96.8288C54.5479 94.7056 56.5933 93.0288 58.6646 91.9802C60.3362 91.1288 61.9766 90.6927 63.534 90.6927C63.6275 90.6927 63.7157 90.6927 63.8092 90.6927C64.8993 90.7291 65.9168 90.9834 66.8357 91.4558L70.9316 93.5427C71.404 93.7815 71.8504 94.0826 72.2657 94.4304C72.3021 94.4616 72.3384 94.4927 72.3695 94.5239C72.7174 93.5012 73.1275 92.5252 73.5791 91.622C74.9444 88.8965 76.5952 86.3944 78.4849 84.1725C80.9507 81.2706 83.7488 78.976 86.5832 77.5329C88.8622 76.37 91.0841 75.7782 93.1969 75.7782C93.3215 75.7782 93.4513 75.7782 93.5759 75.7834C95.0398 75.8301 96.4155 76.1779 97.6562 76.8113L101.269 78.649C101.295 78.5452 101.321 78.4517 101.347 78.3583C101.607 77.3719 101.918 76.4998 102.302 75.69C103.346 73.4941 104.638 71.4799 106.149 69.7044C107.95 67.5812 109.996 65.9044 112.067 64.8558C113.739 64.0044 115.374 63.5684 116.937 63.5684C117.03 63.5684 117.118 63.5684 117.212 63.5684C118.302 63.6047 119.319 63.8591 120.238 64.3263L124.334 66.4132C124.807 66.652 125.253 66.9531 125.668 67.3061C126.878 68.3339 127.766 69.7667 128.311 71.5681C128.845 73.3331 129.017 75.3525 128.825 77.5692C128.799 77.8859 128.71 78.2233 128.575 78.54C128.44 78.8566 128.259 79.1629 128.046 79.4173C124.583 83.5963 120.638 86.8823 116.641 88.9121C113.645 90.4384 110.723 91.2378 107.945 91.2845C107.961 92.193 107.93 93.1274 107.847 94.0722C107.81 94.4875 107.696 94.934 107.52 95.3545C107.343 95.775 107.099 96.1747 106.819 96.5121C102.064 102.254 96.6491 106.765 91.1567 109.553C86.9103 111.717 82.7832 112.813 78.8898 112.813C77.675 112.813 76.4758 112.704 75.3286 112.486C75.1936 112.46 75.0638 112.418 74.9392 112.356L71.0665 110.383C68.554 112.771 65.9272 114.666 63.2485 116.031C60.1493 117.609 57.1332 118.409 54.2832 118.409L54.2572 118.419Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M116.916 64.0968C117.004 64.0968 117.087 64.0968 117.175 64.0968C118.188 64.1332 119.132 64.372 119.984 64.8029L124.08 66.8897C124.516 67.113 124.931 67.3881 125.31 67.7152C126.431 68.6704 127.278 70.0408 127.791 71.7332C128.305 73.4255 128.472 75.4034 128.285 77.537C128.264 77.8018 128.191 78.0821 128.077 78.3521C127.963 78.622 127.807 78.8816 127.625 79.0996C124.204 83.2318 120.326 86.4608 116.381 88.4647C113.287 90.0376 110.344 90.7851 107.655 90.7851C107.566 90.7851 107.478 90.7851 107.39 90.7851C107.431 91.8338 107.405 92.9239 107.307 94.0453C107.276 94.4086 107.177 94.798 107.016 95.1718C106.86 95.5455 106.647 95.8985 106.393 96.1996C101.679 101.894 96.3324 106.349 90.8972 109.105C86.6351 111.275 82.5704 112.308 78.8638 112.308C77.6698 112.308 76.5122 112.199 75.4012 111.991C75.3078 111.976 75.2195 111.945 75.1365 111.903C75.0015 111.836 74.8821 111.732 74.7835 111.597C74.7835 111.597 74.7835 111.597 74.7835 111.592V111.597C74.8769 111.722 74.9911 111.825 75.1261 111.893L71.0406 109.811C71.0146 109.796 70.9887 109.775 70.9627 109.759C68.4242 112.215 65.7247 114.193 62.9941 115.579C59.9001 117.152 56.9515 117.904 54.2676 117.904C53.4007 117.904 52.5597 117.826 51.755 117.676C51.6875 117.666 51.6201 117.64 51.563 117.608L47.467 115.522C47.3684 115.47 47.2802 115.397 47.2075 115.298C47.0933 115.143 47.0206 114.935 46.9998 114.696C46.7818 112.37 47.8668 107.844 48.4534 105.617C48.687 104.734 48.9829 103.867 49.3774 103.042C50.3897 100.908 51.6772 98.9043 53.1463 97.1704C54.9113 95.0939 56.8892 93.469 58.9034 92.4464C60.4971 91.6313 62.0701 91.216 63.534 91.216C63.6223 91.216 63.7053 91.216 63.7936 91.216C64.8059 91.2524 65.7507 91.4912 66.602 91.922L70.698 94.0089C71.134 94.2321 71.5493 94.5073 71.9283 94.8343C72.1671 95.0368 72.3903 95.2652 72.6031 95.504C72.9821 94.2529 73.4597 93.033 74.0463 91.8649C75.3857 89.2018 77.0261 86.7048 78.8846 84.5193C81.3141 81.6589 84.0447 79.4163 86.822 78.0094C89.0127 76.8881 91.1827 76.3119 93.2021 76.3119C93.3215 76.3119 93.4409 76.3119 93.5603 76.3171C94.9567 76.3638 96.2597 76.6961 97.4226 77.2879L101.519 79.3747C101.394 79.3124 101.264 79.2502 101.129 79.193C101.259 79.2502 101.389 79.3124 101.519 79.3799C101.55 79.3955 101.581 79.4163 101.612 79.4318C101.695 79.0944 101.778 78.7881 101.851 78.513C102.084 77.6305 102.38 76.7635 102.775 75.9381C103.787 73.8045 105.075 71.8007 106.544 70.0668C108.309 67.9903 110.287 66.3654 112.301 65.3427C113.894 64.5277 115.467 64.1124 116.931 64.1124M98.6945 78.487C98.6945 78.487 98.6737 78.487 98.6685 78.487C98.6789 78.487 98.6893 78.487 98.6945 78.487ZM101.056 79.1567C101.056 79.1567 101.02 79.1411 101.005 79.1359C101.02 79.1411 101.041 79.1515 101.056 79.1567ZM79.1649 92.0207C79.248 91.8701 79.3362 91.7248 79.4193 91.5742C79.331 91.7196 79.248 91.8701 79.1649 92.0207ZM78.8119 92.6384C78.7133 92.8149 78.625 92.9914 78.5264 93.1679C78.6198 92.9914 78.7133 92.8149 78.8119 92.6384ZM78.0592 94.0868C78.0176 94.1699 77.9761 94.2529 77.9346 94.3412C77.9761 94.2581 78.0176 94.175 78.0592 94.0868C78.1215 93.9622 78.1786 93.8428 78.2409 93.7234C78.1786 93.8428 78.1163 93.9674 78.0592 94.0868ZM75.801 101.007C76.045 99.9529 76.2889 99.0029 76.4914 98.2398C76.8029 97.051 77.2078 95.8882 77.7269 94.772C77.6906 94.8499 77.6491 94.9278 77.6127 95.0056C77.1922 95.9141 76.8548 96.8589 76.6004 97.8297C76.3824 98.6395 76.0969 99.7505 75.8062 101.002M75.7854 101.069C75.7594 101.178 75.7335 101.282 75.7127 101.391C75.6868 101.515 75.6556 101.635 75.6297 101.759C75.6556 101.635 75.6868 101.51 75.7127 101.391C75.7387 101.282 75.7646 101.173 75.7854 101.069ZM75.3857 102.881C75.3493 103.057 75.313 103.239 75.2767 103.421C75.313 103.239 75.3493 103.062 75.3857 102.881C75.3857 102.881 75.3857 102.876 75.3857 102.87C75.3857 102.87 75.3857 102.876 75.3857 102.881ZM74.9392 105.181C74.9652 105.03 74.9911 104.879 75.0223 104.729C74.9963 104.879 74.9652 105.03 74.9392 105.181ZM74.5239 108.29C74.5135 108.399 74.5032 108.508 74.498 108.612C74.5032 108.508 74.5187 108.394 74.5239 108.29ZM74.472 109.095C74.472 109.147 74.4668 109.204 74.4616 109.256C74.4616 109.302 74.4616 109.344 74.4564 109.391C74.4564 109.349 74.4564 109.302 74.4616 109.256C74.4616 109.204 74.4668 109.147 74.472 109.095ZM74.4772 110.564C74.4772 110.626 74.4772 110.699 74.4876 110.756C74.4876 110.756 74.4876 110.756 74.4876 110.761C74.4876 110.761 74.4876 110.761 74.4876 110.751C74.4824 110.688 74.4824 110.621 74.4772 110.559M75.1209 111.888H75.1313C75.1313 111.888 75.1261 111.888 75.1209 111.888ZM116.916 63.0586C115.275 63.0586 113.557 63.5102 111.813 64.4031C109.684 65.4829 107.587 67.2064 105.739 69.3764C104.202 71.1881 102.884 73.2387 101.82 75.4761C101.467 76.2236 101.171 77.0231 100.922 77.9056L97.8846 76.3586C96.5712 75.6889 95.1229 75.3256 93.5811 75.2788C93.4513 75.2788 93.3215 75.2736 93.1865 75.2736C90.9906 75.2736 88.6857 75.881 86.334 77.0854C83.4425 78.5545 80.5873 80.8958 78.0799 83.8496C76.1644 86.1026 74.4928 88.6411 73.1067 91.4029C72.7433 92.1245 72.4163 92.8824 72.1152 93.6819C71.8089 93.4586 71.487 93.2666 71.1548 93.0953L67.0589 91.0084C66.0725 90.5048 64.9824 90.2297 63.8143 90.1933C63.7157 90.1933 63.6171 90.1933 63.5236 90.1933C61.8832 90.1933 60.1649 90.645 58.4206 91.5379C56.2922 92.6177 54.1949 94.3412 52.3468 96.5111C50.8102 98.3229 49.4916 100.373 48.4274 102.611C48.0277 103.452 47.7058 104.35 47.4359 105.367C46.7818 107.844 45.7228 112.36 45.9564 114.81C45.9979 115.241 46.1381 115.631 46.3665 115.932C46.5326 116.16 46.7455 116.337 46.9894 116.461L51.0854 118.548C51.2359 118.626 51.3916 118.678 51.5578 118.709C52.4299 118.875 53.3384 118.958 54.2624 118.958C57.1955 118.958 60.2895 118.138 63.4613 116.523C66.0881 115.189 68.6682 113.346 71.134 111.041L74.6537 112.832C74.6537 112.832 74.6641 112.838 74.6693 112.838C74.6745 112.838 74.6797 112.843 74.6848 112.848C74.851 112.931 75.0275 112.988 75.2092 113.025C76.3876 113.248 77.6179 113.362 78.8638 113.362C82.8455 113.362 87.0504 112.246 91.3696 110.045C96.9242 107.226 102.396 102.668 107.198 96.8745C107.509 96.4955 107.779 96.0543 107.976 95.5871C108.174 95.1147 108.303 94.6163 108.345 94.1491C108.412 93.3652 108.449 92.5813 108.449 91.8182C111.148 91.6832 113.972 90.8734 116.853 89.4043C120.918 87.3433 124.916 84.0105 128.425 79.7797C128.674 79.4786 128.876 79.1411 129.032 78.7777C129.188 78.404 129.287 78.025 129.318 77.646C129.52 75.3671 129.338 73.2802 128.783 71.4529C128.207 69.5581 127.267 68.0422 125.98 66.9469C125.538 66.5679 125.056 66.246 124.547 65.9917L120.451 63.9048C119.465 63.4012 118.375 63.1261 117.207 63.0897C117.108 63.0897 117.009 63.0897 116.916 63.0897V63.0586Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M114.019 63.3399C113.318 63.3399 112.664 63.1893 112.078 62.8883L107.982 60.8014C107.81 60.7131 107.644 60.6145 107.488 60.5003C106.092 59.5087 105.318 57.6814 105.318 55.3453C105.318 53.0093 106.035 50.6161 107.338 48.3683C108.646 46.1153 110.39 44.3502 112.254 43.4002C113.214 42.9123 114.159 42.6631 115.057 42.6631C115.758 42.6631 116.412 42.8136 116.999 43.1147L121.095 45.2016C121.266 45.2899 121.432 45.3885 121.588 45.5027C122.984 46.4942 123.758 48.3216 123.758 50.6576C123.758 52.9937 123.041 55.3869 121.738 57.6347C120.43 59.8877 118.686 61.6579 116.822 62.6027C115.862 63.0907 114.917 63.3399 114.019 63.3399Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M115.057 43.1818C115.67 43.1818 116.246 43.3116 116.76 43.5763L120.856 45.6632C121.007 45.7411 121.147 45.8242 121.287 45.9228C122.533 46.8053 123.234 48.508 123.234 50.652C123.234 52.796 122.533 55.2152 121.287 57.3695C120.041 59.5239 118.349 61.237 116.584 62.1351C115.691 62.5868 114.819 62.8152 114.014 62.8152C113.401 62.8152 112.825 62.6854 112.311 62.4206L108.215 60.3338C108.065 60.2559 107.925 60.1728 107.784 60.0742C106.538 59.1917 105.838 57.4889 105.838 55.3449C105.838 53.201 106.538 50.7818 107.784 48.6274C109.03 46.4731 110.723 44.76 112.488 43.8619C113.381 43.4102 114.253 43.1818 115.057 43.1818ZM115.057 42.1436C114.076 42.1436 113.053 42.4083 112.015 42.9378C110.063 43.9345 108.241 45.7722 106.886 48.1083C105.542 50.434 104.799 53.0037 104.799 55.3449C104.799 57.8523 105.646 59.8354 107.187 60.9256C107.364 61.0501 107.556 61.1644 107.748 61.263L111.844 63.3499C112.503 63.6873 113.235 63.8586 114.019 63.8586C115 63.8586 116.023 63.5939 117.061 63.0644C119.013 62.0676 120.835 60.2299 122.19 57.8939C123.535 55.5682 124.277 52.9985 124.277 50.6572C124.277 48.1499 123.431 46.1668 121.889 45.0766C121.713 44.952 121.52 44.8378 121.328 44.7392L117.232 42.6523C116.573 42.3149 115.841 42.1436 115.057 42.1436Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M60.6269 90.459C59.9261 90.459 59.272 90.3085 58.6854 90.0074L54.5894 87.9205C54.4181 87.8323 54.252 87.7336 54.0963 87.6194C52.6998 86.6331 51.9315 84.8006 51.9315 82.4645C51.9315 80.1284 52.6479 77.7352 53.9509 75.4874C55.2591 73.2344 57.0034 71.4694 58.8671 70.5194C59.8274 70.0314 60.7722 69.7822 61.6703 69.7822C62.3712 69.7822 63.0253 69.9328 63.6119 70.2339L67.7078 72.3208C67.8791 72.409 68.0452 72.5076 68.2009 72.6218C69.5974 73.6082 70.3709 75.4407 70.3709 77.7768C70.3709 80.1128 69.6545 82.506 68.3515 84.7538C67.0433 87.0068 65.299 88.7719 63.4354 89.7219C62.475 90.2099 61.5302 90.459 60.6321 90.459H60.6269Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M61.6704 70.3009C62.2829 70.3009 62.8592 70.4307 63.3731 70.6955L67.469 72.7824C67.6195 72.8602 67.7597 72.9433 67.8999 73.0419C69.1458 73.9245 69.8466 75.6272 69.8466 77.7712C69.8466 79.9152 69.1458 82.3343 67.8999 84.4887C66.654 86.6431 64.9616 88.3562 63.1966 89.2543C62.3037 89.7059 61.4316 89.9343 60.6269 89.9343C60.0143 89.9343 59.4381 89.8045 58.9242 89.5398L54.8283 87.4529C54.6777 87.375 54.5376 87.292 54.3974 87.1933C53.1515 86.3108 52.4507 84.6081 52.4507 82.4641C52.4507 80.3201 53.1515 77.901 54.3974 75.7466C55.6433 73.5922 57.3356 71.8791 59.1007 70.981C59.9936 70.5294 60.8657 70.3009 61.6704 70.3009ZM61.6704 69.2627C60.6892 69.2627 59.6665 69.5274 58.6283 70.057C56.6764 71.0537 54.8542 72.8914 53.4993 75.2275C52.1548 77.5531 51.4124 80.1228 51.4124 82.4641C51.4124 84.9715 52.2586 86.9545 53.8004 88.0447C53.9769 88.1693 54.169 88.2835 54.3611 88.3821L58.457 90.469C59.1163 90.8064 59.8482 90.9778 60.6321 90.9778C61.6133 90.9778 62.6359 90.713 63.6742 90.1835C65.6261 89.1868 67.4482 87.3491 68.8032 85.013C70.1477 82.6873 70.89 80.1176 70.89 77.7764C70.89 75.269 70.0439 73.2859 68.5021 72.1958C68.3256 72.0712 68.1387 71.957 67.9414 71.8583L63.8455 69.7714C63.1862 69.434 62.4542 69.2627 61.6704 69.2627Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M87.6423 74.2721C86.7078 74.2721 85.8409 74.0697 85.057 73.67L80.9611 71.5831C80.7379 71.4689 80.5147 71.3339 80.3018 71.1833C78.4278 69.8596 77.3947 67.3885 77.3947 64.2374C77.3947 61.0863 78.3759 57.7847 80.1513 54.7166C81.9319 51.6434 84.3095 49.2347 86.848 47.942C88.1458 47.2827 89.4125 46.9453 90.6272 46.9453C91.5617 46.9453 92.4338 47.1478 93.2125 47.5475L97.3084 49.6344C97.5368 49.7486 97.7549 49.8836 97.9677 50.0341C99.8417 51.3579 100.875 53.8289 100.875 56.98C100.875 60.1311 99.8989 63.4328 98.1182 66.5008C96.3376 69.574 93.96 71.9828 91.4215 73.2754C90.1237 73.9347 88.857 74.2721 87.6423 74.2721Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M90.6272 47.4748C91.4734 47.4748 92.2676 47.6565 92.9788 48.0199L97.0748 50.1067C97.2824 50.2106 97.4797 50.33 97.6666 50.4649C99.3849 51.6797 100.35 54.0262 100.35 56.9852C100.35 59.9442 99.3849 63.277 97.6666 66.2464C95.9483 69.2158 93.6122 71.5778 91.1827 72.8185C89.9523 73.4467 88.7532 73.7582 87.6422 73.7582C86.7961 73.7582 86.0018 73.5765 85.2906 73.2131L81.1947 71.1262C80.9922 71.0224 80.7898 70.903 80.6029 70.768C78.8846 69.5532 77.919 67.2068 77.919 64.2478C77.919 61.2887 78.8846 57.9559 80.6029 54.9865C82.3212 52.0171 84.6573 49.6551 87.0868 48.4144C88.3171 47.7863 89.5163 47.4748 90.6272 47.4748ZM90.6272 46.4365C89.3346 46.4365 87.9849 46.7895 86.6144 47.4903C83.9876 48.8297 81.5321 51.3059 79.7048 54.4674C77.8827 57.6133 76.8807 61.0863 76.8807 64.2478C76.8807 67.5754 77.9917 70.1918 80.0059 71.6194C80.2343 71.7803 80.4783 71.9308 80.7275 72.0554L84.8234 74.1423C85.6799 74.5784 86.6299 74.8016 87.6422 74.8016C88.9349 74.8016 90.2846 74.4486 91.6551 73.7478C94.2819 72.4084 96.7373 69.9322 98.5647 66.7707C100.387 63.6248 101.389 60.1518 101.389 56.9904C101.389 53.6628 100.278 51.0464 98.2636 49.6188C98.03 49.4527 97.7912 49.3073 97.542 49.1827L93.4461 47.0958C92.5895 46.6598 91.6395 46.4365 90.6272 46.4365Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M124.075 66.89C123.228 66.4591 122.284 66.2203 121.266 66.184C119.729 66.1321 118.063 66.5474 116.376 67.4091C114.362 68.4318 112.384 70.0567 110.619 72.1332C109.144 73.8671 107.862 75.8657 106.85 78.0045C106.455 78.8299 106.159 79.6969 105.926 80.5794C105.339 82.8064 104.254 87.3332 104.472 89.6589C104.493 89.8977 104.566 90.1053 104.68 90.2611C104.753 90.3597 104.836 90.4324 104.94 90.4843L100.844 88.3974C100.745 88.3455 100.657 88.2728 100.584 88.1742C100.47 88.0184 100.397 87.8108 100.376 87.572C100.158 85.2463 101.243 80.7195 101.83 78.4925C102.064 77.61 102.359 76.743 102.754 75.9176C103.766 73.784 105.054 71.7802 106.523 70.0463C108.288 67.9698 110.266 66.3449 112.28 65.3222C113.967 64.4605 115.634 64.0452 117.17 64.0971C118.182 64.1334 119.127 64.3722 119.979 64.8031L124.075 66.89Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M124.075 66.8897C124.511 67.1129 124.926 67.3881 125.305 67.7151C126.426 68.6703 127.272 70.0408 127.786 71.7332C128.3 73.4255 128.466 75.4034 128.28 77.537C128.259 77.8018 128.186 78.0821 128.072 78.352C127.958 78.622 127.802 78.8815 127.62 79.0996C124.199 83.2318 120.321 86.4608 116.376 88.4646C112.285 90.5463 108.444 91.1848 105.132 90.5567C105.064 90.5463 104.997 90.5204 104.94 90.4892C104.841 90.4373 104.753 90.3646 104.68 90.266C104.566 90.1103 104.493 89.9026 104.472 89.6638C104.254 87.3381 105.339 82.8113 105.926 80.5843C106.16 79.7018 106.455 78.8348 106.85 78.0094C107.862 75.8758 109.15 73.872 110.619 72.1381C112.384 70.0616 114.362 68.4367 116.376 67.414C118.063 66.5523 119.729 66.137 121.266 66.1889C122.278 66.2252 123.223 66.464 124.075 66.8949V66.8897Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M120.861 45.6629C119.667 45.0555 118.157 45.149 116.589 45.9484C114.824 46.8465 113.131 48.5648 111.886 50.714C110.64 52.8684 109.939 55.2823 109.939 57.4315C109.939 59.5807 110.64 61.2782 111.886 62.1607C112.026 62.2594 112.166 62.3476 112.316 62.4203L108.22 60.3334C108.07 60.2556 107.93 60.1725 107.79 60.0739C106.544 59.1913 105.843 57.4886 105.843 55.3446C105.843 53.1954 106.544 50.7815 107.79 48.6271C109.036 46.4727 110.728 44.7596 112.493 43.8615C114.061 43.0621 115.571 42.9686 116.765 43.576L120.861 45.6629Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M120.861 45.6629C121.012 45.7408 121.152 45.8239 121.292 45.9225C122.538 46.805 123.239 48.5077 123.239 50.6517C123.239 52.7957 122.538 55.2149 121.292 57.3692C120.046 59.5236 118.354 61.2367 116.589 62.1348C115.021 62.9343 113.51 63.0277 112.316 62.4203C112.166 62.3425 112.026 62.2594 111.886 62.1608C110.64 61.2783 109.939 59.5755 109.939 57.4315C109.939 55.2823 110.64 52.8684 111.886 50.714C113.131 48.5597 114.824 46.8465 116.589 45.9484C118.157 45.149 119.667 45.0556 120.861 45.6629Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M70.6824 94.0091C69.8362 93.5783 68.8914 93.3395 67.8739 93.3031C66.3373 93.2512 64.6709 93.6665 62.9838 94.5283C60.9695 95.551 58.9917 97.1758 57.2266 99.2523C55.7523 100.986 54.4701 102.985 53.4578 105.124C53.0632 105.949 52.7673 106.816 52.5337 107.699C51.9471 109.926 50.8621 114.452 51.0802 116.778C51.1009 117.017 51.1736 117.224 51.2878 117.38C51.3605 117.479 51.4436 117.552 51.5474 117.603L47.4515 115.517C47.3529 115.465 47.2646 115.392 47.1919 115.293C47.0777 115.138 47.005 114.93 46.9843 114.691C46.7662 112.365 47.8512 107.839 48.4378 105.612C48.6714 104.729 48.9673 103.862 49.3619 103.037C50.3742 100.903 51.6616 98.8993 53.1307 97.1654C54.8958 95.0889 56.8736 93.4641 58.8878 92.4414C60.575 91.5796 62.2414 91.1643 63.778 91.2162C64.7903 91.2526 65.7351 91.4914 66.5865 91.9223L70.6824 94.0091Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M70.6824 94.0089C71.1184 94.2321 71.5337 94.5072 71.9127 94.8343C73.034 95.7895 73.8802 97.16 74.3941 98.8523C74.9081 100.545 75.0742 102.523 74.8873 104.656C74.8665 104.921 74.7939 105.201 74.6796 105.471C74.5654 105.741 74.4097 106.001 74.228 106.219C70.807 110.351 66.9291 113.58 62.9837 115.584C58.893 117.665 55.0515 118.304 51.7394 117.676C51.672 117.665 51.6045 117.64 51.5474 117.608C51.4487 117.556 51.3605 117.484 51.2878 117.385C51.1736 117.229 51.1009 117.022 51.0802 116.783C50.8621 114.457 51.9471 109.93 52.5337 107.703C52.7673 106.821 53.0632 105.954 53.4578 105.129C54.4701 102.995 55.7575 100.991 57.2266 99.2572C58.9916 97.1807 60.9695 95.5559 62.9837 94.5332C64.6709 93.6714 66.3373 93.2561 67.8739 93.308C68.8862 93.3444 69.831 93.5832 70.6824 94.014V94.0089Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M67.469 72.7772C66.275 72.1698 64.7643 72.2632 63.1965 73.0627C61.4315 73.9608 59.7392 75.6791 58.4933 77.8283C57.2474 79.9826 56.5465 82.3966 56.5465 84.5458C56.5465 86.6949 57.2474 88.3925 58.4933 89.275C58.6334 89.3736 58.7736 89.4619 58.9241 89.5346L54.8282 87.4477C54.6777 87.3698 54.5375 87.2867 54.3973 87.1881C53.1514 86.3056 52.4506 84.6029 52.4506 82.4589C52.4506 80.3097 53.1514 77.8957 54.3973 75.7414C55.6433 73.587 57.3356 71.8739 59.1006 70.9758C60.6684 70.1763 62.1791 70.0829 63.373 70.6903L67.469 72.7772Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M67.469 72.7772C67.6195 72.8551 67.7597 72.9381 67.8999 73.0367C69.1458 73.9193 69.8466 75.622 69.8466 77.766C69.8466 79.91 69.1458 82.3291 67.8999 84.4835C66.654 86.6379 64.9616 88.351 63.1966 89.2491C61.6288 90.0485 60.1182 90.142 58.9242 89.5346C58.7736 89.4567 58.6335 89.3737 58.4933 89.275C57.2474 88.3925 56.5466 86.6898 56.5466 84.5458C56.5466 82.3966 57.2474 79.9827 58.4933 77.8283C59.7392 75.6739 61.4315 73.9608 63.1966 73.0627C64.7643 72.2633 66.275 72.1698 67.469 72.7772Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M101.503 79.3645C100.335 78.7727 99.0371 78.4405 97.6406 78.3937C95.5174 78.3211 93.2177 78.8973 90.8972 80.0861C88.1199 81.4981 85.3945 83.7355 82.9597 86.5959C80.8573 89.0722 79.03 91.9429 77.6076 95.0058C77.1871 95.9143 76.8496 96.8591 76.5953 97.8298C75.8218 100.716 74.1709 107.397 74.4876 110.756C74.5187 111.088 74.6226 111.374 74.7783 111.587C74.8769 111.716 74.9963 111.82 75.1313 111.888L71.0354 109.801C70.8952 109.733 70.7758 109.624 70.6824 109.5C70.5215 109.282 70.4228 109.001 70.3917 108.669C70.1062 105.601 71.4559 99.761 72.2813 96.5735C72.7018 94.9435 73.2728 93.3602 74.0308 91.8547C75.3701 89.1916 77.0106 86.6946 78.869 84.509C81.2985 81.6487 84.0291 79.406 86.8065 77.9992C89.127 76.8156 91.4267 76.2342 93.5499 76.3068C94.9464 76.3536 96.2494 76.6858 97.4122 77.2776L101.508 79.3645H101.503Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M101.503 79.3703C102.105 79.6766 102.676 80.0555 103.2 80.5072C104.747 81.8258 105.916 83.7102 106.622 86.0463C107.328 88.3771 107.561 91.1026 107.302 94.046C107.27 94.4094 107.172 94.7987 107.011 95.1725C106.85 95.5463 106.642 95.8993 106.388 96.2004C101.669 101.895 96.3272 106.349 90.892 109.106C85.2543 111.977 79.9592 112.854 75.3961 111.992C75.3026 111.977 75.2144 111.945 75.1313 111.904C74.9963 111.836 74.8769 111.733 74.7783 111.598C74.6226 111.385 74.5187 111.099 74.4876 110.767C74.1865 107.559 75.6816 101.319 76.4862 98.2509C76.8081 97.031 77.2182 95.837 77.7581 94.7001C79.1545 91.7567 80.9248 88.9949 82.9545 86.6069C85.3892 83.7465 88.1147 81.5091 90.8868 80.0971C93.2073 78.9135 95.507 78.3372 97.6302 78.4047C99.0267 78.4514 100.33 78.7785 101.498 79.3755L101.503 79.3703Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M97.0748 50.1017C95.4292 49.2659 93.3475 49.3957 91.1827 50.4963C88.748 51.737 86.4171 54.099 84.6988 57.0684C82.9805 60.0378 82.0149 63.3706 82.0149 66.3296C82.0149 69.2886 82.9805 71.6351 84.6988 72.8498C84.8909 72.9848 85.0881 73.1042 85.2906 73.208L81.1947 71.1212C80.9922 71.0173 80.7898 70.8979 80.6029 70.763C78.8846 69.5482 77.919 67.2017 77.919 64.2427C77.919 61.2837 78.8846 57.9509 80.6029 54.9815C82.3212 52.0121 84.6573 49.6501 87.0868 48.4094C89.2515 47.3088 91.3332 47.179 92.9789 48.0148L97.0748 50.1017Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M97.0748 50.1017C97.2773 50.2056 97.4797 50.325 97.6666 50.4599C99.3849 51.6747 100.351 54.0211 100.351 56.9802C100.351 59.9392 99.3849 63.272 97.6666 66.2414C95.9483 69.2108 93.6122 71.5728 91.1827 72.8135C89.018 73.9141 86.9363 74.0439 85.2906 73.2081C85.0882 73.1042 84.8857 72.9848 84.6988 72.8499C82.9805 71.6351 82.015 69.2887 82.015 66.3296C82.015 63.3706 82.9805 60.0378 84.6988 57.0684C86.4171 54.099 88.7532 51.737 91.1827 50.4963C93.3475 49.3957 95.4292 49.2659 97.0748 50.1017Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M156.157 76.1567C157.641 75.3988 158.591 73.6078 158.591 71.0641C158.591 66.5061 155.554 61.2629 151.811 59.3578C150.155 58.5168 148.64 58.4597 147.466 59.0618L149.875 57.8367C151.054 57.2397 152.569 57.2916 154.22 58.1326C157.963 60.043 161 65.281 161 69.8389C161 72.3826 160.05 74.1736 158.565 74.9315L156.157 76.1567Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M156.157 76.1571C154.978 76.7541 153.462 76.7022 151.811 75.8612C148.069 73.9509 145.032 68.7129 145.032 64.1549C145.032 61.6112 145.982 59.8202 147.466 59.0623C148.645 58.4653 150.161 58.5172 151.811 59.3582C155.554 61.2686 158.591 66.5066 158.591 71.0645C158.591 73.6082 157.641 75.3992 156.157 76.1571Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M153.478 72.6109C153.286 72.5122 153.135 72.2475 153.135 72.0139V71.1729C153.135 70.4773 152.673 69.6778 152.102 69.3871L150.031 68.3333C149.46 68.0426 148.998 68.3696 148.998 69.0652V69.9062C148.998 70.1398 148.842 70.2488 148.655 70.1502C148.468 70.0516 148.313 69.7868 148.313 69.5532V68.7122C148.313 67.5546 149.086 67.0095 150.036 67.4923L152.107 68.5461C153.057 69.0289 153.831 70.3682 153.831 71.5259V72.3669C153.831 72.6005 153.675 72.7095 153.488 72.6109H153.478Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M153.478 68.3591C153.322 68.2812 153.182 68.0839 153.146 67.8763C153.099 67.6271 153.208 67.4558 153.395 67.4921C153.758 67.5648 154.044 67.3623 154.137 66.9678C154.283 66.3708 153.945 65.5091 153.395 65.0574C153.208 64.9069 153.099 64.6214 153.146 64.4189C153.192 64.2164 153.379 64.1801 153.566 64.3306C154.013 64.6992 154.386 65.2339 154.62 65.8361C154.854 66.4383 154.921 67.0353 154.802 67.5181C154.646 68.1774 154.168 68.5096 153.566 68.3954C153.535 68.3902 153.509 68.3798 153.478 68.3643V68.3591Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M155.544 73.6646C155.352 73.5659 155.201 73.3012 155.201 73.0676V72.2266C155.201 71.6504 154.88 70.9911 154.428 70.6121C154.241 70.4616 154.132 70.176 154.179 69.9736C154.225 69.7711 154.412 69.7348 154.599 69.8853C155.362 70.5135 155.892 71.6192 155.892 72.5744V73.4154C155.892 73.649 155.736 73.758 155.549 73.6594L155.544 73.6646Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M151.064 67.1813C150.114 66.6985 149.34 65.3591 149.34 64.2015C149.34 63.0438 150.114 62.4988 151.064 62.9815C152.014 63.4643 152.787 64.8037 152.787 65.9613C152.787 67.119 152.014 67.6641 151.064 67.1813ZM151.064 63.8277C150.493 63.537 150.031 63.8641 150.031 64.5597C150.031 65.2553 150.493 66.0548 151.064 66.3455C151.635 66.6362 152.097 66.3091 152.097 65.6135C152.097 64.9179 151.635 64.1184 151.064 63.8277Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.65137 80.0187C4.22378 79.2919 3.3153 77.5736 3.3153 75.1285C3.3153 70.7522 6.2328 65.7167 9.82515 63.8894L33.9126 51.6172C35.5012 50.8074 36.9547 50.7555 38.0864 51.3317L35.7711 50.1533C34.6394 49.5771 33.1858 49.629 31.5973 50.4388L7.50985 62.711C3.9123 64.5435 1 69.579 1 73.9501C1 76.3951 1.90847 78.1135 3.33607 78.8402L5.65137 80.0187Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M5.65141 80.0189C6.7831 80.5952 8.23666 80.5433 9.82519 79.7334L33.9127 67.4613C37.5102 65.6288 40.4225 60.5932 40.4225 56.2222C40.4225 53.7771 39.514 52.0588 38.0864 51.332C36.9547 50.7558 35.5012 50.8077 33.9127 51.6175L9.82519 63.8897C6.22764 65.7222 3.31534 70.7577 3.31534 75.1288C3.31534 77.5739 4.22381 79.2922 5.65141 80.0189Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M13.1164 68.6033C13.2046 68.4683 13.3344 68.4112 13.4175 68.4683C13.5005 68.5254 13.5057 68.6812 13.433 68.8265L13.4175 68.8577L10.2716 74.2929C10.1833 74.4435 10.0431 74.5161 9.95489 74.4538C9.86664 74.3915 9.86664 74.2202 9.95489 74.0645L13.1008 68.6292L13.1164 68.6033Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M10.7855 70.4155C10.7855 70.1871 10.635 70.0833 10.4481 70.1767C10.2612 70.2702 10.1106 70.5297 10.1106 70.7582C10.1106 70.9866 10.2612 71.0904 10.4481 70.9969C10.635 70.9035 10.7855 70.6439 10.7855 70.4155ZM11.2371 70.1871C11.2371 70.7166 10.8841 71.324 10.4481 71.5472C10.012 71.7704 9.659 71.5213 9.659 70.9918C9.659 70.4623 10.012 69.8549 10.4481 69.6317C10.8841 69.4084 11.2371 69.6576 11.2371 70.1871Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M13.2618 72.1646C13.2618 71.9361 13.1112 71.8323 12.9243 71.9258C12.7374 72.0192 12.5869 72.2788 12.5869 72.5072C12.5869 72.7356 12.7374 72.8394 12.9243 72.746C13.1112 72.6525 13.2618 72.393 13.2618 72.1646ZM13.7082 71.9361C13.7082 72.4656 13.3552 73.073 12.9191 73.2963C12.4831 73.5195 12.1301 73.2703 12.1301 72.7408C12.1301 72.2113 12.4831 71.6039 12.9191 71.3807C13.3552 71.1574 13.7082 71.4066 13.7082 71.9361Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M11.6109 66.615C11.6109 66.4696 11.7096 66.3035 11.829 66.2464C12.5298 65.9349 13.2099 65.8311 13.8172 65.9609C14.4869 66.1011 15.032 66.5112 15.411 67.1445C15.7847 67.7778 15.9716 68.6188 15.9508 69.5688C15.9301 70.524 15.6965 71.5571 15.2864 72.5642C14.8711 73.5713 14.2896 74.5161 13.6044 75.3C12.914 76.0839 12.1456 76.6757 11.3721 77.0131C10.5986 77.3505 9.8511 77.4284 9.20739 77.2311C8.62597 77.0494 8.14318 76.6549 7.81094 76.0735C7.75383 75.9748 7.80056 75.7932 7.90957 75.6738C8.01859 75.5544 8.14837 75.544 8.20547 75.6426C8.50657 76.1565 8.93225 76.5044 9.45138 76.6653C10.0328 76.8418 10.7025 76.7743 11.3981 76.468C12.0937 76.1617 12.7894 75.6322 13.4071 74.9262C14.0249 74.2202 14.5492 73.374 14.923 72.4656C15.2967 71.5571 15.4992 70.6278 15.52 69.7661C15.5407 68.9095 15.3746 68.1516 15.0372 67.5806C14.6997 67.0095 14.2066 66.641 13.6044 66.5164C13.0645 66.4022 12.4623 66.4904 11.8394 66.7655C11.72 66.8175 11.6213 66.75 11.6213 66.6046L11.6109 66.615Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M30.8653 63.8222L22.0506 68.3126C21.3238 68.6812 20.7372 68.2659 20.7372 67.3834C20.7372 66.5009 21.3238 65.4886 22.0506 65.12L30.8653 60.6295C31.5921 60.261 32.1787 60.6763 32.1787 61.5588C32.1787 62.4413 31.5921 63.4536 30.8653 63.8222Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M101.394 2.72093C102.614 2.09798 104.192 2.14989 105.91 3.02721L144.886 22.889C148.769 24.8669 151.921 30.3021 151.921 35.0314C151.921 37.6685 150.939 39.527 149.403 40.3109L151.718 39.1325C153.26 38.3486 154.236 36.4901 154.236 33.853C154.236 29.1289 151.085 23.6885 147.202 21.7106L108.22 1.8488C106.502 0.971472 104.929 0.919559 103.704 1.54251L101.389 2.72093H101.394Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M101.394 2.72025C99.8521 3.50413 98.8762 5.3626 98.8762 7.99976C98.8762 12.7238 102.027 18.1643 105.91 20.1421L144.886 40.0039C146.605 40.8812 148.178 40.9332 149.403 40.3102C150.945 39.5263 151.921 37.6678 151.921 35.0307C151.921 30.3066 148.769 24.8662 144.886 22.8883L105.91 3.02653C104.192 2.14921 102.619 2.09729 101.394 2.72025Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M106.424 9.66657V14.5879C106.424 15.4029 106.964 16.3425 107.639 16.6852L114.113 19.9816C114.782 20.3242 115.327 19.9401 115.327 19.1251V14.2037C115.327 13.3939 114.782 12.4491 114.113 12.1065L112.898 11.4887V10.9955C112.898 10.1857 112.353 9.24088 111.683 8.89826L110.063 8.07285C109.394 7.73023 108.849 8.11957 108.849 8.92941V9.42258L107.634 8.80482C106.964 8.46219 106.419 8.85154 106.419 9.66138L106.424 9.66657ZM114.113 19.0005L112.898 18.3827V12.475L114.113 13.0928C114.336 13.207 114.517 13.5185 114.517 13.7936V18.7149C114.517 18.9849 114.336 19.1147 114.113 19.0005ZM109.664 10.8242L112.093 12.0597V17.9674L109.664 16.7319V10.8242ZM109.664 9.34471C109.664 9.07476 109.845 8.94498 110.069 9.05919L111.688 9.8846C111.911 9.99881 112.093 10.3103 112.093 10.5854V11.0786L109.664 9.84307V9.3499V9.34471ZM107.234 10.0767C107.234 9.80673 107.416 9.67695 107.639 9.79116L108.854 10.4089V16.3166L107.639 15.6988C107.416 15.5846 107.234 15.2731 107.234 14.998V10.0767Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M126.675 20.5009C126.743 20.7189 126.888 20.9214 127.06 21.0096C127.293 21.1342 127.485 20.9941 127.49 20.6982V20.1583C127.49 19.9818 127.428 19.7793 127.309 19.6236C127.195 19.4626 127.044 19.364 126.914 19.364L124.142 19.2861C123.976 19.2861 123.867 19.4263 123.867 19.6443V23.3769C123.867 23.5637 123.945 23.7766 124.075 23.9375C124.204 24.0984 124.36 24.1867 124.495 24.1659L124.89 24.1088C125.097 24.0777 125.18 23.7973 125.071 23.4807C124.999 23.273 124.864 23.1017 124.724 23.0187V20.4438L126.675 20.5009Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M124.967 18.0351C125.035 18.2531 125.18 18.4556 125.352 18.5438C125.585 18.6684 125.777 18.5282 125.782 18.2323V17.6924C125.782 17.5159 125.72 17.3135 125.601 17.1577C125.481 17.002 125.336 16.8982 125.206 16.8982L122.434 16.8203C122.268 16.8203 122.159 16.9605 122.159 17.1785V20.911C122.159 21.0979 122.237 21.3108 122.367 21.4717C122.496 21.6326 122.652 21.7209 122.787 21.7001L123.182 21.643C123.389 21.6119 123.472 21.3315 123.363 21.0149C123.291 20.8072 123.156 20.6359 123.016 20.5528V17.978L124.967 18.0351Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M129.193 22.1783C129.079 22.0173 128.934 21.9187 128.799 21.9187L126.027 21.8408C125.866 21.8408 125.757 21.981 125.757 22.1938V25.9315C125.757 26.108 125.824 26.3053 125.938 26.4559C126.058 26.622 126.203 26.7154 126.338 26.7206L129.1 26.7985C129.271 26.8089 129.38 26.6687 129.38 26.4455V22.7078C129.38 22.5313 129.313 22.334 129.193 22.1783ZM128.529 25.646L126.613 25.5889V22.9985L128.529 23.0556V25.646Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M140.671 25.9108C138.999 25.0594 137.65 26.0198 137.65 28.0496C137.65 30.0794 139.005 32.4154 140.671 33.2668C142.343 34.1182 143.692 33.1578 143.692 31.128C143.692 29.0982 142.337 26.7622 140.671 25.9108ZM140.671 24.8622C138.527 23.7668 136.783 24.9971 136.783 27.6083C136.783 30.2195 138.522 33.2253 140.671 34.3154C142.815 35.4108 144.559 34.1805 144.559 31.5693C144.559 28.9581 142.82 25.9523 140.671 24.8622Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M140.671 32.4247C141.289 32.7414 141.881 32.7414 142.322 32.4351C142.763 32.1288 143.007 31.5318 143.007 30.7791C143.007 30.0264 142.763 29.1802 142.322 28.4274C141.886 27.6747 141.294 27.0725 140.671 26.7559V32.4299V32.4247Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-  </svg>
-);
+      <path
+        d="M153.478 72.6109C153.286 72.5122 153.135 72.2475 153.135 72.0139V71.1729C153.135 70.4773 152.673 69.6778 152.102 69.3871L150.031 68.3333C149.46 68.0426 148.998 68.3696 148.998 69.0652V69.9062C148.998 70.1398 148.842 70.2488 148.655 70.1502C148.468 70.0516 148.313 69.7868 148.313 69.5532V68.7122C148.313 67.5546 149.086 67.0095 150.036 67.4923L152.107 68.5461C153.057 69.0289 153.831 70.3682 153.831 71.5259V72.3669C153.831 72.6005 153.675 72.7095 153.488 72.6109H153.478Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M153.478 68.3591C153.322 68.2812 153.182 68.0839 153.146 67.8763C153.099 67.6271 153.208 67.4558 153.395 67.4921C153.758 67.5648 154.044 67.3623 154.137 66.9678C154.283 66.3708 153.945 65.5091 153.395 65.0574C153.208 64.9069 153.099 64.6214 153.146 64.4189C153.192 64.2164 153.379 64.1801 153.566 64.3306C154.013 64.6992 154.386 65.2339 154.62 65.8361C154.854 66.4383 154.921 67.0353 154.802 67.5181C154.646 68.1774 154.168 68.5096 153.566 68.3954C153.535 68.3902 153.509 68.3798 153.478 68.3643V68.3591Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M155.544 73.6646C155.352 73.5659 155.201 73.3012 155.201 73.0676V72.2266C155.201 71.6504 154.88 70.9911 154.428 70.6121C154.241 70.4616 154.132 70.176 154.179 69.9736C154.225 69.7711 154.412 69.7348 154.599 69.8853C155.362 70.5135 155.892 71.6192 155.892 72.5744V73.4154C155.892 73.649 155.736 73.758 155.549 73.6594L155.544 73.6646Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M151.064 67.1813C150.114 66.6985 149.34 65.3591 149.34 64.2015C149.34 63.0438 150.114 62.4988 151.064 62.9815C152.014 63.4643 152.787 64.8037 152.787 65.9613C152.787 67.119 152.014 67.6641 151.064 67.1813ZM151.064 63.8277C150.493 63.537 150.031 63.8641 150.031 64.5597C150.031 65.2553 150.493 66.0548 151.064 66.3455C151.635 66.6362 152.097 66.3091 152.097 65.6135C152.097 64.9179 151.635 64.1184 151.064 63.8277Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.65137 80.0187C4.22378 79.2919 3.3153 77.5736 3.3153 75.1285C3.3153 70.7522 6.2328 65.7167 9.82515 63.8894L33.9126 51.6172C35.5012 50.8074 36.9547 50.7555 38.0864 51.3317L35.7711 50.1533C34.6394 49.5771 33.1858 49.629 31.5973 50.4388L7.50985 62.711C3.9123 64.5435 1 69.579 1 73.9501C1 76.3951 1.90847 78.1135 3.33607 78.8402L5.65137 80.0187Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M5.65141 80.0189C6.7831 80.5952 8.23666 80.5433 9.82519 79.7334L33.9127 67.4613C37.5102 65.6288 40.4225 60.5932 40.4225 56.2222C40.4225 53.7771 39.514 52.0588 38.0864 51.332C36.9547 50.7558 35.5012 50.8077 33.9127 51.6175L9.82519 63.8897C6.22764 65.7222 3.31534 70.7577 3.31534 75.1288C3.31534 77.5739 4.22381 79.2922 5.65141 80.0189Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M13.1164 68.6033C13.2046 68.4683 13.3344 68.4112 13.4175 68.4683C13.5005 68.5254 13.5057 68.6812 13.433 68.8265L13.4175 68.8577L10.2716 74.2929C10.1833 74.4435 10.0431 74.5161 9.95489 74.4538C9.86664 74.3915 9.86664 74.2202 9.95489 74.0645L13.1008 68.6292L13.1164 68.6033Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M10.7855 70.4155C10.7855 70.1871 10.635 70.0833 10.4481 70.1767C10.2612 70.2702 10.1106 70.5297 10.1106 70.7582C10.1106 70.9866 10.2612 71.0904 10.4481 70.9969C10.635 70.9035 10.7855 70.6439 10.7855 70.4155ZM11.2371 70.1871C11.2371 70.7166 10.8841 71.324 10.4481 71.5472C10.012 71.7704 9.659 71.5213 9.659 70.9918C9.659 70.4623 10.012 69.8549 10.4481 69.6317C10.8841 69.4084 11.2371 69.6576 11.2371 70.1871Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M13.2618 72.1646C13.2618 71.9361 13.1112 71.8323 12.9243 71.9258C12.7374 72.0192 12.5869 72.2788 12.5869 72.5072C12.5869 72.7356 12.7374 72.8394 12.9243 72.746C13.1112 72.6525 13.2618 72.393 13.2618 72.1646ZM13.7082 71.9361C13.7082 72.4656 13.3552 73.073 12.9191 73.2963C12.4831 73.5195 12.1301 73.2703 12.1301 72.7408C12.1301 72.2113 12.4831 71.6039 12.9191 71.3807C13.3552 71.1574 13.7082 71.4066 13.7082 71.9361Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M11.6109 66.615C11.6109 66.4696 11.7096 66.3035 11.829 66.2464C12.5298 65.9349 13.2099 65.8311 13.8172 65.9609C14.4869 66.1011 15.032 66.5112 15.411 67.1445C15.7847 67.7778 15.9716 68.6188 15.9508 69.5688C15.9301 70.524 15.6965 71.5571 15.2864 72.5642C14.8711 73.5713 14.2896 74.5161 13.6044 75.3C12.914 76.0839 12.1456 76.6757 11.3721 77.0131C10.5986 77.3505 9.8511 77.4284 9.20739 77.2311C8.62597 77.0494 8.14318 76.6549 7.81094 76.0735C7.75383 75.9748 7.80056 75.7932 7.90957 75.6738C8.01859 75.5544 8.14837 75.544 8.20547 75.6426C8.50657 76.1565 8.93225 76.5044 9.45138 76.6653C10.0328 76.8418 10.7025 76.7743 11.3981 76.468C12.0937 76.1617 12.7894 75.6322 13.4071 74.9262C14.0249 74.2202 14.5492 73.374 14.923 72.4656C15.2967 71.5571 15.4992 70.6278 15.52 69.7661C15.5407 68.9095 15.3746 68.1516 15.0372 67.5806C14.6997 67.0095 14.2066 66.641 13.6044 66.5164C13.0645 66.4022 12.4623 66.4904 11.8394 66.7655C11.72 66.8175 11.6213 66.75 11.6213 66.6046L11.6109 66.615Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M30.8653 63.8222L22.0506 68.3126C21.3238 68.6812 20.7372 68.2659 20.7372 67.3834C20.7372 66.5009 21.3238 65.4886 22.0506 65.12L30.8653 60.6295C31.5921 60.261 32.1787 60.6763 32.1787 61.5588C32.1787 62.4413 31.5921 63.4536 30.8653 63.8222Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M101.394 2.72093C102.614 2.09798 104.192 2.14989 105.91 3.02721L144.886 22.889C148.769 24.8669 151.921 30.3021 151.921 35.0314C151.921 37.6685 150.939 39.527 149.403 40.3109L151.718 39.1325C153.26 38.3486 154.236 36.4901 154.236 33.853C154.236 29.1289 151.085 23.6885 147.202 21.7106L108.22 1.8488C106.502 0.971472 104.929 0.919559 103.704 1.54251L101.389 2.72093H101.394Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M101.394 2.72025C99.8521 3.50413 98.8762 5.3626 98.8762 7.99976C98.8762 12.7238 102.027 18.1643 105.91 20.1421L144.886 40.0039C146.605 40.8812 148.178 40.9332 149.403 40.3102C150.945 39.5263 151.921 37.6678 151.921 35.0307C151.921 30.3066 148.769 24.8662 144.886 22.8883L105.91 3.02653C104.192 2.14921 102.619 2.09729 101.394 2.72025Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M106.424 9.66657V14.5879C106.424 15.4029 106.964 16.3425 107.639 16.6852L114.113 19.9816C114.782 20.3242 115.327 19.9401 115.327 19.1251V14.2037C115.327 13.3939 114.782 12.4491 114.113 12.1065L112.898 11.4887V10.9955C112.898 10.1857 112.353 9.24088 111.683 8.89826L110.063 8.07285C109.394 7.73023 108.849 8.11957 108.849 8.92941V9.42258L107.634 8.80482C106.964 8.46219 106.419 8.85154 106.419 9.66138L106.424 9.66657ZM114.113 19.0005L112.898 18.3827V12.475L114.113 13.0928C114.336 13.207 114.517 13.5185 114.517 13.7936V18.7149C114.517 18.9849 114.336 19.1147 114.113 19.0005ZM109.664 10.8242L112.093 12.0597V17.9674L109.664 16.7319V10.8242ZM109.664 9.34471C109.664 9.07476 109.845 8.94498 110.069 9.05919L111.688 9.8846C111.911 9.99881 112.093 10.3103 112.093 10.5854V11.0786L109.664 9.84307V9.3499V9.34471ZM107.234 10.0767C107.234 9.80673 107.416 9.67695 107.639 9.79116L108.854 10.4089V16.3166L107.639 15.6988C107.416 15.5846 107.234 15.2731 107.234 14.998V10.0767Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M126.675 20.5009C126.743 20.7189 126.888 20.9214 127.06 21.0096C127.293 21.1342 127.485 20.9941 127.49 20.6982V20.1583C127.49 19.9818 127.428 19.7793 127.309 19.6236C127.195 19.4626 127.044 19.364 126.914 19.364L124.142 19.2861C123.976 19.2861 123.867 19.4263 123.867 19.6443V23.3769C123.867 23.5637 123.945 23.7766 124.075 23.9375C124.204 24.0984 124.36 24.1867 124.495 24.1659L124.89 24.1088C125.097 24.0777 125.18 23.7973 125.071 23.4807C124.999 23.273 124.864 23.1017 124.724 23.0187V20.4438L126.675 20.5009Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M124.967 18.0351C125.035 18.2531 125.18 18.4556 125.352 18.5438C125.585 18.6684 125.777 18.5282 125.782 18.2323V17.6924C125.782 17.5159 125.72 17.3135 125.601 17.1577C125.481 17.002 125.336 16.8982 125.206 16.8982L122.434 16.8203C122.268 16.8203 122.159 16.9605 122.159 17.1785V20.911C122.159 21.0979 122.237 21.3108 122.367 21.4717C122.496 21.6326 122.652 21.7209 122.787 21.7001L123.182 21.643C123.389 21.6119 123.472 21.3315 123.363 21.0149C123.291 20.8072 123.156 20.6359 123.016 20.5528V17.978L124.967 18.0351Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M129.193 22.1783C129.079 22.0173 128.934 21.9187 128.799 21.9187L126.027 21.8408C125.866 21.8408 125.757 21.981 125.757 22.1938V25.9315C125.757 26.108 125.824 26.3053 125.938 26.4559C126.058 26.622 126.203 26.7154 126.338 26.7206L129.1 26.7985C129.271 26.8089 129.38 26.6687 129.38 26.4455V22.7078C129.38 22.5313 129.313 22.334 129.193 22.1783ZM128.529 25.646L126.613 25.5889V22.9985L128.529 23.0556V25.646Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M140.671 25.9108C138.999 25.0594 137.65 26.0198 137.65 28.0496C137.65 30.0794 139.005 32.4154 140.671 33.2668C142.343 34.1182 143.692 33.1578 143.692 31.128C143.692 29.0982 142.337 26.7622 140.671 25.9108ZM140.671 24.8622C138.527 23.7668 136.783 24.9971 136.783 27.6083C136.783 30.2195 138.522 33.2253 140.671 34.3154C142.815 35.4108 144.559 34.1805 144.559 31.5693C144.559 28.9581 142.82 25.9523 140.671 24.8622Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M140.671 32.4247C141.289 32.7414 141.881 32.7414 142.322 32.4351C142.763 32.1288 143.007 31.5318 143.007 30.7791C143.007 30.0264 142.763 29.1802 142.322 28.4274C141.886 27.6747 141.294 27.0725 140.671 26.7559V32.4299V32.4247Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/view.tsx b/packages/propel/src/empty-state/assets/vertical-stack/view.tsx
index 223e1fa72..693fbea94 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/view.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/view.tsx
@@ -1,26 +1,62 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const ViewVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="163"
-    viewBox="0 0 162 163"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      d="M62.9863 126.722L62.6748 126.88C62.7412 126.845 62.8076 126.809 62.8739 126.773C62.9097 126.753 62.9505 126.737 62.9863 126.722Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M71.028 130.72L70.8289 130.827C70.7932 130.847 70.7523 130.863 70.7166 130.878L71.028 130.72Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <g opacity="0.2">
+export function ViewVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="163"
+      viewBox="0 0 162 163"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
       <path
-        d="M13.2695 129.423C13.2695 131.353 14.7145 133.278 17.5993 134.754L54.7451 153.681C60.52 156.622 69.8791 156.622 75.654 153.681L153.709 113.911C156.593 112.441 158.038 110.516 158.038 108.586V114.749C158.038 116.679 156.593 118.604 153.709 120.074L75.654 159.844C69.8791 162.785 60.52 162.785 54.7451 159.844L17.5993 140.917C14.7094 139.446 13.2695 137.516 13.2695 135.586V129.423Z"
+        d="M62.9863 126.722L62.6748 126.88C62.7412 126.845 62.8076 126.809 62.8739 126.773C62.9097 126.753 62.9505 126.737 62.9863 126.722Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M71.028 130.72L70.8289 130.827C70.7932 130.847 70.7523 130.863 70.7166 130.878L71.028 130.72Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <g opacity="0.2">
+        <path
+          d="M13.2695 129.423C13.2695 131.353 14.7145 133.278 17.5993 134.754L54.7451 153.681C60.52 156.622 69.8791 156.622 75.654 153.681L153.709 113.911C156.593 112.441 158.038 110.516 158.038 108.586V114.749C158.038 116.679 156.593 118.604 153.709 120.074L75.654 159.844C69.8791 162.785 60.52 162.785 54.7451 159.844L17.5993 140.917C14.7094 139.446 13.2695 137.516 13.2695 135.586V129.423Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M13.2695 129.423C13.2695 127.493 14.7145 125.568 17.5993 124.098L95.654 84.3276C101.429 81.3866 110.788 81.3866 116.563 84.3276L153.709 103.255C156.599 104.726 158.038 106.656 158.038 108.586C158.038 110.516 156.593 112.441 153.709 113.911L75.654 153.682C69.8791 156.623 60.52 156.623 54.7451 153.682L17.5993 134.754C14.7094 133.283 13.2695 131.353 13.2695 129.423Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M13.2695 109.954C13.2695 111.884 14.7145 113.809 17.5993 115.285L54.7451 134.212C60.52 137.153 69.8791 137.153 75.654 134.212L153.709 94.4422C156.593 92.9717 158.038 91.0467 158.038 89.1167V95.2796C158.038 97.2096 156.593 99.1346 153.709 100.605L75.654 140.375C69.8791 143.316 60.52 143.316 54.7451 140.375L17.5993 121.448C14.7094 119.977 13.2695 118.047 13.2695 116.117V109.954Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M13.2695 109.954C13.2695 108.024 14.7145 106.099 17.5993 104.629L95.654 64.8584C101.429 61.9173 110.788 61.9173 116.563 64.8584L153.709 83.7861C156.599 85.2566 158.038 87.1866 158.038 89.1167C158.038 91.0467 156.593 92.9717 153.709 94.4422L75.654 134.212C69.8791 137.153 60.52 137.153 54.7451 134.212L17.5993 115.285C14.7094 113.814 13.2695 111.884 13.2695 109.954Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <path
+        d="M13.2695 90.4858C13.2695 92.4158 14.7145 94.3408 17.5993 95.8164L54.7451 114.744C60.52 117.685 69.8791 117.685 75.654 114.744L153.709 74.9739C156.593 73.5034 158.038 71.5785 158.038 69.6484V75.8113C158.038 77.7414 156.593 79.6663 153.709 81.1368L75.654 120.907C69.8791 123.848 60.52 123.848 54.7451 120.907L17.5993 101.979C14.7094 100.509 13.2695 98.5787 13.2695 96.6487V90.4858Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -28,17 +64,17 @@ export const ViewVerticalStackIllustration = ({ className }: TIllustrationAssetP
         strokeLinejoin="round"
       />
       <path
-        d="M13.2695 129.423C13.2695 127.493 14.7145 125.568 17.5993 124.098L95.654 84.3276C101.429 81.3866 110.788 81.3866 116.563 84.3276L153.709 103.255C156.599 104.726 158.038 106.656 158.038 108.586C158.038 110.516 156.593 112.441 153.709 113.911L75.654 153.682C69.8791 156.623 60.52 156.623 54.7451 153.682L17.5993 134.754C14.7094 133.283 13.2695 131.353 13.2695 129.423Z"
+        d="M13.2695 90.4858C13.2695 88.5558 14.7145 86.6308 17.5993 85.1603L95.654 45.3901C101.429 42.4491 110.788 42.4491 116.563 45.3901L153.709 64.3178C156.599 65.7883 158.038 67.7184 158.038 69.6484C158.038 71.5785 156.593 73.5034 153.709 74.9739L75.654 114.744C69.8791 117.685 60.52 117.685 54.7451 114.744L17.5993 95.8164C14.7094 94.3459 13.2695 92.4158 13.2695 90.4858Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M13.2695 109.954C13.2695 111.884 14.7145 113.809 17.5993 115.285L54.7451 134.212C60.52 137.153 69.8791 137.153 75.654 134.212L153.709 94.4422C156.593 92.9717 158.038 91.0467 158.038 89.1167V95.2796C158.038 97.2096 156.593 99.1346 153.709 100.605L75.654 140.375C69.8791 143.316 60.52 143.316 54.7451 140.375L17.5993 121.448C14.7094 119.977 13.2695 118.047 13.2695 116.117V109.954Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M131.809 3.76634C132.958 3.17916 134.434 3.23022 136.047 4.05227C139.698 5.91084 142.654 11.0219 142.654 15.4641C142.654 17.9404 141.735 19.6867 140.285 20.427L142.634 19.2322C144.084 18.497 145.003 16.7457 145.003 14.2693C145.003 9.8271 142.041 4.72115 138.396 2.85748C136.782 2.03542 135.302 1.98437 134.158 2.57155L131.809 3.76634Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -46,273 +82,239 @@ export const ViewVerticalStackIllustration = ({ className }: TIllustrationAssetP
         strokeLinejoin="round"
       />
       <path
-        d="M13.2695 109.954C13.2695 108.024 14.7145 106.099 17.5993 104.629L95.654 64.8584C101.429 61.9173 110.788 61.9173 116.563 64.8584L153.709 83.7861C156.599 85.2566 158.038 87.1866 158.038 89.1167C158.038 91.0467 156.593 92.9717 153.709 94.4422L75.654 134.212C69.8791 137.153 60.52 137.153 54.7451 134.212L17.5993 115.285C14.7094 113.814 13.2695 111.884 13.2695 109.954Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M131.809 3.76637C130.359 4.50163 129.44 6.25297 129.44 8.72935C129.44 13.1715 132.402 18.2775 136.047 20.1411C137.661 20.9632 139.141 21.0143 140.285 20.4271C141.735 19.6918 142.654 17.9405 142.654 15.4641C142.654 11.0219 139.693 5.91598 136.047 4.05231C134.434 3.23025 132.953 3.17919 131.809 3.76637Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M13.2695 90.4858C13.2695 92.4158 14.7145 94.3408 17.5993 95.8164L54.7451 114.744C60.52 117.685 69.8791 117.685 75.654 114.744L153.709 74.9739C156.593 73.5034 158.038 71.5785 158.038 69.6484V75.8113C158.038 77.7414 156.593 79.6663 153.709 81.1368L75.654 120.907C69.8791 123.848 60.52 123.848 54.7451 120.907L17.5993 101.979C14.7094 100.509 13.2695 98.5787 13.2695 96.6487V90.4858Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M13.2695 90.4858C13.2695 88.5558 14.7145 86.6308 17.5993 85.1603L95.654 45.3901C101.429 42.4491 110.788 42.4491 116.563 45.3901L153.709 64.3178C156.599 65.7883 158.038 67.7184 158.038 69.6484C158.038 71.5785 156.593 73.5034 153.709 74.9739L75.654 114.744C69.8791 117.685 60.52 117.685 54.7451 114.744L17.5993 95.8164C14.7094 94.3459 13.2695 92.4158 13.2695 90.4858Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M131.809 3.76634C132.958 3.17916 134.434 3.23022 136.047 4.05227C139.698 5.91084 142.654 11.0219 142.654 15.4641C142.654 17.9404 141.735 19.6867 140.285 20.427L142.634 19.2322C144.084 18.497 145.003 16.7457 145.003 14.2693C145.003 9.8271 142.041 4.72115 138.396 2.85748C136.782 2.03542 135.302 1.98437 134.158 2.57155L131.809 3.76634Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M131.809 3.76637C130.359 4.50163 129.44 6.25297 129.44 8.72935C129.44 13.1715 132.402 18.2775 136.047 20.1411C137.661 20.9632 139.141 21.0143 140.285 20.4271C141.735 19.6918 142.654 17.9405 142.654 15.4641C142.654 11.0219 139.693 5.91598 136.047 4.05231C134.434 3.23025 132.953 3.17919 131.809 3.76637Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M134.643 8.83126C134.444 8.72914 134.28 8.44831 134.28 8.20833V6.45189C134.28 6.2068 134.444 6.09447 134.643 6.19659C134.842 6.29871 135.006 6.57954 135.006 6.81952V8.57596C135.006 8.82105 134.842 8.93338 134.643 8.83126Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M137.533 10.3071C137.334 10.205 137.17 9.92414 137.17 9.68416V7.92772C137.17 7.68263 137.334 7.5703 137.533 7.67242C137.732 7.77454 137.896 8.05537 137.896 8.29535V10.0518C137.896 10.2969 137.732 10.4092 137.533 10.3071Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M138.615 17.8841L133.561 15.3107C132.963 15.0044 132.478 14.167 132.478 13.442V7.2893C132.478 6.56426 132.963 6.21705 133.561 6.52341L138.615 9.09681C139.213 9.40316 139.698 10.2405 139.698 10.9656V17.1182C139.698 17.8433 139.213 18.1905 138.615 17.8841ZM133.561 7.40163C133.361 7.29951 133.198 7.41695 133.198 7.65693V13.8096C133.198 14.0496 133.361 14.3304 133.561 14.4325L138.615 17.0059C138.815 17.108 138.978 16.9906 138.978 16.7506V10.598C138.978 10.358 138.815 10.0771 138.615 9.97503L133.561 7.40163Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M139.335 12.9826L132.835 9.66883C132.636 9.56671 132.473 9.28589 132.473 9.04591C132.473 8.80593 132.636 8.68849 132.835 8.79061L139.335 12.1044C139.534 12.2065 139.698 12.4873 139.698 12.7273C139.698 12.9673 139.534 13.0847 139.335 12.9826Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M52.9734 2.51989C51.7735 1.90718 50.2213 1.95824 48.5313 2.82114L10.1958 22.3565C6.37655 24.3019 3.27725 29.6478 3.27725 34.2993C3.27725 36.8931 4.24228 38.721 5.75364 39.492L3.47637 38.333C1.95991 37.562 1 35.7341 1 33.1402C1 28.4938 4.0993 23.1428 7.91855 21.1974L46.2591 1.6621C47.9492 0.79919 49.4963 0.748131 50.7013 1.36084L52.9786 2.51989H52.9734Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M52.9734 2.52027C54.4898 3.29127 55.4498 5.11919 55.4498 7.71301C55.4498 12.3594 52.3504 17.7105 48.5312 19.6558L10.1957 39.1912C8.50565 40.0541 6.95855 40.1051 5.75355 39.4924C4.23708 38.7214 3.27716 36.8935 3.27716 34.2997C3.27716 29.6533 6.37647 24.3022 10.1957 22.3569L48.5312 2.82152C50.2212 1.95861 51.7684 1.90755 52.9734 2.52027Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M27.8317 25.3737C27.5764 25.5013 27.3671 25.3584 27.3671 25.0469V18.8585C27.3671 18.547 27.5764 18.1896 27.8317 18.062C28.087 17.9343 28.2964 18.0773 28.2964 18.3888V24.5772C28.2964 24.8886 28.087 25.246 27.8317 25.3737Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M30.6094 21.1463C30.3541 21.2739 30.1447 21.1309 30.1447 20.8195V17.4444C30.1447 17.133 30.3541 16.7756 30.6094 16.6479C30.8647 16.5203 31.074 16.6632 31.074 16.9747V20.3497C31.074 20.6612 30.8647 21.0186 30.6094 21.1463Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M33.3819 24.2305C33.1266 24.3582 32.9173 24.2152 32.9173 23.9037V16.0253C32.9173 15.7138 33.1266 15.3564 33.3819 15.2287C33.6372 15.1011 33.8466 15.244 33.8466 15.5555V23.434C33.8466 23.7454 33.6372 24.1029 33.3819 24.2305Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M13.4382 29.9341C13.1829 30.0618 12.9787 29.9188 12.9787 29.6125C12.9787 29.3061 13.1829 28.9487 13.4331 28.821C13.6884 28.6883 13.8927 28.8364 13.8927 29.1427C13.8927 29.4491 13.6884 29.8065 13.4331 29.9341H13.4382Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M13.4382 33.2835C13.1829 33.4112 12.9787 33.2682 12.9787 32.9618C12.9787 32.6555 13.1829 32.2981 13.4331 32.1704C13.6884 32.0377 13.8927 32.1857 13.8927 32.4921C13.8927 32.7984 13.6884 33.1559 13.4331 33.2835H13.4382Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M13.4382 26.5845C13.1829 26.7122 12.9787 26.5692 12.9787 26.2629C12.9787 25.9565 13.1829 25.5991 13.4331 25.4714C13.6884 25.3387 13.8927 25.4868 13.8927 25.7931C13.8927 26.0995 13.6884 26.4569 13.4331 26.5845H13.4382Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M21.6946 25.7266L15.7308 28.7646C15.4755 28.8923 15.2713 28.7493 15.2713 28.4378C15.2713 28.1264 15.4755 27.774 15.7308 27.6464L21.6946 24.6084C21.9499 24.4807 22.1541 24.6237 22.1541 24.9351C22.1541 25.2466 21.9499 25.5989 21.6946 25.7266Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M21.6946 29.0762L15.7308 32.1142C15.4755 32.2419 15.2713 32.0989 15.2713 31.7874C15.2713 31.476 15.4755 31.1237 15.7308 30.996L21.6946 27.958C21.9499 27.8303 22.1541 27.9733 22.1541 28.2848C22.1541 28.5962 21.9499 28.9485 21.6946 29.0762Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M21.6946 22.3772L15.7308 25.4152C15.4755 25.5429 15.2713 25.3999 15.2713 25.0885C15.2713 24.777 15.4755 24.4247 15.7308 24.297L21.6946 21.259C21.9499 21.1314 22.1541 21.2743 22.1541 21.5858C22.1541 21.8972 21.9499 22.2496 21.6946 22.3772Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M46.4737 17.3022L41.4188 19.8756C40.8214 20.1819 40.3364 19.8347 40.3364 19.1097V12.957C40.3364 12.232 40.8214 11.3895 41.4188 11.0883L46.4737 8.51487C47.0711 8.20851 47.5562 8.55571 47.5562 9.28076V15.4334C47.5562 16.1585 47.0711 17.0009 46.4737 17.3022ZM41.4188 11.9665C41.2197 12.0686 41.0563 12.3494 41.0563 12.5894V18.7421C41.0563 18.9821 41.2197 19.0995 41.4188 18.9974L46.4737 16.424C46.6729 16.3219 46.8362 16.041 46.8362 15.801V9.64839C46.8362 9.40841 46.6729 9.29097 46.4737 9.39309L41.4188 11.9665Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M45.3913 12.1402L42.8639 13.4269C42.6647 13.5291 42.5013 13.4167 42.5013 13.1716C42.5013 12.9266 42.6647 12.6508 42.8639 12.5487L45.3913 11.262C45.5905 11.1599 45.7538 11.2722 45.7538 11.5173C45.7538 11.7624 45.5905 12.0381 45.3913 12.1402Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M44.6662 14.2643L42.5013 15.3672C42.3021 15.4693 42.1388 15.3569 42.1388 15.1119C42.1388 14.8668 42.3021 14.591 42.5013 14.4889L44.6662 13.386C44.8653 13.2839 45.0287 13.3963 45.0287 13.6413C45.0287 13.8864 44.8653 14.1621 44.6662 14.2643Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M45.3913 15.6581L43.5838 16.5771C43.3846 16.6793 43.2213 16.5669 43.2213 16.3218C43.2213 16.0768 43.3846 15.801 43.5838 15.6989L45.3913 14.7798C45.5904 14.6777 45.7538 14.7901 45.7538 15.0351C45.7538 15.2802 45.5904 15.5559 45.3913 15.6581Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M147.806 26.2112C148.955 25.624 150.431 25.675 152.044 26.4971C155.695 28.3557 158.651 33.4667 158.651 37.9089C158.651 40.3853 157.732 42.1315 156.282 42.8719L158.631 41.6771C160.081 40.9418 161 39.1905 161 36.7141C161 32.2719 158.039 27.166 154.393 25.3023C152.779 24.4802 151.299 24.4292 150.155 25.0164L147.806 26.2112Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M147.806 26.2112C146.356 26.9465 145.437 28.6978 145.437 31.1742C145.437 35.6163 148.399 40.7223 152.044 42.586C153.658 43.408 155.138 43.4591 156.282 42.8719C157.732 42.1366 158.651 40.3853 158.651 37.9089C158.651 33.4667 155.69 28.3608 152.044 26.4971C150.431 25.6751 148.95 25.624 147.806 26.2112Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M154.664 40.4408L149.609 37.8674C149.011 37.561 148.526 36.7236 148.526 35.9986V29.8459C148.526 29.1209 149.011 28.7737 149.609 29.0801L154.664 31.6534C155.261 31.9598 155.746 32.7972 155.746 33.5222V39.6749C155.746 40.3999 155.261 40.7471 154.664 40.4408ZM149.609 29.9532C149.41 29.851 149.246 29.9685 149.246 30.2085V36.3611C149.246 36.6011 149.41 36.8819 149.609 36.9841L154.664 39.5575C154.863 39.6596 155.026 39.5421 155.026 39.3022V33.1495C155.026 32.9095 154.863 32.6287 154.664 32.5266L149.609 29.9532Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M155.389 35.5341L148.889 32.2203C148.69 32.1182 148.526 31.8374 148.526 31.5974C148.526 31.3574 148.69 31.24 148.889 31.3421L155.389 34.6559C155.588 34.758 155.751 35.0388 155.751 35.2788C155.751 35.5188 155.588 35.6362 155.389 35.5341Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M155.389 38.1689L148.889 34.8551C148.69 34.753 148.526 34.4722 148.526 34.2322C148.526 33.9922 148.69 33.8748 148.889 33.9769L155.389 37.2906C155.588 37.3928 155.751 37.6736 155.751 37.9136C155.751 38.1536 155.588 38.271 155.389 38.1689Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M151.054 38.5975C150.855 38.4954 150.691 38.2146 150.691 37.9746V32.7002C150.691 32.4551 150.855 32.3428 151.054 32.4449C151.253 32.547 151.416 32.8278 151.416 33.0678V38.3422C151.416 38.5873 151.253 38.6997 151.054 38.5975Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M153.219 39.7057C153.02 39.6036 152.856 39.3228 152.856 39.0828V33.8083C152.856 33.5632 153.02 33.4509 153.219 33.553C153.418 33.6552 153.581 33.936 153.581 34.176V39.4504C153.581 39.6955 153.418 39.8078 153.219 39.7057Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M82.2561 58.3329C80.3158 58.3329 78.4827 57.9448 77.0939 57.2351L51.0332 43.9596C49.5371 43.1988 48.71 42.1419 48.71 40.988V35.882C48.71 34.7332 49.532 33.6814 51.0281 32.9155L77.0888 19.64C78.4776 18.9303 80.3107 18.5422 82.2509 18.5422C84.1912 18.5422 86.0293 18.9303 87.4182 19.64L113.474 32.9155C114.97 33.6763 115.797 34.7332 115.797 35.8871V40.9931C115.797 42.1419 114.975 43.1988 113.474 43.9596L87.4182 57.2351C86.0293 57.9448 84.1963 58.3329 82.2509 58.3329H82.2561ZM79.5754 44.7613C80.2852 45.1238 81.2349 45.3229 82.2561 45.3229C83.2772 45.3229 84.232 45.1238 84.9418 44.7613L97.3543 38.435L84.9418 32.1138C84.232 31.7513 83.2772 31.5522 82.2561 31.5522C81.2349 31.5522 80.2801 31.7513 79.5754 32.1138L67.1628 38.435L79.5754 44.7613Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M82.256 19.0529C84.0431 19.0529 85.8251 19.4001 87.1884 20.0945L113.244 33.37C114.607 34.0644 115.286 34.9784 115.286 35.8872V40.9932C115.286 41.902 114.607 42.8109 113.244 43.5053L87.1884 56.7808C85.8251 57.4752 84.038 57.8224 82.256 57.8224C80.4741 57.8224 78.687 57.4752 77.3237 56.7808L51.2629 43.5053C49.8996 42.8109 49.2205 41.8969 49.2205 40.9881V35.8821C49.2205 34.9733 49.9047 34.0644 51.2629 33.37L77.3237 20.0945C78.687 19.4001 80.4689 19.0529 82.256 19.0529ZM82.256 45.8336C83.313 45.8336 84.3648 45.6294 85.1715 45.2158L98.4776 38.4351L85.1715 31.6595C84.3648 31.251 83.3079 31.0417 82.256 31.0417C81.2042 31.0417 80.1473 31.2459 79.3405 31.6595L66.0344 38.4351L79.3405 45.2158C80.1473 45.6243 81.1991 45.8336 82.256 45.8336ZM82.256 18.0317C80.2341 18.0317 78.3193 18.4402 76.859 19.1857L50.7983 32.4611C49.1235 33.3189 48.1993 34.5342 48.1993 35.8821V40.9881C48.1993 41.7744 48.5363 43.2653 50.7983 44.4142L76.859 57.6896C78.3142 58.4351 80.229 58.8435 82.2509 58.8435C84.2729 58.8435 86.1876 58.4351 87.6479 57.6896L113.704 44.4142C115.965 43.2602 116.302 41.7744 116.302 40.9932V35.8872C116.302 35.1009 115.965 33.61 113.704 32.4611L87.6479 19.1857C86.1876 18.4402 84.2729 18.0317 82.2509 18.0317H82.256ZM68.2912 38.4351L79.8103 32.5684C80.4383 32.2467 81.3318 32.0629 82.2611 32.0629C83.1904 32.0629 84.0839 32.2467 84.7171 32.5684L96.2361 38.4351L84.7171 44.3069C84.089 44.6286 83.1904 44.8124 82.2611 44.8124C81.3318 44.8124 80.4383 44.6286 79.8103 44.3069L68.2912 38.4351Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M82.0263 93.9614C79.6163 93.9614 77.4871 93.5785 76.1851 92.9147L50.2724 79.7158C49.9915 79.5728 49.7362 79.4197 49.486 79.2461C49.4707 79.2359 49.4554 79.2205 49.4401 79.2103C48.8682 78.7099 48.567 78.1228 48.567 77.51V72.4041C48.567 71.5157 49.1899 70.714 50.3183 70.1371C51.3395 69.6163 52.6874 69.3303 54.112 69.3303C55.3374 69.3303 56.5374 69.5499 57.4922 69.9481C57.6147 70.0043 57.8343 70.1166 58.304 70.3566L77.5687 80.1754C78.8146 80.8085 80.4842 81.1557 82.2662 81.1557C84.0482 81.1557 85.723 80.8085 86.9688 80.1754L106.228 70.3617C106.708 70.1166 106.923 69.9992 107.045 69.9532C108 69.5499 109.2 69.3303 110.42 69.3303C111.845 69.3303 113.188 69.6163 114.209 70.1371C115.337 70.7089 115.96 71.5157 115.96 72.4041V77.51C115.96 78.133 115.644 78.7304 115.052 79.2359C114.781 79.4299 114.536 79.5728 114.26 79.7158L88.6691 92.7513C87.1833 93.507 84.7069 93.9614 82.0364 93.9614H82.0263Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M110.415 69.8412C111.702 69.8412 112.989 70.0914 113.969 70.5918C114.955 71.0922 115.445 71.7457 115.445 72.4044V77.5103C115.445 77.9699 115.2 78.4345 114.715 78.8481C114.495 79.0013 114.27 79.134 114.02 79.2617L113.407 79.5731L88.4291 92.2972C86.9535 93.0477 84.4618 93.4511 82.0263 93.4511C79.8563 93.4511 77.7322 93.1345 76.4149 92.4606L51.1455 79.5885L50.5022 79.2617C50.2418 79.1289 50.0018 78.986 49.772 78.8277C49.3073 78.4192 49.0725 77.9648 49.0725 77.5103V72.4044C49.0725 71.7457 49.5626 71.0922 50.543 70.5918C51.5284 70.0914 52.8152 69.8412 54.1019 69.8412C55.2303 69.8412 56.3587 70.0352 57.288 70.4182C57.2931 70.4182 58.0641 70.8114 58.0641 70.8114L77.3288 80.6301C78.6921 81.3245 80.4741 81.6666 82.2611 81.6666C84.0482 81.6666 85.8302 81.3194 87.1935 80.6301L106.453 70.8165C106.453 70.8165 107.224 70.4182 107.234 70.4182C108.159 70.0301 109.287 69.8412 110.415 69.8412ZM110.415 68.82C109.108 68.82 107.873 69.0498 106.841 69.4787C106.683 69.5502 106.438 69.6778 105.983 69.9127L86.7288 79.7212C85.5698 80.3084 83.941 80.6454 82.2561 80.6454C80.5711 80.6454 78.9474 80.3084 77.7884 79.7161L58.5236 69.8974C58.0743 69.6676 57.8343 69.5451 57.676 69.4736C56.6446 69.0396 55.409 68.8098 54.0967 68.8098C52.5956 68.8098 51.1659 69.1162 50.0733 69.6727C48.3066 70.5714 48.0462 71.7662 48.0462 72.3942V77.5001C48.0462 78.0312 48.23 78.8226 49.0929 79.5834C49.1236 79.6089 49.1542 79.6344 49.1899 79.6599C49.4605 79.8438 49.7363 80.0123 50.0375 80.1603L50.6809 80.4871L75.9502 93.3592C77.8292 94.3191 80.5609 94.4621 82.0263 94.4621C84.7733 94.4621 87.3416 93.9872 88.8938 93.1958L113.872 80.4718L114.485 80.1603C114.781 80.0072 115.046 79.8489 115.302 79.6753C115.327 79.6548 115.353 79.6344 115.378 79.614C116.277 78.8481 116.466 78.0414 116.466 77.5001V72.3942C116.466 71.7611 116.2 70.5714 114.434 69.6727C113.346 69.1162 111.917 68.8098 110.415 68.8098V68.82Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M82.0262 76.1474C79.6162 76.1474 77.487 75.7645 76.1799 75.1007L50.2672 61.9018C49.9864 61.7589 49.7311 61.6057 49.4809 61.4321C49.4656 61.4219 49.4502 61.4066 49.4349 61.3964C48.8631 60.896 48.5618 60.3088 48.5618 59.6961V54.5901C48.5618 53.7017 49.1847 52.9001 50.3131 52.3231C51.3343 51.8023 52.6823 51.5164 54.1069 51.5164C55.3323 51.5164 56.5322 51.7359 57.487 52.1342C57.6096 52.1903 57.8291 52.3027 58.2988 52.5427L77.5636 62.3614C78.8095 62.9945 80.4791 63.3417 82.2611 63.3417C84.043 63.3417 85.7178 62.9945 86.9637 62.3614L106.223 52.5478C106.703 52.3027 106.918 52.1852 107.04 52.1393C107.995 51.7359 109.195 51.5164 110.415 51.5164C111.84 51.5164 113.183 51.8023 114.204 52.3231C115.332 52.895 115.955 53.7017 115.955 54.5901V59.6961C115.955 60.319 115.639 60.9164 115.046 61.4219C114.776 61.6159 114.531 61.7589 114.255 61.9018L88.6639 74.9373C87.1781 75.693 84.7017 76.1474 82.0313 76.1474H82.0262Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M110.415 52.0272C111.702 52.0272 112.989 52.2774 113.969 52.7778C114.955 53.2782 115.445 53.9318 115.445 54.5904V59.6964C115.445 60.1559 115.2 60.6206 114.715 61.0341C114.495 61.1873 114.27 61.3201 114.02 61.4477L113.407 61.7592L88.4291 74.4832C86.9535 75.2338 84.4618 75.6371 82.0263 75.6371C79.8563 75.6371 77.7322 75.3206 76.4149 74.6466L51.1455 61.7745L50.5022 61.4477C50.2418 61.315 50.0018 61.172 49.772 61.0137C49.3073 60.6052 49.0725 60.1508 49.0725 59.6964V54.5904C49.0725 53.9318 49.5626 53.2782 50.543 52.7778C51.5284 52.2774 52.8152 52.0272 54.1019 52.0272C55.2303 52.0272 56.3587 52.2213 57.288 52.6042C57.2931 52.6042 58.0641 52.9974 58.0641 52.9974L77.3288 62.8161C78.6921 63.5054 80.4741 63.8526 82.2611 63.8526C84.0482 63.8526 85.8302 63.5054 87.1935 62.8161L106.453 53.0025C106.453 53.0025 107.224 52.6042 107.234 52.6042C108.159 52.2162 109.287 52.0272 110.415 52.0272ZM110.415 51.0061C109.108 51.0061 107.873 51.2358 106.841 51.6647C106.683 51.7362 106.438 51.8639 105.983 52.0987L86.7288 61.9073C85.5698 62.4944 83.941 62.8314 82.2561 62.8314C80.5711 62.8314 78.9474 62.4944 77.7884 61.9021L58.5236 52.0834C58.0743 51.8536 57.8343 51.7311 57.676 51.6596C56.6446 51.2256 55.409 50.9958 54.0967 50.9958C52.5956 50.9958 51.1659 51.3022 50.0733 51.8588C48.3066 52.7574 48.0462 53.9522 48.0462 54.5802V59.6862C48.0462 60.2172 48.23 61.0086 49.0929 61.7694C49.1236 61.7949 49.1542 61.8205 49.1899 61.8409C49.4605 62.0247 49.7363 62.1932 50.0375 62.3464L50.6809 62.6731L75.9502 75.5452C77.8292 76.5051 80.5609 76.6481 82.0263 76.6481C84.7733 76.6481 87.3416 76.1733 88.8938 75.3818L113.872 62.6578L114.485 62.3464C114.781 62.1932 115.052 62.0349 115.302 61.8613C115.327 61.8409 115.353 61.8204 115.378 61.8C116.277 61.0341 116.466 60.2274 116.466 59.6862V54.5802C116.466 53.9471 116.2 52.7574 114.434 51.8588C113.346 51.3022 111.917 50.9958 110.415 50.9958V51.0061Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M101.786 35.8865C101.786 35.3453 101.383 34.8091 100.576 34.3956L85.1765 26.5528C83.563 25.7308 80.9539 25.7308 79.3455 26.5528L63.946 34.3956C63.1392 34.8091 62.7359 35.3453 62.7359 35.8814V40.9873C62.7359 40.4512 63.1392 39.9151 63.946 39.5015L79.3455 31.6588C80.9539 30.8367 83.563 30.8367 85.1765 31.6588L100.576 39.5015C101.383 39.9151 101.786 40.4512 101.786 40.9924V35.8865Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M49.2255 35.8818C49.2255 36.7907 49.9046 37.7047 51.2679 38.3991L77.3286 51.6745C80.0501 53.0633 84.4668 53.0633 87.1933 51.6745L113.249 38.3991C114.612 37.7047 115.291 36.7958 115.291 35.8869V40.9929C115.291 41.9017 114.612 42.8106 113.249 43.505L87.1933 56.7805C84.4668 58.1693 80.0501 58.1693 77.3286 56.7805L51.2679 43.505C49.9046 42.8106 49.2255 41.8966 49.2255 40.9878V35.8818Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M113.249 33.37L87.1933 20.0946C84.4668 18.7058 80.0501 18.7058 77.3286 20.0946L51.2679 33.37C49.9097 34.0645 49.2255 34.9733 49.2255 35.8822C49.2255 36.791 49.9046 37.705 51.2679 38.3994L77.3286 51.6749C80.0501 53.0637 84.4668 53.0637 87.1933 51.6749L113.249 38.3994C114.612 37.705 115.291 36.7961 115.291 35.8873C115.291 34.9784 114.612 34.0645 113.249 33.37ZM100.576 37.368L85.1765 45.2158C83.563 46.0379 80.9539 46.0379 79.3455 45.2158L63.9459 37.368C63.1392 36.9595 62.7358 36.4234 62.7358 35.8822C62.7358 35.3409 63.1392 34.8099 63.9459 34.3963L79.3455 26.5536C80.9539 25.7316 83.563 25.7316 85.1765 26.5536L100.576 34.3963C101.383 34.8099 101.786 35.346 101.786 35.8873C101.786 36.4285 101.383 36.9595 100.576 37.368Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M115.444 72.4053V77.5112C115.444 77.9708 115.199 78.4354 114.714 78.849C114.495 79.0022 114.27 79.1349 114.02 79.2626L113.407 79.574L88.4287 92.298C85.6358 93.7226 79.2074 93.886 76.4144 92.4614L51.1451 79.5893L50.5017 79.2626C50.2413 79.1298 50.0013 78.9868 49.7716 78.8286C49.3069 78.4201 49.0721 77.9656 49.0721 77.5112V72.4053C49.0721 72.8597 49.3069 73.3141 49.7716 73.7226C50.0013 73.8809 50.2413 74.0239 50.5017 74.1566L51.1451 74.4834L76.4144 87.3555C79.2074 88.78 85.6358 88.6166 88.4287 87.1921L113.407 74.4681L114.02 74.1566C114.27 74.029 114.495 73.8962 114.714 73.743C115.199 73.3294 115.444 72.8648 115.444 72.4053Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M115.445 72.4047C115.445 72.8642 115.199 73.3289 114.714 73.7424C114.495 73.8956 114.27 74.0284 114.02 74.156L113.407 74.4675L88.429 87.1915C85.636 88.616 79.2076 88.7794 76.4147 87.3549L51.1453 74.4828L50.502 74.156C50.2416 74.0233 50.0016 73.8803 49.7718 73.722C49.3072 73.3135 49.0723 72.8591 49.0723 72.4047C49.0723 71.746 49.5625 71.0924 50.5428 70.5921C52.3861 69.6526 55.3016 69.5913 57.2878 70.4185C57.2929 70.4185 58.0639 70.8116 58.0639 70.8116L77.3286 80.6304C80.0501 82.0141 84.4668 82.0141 87.1933 80.6304L106.453 70.8167C106.453 70.8167 107.224 70.4185 107.234 70.4185C109.215 69.5913 112.131 69.6526 113.969 70.5921C114.954 71.0924 115.445 71.746 115.445 72.4047Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M115.444 54.5898V59.6958C115.444 60.1553 115.199 60.62 114.714 61.0335C114.495 61.1867 114.27 61.3195 114.02 61.4471L113.407 61.7586L88.4288 74.4826C85.6359 75.9072 79.2075 76.0706 76.4146 74.646L51.1452 61.7739L50.5019 61.4471C50.2415 61.3144 50.0015 61.1714 49.7717 61.0131C49.307 60.6046 49.0722 60.1502 49.0722 59.6958V54.5898C49.0722 55.0443 49.307 55.4987 49.7717 55.9072C50.0015 56.0655 50.2415 56.2084 50.5019 56.3412L51.1452 56.668L76.4146 69.54C79.2075 70.9646 85.6359 70.8012 88.4288 69.3767L113.407 56.6526L114.02 56.3412C114.27 56.2135 114.495 56.0808 114.714 55.9276C115.199 55.514 115.444 55.0494 115.444 54.5898Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M115.445 54.59C115.445 55.0495 115.199 55.5142 114.714 55.9277C114.495 56.0809 114.27 56.2137 114.02 56.3413L113.407 56.6528L88.429 69.3768C85.636 70.8014 79.2076 70.9647 76.4147 69.5402L51.1453 56.6681L50.502 56.3413C50.2416 56.2086 50.0016 56.0656 49.7718 55.9073C49.3072 55.4988 49.0723 55.0444 49.0723 54.59C49.0723 53.9313 49.5625 53.2778 50.5428 52.7774C52.3861 51.8379 55.3016 51.7766 57.2878 52.6038C57.2929 52.6038 58.0639 52.9969 58.0639 52.9969L77.3286 62.8157C80.0501 64.1994 84.4668 64.1994 87.1933 62.8157L106.453 53.002C106.453 53.002 107.224 52.6038 107.234 52.6038C109.215 51.7766 112.131 51.8379 113.969 52.7774C114.954 53.2778 115.445 53.9313 115.445 54.59Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+      <path
+        d="M134.643 8.83126C134.444 8.72914 134.28 8.44831 134.28 8.20833V6.45189C134.28 6.2068 134.444 6.09447 134.643 6.19659C134.842 6.29871 135.006 6.57954 135.006 6.81952V8.57596C135.006 8.82105 134.842 8.93338 134.643 8.83126Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M137.533 10.3071C137.334 10.205 137.17 9.92414 137.17 9.68416V7.92772C137.17 7.68263 137.334 7.5703 137.533 7.67242C137.732 7.77454 137.896 8.05537 137.896 8.29535V10.0518C137.896 10.2969 137.732 10.4092 137.533 10.3071Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M138.615 17.8841L133.561 15.3107C132.963 15.0044 132.478 14.167 132.478 13.442V7.2893C132.478 6.56426 132.963 6.21705 133.561 6.52341L138.615 9.09681C139.213 9.40316 139.698 10.2405 139.698 10.9656V17.1182C139.698 17.8433 139.213 18.1905 138.615 17.8841ZM133.561 7.40163C133.361 7.29951 133.198 7.41695 133.198 7.65693V13.8096C133.198 14.0496 133.361 14.3304 133.561 14.4325L138.615 17.0059C138.815 17.108 138.978 16.9906 138.978 16.7506V10.598C138.978 10.358 138.815 10.0771 138.615 9.97503L133.561 7.40163Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M139.335 12.9826L132.835 9.66883C132.636 9.56671 132.473 9.28589 132.473 9.04591C132.473 8.80593 132.636 8.68849 132.835 8.79061L139.335 12.1044C139.534 12.2065 139.698 12.4873 139.698 12.7273C139.698 12.9673 139.534 13.0847 139.335 12.9826Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M52.9734 2.51989C51.7735 1.90718 50.2213 1.95824 48.5313 2.82114L10.1958 22.3565C6.37655 24.3019 3.27725 29.6478 3.27725 34.2993C3.27725 36.8931 4.24228 38.721 5.75364 39.492L3.47637 38.333C1.95991 37.562 1 35.7341 1 33.1402C1 28.4938 4.0993 23.1428 7.91855 21.1974L46.2591 1.6621C47.9492 0.79919 49.4963 0.748131 50.7013 1.36084L52.9786 2.51989H52.9734Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M52.9734 2.52027C54.4898 3.29127 55.4498 5.11919 55.4498 7.71301C55.4498 12.3594 52.3504 17.7105 48.5312 19.6558L10.1957 39.1912C8.50565 40.0541 6.95855 40.1051 5.75355 39.4924C4.23708 38.7214 3.27716 36.8935 3.27716 34.2997C3.27716 29.6533 6.37647 24.3022 10.1957 22.3569L48.5312 2.82152C50.2212 1.95861 51.7684 1.90755 52.9734 2.52027Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M27.8317 25.3737C27.5764 25.5013 27.3671 25.3584 27.3671 25.0469V18.8585C27.3671 18.547 27.5764 18.1896 27.8317 18.062C28.087 17.9343 28.2964 18.0773 28.2964 18.3888V24.5772C28.2964 24.8886 28.087 25.246 27.8317 25.3737Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M30.6094 21.1463C30.3541 21.2739 30.1447 21.1309 30.1447 20.8195V17.4444C30.1447 17.133 30.3541 16.7756 30.6094 16.6479C30.8647 16.5203 31.074 16.6632 31.074 16.9747V20.3497C31.074 20.6612 30.8647 21.0186 30.6094 21.1463Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M33.3819 24.2305C33.1266 24.3582 32.9173 24.2152 32.9173 23.9037V16.0253C32.9173 15.7138 33.1266 15.3564 33.3819 15.2287C33.6372 15.1011 33.8466 15.244 33.8466 15.5555V23.434C33.8466 23.7454 33.6372 24.1029 33.3819 24.2305Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M13.4382 29.9341C13.1829 30.0618 12.9787 29.9188 12.9787 29.6125C12.9787 29.3061 13.1829 28.9487 13.4331 28.821C13.6884 28.6883 13.8927 28.8364 13.8927 29.1427C13.8927 29.4491 13.6884 29.8065 13.4331 29.9341H13.4382Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M13.4382 33.2835C13.1829 33.4112 12.9787 33.2682 12.9787 32.9618C12.9787 32.6555 13.1829 32.2981 13.4331 32.1704C13.6884 32.0377 13.8927 32.1857 13.8927 32.4921C13.8927 32.7984 13.6884 33.1559 13.4331 33.2835H13.4382Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M13.4382 26.5845C13.1829 26.7122 12.9787 26.5692 12.9787 26.2629C12.9787 25.9565 13.1829 25.5991 13.4331 25.4714C13.6884 25.3387 13.8927 25.4868 13.8927 25.7931C13.8927 26.0995 13.6884 26.4569 13.4331 26.5845H13.4382Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M21.6946 25.7266L15.7308 28.7646C15.4755 28.8923 15.2713 28.7493 15.2713 28.4378C15.2713 28.1264 15.4755 27.774 15.7308 27.6464L21.6946 24.6084C21.9499 24.4807 22.1541 24.6237 22.1541 24.9351C22.1541 25.2466 21.9499 25.5989 21.6946 25.7266Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M21.6946 29.0762L15.7308 32.1142C15.4755 32.2419 15.2713 32.0989 15.2713 31.7874C15.2713 31.476 15.4755 31.1237 15.7308 30.996L21.6946 27.958C21.9499 27.8303 22.1541 27.9733 22.1541 28.2848C22.1541 28.5962 21.9499 28.9485 21.6946 29.0762Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M21.6946 22.3772L15.7308 25.4152C15.4755 25.5429 15.2713 25.3999 15.2713 25.0885C15.2713 24.777 15.4755 24.4247 15.7308 24.297L21.6946 21.259C21.9499 21.1314 22.1541 21.2743 22.1541 21.5858C22.1541 21.8972 21.9499 22.2496 21.6946 22.3772Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M46.4737 17.3022L41.4188 19.8756C40.8214 20.1819 40.3364 19.8347 40.3364 19.1097V12.957C40.3364 12.232 40.8214 11.3895 41.4188 11.0883L46.4737 8.51487C47.0711 8.20851 47.5562 8.55571 47.5562 9.28076V15.4334C47.5562 16.1585 47.0711 17.0009 46.4737 17.3022ZM41.4188 11.9665C41.2197 12.0686 41.0563 12.3494 41.0563 12.5894V18.7421C41.0563 18.9821 41.2197 19.0995 41.4188 18.9974L46.4737 16.424C46.6729 16.3219 46.8362 16.041 46.8362 15.801V9.64839C46.8362 9.40841 46.6729 9.29097 46.4737 9.39309L41.4188 11.9665Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M45.3913 12.1402L42.8639 13.4269C42.6647 13.5291 42.5013 13.4167 42.5013 13.1716C42.5013 12.9266 42.6647 12.6508 42.8639 12.5487L45.3913 11.262C45.5905 11.1599 45.7538 11.2722 45.7538 11.5173C45.7538 11.7624 45.5905 12.0381 45.3913 12.1402Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M44.6662 14.2643L42.5013 15.3672C42.3021 15.4693 42.1388 15.3569 42.1388 15.1119C42.1388 14.8668 42.3021 14.591 42.5013 14.4889L44.6662 13.386C44.8653 13.2839 45.0287 13.3963 45.0287 13.6413C45.0287 13.8864 44.8653 14.1621 44.6662 14.2643Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M45.3913 15.6581L43.5838 16.5771C43.3846 16.6793 43.2213 16.5669 43.2213 16.3218C43.2213 16.0768 43.3846 15.801 43.5838 15.6989L45.3913 14.7798C45.5904 14.6777 45.7538 14.7901 45.7538 15.0351C45.7538 15.2802 45.5904 15.5559 45.3913 15.6581Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M147.806 26.2112C148.955 25.624 150.431 25.675 152.044 26.4971C155.695 28.3557 158.651 33.4667 158.651 37.9089C158.651 40.3853 157.732 42.1315 156.282 42.8719L158.631 41.6771C160.081 40.9418 161 39.1905 161 36.7141C161 32.2719 158.039 27.166 154.393 25.3023C152.779 24.4802 151.299 24.4292 150.155 25.0164L147.806 26.2112Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M147.806 26.2112C146.356 26.9465 145.437 28.6978 145.437 31.1742C145.437 35.6163 148.399 40.7223 152.044 42.586C153.658 43.408 155.138 43.4591 156.282 42.8719C157.732 42.1366 158.651 40.3853 158.651 37.9089C158.651 33.4667 155.69 28.3608 152.044 26.4971C150.431 25.6751 148.95 25.624 147.806 26.2112Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M154.664 40.4408L149.609 37.8674C149.011 37.561 148.526 36.7236 148.526 35.9986V29.8459C148.526 29.1209 149.011 28.7737 149.609 29.0801L154.664 31.6534C155.261 31.9598 155.746 32.7972 155.746 33.5222V39.6749C155.746 40.3999 155.261 40.7471 154.664 40.4408ZM149.609 29.9532C149.41 29.851 149.246 29.9685 149.246 30.2085V36.3611C149.246 36.6011 149.41 36.8819 149.609 36.9841L154.664 39.5575C154.863 39.6596 155.026 39.5421 155.026 39.3022V33.1495C155.026 32.9095 154.863 32.6287 154.664 32.5266L149.609 29.9532Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M155.389 35.5341L148.889 32.2203C148.69 32.1182 148.526 31.8374 148.526 31.5974C148.526 31.3574 148.69 31.24 148.889 31.3421L155.389 34.6559C155.588 34.758 155.751 35.0388 155.751 35.2788C155.751 35.5188 155.588 35.6362 155.389 35.5341Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M155.389 38.1689L148.889 34.8551C148.69 34.753 148.526 34.4722 148.526 34.2322C148.526 33.9922 148.69 33.8748 148.889 33.9769L155.389 37.2906C155.588 37.3928 155.751 37.6736 155.751 37.9136C155.751 38.1536 155.588 38.271 155.389 38.1689Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M151.054 38.5975C150.855 38.4954 150.691 38.2146 150.691 37.9746V32.7002C150.691 32.4551 150.855 32.3428 151.054 32.4449C151.253 32.547 151.416 32.8278 151.416 33.0678V38.3422C151.416 38.5873 151.253 38.6997 151.054 38.5975Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M153.219 39.7057C153.02 39.6036 152.856 39.3228 152.856 39.0828V33.8083C152.856 33.5632 153.02 33.4509 153.219 33.553C153.418 33.6552 153.581 33.936 153.581 34.176V39.4504C153.581 39.6955 153.418 39.8078 153.219 39.7057Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M82.2561 58.3329C80.3158 58.3329 78.4827 57.9448 77.0939 57.2351L51.0332 43.9596C49.5371 43.1988 48.71 42.1419 48.71 40.988V35.882C48.71 34.7332 49.532 33.6814 51.0281 32.9155L77.0888 19.64C78.4776 18.9303 80.3107 18.5422 82.2509 18.5422C84.1912 18.5422 86.0293 18.9303 87.4182 19.64L113.474 32.9155C114.97 33.6763 115.797 34.7332 115.797 35.8871V40.9931C115.797 42.1419 114.975 43.1988 113.474 43.9596L87.4182 57.2351C86.0293 57.9448 84.1963 58.3329 82.2509 58.3329H82.2561ZM79.5754 44.7613C80.2852 45.1238 81.2349 45.3229 82.2561 45.3229C83.2772 45.3229 84.232 45.1238 84.9418 44.7613L97.3543 38.435L84.9418 32.1138C84.232 31.7513 83.2772 31.5522 82.2561 31.5522C81.2349 31.5522 80.2801 31.7513 79.5754 32.1138L67.1628 38.435L79.5754 44.7613Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M82.256 19.0529C84.0431 19.0529 85.8251 19.4001 87.1884 20.0945L113.244 33.37C114.607 34.0644 115.286 34.9784 115.286 35.8872V40.9932C115.286 41.902 114.607 42.8109 113.244 43.5053L87.1884 56.7808C85.8251 57.4752 84.038 57.8224 82.256 57.8224C80.4741 57.8224 78.687 57.4752 77.3237 56.7808L51.2629 43.5053C49.8996 42.8109 49.2205 41.8969 49.2205 40.9881V35.8821C49.2205 34.9733 49.9047 34.0644 51.2629 33.37L77.3237 20.0945C78.687 19.4001 80.4689 19.0529 82.256 19.0529ZM82.256 45.8336C83.313 45.8336 84.3648 45.6294 85.1715 45.2158L98.4776 38.4351L85.1715 31.6595C84.3648 31.251 83.3079 31.0417 82.256 31.0417C81.2042 31.0417 80.1473 31.2459 79.3405 31.6595L66.0344 38.4351L79.3405 45.2158C80.1473 45.6243 81.1991 45.8336 82.256 45.8336ZM82.256 18.0317C80.2341 18.0317 78.3193 18.4402 76.859 19.1857L50.7983 32.4611C49.1235 33.3189 48.1993 34.5342 48.1993 35.8821V40.9881C48.1993 41.7744 48.5363 43.2653 50.7983 44.4142L76.859 57.6896C78.3142 58.4351 80.229 58.8435 82.2509 58.8435C84.2729 58.8435 86.1876 58.4351 87.6479 57.6896L113.704 44.4142C115.965 43.2602 116.302 41.7744 116.302 40.9932V35.8872C116.302 35.1009 115.965 33.61 113.704 32.4611L87.6479 19.1857C86.1876 18.4402 84.2729 18.0317 82.2509 18.0317H82.256ZM68.2912 38.4351L79.8103 32.5684C80.4383 32.2467 81.3318 32.0629 82.2611 32.0629C83.1904 32.0629 84.0839 32.2467 84.7171 32.5684L96.2361 38.4351L84.7171 44.3069C84.089 44.6286 83.1904 44.8124 82.2611 44.8124C81.3318 44.8124 80.4383 44.6286 79.8103 44.3069L68.2912 38.4351Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M82.0263 93.9614C79.6163 93.9614 77.4871 93.5785 76.1851 92.9147L50.2724 79.7158C49.9915 79.5728 49.7362 79.4197 49.486 79.2461C49.4707 79.2359 49.4554 79.2205 49.4401 79.2103C48.8682 78.7099 48.567 78.1228 48.567 77.51V72.4041C48.567 71.5157 49.1899 70.714 50.3183 70.1371C51.3395 69.6163 52.6874 69.3303 54.112 69.3303C55.3374 69.3303 56.5374 69.5499 57.4922 69.9481C57.6147 70.0043 57.8343 70.1166 58.304 70.3566L77.5687 80.1754C78.8146 80.8085 80.4842 81.1557 82.2662 81.1557C84.0482 81.1557 85.723 80.8085 86.9688 80.1754L106.228 70.3617C106.708 70.1166 106.923 69.9992 107.045 69.9532C108 69.5499 109.2 69.3303 110.42 69.3303C111.845 69.3303 113.188 69.6163 114.209 70.1371C115.337 70.7089 115.96 71.5157 115.96 72.4041V77.51C115.96 78.133 115.644 78.7304 115.052 79.2359C114.781 79.4299 114.536 79.5728 114.26 79.7158L88.6691 92.7513C87.1833 93.507 84.7069 93.9614 82.0364 93.9614H82.0263Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M110.415 69.8412C111.702 69.8412 112.989 70.0914 113.969 70.5918C114.955 71.0922 115.445 71.7457 115.445 72.4044V77.5103C115.445 77.9699 115.2 78.4345 114.715 78.8481C114.495 79.0013 114.27 79.134 114.02 79.2617L113.407 79.5731L88.4291 92.2972C86.9535 93.0477 84.4618 93.4511 82.0263 93.4511C79.8563 93.4511 77.7322 93.1345 76.4149 92.4606L51.1455 79.5885L50.5022 79.2617C50.2418 79.1289 50.0018 78.986 49.772 78.8277C49.3073 78.4192 49.0725 77.9648 49.0725 77.5103V72.4044C49.0725 71.7457 49.5626 71.0922 50.543 70.5918C51.5284 70.0914 52.8152 69.8412 54.1019 69.8412C55.2303 69.8412 56.3587 70.0352 57.288 70.4182C57.2931 70.4182 58.0641 70.8114 58.0641 70.8114L77.3288 80.6301C78.6921 81.3245 80.4741 81.6666 82.2611 81.6666C84.0482 81.6666 85.8302 81.3194 87.1935 80.6301L106.453 70.8165C106.453 70.8165 107.224 70.4182 107.234 70.4182C108.159 70.0301 109.287 69.8412 110.415 69.8412ZM110.415 68.82C109.108 68.82 107.873 69.0498 106.841 69.4787C106.683 69.5502 106.438 69.6778 105.983 69.9127L86.7288 79.7212C85.5698 80.3084 83.941 80.6454 82.2561 80.6454C80.5711 80.6454 78.9474 80.3084 77.7884 79.7161L58.5236 69.8974C58.0743 69.6676 57.8343 69.5451 57.676 69.4736C56.6446 69.0396 55.409 68.8098 54.0967 68.8098C52.5956 68.8098 51.1659 69.1162 50.0733 69.6727C48.3066 70.5714 48.0462 71.7662 48.0462 72.3942V77.5001C48.0462 78.0312 48.23 78.8226 49.0929 79.5834C49.1236 79.6089 49.1542 79.6344 49.1899 79.6599C49.4605 79.8438 49.7363 80.0123 50.0375 80.1603L50.6809 80.4871L75.9502 93.3592C77.8292 94.3191 80.5609 94.4621 82.0263 94.4621C84.7733 94.4621 87.3416 93.9872 88.8938 93.1958L113.872 80.4718L114.485 80.1603C114.781 80.0072 115.046 79.8489 115.302 79.6753C115.327 79.6548 115.353 79.6344 115.378 79.614C116.277 78.8481 116.466 78.0414 116.466 77.5001V72.3942C116.466 71.7611 116.2 70.5714 114.434 69.6727C113.346 69.1162 111.917 68.8098 110.415 68.8098V68.82Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M82.0262 76.1474C79.6162 76.1474 77.487 75.7645 76.1799 75.1007L50.2672 61.9018C49.9864 61.7589 49.7311 61.6057 49.4809 61.4321C49.4656 61.4219 49.4502 61.4066 49.4349 61.3964C48.8631 60.896 48.5618 60.3088 48.5618 59.6961V54.5901C48.5618 53.7017 49.1847 52.9001 50.3131 52.3231C51.3343 51.8023 52.6823 51.5164 54.1069 51.5164C55.3323 51.5164 56.5322 51.7359 57.487 52.1342C57.6096 52.1903 57.8291 52.3027 58.2988 52.5427L77.5636 62.3614C78.8095 62.9945 80.4791 63.3417 82.2611 63.3417C84.043 63.3417 85.7178 62.9945 86.9637 62.3614L106.223 52.5478C106.703 52.3027 106.918 52.1852 107.04 52.1393C107.995 51.7359 109.195 51.5164 110.415 51.5164C111.84 51.5164 113.183 51.8023 114.204 52.3231C115.332 52.895 115.955 53.7017 115.955 54.5901V59.6961C115.955 60.319 115.639 60.9164 115.046 61.4219C114.776 61.6159 114.531 61.7589 114.255 61.9018L88.6639 74.9373C87.1781 75.693 84.7017 76.1474 82.0313 76.1474H82.0262Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M110.415 52.0272C111.702 52.0272 112.989 52.2774 113.969 52.7778C114.955 53.2782 115.445 53.9318 115.445 54.5904V59.6964C115.445 60.1559 115.2 60.6206 114.715 61.0341C114.495 61.1873 114.27 61.3201 114.02 61.4477L113.407 61.7592L88.4291 74.4832C86.9535 75.2338 84.4618 75.6371 82.0263 75.6371C79.8563 75.6371 77.7322 75.3206 76.4149 74.6466L51.1455 61.7745L50.5022 61.4477C50.2418 61.315 50.0018 61.172 49.772 61.0137C49.3073 60.6052 49.0725 60.1508 49.0725 59.6964V54.5904C49.0725 53.9318 49.5626 53.2782 50.543 52.7778C51.5284 52.2774 52.8152 52.0272 54.1019 52.0272C55.2303 52.0272 56.3587 52.2213 57.288 52.6042C57.2931 52.6042 58.0641 52.9974 58.0641 52.9974L77.3288 62.8161C78.6921 63.5054 80.4741 63.8526 82.2611 63.8526C84.0482 63.8526 85.8302 63.5054 87.1935 62.8161L106.453 53.0025C106.453 53.0025 107.224 52.6042 107.234 52.6042C108.159 52.2162 109.287 52.0272 110.415 52.0272ZM110.415 51.0061C109.108 51.0061 107.873 51.2358 106.841 51.6647C106.683 51.7362 106.438 51.8639 105.983 52.0987L86.7288 61.9073C85.5698 62.4944 83.941 62.8314 82.2561 62.8314C80.5711 62.8314 78.9474 62.4944 77.7884 61.9021L58.5236 52.0834C58.0743 51.8536 57.8343 51.7311 57.676 51.6596C56.6446 51.2256 55.409 50.9958 54.0967 50.9958C52.5956 50.9958 51.1659 51.3022 50.0733 51.8588C48.3066 52.7574 48.0462 53.9522 48.0462 54.5802V59.6862C48.0462 60.2172 48.23 61.0086 49.0929 61.7694C49.1236 61.7949 49.1542 61.8205 49.1899 61.8409C49.4605 62.0247 49.7363 62.1932 50.0375 62.3464L50.6809 62.6731L75.9502 75.5452C77.8292 76.5051 80.5609 76.6481 82.0263 76.6481C84.7733 76.6481 87.3416 76.1733 88.8938 75.3818L113.872 62.6578L114.485 62.3464C114.781 62.1932 115.052 62.0349 115.302 61.8613C115.327 61.8409 115.353 61.8204 115.378 61.8C116.277 61.0341 116.466 60.2274 116.466 59.6862V54.5802C116.466 53.9471 116.2 52.7574 114.434 51.8588C113.346 51.3022 111.917 50.9958 110.415 50.9958V51.0061Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M101.786 35.8865C101.786 35.3453 101.383 34.8091 100.576 34.3956L85.1765 26.5528C83.563 25.7308 80.9539 25.7308 79.3455 26.5528L63.946 34.3956C63.1392 34.8091 62.7359 35.3453 62.7359 35.8814V40.9873C62.7359 40.4512 63.1392 39.9151 63.946 39.5015L79.3455 31.6588C80.9539 30.8367 83.563 30.8367 85.1765 31.6588L100.576 39.5015C101.383 39.9151 101.786 40.4512 101.786 40.9924V35.8865Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M49.2255 35.8818C49.2255 36.7907 49.9046 37.7047 51.2679 38.3991L77.3286 51.6745C80.0501 53.0633 84.4668 53.0633 87.1933 51.6745L113.249 38.3991C114.612 37.7047 115.291 36.7958 115.291 35.8869V40.9929C115.291 41.9017 114.612 42.8106 113.249 43.505L87.1933 56.7805C84.4668 58.1693 80.0501 58.1693 77.3286 56.7805L51.2679 43.505C49.9046 42.8106 49.2255 41.8966 49.2255 40.9878V35.8818Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M113.249 33.37L87.1933 20.0946C84.4668 18.7058 80.0501 18.7058 77.3286 20.0946L51.2679 33.37C49.9097 34.0645 49.2255 34.9733 49.2255 35.8822C49.2255 36.791 49.9046 37.705 51.2679 38.3994L77.3286 51.6749C80.0501 53.0637 84.4668 53.0637 87.1933 51.6749L113.249 38.3994C114.612 37.705 115.291 36.7961 115.291 35.8873C115.291 34.9784 114.612 34.0645 113.249 33.37ZM100.576 37.368L85.1765 45.2158C83.563 46.0379 80.9539 46.0379 79.3455 45.2158L63.9459 37.368C63.1392 36.9595 62.7358 36.4234 62.7358 35.8822C62.7358 35.3409 63.1392 34.8099 63.9459 34.3963L79.3455 26.5536C80.9539 25.7316 83.563 25.7316 85.1765 26.5536L100.576 34.3963C101.383 34.8099 101.786 35.346 101.786 35.8873C101.786 36.4285 101.383 36.9595 100.576 37.368Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M115.444 72.4053V77.5112C115.444 77.9708 115.199 78.4354 114.714 78.849C114.495 79.0022 114.27 79.1349 114.02 79.2626L113.407 79.574L88.4287 92.298C85.6358 93.7226 79.2074 93.886 76.4144 92.4614L51.1451 79.5893L50.5017 79.2626C50.2413 79.1298 50.0013 78.9868 49.7716 78.8286C49.3069 78.4201 49.0721 77.9656 49.0721 77.5112V72.4053C49.0721 72.8597 49.3069 73.3141 49.7716 73.7226C50.0013 73.8809 50.2413 74.0239 50.5017 74.1566L51.1451 74.4834L76.4144 87.3555C79.2074 88.78 85.6358 88.6166 88.4287 87.1921L113.407 74.4681L114.02 74.1566C114.27 74.029 114.495 73.8962 114.714 73.743C115.199 73.3294 115.444 72.8648 115.444 72.4053Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M115.445 72.4047C115.445 72.8642 115.199 73.3289 114.714 73.7424C114.495 73.8956 114.27 74.0284 114.02 74.156L113.407 74.4675L88.429 87.1915C85.636 88.616 79.2076 88.7794 76.4147 87.3549L51.1453 74.4828L50.502 74.156C50.2416 74.0233 50.0016 73.8803 49.7718 73.722C49.3072 73.3135 49.0723 72.8591 49.0723 72.4047C49.0723 71.746 49.5625 71.0924 50.5428 70.5921C52.3861 69.6526 55.3016 69.5913 57.2878 70.4185C57.2929 70.4185 58.0639 70.8116 58.0639 70.8116L77.3286 80.6304C80.0501 82.0141 84.4668 82.0141 87.1933 80.6304L106.453 70.8167C106.453 70.8167 107.224 70.4185 107.234 70.4185C109.215 69.5913 112.131 69.6526 113.969 70.5921C114.954 71.0924 115.445 71.746 115.445 72.4047Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M115.444 54.5898V59.6958C115.444 60.1553 115.199 60.62 114.714 61.0335C114.495 61.1867 114.27 61.3195 114.02 61.4471L113.407 61.7586L88.4288 74.4826C85.6359 75.9072 79.2075 76.0706 76.4146 74.646L51.1452 61.7739L50.5019 61.4471C50.2415 61.3144 50.0015 61.1714 49.7717 61.0131C49.307 60.6046 49.0722 60.1502 49.0722 59.6958V54.5898C49.0722 55.0443 49.307 55.4987 49.7717 55.9072C50.0015 56.0655 50.2415 56.2084 50.5019 56.3412L51.1452 56.668L76.4146 69.54C79.2075 70.9646 85.6359 70.8012 88.4288 69.3767L113.407 56.6526L114.02 56.3412C114.27 56.2135 114.495 56.0808 114.714 55.9276C115.199 55.514 115.444 55.0494 115.444 54.5898Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M115.445 54.59C115.445 55.0495 115.199 55.5142 114.714 55.9277C114.495 56.0809 114.27 56.2137 114.02 56.3413L113.407 56.6528L88.429 69.3768C85.636 70.8014 79.2076 70.9647 76.4147 69.5402L51.1453 56.6681L50.502 56.3413C50.2416 56.2086 50.0016 56.0656 49.7718 55.9073C49.3072 55.4988 49.0723 55.0444 49.0723 54.59C49.0723 53.9313 49.5625 53.2778 50.5428 52.7774C52.3861 51.8379 55.3016 51.7766 57.2878 52.6038C57.2929 52.6038 58.0639 52.9969 58.0639 52.9969L77.3286 62.8157C80.0501 64.1994 84.4668 64.1994 87.1933 62.8157L106.453 53.002C106.453 53.002 107.224 52.6038 107.234 52.6038C109.215 51.7766 112.131 51.8379 113.969 52.7774C114.954 53.2778 115.445 53.9313 115.445 54.59Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx b/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx
index 0d0814401..3ddd2e16a 100644
--- a/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx
+++ b/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx
@@ -1,18 +1,54 @@
 import { ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper";
 import type { TIllustrationAssetProps } from "../helper";
 
-export const WorkItemVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => (
-  <svg
-    width="162"
-    height="180"
-    viewBox="0 0 162 180"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g opacity="0.2">
+export function WorkItemVerticalStackIllustration({ className }: TIllustrationAssetProps) {
+  return (
+    <svg
+      width="162"
+      height="180"
+      viewBox="0 0 162 180"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g opacity="0.2">
+        <path
+          d="M1 143.605C1 145.738 2.597 147.865 5.78537 149.496L46.8392 170.415C53.2216 173.666 63.5655 173.666 69.9479 170.415L156.215 126.461C159.403 124.835 161 122.708 161 120.575V127.386C161 129.519 159.403 131.647 156.215 133.272L69.9479 177.226C63.5655 180.477 53.2216 180.477 46.8392 177.226L5.78537 156.307C2.59135 154.682 1 152.549 1 150.416V143.605Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 143.605C1 141.471 2.597 139.344 5.78537 137.719L92.052 93.7643C98.4344 90.5139 108.778 90.5139 115.161 93.7643L156.215 114.683C159.409 116.309 161 118.442 161 120.575C161 122.708 159.403 124.835 156.215 126.461L69.9479 170.415C63.5655 173.666 53.2216 173.666 46.8392 170.415L5.78537 149.496C2.59135 147.871 1 145.738 1 143.605Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <g opacity="0.6">
+        <path
+          d="M1 122.087C1 124.22 2.597 126.348 5.78537 127.979L46.8392 148.898C53.2216 152.148 63.5655 152.148 69.9479 148.898L156.215 104.943C159.403 103.318 161 101.191 161 99.0576V105.869C161 108.002 159.403 110.129 156.215 111.755L69.9479 155.709C63.5655 158.96 53.2216 158.96 46.8392 155.709L5.78537 134.79C2.59135 133.165 1 131.032 1 128.898V122.087Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M1 122.087C1 119.954 2.597 117.827 5.78537 116.201L92.052 72.247C98.4344 68.9966 108.778 68.9966 115.161 72.247L156.215 93.1661C159.409 94.7914 161 96.9245 161 99.0576C161 101.191 159.403 103.318 156.215 104.943L69.9479 148.898C63.5655 152.148 53.2216 152.148 46.8392 148.898L5.78537 127.979C2.59135 126.353 1 124.22 1 122.087Z"
+          fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+          stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+          strokeWidth="0.4"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
       <path
-        d="M1 143.605C1 145.738 2.597 147.865 5.78537 149.496L46.8392 170.415C53.2216 173.666 63.5655 173.666 69.9479 170.415L156.215 126.461C159.403 124.835 161 122.708 161 120.575V127.386C161 129.519 159.403 131.647 156.215 133.272L69.9479 177.226C63.5655 180.477 53.2216 180.477 46.8392 177.226L5.78537 156.307C2.59135 154.682 1 152.549 1 150.416V143.605Z"
+        d="M1 100.564C1 102.697 2.597 104.825 5.78537 106.456L46.8392 127.375C53.2216 130.625 63.5655 130.625 69.9479 127.375L156.215 83.4204C159.403 81.7952 161 79.6677 161 77.5346V84.3459C161 86.479 159.403 88.6065 156.215 90.2317L69.9479 134.186C63.5655 137.437 53.2216 137.437 46.8392 134.186L5.78537 113.267C2.59135 111.642 1 109.509 1 107.376V100.564Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -20,17 +56,17 @@ export const WorkItemVerticalStackIllustration = ({ className }: TIllustrationAs
         strokeLinejoin="round"
       />
       <path
-        d="M1 143.605C1 141.471 2.597 139.344 5.78537 137.719L92.052 93.7643C98.4344 90.5139 108.778 90.5139 115.161 93.7643L156.215 114.683C159.409 116.309 161 118.442 161 120.575C161 122.708 159.403 124.835 156.215 126.461L69.9479 170.415C63.5655 173.666 53.2216 173.666 46.8392 170.415L5.78537 149.496C2.59135 147.871 1 145.738 1 143.605Z"
+        d="M1 100.564C1 98.4312 2.597 96.3037 5.78537 94.6785L92.052 50.7241C98.4344 47.4736 108.778 47.4736 115.161 50.7241L156.215 71.6432C159.409 73.2684 161 75.4015 161 77.5346C161 79.6677 159.403 81.7952 156.215 83.4204L69.9479 127.375C63.5655 130.625 53.2216 130.625 46.8392 127.375L5.78537 106.456C2.59135 104.831 1 102.697 1 100.564Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <g opacity="0.6">
       <path
-        d="M1 122.087C1 124.22 2.597 126.348 5.78537 127.979L46.8392 148.898C53.2216 152.148 63.5655 152.148 69.9479 148.898L156.215 104.943C159.403 103.318 161 101.191 161 99.0576V105.869C161 108.002 159.403 110.129 156.215 111.755L69.9479 155.709C63.5655 158.96 53.2216 158.96 46.8392 155.709L5.78537 134.79C2.59135 133.165 1 131.032 1 128.898V122.087Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M17.8899 23.8006C16.6597 23.1743 15.0796 23.225 13.3471 24.111C9.43643 26.103 6.27074 31.5769 6.27074 36.3284C6.27074 38.9807 7.25829 40.8542 8.81015 41.6443L6.2932 40.3633C4.74133 39.5732 3.75378 37.6997 3.75378 35.0474C3.75378 30.2903 6.92525 24.8164 10.8303 22.83C12.5571 21.9497 14.1429 21.8933 15.3731 22.5197L17.8899 23.8006Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
@@ -38,209 +74,175 @@ export const WorkItemVerticalStackIllustration = ({ className }: TIllustrationAs
         strokeLinejoin="round"
       />
       <path
-        d="M1 122.087C1 119.954 2.597 117.827 5.78537 116.201L92.052 72.247C98.4344 68.9966 108.778 68.9966 115.161 72.247L156.215 93.1661C159.409 94.7914 161 96.9245 161 99.0576C161 101.191 159.403 103.318 156.215 104.943L69.9479 148.898C63.5655 152.148 53.2216 152.148 46.8392 148.898L5.78537 127.979C2.59135 126.353 1 124.22 1 122.087Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M17.8899 23.8007C19.4418 24.5907 20.4293 26.4642 20.4293 29.1165C20.4293 33.8737 17.2578 39.3475 13.3528 41.3339C11.626 42.2142 10.0404 42.2707 8.81017 41.6443C7.2583 40.8542 6.27075 38.9807 6.27075 36.3284C6.27075 31.5713 9.44208 26.0974 13.3471 24.111C15.0739 23.2307 16.6597 23.1743 17.8899 23.8007Z"
         fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
         stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
         strokeWidth="0.4"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
-    </g>
-    <path
-      d="M1 100.564C1 102.697 2.597 104.825 5.78537 106.456L46.8392 127.375C53.2216 130.625 63.5655 130.625 69.9479 127.375L156.215 83.4204C159.403 81.7952 161 79.6677 161 77.5346V84.3459C161 86.479 159.403 88.6065 156.215 90.2317L69.9479 134.186C63.5655 137.437 53.2216 137.437 46.8392 134.186L5.78537 113.267C2.59135 111.642 1 109.509 1 107.376V100.564Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M1 100.564C1 98.4312 2.597 96.3037 5.78537 94.6785L92.052 50.7241C98.4344 47.4736 108.778 47.4736 115.161 50.7241L156.215 71.6432C159.409 73.2684 161 75.4015 161 77.5346C161 79.6677 159.403 81.7952 156.215 83.4204L69.9479 127.375C63.5655 130.625 53.2216 130.625 46.8392 127.375L5.78537 106.456C2.59135 104.831 1 102.697 1 100.564Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M17.8899 23.8006C16.6597 23.1743 15.0796 23.225 13.3471 24.111C9.43643 26.103 6.27074 31.5769 6.27074 36.3284C6.27074 38.9807 7.25829 40.8542 8.81015 41.6443L6.2932 40.3633C4.74133 39.5732 3.75378 37.6997 3.75378 35.0474C3.75378 30.2903 6.92525 24.8164 10.8303 22.83C12.5571 21.9497 14.1429 21.8933 15.3731 22.5197L17.8899 23.8006Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M17.8899 23.8007C19.4418 24.5907 20.4293 26.4642 20.4293 29.1165C20.4293 33.8737 17.2578 39.3475 13.3528 41.3339C11.626 42.2142 10.0404 42.2707 8.81017 41.6443C7.2583 40.8542 6.27075 38.9807 6.27075 36.3284C6.27075 31.5713 9.44208 26.0974 13.3471 24.111C15.0739 23.2307 16.6597 23.1743 17.8899 23.8007Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M13.7704 29.1842C11.9081 30.1323 10.4014 32.7394 10.4014 35.0023C10.4014 37.2652 11.9081 38.3374 13.7704 37.3837C15.6326 36.43 17.1393 33.8285 17.1393 31.5656C17.1393 29.3027 15.6326 28.2305 13.7704 29.1842ZM9.651 35.386C9.651 32.6152 11.4962 29.4325 13.7704 28.2757C16.0446 27.1188 17.8899 28.4224 17.8899 31.1875C17.8899 33.9527 16.0446 37.141 13.7704 38.2979C11.4962 39.4547 9.651 38.1512 9.651 35.386Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M13.7704 31.0069C12.7377 31.5318 11.8969 32.982 11.8969 34.2405C11.8969 35.4989 12.7377 36.0914 13.7704 35.5666C14.8031 35.0418 15.6439 33.5915 15.6439 32.3331C15.6439 31.0747 14.8031 30.4821 13.7704 31.0069ZM11.1464 34.6242C11.1464 32.8635 12.3201 30.8376 13.7704 30.0984C15.2207 29.3591 16.3945 30.1887 16.3945 31.955C16.3945 33.7213 15.2207 35.7415 13.7704 36.4808C12.3201 37.22 11.1464 36.3905 11.1464 34.6242Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M147.152 33.219C148.703 32.429 149.691 30.5611 149.691 27.9032C149.691 23.146 146.52 17.6722 142.614 15.6858L116.43 2.34538C114.704 1.46505 113.123 1.40862 111.893 2.03501L114.41 0.754017C115.64 0.127628 117.22 0.184061 118.947 1.06439L145.131 14.4048C149.042 16.3968 152.208 21.8707 152.208 26.6222C152.208 29.2801 151.22 31.148 149.668 31.938L147.152 33.219Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M147.152 33.219C145.921 33.8454 144.341 33.789 142.614 32.9086L116.43 19.5683C112.52 17.5762 109.354 12.1024 109.354 7.35085C109.354 4.69293 110.341 2.82505 111.893 2.03501C113.123 1.40863 114.704 1.46505 116.43 2.34538L142.614 15.6858C146.525 17.6778 149.691 23.1516 149.691 27.9032C149.691 30.5611 148.703 32.429 147.152 33.219Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M121.972 19.1394C121.752 19.0265 121.571 18.7161 121.571 18.4509V17.4803C121.571 16.679 121.035 15.7478 120.375 15.4149L117.982 14.196C117.322 13.8574 116.786 14.2411 116.786 15.0425V16.0131C116.786 16.2839 116.605 16.4081 116.385 16.2952C116.165 16.1824 115.984 15.872 115.984 15.6068V14.6361C115.984 13.2987 116.882 12.6667 117.982 13.2254L120.375 14.4443C121.475 15.003 122.373 16.5492 122.373 17.8866V18.8572C122.373 19.1281 122.192 19.2522 121.972 19.1394Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M121.972 14.2242C121.797 14.1339 121.633 13.9082 121.588 13.6655C121.532 13.3777 121.661 13.1802 121.876 13.2197C122.299 13.2987 122.626 13.0674 122.734 12.6103C122.897 11.9162 122.514 10.923 121.876 10.3981C121.661 10.2232 121.537 9.89026 121.588 9.65889C121.645 9.42752 121.859 9.38238 122.073 9.55732C122.587 9.98055 123.021 10.6013 123.292 11.2954C123.563 11.9895 123.637 12.6836 123.507 13.2423C123.326 14.0041 122.779 14.3878 122.073 14.2524C122.04 14.2468 122.006 14.2355 121.972 14.2186V14.2242Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M124.364 20.3583C124.144 20.2454 123.964 19.9351 123.964 19.6698V18.6992C123.964 18.0333 123.597 17.2658 123.067 16.8313C122.852 16.6564 122.722 16.3234 122.779 16.0921C122.835 15.8607 123.05 15.8156 123.264 15.9905C124.144 16.7185 124.76 17.9938 124.76 19.0999V20.0705C124.76 20.3414 124.579 20.4655 124.359 20.3526L124.364 20.3583Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M119.178 12.8586C118.078 12.2999 117.181 10.7537 117.181 9.41624C117.181 8.07882 118.078 7.44678 119.178 8.00546C120.279 8.56413 121.176 10.1104 121.176 11.4478C121.176 12.7852 120.279 13.4172 119.178 12.8586ZM119.178 8.97608C118.518 8.63749 117.982 9.02122 117.982 9.82255C117.982 10.6239 118.518 11.555 119.178 11.8879C119.839 12.2209 120.375 11.8428 120.375 11.0415C120.375 10.2401 119.839 9.30902 119.178 8.97608Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M136.328 25.1888C136.108 25.076 135.927 24.7656 135.927 24.5004V19.6473C135.927 19.3764 136.108 19.2522 136.328 19.3651C136.548 19.478 136.729 19.7883 136.729 20.0536V24.9067C136.729 25.1775 136.548 25.3017 136.328 25.1888Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M138.721 26.4077C138.501 26.2949 138.32 25.9845 138.32 25.7193V17.9487C138.32 17.6778 138.501 17.5537 138.721 17.6665C138.941 17.7794 139.121 18.0898 139.121 18.355V26.1256C139.121 26.3965 138.941 26.5206 138.721 26.4077Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      d="M133.93 23.9699C133.71 23.857 133.529 23.5467 133.529 23.2814V21.3402C133.529 21.0693 133.71 20.9452 133.93 21.058C134.15 21.1709 134.33 21.4813 134.33 21.7465V23.6877C134.33 23.9586 134.15 24.0828 133.93 23.9699Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M48.2836 89.9382C47.6403 89.9382 47.0364 89.7971 46.4947 89.5206L41.4667 86.9586C39.9092 86.163 39.0118 84.3459 39.0118 81.9645V50.4024C39.0118 46.1926 41.8335 41.3338 45.304 39.5675L71.2455 26.3513C72.1259 25.9055 72.9893 25.6741 73.8132 25.6741C74.4565 25.6741 75.0603 25.8152 75.602 26.0917L80.63 28.6537C82.1875 29.4494 83.0848 31.2665 83.0848 33.6479V65.21C83.0848 69.4141 80.2633 74.2785 76.7928 76.0448L50.8513 89.261C49.9709 89.7125 49.1075 89.9382 48.2836 89.9382Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M73.8132 26.2328C74.3718 26.2328 74.8853 26.3569 75.3424 26.5883L80.3704 29.1503C81.6796 29.8162 82.5148 31.4019 82.5148 33.6422V65.2043C82.5148 69.2279 79.8344 73.8553 76.5275 75.5369L50.5859 88.7532C49.7677 89.1708 48.989 89.3683 48.278 89.3683C47.7193 89.3683 47.2058 89.2441 46.7487 89.0127L41.7206 86.4508C40.4114 85.7849 39.5761 84.1991 39.5761 81.9588V50.3967C39.5761 46.3732 42.2567 41.7458 45.5636 40.0641L71.5051 26.8479C72.3233 26.4303 73.1021 26.2328 73.8132 26.2328ZM73.8132 25.1042C72.899 25.1042 71.9509 25.3525 70.9916 25.8434L45.0501 39.0597C41.3482 40.9445 38.4475 45.9274 38.4475 50.3967V81.9588C38.4475 84.5603 39.4521 86.5636 41.2071 87.4609L46.2351 90.0229C46.8558 90.3389 47.5443 90.5025 48.278 90.5025C49.1921 90.5025 50.1402 90.2542 51.0995 89.7633L77.041 76.547C80.7429 74.6622 83.6435 69.6793 83.6435 65.21V33.6479C83.6435 31.0464 82.6391 29.0431 80.884 28.1515L75.8559 25.5895C75.2352 25.2735 74.5468 25.1098 73.8132 25.1098V25.1042Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M80.3706 29.1504C79.3323 28.6199 77.9893 28.6651 76.5277 29.41L50.5861 42.6262C47.2792 44.3078 44.5988 48.9352 44.5988 52.9588V84.5209C44.5988 86.7668 45.434 88.3469 46.7432 89.0128L41.7151 86.4508C40.4059 85.7849 39.5707 84.1992 39.5707 81.9589V50.3968C39.5707 46.3732 42.2512 41.7459 45.5581 40.0642L71.4996 26.848C72.9612 26.1031 74.2986 26.0579 75.3426 26.5884L80.3706 29.1504Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M80.3706 29.1504C81.6798 29.8163 82.515 31.402 82.515 33.6423V65.2044C82.515 69.228 79.8346 73.8553 76.5278 75.537L50.5861 88.7532C49.1245 89.4981 47.7872 89.5433 46.7432 89.0128C45.434 88.3469 44.5988 86.7612 44.5988 84.5209V52.9588C44.5988 48.9352 47.2792 44.3078 50.5861 42.6262L76.5278 29.41C77.9893 28.6651 79.3266 28.6199 80.3706 29.1504Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M66.4997 99.272C65.8564 99.272 65.2525 99.1309 64.7107 98.8544L59.6827 96.2924C58.1252 95.4967 57.2279 93.6796 57.2279 91.2982V59.7361C57.2279 55.532 60.0496 50.6676 63.5201 48.9013L89.4559 35.6851C90.3363 35.2393 91.1997 35.0079 92.0236 35.0079C92.6669 35.0079 93.2707 35.149 93.8124 35.4255L98.8404 37.9875C100.398 38.7832 101.295 40.6002 101.295 42.9817V74.5437C101.295 78.7535 98.4737 83.6123 95.0032 85.3786L69.0616 98.5948C68.1812 99.0406 67.3179 99.272 66.494 99.272H66.4997Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M92.0293 35.5666C92.5879 35.5666 93.1014 35.6907 93.5585 35.9221L98.5865 38.4841C99.8957 39.15 100.731 40.7357 100.731 42.976V74.5381C100.731 78.5617 98.0504 83.189 94.7435 84.8707L68.802 98.0869C67.9837 98.5045 67.2051 98.702 66.494 98.702C65.9354 98.702 65.4217 98.5779 64.9646 98.3465L59.9367 95.7845C58.6274 95.1186 57.7922 93.5329 57.7922 91.2926V59.7305C57.7922 55.7069 60.4728 51.0796 63.7797 49.3979L89.7155 36.1817C90.5338 35.7641 91.3126 35.5666 92.0236 35.5666M92.0293 34.4379C91.1151 34.4379 90.167 34.6862 89.2077 35.1772L63.2717 48.3934C59.5698 50.2782 56.6693 55.2611 56.6693 59.7305V91.2926C56.6693 93.8941 57.6738 95.8974 59.4288 96.789L64.4568 99.351C65.0776 99.667 65.7661 99.8307 66.4997 99.8307C67.4139 99.8307 68.3619 99.5824 69.3213 99.0914L95.2628 85.8752C98.9647 83.9904 101.865 79.0075 101.865 74.5381V42.976C101.865 40.3745 100.861 38.3712 99.1056 37.4796L94.0777 34.9176C93.4569 34.6016 92.7685 34.4379 92.0349 34.4379H92.0293Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M98.5923 38.4841C97.554 37.9537 96.2109 37.9988 94.7493 38.7437L68.8078 51.96C65.5009 53.6416 62.8205 58.269 62.8205 62.2926V93.8546C62.8205 96.1006 63.6556 97.6807 64.9648 98.3466L59.9368 95.7846C58.6276 95.1187 57.7924 93.533 57.7924 91.2927V59.7306C57.7924 55.707 60.4729 51.0796 63.7798 49.398L89.7213 36.1817C91.1829 35.4368 92.5203 35.3917 93.5643 35.9222L98.5923 38.4841Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M98.5923 38.4841C99.9015 39.15 100.737 40.7358 100.737 42.9761V74.5382C100.737 78.5617 98.0562 83.1891 94.7493 84.8708L68.8078 98.087C67.3462 98.8319 66.0088 98.877 64.9648 98.3466C63.6556 97.6807 62.8205 96.095 62.8205 93.8546V62.2926C62.8205 58.269 65.5009 53.6416 68.8078 51.96L94.7493 38.7437C96.2109 37.9988 97.5483 37.9537 98.5923 38.4841Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M84.6766 108.6C84.0671 108.6 83.4915 108.476 82.9723 108.228C82.9385 108.216 82.9103 108.205 82.8764 108.188L77.8483 105.626C76.2908 104.831 75.3936 103.013 75.3936 100.632V69.0643C75.3936 64.8601 78.2151 59.9958 81.6857 58.2295L107.622 45.0132C108.502 44.5674 109.365 44.336 110.189 44.336C110.832 44.336 111.436 44.4771 111.978 44.7536C111.978 44.7536 117.029 47.3269 117.04 47.3382C118.575 48.1395 119.455 49.951 119.455 52.3154V83.8832C119.455 88.093 116.634 92.9517 113.163 94.718L87.2273 107.934C86.3526 108.38 85.4948 108.606 84.6766 108.606V108.6ZM90.3423 68.2235C89.1459 68.8329 88.1357 70.5879 88.1357 72.0608V93.0589L104.506 84.7184C105.703 84.1089 106.713 82.3539 106.713 80.881V59.8829L90.3423 68.2235Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-    />
-    <path
-      d="M110.189 44.9003C110.748 44.9003 111.261 45.0245 111.718 45.2559L116.746 47.8178C116.746 47.8178 116.735 47.8179 116.73 47.8122C118.05 48.4781 118.891 50.0638 118.891 52.3098V83.8775C118.891 87.8954 116.216 92.5228 112.904 94.2101L86.9677 107.426C86.1551 107.838 85.3763 108.036 84.6709 108.036C84.0614 108.036 83.5028 107.889 83.0175 107.618C83.057 107.641 83.0908 107.669 83.1247 107.686L78.0965 105.124C76.7873 104.458 75.9523 102.872 75.9523 100.632V69.0643C75.9523 65.0464 78.6327 60.4133 81.9396 58.7317L107.875 45.5155C108.694 45.0979 109.472 44.9003 110.184 44.9003M114.822 47.4906C114.924 47.4793 115.031 47.4736 115.127 47.4736C115.025 47.4736 114.924 47.4849 114.822 47.4906ZM115.635 47.4906C115.539 47.4793 115.443 47.4736 115.341 47.468C115.443 47.468 115.539 47.4793 115.635 47.4906ZM114.602 47.5131C114.495 47.5301 114.382 47.5526 114.269 47.5752C114.382 47.5526 114.489 47.5244 114.602 47.5131ZM116.12 47.5865C116.024 47.5639 115.928 47.5357 115.832 47.5188C115.928 47.5357 116.024 47.5583 116.12 47.5865ZM113.677 47.7501C113.801 47.705 113.931 47.6598 114.055 47.626C113.931 47.6598 113.806 47.705 113.677 47.7501ZM111.589 57.6821C111.549 57.6539 111.504 57.6256 111.465 57.6031C111.51 57.6256 111.549 57.6539 111.589 57.6821ZM111.758 57.8288C111.758 57.8288 111.701 57.778 111.673 57.7498C111.701 57.7724 111.73 57.8006 111.758 57.8288ZM111.905 58.0037C111.882 57.9699 111.859 57.9417 111.831 57.9134C111.854 57.9417 111.882 57.9699 111.905 58.0037ZM112.034 58.2069C112.018 58.173 111.995 58.1335 111.972 58.0997C111.995 58.1335 112.012 58.1674 112.034 58.2069ZM112.142 58.4439C112.125 58.3987 112.108 58.3592 112.091 58.3197C112.108 58.3592 112.125 58.4044 112.142 58.4439ZM87.5771 93.9788L104.772 85.2206C106.16 84.5152 107.283 82.5683 107.283 80.881V58.9631L90.0882 67.7212C88.7 68.4266 87.5771 70.3735 87.5771 72.0608V93.9788ZM112.311 59.4597C112.311 59.3468 112.311 59.2396 112.294 59.138C112.305 59.2396 112.311 59.3468 112.311 59.4597ZM89.6706 97.991C89.8061 97.9515 89.9471 97.8951 90.0882 97.8217C89.9471 97.8951 89.8061 97.9459 89.6706 97.991ZM88.7961 98.0418C88.6832 98.0192 88.5759 97.9797 88.4744 97.929C88.5759 97.9797 88.6832 98.0136 88.7961 98.0418ZM89.6199 98.0023C89.4901 98.0362 89.3659 98.0588 89.2418 98.07C89.3659 98.0588 89.4901 98.0418 89.6199 98.0023ZM89.1176 98.0757C89.1176 98.0757 89.1685 98.0757 89.1911 98.0757C89.1685 98.0757 89.1458 98.0757 89.1176 98.0757ZM81.0535 104.204C81.0423 104.125 81.0311 104.046 81.0198 103.961C81.0254 104.046 81.0423 104.119 81.0535 104.204ZM81.189 104.938C81.1664 104.853 81.1439 104.763 81.127 104.673C81.1439 104.763 81.1664 104.847 81.189 104.938ZM81.3357 105.457C81.3526 105.496 81.364 105.542 81.3809 105.581C81.364 105.542 81.3526 105.502 81.3357 105.457C81.3188 105.412 81.3076 105.372 81.2907 105.327C81.3019 105.372 81.3188 105.417 81.3357 105.457ZM81.9396 106.642C81.8944 106.574 81.8493 106.507 81.8041 106.439C81.8493 106.507 81.8944 106.58 81.9396 106.642ZM82.3008 107.065C82.25 107.009 82.1992 106.952 82.1484 106.896C82.1992 106.952 82.25 107.014 82.3008 107.065ZM82.7014 107.415C82.645 107.376 82.5942 107.325 82.5434 107.285C82.5942 107.33 82.645 107.376 82.7014 107.415ZM110.189 43.7717C109.275 43.7717 108.327 44.02 107.368 44.511L81.4317 57.7272C77.7298 59.612 74.8293 64.5949 74.8293 69.0643V100.632C74.8293 103.234 75.8337 105.237 77.5887 106.128L82.6167 108.69C82.6675 108.713 82.7126 108.736 82.7634 108.752C83.3503 109.023 83.9937 109.164 84.6765 109.164C85.5851 109.164 86.5275 108.916 87.4812 108.431L113.417 95.2146C117.119 93.3298 120.019 88.3469 120.019 83.8775V52.3098C120.019 49.7365 119.032 47.7501 117.311 46.8416C117.294 46.8303 117.277 46.819 117.254 46.8134L112.226 44.2514C111.606 43.9354 110.917 43.7717 110.184 43.7717H110.189ZM88.7057 92.1334V72.0608C88.7057 70.8024 89.5917 69.2392 90.6018 68.7257L106.154 60.8027V80.881C106.154 82.1394 105.268 83.7026 104.258 84.2161L88.7057 92.1391V92.1334Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M88.5306 97.9289C88.9707 98.1546 89.5295 98.1377 90.1502 97.8217L109.856 87.7825C111.244 87.0771 112.367 85.1302 112.367 83.4429V59.4596C112.367 58.5172 112.017 57.8513 111.47 57.5748L106.442 55.0128C106.989 55.2949 107.339 55.9552 107.339 56.8976V80.8809C107.339 82.5682 106.216 84.5151 104.828 85.2205L85.1222 95.2597C84.5071 95.5757 83.9427 95.5926 83.5026 95.3669L88.5306 97.9289Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M116.808 47.8178C115.77 47.2873 114.427 47.3325 112.965 48.0774L87.0295 61.2936C83.7283 62.9753 81.0422 67.6083 81.0422 71.6262V103.194C81.0422 105.434 81.8773 107.02 83.1865 107.686L78.1585 105.124C76.8493 104.458 76.0141 102.872 76.0141 100.632V69.0642C76.0141 65.0463 78.6947 60.4133 82.0015 58.7316L107.937 45.5154C109.399 44.7705 110.742 44.7253 111.78 45.2558L116.808 47.8178Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M112.971 48.0774L87.0352 61.2936C83.7339 62.9753 81.0477 67.6083 81.0477 71.6262V103.194C81.0477 107.212 83.7283 109.114 87.0352 107.426L112.971 94.21C116.278 92.5227 118.958 87.8954 118.958 83.8774V52.3097C118.958 48.2918 116.284 46.3901 112.971 48.0774ZM112.373 83.4373C112.373 85.1246 111.25 87.0715 109.862 87.7769L90.1558 97.816C88.7676 98.5214 87.6447 97.7257 87.6447 96.0384V72.0551C87.6447 70.3678 88.7676 68.4209 90.1558 67.7155L109.862 57.6763C111.25 56.9709 112.373 57.7666 112.373 59.4539V83.4373Z"
-      fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
-      stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
-      strokeWidth="0.4"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M13.7704 29.1842C11.9081 30.1323 10.4014 32.7394 10.4014 35.0023C10.4014 37.2652 11.9081 38.3374 13.7704 37.3837C15.6326 36.43 17.1393 33.8285 17.1393 31.5656C17.1393 29.3027 15.6326 28.2305 13.7704 29.1842ZM9.651 35.386C9.651 32.6152 11.4962 29.4325 13.7704 28.2757C16.0446 27.1188 17.8899 28.4224 17.8899 31.1875C17.8899 33.9527 16.0446 37.141 13.7704 38.2979C11.4962 39.4547 9.651 38.1512 9.651 35.386Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M13.7704 31.0069C12.7377 31.5318 11.8969 32.982 11.8969 34.2405C11.8969 35.4989 12.7377 36.0914 13.7704 35.5666C14.8031 35.0418 15.6439 33.5915 15.6439 32.3331C15.6439 31.0747 14.8031 30.4821 13.7704 31.0069ZM11.1464 34.6242C11.1464 32.8635 12.3201 30.8376 13.7704 30.0984C15.2207 29.3591 16.3945 30.1887 16.3945 31.955C16.3945 33.7213 15.2207 35.7415 13.7704 36.4808C12.3201 37.22 11.1464 36.3905 11.1464 34.6242Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M147.152 33.219C148.703 32.429 149.691 30.5611 149.691 27.9032C149.691 23.146 146.52 17.6722 142.614 15.6858L116.43 2.34538C114.704 1.46505 113.123 1.40862 111.893 2.03501L114.41 0.754017C115.64 0.127628 117.22 0.184061 118.947 1.06439L145.131 14.4048C149.042 16.3968 152.208 21.8707 152.208 26.6222C152.208 29.2801 151.22 31.148 149.668 31.938L147.152 33.219Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M147.152 33.219C145.921 33.8454 144.341 33.789 142.614 32.9086L116.43 19.5683C112.52 17.5762 109.354 12.1024 109.354 7.35085C109.354 4.69293 110.341 2.82505 111.893 2.03501C113.123 1.40863 114.704 1.46505 116.43 2.34538L142.614 15.6858C146.525 17.6778 149.691 23.1516 149.691 27.9032C149.691 30.5611 148.703 32.429 147.152 33.219Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M121.972 19.1394C121.752 19.0265 121.571 18.7161 121.571 18.4509V17.4803C121.571 16.679 121.035 15.7478 120.375 15.4149L117.982 14.196C117.322 13.8574 116.786 14.2411 116.786 15.0425V16.0131C116.786 16.2839 116.605 16.4081 116.385 16.2952C116.165 16.1824 115.984 15.872 115.984 15.6068V14.6361C115.984 13.2987 116.882 12.6667 117.982 13.2254L120.375 14.4443C121.475 15.003 122.373 16.5492 122.373 17.8866V18.8572C122.373 19.1281 122.192 19.2522 121.972 19.1394Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M121.972 14.2242C121.797 14.1339 121.633 13.9082 121.588 13.6655C121.532 13.3777 121.661 13.1802 121.876 13.2197C122.299 13.2987 122.626 13.0674 122.734 12.6103C122.897 11.9162 122.514 10.923 121.876 10.3981C121.661 10.2232 121.537 9.89026 121.588 9.65889C121.645 9.42752 121.859 9.38238 122.073 9.55732C122.587 9.98055 123.021 10.6013 123.292 11.2954C123.563 11.9895 123.637 12.6836 123.507 13.2423C123.326 14.0041 122.779 14.3878 122.073 14.2524C122.04 14.2468 122.006 14.2355 121.972 14.2186V14.2242Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M124.364 20.3583C124.144 20.2454 123.964 19.9351 123.964 19.6698V18.6992C123.964 18.0333 123.597 17.2658 123.067 16.8313C122.852 16.6564 122.722 16.3234 122.779 16.0921C122.835 15.8607 123.05 15.8156 123.264 15.9905C124.144 16.7185 124.76 17.9938 124.76 19.0999V20.0705C124.76 20.3414 124.579 20.4655 124.359 20.3526L124.364 20.3583Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M119.178 12.8586C118.078 12.2999 117.181 10.7537 117.181 9.41624C117.181 8.07882 118.078 7.44678 119.178 8.00546C120.279 8.56413 121.176 10.1104 121.176 11.4478C121.176 12.7852 120.279 13.4172 119.178 12.8586ZM119.178 8.97608C118.518 8.63749 117.982 9.02122 117.982 9.82255C117.982 10.6239 118.518 11.555 119.178 11.8879C119.839 12.2209 120.375 11.8428 120.375 11.0415C120.375 10.2401 119.839 9.30902 119.178 8.97608Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M136.328 25.1888C136.108 25.076 135.927 24.7656 135.927 24.5004V19.6473C135.927 19.3764 136.108 19.2522 136.328 19.3651C136.548 19.478 136.729 19.7883 136.729 20.0536V24.9067C136.729 25.1775 136.548 25.3017 136.328 25.1888Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M138.721 26.4077C138.501 26.2949 138.32 25.9845 138.32 25.7193V17.9487C138.32 17.6778 138.501 17.5537 138.721 17.6665C138.941 17.7794 139.121 18.0898 139.121 18.355V26.1256C139.121 26.3965 138.941 26.5206 138.721 26.4077Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        d="M133.93 23.9699C133.71 23.857 133.529 23.5467 133.529 23.2814V21.3402C133.529 21.0693 133.71 20.9452 133.93 21.058C134.15 21.1709 134.33 21.4813 134.33 21.7465V23.6877C134.33 23.9586 134.15 24.0828 133.93 23.9699Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M48.2836 89.9382C47.6403 89.9382 47.0364 89.7971 46.4947 89.5206L41.4667 86.9586C39.9092 86.163 39.0118 84.3459 39.0118 81.9645V50.4024C39.0118 46.1926 41.8335 41.3338 45.304 39.5675L71.2455 26.3513C72.1259 25.9055 72.9893 25.6741 73.8132 25.6741C74.4565 25.6741 75.0603 25.8152 75.602 26.0917L80.63 28.6537C82.1875 29.4494 83.0848 31.2665 83.0848 33.6479V65.21C83.0848 69.4141 80.2633 74.2785 76.7928 76.0448L50.8513 89.261C49.9709 89.7125 49.1075 89.9382 48.2836 89.9382Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M73.8132 26.2328C74.3718 26.2328 74.8853 26.3569 75.3424 26.5883L80.3704 29.1503C81.6796 29.8162 82.5148 31.4019 82.5148 33.6422V65.2043C82.5148 69.2279 79.8344 73.8553 76.5275 75.5369L50.5859 88.7532C49.7677 89.1708 48.989 89.3683 48.278 89.3683C47.7193 89.3683 47.2058 89.2441 46.7487 89.0127L41.7206 86.4508C40.4114 85.7849 39.5761 84.1991 39.5761 81.9588V50.3967C39.5761 46.3732 42.2567 41.7458 45.5636 40.0641L71.5051 26.8479C72.3233 26.4303 73.1021 26.2328 73.8132 26.2328ZM73.8132 25.1042C72.899 25.1042 71.9509 25.3525 70.9916 25.8434L45.0501 39.0597C41.3482 40.9445 38.4475 45.9274 38.4475 50.3967V81.9588C38.4475 84.5603 39.4521 86.5636 41.2071 87.4609L46.2351 90.0229C46.8558 90.3389 47.5443 90.5025 48.278 90.5025C49.1921 90.5025 50.1402 90.2542 51.0995 89.7633L77.041 76.547C80.7429 74.6622 83.6435 69.6793 83.6435 65.21V33.6479C83.6435 31.0464 82.6391 29.0431 80.884 28.1515L75.8559 25.5895C75.2352 25.2735 74.5468 25.1098 73.8132 25.1098V25.1042Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M80.3706 29.1504C79.3323 28.6199 77.9893 28.6651 76.5277 29.41L50.5861 42.6262C47.2792 44.3078 44.5988 48.9352 44.5988 52.9588V84.5209C44.5988 86.7668 45.434 88.3469 46.7432 89.0128L41.7151 86.4508C40.4059 85.7849 39.5707 84.1992 39.5707 81.9589V50.3968C39.5707 46.3732 42.2512 41.7459 45.5581 40.0642L71.4996 26.848C72.9612 26.1031 74.2986 26.0579 75.3426 26.5884L80.3706 29.1504Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M80.3706 29.1504C81.6798 29.8163 82.515 31.402 82.515 33.6423V65.2044C82.515 69.228 79.8346 73.8553 76.5278 75.537L50.5861 88.7532C49.1245 89.4981 47.7872 89.5433 46.7432 89.0128C45.434 88.3469 44.5988 86.7612 44.5988 84.5209V52.9588C44.5988 48.9352 47.2792 44.3078 50.5861 42.6262L76.5278 29.41C77.9893 28.6651 79.3266 28.6199 80.3706 29.1504Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M66.4997 99.272C65.8564 99.272 65.2525 99.1309 64.7107 98.8544L59.6827 96.2924C58.1252 95.4967 57.2279 93.6796 57.2279 91.2982V59.7361C57.2279 55.532 60.0496 50.6676 63.5201 48.9013L89.4559 35.6851C90.3363 35.2393 91.1997 35.0079 92.0236 35.0079C92.6669 35.0079 93.2707 35.149 93.8124 35.4255L98.8404 37.9875C100.398 38.7832 101.295 40.6002 101.295 42.9817V74.5437C101.295 78.7535 98.4737 83.6123 95.0032 85.3786L69.0616 98.5948C68.1812 99.0406 67.3179 99.272 66.494 99.272H66.4997Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M92.0293 35.5666C92.5879 35.5666 93.1014 35.6907 93.5585 35.9221L98.5865 38.4841C99.8957 39.15 100.731 40.7357 100.731 42.976V74.5381C100.731 78.5617 98.0504 83.189 94.7435 84.8707L68.802 98.0869C67.9837 98.5045 67.2051 98.702 66.494 98.702C65.9354 98.702 65.4217 98.5779 64.9646 98.3465L59.9367 95.7845C58.6274 95.1186 57.7922 93.5329 57.7922 91.2926V59.7305C57.7922 55.7069 60.4728 51.0796 63.7797 49.3979L89.7155 36.1817C90.5338 35.7641 91.3126 35.5666 92.0236 35.5666M92.0293 34.4379C91.1151 34.4379 90.167 34.6862 89.2077 35.1772L63.2717 48.3934C59.5698 50.2782 56.6693 55.2611 56.6693 59.7305V91.2926C56.6693 93.8941 57.6738 95.8974 59.4288 96.789L64.4568 99.351C65.0776 99.667 65.7661 99.8307 66.4997 99.8307C67.4139 99.8307 68.3619 99.5824 69.3213 99.0914L95.2628 85.8752C98.9647 83.9904 101.865 79.0075 101.865 74.5381V42.976C101.865 40.3745 100.861 38.3712 99.1056 37.4796L94.0777 34.9176C93.4569 34.6016 92.7685 34.4379 92.0349 34.4379H92.0293Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M98.5923 38.4841C97.554 37.9537 96.2109 37.9988 94.7493 38.7437L68.8078 51.96C65.5009 53.6416 62.8205 58.269 62.8205 62.2926V93.8546C62.8205 96.1006 63.6556 97.6807 64.9648 98.3466L59.9368 95.7846C58.6276 95.1187 57.7924 93.533 57.7924 91.2927V59.7306C57.7924 55.707 60.4729 51.0796 63.7798 49.398L89.7213 36.1817C91.1829 35.4368 92.5203 35.3917 93.5643 35.9222L98.5923 38.4841Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M98.5923 38.4841C99.9015 39.15 100.737 40.7358 100.737 42.9761V74.5382C100.737 78.5617 98.0562 83.1891 94.7493 84.8708L68.8078 98.087C67.3462 98.8319 66.0088 98.877 64.9648 98.3466C63.6556 97.6807 62.8205 96.095 62.8205 93.8546V62.2926C62.8205 58.269 65.5009 53.6416 68.8078 51.96L94.7493 38.7437C96.2109 37.9988 97.5483 37.9537 98.5923 38.4841Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M84.6766 108.6C84.0671 108.6 83.4915 108.476 82.9723 108.228C82.9385 108.216 82.9103 108.205 82.8764 108.188L77.8483 105.626C76.2908 104.831 75.3936 103.013 75.3936 100.632V69.0643C75.3936 64.8601 78.2151 59.9958 81.6857 58.2295L107.622 45.0132C108.502 44.5674 109.365 44.336 110.189 44.336C110.832 44.336 111.436 44.4771 111.978 44.7536C111.978 44.7536 117.029 47.3269 117.04 47.3382C118.575 48.1395 119.455 49.951 119.455 52.3154V83.8832C119.455 88.093 116.634 92.9517 113.163 94.718L87.2273 107.934C86.3526 108.38 85.4948 108.606 84.6766 108.606V108.6ZM90.3423 68.2235C89.1459 68.8329 88.1357 70.5879 88.1357 72.0608V93.0589L104.506 84.7184C105.703 84.1089 106.713 82.3539 106.713 80.881V59.8829L90.3423 68.2235Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+      />
+      <path
+        d="M110.189 44.9003C110.748 44.9003 111.261 45.0245 111.718 45.2559L116.746 47.8178C116.746 47.8178 116.735 47.8179 116.73 47.8122C118.05 48.4781 118.891 50.0638 118.891 52.3098V83.8775C118.891 87.8954 116.216 92.5228 112.904 94.2101L86.9677 107.426C86.1551 107.838 85.3763 108.036 84.6709 108.036C84.0614 108.036 83.5028 107.889 83.0175 107.618C83.057 107.641 83.0908 107.669 83.1247 107.686L78.0965 105.124C76.7873 104.458 75.9523 102.872 75.9523 100.632V69.0643C75.9523 65.0464 78.6327 60.4133 81.9396 58.7317L107.875 45.5155C108.694 45.0979 109.472 44.9003 110.184 44.9003M114.822 47.4906C114.924 47.4793 115.031 47.4736 115.127 47.4736C115.025 47.4736 114.924 47.4849 114.822 47.4906ZM115.635 47.4906C115.539 47.4793 115.443 47.4736 115.341 47.468C115.443 47.468 115.539 47.4793 115.635 47.4906ZM114.602 47.5131C114.495 47.5301 114.382 47.5526 114.269 47.5752C114.382 47.5526 114.489 47.5244 114.602 47.5131ZM116.12 47.5865C116.024 47.5639 115.928 47.5357 115.832 47.5188C115.928 47.5357 116.024 47.5583 116.12 47.5865ZM113.677 47.7501C113.801 47.705 113.931 47.6598 114.055 47.626C113.931 47.6598 113.806 47.705 113.677 47.7501ZM111.589 57.6821C111.549 57.6539 111.504 57.6256 111.465 57.6031C111.51 57.6256 111.549 57.6539 111.589 57.6821ZM111.758 57.8288C111.758 57.8288 111.701 57.778 111.673 57.7498C111.701 57.7724 111.73 57.8006 111.758 57.8288ZM111.905 58.0037C111.882 57.9699 111.859 57.9417 111.831 57.9134C111.854 57.9417 111.882 57.9699 111.905 58.0037ZM112.034 58.2069C112.018 58.173 111.995 58.1335 111.972 58.0997C111.995 58.1335 112.012 58.1674 112.034 58.2069ZM112.142 58.4439C112.125 58.3987 112.108 58.3592 112.091 58.3197C112.108 58.3592 112.125 58.4044 112.142 58.4439ZM87.5771 93.9788L104.772 85.2206C106.16 84.5152 107.283 82.5683 107.283 80.881V58.9631L90.0882 67.7212C88.7 68.4266 87.5771 70.3735 87.5771 72.0608V93.9788ZM112.311 59.4597C112.311 59.3468 112.311 59.2396 112.294 59.138C112.305 59.2396 112.311 59.3468 112.311 59.4597ZM89.6706 97.991C89.8061 97.9515 89.9471 97.8951 90.0882 97.8217C89.9471 97.8951 89.8061 97.9459 89.6706 97.991ZM88.7961 98.0418C88.6832 98.0192 88.5759 97.9797 88.4744 97.929C88.5759 97.9797 88.6832 98.0136 88.7961 98.0418ZM89.6199 98.0023C89.4901 98.0362 89.3659 98.0588 89.2418 98.07C89.3659 98.0588 89.4901 98.0418 89.6199 98.0023ZM89.1176 98.0757C89.1176 98.0757 89.1685 98.0757 89.1911 98.0757C89.1685 98.0757 89.1458 98.0757 89.1176 98.0757ZM81.0535 104.204C81.0423 104.125 81.0311 104.046 81.0198 103.961C81.0254 104.046 81.0423 104.119 81.0535 104.204ZM81.189 104.938C81.1664 104.853 81.1439 104.763 81.127 104.673C81.1439 104.763 81.1664 104.847 81.189 104.938ZM81.3357 105.457C81.3526 105.496 81.364 105.542 81.3809 105.581C81.364 105.542 81.3526 105.502 81.3357 105.457C81.3188 105.412 81.3076 105.372 81.2907 105.327C81.3019 105.372 81.3188 105.417 81.3357 105.457ZM81.9396 106.642C81.8944 106.574 81.8493 106.507 81.8041 106.439C81.8493 106.507 81.8944 106.58 81.9396 106.642ZM82.3008 107.065C82.25 107.009 82.1992 106.952 82.1484 106.896C82.1992 106.952 82.25 107.014 82.3008 107.065ZM82.7014 107.415C82.645 107.376 82.5942 107.325 82.5434 107.285C82.5942 107.33 82.645 107.376 82.7014 107.415ZM110.189 43.7717C109.275 43.7717 108.327 44.02 107.368 44.511L81.4317 57.7272C77.7298 59.612 74.8293 64.5949 74.8293 69.0643V100.632C74.8293 103.234 75.8337 105.237 77.5887 106.128L82.6167 108.69C82.6675 108.713 82.7126 108.736 82.7634 108.752C83.3503 109.023 83.9937 109.164 84.6765 109.164C85.5851 109.164 86.5275 108.916 87.4812 108.431L113.417 95.2146C117.119 93.3298 120.019 88.3469 120.019 83.8775V52.3098C120.019 49.7365 119.032 47.7501 117.311 46.8416C117.294 46.8303 117.277 46.819 117.254 46.8134L112.226 44.2514C111.606 43.9354 110.917 43.7717 110.184 43.7717H110.189ZM88.7057 92.1334V72.0608C88.7057 70.8024 89.5917 69.2392 90.6018 68.7257L106.154 60.8027V80.881C106.154 82.1394 105.268 83.7026 104.258 84.2161L88.7057 92.1391V92.1334Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M88.5306 97.9289C88.9707 98.1546 89.5295 98.1377 90.1502 97.8217L109.856 87.7825C111.244 87.0771 112.367 85.1302 112.367 83.4429V59.4596C112.367 58.5172 112.017 57.8513 111.47 57.5748L106.442 55.0128C106.989 55.2949 107.339 55.9552 107.339 56.8976V80.8809C107.339 82.5682 106.216 84.5151 104.828 85.2205L85.1222 95.2597C84.5071 95.5757 83.9427 95.5926 83.5026 95.3669L88.5306 97.9289Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M116.808 47.8178C115.77 47.2873 114.427 47.3325 112.965 48.0774L87.0295 61.2936C83.7283 62.9753 81.0422 67.6083 81.0422 71.6262V103.194C81.0422 105.434 81.8773 107.02 83.1865 107.686L78.1585 105.124C76.8493 104.458 76.0141 102.872 76.0141 100.632V69.0642C76.0141 65.0463 78.6947 60.4133 82.0015 58.7316L107.937 45.5154C109.399 44.7705 110.742 44.7253 111.78 45.2558L116.808 47.8178Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.tertiary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M112.971 48.0774L87.0352 61.2936C83.7339 62.9753 81.0477 67.6083 81.0477 71.6262V103.194C81.0477 107.212 83.7283 109.114 87.0352 107.426L112.971 94.21C116.278 92.5227 118.958 87.8954 118.958 83.8774V52.3097C118.958 48.2918 116.284 46.3901 112.971 48.0774ZM112.373 83.4373C112.373 85.1246 111.25 87.0715 109.862 87.7769L90.1558 97.816C88.7676 98.5214 87.6447 97.7257 87.6447 96.0384V72.0551C87.6447 70.3678 88.7676 68.4209 90.1558 67.7155L109.862 57.6763C111.25 56.9709 112.373 57.7666 112.373 59.4539V83.4373Z"
+        fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.primary}
+        stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary}
+        strokeWidth="0.4"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/empty-state/compact-empty-state.tsx b/packages/propel/src/empty-state/compact-empty-state.tsx
index 5a4523d1f..4664fa2d8 100644
--- a/packages/propel/src/empty-state/compact-empty-state.tsx
+++ b/packages/propel/src/empty-state/compact-empty-state.tsx
@@ -5,7 +5,7 @@ import { getCompactAsset } from "./assets/asset-registry";
 import type { CompactAssetType } from "./assets/asset-types";
 import type { BaseEmptyStateCommonProps } from "./types";
 
-export const EmptyStateCompact: React.FC<BaseEmptyStateCommonProps> = ({
+export function EmptyStateCompact({
   asset,
   assetKey,
   title,
@@ -16,7 +16,7 @@ export const EmptyStateCompact: React.FC<BaseEmptyStateCommonProps> = ({
   assetClassName,
   align = "center",
   customButton,
-}) => {
+}: BaseEmptyStateCommonProps) {
   // Determine which asset to use: assetKey takes precedence, fallback to custom asset
   const resolvedAsset = assetKey ? getCompactAsset(assetKey as CompactAssetType, assetClassName) : asset;
 
@@ -59,6 +59,6 @@ export const EmptyStateCompact: React.FC<BaseEmptyStateCommonProps> = ({
       </div>
     </div>
   );
-};
+}
 
 EmptyStateCompact.displayName = "EmptyStateCompact";
diff --git a/packages/propel/src/empty-state/detailed-empty-state.tsx b/packages/propel/src/empty-state/detailed-empty-state.tsx
index 9680aea71..c105e0118 100644
--- a/packages/propel/src/empty-state/detailed-empty-state.tsx
+++ b/packages/propel/src/empty-state/detailed-empty-state.tsx
@@ -5,7 +5,7 @@ import { getDetailedAsset } from "./assets/asset-registry";
 import type { DetailedAssetType } from "./assets/asset-types";
 import type { BaseEmptyStateCommonProps } from "./types";
 
-export const EmptyStateDetailed: React.FC<BaseEmptyStateCommonProps> = ({
+export function EmptyStateDetailed({
   asset,
   assetKey,
   title,
@@ -15,7 +15,7 @@ export const EmptyStateDetailed: React.FC<BaseEmptyStateCommonProps> = ({
   rootClassName,
   assetClassName,
   customButton,
-}) => {
+}: BaseEmptyStateCommonProps) {
   // Determine which asset to use: assetKey takes precedence, fallback to custom asset
   const resolvedAsset = assetKey ? getDetailedAsset(assetKey as DetailedAssetType, assetClassName) : asset;
 
@@ -51,6 +51,6 @@ export const EmptyStateDetailed: React.FC<BaseEmptyStateCommonProps> = ({
       </div>
     </div>
   );
-};
+}
 
 EmptyStateDetailed.displayName = "EmptyStateDetailed";
diff --git a/packages/propel/src/empty-state/empty-state.tsx b/packages/propel/src/empty-state/empty-state.tsx
index d94734749..fd2f24467 100644
--- a/packages/propel/src/empty-state/empty-state.tsx
+++ b/packages/propel/src/empty-state/empty-state.tsx
@@ -29,7 +29,7 @@ export interface EmptyStateProps {
   assetKey?: CompactAssetType | DetailedAssetType;
 }
 
-export const EmptyState: React.FC<EmptyStateProps> = ({
+export function EmptyState({
   type = "detailed",
   asset,
   assetKey,
@@ -39,7 +39,7 @@ export const EmptyState: React.FC<EmptyStateProps> = ({
   className,
   rootClassName,
   assetClassName,
-}) => {
+}: EmptyStateProps) {
   if (type === "simple") {
     return (
       <EmptyStateCompact
@@ -66,6 +66,6 @@ export const EmptyState: React.FC<EmptyStateProps> = ({
       assetClassName={assetClassName}
     />
   );
-};
+}
 
 EmptyState.displayName = "EmptyState";
diff --git a/packages/propel/src/icons/actions/add-icon.tsx b/packages/propel/src/icons/actions/add-icon.tsx
index b4571ab41..d6a85e0e7 100644
--- a/packages/propel/src/icons/actions/add-icon.tsx
+++ b/packages/propel/src/icons/actions/add-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const AddIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function AddIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -14,4 +14,4 @@ export const AddIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/actions/add-reaction-icon.tsx b/packages/propel/src/icons/actions/add-reaction-icon.tsx
index 1ce0ce405..b1c3ae3d0 100644
--- a/packages/propel/src/icons/actions/add-reaction-icon.tsx
+++ b/packages/propel/src/icons/actions/add-reaction-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const AddReactionIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function AddReactionIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -18,4 +18,4 @@ export const AddReactionIcon: React.FC<ISvgIcons> = ({ color = "currentColor", .
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/actions/close-icon.tsx b/packages/propel/src/icons/actions/close-icon.tsx
index f8003fdb0..e0fa242b9 100644
--- a/packages/propel/src/icons/actions/close-icon.tsx
+++ b/packages/propel/src/icons/actions/close-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const CloseIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} clipPathId="clip0_2890_23" {...rest}>
-    <path
-      d="M10.8501 4.18306C11.094 3.93925 11.4898 3.93936 11.7338 4.18306C11.9779 4.42714 11.9779 4.82375 11.7338 5.06782L8.84224 7.95845L11.7338 10.8501C11.9779 11.0941 11.9779 11.4898 11.7338 11.7338C11.4898 11.9779 11.0941 11.9779 10.8501 11.7338L7.95845 8.84224L5.06782 11.7338C4.82375 11.9779 4.42714 11.9779 4.18306 11.7338C3.93936 11.4898 3.93925 11.094 4.18306 10.8501L7.07368 7.95845L4.18306 5.06782C3.93898 4.82375 3.93898 4.42714 4.18306 4.18306C4.42714 3.93898 4.82375 3.93898 5.06782 4.18306L7.95845 7.07368L10.8501 4.18306Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function CloseIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} clipPathId="clip0_2890_23" {...rest}>
+      <path
+        d="M10.8501 4.18306C11.094 3.93925 11.4898 3.93936 11.7338 4.18306C11.9779 4.42714 11.9779 4.82375 11.7338 5.06782L8.84224 7.95845L11.7338 10.8501C11.9779 11.0941 11.9779 11.4898 11.7338 11.7338C11.4898 11.9779 11.0941 11.9779 10.8501 11.7338L7.95845 8.84224L5.06782 11.7338C4.82375 11.9779 4.42714 11.9779 4.18306 11.7338C3.93936 11.4898 3.93925 11.094 4.18306 10.8501L7.07368 7.95845L4.18306 5.06782C3.93898 4.82375 3.93898 4.42714 4.18306 4.18306C4.42714 3.93898 4.82375 3.93898 5.06782 4.18306L7.95845 7.07368L10.8501 4.18306Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/activity-icon.tsx b/packages/propel/src/icons/activity-icon.tsx
index 469f4ac21..deb9118b1 100644
--- a/packages/propel/src/icons/activity-icon.tsx
+++ b/packages/propel/src/icons/activity-icon.tsx
@@ -2,29 +2,31 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const ActivityIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    width="16"
-    height="16"
-    viewBox="0 0 16 16"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-    {...rest}
-  >
-    <g clipPath="url(#clip0_15681_9387)">
-      <path
-        d="M14.6666 8.00001H13.0133C12.7219 7.99939 12.4384 8.09421 12.206 8.26999C11.9736 8.44576 11.8053 8.69281 11.7266 8.97334L10.1599 14.5467C10.1498 14.5813 10.1288 14.6117 10.0999 14.6333C10.0711 14.655 10.036 14.6667 9.99992 14.6667C9.96386 14.6667 9.92877 14.655 9.89992 14.6333C9.87107 14.6117 9.85002 14.5813 9.83992 14.5467L6.15992 1.45334C6.14982 1.41872 6.12877 1.38831 6.09992 1.36668C6.07107 1.34504 6.03598 1.33334 5.99992 1.33334C5.96386 1.33334 5.92877 1.34504 5.89992 1.36668C5.87107 1.38831 5.85002 1.41872 5.83992 1.45334L4.27325 7.02668C4.1949 7.30611 4.02751 7.55235 3.79649 7.72802C3.56548 7.90368 3.28347 7.99918 2.99325 8.00001H1.33325"
-        stroke="#8591AD"
-        strokeWidth="2"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_15681_9387">
-        <rect width="16" height="16" fill="white" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function ActivityIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      width="16"
+      height="16"
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      {...rest}
+    >
+      <g clipPath="url(#clip0_15681_9387)">
+        <path
+          d="M14.6666 8.00001H13.0133C12.7219 7.99939 12.4384 8.09421 12.206 8.26999C11.9736 8.44576 11.8053 8.69281 11.7266 8.97334L10.1599 14.5467C10.1498 14.5813 10.1288 14.6117 10.0999 14.6333C10.0711 14.655 10.036 14.6667 9.99992 14.6667C9.96386 14.6667 9.92877 14.655 9.89992 14.6333C9.87107 14.6117 9.85002 14.5813 9.83992 14.5467L6.15992 1.45334C6.14982 1.41872 6.12877 1.38831 6.09992 1.36668C6.07107 1.34504 6.03598 1.33334 5.99992 1.33334C5.96386 1.33334 5.92877 1.34504 5.89992 1.36668C5.87107 1.38831 5.85002 1.41872 5.83992 1.45334L4.27325 7.02668C4.1949 7.30611 4.02751 7.55235 3.79649 7.72802C3.56548 7.90368 3.28347 7.99918 2.99325 8.00001H1.33325"
+          stroke="#8591AD"
+          strokeWidth="2"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_15681_9387">
+          <rect width="16" height="16" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/ai-icon.tsx b/packages/propel/src/icons/ai-icon.tsx
index fce937c02..962e56051 100644
--- a/packages/propel/src/icons/ai-icon.tsx
+++ b/packages/propel/src/icons/ai-icon.tsx
@@ -2,29 +2,31 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const AiIcon: React.FC<ISvgIcons> = ({ width = "16", height = "16", className, color = "currentColor" }) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 16 16"
-    fill={color}
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g clipPath="url(#clip0_888_35571)">
-      <path
-        d="M14.2082 0H1.79185C0.801553 0 0 0.801553 0 1.79185V14.2093C0 15.1984 0.801553 16.0012 1.79185 16.0012H14.2093C15.1984 16.0012 16.0012 15.1996 16.0012 14.2093V1.79185C16.0012 0.802748 15.1996 0 14.2093 0H14.2082ZM13.1032 11.5276C13.1032 12.3984 12.3972 13.1032 11.5276 13.1032H4.47245C3.60161 13.1032 2.89682 12.3972 2.89682 11.5276V4.47245C2.89682 3.60161 3.60281 2.89682 4.47245 2.89682H11.5276C12.3984 2.89682 13.1032 3.60281 13.1032 4.47245V11.5276Z"
-        fill={color}
-      />
-      <path
-        d="M9.61291 4.94336H6.38759C5.58996 4.94336 4.94336 5.58996 4.94336 6.38759V9.61291C4.94336 10.4105 5.58996 11.0571 6.38759 11.0571H9.61291C10.4105 11.0571 11.0571 10.4105 11.0571 9.61291V6.38759C11.0571 5.58996 10.4105 4.94336 9.61291 4.94336Z"
-        fill={color}
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_888_35571">
-        <rect width="16" height="16" fill="white" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function AiIcon({ width = "16", height = "16", className, color = "currentColor" }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 16 16"
+      fill={color}
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g clipPath="url(#clip0_888_35571)">
+        <path
+          d="M14.2082 0H1.79185C0.801553 0 0 0.801553 0 1.79185V14.2093C0 15.1984 0.801553 16.0012 1.79185 16.0012H14.2093C15.1984 16.0012 16.0012 15.1996 16.0012 14.2093V1.79185C16.0012 0.802748 15.1996 0 14.2093 0H14.2082ZM13.1032 11.5276C13.1032 12.3984 12.3972 13.1032 11.5276 13.1032H4.47245C3.60161 13.1032 2.89682 12.3972 2.89682 11.5276V4.47245C2.89682 3.60161 3.60281 2.89682 4.47245 2.89682H11.5276C12.3984 2.89682 13.1032 3.60281 13.1032 4.47245V11.5276Z"
+          fill={color}
+        />
+        <path
+          d="M9.61291 4.94336H6.38759C5.58996 4.94336 4.94336 5.58996 4.94336 6.38759V9.61291C4.94336 10.4105 5.58996 11.0571 6.38759 11.0571H9.61291C10.4105 11.0571 11.0571 10.4105 11.0571 9.61291V6.38759C11.0571 5.58996 10.4105 4.94336 9.61291 4.94336Z"
+          fill={color}
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_888_35571">
+          <rect width="16" height="16" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/arrows/chevron-down.tsx b/packages/propel/src/icons/arrows/chevron-down.tsx
index 41de64cf2..848c3b828 100644
--- a/packages/propel/src/icons/arrows/chevron-down.tsx
+++ b/packages/propel/src/icons/arrows/chevron-down.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ChevronDownIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} clipPathId="clip0_2890_23" {...rest}>
-    <path
-      d="M11.5576 5.55708C11.8016 5.313 12.1983 5.313 12.4423 5.55708C12.6864 5.80116 12.6864 6.19777 12.4423 6.44185L8.44234 10.4418C8.19826 10.6859 7.80165 10.6859 7.55757 10.4418L3.55757 6.44185C3.31349 6.19777 3.31349 5.80116 3.55757 5.55708C3.80165 5.313 4.19826 5.313 4.44234 5.55708L7.99995 9.1147L11.5576 5.55708Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function ChevronDownIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} clipPathId="clip0_2890_23" {...rest}>
+      <path
+        d="M11.5576 5.55708C11.8016 5.313 12.1983 5.313 12.4423 5.55708C12.6864 5.80116 12.6864 6.19777 12.4423 6.44185L8.44234 10.4418C8.19826 10.6859 7.80165 10.6859 7.55757 10.4418L3.55757 6.44185C3.31349 6.19777 3.31349 5.80116 3.55757 5.55708C3.80165 5.313 4.19826 5.313 4.44234 5.55708L7.99995 9.1147L11.5576 5.55708Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/arrows/chevron-left.tsx b/packages/propel/src/icons/arrows/chevron-left.tsx
index e899a4855..4b8001267 100644
--- a/packages/propel/src/icons/arrows/chevron-left.tsx
+++ b/packages/propel/src/icons/arrows/chevron-left.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ChevronLeftIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} clipPathId="clip0_2890_23" {...rest}>
-    <path
-      d="M9.55757 3.55708C9.80165 3.313 10.1983 3.313 10.4423 3.55708C10.6864 3.80116 10.6864 4.19777 10.4423 4.44185L6.88472 7.99946L10.4423 11.5571C10.6864 11.8012 10.6864 12.1978 10.4423 12.4418C10.1983 12.6859 9.80165 12.6859 9.55757 12.4418L5.55757 8.44185C5.31349 8.19777 5.31349 7.80116 5.55757 7.55708L9.55757 3.55708Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function ChevronLeftIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} clipPathId="clip0_2890_23" {...rest}>
+      <path
+        d="M9.55757 3.55708C9.80165 3.313 10.1983 3.313 10.4423 3.55708C10.6864 3.80116 10.6864 4.19777 10.4423 4.44185L6.88472 7.99946L10.4423 11.5571C10.6864 11.8012 10.6864 12.1978 10.4423 12.4418C10.1983 12.6859 9.80165 12.6859 9.55757 12.4418L5.55757 8.44185C5.31349 8.19777 5.31349 7.80116 5.55757 7.55708L9.55757 3.55708Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/arrows/chevron-right.tsx b/packages/propel/src/icons/arrows/chevron-right.tsx
index e7378b5a9..029b62212 100644
--- a/packages/propel/src/icons/arrows/chevron-right.tsx
+++ b/packages/propel/src/icons/arrows/chevron-right.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ChevronRightIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} clipPathId="clip0_2890_23" {...rest}>
-    <path
-      d="M5.55757 3.55708C5.80165 3.313 6.19826 3.313 6.44234 3.55708L10.4423 7.55708C10.6864 7.80116 10.6864 8.19777 10.4423 8.44185L6.44234 12.4418C6.19826 12.6859 5.80165 12.6859 5.55757 12.4418C5.31349 12.1978 5.31349 11.8012 5.55757 11.5571L9.11519 7.99946L5.55757 4.44185C5.31349 4.19777 5.31349 3.80116 5.55757 3.55708Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function ChevronRightIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} clipPathId="clip0_2890_23" {...rest}>
+      <path
+        d="M5.55757 3.55708C5.80165 3.313 6.19826 3.313 6.44234 3.55708L10.4423 7.55708C10.6864 7.80116 10.6864 8.19777 10.4423 8.44185L6.44234 12.4418C6.19826 12.6859 5.80165 12.6859 5.55757 12.4418C5.31349 12.1978 5.31349 11.8012 5.55757 11.5571L9.11519 7.99946L5.55757 4.44185C5.31349 4.19777 5.31349 3.80116 5.55757 3.55708Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/arrows/chevron-up.tsx b/packages/propel/src/icons/arrows/chevron-up.tsx
index 6c01b8968..3d28ac516 100644
--- a/packages/propel/src/icons/arrows/chevron-up.tsx
+++ b/packages/propel/src/icons/arrows/chevron-up.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ChevronUpIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} clipPathId="clip0_2890_23" {...rest}>
-    <path
-      d="M7.6562 5.47785C7.89877 5.3179 8.22886 5.34445 8.44234 5.55793L12.4423 9.55793C12.6864 9.80201 12.6864 10.1986 12.4423 10.4427C12.1983 10.6868 11.8016 10.6868 11.5576 10.4427L7.99995 6.88508L4.44234 10.4427C4.19826 10.6868 3.80165 10.6868 3.55757 10.4427C3.31349 10.1986 3.31349 9.80201 3.55757 9.55793L7.55757 5.55793L7.6562 5.47785Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function ChevronUpIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} clipPathId="clip0_2890_23" {...rest}>
+      <path
+        d="M7.6562 5.47785C7.89877 5.3179 8.22886 5.34445 8.44234 5.55793L12.4423 9.55793C12.6864 9.80201 12.6864 10.1986 12.4423 10.4427C12.1983 10.6868 11.8016 10.6868 11.5576 10.4427L7.99995 6.88508L4.44234 10.4427C4.19826 10.6868 3.80165 10.6868 3.55757 10.4427C3.31349 10.1986 3.31349 9.80201 3.55757 9.55793L7.55757 5.55793L7.6562 5.47785Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/at-risk-icon.tsx b/packages/propel/src/icons/at-risk-icon.tsx
index 39c5b8c6a..994ed711e 100644
--- a/packages/propel/src/icons/at-risk-icon.tsx
+++ b/packages/propel/src/icons/at-risk-icon.tsx
@@ -2,20 +2,22 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const AtRiskIcon: React.FC<ISvgIcons> = ({ width = "16", height = "16" }) => (
-  <svg width={width} height={height} viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g clipPath="url(#clip0_365_7561)">
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M2.03658 7.33335H2.66663C3.03482 7.33335 3.33329 7.63183 3.33329 8.00002C3.33329 8.36821 3.03482 8.66669 2.66663 8.66669H2.03658C2.36821 11.6667 4.91159 14 7.99996 14C11.0883 14 13.6317 11.6667 13.9633 8.66669H13.3333C12.9651 8.66669 12.6666 8.36821 12.6666 8.00002C12.6666 7.63183 12.9651 7.33335 13.3333 7.33335H13.9633C13.6317 4.33339 11.0883 2.00002 7.99996 2.00002C4.91159 2.00002 2.36821 4.33339 2.03658 7.33335ZM0.666626 8.00002C0.666626 3.94993 3.94987 0.666687 7.99996 0.666687C12.05 0.666687 15.3333 3.94993 15.3333 8.00002C15.3333 12.0501 12.05 15.3334 7.99996 15.3334C3.94987 15.3334 0.666626 12.0501 0.666626 8.00002ZM7.99996 4.66669C8.36815 4.66669 8.66663 4.96516 8.66663 5.33335V8.00002C8.66663 8.36821 8.36815 8.66669 7.99996 8.66669C7.63177 8.66669 7.33329 8.36821 7.33329 8.00002V5.33335C7.33329 4.96516 7.63177 4.66669 7.99996 4.66669ZM7.33329 10.6667C7.33329 10.2985 7.63177 10 7.99996 10H8.00663C8.37482 10 8.67329 10.2985 8.67329 10.6667C8.67329 11.0349 8.37482 11.3334 8.00663 11.3334H7.99996C7.63177 11.3334 7.33329 11.0349 7.33329 10.6667Z"
-        fill="#CC7700"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_365_7561">
-        <rect width="16" height="16" fill="white" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function AtRiskIcon({ width = "16", height = "16" }: ISvgIcons) {
+  return (
+    <svg width={width} height={height} viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <g clipPath="url(#clip0_365_7561)">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M2.03658 7.33335H2.66663C3.03482 7.33335 3.33329 7.63183 3.33329 8.00002C3.33329 8.36821 3.03482 8.66669 2.66663 8.66669H2.03658C2.36821 11.6667 4.91159 14 7.99996 14C11.0883 14 13.6317 11.6667 13.9633 8.66669H13.3333C12.9651 8.66669 12.6666 8.36821 12.6666 8.00002C12.6666 7.63183 12.9651 7.33335 13.3333 7.33335H13.9633C13.6317 4.33339 11.0883 2.00002 7.99996 2.00002C4.91159 2.00002 2.36821 4.33339 2.03658 7.33335ZM0.666626 8.00002C0.666626 3.94993 3.94987 0.666687 7.99996 0.666687C12.05 0.666687 15.3333 3.94993 15.3333 8.00002C15.3333 12.0501 12.05 15.3334 7.99996 15.3334C3.94987 15.3334 0.666626 12.0501 0.666626 8.00002ZM7.99996 4.66669C8.36815 4.66669 8.66663 4.96516 8.66663 5.33335V8.00002C8.66663 8.36821 8.36815 8.66669 7.99996 8.66669C7.63177 8.66669 7.33329 8.36821 7.33329 8.00002V5.33335C7.33329 4.96516 7.63177 4.66669 7.99996 4.66669ZM7.33329 10.6667C7.33329 10.2985 7.63177 10 7.99996 10H8.00663C8.37482 10 8.67329 10.2985 8.67329 10.6667C8.67329 11.0349 8.37482 11.3334 8.00663 11.3334H7.99996C7.63177 11.3334 7.33329 11.0349 7.33329 10.6667Z"
+          fill="#CC7700"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_365_7561">
+          <rect width="16" height="16" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/attachments/audio-file-icon.tsx b/packages/propel/src/icons/attachments/audio-file-icon.tsx
index 62b4e6c59..4ede9d537 100644
--- a/packages/propel/src/icons/attachments/audio-file-icon.tsx
+++ b/packages/propel/src/icons/attachments/audio-file-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const AudioFileIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M7.33325 13.9999V1.99992C7.33325 1.63173 7.63173 1.33325 7.99992 1.33325C8.36811 1.33325 8.66659 1.63173 8.66659 1.99992V13.9999C8.66659 14.3681 8.36811 14.6666 7.99992 14.6666C7.63173 14.6666 7.33325 14.3681 7.33325 13.9999ZM4.33325 11.9999V3.99992C4.33325 3.63173 4.63173 3.33325 4.99992 3.33325C5.36811 3.33325 5.66659 3.63173 5.66659 3.99992V11.9999C5.66659 12.3681 5.36811 12.6666 4.99992 12.6666C4.63173 12.6666 4.33325 12.3681 4.33325 11.9999ZM10.3333 11.9999V3.99992C10.3333 3.63173 10.6317 3.33325 10.9999 3.33325C11.3681 3.33325 11.6666 3.63173 11.6666 3.99992V11.9999C11.6666 12.3681 11.3681 12.6666 10.9999 12.6666C10.6317 12.6666 10.3333 12.3681 10.3333 11.9999ZM1.33325 9.33325V6.66659C1.33325 6.2984 1.63173 5.99992 1.99992 5.99992C2.36811 5.99992 2.66659 6.2984 2.66659 6.66659V9.33325C2.66659 9.70144 2.36811 9.99992 1.99992 9.99992C1.63173 9.99992 1.33325 9.70144 1.33325 9.33325ZM13.3333 9.33325V6.66659C13.3333 6.2984 13.6317 5.99992 13.9999 5.99992C14.3681 5.99992 14.6666 6.2984 14.6666 6.66659V9.33325C14.6666 9.70144 14.3681 9.99992 13.9999 9.99992C13.6317 9.99992 13.3333 9.70144 13.3333 9.33325Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function AudioFileIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M7.33325 13.9999V1.99992C7.33325 1.63173 7.63173 1.33325 7.99992 1.33325C8.36811 1.33325 8.66659 1.63173 8.66659 1.99992V13.9999C8.66659 14.3681 8.36811 14.6666 7.99992 14.6666C7.63173 14.6666 7.33325 14.3681 7.33325 13.9999ZM4.33325 11.9999V3.99992C4.33325 3.63173 4.63173 3.33325 4.99992 3.33325C5.36811 3.33325 5.66659 3.63173 5.66659 3.99992V11.9999C5.66659 12.3681 5.36811 12.6666 4.99992 12.6666C4.63173 12.6666 4.33325 12.3681 4.33325 11.9999ZM10.3333 11.9999V3.99992C10.3333 3.63173 10.6317 3.33325 10.9999 3.33325C11.3681 3.33325 11.6666 3.63173 11.6666 3.99992V11.9999C11.6666 12.3681 11.3681 12.6666 10.9999 12.6666C10.6317 12.6666 10.3333 12.3681 10.3333 11.9999ZM1.33325 9.33325V6.66659C1.33325 6.2984 1.63173 5.99992 1.99992 5.99992C2.36811 5.99992 2.66659 6.2984 2.66659 6.66659V9.33325C2.66659 9.70144 2.36811 9.99992 1.99992 9.99992C1.63173 9.99992 1.33325 9.70144 1.33325 9.33325ZM13.3333 9.33325V6.66659C13.3333 6.2984 13.6317 5.99992 13.9999 5.99992C14.3681 5.99992 14.6666 6.2984 14.6666 6.66659V9.33325C14.6666 9.70144 14.3681 9.99992 13.9999 9.99992C13.6317 9.99992 13.3333 9.70144 13.3333 9.33325Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/attachments/code-file-icon.tsx b/packages/propel/src/icons/attachments/code-file-icon.tsx
index 8681328bf..4c8e6ac81 100644
--- a/packages/propel/src/icons/attachments/code-file-icon.tsx
+++ b/packages/propel/src/icons/attachments/code-file-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const CodeFileIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M9.4687 1.39001C9.8056 1.46493 10.0182 1.79918 9.94331 2.1361L7.27632 14.1361C7.20136 14.473 6.86713 14.6856 6.53023 14.6107C6.19351 14.5357 5.98174 14.2014 6.05659 13.8646L8.72261 1.86462C8.79753 1.52772 9.13178 1.31514 9.4687 1.39001ZM4.22456 4.22497C4.46865 3.98105 4.86433 3.98095 5.10835 4.22497C5.35237 4.46899 5.35227 4.86467 5.10835 5.10876L2.21675 8.00036L5.10835 10.892C5.35227 11.1361 5.35237 11.5317 5.10835 11.7758C4.86433 12.0198 4.46865 12.0197 4.22456 11.7758L0.890578 8.44274C0.6465 8.19866 0.6465 7.80205 0.890578 7.55798L4.22456 4.22497ZM10.8906 4.22497C11.1347 3.98089 11.5313 3.98089 11.7753 4.22497L15.1084 7.55798C15.3524 7.80205 15.3524 8.19866 15.1084 8.44274L11.7753 11.7758C11.5313 12.0198 11.1347 12.0198 10.8906 11.7758C10.6468 11.5318 10.6469 11.136 10.8906 10.892L13.7822 8.00036L10.8906 5.10876C10.6469 4.86471 10.6468 4.46895 10.8906 4.22497Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function CodeFileIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M9.4687 1.39001C9.8056 1.46493 10.0182 1.79918 9.94331 2.1361L7.27632 14.1361C7.20136 14.473 6.86713 14.6856 6.53023 14.6107C6.19351 14.5357 5.98174 14.2014 6.05659 13.8646L8.72261 1.86462C8.79753 1.52772 9.13178 1.31514 9.4687 1.39001ZM4.22456 4.22497C4.46865 3.98105 4.86433 3.98095 5.10835 4.22497C5.35237 4.46899 5.35227 4.86467 5.10835 5.10876L2.21675 8.00036L5.10835 10.892C5.35227 11.1361 5.35237 11.5317 5.10835 11.7758C4.86433 12.0198 4.46865 12.0197 4.22456 11.7758L0.890578 8.44274C0.6465 8.19866 0.6465 7.80205 0.890578 7.55798L4.22456 4.22497ZM10.8906 4.22497C11.1347 3.98089 11.5313 3.98089 11.7753 4.22497L15.1084 7.55798C15.3524 7.80205 15.3524 8.19866 15.1084 8.44274L11.7753 11.7758C11.5313 12.0198 11.1347 12.0198 10.8906 11.7758C10.6468 11.5318 10.6469 11.136 10.8906 10.892L13.7822 8.00036L10.8906 5.10876C10.6469 4.86471 10.6468 4.46895 10.8906 4.22497Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/attachments/document-file-icon.tsx b/packages/propel/src/icons/attachments/document-file-icon.tsx
index ec9ae2194..d6602bce8 100644
--- a/packages/propel/src/icons/attachments/document-file-icon.tsx
+++ b/packages/propel/src/icons/attachments/document-file-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const DocumentFileIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M2.04175 11.4666V4.533C2.04175 3.98348 2.04127 3.53353 2.07105 3.16874C2.10144 2.79669 2.1666 2.45803 2.32788 2.1414C2.57955 1.64747 2.98141 1.24561 3.47534 0.99394C3.79198 0.832661 4.13063 0.767502 4.50269 0.737104C4.86747 0.707329 5.31742 0.707807 5.86694 0.707807H8.00757C8.46696 0.707807 8.79907 0.703532 9.11792 0.780072C9.26977 0.816533 9.41679 0.868859 9.55933 0.93144C9.57519 0.93761 9.59002 0.945526 9.60523 0.952924C9.63564 0.966985 9.66715 0.978716 9.69702 0.99394L9.87671 1.09453L10.0798 1.23613C10.278 1.39031 10.4692 1.58448 10.7126 1.82792L12.8376 3.9539C13.1626 4.2788 13.4007 4.51024 13.572 4.78984C13.6272 4.87997 13.6747 4.97428 13.7185 5.07011C13.7232 5.08016 13.728 5.09005 13.7322 5.10038C13.7961 5.24493 13.8485 5.39451 13.8855 5.54863C13.962 5.86738 13.9587 6.19877 13.9587 6.658V11.4666C13.9587 12.0161 13.9592 12.4661 13.9294 12.8309C13.899 13.2029 13.8339 13.5415 13.6726 13.8582C13.4524 14.2904 13.1171 14.6519 12.7058 14.9041L12.5251 15.0047C12.2084 15.166 11.87 15.2311 11.4978 15.2615C11.133 15.2913 10.6832 15.2908 10.1335 15.2908H5.86694C5.31741 15.2908 4.86747 15.2913 4.50269 15.2615C4.13058 15.2311 3.79201 15.166 3.47534 15.0047C2.9815 14.7531 2.57957 14.352 2.32788 13.8582C2.16656 13.5415 2.10146 13.2029 2.07105 12.8309C2.04124 12.4661 2.04175 12.0161 2.04175 11.4666ZM3.29175 11.4666C3.29175 12.0367 3.29246 12.4272 3.31714 12.7293C3.34124 13.0238 3.38456 13.1797 3.44116 13.2908C3.57298 13.5495 3.78405 13.7596 4.04273 13.8914C4.15382 13.948 4.30958 13.9923 4.60425 14.0164C4.90636 14.0411 5.29672 14.0408 5.86694 14.0408H10.1335C10.7039 14.0408 11.0941 14.0411 11.3962 14.0164C11.691 13.9923 11.8466 13.948 11.9578 13.8914C12.2164 13.7597 12.4265 13.5494 12.5584 13.2908C12.615 13.1797 12.6593 13.0238 12.6834 12.7293C12.708 12.4272 12.7087 12.0367 12.7087 11.4666V6.658C12.7087 6.27204 12.7063 6.08602 12.6912 5.95781H10.4001C10.2238 5.95781 10.0534 5.95871 9.91089 5.94706C9.76121 5.93481 9.5877 5.90574 9.41382 5.81718C9.17068 5.69331 8.97316 5.49555 8.84937 5.25273C8.76065 5.07863 8.73172 4.9045 8.71948 4.75468C8.70786 4.61227 8.70874 4.44258 8.70874 4.2664V1.97441C8.58046 1.95924 8.39393 1.95781 8.00757 1.95781H5.86694C5.29669 1.95781 4.90637 1.95853 4.60425 1.9832C4.3097 2.00726 4.15382 2.05069 4.04273 2.10722C3.784 2.23905 3.57299 2.45006 3.44116 2.70878C3.38463 2.81988 3.3412 2.97576 3.31714 3.27031C3.29247 3.57243 3.29175 3.96275 3.29175 4.533V11.4666ZM9.96558 4.65312C9.96701 4.67068 9.96918 4.68335 9.97046 4.69218L9.97339 4.69609C9.98224 4.69738 9.99547 4.6995 10.0134 4.70097C10.0932 4.70746 10.2034 4.70781 10.4001 4.70781H11.824L9.95874 2.8416V4.2664C9.95874 4.46323 9.95906 4.57334 9.96558 4.65312Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function DocumentFileIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M2.04175 11.4666V4.533C2.04175 3.98348 2.04127 3.53353 2.07105 3.16874C2.10144 2.79669 2.1666 2.45803 2.32788 2.1414C2.57955 1.64747 2.98141 1.24561 3.47534 0.99394C3.79198 0.832661 4.13063 0.767502 4.50269 0.737104C4.86747 0.707329 5.31742 0.707807 5.86694 0.707807H8.00757C8.46696 0.707807 8.79907 0.703532 9.11792 0.780072C9.26977 0.816533 9.41679 0.868859 9.55933 0.93144C9.57519 0.93761 9.59002 0.945526 9.60523 0.952924C9.63564 0.966985 9.66715 0.978716 9.69702 0.99394L9.87671 1.09453L10.0798 1.23613C10.278 1.39031 10.4692 1.58448 10.7126 1.82792L12.8376 3.9539C13.1626 4.2788 13.4007 4.51024 13.572 4.78984C13.6272 4.87997 13.6747 4.97428 13.7185 5.07011C13.7232 5.08016 13.728 5.09005 13.7322 5.10038C13.7961 5.24493 13.8485 5.39451 13.8855 5.54863C13.962 5.86738 13.9587 6.19877 13.9587 6.658V11.4666C13.9587 12.0161 13.9592 12.4661 13.9294 12.8309C13.899 13.2029 13.8339 13.5415 13.6726 13.8582C13.4524 14.2904 13.1171 14.6519 12.7058 14.9041L12.5251 15.0047C12.2084 15.166 11.87 15.2311 11.4978 15.2615C11.133 15.2913 10.6832 15.2908 10.1335 15.2908H5.86694C5.31741 15.2908 4.86747 15.2913 4.50269 15.2615C4.13058 15.2311 3.79201 15.166 3.47534 15.0047C2.9815 14.7531 2.57957 14.352 2.32788 13.8582C2.16656 13.5415 2.10146 13.2029 2.07105 12.8309C2.04124 12.4661 2.04175 12.0161 2.04175 11.4666ZM3.29175 11.4666C3.29175 12.0367 3.29246 12.4272 3.31714 12.7293C3.34124 13.0238 3.38456 13.1797 3.44116 13.2908C3.57298 13.5495 3.78405 13.7596 4.04273 13.8914C4.15382 13.948 4.30958 13.9923 4.60425 14.0164C4.90636 14.0411 5.29672 14.0408 5.86694 14.0408H10.1335C10.7039 14.0408 11.0941 14.0411 11.3962 14.0164C11.691 13.9923 11.8466 13.948 11.9578 13.8914C12.2164 13.7597 12.4265 13.5494 12.5584 13.2908C12.615 13.1797 12.6593 13.0238 12.6834 12.7293C12.708 12.4272 12.7087 12.0367 12.7087 11.4666V6.658C12.7087 6.27204 12.7063 6.08602 12.6912 5.95781H10.4001C10.2238 5.95781 10.0534 5.95871 9.91089 5.94706C9.76121 5.93481 9.5877 5.90574 9.41382 5.81718C9.17068 5.69331 8.97316 5.49555 8.84937 5.25273C8.76065 5.07863 8.73172 4.9045 8.71948 4.75468C8.70786 4.61227 8.70874 4.44258 8.70874 4.2664V1.97441C8.58046 1.95924 8.39393 1.95781 8.00757 1.95781H5.86694C5.29669 1.95781 4.90637 1.95853 4.60425 1.9832C4.3097 2.00726 4.15382 2.05069 4.04273 2.10722C3.784 2.23905 3.57299 2.45006 3.44116 2.70878C3.38463 2.81988 3.3412 2.97576 3.31714 3.27031C3.29247 3.57243 3.29175 3.96275 3.29175 4.533V11.4666ZM9.96558 4.65312C9.96701 4.67068 9.96918 4.68335 9.97046 4.69218L9.97339 4.69609C9.98224 4.69738 9.99547 4.6995 10.0134 4.70097C10.0932 4.70746 10.2034 4.70781 10.4001 4.70781H11.824L9.95874 2.8416V4.2664C9.95874 4.46323 9.95906 4.57334 9.96558 4.65312Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/attachments/image-file-icon.tsx b/packages/propel/src/icons/attachments/image-file-icon.tsx
index cab163eb8..3dd36580a 100644
--- a/packages/propel/src/icons/attachments/image-file-icon.tsx
+++ b/packages/propel/src/icons/attachments/image-file-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ImageFileIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 10.2598L10.9785 7.86328C10.8392 7.72401 10.7612 7.64557 10.7002 7.59375C10.6869 7.58245 10.676 7.57561 10.6689 7.57031C10.6672 7.57021 10.6658 7.5702 10.6641 7.57031C10.657 7.57563 10.6461 7.58247 10.6328 7.59375C10.5718 7.64558 10.4938 7.72399 10.3545 7.86328L4.84277 13.373C4.9535 13.3734 5.07242 13.375 5.2002 13.375H10.7998C11.3701 13.375 11.7604 13.3743 12.0625 13.3496C12.357 13.3255 12.5129 13.2821 12.624 13.2256C12.8827 13.0938 13.0938 12.8827 13.2256 12.624C13.2821 12.5129 13.3255 12.357 13.3496 12.0625C13.3743 11.7604 13.375 11.3701 13.375 10.7998V10.2598ZM6.375 5.66699C6.375 5.2759 6.05805 4.95818 5.66699 4.95801C5.27579 4.95801 4.95801 5.27579 4.95801 5.66699C4.95818 6.05805 5.2759 6.375 5.66699 6.375C6.05794 6.37482 6.37482 6.05794 6.375 5.66699ZM13.375 5.2002C13.375 4.62994 13.3743 4.23962 13.3496 3.9375C13.3255 3.64295 13.2821 3.48707 13.2256 3.37598C13.0938 3.11725 12.8827 2.90623 12.624 2.77441C12.5129 2.71788 12.357 2.67445 12.0625 2.65039C11.7604 2.62572 11.3701 2.625 10.7998 2.625H5.2002C4.62994 2.625 4.23962 2.62572 3.9375 2.65039C3.64296 2.67446 3.48707 2.71788 3.37598 2.77441C3.11725 2.90624 2.90624 3.11725 2.77441 3.37598C2.71788 3.48707 2.67446 3.64296 2.65039 3.9375C2.62572 4.23962 2.625 4.62994 2.625 5.2002V10.7998C2.625 11.3701 2.62572 11.7604 2.65039 12.0625C2.67445 12.357 2.71788 12.5129 2.77441 12.624C2.89654 12.8637 3.08734 13.0607 3.32031 13.1934C3.36428 13.122 3.40913 13.0651 3.44238 13.0254C3.53706 12.9123 3.66771 12.7815 3.80176 12.6475L9.4707 6.97852C9.59527 6.85395 9.7153 6.73407 9.82422 6.6416C9.93879 6.54434 10.0817 6.44122 10.2676 6.38086L10.3652 6.35352C10.5962 6.29805 10.8392 6.30699 11.0664 6.38086C11.2524 6.44121 11.3952 6.54433 11.5098 6.6416C11.6187 6.7341 11.7387 6.85398 11.8633 6.97852L13.375 8.49023V5.2002ZM7.625 5.66699C7.62482 6.74829 6.74829 7.62482 5.66699 7.625C4.58554 7.625 3.70818 6.7484 3.70801 5.66699C3.70801 4.58543 4.58543 3.70801 5.66699 3.70801C6.7484 3.70818 7.625 4.58554 7.625 5.66699ZM14.625 10.7998C14.625 11.3493 14.6255 11.7993 14.5957 12.1641C14.5653 12.5361 14.5001 12.8748 14.3389 13.1914C14.0872 13.6854 13.6854 14.0872 13.1914 14.3389C12.8748 14.5001 12.5361 14.5653 12.1641 14.5957C11.7993 14.6255 11.3493 14.625 10.7998 14.625H4.62109C4.43152 14.625 4.24652 14.6253 4.09961 14.6123C4.09609 14.612 4.09257 14.6107 4.08887 14.6104C4.00037 14.6064 3.91608 14.6022 3.83594 14.5957C3.46388 14.5653 3.12523 14.5002 2.80859 14.3389C2.31467 14.0872 1.91281 13.6854 1.66113 13.1914C1.49987 12.8748 1.4347 12.5361 1.4043 12.1641C1.37452 11.7993 1.375 11.3493 1.375 10.7998V5.2002C1.375 4.65067 1.37452 4.20072 1.4043 3.83594C1.4347 3.46388 1.49985 3.12523 1.66113 2.80859C1.9128 2.31466 2.31466 1.9128 2.80859 1.66113C3.12523 1.49985 3.46388 1.4347 3.83594 1.4043C4.20072 1.37452 4.65067 1.375 5.2002 1.375H10.7998C11.3493 1.375 11.7993 1.37452 12.1641 1.4043C12.5361 1.4347 12.8748 1.49987 13.1914 1.66113C13.6854 1.91281 14.0872 2.31467 14.3389 2.80859C14.5002 3.12523 14.5653 3.46388 14.5957 3.83594C14.6255 4.20072 14.625 4.65067 14.625 5.2002V10.7998Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function ImageFileIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 10.2598L10.9785 7.86328C10.8392 7.72401 10.7612 7.64557 10.7002 7.59375C10.6869 7.58245 10.676 7.57561 10.6689 7.57031C10.6672 7.57021 10.6658 7.5702 10.6641 7.57031C10.657 7.57563 10.6461 7.58247 10.6328 7.59375C10.5718 7.64558 10.4938 7.72399 10.3545 7.86328L4.84277 13.373C4.9535 13.3734 5.07242 13.375 5.2002 13.375H10.7998C11.3701 13.375 11.7604 13.3743 12.0625 13.3496C12.357 13.3255 12.5129 13.2821 12.624 13.2256C12.8827 13.0938 13.0938 12.8827 13.2256 12.624C13.2821 12.5129 13.3255 12.357 13.3496 12.0625C13.3743 11.7604 13.375 11.3701 13.375 10.7998V10.2598ZM6.375 5.66699C6.375 5.2759 6.05805 4.95818 5.66699 4.95801C5.27579 4.95801 4.95801 5.27579 4.95801 5.66699C4.95818 6.05805 5.2759 6.375 5.66699 6.375C6.05794 6.37482 6.37482 6.05794 6.375 5.66699ZM13.375 5.2002C13.375 4.62994 13.3743 4.23962 13.3496 3.9375C13.3255 3.64295 13.2821 3.48707 13.2256 3.37598C13.0938 3.11725 12.8827 2.90623 12.624 2.77441C12.5129 2.71788 12.357 2.67445 12.0625 2.65039C11.7604 2.62572 11.3701 2.625 10.7998 2.625H5.2002C4.62994 2.625 4.23962 2.62572 3.9375 2.65039C3.64296 2.67446 3.48707 2.71788 3.37598 2.77441C3.11725 2.90624 2.90624 3.11725 2.77441 3.37598C2.71788 3.48707 2.67446 3.64296 2.65039 3.9375C2.62572 4.23962 2.625 4.62994 2.625 5.2002V10.7998C2.625 11.3701 2.62572 11.7604 2.65039 12.0625C2.67445 12.357 2.71788 12.5129 2.77441 12.624C2.89654 12.8637 3.08734 13.0607 3.32031 13.1934C3.36428 13.122 3.40913 13.0651 3.44238 13.0254C3.53706 12.9123 3.66771 12.7815 3.80176 12.6475L9.4707 6.97852C9.59527 6.85395 9.7153 6.73407 9.82422 6.6416C9.93879 6.54434 10.0817 6.44122 10.2676 6.38086L10.3652 6.35352C10.5962 6.29805 10.8392 6.30699 11.0664 6.38086C11.2524 6.44121 11.3952 6.54433 11.5098 6.6416C11.6187 6.7341 11.7387 6.85398 11.8633 6.97852L13.375 8.49023V5.2002ZM7.625 5.66699C7.62482 6.74829 6.74829 7.62482 5.66699 7.625C4.58554 7.625 3.70818 6.7484 3.70801 5.66699C3.70801 4.58543 4.58543 3.70801 5.66699 3.70801C6.7484 3.70818 7.625 4.58554 7.625 5.66699ZM14.625 10.7998C14.625 11.3493 14.6255 11.7993 14.5957 12.1641C14.5653 12.5361 14.5001 12.8748 14.3389 13.1914C14.0872 13.6854 13.6854 14.0872 13.1914 14.3389C12.8748 14.5001 12.5361 14.5653 12.1641 14.5957C11.7993 14.6255 11.3493 14.625 10.7998 14.625H4.62109C4.43152 14.625 4.24652 14.6253 4.09961 14.6123C4.09609 14.612 4.09257 14.6107 4.08887 14.6104C4.00037 14.6064 3.91608 14.6022 3.83594 14.5957C3.46388 14.5653 3.12523 14.5002 2.80859 14.3389C2.31467 14.0872 1.91281 13.6854 1.66113 13.1914C1.49987 12.8748 1.4347 12.5361 1.4043 12.1641C1.37452 11.7993 1.375 11.3493 1.375 10.7998V5.2002C1.375 4.65067 1.37452 4.20072 1.4043 3.83594C1.4347 3.46388 1.49985 3.12523 1.66113 2.80859C1.9128 2.31466 2.31466 1.9128 2.80859 1.66113C3.12523 1.49985 3.46388 1.4347 3.83594 1.4043C4.20072 1.37452 4.65067 1.375 5.2002 1.375H10.7998C11.3493 1.375 11.7993 1.37452 12.1641 1.4043C12.5361 1.4347 12.8748 1.49987 13.1914 1.66113C13.6854 1.91281 14.0872 2.31467 14.3389 2.80859C14.5002 3.12523 14.5653 3.46388 14.5957 3.83594C14.6255 4.20072 14.625 4.65067 14.625 5.2002V10.7998Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/attachments/video-file-icon.tsx b/packages/propel/src/icons/attachments/video-file-icon.tsx
index ab5b0e75f..4d6203e06 100644
--- a/packages/propel/src/icons/attachments/video-file-icon.tsx
+++ b/packages/propel/src/icons/attachments/video-file-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const VideoFileIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M8.13281 2.70801C8.68235 2.70801 9.13229 2.70753 9.49707 2.73731C9.86914 2.7677 10.2078 2.83287 10.5244 2.99414C11.0184 3.24582 11.4202 3.64768 11.6719 4.1416C11.8332 4.45823 11.8983 4.79689 11.9287 5.16895C11.9577 5.52422 11.957 5.96009 11.957 6.49023L13.3135 5.13477C13.4475 5.00076 13.5783 4.87006 13.6914 4.77539C13.7887 4.69397 13.9861 4.53702 14.2578 4.51563L14.3721 4.51367C14.6367 4.52445 14.8872 4.64455 15.0615 4.84863C15.2385 5.05589 15.2681 5.30626 15.2793 5.43262C15.2923 5.57953 15.291 5.76453 15.291 5.9541V10.0449C15.291 10.2344 15.2923 10.4195 15.2793 10.5664C15.2681 10.6927 15.2386 10.9431 15.0615 11.1504C14.8872 11.3546 14.6367 11.4745 14.3721 11.4854L14.2578 11.4834C13.9864 11.462 13.7888 11.3061 13.6914 11.2246C13.5783 11.1299 13.4475 10.9983 13.3135 10.8643L11.957 9.50781C11.957 10.0388 11.9578 10.4754 11.9287 10.8311C11.8983 11.2031 11.8332 11.5417 11.6719 11.8584C11.4202 12.3522 11.0183 12.7533 10.5244 13.0049C10.2077 13.1662 9.86919 13.2313 9.49707 13.2617C9.13229 13.2915 8.68236 13.291 8.13281 13.291H4.5332C3.98367 13.291 3.53373 13.2915 3.16895 13.2617C2.79684 13.2313 2.45827 13.1662 2.1416 13.0049C1.64776 12.7533 1.24583 12.3522 0.994141 11.8584C0.832817 11.5417 0.76772 11.2031 0.737305 10.8311C0.707503 10.4663 0.708008 10.0163 0.708008 9.4668V6.5332C0.708008 5.98368 0.707531 5.53373 0.737305 5.16895C0.767704 4.79689 0.832862 4.45824 0.994141 4.1416C1.24581 3.64767 1.64767 3.24581 2.1416 2.99414C2.45824 2.83286 2.79689 2.7677 3.16895 2.73731C3.53373 2.70753 3.98368 2.70801 4.5332 2.70801H8.13281ZM12.2168 7.99902L14.041 9.82324V6.17578L12.2168 7.99902ZM1.95801 9.4668C1.95801 10.0369 1.95872 10.4274 1.9834 10.7295C2.0075 11.024 2.05082 11.1799 2.10742 11.291C2.23924 11.5497 2.45031 11.7598 2.70898 11.8916C2.82008 11.9482 2.97584 11.9925 3.27051 12.0166C3.57262 12.0413 3.96298 12.041 4.5332 12.041H8.13281C8.70305 12.041 9.0934 12.0413 9.39551 12.0166C9.69012 11.9925 9.84589 11.9482 9.95703 11.8916C10.2157 11.7598 10.4268 11.5497 10.5586 11.291C10.6152 11.1799 10.6585 11.024 10.6826 10.7295C10.7073 10.4274 10.708 10.0369 10.708 9.4668V6.5332C10.708 5.96295 10.7073 5.57263 10.6826 5.27051C10.6586 4.97596 10.6151 4.82008 10.5586 4.70898C10.4268 4.45026 10.2157 4.23924 9.95703 4.10742C9.8459 4.05089 9.69 4.00746 9.39551 3.9834C9.09339 3.95873 8.70308 3.95801 8.13281 3.95801H4.5332C3.96295 3.95801 3.57263 3.95873 3.27051 3.9834C2.97596 4.00746 2.82008 4.05089 2.70898 4.10742C2.45026 4.23925 2.23925 4.45026 2.10742 4.70898C2.05089 4.82008 2.00746 4.97596 1.9834 5.27051C1.95873 5.57263 1.95801 5.96295 1.95801 6.5332V9.4668Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function VideoFileIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M8.13281 2.70801C8.68235 2.70801 9.13229 2.70753 9.49707 2.73731C9.86914 2.7677 10.2078 2.83287 10.5244 2.99414C11.0184 3.24582 11.4202 3.64768 11.6719 4.1416C11.8332 4.45823 11.8983 4.79689 11.9287 5.16895C11.9577 5.52422 11.957 5.96009 11.957 6.49023L13.3135 5.13477C13.4475 5.00076 13.5783 4.87006 13.6914 4.77539C13.7887 4.69397 13.9861 4.53702 14.2578 4.51563L14.3721 4.51367C14.6367 4.52445 14.8872 4.64455 15.0615 4.84863C15.2385 5.05589 15.2681 5.30626 15.2793 5.43262C15.2923 5.57953 15.291 5.76453 15.291 5.9541V10.0449C15.291 10.2344 15.2923 10.4195 15.2793 10.5664C15.2681 10.6927 15.2386 10.9431 15.0615 11.1504C14.8872 11.3546 14.6367 11.4745 14.3721 11.4854L14.2578 11.4834C13.9864 11.462 13.7888 11.3061 13.6914 11.2246C13.5783 11.1299 13.4475 10.9983 13.3135 10.8643L11.957 9.50781C11.957 10.0388 11.9578 10.4754 11.9287 10.8311C11.8983 11.2031 11.8332 11.5417 11.6719 11.8584C11.4202 12.3522 11.0183 12.7533 10.5244 13.0049C10.2077 13.1662 9.86919 13.2313 9.49707 13.2617C9.13229 13.2915 8.68236 13.291 8.13281 13.291H4.5332C3.98367 13.291 3.53373 13.2915 3.16895 13.2617C2.79684 13.2313 2.45827 13.1662 2.1416 13.0049C1.64776 12.7533 1.24583 12.3522 0.994141 11.8584C0.832817 11.5417 0.76772 11.2031 0.737305 10.8311C0.707503 10.4663 0.708008 10.0163 0.708008 9.4668V6.5332C0.708008 5.98368 0.707531 5.53373 0.737305 5.16895C0.767704 4.79689 0.832862 4.45824 0.994141 4.1416C1.24581 3.64767 1.64767 3.24581 2.1416 2.99414C2.45824 2.83286 2.79689 2.7677 3.16895 2.73731C3.53373 2.70753 3.98368 2.70801 4.5332 2.70801H8.13281ZM12.2168 7.99902L14.041 9.82324V6.17578L12.2168 7.99902ZM1.95801 9.4668C1.95801 10.0369 1.95872 10.4274 1.9834 10.7295C2.0075 11.024 2.05082 11.1799 2.10742 11.291C2.23924 11.5497 2.45031 11.7598 2.70898 11.8916C2.82008 11.9482 2.97584 11.9925 3.27051 12.0166C3.57262 12.0413 3.96298 12.041 4.5332 12.041H8.13281C8.70305 12.041 9.0934 12.0413 9.39551 12.0166C9.69012 11.9925 9.84589 11.9482 9.95703 11.8916C10.2157 11.7598 10.4268 11.5497 10.5586 11.291C10.6152 11.1799 10.6585 11.024 10.6826 10.7295C10.7073 10.4274 10.708 10.0369 10.708 9.4668V6.5332C10.708 5.96295 10.7073 5.57263 10.6826 5.27051C10.6586 4.97596 10.6151 4.82008 10.5586 4.70898C10.4268 4.45026 10.2157 4.23924 9.95703 4.10742C9.8459 4.05089 9.69 4.00746 9.39551 3.9834C9.09339 3.95873 8.70308 3.95801 8.13281 3.95801H4.5332C3.96295 3.95801 3.57263 3.95873 3.27051 3.9834C2.97596 4.00746 2.82008 4.05089 2.70898 4.10742C2.45026 4.23925 2.23925 4.45026 2.10742 4.70898C2.05089 4.82008 2.00746 4.97596 1.9834 5.27051C1.95873 5.57263 1.95801 5.96295 1.95801 6.5332V9.4668Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/bar-icon.tsx b/packages/propel/src/icons/bar-icon.tsx
index 13b01105a..9225f3a4a 100644
--- a/packages/propel/src/icons/bar-icon.tsx
+++ b/packages/propel/src/icons/bar-icon.tsx
@@ -2,19 +2,21 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const BarIcon: React.FC<ISvgIcons> = ({ className = "", ...rest }) => (
-  <svg className={className} viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg" {...rest}>
-    <path
-      d="M0 12.5859C0 11.4814 0.89543 10.5859 2 10.5859H3.64706C4.75163 10.5859 5.64706 11.4814 5.64706 12.5859V23.9977H0V12.5859Z"
-      fill="currentColor"
-    />
-    <path
-      d="M9.17773 2C9.17773 0.89543 10.0732 0 11.1777 0H12.8248C13.9294 0 14.8248 0.895431 14.8248 2V24H9.17773V2Z"
-      fill="currentColor"
-    />
-    <path
-      d="M18.3535 8.35156C18.3535 7.247 19.2489 6.35156 20.3535 6.35156H22.0006C23.1051 6.35156 24.0006 7.24699 24.0006 8.35156V23.9986H18.3535V8.35156Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function BarIcon({ className = "", ...rest }: ISvgIcons) {
+  return (
+    <svg className={className} viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg" {...rest}>
+      <path
+        d="M0 12.5859C0 11.4814 0.89543 10.5859 2 10.5859H3.64706C4.75163 10.5859 5.64706 11.4814 5.64706 12.5859V23.9977H0V12.5859Z"
+        fill="currentColor"
+      />
+      <path
+        d="M9.17773 2C9.17773 0.89543 10.0732 0 11.1777 0H12.8248C13.9294 0 14.8248 0.895431 14.8248 2V24H9.17773V2Z"
+        fill="currentColor"
+      />
+      <path
+        d="M18.3535 8.35156C18.3535 7.247 19.2489 6.35156 20.3535 6.35156H22.0006C23.1051 6.35156 24.0006 7.24699 24.0006 8.35156V23.9986H18.3535V8.35156Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/blocked-icon.tsx b/packages/propel/src/icons/blocked-icon.tsx
index 6ce00ccfc..a11bb2bf2 100644
--- a/packages/propel/src/icons/blocked-icon.tsx
+++ b/packages/propel/src/icons/blocked-icon.tsx
@@ -2,25 +2,27 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const BlockedIcon: React.FC<ISvgIcons> = ({ height = "24", width = "24", className = "", ...rest }) => (
-  <svg
-    height={height}
-    width={width}
-    className={className}
-    fill="none"
-    viewBox="0 0 24 24"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M0.5 4.8C0.5 3.52696 1.00797 2.30606 1.91216 1.40589C2.81636 0.505713 4.04271 0 5.32143 0H21.3929C21.6913 0 21.9839 0.0827435 22.2378 0.238959C22.4917 0.395174 22.6968 0.618689 22.8303 0.884458C22.9638 1.15023 23.0203 1.44775 22.9935 1.74369C22.9667 2.03963 22.8576 2.32229 22.6786 2.56L18.5804 8L22.6786 13.44C22.8576 13.6777 22.9667 13.9604 22.9935 14.2563C23.0203 14.5522 22.9638 14.8498 22.8303 15.1155C22.6968 15.3813 22.4917 15.6048 22.2378 15.761C21.9839 15.9173 21.6913 16 21.3929 16H5.32143C4.89519 16 4.4864 16.1686 4.18501 16.4686C3.88361 16.7687 3.71429 17.1757 3.71429 17.6V22.4C3.71429 22.8243 3.54496 23.2313 3.24356 23.5314C2.94217 23.8314 2.53338 24 2.10714 24C1.6809 24 1.27212 23.8314 0.970721 23.5314C0.669323 23.2313 0.5 22.8243 0.5 22.4V4.8Z"
-      fill="#F76659"
-    />
-    <path
-      d="M8.5918 20.4812H21.084C21.26 20.4812 21.4056 20.4237 21.5207 20.3086C21.6358 20.1935 21.6934 20.0479 21.6934 19.8719C21.6934 19.6958 21.6358 19.5503 21.5207 19.4352C21.4056 19.3201 21.26 19.2625 21.084 19.2625H8.57148L10.3184 17.5156C10.4267 17.4073 10.4809 17.2719 10.4809 17.1094C10.4809 16.9469 10.4199 16.8047 10.298 16.6828C10.1762 16.5609 10.034 16.5 9.87148 16.5C9.70899 16.5 9.5668 16.5609 9.44492 16.6828L6.68242 19.4453C6.61471 19.513 6.56732 19.5807 6.54023 19.6484C6.51315 19.7161 6.49961 19.7906 6.49961 19.8719C6.49961 19.9531 6.51315 20.0276 6.54023 20.0953C6.56732 20.163 6.61471 20.2307 6.68242 20.2984L9.44492 23.0609C9.58034 23.1964 9.72591 23.2607 9.88164 23.2539C10.0374 23.2471 10.1762 23.1828 10.298 23.0609C10.4199 22.9391 10.4809 22.7935 10.4809 22.6242C10.4809 22.4549 10.4267 22.3161 10.3184 22.2078L8.5918 20.4812Z"
-      fill="#F76659"
-    />
-  </svg>
-);
+export function BlockedIcon({ height = "24", width = "24", className = "", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      height={height}
+      width={width}
+      className={className}
+      fill="none"
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M0.5 4.8C0.5 3.52696 1.00797 2.30606 1.91216 1.40589C2.81636 0.505713 4.04271 0 5.32143 0H21.3929C21.6913 0 21.9839 0.0827435 22.2378 0.238959C22.4917 0.395174 22.6968 0.618689 22.8303 0.884458C22.9638 1.15023 23.0203 1.44775 22.9935 1.74369C22.9667 2.03963 22.8576 2.32229 22.6786 2.56L18.5804 8L22.6786 13.44C22.8576 13.6777 22.9667 13.9604 22.9935 14.2563C23.0203 14.5522 22.9638 14.8498 22.8303 15.1155C22.6968 15.3813 22.4917 15.6048 22.2378 15.761C21.9839 15.9173 21.6913 16 21.3929 16H5.32143C4.89519 16 4.4864 16.1686 4.18501 16.4686C3.88361 16.7687 3.71429 17.1757 3.71429 17.6V22.4C3.71429 22.8243 3.54496 23.2313 3.24356 23.5314C2.94217 23.8314 2.53338 24 2.10714 24C1.6809 24 1.27212 23.8314 0.970721 23.5314C0.669323 23.2313 0.5 22.8243 0.5 22.4V4.8Z"
+        fill="#F76659"
+      />
+      <path
+        d="M8.5918 20.4812H21.084C21.26 20.4812 21.4056 20.4237 21.5207 20.3086C21.6358 20.1935 21.6934 20.0479 21.6934 19.8719C21.6934 19.6958 21.6358 19.5503 21.5207 19.4352C21.4056 19.3201 21.26 19.2625 21.084 19.2625H8.57148L10.3184 17.5156C10.4267 17.4073 10.4809 17.2719 10.4809 17.1094C10.4809 16.9469 10.4199 16.8047 10.298 16.6828C10.1762 16.5609 10.034 16.5 9.87148 16.5C9.70899 16.5 9.5668 16.5609 9.44492 16.6828L6.68242 19.4453C6.61471 19.513 6.56732 19.5807 6.54023 19.6484C6.51315 19.7161 6.49961 19.7906 6.49961 19.8719C6.49961 19.9531 6.51315 20.0276 6.54023 20.0953C6.56732 20.163 6.61471 20.2307 6.68242 20.2984L9.44492 23.0609C9.58034 23.1964 9.72591 23.2607 9.88164 23.2539C10.0374 23.2471 10.1762 23.1828 10.298 23.0609C10.4199 22.9391 10.4809 22.7935 10.4809 22.6242C10.4809 22.4549 10.4267 22.3161 10.3184 22.2078L8.5918 20.4812Z"
+        fill="#F76659"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/blocker-icon.tsx b/packages/propel/src/icons/blocker-icon.tsx
index 834432989..2548156d6 100644
--- a/packages/propel/src/icons/blocker-icon.tsx
+++ b/packages/propel/src/icons/blocker-icon.tsx
@@ -2,25 +2,27 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const BlockerIcon: React.FC<ISvgIcons> = ({ height = "24", width = "24", className = "", ...rest }) => (
-  <svg
-    height={height}
-    width={width}
-    className={className}
-    fill="none"
-    viewBox="0 0 24 24"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M0 4.8C0 3.52696 0.507971 2.30606 1.41216 1.40589C2.31636 0.505713 3.54271 0 4.82143 0H20.8929C21.1913 0 21.4839 0.0827435 21.7378 0.238959C21.9917 0.395174 22.1968 0.618689 22.3303 0.884458C22.4638 1.15023 22.5203 1.44775 22.4935 1.74369C22.4667 2.03963 22.3576 2.32229 22.1786 2.56L18.0804 8L22.1786 13.44C22.3576 13.6777 22.4667 13.9604 22.4935 14.2563C22.5203 14.5522 22.4638 14.8498 22.3303 15.1155C22.1968 15.3813 21.9917 15.6048 21.7378 15.761C21.4839 15.9173 21.1913 16 20.8929 16H4.82143C4.39519 16 3.9864 16.1686 3.68501 16.4686C3.38361 16.7687 3.21429 17.1757 3.21429 17.6V22.4C3.21429 22.8243 3.04496 23.2313 2.74356 23.5314C2.44217 23.8314 2.03338 24 1.60714 24C1.1809 24 0.772119 23.8314 0.470721 23.5314C0.169323 23.2313 0 22.8243 0 22.4V4.8Z"
-      fill="#F7AE59"
-    />
-    <path
-      d="M18.5391 20.8797H6.04688C5.87083 20.8797 5.72526 20.8221 5.61016 20.707C5.49505 20.5919 5.4375 20.4464 5.4375 20.2703C5.4375 20.0943 5.49505 19.9487 5.61016 19.8336C5.72526 19.7185 5.87083 19.6609 6.04688 19.6609H18.5594L16.8125 17.9141C16.7042 17.8057 16.65 17.6703 16.65 17.5078C16.65 17.3453 16.7109 17.2031 16.8328 17.0813C16.9547 16.9594 17.0969 16.8984 17.2594 16.8984C17.4219 16.8984 17.5641 16.9594 17.6859 17.0813L20.4484 19.8438C20.5161 19.9115 20.5635 19.9792 20.5906 20.0469C20.6177 20.1146 20.6313 20.1891 20.6313 20.2703C20.6313 20.3516 20.6177 20.426 20.5906 20.4938C20.5635 20.5615 20.5161 20.6292 20.4484 20.6969L17.6859 23.4594C17.5505 23.5948 17.4049 23.6591 17.2492 23.6523C17.0935 23.6456 16.9547 23.5812 16.8328 23.4594C16.7109 23.3375 16.65 23.1919 16.65 23.0227C16.65 22.8534 16.7042 22.7146 16.8125 22.6062L18.5391 20.8797Z"
-      fill="#F7AE59"
-    />
-  </svg>
-);
+export function BlockerIcon({ height = "24", width = "24", className = "", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      height={height}
+      width={width}
+      className={className}
+      fill="none"
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M0 4.8C0 3.52696 0.507971 2.30606 1.41216 1.40589C2.31636 0.505713 3.54271 0 4.82143 0H20.8929C21.1913 0 21.4839 0.0827435 21.7378 0.238959C21.9917 0.395174 22.1968 0.618689 22.3303 0.884458C22.4638 1.15023 22.5203 1.44775 22.4935 1.74369C22.4667 2.03963 22.3576 2.32229 22.1786 2.56L18.0804 8L22.1786 13.44C22.3576 13.6777 22.4667 13.9604 22.4935 14.2563C22.5203 14.5522 22.4638 14.8498 22.3303 15.1155C22.1968 15.3813 21.9917 15.6048 21.7378 15.761C21.4839 15.9173 21.1913 16 20.8929 16H4.82143C4.39519 16 3.9864 16.1686 3.68501 16.4686C3.38361 16.7687 3.21429 17.1757 3.21429 17.6V22.4C3.21429 22.8243 3.04496 23.2313 2.74356 23.5314C2.44217 23.8314 2.03338 24 1.60714 24C1.1809 24 0.772119 23.8314 0.470721 23.5314C0.169323 23.2313 0 22.8243 0 22.4V4.8Z"
+        fill="#F7AE59"
+      />
+      <path
+        d="M18.5391 20.8797H6.04688C5.87083 20.8797 5.72526 20.8221 5.61016 20.707C5.49505 20.5919 5.4375 20.4464 5.4375 20.2703C5.4375 20.0943 5.49505 19.9487 5.61016 19.8336C5.72526 19.7185 5.87083 19.6609 6.04688 19.6609H18.5594L16.8125 17.9141C16.7042 17.8057 16.65 17.6703 16.65 17.5078C16.65 17.3453 16.7109 17.2031 16.8328 17.0813C16.9547 16.9594 17.0969 16.8984 17.2594 16.8984C17.4219 16.8984 17.5641 16.9594 17.6859 17.0813L20.4484 19.8438C20.5161 19.9115 20.5635 19.9792 20.5906 20.0469C20.6177 20.1146 20.6313 20.1891 20.6313 20.2703C20.6313 20.3516 20.6177 20.426 20.5906 20.4938C20.5635 20.5615 20.5161 20.6292 20.4484 20.6969L17.6859 23.4594C17.5505 23.5948 17.4049 23.6591 17.2492 23.6523C17.0935 23.6456 16.9547 23.5812 16.8328 23.4594C16.7109 23.3375 16.65 23.1919 16.65 23.0227C16.65 22.8534 16.7042 22.7146 16.8125 22.6062L18.5391 20.8797Z"
+        fill="#F7AE59"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/brand/accenture-logo.tsx b/packages/propel/src/icons/brand/accenture-logo.tsx
index 833241671..9b526d4b7 100644
--- a/packages/propel/src/icons/brand/accenture-logo.tsx
+++ b/packages/propel/src/icons/brand/accenture-logo.tsx
@@ -2,27 +2,24 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const AccentureLogo: React.FC<ISvgIcons> = ({
-  width = "51",
-  height = "16",
-  className,
-  color = "currentColor",
-}) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 51 16"
-    fill={color}
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      d="M29.73 2.48282V1L34.5913 2.96305V4.16785L29.73 6.13932V4.6228L32.5693 3.56966L29.73 2.48282Z"
-      fill="#A100FF"
-    />
-    <path
-      d="M2.87038 13.9915C1.84251 13.9915 1 13.4776 1 12.3318V12.2728C1 10.8827 2.20479 10.4024 3.68762 10.4024H4.37848V10.1328C4.37848 9.55992 4.13415 9.22291 3.53597 9.22291C2.98833 9.22291 2.71873 9.52622 2.69345 9.94747H1.18535C1.3033 8.67528 2.3059 8.0771 3.62864 8.0771C4.95139 8.0771 5.98768 8.65 5.98768 10.0739V13.882H4.44588V13.2164C4.14257 13.6377 3.62864 14 2.8788 14L2.87038 13.9915ZM4.3869 11.9948V11.4471H3.75502C2.97148 11.4471 2.5755 11.6578 2.5755 12.1717V12.2307C2.5755 12.6267 2.81983 12.8963 3.35904 12.8963C3.90667 12.8626 4.3869 12.5677 4.3869 11.9864V11.9948ZM9.57679 13.9915C8.00971 13.9915 6.85547 13.0226 6.85547 11.0933V11.0006C6.85547 9.07126 8.06026 8.0434 9.57679 8.0434C10.8743 8.0434 11.9358 8.70898 12.0538 10.1918H10.5457C10.453 9.64417 10.1497 9.28189 9.61049 9.28189C8.9449 9.28189 8.46467 9.82952 8.46467 10.9416V11.127C8.46467 12.2728 8.88592 12.7867 9.61049 12.7867C10.1581 12.7867 10.5457 12.3908 10.6384 11.7589H12.0875C11.9948 13.09 11.1186 13.9915 9.57679 13.9915ZM15.4997 13.9915C13.9326 13.9915 12.7783 13.0226 12.7783 11.0933V11.0006C12.7783 9.07126 13.9831 8.0434 15.4997 8.0434C16.7971 8.0434 17.8587 8.70898 17.9766 10.1918H16.4685C16.3759 9.64417 16.0726 9.28189 15.5334 9.28189C14.8678 9.28189 14.3875 9.82952 14.3875 10.9416V11.127C14.3875 12.2728 14.8088 12.7867 15.5334 12.7867C16.081 12.7867 16.4685 12.3908 16.5612 11.7589H18.0103C17.9177 13.09 17.0415 13.9915 15.4997 13.9915ZM21.4478 13.9915C19.8133 13.9915 18.7012 13.0226 18.7012 11.1186V11.0006C18.7012 9.09654 19.8807 8.0434 21.4225 8.0434C22.8464 8.0434 24.0175 8.82693 24.0175 10.731V11.4219H20.302C20.361 12.4497 20.8159 12.8457 21.4815 12.8457C22.0881 12.8457 22.4167 12.5171 22.5346 12.1212H24.0175C23.8321 13.1743 22.9306 13.9915 21.4478 13.9915ZM20.3357 10.3687H22.4504C22.4167 9.52622 22.0291 9.16394 21.3972 9.16394C20.917 9.19764 20.4621 9.46724 20.3441 10.3687H20.3357ZM24.9864 8.18662H26.5871V9.02913C26.8567 8.4815 27.4296 8.06025 28.3059 8.06025C29.3337 8.06025 30.0246 8.69213 30.0246 10.057V13.8652H28.4238V10.3013C28.4238 9.63574 28.1542 9.33244 27.5813 9.33244C27.0337 9.33244 26.5871 9.66102 26.5871 10.3856V13.8567H24.9864V8.1782V8.18662ZM32.965 6.4679V8.18662H34.0518V9.36614H32.965V12.0538C32.965 12.475 33.1503 12.6856 33.5379 12.6856C33.7822 12.6856 33.9338 12.6519 34.0855 12.593V13.8315C33.9001 13.8904 33.5716 13.9494 33.1756 13.9494C31.9371 13.9494 31.3642 13.3765 31.3642 12.2307V9.35771H30.6986V8.1782H31.3642V7.12506L32.965 6.45947V6.4679ZM40.0336 13.8652H38.4666V13.0226C38.197 13.5703 37.6493 13.9915 36.8068 13.9915C35.7789 13.9915 35.0207 13.3596 35.0207 12.0285V8.19505H36.6215V11.8178C36.6215 12.4834 36.8911 12.7867 37.4387 12.7867C37.9863 12.7867 38.4329 12.4245 38.4329 11.7336V8.19505H40.0336V13.8736V13.8652ZM41.2047 8.18662H42.8055V9.23976C43.1341 8.4815 43.6817 8.11922 44.5242 8.11922V9.68629C43.4374 9.68629 42.8055 10.0149 42.8055 10.9585V13.8904H41.2047V8.1782V8.18662ZM47.7679 13.9915C46.1334 13.9915 45.0213 13.0226 45.0213 11.1186V11.0006C45.0213 9.09654 46.2008 8.0434 47.7426 8.0434C49.1665 8.0434 50.3376 8.82693 50.3376 10.731V11.4219H46.6558C46.7148 12.4497 47.1697 12.8457 47.8353 12.8457C48.4419 12.8457 48.7705 12.5171 48.8885 12.1212H50.3713C50.127 13.1743 49.2507 13.9915 47.7763 13.9915H47.7679ZM46.6137 10.3687H48.7621C48.7284 9.52622 48.3408 9.16394 47.7089 9.16394C47.2287 9.19764 46.7738 9.46724 46.6221 10.3687H46.6137Z"
+export function AccentureLogo({ width = "51", height = "16", className, color = "currentColor" }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 51 16"
       fill={color}
-    />
-  </svg>
-);
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        d="M29.73 2.48282V1L34.5913 2.96305V4.16785L29.73 6.13932V4.6228L32.5693 3.56966L29.73 2.48282Z"
+        fill="#A100FF"
+      />
+      <path
+        d="M2.87038 13.9915C1.84251 13.9915 1 13.4776 1 12.3318V12.2728C1 10.8827 2.20479 10.4024 3.68762 10.4024H4.37848V10.1328C4.37848 9.55992 4.13415 9.22291 3.53597 9.22291C2.98833 9.22291 2.71873 9.52622 2.69345 9.94747H1.18535C1.3033 8.67528 2.3059 8.0771 3.62864 8.0771C4.95139 8.0771 5.98768 8.65 5.98768 10.0739V13.882H4.44588V13.2164C4.14257 13.6377 3.62864 14 2.8788 14L2.87038 13.9915ZM4.3869 11.9948V11.4471H3.75502C2.97148 11.4471 2.5755 11.6578 2.5755 12.1717V12.2307C2.5755 12.6267 2.81983 12.8963 3.35904 12.8963C3.90667 12.8626 4.3869 12.5677 4.3869 11.9864V11.9948ZM9.57679 13.9915C8.00971 13.9915 6.85547 13.0226 6.85547 11.0933V11.0006C6.85547 9.07126 8.06026 8.0434 9.57679 8.0434C10.8743 8.0434 11.9358 8.70898 12.0538 10.1918H10.5457C10.453 9.64417 10.1497 9.28189 9.61049 9.28189C8.9449 9.28189 8.46467 9.82952 8.46467 10.9416V11.127C8.46467 12.2728 8.88592 12.7867 9.61049 12.7867C10.1581 12.7867 10.5457 12.3908 10.6384 11.7589H12.0875C11.9948 13.09 11.1186 13.9915 9.57679 13.9915ZM15.4997 13.9915C13.9326 13.9915 12.7783 13.0226 12.7783 11.0933V11.0006C12.7783 9.07126 13.9831 8.0434 15.4997 8.0434C16.7971 8.0434 17.8587 8.70898 17.9766 10.1918H16.4685C16.3759 9.64417 16.0726 9.28189 15.5334 9.28189C14.8678 9.28189 14.3875 9.82952 14.3875 10.9416V11.127C14.3875 12.2728 14.8088 12.7867 15.5334 12.7867C16.081 12.7867 16.4685 12.3908 16.5612 11.7589H18.0103C17.9177 13.09 17.0415 13.9915 15.4997 13.9915ZM21.4478 13.9915C19.8133 13.9915 18.7012 13.0226 18.7012 11.1186V11.0006C18.7012 9.09654 19.8807 8.0434 21.4225 8.0434C22.8464 8.0434 24.0175 8.82693 24.0175 10.731V11.4219H20.302C20.361 12.4497 20.8159 12.8457 21.4815 12.8457C22.0881 12.8457 22.4167 12.5171 22.5346 12.1212H24.0175C23.8321 13.1743 22.9306 13.9915 21.4478 13.9915ZM20.3357 10.3687H22.4504C22.4167 9.52622 22.0291 9.16394 21.3972 9.16394C20.917 9.19764 20.4621 9.46724 20.3441 10.3687H20.3357ZM24.9864 8.18662H26.5871V9.02913C26.8567 8.4815 27.4296 8.06025 28.3059 8.06025C29.3337 8.06025 30.0246 8.69213 30.0246 10.057V13.8652H28.4238V10.3013C28.4238 9.63574 28.1542 9.33244 27.5813 9.33244C27.0337 9.33244 26.5871 9.66102 26.5871 10.3856V13.8567H24.9864V8.1782V8.18662ZM32.965 6.4679V8.18662H34.0518V9.36614H32.965V12.0538C32.965 12.475 33.1503 12.6856 33.5379 12.6856C33.7822 12.6856 33.9338 12.6519 34.0855 12.593V13.8315C33.9001 13.8904 33.5716 13.9494 33.1756 13.9494C31.9371 13.9494 31.3642 13.3765 31.3642 12.2307V9.35771H30.6986V8.1782H31.3642V7.12506L32.965 6.45947V6.4679ZM40.0336 13.8652H38.4666V13.0226C38.197 13.5703 37.6493 13.9915 36.8068 13.9915C35.7789 13.9915 35.0207 13.3596 35.0207 12.0285V8.19505H36.6215V11.8178C36.6215 12.4834 36.8911 12.7867 37.4387 12.7867C37.9863 12.7867 38.4329 12.4245 38.4329 11.7336V8.19505H40.0336V13.8736V13.8652ZM41.2047 8.18662H42.8055V9.23976C43.1341 8.4815 43.6817 8.11922 44.5242 8.11922V9.68629C43.4374 9.68629 42.8055 10.0149 42.8055 10.9585V13.8904H41.2047V8.1782V8.18662ZM47.7679 13.9915C46.1334 13.9915 45.0213 13.0226 45.0213 11.1186V11.0006C45.0213 9.09654 46.2008 8.0434 47.7426 8.0434C49.1665 8.0434 50.3376 8.82693 50.3376 10.731V11.4219H46.6558C46.7148 12.4497 47.1697 12.8457 47.8353 12.8457C48.4419 12.8457 48.7705 12.5171 48.8885 12.1212H50.3713C50.127 13.1743 49.2507 13.9915 47.7763 13.9915H47.7679ZM46.6137 10.3687H48.7621C48.7284 9.52622 48.3408 9.16394 47.7089 9.16394C47.2287 9.19764 46.7738 9.46724 46.6221 10.3687H46.6137Z"
+        fill={color}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/brand/dolby-logo.tsx b/packages/propel/src/icons/brand/dolby-logo.tsx
index b656c2d31..1638e96c7 100644
--- a/packages/propel/src/icons/brand/dolby-logo.tsx
+++ b/packages/propel/src/icons/brand/dolby-logo.tsx
@@ -2,39 +2,41 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const DolbyLogo: React.FC<ISvgIcons> = ({ width = "40", height = "16", className, color = "currentColor" }) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 40 16"
-    fill={color}
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      d="M11.7241 13.4334H10.643C8.57552 13.4334 6.92627 11.7447 6.92627 9.71672C6.92627 7.6887 8.61498 6 10.643 6H11.7241V13.4255V13.4334Z"
+export function DolbyLogo({ width = "40", height = "16", className, color = "currentColor" }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 40 16"
       fill={color}
-    />
-    <path
-      d="M1 6.00806H2.08109C4.14857 6.00806 5.79782 7.69676 5.79782 9.72477C5.79782 11.7528 4.10911 13.4415 2.08109 13.4415H1V6.01595V6.00806Z"
-      fill={color}
-    />
-    <path d="M26.8042 6.00781V13.4334H27.9247V6.00781H26.8042Z" fill={color} />
-    <path
-      d="M23.5051 8.28845C22.0847 8.28845 20.9326 9.44056 20.9326 10.861C20.9326 12.2814 22.0847 13.4335 23.5051 13.4335C24.9255 13.4335 26.0776 12.2814 26.0776 10.861C26.0776 9.44056 24.9255 8.28845 23.5051 8.28845ZM23.5051 12.3997C22.6529 12.4076 21.9506 11.7211 21.9348 10.8688C21.9269 10.0166 22.6134 9.3143 23.4657 9.29852C23.4815 9.29852 23.4893 9.29852 23.5051 9.29852C24.3574 9.29852 25.0518 10.0008 25.0518 10.8452C25.0518 11.6974 24.3574 12.3918 23.5051 12.3918V12.3997Z"
-      fill={color}
-    />
-    <path
-      d="M31.4678 8.2964C30.9391 8.2964 30.4261 8.45423 30 8.76198V6.01587H28.8716V13.4414H30V12.9758C31.16 13.7886 32.7619 13.5045 33.5747 12.3367C34.3875 11.1767 34.1034 9.57476 32.9355 8.76198C32.5015 8.46212 31.9886 8.2964 31.4678 8.2964ZM31.4678 12.3998C30.6155 12.3919 29.929 11.6896 29.9369 10.8295C29.9448 9.9851 30.6234 9.30647 31.4678 9.29858C32.32 9.29858 33.0144 10.0009 33.0144 10.8452C33.0144 11.6975 32.32 12.3919 31.4678 12.3919V12.3998Z"
-      fill={color}
-    />
-    <path
-      d="M16.6561 6.00781H13.981V13.4255H16.6561C18.6999 13.4255 20.3649 11.7604 20.3649 9.71664C20.3649 7.67284 18.6999 6.00781 16.6561 6.00781ZM16.6561 12.297H15.1015V7.12835H16.6561C18.0765 7.12835 19.2365 8.28835 19.2365 9.71664C19.2365 11.1449 18.0765 12.297 16.6561 12.297Z"
-      fill={color}
-    />
-    <path
-      d="M38.1592 8.29634L36.6914 11.5869L35.2237 8.29634H33.9927L36.068 12.9679C36.068 12.9679 35.563 14.1121 35.5551 14.1121C35.421 14.412 35.0659 14.5461 34.766 14.4199L34.6082 14.3488L34.1505 15.3668L34.5372 15.5404C35.271 15.8639 36.1312 15.5404 36.4547 14.7986L39.3665 8.28845H38.1355L38.1592 8.29634Z"
-      fill={color}
-    />
-  </svg>
-);
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        d="M11.7241 13.4334H10.643C8.57552 13.4334 6.92627 11.7447 6.92627 9.71672C6.92627 7.6887 8.61498 6 10.643 6H11.7241V13.4255V13.4334Z"
+        fill={color}
+      />
+      <path
+        d="M1 6.00806H2.08109C4.14857 6.00806 5.79782 7.69676 5.79782 9.72477C5.79782 11.7528 4.10911 13.4415 2.08109 13.4415H1V6.01595V6.00806Z"
+        fill={color}
+      />
+      <path d="M26.8042 6.00781V13.4334H27.9247V6.00781H26.8042Z" fill={color} />
+      <path
+        d="M23.5051 8.28845C22.0847 8.28845 20.9326 9.44056 20.9326 10.861C20.9326 12.2814 22.0847 13.4335 23.5051 13.4335C24.9255 13.4335 26.0776 12.2814 26.0776 10.861C26.0776 9.44056 24.9255 8.28845 23.5051 8.28845ZM23.5051 12.3997C22.6529 12.4076 21.9506 11.7211 21.9348 10.8688C21.9269 10.0166 22.6134 9.3143 23.4657 9.29852C23.4815 9.29852 23.4893 9.29852 23.5051 9.29852C24.3574 9.29852 25.0518 10.0008 25.0518 10.8452C25.0518 11.6974 24.3574 12.3918 23.5051 12.3918V12.3997Z"
+        fill={color}
+      />
+      <path
+        d="M31.4678 8.2964C30.9391 8.2964 30.4261 8.45423 30 8.76198V6.01587H28.8716V13.4414H30V12.9758C31.16 13.7886 32.7619 13.5045 33.5747 12.3367C34.3875 11.1767 34.1034 9.57476 32.9355 8.76198C32.5015 8.46212 31.9886 8.2964 31.4678 8.2964ZM31.4678 12.3998C30.6155 12.3919 29.929 11.6896 29.9369 10.8295C29.9448 9.9851 30.6234 9.30647 31.4678 9.29858C32.32 9.29858 33.0144 10.0009 33.0144 10.8452C33.0144 11.6975 32.32 12.3919 31.4678 12.3919V12.3998Z"
+        fill={color}
+      />
+      <path
+        d="M16.6561 6.00781H13.981V13.4255H16.6561C18.6999 13.4255 20.3649 11.7604 20.3649 9.71664C20.3649 7.67284 18.6999 6.00781 16.6561 6.00781ZM16.6561 12.297H15.1015V7.12835H16.6561C18.0765 7.12835 19.2365 8.28835 19.2365 9.71664C19.2365 11.1449 18.0765 12.297 16.6561 12.297Z"
+        fill={color}
+      />
+      <path
+        d="M38.1592 8.29634L36.6914 11.5869L35.2237 8.29634H33.9927L36.068 12.9679C36.068 12.9679 35.563 14.1121 35.5551 14.1121C35.421 14.412 35.0659 14.5461 34.766 14.4199L34.6082 14.3488L34.1505 15.3668L34.5372 15.5404C35.271 15.8639 36.1312 15.5404 36.4547 14.7986L39.3665 8.28845H38.1355L38.1592 8.29634Z"
+        fill={color}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/brand/plane-lockup.tsx b/packages/propel/src/icons/brand/plane-lockup.tsx
index 7251bd9a3..6e697f177 100644
--- a/packages/propel/src/icons/brand/plane-lockup.tsx
+++ b/packages/propel/src/icons/brand/plane-lockup.tsx
@@ -2,47 +2,44 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const PlaneLockup: React.FC<ISvgIcons> = ({
-  width = "253",
-  height = "53",
-  className,
-  color = "currentColor",
-}) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 253 53"
-    fill={color}
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g clipPath="url(#clip0_27_76)">
-      <path
-        d="M217.077 51.4468H210.972L210.98 31.4317C210.717 27.7545 208.786 25.1545 205.03 24.6199C198.587 23.7006 194.663 27.8828 194.21 34.0258L194.218 51.4468H188.041V20.2543H192.158L194.255 26.8846H194.6C195.825 22.8701 198.684 20.4831 202.898 19.5757C210.126 18.0231 216.643 22.2724 217.079 29.8239V51.4468H217.077Z"
-        fill={color}
-      />
-      <path
-        d="M163.812 19.7315C158.03 20.9566 153.67 25.2354 153.222 31.264H159.395C159.669 28.3484 161.561 25.9969 164.267 24.9553C167.418 23.7401 172.805 23.8881 175.178 26.6005C176.774 28.4253 177.305 31.5816 175.212 33.2249C172.675 35.2173 166.39 34.6117 163.214 34.7636C158.631 34.9826 154.141 36.8429 153.183 41.7727C151.1 52.5042 165.035 54.9267 171.902 49.8963C174.095 48.2885 175.672 45.8443 176.261 43.1792H176.577L178.788 51.4508H182.61V29.964C182.517 20.3214 171.462 18.108 163.81 19.7315H163.812ZM174.847 41.2637C172.484 45.649 166.958 49.0441 162.218 47.3318C158.44 45.9686 158.268 40.4095 161.973 38.9181C165.613 37.4524 173.732 38.9694 176.368 34.949C176.275 37.0855 175.906 39.2989 174.849 41.2637H174.847Z"
-        fill={color}
-      />
-      <path
-        d="M113.082 35.5652V51.4475H106.611V9.00063H124.863C125.007 8.99274 125.141 9.06178 125.283 9.06967C133.732 9.53129 139.297 13.601 139.104 22.6025C138.928 30.7991 132.663 35.2199 124.934 35.5671H113.082V35.5652ZM113.082 14.4828V30.2941H124.088C129.595 29.8956 133.071 27.1022 132.491 21.265C131.967 15.9781 127.802 14.6544 123.107 14.4788C119.795 14.3546 116.402 14.5795 113.082 14.4808V14.4828Z"
-        fill={color}
-      />
-      <path d="M148.647 9H142.529V51.4468H148.647V9Z" fill={color} />
-      <path
-        d="M245.872 42.418C244.911 44.4953 243.138 46.1603 240.934 46.8981C238.368 47.7562 234.479 47.5431 232.083 46.2569C228.67 44.4263 227.145 40.6485 227.137 36.8984H251.891C252.194 33.6908 251.902 30.3648 250.496 27.4333C247.083 20.3177 238.859 17.7236 231.513 19.9429C222.868 22.5568 220.165 31.4162 221.462 39.6543C222.86 48.5611 230.197 52.976 238.958 52.3585C244.884 51.9423 250.271 48.1192 251.788 42.4161H245.874L245.872 42.418ZM227.208 32.4381C227.778 26.2457 233.347 23.2018 239.163 24.4269C243.361 25.3107 245.75 28.9523 245.842 33.1068H227.145C227.145 33.1068 227.19 32.6255 227.208 32.4401V32.4381Z"
-        fill={color}
-      />
-      <path
-        d="M44.3223 2.9264C44.3223 0.754665 46.6083 -0.65811 48.5508 0.313121L80.4551 16.2653C82.9294 17.5024 84.4922 20.0321 84.4922 22.7985V48.2487C84.4922 50.4204 82.2071 51.833 80.2646 50.8619L62.3281 41.8932V22.7975C62.3281 20.0311 60.7653 17.5015 58.291 16.2643L44.3223 9.27992V2.9264ZM0 2.92543C8.01645e-05 0.753753 2.28609 -0.659069 4.22852 0.312144L22.1582 9.27699V28.3766C22.1582 31.1428 23.7213 33.6716 26.1953 34.9088L40.1699 41.8952V48.2487C40.1697 50.4202 37.8847 51.832 35.9424 50.861L4.03711 34.9088C1.56305 33.6716 0 31.1428 0 28.3766V2.92543ZM22.1582 2.92543C22.1583 0.753753 24.4443 -0.659069 26.3867 0.312144L44.3223 9.27992V28.3776C44.3223 31.1439 45.8861 33.6727 48.3604 34.9098L62.3281 41.8932V48.2487C62.3279 50.4202 60.0429 51.832 58.1006 50.861L40.1699 41.8952V22.7975C40.1699 20.0311 38.6071 17.5015 36.1328 16.2643L22.1582 9.27699V2.92543Z"
-        fill={color}
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_27_76">
-        <rect width="252" height="53" fill="white" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function PlaneLockup({ width = "253", height = "53", className, color = "currentColor" }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 253 53"
+      fill={color}
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g clipPath="url(#clip0_27_76)">
+        <path
+          d="M217.077 51.4468H210.972L210.98 31.4317C210.717 27.7545 208.786 25.1545 205.03 24.6199C198.587 23.7006 194.663 27.8828 194.21 34.0258L194.218 51.4468H188.041V20.2543H192.158L194.255 26.8846H194.6C195.825 22.8701 198.684 20.4831 202.898 19.5757C210.126 18.0231 216.643 22.2724 217.079 29.8239V51.4468H217.077Z"
+          fill={color}
+        />
+        <path
+          d="M163.812 19.7315C158.03 20.9566 153.67 25.2354 153.222 31.264H159.395C159.669 28.3484 161.561 25.9969 164.267 24.9553C167.418 23.7401 172.805 23.8881 175.178 26.6005C176.774 28.4253 177.305 31.5816 175.212 33.2249C172.675 35.2173 166.39 34.6117 163.214 34.7636C158.631 34.9826 154.141 36.8429 153.183 41.7727C151.1 52.5042 165.035 54.9267 171.902 49.8963C174.095 48.2885 175.672 45.8443 176.261 43.1792H176.577L178.788 51.4508H182.61V29.964C182.517 20.3214 171.462 18.108 163.81 19.7315H163.812ZM174.847 41.2637C172.484 45.649 166.958 49.0441 162.218 47.3318C158.44 45.9686 158.268 40.4095 161.973 38.9181C165.613 37.4524 173.732 38.9694 176.368 34.949C176.275 37.0855 175.906 39.2989 174.849 41.2637H174.847Z"
+          fill={color}
+        />
+        <path
+          d="M113.082 35.5652V51.4475H106.611V9.00063H124.863C125.007 8.99274 125.141 9.06178 125.283 9.06967C133.732 9.53129 139.297 13.601 139.104 22.6025C138.928 30.7991 132.663 35.2199 124.934 35.5671H113.082V35.5652ZM113.082 14.4828V30.2941H124.088C129.595 29.8956 133.071 27.1022 132.491 21.265C131.967 15.9781 127.802 14.6544 123.107 14.4788C119.795 14.3546 116.402 14.5795 113.082 14.4808V14.4828Z"
+          fill={color}
+        />
+        <path d="M148.647 9H142.529V51.4468H148.647V9Z" fill={color} />
+        <path
+          d="M245.872 42.418C244.911 44.4953 243.138 46.1603 240.934 46.8981C238.368 47.7562 234.479 47.5431 232.083 46.2569C228.67 44.4263 227.145 40.6485 227.137 36.8984H251.891C252.194 33.6908 251.902 30.3648 250.496 27.4333C247.083 20.3177 238.859 17.7236 231.513 19.9429C222.868 22.5568 220.165 31.4162 221.462 39.6543C222.86 48.5611 230.197 52.976 238.958 52.3585C244.884 51.9423 250.271 48.1192 251.788 42.4161H245.874L245.872 42.418ZM227.208 32.4381C227.778 26.2457 233.347 23.2018 239.163 24.4269C243.361 25.3107 245.75 28.9523 245.842 33.1068H227.145C227.145 33.1068 227.19 32.6255 227.208 32.4401V32.4381Z"
+          fill={color}
+        />
+        <path
+          d="M44.3223 2.9264C44.3223 0.754665 46.6083 -0.65811 48.5508 0.313121L80.4551 16.2653C82.9294 17.5024 84.4922 20.0321 84.4922 22.7985V48.2487C84.4922 50.4204 82.2071 51.833 80.2646 50.8619L62.3281 41.8932V22.7975C62.3281 20.0311 60.7653 17.5015 58.291 16.2643L44.3223 9.27992V2.9264ZM0 2.92543C8.01645e-05 0.753753 2.28609 -0.659069 4.22852 0.312144L22.1582 9.27699V28.3766C22.1582 31.1428 23.7213 33.6716 26.1953 34.9088L40.1699 41.8952V48.2487C40.1697 50.4202 37.8847 51.832 35.9424 50.861L4.03711 34.9088C1.56305 33.6716 0 31.1428 0 28.3766V2.92543ZM22.1582 2.92543C22.1583 0.753753 24.4443 -0.659069 26.3867 0.312144L44.3223 9.27992V28.3776C44.3223 31.1439 45.8861 33.6727 48.3604 34.9098L62.3281 41.8932V48.2487C62.3279 50.4202 60.0429 51.832 58.1006 50.861L40.1699 41.8952V22.7975C40.1699 20.0311 38.6071 17.5015 36.1328 16.2643L22.1582 9.27699V2.92543Z"
+          fill={color}
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_27_76">
+          <rect width="252" height="53" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/brand/plane-logo.tsx b/packages/propel/src/icons/brand/plane-logo.tsx
index 8f30d6ccf..92fc4d754 100644
--- a/packages/propel/src/icons/brand/plane-logo.tsx
+++ b/packages/propel/src/icons/brand/plane-logo.tsx
@@ -2,18 +2,20 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const PlaneLogo: React.FC<ISvgIcons> = ({ width = "85", height = "52", className, color = "currentColor" }) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 85 52"
-    fill={color}
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      d="M44.3223 2.9264C44.3223 0.754665 46.6083 -0.65811 48.5508 0.313121L80.4551 16.2653C82.9294 17.5024 84.4922 20.0321 84.4922 22.7985V48.2487C84.4922 50.4204 82.2071 51.833 80.2646 50.8619L62.3281 41.8932V22.7975C62.3281 20.0311 60.7653 17.5015 58.291 16.2643L44.3223 9.27992V2.9264ZM0 2.92543C8.01645e-05 0.753753 2.28609 -0.659069 4.22852 0.312144L22.1582 9.27699V28.3766C22.1582 31.1428 23.7213 33.6716 26.1953 34.9088L40.1699 41.8952V48.2487C40.1697 50.4202 37.8847 51.832 35.9424 50.861L4.03711 34.9088C1.56305 33.6716 0 31.1428 0 28.3766V2.92543ZM22.1582 2.92543C22.1583 0.753753 24.4443 -0.659069 26.3867 0.312144L44.3223 9.27992V28.3776C44.3223 31.1439 45.8861 33.6727 48.3604 34.9098L62.3281 41.8932V48.2487C62.3279 50.4202 60.0429 51.832 58.1006 50.861L40.1699 41.8952V22.7975C40.1699 20.0311 38.6071 17.5015 36.1328 16.2643L22.1582 9.27699V2.92543Z"
+export function PlaneLogo({ width = "85", height = "52", className, color = "currentColor" }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 85 52"
       fill={color}
-    />
-  </svg>
-);
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        d="M44.3223 2.9264C44.3223 0.754665 46.6083 -0.65811 48.5508 0.313121L80.4551 16.2653C82.9294 17.5024 84.4922 20.0321 84.4922 22.7985V48.2487C84.4922 50.4204 82.2071 51.833 80.2646 50.8619L62.3281 41.8932V22.7975C62.3281 20.0311 60.7653 17.5015 58.291 16.2643L44.3223 9.27992V2.9264ZM0 2.92543C8.01645e-05 0.753753 2.28609 -0.659069 4.22852 0.312144L22.1582 9.27699V28.3766C22.1582 31.1428 23.7213 33.6716 26.1953 34.9088L40.1699 41.8952V48.2487C40.1697 50.4202 37.8847 51.832 35.9424 50.861L4.03711 34.9088C1.56305 33.6716 0 31.1428 0 28.3766V2.92543ZM22.1582 2.92543C22.1583 0.753753 24.4443 -0.659069 26.3867 0.312144L44.3223 9.27992V28.3776C44.3223 31.1439 45.8861 33.6727 48.3604 34.9098L62.3281 41.8932V48.2487C62.3279 50.4202 60.0429 51.832 58.1006 50.861L40.1699 41.8952V22.7975C40.1699 20.0311 38.6071 17.5015 36.1328 16.2643L22.1582 9.27699V2.92543Z"
+        fill={color}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/brand/plane-wordmark.tsx b/packages/propel/src/icons/brand/plane-wordmark.tsx
index ad21468c4..47efad29c 100644
--- a/packages/propel/src/icons/brand/plane-wordmark.tsx
+++ b/packages/propel/src/icons/brand/plane-wordmark.tsx
@@ -2,36 +2,33 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const PlaneWordmark: React.FC<ISvgIcons> = ({
-  width = "146",
-  height = "44",
-  className,
-  color = "currentColor",
-}) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 146 44"
-    fill={color}
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      d="M111.077 42.4468H104.972L104.98 22.4317C104.717 18.7545 102.786 16.1545 99.03 15.6199C92.587 14.7006 88.663 18.8828 88.21 25.0258L88.218 42.4468H82.041V11.2543H86.158L88.255 17.8846H88.6C89.825 13.8701 92.684 11.4831 96.898 10.5757C104.126 9.0231 110.643 13.2724 111.079 20.8239V42.4468H111.077Z"
+export function PlaneWordmark({ width = "146", height = "44", className, color = "currentColor" }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 146 44"
       fill={color}
-    />
-    <path
-      d="M57.812 10.7315C52.03 11.9566 47.67 16.2354 47.222 22.264H53.395C53.669 19.3484 55.561 16.9969 58.267 15.9553C61.418 14.7401 66.805 14.8881 69.178 17.6005C70.774 19.4253 71.305 22.5816 69.212 24.2249C66.675 26.2173 60.39 25.6117 57.214 25.7636C52.631 25.9826 48.141 27.8429 47.183 32.7727C45.1 43.5042 59.035 45.9267 65.902 40.8963C68.095 39.2885 69.672 36.8443 70.261 34.1792H70.577L72.788 42.4508H76.61V20.964C76.517 11.3214 65.462 9.108 57.81 10.7315H57.812ZM68.847 32.2637C66.484 36.649 60.958 40.0441 56.218 38.3318C52.44 36.9686 52.268 31.4095 55.973 29.9181C59.613 28.4524 67.732 29.9694 70.368 25.949C70.275 28.0855 69.906 30.2989 68.849 32.2637H68.847Z"
-      fill={color}
-    />
-    <path
-      d="M7.08199 26.5652V42.4475H0.610992V0.000626947H18.863C19.007 -0.00726305 19.141 0.0617763 19.283 0.0696663C27.732 0.531286 33.297 4.601 33.104 13.6025C32.928 21.7991 26.663 26.2199 18.934 26.5671H7.08199V26.5652ZM7.08199 5.4828V21.2941H18.088C23.595 20.8956 27.071 18.1022 26.491 12.265C25.967 6.9781 21.802 5.6544 17.107 5.4788C13.795 5.3546 10.402 5.5795 7.08199 5.4808V5.4828Z"
-      fill={color}
-    />
-    <path d="M42.647 0H36.529V42.4468H42.647V0Z" fill={color} />
-    <path
-      d="M139.872 33.418C138.911 35.4953 137.138 37.1603 134.934 37.8981C132.368 38.7562 128.479 38.5431 126.083 37.2569C122.67 35.4263 121.145 31.6485 121.137 27.8984H145.891C146.194 24.6908 145.902 21.3648 144.496 18.4333C141.083 11.3177 132.859 8.7236 125.513 10.9429C116.868 13.5568 114.165 22.4162 115.462 30.6543C116.86 39.5611 124.197 43.976 132.958 43.3585C138.884 42.9423 144.271 39.1192 145.788 33.4161H139.874L139.872 33.418ZM121.208 23.4381C121.778 17.2457 127.347 14.2018 133.163 15.4269C137.361 16.3107 139.75 19.9523 139.842 24.1068H121.145C121.145 24.1068 121.19 23.6255 121.208 23.4401V23.4381Z"
-      fill={color}
-    />
-  </svg>
-);
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        d="M111.077 42.4468H104.972L104.98 22.4317C104.717 18.7545 102.786 16.1545 99.03 15.6199C92.587 14.7006 88.663 18.8828 88.21 25.0258L88.218 42.4468H82.041V11.2543H86.158L88.255 17.8846H88.6C89.825 13.8701 92.684 11.4831 96.898 10.5757C104.126 9.0231 110.643 13.2724 111.079 20.8239V42.4468H111.077Z"
+        fill={color}
+      />
+      <path
+        d="M57.812 10.7315C52.03 11.9566 47.67 16.2354 47.222 22.264H53.395C53.669 19.3484 55.561 16.9969 58.267 15.9553C61.418 14.7401 66.805 14.8881 69.178 17.6005C70.774 19.4253 71.305 22.5816 69.212 24.2249C66.675 26.2173 60.39 25.6117 57.214 25.7636C52.631 25.9826 48.141 27.8429 47.183 32.7727C45.1 43.5042 59.035 45.9267 65.902 40.8963C68.095 39.2885 69.672 36.8443 70.261 34.1792H70.577L72.788 42.4508H76.61V20.964C76.517 11.3214 65.462 9.108 57.81 10.7315H57.812ZM68.847 32.2637C66.484 36.649 60.958 40.0441 56.218 38.3318C52.44 36.9686 52.268 31.4095 55.973 29.9181C59.613 28.4524 67.732 29.9694 70.368 25.949C70.275 28.0855 69.906 30.2989 68.849 32.2637H68.847Z"
+        fill={color}
+      />
+      <path
+        d="M7.08199 26.5652V42.4475H0.610992V0.000626947H18.863C19.007 -0.00726305 19.141 0.0617763 19.283 0.0696663C27.732 0.531286 33.297 4.601 33.104 13.6025C32.928 21.7991 26.663 26.2199 18.934 26.5671H7.08199V26.5652ZM7.08199 5.4828V21.2941H18.088C23.595 20.8956 27.071 18.1022 26.491 12.265C25.967 6.9781 21.802 5.6544 17.107 5.4788C13.795 5.3546 10.402 5.5795 7.08199 5.4808V5.4828Z"
+        fill={color}
+      />
+      <path d="M42.647 0H36.529V42.4468H42.647V0Z" fill={color} />
+      <path
+        d="M139.872 33.418C138.911 35.4953 137.138 37.1603 134.934 37.8981C132.368 38.7562 128.479 38.5431 126.083 37.2569C122.67 35.4263 121.145 31.6485 121.137 27.8984H145.891C146.194 24.6908 145.902 21.3648 144.496 18.4333C141.083 11.3177 132.859 8.7236 125.513 10.9429C116.868 13.5568 114.165 22.4162 115.462 30.6543C116.86 39.5611 124.197 43.976 132.958 43.3585C138.884 42.9423 144.271 39.1192 145.788 33.4161H139.874L139.872 33.418ZM121.208 23.4381C121.778 17.2457 127.347 14.2018 133.163 15.4269C137.361 16.3107 139.75 19.9523 139.842 24.1068H121.145C121.145 24.1068 121.19 23.6255 121.208 23.4401V23.4381Z"
+        fill={color}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/brand/sony-logo.tsx b/packages/propel/src/icons/brand/sony-logo.tsx
index 088d3edce..7f93005f3 100644
--- a/packages/propel/src/icons/brand/sony-logo.tsx
+++ b/packages/propel/src/icons/brand/sony-logo.tsx
@@ -2,18 +2,20 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const SonyLogo: React.FC<ISvgIcons> = ({ width = "44", height = "16", className, color = "currentColor" }) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 44 16"
-    fill={color}
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      d="M16.1608 13.9C14.6192 13.9 13.1911 13.4366 12.2358 12.5854C11.5454 11.9706 11.1576 11.0816 11.1671 10.1548C11.1671 9.22789 11.5549 8.34832 12.2358 7.73357C13.1248 6.92966 14.6854 6.41894 16.1608 6.41894C17.7875 6.41894 19.0927 6.82562 20.0952 7.73357C20.7762 8.35778 21.1545 9.23735 21.1451 10.1548C21.1451 11.0722 20.7573 11.9517 20.0952 12.5854C19.1683 13.4461 17.7024 13.9 16.1608 13.9V12.9164C16.9742 12.9164 17.7402 12.6327 18.2699 12.1031C18.7995 11.5734 19.0359 10.9397 19.0359 10.1453C19.0359 9.35084 18.7711 8.6888 18.2699 8.18754C17.7497 7.67682 16.9742 7.38363 16.1608 7.38363C15.3474 7.38363 14.5719 7.66736 14.0517 8.18754C13.5505 8.6888 13.2857 9.39813 13.2857 10.1453C13.2668 10.8735 13.5505 11.5734 14.0517 12.1031C14.5719 12.6232 15.3474 12.9164 16.1608 12.9164V13.9ZM4.89665 6.40948C4.07382 6.40948 3.13749 6.56081 2.34304 6.9202C1.60534 7.25122 1 7.78086 1 8.66043C1 9.12386 1.17026 9.56837 1.49182 9.89939C1.70935 10.098 2.04987 10.429 2.94835 10.6276C3.35504 10.7128 4.20623 10.8452 5.06688 10.9397C5.92754 11.0343 6.75032 11.11 7.0908 11.2046C7.36507 11.2708 7.81906 11.3653 7.81906 11.8761C7.81906 12.3868 7.33675 12.5381 7.26109 12.5759C7.17597 12.6138 6.59901 12.8691 5.56811 12.8691C4.88715 12.8502 4.20619 12.7367 3.55361 12.5192C3.16584 12.3773 2.76863 12.1976 2.39032 11.7437C2.239 11.5261 2.15387 11.2708 2.14441 11.006H1.2081V13.6257H2.24843V13.2664C2.24843 13.1812 2.31467 13.115 2.39979 13.115C2.42816 13.115 2.45655 13.115 2.47547 13.1339C2.96727 13.3515 3.47797 13.5123 3.99815 13.6257C4.5467 13.7392 4.89662 13.8244 5.57758 13.8244C6.29637 13.8338 7.00569 13.7392 7.69611 13.5217C8.15008 13.3988 8.57569 13.1907 8.954 12.8975C9.3796 12.5665 9.63498 12.0558 9.62553 11.5167C9.62553 11.0154 9.43636 10.5236 9.08643 10.1642C8.88781 9.97506 8.66081 9.82373 8.41491 9.71024C8.15009 9.58729 7.87582 9.49271 7.59209 9.42651C7.05299 9.2941 5.84238 9.13332 5.26546 9.06711C4.66016 9.00091 3.60094 8.91579 3.1848 8.78338C3.06185 8.74555 2.797 8.6226 2.797 8.31995C2.797 8.10242 2.91994 7.92272 3.14693 7.7714C3.51578 7.53495 4.27242 7.39309 5.05741 7.39309C5.81403 7.39309 6.57062 7.53495 7.2705 7.82814C7.45965 7.91326 7.63935 8.0173 7.80013 8.14025C8.06495 8.36724 8.24469 8.66988 8.32035 9.01036H9.16205V6.73105H8.22574V6.99586C8.22574 7.08098 8.14066 7.19448 7.97042 7.0999C7.54482 6.88237 6.36255 6.40948 4.90606 6.40002L4.89665 6.40948ZM25.4389 6.83508L30.0164 10.9587L29.9691 8.17808C29.9691 7.80923 29.8935 7.65791 29.5057 7.65791H28.6451V6.82562H32.5606V7.65791H31.7188C31.3216 7.65791 31.2932 7.79031 31.2838 8.17808L31.35 13.4839H30.007L24.739 8.78338V12.122C24.739 12.4814 24.7579 12.6516 25.1362 12.6516H26.0725V13.4839H22.2327V12.6516H23.1312C23.4622 12.6516 23.4528 12.33 23.4528 12.1031V8.20646C23.4528 7.9511 23.4149 7.65791 22.8947 7.65791H22.1665V6.82562H25.4389V6.83508ZM37.0151 12.6516C37.0908 12.6516 37.1665 12.6516 37.2421 12.6327C37.3272 12.6043 37.3935 12.5476 37.4218 12.4719C37.4313 12.4152 37.4408 12.349 37.4408 12.2922V10.9776C37.4408 10.9776 37.4408 10.9303 37.384 10.8641C37.3273 10.7979 34.9912 8.14025 34.8777 8.02676C34.7453 7.88489 34.5089 7.65791 34.1589 7.65791H33.3455V6.82562H37.9326V7.65791H37.384C37.2611 7.65791 37.176 7.78086 37.28 7.91326C37.28 7.91326 38.8216 9.75753 38.8405 9.77644C38.8594 9.79536 38.8689 9.80482 38.8878 9.77644C38.9067 9.74807 40.4673 7.92272 40.4767 7.90381C40.5335 7.8376 40.5145 7.73357 40.4483 7.67682C40.4199 7.65791 40.3821 7.63899 40.3443 7.64845H39.7768V6.81617H43.5316V7.64845H42.6898C42.3872 7.64845 42.2642 7.70519 42.0277 7.96055L39.4931 10.8452C39.4931 10.8452 39.4553 10.9208 39.4647 10.9681V12.2827C39.4647 12.3395 39.4647 12.4057 39.4836 12.4624C39.5214 12.5381 39.5782 12.5949 39.6633 12.6232C39.739 12.6327 39.8147 12.6421 39.8903 12.6421H40.751V13.4744H36.1923V12.6421H37.0057L37.0151 12.6516Z"
+export function SonyLogo({ width = "44", height = "16", className, color = "currentColor" }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 44 16"
       fill={color}
-    />
-  </svg>
-);
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        d="M16.1608 13.9C14.6192 13.9 13.1911 13.4366 12.2358 12.5854C11.5454 11.9706 11.1576 11.0816 11.1671 10.1548C11.1671 9.22789 11.5549 8.34832 12.2358 7.73357C13.1248 6.92966 14.6854 6.41894 16.1608 6.41894C17.7875 6.41894 19.0927 6.82562 20.0952 7.73357C20.7762 8.35778 21.1545 9.23735 21.1451 10.1548C21.1451 11.0722 20.7573 11.9517 20.0952 12.5854C19.1683 13.4461 17.7024 13.9 16.1608 13.9V12.9164C16.9742 12.9164 17.7402 12.6327 18.2699 12.1031C18.7995 11.5734 19.0359 10.9397 19.0359 10.1453C19.0359 9.35084 18.7711 8.6888 18.2699 8.18754C17.7497 7.67682 16.9742 7.38363 16.1608 7.38363C15.3474 7.38363 14.5719 7.66736 14.0517 8.18754C13.5505 8.6888 13.2857 9.39813 13.2857 10.1453C13.2668 10.8735 13.5505 11.5734 14.0517 12.1031C14.5719 12.6232 15.3474 12.9164 16.1608 12.9164V13.9ZM4.89665 6.40948C4.07382 6.40948 3.13749 6.56081 2.34304 6.9202C1.60534 7.25122 1 7.78086 1 8.66043C1 9.12386 1.17026 9.56837 1.49182 9.89939C1.70935 10.098 2.04987 10.429 2.94835 10.6276C3.35504 10.7128 4.20623 10.8452 5.06688 10.9397C5.92754 11.0343 6.75032 11.11 7.0908 11.2046C7.36507 11.2708 7.81906 11.3653 7.81906 11.8761C7.81906 12.3868 7.33675 12.5381 7.26109 12.5759C7.17597 12.6138 6.59901 12.8691 5.56811 12.8691C4.88715 12.8502 4.20619 12.7367 3.55361 12.5192C3.16584 12.3773 2.76863 12.1976 2.39032 11.7437C2.239 11.5261 2.15387 11.2708 2.14441 11.006H1.2081V13.6257H2.24843V13.2664C2.24843 13.1812 2.31467 13.115 2.39979 13.115C2.42816 13.115 2.45655 13.115 2.47547 13.1339C2.96727 13.3515 3.47797 13.5123 3.99815 13.6257C4.5467 13.7392 4.89662 13.8244 5.57758 13.8244C6.29637 13.8338 7.00569 13.7392 7.69611 13.5217C8.15008 13.3988 8.57569 13.1907 8.954 12.8975C9.3796 12.5665 9.63498 12.0558 9.62553 11.5167C9.62553 11.0154 9.43636 10.5236 9.08643 10.1642C8.88781 9.97506 8.66081 9.82373 8.41491 9.71024C8.15009 9.58729 7.87582 9.49271 7.59209 9.42651C7.05299 9.2941 5.84238 9.13332 5.26546 9.06711C4.66016 9.00091 3.60094 8.91579 3.1848 8.78338C3.06185 8.74555 2.797 8.6226 2.797 8.31995C2.797 8.10242 2.91994 7.92272 3.14693 7.7714C3.51578 7.53495 4.27242 7.39309 5.05741 7.39309C5.81403 7.39309 6.57062 7.53495 7.2705 7.82814C7.45965 7.91326 7.63935 8.0173 7.80013 8.14025C8.06495 8.36724 8.24469 8.66988 8.32035 9.01036H9.16205V6.73105H8.22574V6.99586C8.22574 7.08098 8.14066 7.19448 7.97042 7.0999C7.54482 6.88237 6.36255 6.40948 4.90606 6.40002L4.89665 6.40948ZM25.4389 6.83508L30.0164 10.9587L29.9691 8.17808C29.9691 7.80923 29.8935 7.65791 29.5057 7.65791H28.6451V6.82562H32.5606V7.65791H31.7188C31.3216 7.65791 31.2932 7.79031 31.2838 8.17808L31.35 13.4839H30.007L24.739 8.78338V12.122C24.739 12.4814 24.7579 12.6516 25.1362 12.6516H26.0725V13.4839H22.2327V12.6516H23.1312C23.4622 12.6516 23.4528 12.33 23.4528 12.1031V8.20646C23.4528 7.9511 23.4149 7.65791 22.8947 7.65791H22.1665V6.82562H25.4389V6.83508ZM37.0151 12.6516C37.0908 12.6516 37.1665 12.6516 37.2421 12.6327C37.3272 12.6043 37.3935 12.5476 37.4218 12.4719C37.4313 12.4152 37.4408 12.349 37.4408 12.2922V10.9776C37.4408 10.9776 37.4408 10.9303 37.384 10.8641C37.3273 10.7979 34.9912 8.14025 34.8777 8.02676C34.7453 7.88489 34.5089 7.65791 34.1589 7.65791H33.3455V6.82562H37.9326V7.65791H37.384C37.2611 7.65791 37.176 7.78086 37.28 7.91326C37.28 7.91326 38.8216 9.75753 38.8405 9.77644C38.8594 9.79536 38.8689 9.80482 38.8878 9.77644C38.9067 9.74807 40.4673 7.92272 40.4767 7.90381C40.5335 7.8376 40.5145 7.73357 40.4483 7.67682C40.4199 7.65791 40.3821 7.63899 40.3443 7.64845H39.7768V6.81617H43.5316V7.64845H42.6898C42.3872 7.64845 42.2642 7.70519 42.0277 7.96055L39.4931 10.8452C39.4931 10.8452 39.4553 10.9208 39.4647 10.9681V12.2827C39.4647 12.3395 39.4647 12.4057 39.4836 12.4624C39.5214 12.5381 39.5782 12.5949 39.6633 12.6232C39.739 12.6327 39.8147 12.6421 39.8903 12.6421H40.751V13.4744H36.1923V12.6421H37.0057L37.0151 12.6516Z"
+        fill={color}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/brand/zerodha-logo.tsx b/packages/propel/src/icons/brand/zerodha-logo.tsx
index d9fa9e8bc..9f407f8bf 100644
--- a/packages/propel/src/icons/brand/zerodha-logo.tsx
+++ b/packages/propel/src/icons/brand/zerodha-logo.tsx
@@ -2,29 +2,26 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const ZerodhaLogo: React.FC<ISvgIcons> = ({
-  width = "64",
-  height = "16",
-  className,
-  color = "currentColor",
-}) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 64 16"
-    fill={color}
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M7.46267 8.1456C7.92616 8.74901 8.31095 9.42239 8.60828 10.157V6.29163H5.32886C6.11592 6.72014 6.84177 7.34104 7.46267 8.1456ZM2.7403 6.70265C2.13689 6.70265 1.55094 6.83382 1 7.06994V13.8999H8.27596C8.22349 9.91211 5.75737 6.6939 2.73155 6.6939"
+export function ZerodhaLogo({ width = "64", height = "16", className, color = "currentColor" }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 64 16"
       fill={color}
-    />
-    <path
-      d="M12.9634 12.7281L17.0299 7.80457H13.0858V6.72892H18.604V7.62093L14.5375 12.5444H18.604V13.6201H12.9634V12.7281ZM20.1257 6.72892H25.2241V7.82206H21.3237V9.59733H24.778V10.6905H21.3237V12.5357H25.2765V13.6288H20.1257V6.73767V6.72892ZM26.7282 6.72892H29.7978C30.235 6.72892 30.6111 6.79014 30.9521 6.91257C31.2932 7.035 31.5643 7.20116 31.7917 7.41979C31.9753 7.61218 32.1152 7.83081 32.2114 8.07567C32.3076 8.32054 32.3601 8.60038 32.3601 8.90646V8.92395C32.3601 9.2038 32.3164 9.4574 32.2377 9.68478C32.1589 9.91215 32.0453 10.1133 31.8966 10.2882C31.7479 10.4631 31.5818 10.6118 31.3806 10.7342C31.1795 10.8566 30.9609 10.9528 30.716 11.014L32.5787 13.6201H31.1533L29.4567 11.2152H27.9351V13.6201H26.737V6.72892H26.7282ZM29.7016 10.1483C30.1388 10.1483 30.4799 10.0433 30.7422 9.83345C31.0046 9.62356 31.127 9.34372 31.127 8.98517V8.96768C31.127 8.59164 31.0046 8.30305 30.751 8.11065C30.4974 7.91826 30.1476 7.82206 29.6928 7.82206H27.9263V10.1483H29.7016ZM37.1349 13.7425C36.6015 13.7425 36.1205 13.6463 35.6745 13.4627C35.2285 13.279 34.8612 13.0254 34.5376 12.7019C34.2141 12.3783 33.9779 12.0022 33.803 11.5737C33.6281 11.1452 33.5407 10.6817 33.5407 10.2007V10.1833C33.5407 9.69352 33.6281 9.23878 33.803 8.81026C33.9779 8.38175 34.2316 8.00571 34.5551 7.6734C34.8787 7.34108 35.2547 7.08747 35.7007 6.90382C36.1467 6.72018 36.6277 6.61523 37.1612 6.61523C37.6946 6.61523 38.1756 6.71143 38.6216 6.89508C39.0589 7.07873 39.4349 7.34108 39.7585 7.65591C40.082 7.97073 40.3182 8.35552 40.4931 8.78403C40.668 9.21254 40.7554 9.67603 40.7554 10.157V10.1745C40.7554 10.6642 40.668 11.119 40.4931 11.5475C40.3182 11.976 40.0646 12.352 39.741 12.6844C39.4174 13.0079 39.0414 13.2703 38.5954 13.4539C38.1494 13.6376 37.6684 13.7425 37.1349 13.7425ZM37.1524 12.6319C37.4935 12.6319 37.8083 12.5707 38.0882 12.4395C38.368 12.3083 38.6129 12.1334 38.8227 11.9148C39.0326 11.6962 39.1813 11.4338 39.295 11.1452C39.4087 10.8566 39.4699 10.5331 39.4699 10.2007V10.1833C39.4699 9.85094 39.4087 9.52737 39.295 9.23003C39.1813 8.9327 39.0239 8.67034 38.814 8.45171C38.6041 8.23309 38.3593 8.05818 38.0707 7.92701C37.7821 7.79583 37.4672 7.72587 37.1262 7.72587C36.7851 7.72587 36.4703 7.78708 36.1905 7.91826C35.9106 8.04944 35.6658 8.22434 35.4559 8.44297C35.246 8.6616 35.0973 8.92395 34.9836 9.21254C34.87 9.50113 34.8087 9.8247 34.8087 10.157V10.1745C34.8087 10.5068 34.87 10.8304 34.9836 11.1277C35.0973 11.4251 35.2547 11.6874 35.4646 11.906C35.6745 12.1247 35.9194 12.2996 36.208 12.4308C36.4965 12.5619 36.8114 12.6319 37.1524 12.6319ZM42.2159 6.72892H44.7869C45.3291 6.72892 45.8189 6.81637 46.2736 6.99128C46.7284 7.16618 47.1131 7.4023 47.4367 7.71712C47.7603 8.03195 48.0139 8.3905 48.1888 8.80152C48.3637 9.21254 48.4511 9.66729 48.4511 10.157V10.1745C48.4511 10.6642 48.3637 11.1102 48.1888 11.53C48.0139 11.9498 47.7603 12.3171 47.4367 12.6231C47.1131 12.9292 46.7284 13.1741 46.2736 13.349C45.8189 13.5239 45.3291 13.6113 44.7869 13.6113H42.2159V6.72018V6.72892ZM44.7782 12.5357C45.1367 12.5357 45.469 12.4745 45.7664 12.3608C46.0637 12.2471 46.3173 12.0809 46.5185 11.8798C46.7196 11.6787 46.8858 11.4251 46.9995 11.1365C47.1131 10.8479 47.1744 10.5418 47.1744 10.2007V10.1833C47.1744 9.85094 47.1131 9.53611 46.9995 9.24752C46.8858 8.95893 46.7196 8.70532 46.5185 8.50418C46.3173 8.30305 46.0637 8.13689 45.7664 8.01446C45.469 7.89202 45.1455 7.83955 44.7782 7.83955H43.4227V12.5444H44.7782V12.5357ZM49.9203 6.72892H51.1184V9.59733H54.4241V6.72892H55.6222V13.6201H54.4241V10.7167H51.1184V13.6201H49.9203V6.72892ZM59.8461 6.6852H60.9654L64 13.6288H62.7232L62.0236 11.9673H58.7617L58.0533 13.6288H56.8115L59.8461 6.6852ZM61.5776 10.8916L60.3883 8.13689L59.2077 10.8916H61.5776Z"
-      fill={color}
-    />
-  </svg>
-);
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M7.46267 8.1456C7.92616 8.74901 8.31095 9.42239 8.60828 10.157V6.29163H5.32886C6.11592 6.72014 6.84177 7.34104 7.46267 8.1456ZM2.7403 6.70265C2.13689 6.70265 1.55094 6.83382 1 7.06994V13.8999H8.27596C8.22349 9.91211 5.75737 6.6939 2.73155 6.6939"
+        fill={color}
+      />
+      <path
+        d="M12.9634 12.7281L17.0299 7.80457H13.0858V6.72892H18.604V7.62093L14.5375 12.5444H18.604V13.6201H12.9634V12.7281ZM20.1257 6.72892H25.2241V7.82206H21.3237V9.59733H24.778V10.6905H21.3237V12.5357H25.2765V13.6288H20.1257V6.73767V6.72892ZM26.7282 6.72892H29.7978C30.235 6.72892 30.6111 6.79014 30.9521 6.91257C31.2932 7.035 31.5643 7.20116 31.7917 7.41979C31.9753 7.61218 32.1152 7.83081 32.2114 8.07567C32.3076 8.32054 32.3601 8.60038 32.3601 8.90646V8.92395C32.3601 9.2038 32.3164 9.4574 32.2377 9.68478C32.1589 9.91215 32.0453 10.1133 31.8966 10.2882C31.7479 10.4631 31.5818 10.6118 31.3806 10.7342C31.1795 10.8566 30.9609 10.9528 30.716 11.014L32.5787 13.6201H31.1533L29.4567 11.2152H27.9351V13.6201H26.737V6.72892H26.7282ZM29.7016 10.1483C30.1388 10.1483 30.4799 10.0433 30.7422 9.83345C31.0046 9.62356 31.127 9.34372 31.127 8.98517V8.96768C31.127 8.59164 31.0046 8.30305 30.751 8.11065C30.4974 7.91826 30.1476 7.82206 29.6928 7.82206H27.9263V10.1483H29.7016ZM37.1349 13.7425C36.6015 13.7425 36.1205 13.6463 35.6745 13.4627C35.2285 13.279 34.8612 13.0254 34.5376 12.7019C34.2141 12.3783 33.9779 12.0022 33.803 11.5737C33.6281 11.1452 33.5407 10.6817 33.5407 10.2007V10.1833C33.5407 9.69352 33.6281 9.23878 33.803 8.81026C33.9779 8.38175 34.2316 8.00571 34.5551 7.6734C34.8787 7.34108 35.2547 7.08747 35.7007 6.90382C36.1467 6.72018 36.6277 6.61523 37.1612 6.61523C37.6946 6.61523 38.1756 6.71143 38.6216 6.89508C39.0589 7.07873 39.4349 7.34108 39.7585 7.65591C40.082 7.97073 40.3182 8.35552 40.4931 8.78403C40.668 9.21254 40.7554 9.67603 40.7554 10.157V10.1745C40.7554 10.6642 40.668 11.119 40.4931 11.5475C40.3182 11.976 40.0646 12.352 39.741 12.6844C39.4174 13.0079 39.0414 13.2703 38.5954 13.4539C38.1494 13.6376 37.6684 13.7425 37.1349 13.7425ZM37.1524 12.6319C37.4935 12.6319 37.8083 12.5707 38.0882 12.4395C38.368 12.3083 38.6129 12.1334 38.8227 11.9148C39.0326 11.6962 39.1813 11.4338 39.295 11.1452C39.4087 10.8566 39.4699 10.5331 39.4699 10.2007V10.1833C39.4699 9.85094 39.4087 9.52737 39.295 9.23003C39.1813 8.9327 39.0239 8.67034 38.814 8.45171C38.6041 8.23309 38.3593 8.05818 38.0707 7.92701C37.7821 7.79583 37.4672 7.72587 37.1262 7.72587C36.7851 7.72587 36.4703 7.78708 36.1905 7.91826C35.9106 8.04944 35.6658 8.22434 35.4559 8.44297C35.246 8.6616 35.0973 8.92395 34.9836 9.21254C34.87 9.50113 34.8087 9.8247 34.8087 10.157V10.1745C34.8087 10.5068 34.87 10.8304 34.9836 11.1277C35.0973 11.4251 35.2547 11.6874 35.4646 11.906C35.6745 12.1247 35.9194 12.2996 36.208 12.4308C36.4965 12.5619 36.8114 12.6319 37.1524 12.6319ZM42.2159 6.72892H44.7869C45.3291 6.72892 45.8189 6.81637 46.2736 6.99128C46.7284 7.16618 47.1131 7.4023 47.4367 7.71712C47.7603 8.03195 48.0139 8.3905 48.1888 8.80152C48.3637 9.21254 48.4511 9.66729 48.4511 10.157V10.1745C48.4511 10.6642 48.3637 11.1102 48.1888 11.53C48.0139 11.9498 47.7603 12.3171 47.4367 12.6231C47.1131 12.9292 46.7284 13.1741 46.2736 13.349C45.8189 13.5239 45.3291 13.6113 44.7869 13.6113H42.2159V6.72018V6.72892ZM44.7782 12.5357C45.1367 12.5357 45.469 12.4745 45.7664 12.3608C46.0637 12.2471 46.3173 12.0809 46.5185 11.8798C46.7196 11.6787 46.8858 11.4251 46.9995 11.1365C47.1131 10.8479 47.1744 10.5418 47.1744 10.2007V10.1833C47.1744 9.85094 47.1131 9.53611 46.9995 9.24752C46.8858 8.95893 46.7196 8.70532 46.5185 8.50418C46.3173 8.30305 46.0637 8.13689 45.7664 8.01446C45.469 7.89202 45.1455 7.83955 44.7782 7.83955H43.4227V12.5444H44.7782V12.5357ZM49.9203 6.72892H51.1184V9.59733H54.4241V6.72892H55.6222V13.6201H54.4241V10.7167H51.1184V13.6201H49.9203V6.72892ZM59.8461 6.6852H60.9654L64 13.6288H62.7232L62.0236 11.9673H58.7617L58.0533 13.6288H56.8115L59.8461 6.6852ZM61.5776 10.8916L60.3883 8.13689L59.2077 10.8916H61.5776Z"
+        fill={color}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/calendar-after-icon.tsx b/packages/propel/src/icons/calendar-after-icon.tsx
index 2e9e7a386..3cb03c116 100644
--- a/packages/propel/src/icons/calendar-after-icon.tsx
+++ b/packages/propel/src/icons/calendar-after-icon.tsx
@@ -2,18 +2,20 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const CalendarAfterIcon: React.FC<ISvgIcons> = ({ className = "fill-current", ...rest }) => (
-  <svg viewBox="0 0 24 24" className={`${className} `} fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
-    <g clipPath="url(#clip0_3309_70901)">
-      <path
-        d="M10.6125 17V15.875H14.625V7.8125H3.375V11.9375H2.25V4.25C2.25 3.95 2.3625 3.6875 2.5875 3.4625C2.8125 3.2375 3.075 3.125 3.375 3.125H4.59375V2H5.8125V3.125H12.1875V2H13.4063V3.125H14.625C14.925 3.125 15.1875 3.2375 15.4125 3.4625C15.6375 3.6875 15.75 3.95 15.75 4.25V15.875C15.75 16.175 15.6375 16.4375 15.4125 16.6625C15.1875 16.8875 14.925 17 14.625 17H10.6125ZM6 18.2375L5.2125 17.45L7.33125 15.3125H0.9375V14.1875H7.33125L5.2125 12.05L6 11.2625L9.4875 14.75L6 18.2375ZM3.375 6.6875H14.625V4.25H3.375V6.6875Z"
-        fill="rgb(var(--color-text-200))"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_3309_70901">
-        <rect width="18" height="18" fill="white" transform="translate(0 0.5)" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function CalendarAfterIcon({ className = "fill-current", ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 24 24" className={`${className} `} fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
+      <g clipPath="url(#clip0_3309_70901)">
+        <path
+          d="M10.6125 17V15.875H14.625V7.8125H3.375V11.9375H2.25V4.25C2.25 3.95 2.3625 3.6875 2.5875 3.4625C2.8125 3.2375 3.075 3.125 3.375 3.125H4.59375V2H5.8125V3.125H12.1875V2H13.4063V3.125H14.625C14.925 3.125 15.1875 3.2375 15.4125 3.4625C15.6375 3.6875 15.75 3.95 15.75 4.25V15.875C15.75 16.175 15.6375 16.4375 15.4125 16.6625C15.1875 16.8875 14.925 17 14.625 17H10.6125ZM6 18.2375L5.2125 17.45L7.33125 15.3125H0.9375V14.1875H7.33125L5.2125 12.05L6 11.2625L9.4875 14.75L6 18.2375ZM3.375 6.6875H14.625V4.25H3.375V6.6875Z"
+          fill="rgb(var(--color-text-200))"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_3309_70901">
+          <rect width="18" height="18" fill="white" transform="translate(0 0.5)" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/calendar-before-icon.tsx b/packages/propel/src/icons/calendar-before-icon.tsx
index c7e2d2d84..d832ca9ad 100644
--- a/packages/propel/src/icons/calendar-before-icon.tsx
+++ b/packages/propel/src/icons/calendar-before-icon.tsx
@@ -2,29 +2,31 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const CalendarBeforeIcon: React.FC<ISvgIcons> = ({ className = "fill-current", ...rest }) => (
-  <svg viewBox="0 0 24 24" className={`${className} `} fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
-    <g clipPath="url(#clip0_3309_70907)">
-      <path
-        d="M10.6125 16.5V15.375H14.625V7.3125H3.375V11.4375H2.25V3.75C2.25 3.45 2.3625 3.1875 2.5875 2.9625C2.8125 2.7375 3.075 2.625 3.375 2.625H4.59375V1.5H5.8125V2.625H12.1875V1.5H13.4062V2.625H14.625C14.925 2.625 15.1875 2.7375 15.4125 2.9625C15.6375 3.1875 15.75 3.45 15.75 3.75V15.375C15.75 15.675 15.6375 15.9375 15.4125 16.1625C15.1875 16.3875 14.925 16.5 14.625 16.5H10.6125ZM3.375 6.1875H14.625V3.75H3.375V6.1875Z"
-        fill="rgb(var(--color-text-200))"
-      />
-      <g clipPath="url(#clip1_3309_70907)">
+export function CalendarBeforeIcon({ className = "fill-current", ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 24 24" className={`${className} `} fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
+      <g clipPath="url(#clip0_3309_70907)">
         <path
-          d="M3.99967 17.1667L1.33301 14.5L3.99967 11.8334L4.34967 12.1834L2.28301 14.25H8V14.75H2.28301L4.34967 16.8167L3.99967 17.1667Z"
+          d="M10.6125 16.5V15.375H14.625V7.3125H3.375V11.4375H2.25V3.75C2.25 3.45 2.3625 3.1875 2.5875 2.9625C2.8125 2.7375 3.075 2.625 3.375 2.625H4.59375V1.5H5.8125V2.625H12.1875V1.5H13.4062V2.625H14.625C14.925 2.625 15.1875 2.7375 15.4125 2.9625C15.6375 3.1875 15.75 3.45 15.75 3.75V15.375C15.75 15.675 15.6375 15.9375 15.4125 16.1625C15.1875 16.3875 14.925 16.5 14.625 16.5H10.6125ZM3.375 6.1875H14.625V3.75H3.375V6.1875Z"
           fill="rgb(var(--color-text-200))"
-          stroke="rgb(var(--color-text-200))"
-          strokeWidth="0.5"
         />
+        <g clipPath="url(#clip1_3309_70907)">
+          <path
+            d="M3.99967 17.1667L1.33301 14.5L3.99967 11.8334L4.34967 12.1834L2.28301 14.25H8V14.75H2.28301L4.34967 16.8167L3.99967 17.1667Z"
+            fill="rgb(var(--color-text-200))"
+            stroke="rgb(var(--color-text-200))"
+            strokeWidth="0.5"
+          />
+        </g>
       </g>
-    </g>
-    <defs>
-      <clipPath id="clip0_3309_70907">
-        <rect width="18" height="18" fill="white" />
-      </clipPath>
-      <clipPath id="clip1_3309_70907">
-        <rect width="8" height="8" fill="white" transform="translate(0 10.5)" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+      <defs>
+        <clipPath id="clip0_3309_70907">
+          <rect width="18" height="18" fill="white" />
+        </clipPath>
+        <clipPath id="clip1_3309_70907">
+          <rect width="8" height="8" fill="white" transform="translate(0 10.5)" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/center-panel-icon.tsx b/packages/propel/src/icons/center-panel-icon.tsx
index 78b95acc8..c8d6c8a44 100644
--- a/packages/propel/src/icons/center-panel-icon.tsx
+++ b/packages/propel/src/icons/center-panel-icon.tsx
@@ -2,29 +2,31 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const CenterPanelIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      d="M19 3H5C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3Z"
+export function CenterPanelIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
       stroke="currentColor"
-      strokeWidth="2"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M15.1111 8.00009H8.8001C8.33334 8.00007 8.00003 8.0001 8.00012 8.88897V15.1111C8.00012 16 8.00012 16 8.8001 16H15.1111C16 16 16 16 16 15.1111V8.88897C16 8.00009 16 8.00009 15.1111 8.00009H15.1111Z"
-      fill="currentColor"
-      stroke="currentColor"
-      strokeWidth="2"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        d="M19 3H5C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3Z"
+        stroke="currentColor"
+        strokeWidth="2"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M15.1111 8.00009H8.8001C8.33334 8.00007 8.00003 8.0001 8.00012 8.88897V15.1111C8.00012 16 8.00012 16 8.8001 16H15.1111C16 16 16 16 16 15.1111V8.88897C16 8.00009 16 8.00009 15.1111 8.00009H15.1111Z"
+        fill="currentColor"
+        stroke="currentColor"
+        strokeWidth="2"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/comment-fill-icon.tsx b/packages/propel/src/icons/comment-fill-icon.tsx
index 0a08d4527..806d114dd 100644
--- a/packages/propel/src/icons/comment-fill-icon.tsx
+++ b/packages/propel/src/icons/comment-fill-icon.tsx
@@ -2,13 +2,15 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const CommentFillIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg viewBox="0 0 24 24" className={`${className}`} xmlns="http://www.w3.org/2000/svg" {...rest}>
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M4.848 2.771C7.21613 2.4234 9.60649 2.24927 12 2.25C14.43 2.25 16.817 2.428 19.152 2.77C21.13 3.062 22.5 4.794 22.5 6.74V12.76C22.5 14.706 21.13 16.438 19.152 16.73C17.212 17.014 15.236 17.185 13.23 17.235C13.1303 17.2369 13.0351 17.277 12.964 17.347L8.78 21.53C8.67511 21.6348 8.54153 21.7061 8.39614 21.735C8.25074 21.7638 8.10004 21.749 7.96308 21.6923C7.82611 21.6356 7.70903 21.5395 7.62661 21.4163C7.54419 21.2931 7.50013 21.1482 7.5 21V17.045C6.61329 16.9639 5.72895 16.8585 4.848 16.729C2.87 16.439 1.5 14.705 1.5 12.759V6.741C1.5 4.795 2.87 3.061 4.848 2.771Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function CommentFillIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 24 24" className={`${className}`} xmlns="http://www.w3.org/2000/svg" {...rest}>
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M4.848 2.771C7.21613 2.4234 9.60649 2.24927 12 2.25C14.43 2.25 16.817 2.428 19.152 2.77C21.13 3.062 22.5 4.794 22.5 6.74V12.76C22.5 14.706 21.13 16.438 19.152 16.73C17.212 17.014 15.236 17.185 13.23 17.235C13.1303 17.2369 13.0351 17.277 12.964 17.347L8.78 21.53C8.67511 21.6348 8.54153 21.7061 8.39614 21.735C8.25074 21.7638 8.10004 21.749 7.96308 21.6923C7.82611 21.6356 7.70903 21.5395 7.62661 21.4163C7.54419 21.2931 7.50013 21.1482 7.5 21V17.045C6.61329 16.9639 5.72895 16.8585 4.848 16.729C2.87 16.439 1.5 14.705 1.5 12.759V6.741C1.5 4.795 2.87 3.061 4.848 2.771Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/create-icon.tsx b/packages/propel/src/icons/create-icon.tsx
index a0b3f342a..7c69d2b47 100644
--- a/packages/propel/src/icons/create-icon.tsx
+++ b/packages/propel/src/icons/create-icon.tsx
@@ -2,21 +2,23 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const CreateIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      d="M21 12V19C21 19.5304 20.7893 20.0391 20.4142 20.4142C20.0391 20.7893 19.5304 21 19 21H5C4.46957 21 3.96086 20.7893 3.58579 20.4142C3.21071 20.0391 3 19.5304 3 19V5C3 4.46957 3.21071 3.96086 3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3H12"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path d="M16 5H22" strokeLinecap="round" strokeLinejoin="round" />
-    <path d="M19 2V8" strokeLinecap="round" strokeLinejoin="round" />
-  </svg>
-);
+export function CreateIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        d="M21 12V19C21 19.5304 20.7893 20.0391 20.4142 20.4142C20.0391 20.7893 19.5304 21 19 21H5C4.46957 21 3.96086 20.7893 3.58579 20.4142C3.21071 20.0391 3 19.5304 3 19V5C3 4.46957 3.21071 3.96086 3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3H12"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path d="M16 5H22" strokeLinecap="round" strokeLinejoin="round" />
+      <path d="M19 2V8" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/cycle/circle-dot-full-icon.tsx b/packages/propel/src/icons/cycle/circle-dot-full-icon.tsx
index 4bea715f3..021d385aa 100644
--- a/packages/propel/src/icons/cycle/circle-dot-full-icon.tsx
+++ b/packages/propel/src/icons/cycle/circle-dot-full-icon.tsx
@@ -2,9 +2,17 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const CircleDotFullIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg viewBox="0 0 24 24" className={`${className} stroke-1`} fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
-    <circle cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="2" strokeLinecap="round" />
-    <circle cx="12" cy="12" r="6.25" fill="currentColor" strokeWidth="0.5" />
-  </svg>
-);
+export function CircleDotFullIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-1`}
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <circle cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="2" strokeLinecap="round" />
+      <circle cx="12" cy="12" r="6.25" fill="currentColor" strokeWidth="0.5" />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/cycle/contrast-icon.tsx b/packages/propel/src/icons/cycle/contrast-icon.tsx
index d9cd16e15..b7e46a11c 100644
--- a/packages/propel/src/icons/cycle/contrast-icon.tsx
+++ b/packages/propel/src/icons/cycle/contrast-icon.tsx
@@ -2,25 +2,27 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const ContrastIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M12 18C13.5913 18 15.1174 17.3679 16.2426 16.2426C17.3679 15.1174 18 13.5913 18 12C18 10.4087 17.3679 8.88258 16.2426 7.75736C15.1174 6.63214 13.5913 6 12 6V18Z"
-      fill="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+export function ContrastIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M12 18C13.5913 18 15.1174 17.3679 16.2426 16.2426C17.3679 15.1174 18 13.5913 18 12C18 10.4087 17.3679 8.88258 16.2426 7.75736C15.1174 6.63214 13.5913 6 12 6V18Z"
+        fill="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/cycle/cycle-group-icon.tsx b/packages/propel/src/icons/cycle/cycle-group-icon.tsx
index 074cfebd6..0d5dd3aa5 100644
--- a/packages/propel/src/icons/cycle/cycle-group-icon.tsx
+++ b/packages/propel/src/icons/cycle/cycle-group-icon.tsx
@@ -13,13 +13,13 @@ const iconComponents = {
   draft: Circle,
 };
 
-export const CycleGroupIcon: React.FC<ICycleGroupIcon> = ({
+export function CycleGroupIcon({
   className = "",
   color,
   cycleGroup,
   height = "12px",
   width = "12px",
-}) => {
+}: ICycleGroupIcon) {
   const CycleIconComponent = iconComponents[cycleGroup] || CycleIcon;
 
   return (
@@ -30,4 +30,4 @@ export const CycleGroupIcon: React.FC<ICycleGroupIcon> = ({
       className={`flex-shrink-0 ${className}`}
     />
   );
-};
+}
diff --git a/packages/propel/src/icons/cycle/double-circle-icon.tsx b/packages/propel/src/icons/cycle/double-circle-icon.tsx
index 0100e941b..5f7e7a4d3 100644
--- a/packages/propel/src/icons/cycle/double-circle-icon.tsx
+++ b/packages/propel/src/icons/cycle/double-circle-icon.tsx
@@ -2,16 +2,18 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const DoubleCircleIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <circle cx="12" cy="12" r="9" />
-    <circle cx="12" cy="12" r="5.625" />
-  </svg>
-);
+export function DoubleCircleIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <circle cx="12" cy="12" r="9" />
+      <circle cx="12" cy="12" r="5.625" />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/default-icon.tsx b/packages/propel/src/icons/default-icon.tsx
index 6be674fda..12fd0be2e 100644
--- a/packages/propel/src/icons/default-icon.tsx
+++ b/packages/propel/src/icons/default-icon.tsx
@@ -3,8 +3,10 @@ import * as React from "react";
 import { IconWrapper } from "./icon-wrapper";
 import type { ISvgIcons } from "./type";
 
-export const DefaultIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <rect x="4" y="4" width="8" height="8" rx="1" fill={color} />
-  </IconWrapper>
-);
+export function DefaultIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <rect x="4" y="4" width="8" height="8" rx="1" fill={color} />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/dice-icon.tsx b/packages/propel/src/icons/dice-icon.tsx
index d298eaf4a..5624006fd 100644
--- a/packages/propel/src/icons/dice-icon.tsx
+++ b/packages/propel/src/icons/dice-icon.tsx
@@ -2,43 +2,45 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const DiceIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      d="M19 3H5C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3Z"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M8.77778 7H7.22222C7.09949 7 7 7.09949 7 7.22222V8.77778C7 8.90051 7.09949 9 7.22222 9H8.77778C8.90051 9 9 8.90051 9 8.77778V7.22222C9 7.09949 8.90051 7 8.77778 7Z"
-      fill="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M8.77778 15H7.22222C7.09949 15 7 15.0995 7 15.2222V16.7778C7 16.9005 7.09949 17 7.22222 17H8.77778C8.90051 17 9 16.9005 9 16.7778V15.2222C9 15.0995 8.90051 15 8.77778 15Z"
-      fill="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M16.7778 7H15.2222C15.0995 7 15 7.09949 15 7.22222V8.77778C15 8.90051 15.0995 9 15.2222 9H16.7778C16.9005 9 17 8.90051 17 8.77778V7.22222C17 7.09949 16.9005 7 16.7778 7Z"
-      fill="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M16.7778 15H15.2222C15.0995 15 15 15.0995 15 15.2222V16.7778C15 16.9005 15.0995 17 15.2222 17H16.7778C16.9005 17 17 16.9005 17 16.7778V15.2222C17 15.0995 16.9005 15 16.7778 15Z"
-      fill="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+export function DiceIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        d="M19 3H5C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3Z"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M8.77778 7H7.22222C7.09949 7 7 7.09949 7 7.22222V8.77778C7 8.90051 7.09949 9 7.22222 9H8.77778C8.90051 9 9 8.90051 9 8.77778V7.22222C9 7.09949 8.90051 7 8.77778 7Z"
+        fill="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M8.77778 15H7.22222C7.09949 15 7 15.0995 7 15.2222V16.7778C7 16.9005 7.09949 17 7.22222 17H8.77778C8.90051 17 9 16.9005 9 16.7778V15.2222C9 15.0995 8.90051 15 8.77778 15Z"
+        fill="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M16.7778 7H15.2222C15.0995 7 15 7.09949 15 7.22222V8.77778C15 8.90051 15.0995 9 15.2222 9H16.7778C16.9005 9 17 8.90051 17 8.77778V7.22222C17 7.09949 16.9005 7 16.7778 7Z"
+        fill="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M16.7778 15H15.2222C15.0995 15 15 15.0995 15 15.2222V16.7778C15 16.9005 15.0995 17 15.2222 17H16.7778C16.9005 17 17 16.9005 17 16.7778V15.2222C17 15.0995 16.9005 15 16.7778 15Z"
+        fill="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/discord-icon.tsx b/packages/propel/src/icons/discord-icon.tsx
index 731ecf00a..452233a9e 100644
--- a/packages/propel/src/icons/discord-icon.tsx
+++ b/packages/propel/src/icons/discord-icon.tsx
@@ -2,31 +2,33 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const DiscordIcon: React.FC<ISvgIcons> = ({ width = "24", height = "24", className }) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 24 24"
-    fill="currentColor"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g clipPath="url(#clip0_4112_17440)">
-      <mask id="mask0_4112_17440" maskUnits="userSpaceOnUse" x="0" y="0" width={width} height={height}>
-        <path d="M24 0H0V24H24V0Z" fill="white" />
-      </mask>
-      <g mask="url(#mask0_4112_17440)">
-        <path
-          d="M18.9312 5.63864C17.6346 5.0435 16.2662 4.61913 14.8604 4.37614C14.8476 4.37364 14.8343 4.37528 14.8225 4.38082C14.8106 4.38636 14.8009 4.39552 14.7946 4.40697C14.6196 4.71947 14.4246 5.12697 14.2879 5.44864C12.7724 5.21846 11.2309 5.21846 9.7154 5.44864C9.5633 5.09222 9.39165 4.74447 9.20123 4.40697C9.19467 4.39578 9.18486 4.38684 9.1731 4.38133C9.16135 4.37583 9.1482 4.37402 9.1354 4.37614C7.72944 4.61862 6.36101 5.04302 5.06457 5.63864C5.05359 5.64324 5.04429 5.65109 5.0379 5.66114C2.44457 9.5353 1.73373 13.3137 2.0829 17.0445C2.08375 17.0538 2.08648 17.0627 2.09092 17.0709C2.09536 17.0791 2.10142 17.0863 2.10873 17.092C3.6184 18.2105 5.30716 19.0643 7.1029 19.617C7.11556 19.6207 7.12903 19.6204 7.14153 19.6162C7.15403 19.6121 7.16497 19.6042 7.1729 19.5937C7.55895 19.0691 7.90069 18.5133 8.19457 17.932C8.19866 17.924 8.20103 17.9153 8.2015 17.9064C8.20198 17.8974 8.20056 17.8885 8.19733 17.8802C8.1941 17.8718 8.18914 17.8642 8.18278 17.858C8.17641 17.8517 8.16878 17.8468 8.1604 17.8437C7.62159 17.6375 7.09995 17.3889 6.6004 17.1003C6.59124 17.095 6.58354 17.0876 6.57797 17.0786C6.5724 17.0696 6.56914 17.0593 6.56848 17.0488C6.56782 17.0382 6.56978 17.0277 6.57418 17.0181C6.57859 17.0084 6.58531 17.0001 6.59373 16.9937C6.69893 16.915 6.80229 16.8338 6.90373 16.7503C6.91261 16.7431 6.92331 16.7385 6.93464 16.7371C6.94597 16.7356 6.95748 16.7373 6.9679 16.742C10.2412 18.2362 13.7846 18.2362 17.0196 16.742C17.0301 16.7371 17.0418 16.7353 17.0533 16.7368C17.0648 16.7383 17.0756 16.743 17.0846 16.7503C17.1846 16.832 17.2896 16.9153 17.3954 16.9937C17.4037 17 17.4104 17.0082 17.4148 17.0176C17.4193 17.0271 17.4213 17.0375 17.4208 17.0479C17.4203 17.0583 17.4173 17.0685 17.412 17.0775C17.4067 17.0865 17.3993 17.094 17.3904 17.0995C16.892 17.3908 16.3699 17.6395 15.8296 17.8428C15.8212 17.8461 15.8135 17.851 15.8071 17.8574C15.8008 17.8637 15.7958 17.8714 15.7926 17.8798C15.7894 17.8882 15.788 17.8972 15.7884 17.9062C15.7889 17.9152 15.7913 17.924 15.7954 17.932C16.0954 18.5137 16.4387 19.067 16.8162 19.5928C16.824 19.6035 16.8349 19.6116 16.8475 19.6157C16.86 19.6199 16.8736 19.6201 16.8862 19.6162C18.685 19.0652 20.3765 18.2113 21.8879 17.0912C21.8953 17.086 21.9014 17.0793 21.906 17.0715C21.9106 17.0638 21.9135 17.0551 21.9146 17.0462C22.3312 12.732 21.2162 8.98447 18.9571 5.6628C18.9518 5.6516 18.9426 5.64355 18.9312 5.63864ZM8.68373 14.772C7.6979 14.772 6.88623 13.8678 6.88623 12.7562C6.88623 11.6453 7.6829 10.7403 8.68373 10.7403C9.69207 10.7403 10.4971 11.6536 10.4812 12.757C10.4812 13.8678 9.68457 14.772 8.68373 14.772ZM15.3296 14.772C14.3437 14.772 13.5321 13.8678 13.5321 12.7562C13.5321 11.6453 14.3279 10.7403 15.3296 10.7403C16.3379 10.7403 17.1429 11.6536 17.1271 12.757C17.1271 13.8678 16.3387 14.772 15.3296 14.772Z"
-          fill="currentColor"
-          stroke="currentColor"
-        />
+export function DiscordIcon({ width = "24", height = "24", className }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 24 24"
+      fill="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g clipPath="url(#clip0_4112_17440)">
+        <mask id="mask0_4112_17440" maskUnits="userSpaceOnUse" x="0" y="0" width={width} height={height}>
+          <path d="M24 0H0V24H24V0Z" fill="white" />
+        </mask>
+        <g mask="url(#mask0_4112_17440)">
+          <path
+            d="M18.9312 5.63864C17.6346 5.0435 16.2662 4.61913 14.8604 4.37614C14.8476 4.37364 14.8343 4.37528 14.8225 4.38082C14.8106 4.38636 14.8009 4.39552 14.7946 4.40697C14.6196 4.71947 14.4246 5.12697 14.2879 5.44864C12.7724 5.21846 11.2309 5.21846 9.7154 5.44864C9.5633 5.09222 9.39165 4.74447 9.20123 4.40697C9.19467 4.39578 9.18486 4.38684 9.1731 4.38133C9.16135 4.37583 9.1482 4.37402 9.1354 4.37614C7.72944 4.61862 6.36101 5.04302 5.06457 5.63864C5.05359 5.64324 5.04429 5.65109 5.0379 5.66114C2.44457 9.5353 1.73373 13.3137 2.0829 17.0445C2.08375 17.0538 2.08648 17.0627 2.09092 17.0709C2.09536 17.0791 2.10142 17.0863 2.10873 17.092C3.6184 18.2105 5.30716 19.0643 7.1029 19.617C7.11556 19.6207 7.12903 19.6204 7.14153 19.6162C7.15403 19.6121 7.16497 19.6042 7.1729 19.5937C7.55895 19.0691 7.90069 18.5133 8.19457 17.932C8.19866 17.924 8.20103 17.9153 8.2015 17.9064C8.20198 17.8974 8.20056 17.8885 8.19733 17.8802C8.1941 17.8718 8.18914 17.8642 8.18278 17.858C8.17641 17.8517 8.16878 17.8468 8.1604 17.8437C7.62159 17.6375 7.09995 17.3889 6.6004 17.1003C6.59124 17.095 6.58354 17.0876 6.57797 17.0786C6.5724 17.0696 6.56914 17.0593 6.56848 17.0488C6.56782 17.0382 6.56978 17.0277 6.57418 17.0181C6.57859 17.0084 6.58531 17.0001 6.59373 16.9937C6.69893 16.915 6.80229 16.8338 6.90373 16.7503C6.91261 16.7431 6.92331 16.7385 6.93464 16.7371C6.94597 16.7356 6.95748 16.7373 6.9679 16.742C10.2412 18.2362 13.7846 18.2362 17.0196 16.742C17.0301 16.7371 17.0418 16.7353 17.0533 16.7368C17.0648 16.7383 17.0756 16.743 17.0846 16.7503C17.1846 16.832 17.2896 16.9153 17.3954 16.9937C17.4037 17 17.4104 17.0082 17.4148 17.0176C17.4193 17.0271 17.4213 17.0375 17.4208 17.0479C17.4203 17.0583 17.4173 17.0685 17.412 17.0775C17.4067 17.0865 17.3993 17.094 17.3904 17.0995C16.892 17.3908 16.3699 17.6395 15.8296 17.8428C15.8212 17.8461 15.8135 17.851 15.8071 17.8574C15.8008 17.8637 15.7958 17.8714 15.7926 17.8798C15.7894 17.8882 15.788 17.8972 15.7884 17.9062C15.7889 17.9152 15.7913 17.924 15.7954 17.932C16.0954 18.5137 16.4387 19.067 16.8162 19.5928C16.824 19.6035 16.8349 19.6116 16.8475 19.6157C16.86 19.6199 16.8736 19.6201 16.8862 19.6162C18.685 19.0652 20.3765 18.2113 21.8879 17.0912C21.8953 17.086 21.9014 17.0793 21.906 17.0715C21.9106 17.0638 21.9135 17.0551 21.9146 17.0462C22.3312 12.732 21.2162 8.98447 18.9571 5.6628C18.9518 5.6516 18.9426 5.64355 18.9312 5.63864ZM8.68373 14.772C7.6979 14.772 6.88623 13.8678 6.88623 12.7562C6.88623 11.6453 7.6829 10.7403 8.68373 10.7403C9.69207 10.7403 10.4971 11.6536 10.4812 12.757C10.4812 13.8678 9.68457 14.772 8.68373 14.772ZM15.3296 14.772C14.3437 14.772 13.5321 13.8678 13.5321 12.7562C13.5321 11.6453 14.3279 10.7403 15.3296 10.7403C16.3379 10.7403 17.1429 11.6536 17.1271 12.757C17.1271 13.8678 16.3387 14.772 15.3296 14.772Z"
+            fill="currentColor"
+            stroke="currentColor"
+          />
+        </g>
       </g>
-    </g>
-    <defs>
-      <clipPath id="clip0_4112_17440">
-        <rect width={width} height={height} fill="white" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+      <defs>
+        <clipPath id="clip0_4112_17440">
+          <rect width={width} height={height} fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/display-properties.tsx b/packages/propel/src/icons/display-properties.tsx
index 095e1de15..bfe5b648c 100644
--- a/packages/propel/src/icons/display-properties.tsx
+++ b/packages/propel/src/icons/display-properties.tsx
@@ -2,13 +2,15 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const DisplayPropertiesIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" {...rest} className={className}>
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M2.93934 0.93934C3.22064 0.658035 3.60218 0.5 4 0.5C4.39782 0.5 4.77936 0.658035 5.06066 0.93934C5.22036 1.09904 5.34033 1.29105 5.41421 1.5H11.5C11.7761 1.5 12 1.72386 12 2C12 2.27614 11.7761 2.5 11.5 2.5H5.41421C5.34033 2.70895 5.22036 2.90096 5.06066 3.06066C4.77936 3.34197 4.39782 3.5 4 3.5C3.60218 3.5 3.22064 3.34197 2.93934 3.06066C2.77964 2.90096 2.65967 2.70895 2.58579 2.5H0.5C0.223858 2.5 0 2.27614 0 2C0 1.72386 0.223858 1.5 0.5 1.5H2.58579C2.65967 1.29105 2.77964 1.09904 2.93934 0.93934ZM4 1.5C3.86739 1.5 3.74021 1.55268 3.64645 1.64645C3.55268 1.74021 3.5 1.86739 3.5 2C3.5 2.13261 3.55268 2.25979 3.64645 2.35355C3.74021 2.44732 3.86739 2.5 4 2.5C4.13261 2.5 4.25979 2.44732 4.35355 2.35355C4.44732 2.25979 4.5 2.13261 4.5 2C4.5 1.86739 4.44732 1.74021 4.35355 1.64645C4.25979 1.55268 4.13261 1.5 4 1.5ZM6.93934 4.93934C7.22064 4.65804 7.60218 4.5 8 4.5C8.39783 4.5 8.77936 4.65804 9.06066 4.93934C9.22036 5.09904 9.34033 5.29105 9.41422 5.5H11.5C11.7761 5.5 12 5.72386 12 6C12 6.27614 11.7761 6.5 11.5 6.5H9.41422C9.34033 6.70895 9.22036 6.90096 9.06066 7.06066C8.77936 7.34196 8.39783 7.5 8 7.5C7.60218 7.5 7.22064 7.34196 6.93934 7.06066C6.77964 6.90096 6.65967 6.70895 6.58579 6.5H0.5C0.223858 6.5 0 6.27614 0 6C0 5.72386 0.223858 5.5 0.5 5.5H6.58579C6.65967 5.29105 6.77964 5.09904 6.93934 4.93934ZM8 5.5C7.86739 5.5 7.74021 5.55268 7.64645 5.64645C7.55268 5.74021 7.5 5.86739 7.5 6C7.5 6.13261 7.55268 6.25979 7.64645 6.35355C7.74021 6.44732 7.86739 6.5 8 6.5C8.13261 6.5 8.25978 6.44732 8.35355 6.35355C8.44732 6.25979 8.5 6.13261 8.5 6C8.5 5.86739 8.44732 5.74022 8.35355 5.64645C8.25978 5.55268 8.13261 5.5 8 5.5ZM2.93934 8.93934C3.22064 8.65804 3.60217 8.5 4 8.5C4.39783 8.5 4.77936 8.65804 5.06066 8.93934C5.22036 9.09904 5.34033 9.29105 5.41421 9.5H11.5C11.7761 9.5 12 9.72386 12 10C12 10.2761 11.7761 10.5 11.5 10.5H5.41421C5.34033 10.709 5.22036 10.901 5.06066 11.0607C4.77936 11.342 4.39783 11.5 4 11.5C3.60217 11.5 3.22064 11.342 2.93934 11.0607C2.77964 10.901 2.65967 10.709 2.58579 10.5H0.5C0.223858 10.5 0 10.2761 0 10C0 9.72386 0.223858 9.5 0.5 9.5H2.58579C2.65967 9.29105 2.77964 9.09904 2.93934 8.93934ZM4 9.5C3.86739 9.5 3.74022 9.55268 3.64645 9.64645C3.55268 9.74022 3.5 9.86739 3.5 10C3.5 10.1326 3.55268 10.2598 3.64645 10.3536C3.74022 10.4473 3.86739 10.5 4 10.5C4.13261 10.5 4.25979 10.4473 4.35355 10.3536C4.44732 10.2598 4.5 10.1326 4.5 10C4.5 9.86739 4.44732 9.74022 4.35355 9.64645C4.25979 9.55268 4.13261 9.5 4 9.5Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function DisplayPropertiesIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" {...rest} className={className}>
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M2.93934 0.93934C3.22064 0.658035 3.60218 0.5 4 0.5C4.39782 0.5 4.77936 0.658035 5.06066 0.93934C5.22036 1.09904 5.34033 1.29105 5.41421 1.5H11.5C11.7761 1.5 12 1.72386 12 2C12 2.27614 11.7761 2.5 11.5 2.5H5.41421C5.34033 2.70895 5.22036 2.90096 5.06066 3.06066C4.77936 3.34197 4.39782 3.5 4 3.5C3.60218 3.5 3.22064 3.34197 2.93934 3.06066C2.77964 2.90096 2.65967 2.70895 2.58579 2.5H0.5C0.223858 2.5 0 2.27614 0 2C0 1.72386 0.223858 1.5 0.5 1.5H2.58579C2.65967 1.29105 2.77964 1.09904 2.93934 0.93934ZM4 1.5C3.86739 1.5 3.74021 1.55268 3.64645 1.64645C3.55268 1.74021 3.5 1.86739 3.5 2C3.5 2.13261 3.55268 2.25979 3.64645 2.35355C3.74021 2.44732 3.86739 2.5 4 2.5C4.13261 2.5 4.25979 2.44732 4.35355 2.35355C4.44732 2.25979 4.5 2.13261 4.5 2C4.5 1.86739 4.44732 1.74021 4.35355 1.64645C4.25979 1.55268 4.13261 1.5 4 1.5ZM6.93934 4.93934C7.22064 4.65804 7.60218 4.5 8 4.5C8.39783 4.5 8.77936 4.65804 9.06066 4.93934C9.22036 5.09904 9.34033 5.29105 9.41422 5.5H11.5C11.7761 5.5 12 5.72386 12 6C12 6.27614 11.7761 6.5 11.5 6.5H9.41422C9.34033 6.70895 9.22036 6.90096 9.06066 7.06066C8.77936 7.34196 8.39783 7.5 8 7.5C7.60218 7.5 7.22064 7.34196 6.93934 7.06066C6.77964 6.90096 6.65967 6.70895 6.58579 6.5H0.5C0.223858 6.5 0 6.27614 0 6C0 5.72386 0.223858 5.5 0.5 5.5H6.58579C6.65967 5.29105 6.77964 5.09904 6.93934 4.93934ZM8 5.5C7.86739 5.5 7.74021 5.55268 7.64645 5.64645C7.55268 5.74021 7.5 5.86739 7.5 6C7.5 6.13261 7.55268 6.25979 7.64645 6.35355C7.74021 6.44732 7.86739 6.5 8 6.5C8.13261 6.5 8.25978 6.44732 8.35355 6.35355C8.44732 6.25979 8.5 6.13261 8.5 6C8.5 5.86739 8.44732 5.74022 8.35355 5.64645C8.25978 5.55268 8.13261 5.5 8 5.5ZM2.93934 8.93934C3.22064 8.65804 3.60217 8.5 4 8.5C4.39783 8.5 4.77936 8.65804 5.06066 8.93934C5.22036 9.09904 5.34033 9.29105 5.41421 9.5H11.5C11.7761 9.5 12 9.72386 12 10C12 10.2761 11.7761 10.5 11.5 10.5H5.41421C5.34033 10.709 5.22036 10.901 5.06066 11.0607C4.77936 11.342 4.39783 11.5 4 11.5C3.60217 11.5 3.22064 11.342 2.93934 11.0607C2.77964 10.901 2.65967 10.709 2.58579 10.5H0.5C0.223858 10.5 0 10.2761 0 10C0 9.72386 0.223858 9.5 0.5 9.5H2.58579C2.65967 9.29105 2.77964 9.09904 2.93934 8.93934ZM4 9.5C3.86739 9.5 3.74022 9.55268 3.64645 9.64645C3.55268 9.74022 3.5 9.86739 3.5 10C3.5 10.1326 3.55268 10.2598 3.64645 10.3536C3.74022 10.4473 3.86739 10.5 4 10.5C4.13261 10.5 4.25979 10.4473 4.35355 10.3536C4.44732 10.2598 4.5 10.1326 4.5 10C4.5 9.86739 4.44732 9.74022 4.35355 9.64645C4.25979 9.55268 4.13261 9.5 4 9.5Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/done-icon.tsx b/packages/propel/src/icons/done-icon.tsx
index 218afd5cd..a00f60465 100644
--- a/packages/propel/src/icons/done-icon.tsx
+++ b/packages/propel/src/icons/done-icon.tsx
@@ -2,21 +2,23 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const DoneState: React.FC<ISvgIcons> = ({ width = "10", height = "11", className }) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 10 11"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <circle cx="5" cy="5.5" r="4.4" stroke="#15A34A" strokeWidth="1.2" />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M2.5 5.59375L3.82582 6.91957L4.26777 6.47763L2.94194 5.15181L2.5 5.59375ZM4.26777 7.36152L7.36136 4.26793L6.91942 3.82599L3.82583 6.91958L4.26777 7.36152Z"
-      fill="#15A34A"
-    />
-  </svg>
-);
+export function DoneState({ width = "10", height = "11", className }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 10 11"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <circle cx="5" cy="5.5" r="4.4" stroke="#15A34A" strokeWidth="1.2" />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M2.5 5.59375L3.82582 6.91957L4.26777 6.47763L2.94194 5.15181L2.5 5.59375ZM4.26777 7.36152L7.36136 4.26793L6.91942 3.82599L3.82583 6.91958L4.26777 7.36152Z"
+        fill="#15A34A"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/dropdown-icon.tsx b/packages/propel/src/icons/dropdown-icon.tsx
index 2fb897dbc..dc9079abf 100644
--- a/packages/propel/src/icons/dropdown-icon.tsx
+++ b/packages/propel/src/icons/dropdown-icon.tsx
@@ -2,14 +2,16 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const DropdownIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 7 5"
-    className={`${className} stroke-2`}
-    fill="currentColor"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path d="M2.77267 4.0211L0.457719 1.78653C0.162864 1.50191 0.0961218 1.17467 0.257492 0.8048C0.418861 0.434934 0.70939 0.25 1.12908 0.25H5.72716C6.14685 0.25 6.43738 0.434934 6.59875 0.8048C6.76012 1.17467 6.69338 1.50191 6.39855 1.78653L4.08357 4.0211C3.98662 4.1147 3.88435 4.18329 3.77676 4.22687C3.66918 4.27046 3.55297 4.29225 3.42813 4.29225C3.30328 4.29225 3.18706 4.27046 3.07948 4.22687C2.97191 4.18329 2.86964 4.1147 2.77267 4.0211Z" />
-  </svg>
-);
+export function DropdownIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 7 5"
+      className={`${className} stroke-2`}
+      fill="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path d="M2.77267 4.0211L0.457719 1.78653C0.162864 1.50191 0.0961218 1.17467 0.257492 0.8048C0.418861 0.434934 0.70939 0.25 1.12908 0.25H5.72716C6.14685 0.25 6.43738 0.434934 6.59875 0.8048C6.76012 1.17467 6.69338 1.50191 6.39855 1.78653L4.08357 4.0211C3.98662 4.1147 3.88435 4.18329 3.77676 4.22687C3.66918 4.27046 3.55297 4.29225 3.42813 4.29225C3.30328 4.29225 3.18706 4.27046 3.07948 4.22687C2.97191 4.18329 2.86964 4.1147 2.77267 4.0211Z" />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/favorite-folder-icon.tsx b/packages/propel/src/icons/favorite-folder-icon.tsx
index 5b8aa39e6..bf2733a98 100644
--- a/packages/propel/src/icons/favorite-folder-icon.tsx
+++ b/packages/propel/src/icons/favorite-folder-icon.tsx
@@ -2,29 +2,31 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const FavoriteFolderIcon: React.FC<ISvgIcons> = ({ className = "text-current", color = "#a3a3a3", ...rest }) => (
-  <svg
-    width="16"
-    height="16"
-    viewBox="0 0 16 16"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    stroke={color}
-    className={`${className} stroke-2`}
-    {...rest}
-  >
-    <path
-      d="M7.33325 13.3334H2.66659C2.31296 13.3334 1.97382 13.1929 1.72378 12.9429C1.47373 12.6928 1.33325 12.3537 1.33325 12.0001V3.3334C1.33325 2.97978 1.47373 2.64064 1.72378 2.39059C1.97382 2.14054 2.31296 2.00006 2.66659 2.00006H5.26659C5.48958 1.99788 5.70955 2.05166 5.90638 2.15648C6.10322 2.2613 6.27061 2.41381 6.39325 2.60006L6.93325 3.40006C7.05466 3.58442 7.21994 3.73574 7.41425 3.84047C7.60857 3.94519 7.82585 4.00003 8.04658 4.00006H13.3333C13.6869 4.00006 14.026 4.14054 14.2761 4.39059C14.5261 4.64064 14.6666 4.97978 14.6666 5.3334V6.3334"
-      strokeWidth="1.25"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M12.1373 8L13.0038 9.75535L14.9414 10.0386L13.5394 11.4041L13.8702 13.3333L12.1373 12.422L10.4044 13.3333L10.7353 11.4041L9.33325 10.0386L11.2709 9.75535L12.1373 8Z"
-      strokeWidth="1.25"
-      strokeLinecap="round"
-      strokeLinejoin="round"
+export function FavoriteFolderIcon({ className = "text-current", color = "#a3a3a3", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      width="16"
+      height="16"
+      viewBox="0 0 16 16"
       fill="none"
-    />
-  </svg>
-);
+      xmlns="http://www.w3.org/2000/svg"
+      stroke={color}
+      className={`${className} stroke-2`}
+      {...rest}
+    >
+      <path
+        d="M7.33325 13.3334H2.66659C2.31296 13.3334 1.97382 13.1929 1.72378 12.9429C1.47373 12.6928 1.33325 12.3537 1.33325 12.0001V3.3334C1.33325 2.97978 1.47373 2.64064 1.72378 2.39059C1.97382 2.14054 2.31296 2.00006 2.66659 2.00006H5.26659C5.48958 1.99788 5.70955 2.05166 5.90638 2.15648C6.10322 2.2613 6.27061 2.41381 6.39325 2.60006L6.93325 3.40006C7.05466 3.58442 7.21994 3.73574 7.41425 3.84047C7.60857 3.94519 7.82585 4.00003 8.04658 4.00006H13.3333C13.6869 4.00006 14.026 4.14054 14.2761 4.39059C14.5261 4.64064 14.6666 4.97978 14.6666 5.3334V6.3334"
+        strokeWidth="1.25"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M12.1373 8L13.0038 9.75535L14.9414 10.0386L13.5394 11.4041L13.8702 13.3333L12.1373 12.422L10.4044 13.3333L10.7353 11.4041L9.33325 10.0386L11.2709 9.75535L12.1373 8Z"
+        strokeWidth="1.25"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        fill="none"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/full-screen-panel-icon.tsx b/packages/propel/src/icons/full-screen-panel-icon.tsx
index c0be88173..2bcc76b4a 100644
--- a/packages/propel/src/icons/full-screen-panel-icon.tsx
+++ b/packages/propel/src/icons/full-screen-panel-icon.tsx
@@ -2,25 +2,27 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const FullScreenPanelIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      d="M19 3H5C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3Z"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M16.6667 6.00001H7.20015C6.50001 5.99999 6.00005 6.00003 6.00017 7.33335C6.00027 8.4402 6.00021 13.8198 6.00018 15.8823L6.00017 16.6667C6.00017 18 6.00017 18 7.20015 18H16.6667C18 18 18 18 18 16.6667V7.33335C18 6.00001 18 6.00001 16.6667 6.00001H16.6667Z"
-      fill="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+export function FullScreenPanelIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        d="M19 3H5C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3Z"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M16.6667 6.00001H7.20015C6.50001 5.99999 6.00005 6.00003 6.00017 7.33335C6.00027 8.4402 6.00021 13.8198 6.00018 15.8823L6.00017 16.6667C6.00017 18 6.00017 18 7.20015 18H16.6667C18 18 18 18 18 16.6667V7.33335C18 6.00001 18 6.00001 16.6667 6.00001H16.6667Z"
+        fill="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/github-icon.tsx b/packages/propel/src/icons/github-icon.tsx
index f8f6f318f..9ed2d8909 100644
--- a/packages/propel/src/icons/github-icon.tsx
+++ b/packages/propel/src/icons/github-icon.tsx
@@ -2,27 +2,29 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const GithubIcon: React.FC<ISvgIcons> = ({ width = "24", height = "24", className, color }) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 24 24"
-    fill="currentColor"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g clipPath="url(#clip0_282_232)">
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M10 0C4.475 0 0 4.475 0 10C0 14.425 2.8625 18.1625 6.8375 19.4875C7.3375 19.575 7.525 19.275 7.525 19.0125C7.525 18.775 7.5125 17.9875 7.5125 17.15C5 17.6125 4.35 16.5375 4.15 15.975C4.0375 15.6875 3.55 14.8 3.125 14.5625C2.775 14.375 2.275 13.9125 3.1125 13.9C3.9 13.8875 4.4625 14.625 4.65 14.925C5.55 16.4375 6.9875 16.0125 7.5625 15.75C7.65 15.1 7.9125 14.6625 8.2 14.4125C5.975 14.1625 3.65 13.3 3.65 9.475C3.65 8.3875 4.0375 7.4875 4.675 6.7875C4.575 6.5375 4.225 5.5125 4.775 4.1375C4.775 4.1375 5.6125 3.875 7.525 5.1625C8.325 4.9375 9.175 4.825 10.025 4.825C10.875 4.825 11.725 4.9375 12.525 5.1625C14.4375 3.8625 15.275 4.1375 15.275 4.1375C15.825 5.5125 15.475 6.5375 15.375 6.7875C16.0125 7.4875 16.4 8.375 16.4 9.475C16.4 13.3125 14.0625 14.1625 11.8375 14.4125C12.2 14.725 12.5125 15.325 12.5125 16.2625C12.5125 17.6 12.5 18.675 12.5 19.0125C12.5 19.275 12.6875 19.5875 13.1875 19.4875C15.1726 18.8173 16.8976 17.5414 18.1197 15.8395C19.3418 14.1375 19.9994 12.0952 20 10C20 4.475 15.525 0 10 0Z"
-        fill={color ? color : "rgb(var(--color-text-200))"}
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_282_232">
-        <rect width={width} height={height} />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function GithubIcon({ width = "24", height = "24", className, color }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 24 24"
+      fill="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g clipPath="url(#clip0_282_232)">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M10 0C4.475 0 0 4.475 0 10C0 14.425 2.8625 18.1625 6.8375 19.4875C7.3375 19.575 7.525 19.275 7.525 19.0125C7.525 18.775 7.5125 17.9875 7.5125 17.15C5 17.6125 4.35 16.5375 4.15 15.975C4.0375 15.6875 3.55 14.8 3.125 14.5625C2.775 14.375 2.275 13.9125 3.1125 13.9C3.9 13.8875 4.4625 14.625 4.65 14.925C5.55 16.4375 6.9875 16.0125 7.5625 15.75C7.65 15.1 7.9125 14.6625 8.2 14.4125C5.975 14.1625 3.65 13.3 3.65 9.475C3.65 8.3875 4.0375 7.4875 4.675 6.7875C4.575 6.5375 4.225 5.5125 4.775 4.1375C4.775 4.1375 5.6125 3.875 7.525 5.1625C8.325 4.9375 9.175 4.825 10.025 4.825C10.875 4.825 11.725 4.9375 12.525 5.1625C14.4375 3.8625 15.275 4.1375 15.275 4.1375C15.825 5.5125 15.475 6.5375 15.375 6.7875C16.0125 7.4875 16.4 8.375 16.4 9.475C16.4 13.3125 14.0625 14.1625 11.8375 14.4125C12.2 14.725 12.5125 15.325 12.5125 16.2625C12.5125 17.6 12.5 18.675 12.5 19.0125C12.5 19.275 12.6875 19.5875 13.1875 19.4875C15.1726 18.8173 16.8976 17.5414 18.1197 15.8395C19.3418 14.1375 19.9994 12.0952 20 10C20 4.475 15.525 0 10 0Z"
+          fill={color ? color : "rgb(var(--color-text-200))"}
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_282_232">
+          <rect width={width} height={height} />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/gitlab-icon.tsx b/packages/propel/src/icons/gitlab-icon.tsx
index 1ffef236b..ae29da747 100644
--- a/packages/propel/src/icons/gitlab-icon.tsx
+++ b/packages/propel/src/icons/gitlab-icon.tsx
@@ -2,27 +2,29 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const GitlabIcon: React.FC<ISvgIcons> = ({ width = "24", height = "24", className, color }) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 24 24"
-    fill="currentColor"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g clipPath="url(#clip0_282_232)">
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M10 0C4.475 0 0 4.475 0 10C0 14.425 2.8625 18.1625 6.8375 19.4875C7.3375 19.575 7.525 19.275 7.525 19.0125C7.525 18.775 7.5125 17.9875 7.5125 17.15C5 17.6125 4.35 16.5375 4.15 15.975C4.0375 15.6875 3.55 14.8 3.125 14.5625C2.775 14.375 2.275 13.9125 3.1125 13.9C3.9 13.8875 4.4625 14.625 4.65 14.925C5.55 16.4375 6.9875 16.0125 7.5625 15.75C7.65 15.1 7.9125 14.6625 8.2 14.4125C5.975 14.1625 3.65 13.3 3.65 9.475C3.65 8.3875 4.0375 7.4875 4.675 6.7875C4.575 6.5375 4.225 5.5125 4.775 4.1375C4.775 4.1375 5.6125 3.875 7.525 5.1625C8.325 4.9375 9.175 4.825 10.025 4.825C10.875 4.825 11.725 4.9375 12.525 5.1625C14.4375 3.8625 15.275 4.1375 15.275 4.1375C15.825 5.5125 15.475 6.5375 15.375 6.7875C16.0125 7.4875 16.4 8.375 16.4 9.475C16.4 13.3125 14.0625 14.1625 11.8375 14.4125C12.2 14.725 12.5125 15.325 12.5125 16.2625C12.5125 17.6 12.5 18.675 12.5 19.0125C12.5 19.275 12.6875 19.5875 13.1875 19.4875C15.1726 18.8173 16.8976 17.5414 18.1197 15.8395C19.3418 14.1375 19.9994 12.0952 20 10C20 4.475 15.525 0 10 0Z"
-        fill={color ? color : "rgb(var(--color-text-200))"}
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_282_232">
-        <rect width={width} height={height} />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function GitlabIcon({ width = "24", height = "24", className, color }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 24 24"
+      fill="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g clipPath="url(#clip0_282_232)">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M10 0C4.475 0 0 4.475 0 10C0 14.425 2.8625 18.1625 6.8375 19.4875C7.3375 19.575 7.525 19.275 7.525 19.0125C7.525 18.775 7.5125 17.9875 7.5125 17.15C5 17.6125 4.35 16.5375 4.15 15.975C4.0375 15.6875 3.55 14.8 3.125 14.5625C2.775 14.375 2.275 13.9125 3.1125 13.9C3.9 13.8875 4.4625 14.625 4.65 14.925C5.55 16.4375 6.9875 16.0125 7.5625 15.75C7.65 15.1 7.9125 14.6625 8.2 14.4125C5.975 14.1625 3.65 13.3 3.65 9.475C3.65 8.3875 4.0375 7.4875 4.675 6.7875C4.575 6.5375 4.225 5.5125 4.775 4.1375C4.775 4.1375 5.6125 3.875 7.525 5.1625C8.325 4.9375 9.175 4.825 10.025 4.825C10.875 4.825 11.725 4.9375 12.525 5.1625C14.4375 3.8625 15.275 4.1375 15.275 4.1375C15.825 5.5125 15.475 6.5375 15.375 6.7875C16.0125 7.4875 16.4 8.375 16.4 9.475C16.4 13.3125 14.0625 14.1625 11.8375 14.4125C12.2 14.725 12.5125 15.325 12.5125 16.2625C12.5125 17.6 12.5 18.675 12.5 19.0125C12.5 19.275 12.6875 19.5875 13.1875 19.4875C15.1726 18.8173 16.8976 17.5414 18.1197 15.8395C19.3418 14.1375 19.9994 12.0952 20 10C20 4.475 15.525 0 10 0Z"
+          fill={color ? color : "rgb(var(--color-text-200))"}
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_282_232">
+          <rect width={width} height={height} />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/icon-wrapper.tsx b/packages/propel/src/icons/icon-wrapper.tsx
index c8ede6f32..fbfedbafb 100644
--- a/packages/propel/src/icons/icon-wrapper.tsx
+++ b/packages/propel/src/icons/icon-wrapper.tsx
@@ -8,7 +8,7 @@ interface IIconWrapper extends ISvgIcons {
   viewBox?: string;
 }
 
-export const IconWrapper: React.FC<IIconWrapper> = ({
+export function IconWrapper({
   width = "16",
   height = "16",
   className = "text-current",
@@ -16,27 +16,29 @@ export const IconWrapper: React.FC<IIconWrapper> = ({
   clipPathId,
   viewBox = "0 0 16 16",
   ...rest
-}) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox={viewBox}
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-    {...rest}
-  >
-    {clipPathId ? (
-      <>
-        <g clipPath={`url(#${clipPathId})`}>{children}</g>
-        <defs>
-          <clipPath id={clipPathId}>
-            <rect width="16" height="16" fill="white" />
-          </clipPath>
-        </defs>
-      </>
-    ) : (
-      children
-    )}
-  </svg>
-);
+}: IIconWrapper) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox={viewBox}
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      {...rest}
+    >
+      {clipPathId ? (
+        <>
+          <g clipPath={`url(#${clipPathId})`}>{children}</g>
+          <defs>
+            <clipPath id={clipPathId}>
+              <rect width="16" height="16" fill="white" />
+            </clipPath>
+          </defs>
+        </>
+      ) : (
+        children
+      )}
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/icon.tsx b/packages/propel/src/icons/icon.tsx
index a19816348..2b80d943d 100644
--- a/packages/propel/src/icons/icon.tsx
+++ b/packages/propel/src/icons/icon.tsx
@@ -8,7 +8,7 @@ export interface IconProps extends Omit<ISvgIcons, "ref"> {
   name: IconName;
 }
 
-export const Icon: React.FC<IconProps> = ({ name, ...props }) => {
+export function Icon({ name, ...props }: IconProps) {
   const IconComponent = ICON_REGISTRY[name] || ICON_REGISTRY.default;
   return <IconComponent {...props} />;
-};
+}
diff --git a/packages/propel/src/icons/in-progress-icon.tsx b/packages/propel/src/icons/in-progress-icon.tsx
index d0f66f4cc..574b0a553 100644
--- a/packages/propel/src/icons/in-progress-icon.tsx
+++ b/packages/propel/src/icons/in-progress-icon.tsx
@@ -2,16 +2,18 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const InProgressState: React.FC<ISvgIcons> = ({ width = "10", height = "11", className, color }) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 12 13"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <circle cx="6" cy="6.5" r="4.4" stroke={color ?? "#EA8900"} strokeWidth="1.2" />
-    <circle cx="6" cy="6.5" r="2.4" stroke={color ?? "#EA8900"} strokeWidth="1.2" strokeDasharray="4 4" />
-  </svg>
-);
+export function InProgressState({ width = "10", height = "11", className, color }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 12 13"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <circle cx="6" cy="6.5" r="4.4" stroke={color ?? "#EA8900"} strokeWidth="1.2" />
+      <circle cx="6" cy="6.5" r="2.4" stroke={color ?? "#EA8900"} strokeWidth="1.2" strokeDasharray="4 4" />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/info-fill-icon.tsx b/packages/propel/src/icons/info-fill-icon.tsx
index 65beaa520..b5428910d 100644
--- a/packages/propel/src/icons/info-fill-icon.tsx
+++ b/packages/propel/src/icons/info-fill-icon.tsx
@@ -2,13 +2,15 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const InfoFillIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg viewBox="0 0 24 24" className={`${className}`} xmlns="http://www.w3.org/2000/svg" {...rest}>
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M2.25 12C2.25 6.615 6.615 2.25 12 2.25C17.385 2.25 21.75 6.615 21.75 12C21.75 17.385 17.385 21.75 12 21.75C6.615 21.75 2.25 17.385 2.25 12ZM10.956 10.558C12.102 9.985 13.393 11.021 13.082 12.264L12.373 15.1L12.415 15.08C12.5912 15.0025 12.7905 14.9958 12.9715 15.0612C13.1526 15.1265 13.3016 15.259 13.3877 15.4312C13.4737 15.6033 13.4903 15.802 13.434 15.9861C13.3777 16.1702 13.2527 16.3255 13.085 16.42L13.045 16.442C11.898 17.015 10.607 15.979 10.918 14.736L11.628 11.9L11.586 11.92C11.4975 11.9692 11.4 11.9999 11.2994 12.0104C11.1987 12.0209 11.097 12.0109 11.0003 11.981C10.9036 11.9511 10.8139 11.902 10.7367 11.8366C10.6595 11.7711 10.5964 11.6907 10.551 11.6002C10.5057 11.5098 10.4792 11.411 10.4731 11.31C10.4669 11.209 10.4813 11.1078 10.5153 11.0124C10.5493 10.9171 10.6022 10.8297 10.6709 10.7553C10.7396 10.681 10.8226 10.6214 10.915 10.58L10.956 10.558ZM12 9C12.1989 9 12.3897 8.92098 12.5303 8.78033C12.671 8.63968 12.75 8.44891 12.75 8.25C12.75 8.05109 12.671 7.86032 12.5303 7.71967C12.3897 7.57902 12.1989 7.5 12 7.5C11.8011 7.5 11.6103 7.57902 11.4697 7.71967C11.329 7.86032 11.25 8.05109 11.25 8.25C11.25 8.44891 11.329 8.63968 11.4697 8.78033C11.6103 8.92098 11.8011 9 12 9Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function InfoFillIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 24 24" className={`${className}`} xmlns="http://www.w3.org/2000/svg" {...rest}>
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M2.25 12C2.25 6.615 6.615 2.25 12 2.25C17.385 2.25 21.75 6.615 21.75 12C21.75 17.385 17.385 21.75 12 21.75C6.615 21.75 2.25 17.385 2.25 12ZM10.956 10.558C12.102 9.985 13.393 11.021 13.082 12.264L12.373 15.1L12.415 15.08C12.5912 15.0025 12.7905 14.9958 12.9715 15.0612C13.1526 15.1265 13.3016 15.259 13.3877 15.4312C13.4737 15.6033 13.4903 15.802 13.434 15.9861C13.3777 16.1702 13.2527 16.3255 13.085 16.42L13.045 16.442C11.898 17.015 10.607 15.979 10.918 14.736L11.628 11.9L11.586 11.92C11.4975 11.9692 11.4 11.9999 11.2994 12.0104C11.1987 12.0209 11.097 12.0109 11.0003 11.981C10.9036 11.9511 10.8139 11.902 10.7367 11.8366C10.6595 11.7711 10.5964 11.6907 10.551 11.6002C10.5057 11.5098 10.4792 11.411 10.4731 11.31C10.4669 11.209 10.4813 11.1078 10.5153 11.0124C10.5493 10.9171 10.6022 10.8297 10.6709 10.7553C10.7396 10.681 10.8226 10.6214 10.915 10.58L10.956 10.558ZM12 9C12.1989 9 12.3897 8.92098 12.5303 8.78033C12.671 8.63968 12.75 8.44891 12.75 8.25C12.75 8.05109 12.671 7.86032 12.5303 7.71967C12.3897 7.57902 12.1989 7.5 12 7.5C11.8011 7.5 11.6103 7.57902 11.4697 7.71967C11.329 7.86032 11.25 8.05109 11.25 8.25C11.25 8.44891 11.329 8.63968 11.4697 8.78033C11.6103 8.92098 11.8011 9 12 9Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/info-icon.tsx b/packages/propel/src/icons/info-icon.tsx
index 8173595d5..3e2f3609e 100644
--- a/packages/propel/src/icons/info-icon.tsx
+++ b/packages/propel/src/icons/info-icon.tsx
@@ -2,20 +2,22 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const InfoIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    strokeWidth="2"
-    strokeLinecap="round"
-    strokeLinejoin="round"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <circle cx="12" cy="12" r="10" />
-    <path d="M12 16v-4" />
-    <path d="M12 8h.01" />
-  </svg>
-);
+export function InfoIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <circle cx="12" cy="12" r="10" />
+      <path d="M12 16v-4" />
+      <path d="M12 8h.01" />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/intake.tsx b/packages/propel/src/icons/intake.tsx
index e980f4d87..9d45f01e2 100644
--- a/packages/propel/src/icons/intake.tsx
+++ b/packages/propel/src/icons/intake.tsx
@@ -2,21 +2,23 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const Intake: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 16 16"
-    className={`${className}`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    strokeWidth="1.25"
-    strokeLinecap="round"
-    strokeLinejoin="round"
-    {...rest}
-  >
-    <path d="M12.1599 3.59961V9.60688L8.04358 12.0796V6.04325L12.1599 3.59961Z" />
-    <path d="M5.98547 10.8657V4.82938L10.1018 2.38574" />
-    <path d="M3.89087 9.60695V3.57059L8.00723 1.12695" />
-    <path d="M1.06909 8.77051V13.3887C1.06909 14.1814 1.71636 14.8287 2.50909 14.8287H13.4909C14.2836 14.8287 14.9309 14.1814 14.9309 13.3887V8.77051" />
-  </svg>
-);
+export function Intake({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 16 16"
+      className={`${className}`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      strokeWidth="1.25"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      {...rest}
+    >
+      <path d="M12.1599 3.59961V9.60688L8.04358 12.0796V6.04325L12.1599 3.59961Z" />
+      <path d="M5.98547 10.8657V4.82938L10.1018 2.38574" />
+      <path d="M3.89087 9.60695V3.57059L8.00723 1.12695" />
+      <path d="M1.06909 8.77051V13.3887C1.06909 14.1814 1.71636 14.8287 2.50909 14.8287H13.4909C14.2836 14.8287 14.9309 14.1814 14.9309 13.3887V8.77051" />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/layer-stack.tsx b/packages/propel/src/icons/layer-stack.tsx
index f57c23621..109da58ad 100644
--- a/packages/propel/src/icons/layer-stack.tsx
+++ b/packages/propel/src/icons/layer-stack.tsx
@@ -2,29 +2,31 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const LayerStackIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      d="M19 22H4C3.46957 22 2.96086 21.8119 2.58579 21.477C2.21071 21.1421 2 20.6879 2 20.2143V11.2857C2 10.8121 2.21071 10.3579 2.58579 10.023C2.96086 9.68814 3.46957 9.5 4 9.5H20C20.5304 9.5 21.0391 9.68814 21.4142 10.023C21.7893 10.3579 22 10.8121 22 11.2857V20.2143C22 20.6879 21.7893 21.1421 21.4142 21.477C21.0391 21.8119 20.5304 22 20 22H19Z"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M4.5 9.5V6.82143C4.5 6.53727 4.65804 6.26475 4.93934 6.06381C5.22064 5.86288 5.60218 5.75 6 5.75H18C18.3978 5.75 18.7794 5.86288 19.0607 6.06381C19.342 6.26475 19.5 6.53727 19.5 6.82143V9.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M7 4.5V2.71429C7 2.52485 7.10536 2.34316 7.29289 2.20921C7.48043 2.07525 7.73478 2 8 2H16C16.2652 2 16.5196 2.07525 16.7071 2.20921C16.8946 2.34316 17 2.52485 17 2.71429V4.5"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+export function LayerStackIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        d="M19 22H4C3.46957 22 2.96086 21.8119 2.58579 21.477C2.21071 21.1421 2 20.6879 2 20.2143V11.2857C2 10.8121 2.21071 10.3579 2.58579 10.023C2.96086 9.68814 3.46957 9.5 4 9.5H20C20.5304 9.5 21.0391 9.68814 21.4142 10.023C21.7893 10.3579 22 10.8121 22 11.2857V20.2143C22 20.6879 21.7893 21.1421 21.4142 21.477C21.0391 21.8119 20.5304 22 20 22H19Z"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M4.5 9.5V6.82143C4.5 6.53727 4.65804 6.26475 4.93934 6.06381C5.22064 5.86288 5.60218 5.75 6 5.75H18C18.3978 5.75 18.7794 5.86288 19.0607 6.06381C19.342 6.26475 19.5 6.53727 19.5 6.82143V9.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M7 4.5V2.71429C7 2.52485 7.10536 2.34316 7.29289 2.20921C7.48043 2.07525 7.73478 2 8 2H16C16.2652 2 16.5196 2.07525 16.7071 2.20921C16.8946 2.34316 17 2.52485 17 2.71429V4.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/layers-icon.tsx b/packages/propel/src/icons/layers-icon.tsx
index 6591ceaf7..c571df4d4 100644
--- a/packages/propel/src/icons/layers-icon.tsx
+++ b/packages/propel/src/icons/layers-icon.tsx
@@ -2,36 +2,38 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const LayersIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <g clipPath="url(#clip0_7258_81938)">
-      <path
-        d="M16.5953 6.69606L16.6072 5.17376L6.85812 8.92381L6.85812 19.4238L9.00319 18.6961"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M12.0953 3.69606L12.1072 2.17376L2.35812 5.92381L2.35812 16.4238L4.50319 15.6961"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M21.7438 17.9461L21.7511 7.44434L12.0021 11.1944L12.0021 21.6944L21.7438 17.9461Z"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_7258_81938">
-        <rect width="24" height="24" fill="white" transform="translate(24) rotate(90)" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function LayersIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <g clipPath="url(#clip0_7258_81938)">
+        <path
+          d="M16.5953 6.69606L16.6072 5.17376L6.85812 8.92381L6.85812 19.4238L9.00319 18.6961"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M12.0953 3.69606L12.1072 2.17376L2.35812 5.92381L2.35812 16.4238L4.50319 15.6961"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M21.7438 17.9461L21.7511 7.44434L12.0021 11.1944L12.0021 21.6944L21.7438 17.9461Z"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_7258_81938">
+          <rect width="24" height="24" fill="white" transform="translate(24) rotate(90)" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/layouts/board-icon.tsx b/packages/propel/src/icons/layouts/board-icon.tsx
index 8d6f32729..42987f541 100644
--- a/packages/propel/src/icons/layouts/board-icon.tsx
+++ b/packages/propel/src/icons/layouts/board-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const BoardLayoutIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 5.19922C13.375 4.62897 13.3743 4.23865 13.3496 3.93652C13.3255 3.64197 13.2821 3.48609 13.2256 3.375C13.0938 3.11627 12.8827 2.90526 12.624 2.77344C12.5129 2.7169 12.357 2.67348 12.0625 2.64941C11.7604 2.62474 11.3701 2.62402 10.7998 2.62402H10.625V13.374H10.7998C11.3701 13.374 11.7604 13.3733 12.0625 13.3486C12.357 13.3246 12.5129 13.2811 12.624 13.2246C12.8827 13.0928 13.0938 12.8818 13.2256 12.623C13.2821 12.5119 13.3255 12.356 13.3496 12.0615C13.3743 11.7594 13.375 11.3691 13.375 10.7988V5.19922ZM6.625 13.374H9.375V2.62402H6.625V13.374ZM2.625 10.7988C2.625 11.3691 2.62572 11.7594 2.65039 12.0615C2.67445 12.356 2.71788 12.5119 2.77441 12.623C2.90623 12.8818 3.11725 13.0928 3.37598 13.2246C3.48707 13.2811 3.64295 13.3246 3.9375 13.3486C4.23962 13.3733 4.62994 13.374 5.2002 13.374H5.375V2.62402H5.2002C4.62994 2.62402 4.23962 2.62474 3.9375 2.64941C3.64296 2.67348 3.48707 2.71691 3.37598 2.77344C3.11725 2.90526 2.90624 3.11628 2.77441 3.375C2.71788 3.48609 2.67446 3.64198 2.65039 3.93652C2.62572 4.23865 2.625 4.62897 2.625 5.19922V10.7988ZM14.625 10.7988C14.625 11.3484 14.6255 11.7983 14.5957 12.1631C14.5653 12.5351 14.5001 12.8738 14.3389 13.1904C14.0872 13.6844 13.6854 14.0862 13.1914 14.3379C12.8748 14.4992 12.5361 14.5643 12.1641 14.5947C11.7993 14.6245 11.3493 14.624 10.7998 14.624H5.2002C4.65067 14.624 4.20072 14.6245 3.83594 14.5947C3.46388 14.5643 3.12523 14.4992 2.80859 14.3379C2.31467 14.0862 1.91281 13.6844 1.66113 13.1904C1.49987 12.8738 1.4347 12.5352 1.4043 12.1631C1.37452 11.7983 1.375 11.3484 1.375 10.7988V5.19922C1.375 4.64969 1.37452 4.19974 1.4043 3.83496C1.4347 3.4629 1.49985 3.12425 1.66113 2.80762C1.9128 2.31369 2.31466 1.91182 2.80859 1.66016C3.12523 1.49888 3.46388 1.43372 3.83594 1.40332C4.20072 1.37355 4.65067 1.37402 5.2002 1.37402H10.7998C11.3493 1.37402 11.7993 1.37355 12.1641 1.40332C12.5361 1.43372 12.8748 1.49889 13.1914 1.66016C13.6854 1.91183 14.0872 2.31369 14.3389 2.80762C14.5002 3.12425 14.5653 3.46291 14.5957 3.83496C14.6255 4.19974 14.625 4.6497 14.625 5.19922V10.7988Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function BoardLayoutIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 5.19922C13.375 4.62897 13.3743 4.23865 13.3496 3.93652C13.3255 3.64197 13.2821 3.48609 13.2256 3.375C13.0938 3.11627 12.8827 2.90526 12.624 2.77344C12.5129 2.7169 12.357 2.67348 12.0625 2.64941C11.7604 2.62474 11.3701 2.62402 10.7998 2.62402H10.625V13.374H10.7998C11.3701 13.374 11.7604 13.3733 12.0625 13.3486C12.357 13.3246 12.5129 13.2811 12.624 13.2246C12.8827 13.0928 13.0938 12.8818 13.2256 12.623C13.2821 12.5119 13.3255 12.356 13.3496 12.0615C13.3743 11.7594 13.375 11.3691 13.375 10.7988V5.19922ZM6.625 13.374H9.375V2.62402H6.625V13.374ZM2.625 10.7988C2.625 11.3691 2.62572 11.7594 2.65039 12.0615C2.67445 12.356 2.71788 12.5119 2.77441 12.623C2.90623 12.8818 3.11725 13.0928 3.37598 13.2246C3.48707 13.2811 3.64295 13.3246 3.9375 13.3486C4.23962 13.3733 4.62994 13.374 5.2002 13.374H5.375V2.62402H5.2002C4.62994 2.62402 4.23962 2.62474 3.9375 2.64941C3.64296 2.67348 3.48707 2.71691 3.37598 2.77344C3.11725 2.90526 2.90624 3.11628 2.77441 3.375C2.71788 3.48609 2.67446 3.64198 2.65039 3.93652C2.62572 4.23865 2.625 4.62897 2.625 5.19922V10.7988ZM14.625 10.7988C14.625 11.3484 14.6255 11.7983 14.5957 12.1631C14.5653 12.5351 14.5001 12.8738 14.3389 13.1904C14.0872 13.6844 13.6854 14.0862 13.1914 14.3379C12.8748 14.4992 12.5361 14.5643 12.1641 14.5947C11.7993 14.6245 11.3493 14.624 10.7998 14.624H5.2002C4.65067 14.624 4.20072 14.6245 3.83594 14.5947C3.46388 14.5643 3.12523 14.4992 2.80859 14.3379C2.31467 14.0862 1.91281 13.6844 1.66113 13.1904C1.49987 12.8738 1.4347 12.5352 1.4043 12.1631C1.37452 11.7983 1.375 11.3484 1.375 10.7988V5.19922C1.375 4.64969 1.37452 4.19974 1.4043 3.83496C1.4347 3.4629 1.49985 3.12425 1.66113 2.80762C1.9128 2.31369 2.31466 1.91182 2.80859 1.66016C3.12523 1.49888 3.46388 1.43372 3.83594 1.40332C4.20072 1.37355 4.65067 1.37402 5.2002 1.37402H10.7998C11.3493 1.37402 11.7993 1.37355 12.1641 1.40332C12.5361 1.43372 12.8748 1.49889 13.1914 1.66016C13.6854 1.91183 14.0872 2.31369 14.3389 2.80762C14.5002 3.12425 14.5653 3.46291 14.5957 3.83496C14.6255 4.19974 14.625 4.6497 14.625 5.19922V10.7988Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/layouts/calendar-icon.tsx b/packages/propel/src/icons/layouts/calendar-icon.tsx
index e8a69f1c9..5d36401a5 100644
--- a/packages/propel/src/icons/layouts/calendar-icon.tsx
+++ b/packages/propel/src/icons/layouts/calendar-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const CalendarLayoutIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 7.29102H2.625V11.4668C2.625 12.0369 2.62571 12.4274 2.65039 12.7295C2.67449 13.024 2.71781 13.1799 2.77441 13.291C2.90624 13.5497 3.1173 13.7598 3.37598 13.8916C3.48708 13.9482 3.64284 13.9925 3.9375 14.0166C4.23962 14.0413 4.62998 14.041 5.2002 14.041H10.7998C11.37 14.041 11.7604 14.0413 12.0625 14.0166C12.3571 13.9925 12.5129 13.9482 12.624 13.8916C12.8827 13.7598 13.0938 13.5497 13.2256 13.291C13.2822 13.1799 13.3255 13.024 13.3496 12.7295C13.3743 12.4274 13.375 12.0369 13.375 11.4668V7.29102ZM10.042 4V3.29102H5.95801V4C5.95783 4.34503 5.67808 4.625 5.33301 4.625C4.98809 4.62482 4.70818 4.34492 4.70801 4V3.29297C4.39072 3.29481 4.14362 3.29958 3.9375 3.31641C3.64272 3.34049 3.48709 3.38481 3.37598 3.44141C3.11725 3.57323 2.90624 3.78327 2.77441 4.04199C2.71783 4.15308 2.67448 4.30883 2.65039 4.60352C2.62571 4.90564 2.625 5.29592 2.625 5.86621V6.04102H13.375V5.86621C13.375 5.29591 13.3743 4.90564 13.3496 4.60352C13.3255 4.30883 13.2822 4.15308 13.2256 4.04199C13.0938 3.78327 12.8827 3.57322 12.624 3.44141C12.5129 3.38481 12.3572 3.34049 12.0625 3.31641C11.8564 3.29958 11.6093 3.29481 11.292 3.29297V4C11.2918 4.34492 11.0119 4.62482 10.667 4.625C10.3219 4.625 10.0422 4.34503 10.042 4ZM14.625 11.4668C14.625 12.0163 14.6255 12.4663 14.5957 12.8311C14.5653 13.2031 14.5002 13.5417 14.3389 13.8584C14.0872 14.3522 13.6853 14.7533 13.1914 15.0049C12.8747 15.1662 12.5362 15.2313 12.1641 15.2617C11.7993 15.2915 11.3494 15.291 10.7998 15.291H5.2002C4.65066 15.291 4.20073 15.2915 3.83594 15.2617C3.46383 15.2313 3.12526 15.1662 2.80859 15.0049C2.31476 14.7533 1.91282 14.3522 1.66113 13.8584C1.49981 13.5417 1.43471 13.2031 1.4043 12.8311C1.3745 12.4663 1.375 12.0163 1.375 11.4668V5.86621C1.375 5.31658 1.3745 4.86676 1.4043 4.50195C1.4347 4.1298 1.49976 3.79131 1.66113 3.47461C1.9128 2.98069 2.31467 2.57881 2.80859 2.32715C3.12519 2.16592 3.46393 2.10071 3.83594 2.07031C4.08533 2.04996 4.37446 2.04486 4.70801 2.04297V1.33301C4.70801 0.987938 4.98798 0.708184 5.33301 0.708008C5.67819 0.708008 5.95801 0.98783 5.95801 1.33301V2.04102H10.042V1.33301C10.042 0.98783 10.3218 0.708008 10.667 0.708008C11.012 0.708183 11.292 0.987938 11.292 1.33301V2.04297C11.6255 2.04486 11.9147 2.04996 12.1641 2.07031C12.5361 2.10071 12.8748 2.16593 13.1914 2.32715C13.6854 2.57882 14.0872 2.9807 14.3389 3.47461L14.3945 3.59473C14.5155 3.87672 14.5691 4.17636 14.5957 4.50195C14.6255 4.86677 14.625 5.31659 14.625 5.86621V11.4668Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function CalendarLayoutIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 7.29102H2.625V11.4668C2.625 12.0369 2.62571 12.4274 2.65039 12.7295C2.67449 13.024 2.71781 13.1799 2.77441 13.291C2.90624 13.5497 3.1173 13.7598 3.37598 13.8916C3.48708 13.9482 3.64284 13.9925 3.9375 14.0166C4.23962 14.0413 4.62998 14.041 5.2002 14.041H10.7998C11.37 14.041 11.7604 14.0413 12.0625 14.0166C12.3571 13.9925 12.5129 13.9482 12.624 13.8916C12.8827 13.7598 13.0938 13.5497 13.2256 13.291C13.2822 13.1799 13.3255 13.024 13.3496 12.7295C13.3743 12.4274 13.375 12.0369 13.375 11.4668V7.29102ZM10.042 4V3.29102H5.95801V4C5.95783 4.34503 5.67808 4.625 5.33301 4.625C4.98809 4.62482 4.70818 4.34492 4.70801 4V3.29297C4.39072 3.29481 4.14362 3.29958 3.9375 3.31641C3.64272 3.34049 3.48709 3.38481 3.37598 3.44141C3.11725 3.57323 2.90624 3.78327 2.77441 4.04199C2.71783 4.15308 2.67448 4.30883 2.65039 4.60352C2.62571 4.90564 2.625 5.29592 2.625 5.86621V6.04102H13.375V5.86621C13.375 5.29591 13.3743 4.90564 13.3496 4.60352C13.3255 4.30883 13.2822 4.15308 13.2256 4.04199C13.0938 3.78327 12.8827 3.57322 12.624 3.44141C12.5129 3.38481 12.3572 3.34049 12.0625 3.31641C11.8564 3.29958 11.6093 3.29481 11.292 3.29297V4C11.2918 4.34492 11.0119 4.62482 10.667 4.625C10.3219 4.625 10.0422 4.34503 10.042 4ZM14.625 11.4668C14.625 12.0163 14.6255 12.4663 14.5957 12.8311C14.5653 13.2031 14.5002 13.5417 14.3389 13.8584C14.0872 14.3522 13.6853 14.7533 13.1914 15.0049C12.8747 15.1662 12.5362 15.2313 12.1641 15.2617C11.7993 15.2915 11.3494 15.291 10.7998 15.291H5.2002C4.65066 15.291 4.20073 15.2915 3.83594 15.2617C3.46383 15.2313 3.12526 15.1662 2.80859 15.0049C2.31476 14.7533 1.91282 14.3522 1.66113 13.8584C1.49981 13.5417 1.43471 13.2031 1.4043 12.8311C1.3745 12.4663 1.375 12.0163 1.375 11.4668V5.86621C1.375 5.31658 1.3745 4.86676 1.4043 4.50195C1.4347 4.1298 1.49976 3.79131 1.66113 3.47461C1.9128 2.98069 2.31467 2.57881 2.80859 2.32715C3.12519 2.16592 3.46393 2.10071 3.83594 2.07031C4.08533 2.04996 4.37446 2.04486 4.70801 2.04297V1.33301C4.70801 0.987938 4.98798 0.708184 5.33301 0.708008C5.67819 0.708008 5.95801 0.98783 5.95801 1.33301V2.04102H10.042V1.33301C10.042 0.98783 10.3218 0.708008 10.667 0.708008C11.012 0.708183 11.292 0.987938 11.292 1.33301V2.04297C11.6255 2.04486 11.9147 2.04996 12.1641 2.07031C12.5361 2.10071 12.8748 2.16593 13.1914 2.32715C13.6854 2.57882 14.0872 2.9807 14.3389 3.47461L14.3945 3.59473C14.5155 3.87672 14.5691 4.17636 14.5957 4.50195C14.6255 4.86677 14.625 5.31659 14.625 5.86621V11.4668Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/layouts/card-icon.tsx b/packages/propel/src/icons/layouts/card-icon.tsx
index 6bb7a73b8..480ba7dd8 100644
--- a/packages/propel/src/icons/layouts/card-icon.tsx
+++ b/packages/propel/src/icons/layouts/card-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const CardLayoutIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 11.4668C13.375 11.0832 13.375 10.8326 13.3594 10.6416C13.3519 10.5499 13.3409 10.4857 13.3301 10.4395L13.2979 10.3447C13.2469 10.2448 13.1729 10.1591 13.083 10.0938L12.9883 10.0352C12.9485 10.0149 12.8751 9.98864 12.6914 9.97363C12.5004 9.95804 12.2498 9.95801 11.8662 9.95801H4.13379C3.7502 9.95801 3.49956 9.95804 3.30859 9.97363C3.21688 9.98113 3.15268 9.99208 3.10645 10.0029L3.01172 10.0352C2.87851 10.103 2.77007 10.2114 2.70215 10.3447C2.68187 10.3845 2.65563 10.4579 2.64063 10.6416C2.62503 10.8326 2.625 11.0832 2.625 11.4668V11.8662C2.625 12.2499 2.62502 12.5004 2.64063 12.6914C2.65564 12.875 2.68188 12.9485 2.70215 12.9883C2.77008 13.1215 2.87859 13.23 3.01172 13.2979L3.10645 13.3301C3.15267 13.3409 3.21693 13.3509 3.30859 13.3584C3.49956 13.374 3.75016 13.375 4.13379 13.375H11.8662C12.2498 13.375 12.5004 13.374 12.6914 13.3584C12.8749 13.3434 12.9485 13.3181 12.9883 13.2979L13.083 13.2393C13.1729 13.1739 13.2469 13.0882 13.2979 12.9883C13.3181 12.9485 13.3444 12.875 13.3594 12.6914C13.375 12.5004 13.375 12.2499 13.375 11.8662V11.4668ZM13.375 4.13379C13.375 3.7502 13.375 3.49956 13.3594 3.30859C13.3519 3.21688 13.3409 3.15268 13.3301 3.10645L13.2979 3.01172C13.23 2.8785 13.1216 2.77007 12.9883 2.70215C12.9485 2.68187 12.8751 2.65563 12.6914 2.64063C12.5004 2.62503 12.2498 2.625 11.8662 2.625H4.13379C3.7502 2.625 3.49956 2.62503 3.30859 2.64063C3.12491 2.65563 3.05153 2.68186 3.01172 2.70215C2.87844 2.77005 2.77005 2.87844 2.70215 3.01172C2.68186 3.05153 2.65563 3.12491 2.64063 3.30859C2.62503 3.49956 2.625 3.7502 2.625 4.13379V4.5332C2.625 4.91688 2.62502 5.16742 2.64063 5.3584C2.65564 5.54194 2.68187 5.61548 2.70215 5.65527C2.77006 5.78843 2.87853 5.89698 3.01172 5.96484C3.05156 5.98512 3.12509 6.0104 3.30859 6.02539C3.49956 6.04099 3.75016 6.04199 4.13379 6.04199H11.8662C12.2498 6.04199 12.5004 6.04099 12.6914 6.02539C12.8749 6.0104 12.9485 5.98511 12.9883 5.96484C13.1215 5.89696 13.23 5.78839 13.2979 5.65527C13.3181 5.61548 13.3444 5.54194 13.3594 5.3584C13.375 5.16742 13.375 4.91689 13.375 4.5332V4.13379ZM14.625 11.8662C14.625 12.2293 14.6252 12.5393 14.6045 12.793C14.5832 13.054 14.5362 13.3103 14.4111 13.5557C14.2234 13.924 13.924 14.2235 13.5557 14.4111C13.3103 14.5362 13.0539 14.5832 12.793 14.6045C12.5393 14.6252 12.2291 14.625 11.8662 14.625H4.13379C3.77089 14.625 3.46066 14.6252 3.20703 14.6045C2.94605 14.5832 2.68973 14.5362 2.44434 14.4111C2.07591 14.2235 1.77661 13.9239 1.58887 13.5557C1.46382 13.3103 1.41683 13.054 1.39551 12.793C1.37478 12.5393 1.375 12.2293 1.375 11.8662V11.4668C1.375 11.1039 1.37481 10.7937 1.39551 10.54C1.41683 10.2791 1.46382 10.0227 1.58887 9.77734C1.77657 9.40901 2.07589 9.10961 2.44434 8.92188C2.68974 8.79683 2.94604 8.74984 3.20703 8.72852C3.46067 8.70781 3.77088 8.70801 4.13379 8.70801H11.8662C12.2291 8.70801 12.5393 8.70781 12.793 8.72852C13.054 8.74984 13.3103 8.79682 13.5557 8.92188C13.9241 9.10958 14.2234 9.40896 14.4111 9.77734C14.5362 10.0227 14.5832 10.2791 14.6045 10.54C14.6252 10.7937 14.625 11.1039 14.625 11.4668V11.8662ZM14.625 4.5332C14.625 4.89626 14.6252 5.20627 14.6045 5.45996C14.5832 5.72094 14.5362 5.97726 14.4111 6.22266C14.2234 6.59102 13.924 6.89046 13.5557 7.07812C13.3103 7.20316 13.0539 7.25016 12.793 7.27148C12.5393 7.29218 12.2291 7.29199 11.8662 7.29199H4.13379C3.77089 7.29199 3.46066 7.29218 3.20703 7.27148C2.94605 7.25016 2.68973 7.20316 2.44434 7.07812C2.07597 6.89044 1.77663 6.59098 1.58887 6.22266C1.46383 5.97726 1.41683 5.72094 1.39551 5.45996C1.37478 5.20627 1.375 4.89626 1.375 4.5332V4.13379C1.375 3.77088 1.37481 3.46067 1.39551 3.20703C1.41683 2.94604 1.46383 2.68974 1.58887 2.44434C1.7766 2.07594 2.07594 1.7766 2.44434 1.58887C2.68974 1.46383 2.94604 1.41683 3.20703 1.39551C3.46067 1.37481 3.77088 1.375 4.13379 1.375H11.8662C12.2291 1.375 12.5393 1.37481 12.793 1.39551C13.054 1.41683 13.3103 1.46382 13.5557 1.58887C13.924 1.77658 14.2234 2.0759 14.4111 2.44434C14.5362 2.68974 14.5832 2.94604 14.6045 3.20703C14.6252 3.46067 14.625 3.77088 14.625 4.13379V4.5332Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function CardLayoutIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 11.4668C13.375 11.0832 13.375 10.8326 13.3594 10.6416C13.3519 10.5499 13.3409 10.4857 13.3301 10.4395L13.2979 10.3447C13.2469 10.2448 13.1729 10.1591 13.083 10.0938L12.9883 10.0352C12.9485 10.0149 12.8751 9.98864 12.6914 9.97363C12.5004 9.95804 12.2498 9.95801 11.8662 9.95801H4.13379C3.7502 9.95801 3.49956 9.95804 3.30859 9.97363C3.21688 9.98113 3.15268 9.99208 3.10645 10.0029L3.01172 10.0352C2.87851 10.103 2.77007 10.2114 2.70215 10.3447C2.68187 10.3845 2.65563 10.4579 2.64063 10.6416C2.62503 10.8326 2.625 11.0832 2.625 11.4668V11.8662C2.625 12.2499 2.62502 12.5004 2.64063 12.6914C2.65564 12.875 2.68188 12.9485 2.70215 12.9883C2.77008 13.1215 2.87859 13.23 3.01172 13.2979L3.10645 13.3301C3.15267 13.3409 3.21693 13.3509 3.30859 13.3584C3.49956 13.374 3.75016 13.375 4.13379 13.375H11.8662C12.2498 13.375 12.5004 13.374 12.6914 13.3584C12.8749 13.3434 12.9485 13.3181 12.9883 13.2979L13.083 13.2393C13.1729 13.1739 13.2469 13.0882 13.2979 12.9883C13.3181 12.9485 13.3444 12.875 13.3594 12.6914C13.375 12.5004 13.375 12.2499 13.375 11.8662V11.4668ZM13.375 4.13379C13.375 3.7502 13.375 3.49956 13.3594 3.30859C13.3519 3.21688 13.3409 3.15268 13.3301 3.10645L13.2979 3.01172C13.23 2.8785 13.1216 2.77007 12.9883 2.70215C12.9485 2.68187 12.8751 2.65563 12.6914 2.64063C12.5004 2.62503 12.2498 2.625 11.8662 2.625H4.13379C3.7502 2.625 3.49956 2.62503 3.30859 2.64063C3.12491 2.65563 3.05153 2.68186 3.01172 2.70215C2.87844 2.77005 2.77005 2.87844 2.70215 3.01172C2.68186 3.05153 2.65563 3.12491 2.64063 3.30859C2.62503 3.49956 2.625 3.7502 2.625 4.13379V4.5332C2.625 4.91688 2.62502 5.16742 2.64063 5.3584C2.65564 5.54194 2.68187 5.61548 2.70215 5.65527C2.77006 5.78843 2.87853 5.89698 3.01172 5.96484C3.05156 5.98512 3.12509 6.0104 3.30859 6.02539C3.49956 6.04099 3.75016 6.04199 4.13379 6.04199H11.8662C12.2498 6.04199 12.5004 6.04099 12.6914 6.02539C12.8749 6.0104 12.9485 5.98511 12.9883 5.96484C13.1215 5.89696 13.23 5.78839 13.2979 5.65527C13.3181 5.61548 13.3444 5.54194 13.3594 5.3584C13.375 5.16742 13.375 4.91689 13.375 4.5332V4.13379ZM14.625 11.8662C14.625 12.2293 14.6252 12.5393 14.6045 12.793C14.5832 13.054 14.5362 13.3103 14.4111 13.5557C14.2234 13.924 13.924 14.2235 13.5557 14.4111C13.3103 14.5362 13.0539 14.5832 12.793 14.6045C12.5393 14.6252 12.2291 14.625 11.8662 14.625H4.13379C3.77089 14.625 3.46066 14.6252 3.20703 14.6045C2.94605 14.5832 2.68973 14.5362 2.44434 14.4111C2.07591 14.2235 1.77661 13.9239 1.58887 13.5557C1.46382 13.3103 1.41683 13.054 1.39551 12.793C1.37478 12.5393 1.375 12.2293 1.375 11.8662V11.4668C1.375 11.1039 1.37481 10.7937 1.39551 10.54C1.41683 10.2791 1.46382 10.0227 1.58887 9.77734C1.77657 9.40901 2.07589 9.10961 2.44434 8.92188C2.68974 8.79683 2.94604 8.74984 3.20703 8.72852C3.46067 8.70781 3.77088 8.70801 4.13379 8.70801H11.8662C12.2291 8.70801 12.5393 8.70781 12.793 8.72852C13.054 8.74984 13.3103 8.79682 13.5557 8.92188C13.9241 9.10958 14.2234 9.40896 14.4111 9.77734C14.5362 10.0227 14.5832 10.2791 14.6045 10.54C14.6252 10.7937 14.625 11.1039 14.625 11.4668V11.8662ZM14.625 4.5332C14.625 4.89626 14.6252 5.20627 14.6045 5.45996C14.5832 5.72094 14.5362 5.97726 14.4111 6.22266C14.2234 6.59102 13.924 6.89046 13.5557 7.07812C13.3103 7.20316 13.0539 7.25016 12.793 7.27148C12.5393 7.29218 12.2291 7.29199 11.8662 7.29199H4.13379C3.77089 7.29199 3.46066 7.29218 3.20703 7.27148C2.94605 7.25016 2.68973 7.20316 2.44434 7.07812C2.07597 6.89044 1.77663 6.59098 1.58887 6.22266C1.46383 5.97726 1.41683 5.72094 1.39551 5.45996C1.37478 5.20627 1.375 4.89626 1.375 4.5332V4.13379C1.375 3.77088 1.37481 3.46067 1.39551 3.20703C1.41683 2.94604 1.46383 2.68974 1.58887 2.44434C1.7766 2.07594 2.07594 1.7766 2.44434 1.58887C2.68974 1.46383 2.94604 1.41683 3.20703 1.39551C3.46067 1.37481 3.77088 1.375 4.13379 1.375H11.8662C12.2291 1.375 12.5393 1.37481 12.793 1.39551C13.054 1.41683 13.3103 1.46382 13.5557 1.58887C13.924 1.77658 14.2234 2.0759 14.4111 2.44434C14.5362 2.68974 14.5832 2.94604 14.6045 3.20703C14.6252 3.46067 14.625 3.77088 14.625 4.13379V4.5332Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/layouts/grid-icon.tsx b/packages/propel/src/icons/layouts/grid-icon.tsx
index 58a75ebcd..7cbc9900b 100644
--- a/packages/propel/src/icons/layouts/grid-icon.tsx
+++ b/packages/propel/src/icons/layouts/grid-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const GridLayoutIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M6.0342 10.0127C6.0327 9.99439 6.02964 9.98153 6.02834 9.97267C6.02717 9.97146 6.02672 9.96984 6.02541 9.96877C6.01667 9.96752 6.0042 9.96624 5.98732 9.96486C5.90751 9.95834 5.79662 9.95802 5.59963 9.95802H3.06642C2.86959 9.95802 2.75948 9.95834 2.6797 9.96486C2.66216 9.96629 2.64947 9.96847 2.64064 9.96974C2.63917 9.97102 2.638 9.97219 2.63673 9.97365C2.63546 9.98248 2.63328 9.99518 2.63185 10.0127C2.62534 10.0925 2.62502 10.2026 2.62502 10.3994V12.9326C2.62502 13.1296 2.62533 13.2405 2.63185 13.3203C2.63324 13.3372 2.63451 13.3497 2.63576 13.3584C2.63683 13.3597 2.63844 13.3602 2.63966 13.3613C2.64851 13.3627 2.66138 13.3657 2.6797 13.3672C2.75948 13.3737 2.86959 13.375 3.06642 13.375H5.59963C5.79662 13.375 5.90751 13.3737 5.98732 13.3672C6.00495 13.3658 6.0176 13.3636 6.02638 13.3623C6.02747 13.3613 6.02834 13.3605 6.02931 13.3594C6.03059 13.3506 6.03275 13.338 6.0342 13.3203C6.04072 13.2405 6.04201 13.1296 6.04201 12.9326V10.3994C6.04201 10.2026 6.04071 10.0925 6.0342 10.0127ZM13.3682 10.0127C13.3667 9.99442 13.3636 9.98153 13.3623 9.97267C13.3613 9.97161 13.3605 9.9707 13.3594 9.96974C13.3506 9.96847 13.3378 9.96628 13.3203 9.96486C13.2405 9.95835 13.1304 9.95802 12.9336 9.95802H10.4004C10.2034 9.95802 10.0925 9.95834 10.0127 9.96486C9.99519 9.9663 9.98241 9.96749 9.97365 9.96877C9.97239 9.96985 9.97184 9.97145 9.97072 9.97267C9.96942 9.98152 9.96733 9.99449 9.96584 10.0127C9.95932 10.0925 9.959 10.2026 9.959 10.3994V12.9326C9.959 13.1296 9.95932 13.2405 9.96584 13.3203C9.96728 13.3379 9.96944 13.3506 9.97072 13.3594C9.97169 13.3605 9.97257 13.3613 9.97365 13.3623C9.98241 13.3636 9.99506 13.3658 10.0127 13.3672C10.0925 13.3737 10.2034 13.375 10.4004 13.375H12.9336C13.1305 13.375 13.2405 13.3737 13.3203 13.3672C13.3386 13.3657 13.3515 13.3626 13.3604 13.3613C13.3612 13.3605 13.3625 13.3603 13.3633 13.3594C13.3646 13.3506 13.3667 13.3379 13.3682 13.3203C13.3747 13.2405 13.375 13.1296 13.375 12.9326V10.3994C13.375 10.2026 13.3747 10.0925 13.3682 10.0127ZM6.0342 2.6797C6.0327 2.66138 6.02964 2.64852 6.02834 2.63966C6.02717 2.63844 6.02671 2.63683 6.02541 2.63576C6.01666 2.63451 6.00419 2.63324 5.98732 2.63185C5.90751 2.62533 5.79662 2.62502 5.59963 2.62502H3.06642C2.8696 2.62502 2.75948 2.62533 2.6797 2.63185C2.66216 2.63329 2.64947 2.63546 2.64064 2.63673C2.63918 2.63801 2.63801 2.63918 2.63673 2.64064C2.63546 2.64947 2.63329 2.66216 2.63185 2.6797C2.62533 2.75948 2.62502 2.8696 2.62502 3.06642V5.59963C2.62502 5.79662 2.62533 5.90751 2.63185 5.98732C2.63324 6.00419 2.63451 6.01666 2.63576 6.02541C2.63683 6.02671 2.63844 6.02717 2.63966 6.02834C2.64852 6.02964 2.66138 6.0327 2.6797 6.0342C2.75948 6.04071 2.86959 6.04201 3.06642 6.04201H5.59963C5.79662 6.04201 5.90751 6.04072 5.98732 6.0342C6.00494 6.03275 6.0176 6.03059 6.02638 6.02931C6.02747 6.02834 6.02834 6.02747 6.02931 6.02638C6.03059 6.0176 6.03275 6.00494 6.0342 5.98732C6.04072 5.90751 6.04201 5.79662 6.04201 5.59963V3.06642C6.04201 2.86959 6.04071 2.75948 6.0342 2.6797ZM13.3682 2.6797C13.3667 2.66217 13.3646 2.64947 13.3633 2.64064C13.362 2.63917 13.3608 2.638 13.3594 2.63673C13.3506 2.63546 13.3379 2.63329 13.3203 2.63185C13.2406 2.62534 13.1304 2.62502 12.9336 2.62502H10.4004C10.2034 2.62502 10.0925 2.62533 10.0127 2.63185C9.99523 2.63328 9.98244 2.63449 9.97365 2.63576C9.97221 2.63698 9.97101 2.63825 9.96974 2.63966C9.96844 2.64852 9.96634 2.66154 9.96486 2.6797C9.95834 2.75948 9.95802 2.86961 9.95802 3.06642V5.59963C9.95802 5.79662 9.95834 5.90751 9.96486 5.98732C9.96625 6.00427 9.96849 6.01666 9.96974 6.02541C9.971 6.02691 9.97221 6.02801 9.97365 6.02931C9.98244 6.03059 9.9951 6.03275 10.0127 6.0342C10.0925 6.04072 10.2034 6.04201 10.4004 6.04201H12.9336C13.1304 6.04201 13.2406 6.04071 13.3203 6.0342C13.338 6.03275 13.3506 6.02962 13.3594 6.02834C13.3607 6.02717 13.3622 6.02673 13.3633 6.02541C13.3645 6.01666 13.3668 6.00428 13.3682 5.98732C13.3747 5.90751 13.375 5.79662 13.375 5.59963V3.06642C13.375 2.8696 13.3747 2.75948 13.3682 2.6797ZM7.29201 12.9326C7.29201 13.109 7.29193 13.2794 7.28029 13.4219C7.26806 13.5715 7.23984 13.7451 7.15138 13.919C7.02758 14.162 6.82957 14.3596 6.58693 14.4834C6.41294 14.572 6.23862 14.6011 6.08888 14.6133C5.94636 14.6249 5.77599 14.625 5.59963 14.625H3.06642C2.89023 14.625 2.72055 14.6249 2.57814 14.6133C2.42832 14.6011 2.2542 14.5721 2.08009 14.4834C1.83733 14.3596 1.63949 14.1621 1.51564 13.919C1.42712 13.745 1.39799 13.5716 1.38576 13.4219C1.37411 13.2794 1.37502 13.109 1.37502 12.9326V10.3994C1.37502 10.2232 1.37414 10.0535 1.38576 9.91115C1.398 9.76133 1.42693 9.5872 1.51564 9.4131L1.56545 9.32423C1.6896 9.12181 1.86756 8.95697 2.08009 8.84865C2.25419 8.75993 2.42832 8.73101 2.57814 8.71877C2.72054 8.70715 2.89025 8.70802 3.06642 8.70802H5.59963C5.776 8.70802 5.94636 8.70712 6.08888 8.71877C6.23856 8.731 6.41203 8.76013 6.58595 8.84865C6.82872 8.97245 7.02753 9.17 7.15138 9.4131C7.24007 9.58718 7.26805 9.76135 7.28029 9.91115C7.29191 10.0536 7.29201 10.2232 7.29201 10.3994V12.9326ZM14.625 12.9326C14.625 13.109 14.6259 13.2794 14.6143 13.4219C14.602 13.5717 14.5731 13.7459 14.4844 13.9199C14.3606 14.1628 14.1628 14.3596 13.9199 14.4834C13.7458 14.5721 13.5717 14.6011 13.4219 14.6133C13.2795 14.6249 13.1098 14.625 12.9336 14.625H10.4004C10.224 14.625 10.0537 14.6249 9.91115 14.6133C9.76141 14.601 9.58805 14.5721 9.41408 14.4834C9.1712 14.3597 8.97349 14.1628 8.84963 13.9199C8.76093 13.7459 8.73199 13.5717 8.71974 13.4219C8.7081 13.2794 8.709 13.109 8.709 12.9326V10.3994C8.709 10.2232 8.70812 10.0536 8.71974 9.91115C8.73198 9.76132 8.76091 9.5872 8.84963 9.4131L8.89943 9.32423C9.02353 9.12198 9.20147 8.95699 9.41408 8.84865L9.54396 8.79298C9.6732 8.74695 9.79884 8.72795 9.91115 8.71877C10.0537 8.70712 10.224 8.70802 10.4004 8.70802H12.9336C13.1098 8.70802 13.2795 8.70716 13.4219 8.71877C13.5717 8.73101 13.7459 8.75996 13.9199 8.84865C14.163 8.97248 14.3605 9.1701 14.4844 9.4131C14.5731 9.5872 14.602 9.76132 14.6143 9.91115C14.6259 10.0535 14.625 10.2232 14.625 10.3994V12.9326ZM7.29201 5.59963C7.29201 5.776 7.29193 5.94636 7.28029 6.08888C7.26806 6.23851 7.23984 6.4121 7.15138 6.58595C7.02754 6.82898 6.82898 7.02657 6.58595 7.15041C6.4121 7.23886 6.23851 7.26806 6.08888 7.28029C5.94636 7.29193 5.776 7.29201 5.59963 7.29201H3.06642C2.89023 7.29201 2.72055 7.29191 2.57814 7.28029C2.42834 7.26805 2.25418 7.24007 2.08009 7.15138C1.83722 7.02753 1.63942 6.82887 1.51564 6.58595C1.42712 6.41203 1.39799 6.23856 1.38576 6.08888C1.37411 5.94636 1.37502 5.776 1.37502 5.59963V3.06642C1.37502 2.89025 1.37414 2.72054 1.38576 2.57814C1.398 2.42832 1.42694 2.25419 1.51564 2.08009L1.56545 1.99123C1.68954 1.78891 1.86746 1.62401 2.08009 1.51564L2.20998 1.45998C2.33946 1.4138 2.46565 1.39495 2.57814 1.38576C2.72054 1.37414 2.89025 1.37502 3.06642 1.37502H5.59963C5.776 1.37502 5.94636 1.37411 6.08888 1.38576C6.20119 1.39494 6.32682 1.41396 6.45607 1.45998L6.58595 1.51564L6.6758 1.56545C6.87792 1.68948 7.04208 1.86766 7.15041 2.08009C7.23909 2.25418 7.26805 2.42834 7.28029 2.57814C7.29191 2.72055 7.29201 2.89023 7.29201 3.06642V5.59963ZM14.625 5.59963C14.625 5.77599 14.6249 5.94636 14.6133 6.08888C14.6011 6.23853 14.5729 6.41207 14.4844 6.58595C14.3606 6.82872 14.163 7.02753 13.9199 7.15138C13.7458 7.24009 13.5717 7.26805 13.4219 7.28029C13.2795 7.29191 13.1098 7.29201 12.9336 7.29201H10.4004C10.224 7.29201 10.0537 7.29193 9.91115 7.28029C9.76134 7.26805 9.58718 7.24009 9.4131 7.15138C9.17005 7.02751 8.97242 6.82968 8.84865 6.58693C8.76018 6.41306 8.73198 6.23852 8.71974 6.08888C8.7081 5.94636 8.70802 5.776 8.70802 5.59963V3.06642C8.70802 2.89023 8.70812 2.72056 8.71974 2.57814C8.73198 2.42833 8.75995 2.25418 8.84865 2.08009C8.97239 1.83731 9.17005 1.63955 9.4131 1.51564L9.54396 1.45998C9.67321 1.41398 9.79885 1.39493 9.91115 1.38576C10.0537 1.37412 10.224 1.37502 10.4004 1.37502H12.9336C13.1098 1.37502 13.2795 1.37414 13.4219 1.38576C13.5341 1.39493 13.6599 1.41401 13.7891 1.45998L13.9199 1.51564L14.0088 1.56545C14.2112 1.6896 14.3761 1.86758 14.4844 2.08009C14.5731 2.2542 14.6011 2.42832 14.6133 2.57814C14.6249 2.72056 14.625 2.89022 14.625 3.06642V5.59963Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function GridLayoutIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M6.0342 10.0127C6.0327 9.99439 6.02964 9.98153 6.02834 9.97267C6.02717 9.97146 6.02672 9.96984 6.02541 9.96877C6.01667 9.96752 6.0042 9.96624 5.98732 9.96486C5.90751 9.95834 5.79662 9.95802 5.59963 9.95802H3.06642C2.86959 9.95802 2.75948 9.95834 2.6797 9.96486C2.66216 9.96629 2.64947 9.96847 2.64064 9.96974C2.63917 9.97102 2.638 9.97219 2.63673 9.97365C2.63546 9.98248 2.63328 9.99518 2.63185 10.0127C2.62534 10.0925 2.62502 10.2026 2.62502 10.3994V12.9326C2.62502 13.1296 2.62533 13.2405 2.63185 13.3203C2.63324 13.3372 2.63451 13.3497 2.63576 13.3584C2.63683 13.3597 2.63844 13.3602 2.63966 13.3613C2.64851 13.3627 2.66138 13.3657 2.6797 13.3672C2.75948 13.3737 2.86959 13.375 3.06642 13.375H5.59963C5.79662 13.375 5.90751 13.3737 5.98732 13.3672C6.00495 13.3658 6.0176 13.3636 6.02638 13.3623C6.02747 13.3613 6.02834 13.3605 6.02931 13.3594C6.03059 13.3506 6.03275 13.338 6.0342 13.3203C6.04072 13.2405 6.04201 13.1296 6.04201 12.9326V10.3994C6.04201 10.2026 6.04071 10.0925 6.0342 10.0127ZM13.3682 10.0127C13.3667 9.99442 13.3636 9.98153 13.3623 9.97267C13.3613 9.97161 13.3605 9.9707 13.3594 9.96974C13.3506 9.96847 13.3378 9.96628 13.3203 9.96486C13.2405 9.95835 13.1304 9.95802 12.9336 9.95802H10.4004C10.2034 9.95802 10.0925 9.95834 10.0127 9.96486C9.99519 9.9663 9.98241 9.96749 9.97365 9.96877C9.97239 9.96985 9.97184 9.97145 9.97072 9.97267C9.96942 9.98152 9.96733 9.99449 9.96584 10.0127C9.95932 10.0925 9.959 10.2026 9.959 10.3994V12.9326C9.959 13.1296 9.95932 13.2405 9.96584 13.3203C9.96728 13.3379 9.96944 13.3506 9.97072 13.3594C9.97169 13.3605 9.97257 13.3613 9.97365 13.3623C9.98241 13.3636 9.99506 13.3658 10.0127 13.3672C10.0925 13.3737 10.2034 13.375 10.4004 13.375H12.9336C13.1305 13.375 13.2405 13.3737 13.3203 13.3672C13.3386 13.3657 13.3515 13.3626 13.3604 13.3613C13.3612 13.3605 13.3625 13.3603 13.3633 13.3594C13.3646 13.3506 13.3667 13.3379 13.3682 13.3203C13.3747 13.2405 13.375 13.1296 13.375 12.9326V10.3994C13.375 10.2026 13.3747 10.0925 13.3682 10.0127ZM6.0342 2.6797C6.0327 2.66138 6.02964 2.64852 6.02834 2.63966C6.02717 2.63844 6.02671 2.63683 6.02541 2.63576C6.01666 2.63451 6.00419 2.63324 5.98732 2.63185C5.90751 2.62533 5.79662 2.62502 5.59963 2.62502H3.06642C2.8696 2.62502 2.75948 2.62533 2.6797 2.63185C2.66216 2.63329 2.64947 2.63546 2.64064 2.63673C2.63918 2.63801 2.63801 2.63918 2.63673 2.64064C2.63546 2.64947 2.63329 2.66216 2.63185 2.6797C2.62533 2.75948 2.62502 2.8696 2.62502 3.06642V5.59963C2.62502 5.79662 2.62533 5.90751 2.63185 5.98732C2.63324 6.00419 2.63451 6.01666 2.63576 6.02541C2.63683 6.02671 2.63844 6.02717 2.63966 6.02834C2.64852 6.02964 2.66138 6.0327 2.6797 6.0342C2.75948 6.04071 2.86959 6.04201 3.06642 6.04201H5.59963C5.79662 6.04201 5.90751 6.04072 5.98732 6.0342C6.00494 6.03275 6.0176 6.03059 6.02638 6.02931C6.02747 6.02834 6.02834 6.02747 6.02931 6.02638C6.03059 6.0176 6.03275 6.00494 6.0342 5.98732C6.04072 5.90751 6.04201 5.79662 6.04201 5.59963V3.06642C6.04201 2.86959 6.04071 2.75948 6.0342 2.6797ZM13.3682 2.6797C13.3667 2.66217 13.3646 2.64947 13.3633 2.64064C13.362 2.63917 13.3608 2.638 13.3594 2.63673C13.3506 2.63546 13.3379 2.63329 13.3203 2.63185C13.2406 2.62534 13.1304 2.62502 12.9336 2.62502H10.4004C10.2034 2.62502 10.0925 2.62533 10.0127 2.63185C9.99523 2.63328 9.98244 2.63449 9.97365 2.63576C9.97221 2.63698 9.97101 2.63825 9.96974 2.63966C9.96844 2.64852 9.96634 2.66154 9.96486 2.6797C9.95834 2.75948 9.95802 2.86961 9.95802 3.06642V5.59963C9.95802 5.79662 9.95834 5.90751 9.96486 5.98732C9.96625 6.00427 9.96849 6.01666 9.96974 6.02541C9.971 6.02691 9.97221 6.02801 9.97365 6.02931C9.98244 6.03059 9.9951 6.03275 10.0127 6.0342C10.0925 6.04072 10.2034 6.04201 10.4004 6.04201H12.9336C13.1304 6.04201 13.2406 6.04071 13.3203 6.0342C13.338 6.03275 13.3506 6.02962 13.3594 6.02834C13.3607 6.02717 13.3622 6.02673 13.3633 6.02541C13.3645 6.01666 13.3668 6.00428 13.3682 5.98732C13.3747 5.90751 13.375 5.79662 13.375 5.59963V3.06642C13.375 2.8696 13.3747 2.75948 13.3682 2.6797ZM7.29201 12.9326C7.29201 13.109 7.29193 13.2794 7.28029 13.4219C7.26806 13.5715 7.23984 13.7451 7.15138 13.919C7.02758 14.162 6.82957 14.3596 6.58693 14.4834C6.41294 14.572 6.23862 14.6011 6.08888 14.6133C5.94636 14.6249 5.77599 14.625 5.59963 14.625H3.06642C2.89023 14.625 2.72055 14.6249 2.57814 14.6133C2.42832 14.6011 2.2542 14.5721 2.08009 14.4834C1.83733 14.3596 1.63949 14.1621 1.51564 13.919C1.42712 13.745 1.39799 13.5716 1.38576 13.4219C1.37411 13.2794 1.37502 13.109 1.37502 12.9326V10.3994C1.37502 10.2232 1.37414 10.0535 1.38576 9.91115C1.398 9.76133 1.42693 9.5872 1.51564 9.4131L1.56545 9.32423C1.6896 9.12181 1.86756 8.95697 2.08009 8.84865C2.25419 8.75993 2.42832 8.73101 2.57814 8.71877C2.72054 8.70715 2.89025 8.70802 3.06642 8.70802H5.59963C5.776 8.70802 5.94636 8.70712 6.08888 8.71877C6.23856 8.731 6.41203 8.76013 6.58595 8.84865C6.82872 8.97245 7.02753 9.17 7.15138 9.4131C7.24007 9.58718 7.26805 9.76135 7.28029 9.91115C7.29191 10.0536 7.29201 10.2232 7.29201 10.3994V12.9326ZM14.625 12.9326C14.625 13.109 14.6259 13.2794 14.6143 13.4219C14.602 13.5717 14.5731 13.7459 14.4844 13.9199C14.3606 14.1628 14.1628 14.3596 13.9199 14.4834C13.7458 14.5721 13.5717 14.6011 13.4219 14.6133C13.2795 14.6249 13.1098 14.625 12.9336 14.625H10.4004C10.224 14.625 10.0537 14.6249 9.91115 14.6133C9.76141 14.601 9.58805 14.5721 9.41408 14.4834C9.1712 14.3597 8.97349 14.1628 8.84963 13.9199C8.76093 13.7459 8.73199 13.5717 8.71974 13.4219C8.7081 13.2794 8.709 13.109 8.709 12.9326V10.3994C8.709 10.2232 8.70812 10.0536 8.71974 9.91115C8.73198 9.76132 8.76091 9.5872 8.84963 9.4131L8.89943 9.32423C9.02353 9.12198 9.20147 8.95699 9.41408 8.84865L9.54396 8.79298C9.6732 8.74695 9.79884 8.72795 9.91115 8.71877C10.0537 8.70712 10.224 8.70802 10.4004 8.70802H12.9336C13.1098 8.70802 13.2795 8.70716 13.4219 8.71877C13.5717 8.73101 13.7459 8.75996 13.9199 8.84865C14.163 8.97248 14.3605 9.1701 14.4844 9.4131C14.5731 9.5872 14.602 9.76132 14.6143 9.91115C14.6259 10.0535 14.625 10.2232 14.625 10.3994V12.9326ZM7.29201 5.59963C7.29201 5.776 7.29193 5.94636 7.28029 6.08888C7.26806 6.23851 7.23984 6.4121 7.15138 6.58595C7.02754 6.82898 6.82898 7.02657 6.58595 7.15041C6.4121 7.23886 6.23851 7.26806 6.08888 7.28029C5.94636 7.29193 5.776 7.29201 5.59963 7.29201H3.06642C2.89023 7.29201 2.72055 7.29191 2.57814 7.28029C2.42834 7.26805 2.25418 7.24007 2.08009 7.15138C1.83722 7.02753 1.63942 6.82887 1.51564 6.58595C1.42712 6.41203 1.39799 6.23856 1.38576 6.08888C1.37411 5.94636 1.37502 5.776 1.37502 5.59963V3.06642C1.37502 2.89025 1.37414 2.72054 1.38576 2.57814C1.398 2.42832 1.42694 2.25419 1.51564 2.08009L1.56545 1.99123C1.68954 1.78891 1.86746 1.62401 2.08009 1.51564L2.20998 1.45998C2.33946 1.4138 2.46565 1.39495 2.57814 1.38576C2.72054 1.37414 2.89025 1.37502 3.06642 1.37502H5.59963C5.776 1.37502 5.94636 1.37411 6.08888 1.38576C6.20119 1.39494 6.32682 1.41396 6.45607 1.45998L6.58595 1.51564L6.6758 1.56545C6.87792 1.68948 7.04208 1.86766 7.15041 2.08009C7.23909 2.25418 7.26805 2.42834 7.28029 2.57814C7.29191 2.72055 7.29201 2.89023 7.29201 3.06642V5.59963ZM14.625 5.59963C14.625 5.77599 14.6249 5.94636 14.6133 6.08888C14.6011 6.23853 14.5729 6.41207 14.4844 6.58595C14.3606 6.82872 14.163 7.02753 13.9199 7.15138C13.7458 7.24009 13.5717 7.26805 13.4219 7.28029C13.2795 7.29191 13.1098 7.29201 12.9336 7.29201H10.4004C10.224 7.29201 10.0537 7.29193 9.91115 7.28029C9.76134 7.26805 9.58718 7.24009 9.4131 7.15138C9.17005 7.02751 8.97242 6.82968 8.84865 6.58693C8.76018 6.41306 8.73198 6.23852 8.71974 6.08888C8.7081 5.94636 8.70802 5.776 8.70802 5.59963V3.06642C8.70802 2.89023 8.70812 2.72056 8.71974 2.57814C8.73198 2.42833 8.75995 2.25418 8.84865 2.08009C8.97239 1.83731 9.17005 1.63955 9.4131 1.51564L9.54396 1.45998C9.67321 1.41398 9.79885 1.39493 9.91115 1.38576C10.0537 1.37412 10.224 1.37502 10.4004 1.37502H12.9336C13.1098 1.37502 13.2795 1.37414 13.4219 1.38576C13.5341 1.39493 13.6599 1.41401 13.7891 1.45998L13.9199 1.51564L14.0088 1.56545C14.2112 1.6896 14.3761 1.86758 14.4844 2.08009C14.5731 2.2542 14.6011 2.42832 14.6133 2.57814C14.6249 2.72056 14.625 2.89022 14.625 3.06642V5.59963Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/layouts/list-icon.tsx b/packages/propel/src/icons/layouts/list-icon.tsx
index af71829de..14fe11150 100644
--- a/packages/propel/src/icons/layouts/list-icon.tsx
+++ b/packages/propel/src/icons/layouts/list-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ListLayoutIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M14 11.375C14.3452 11.375 14.625 11.6548 14.625 12C14.625 12.3452 14.3452 12.625 14 12.625H2C1.65482 12.625 1.375 12.3452 1.375 12C1.375 11.6548 1.65482 11.375 2 11.375H14ZM14 7.375C14.3452 7.375 14.625 7.65482 14.625 8C14.625 8.34518 14.3452 8.625 14 8.625H2C1.65482 8.625 1.375 8.34518 1.375 8C1.375 7.65482 1.65482 7.375 2 7.375H14ZM14 3.375C14.3452 3.375 14.625 3.65482 14.625 4C14.625 4.34518 14.3452 4.625 14 4.625H2C1.65482 4.625 1.375 4.34518 1.375 4C1.375 3.65482 1.65482 3.375 2 3.375H14Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function ListLayoutIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M14 11.375C14.3452 11.375 14.625 11.6548 14.625 12C14.625 12.3452 14.3452 12.625 14 12.625H2C1.65482 12.625 1.375 12.3452 1.375 12C1.375 11.6548 1.65482 11.375 2 11.375H14ZM14 7.375C14.3452 7.375 14.625 7.65482 14.625 8C14.625 8.34518 14.3452 8.625 14 8.625H2C1.65482 8.625 1.375 8.34518 1.375 8C1.375 7.65482 1.65482 7.375 2 7.375H14ZM14 3.375C14.3452 3.375 14.625 3.65482 14.625 4C14.625 4.34518 14.3452 4.625 14 4.625H2C1.65482 4.625 1.375 4.34518 1.375 4C1.375 3.65482 1.65482 3.375 2 3.375H14Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/layouts/sheet-icon.tsx b/packages/propel/src/icons/layouts/sheet-icon.tsx
index 12cdbdc3f..9f2e4eb96 100644
--- a/packages/propel/src/icons/layouts/sheet-icon.tsx
+++ b/packages/propel/src/icons/layouts/sheet-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const SheetLayoutIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 6.625H6.625V13.375H10.7998C11.3701 13.375 11.7604 13.3743 12.0625 13.3496C12.357 13.3255 12.5129 13.2821 12.624 13.2256C12.8827 13.0938 13.0938 12.8827 13.2256 12.624C13.2821 12.5129 13.3255 12.357 13.3496 12.0625C13.3743 11.7604 13.375 11.3701 13.375 10.7998V6.625ZM2.625 10.7998C2.625 11.3701 2.62572 11.7604 2.65039 12.0625C2.67445 12.357 2.71788 12.5129 2.77441 12.624C2.90623 12.8827 3.11725 13.0938 3.37598 13.2256C3.48707 13.2821 3.64295 13.3255 3.9375 13.3496C4.23962 13.3743 4.62994 13.375 5.2002 13.375H5.375V6.625H2.625V10.7998ZM13.375 5.2002C13.375 4.62994 13.3743 4.23962 13.3496 3.9375C13.3255 3.64295 13.2821 3.48707 13.2256 3.37598C13.0938 3.11725 12.8827 2.90623 12.624 2.77441C12.5129 2.71788 12.357 2.67445 12.0625 2.65039C11.7604 2.62572 11.3701 2.625 10.7998 2.625H5.2002C4.62994 2.625 4.23962 2.62572 3.9375 2.65039C3.64296 2.67446 3.48707 2.71788 3.37598 2.77441C3.11725 2.90624 2.90624 3.11725 2.77441 3.37598C2.71788 3.48707 2.67446 3.64296 2.65039 3.9375C2.62572 4.23962 2.625 4.62994 2.625 5.2002V5.375H13.375V5.2002ZM14.625 10.7998C14.625 11.3493 14.6255 11.7993 14.5957 12.1641C14.5653 12.5361 14.5001 12.8748 14.3389 13.1914C14.0872 13.6854 13.6854 14.0872 13.1914 14.3389C12.8748 14.5001 12.5361 14.5653 12.1641 14.5957C11.7993 14.6255 11.3493 14.625 10.7998 14.625H5.2002C4.65067 14.625 4.20072 14.6255 3.83594 14.5957C3.46388 14.5653 3.12523 14.5002 2.80859 14.3389C2.31467 14.0872 1.91281 13.6854 1.66113 13.1914C1.49987 12.8748 1.4347 12.5361 1.4043 12.1641C1.37452 11.7993 1.375 11.3493 1.375 10.7998V5.2002C1.375 4.65067 1.37452 4.20072 1.4043 3.83594C1.4347 3.46388 1.49985 3.12523 1.66113 2.80859C1.9128 2.31466 2.31466 1.9128 2.80859 1.66113C3.12523 1.49985 3.46388 1.4347 3.83594 1.4043C4.20072 1.37452 4.65067 1.375 5.2002 1.375H10.7998C11.3493 1.375 11.7993 1.37452 12.1641 1.4043C12.5361 1.4347 12.8748 1.49987 13.1914 1.66113C13.6854 1.91281 14.0872 2.31467 14.3389 2.80859C14.5002 3.12523 14.5653 3.46388 14.5957 3.83594C14.6255 4.20072 14.625 4.65067 14.625 5.2002V10.7998Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function SheetLayoutIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 6.625H6.625V13.375H10.7998C11.3701 13.375 11.7604 13.3743 12.0625 13.3496C12.357 13.3255 12.5129 13.2821 12.624 13.2256C12.8827 13.0938 13.0938 12.8827 13.2256 12.624C13.2821 12.5129 13.3255 12.357 13.3496 12.0625C13.3743 11.7604 13.375 11.3701 13.375 10.7998V6.625ZM2.625 10.7998C2.625 11.3701 2.62572 11.7604 2.65039 12.0625C2.67445 12.357 2.71788 12.5129 2.77441 12.624C2.90623 12.8827 3.11725 13.0938 3.37598 13.2256C3.48707 13.2821 3.64295 13.3255 3.9375 13.3496C4.23962 13.3743 4.62994 13.375 5.2002 13.375H5.375V6.625H2.625V10.7998ZM13.375 5.2002C13.375 4.62994 13.3743 4.23962 13.3496 3.9375C13.3255 3.64295 13.2821 3.48707 13.2256 3.37598C13.0938 3.11725 12.8827 2.90623 12.624 2.77441C12.5129 2.71788 12.357 2.67445 12.0625 2.65039C11.7604 2.62572 11.3701 2.625 10.7998 2.625H5.2002C4.62994 2.625 4.23962 2.62572 3.9375 2.65039C3.64296 2.67446 3.48707 2.71788 3.37598 2.77441C3.11725 2.90624 2.90624 3.11725 2.77441 3.37598C2.71788 3.48707 2.67446 3.64296 2.65039 3.9375C2.62572 4.23962 2.625 4.62994 2.625 5.2002V5.375H13.375V5.2002ZM14.625 10.7998C14.625 11.3493 14.6255 11.7993 14.5957 12.1641C14.5653 12.5361 14.5001 12.8748 14.3389 13.1914C14.0872 13.6854 13.6854 14.0872 13.1914 14.3389C12.8748 14.5001 12.5361 14.5653 12.1641 14.5957C11.7993 14.6255 11.3493 14.625 10.7998 14.625H5.2002C4.65067 14.625 4.20072 14.6255 3.83594 14.5957C3.46388 14.5653 3.12523 14.5002 2.80859 14.3389C2.31467 14.0872 1.91281 13.6854 1.66113 13.1914C1.49987 12.8748 1.4347 12.5361 1.4043 12.1641C1.37452 11.7993 1.375 11.3493 1.375 10.7998V5.2002C1.375 4.65067 1.37452 4.20072 1.4043 3.83594C1.4347 3.46388 1.49985 3.12523 1.66113 2.80859C1.9128 2.31466 2.31466 1.9128 2.80859 1.66113C3.12523 1.49985 3.46388 1.4347 3.83594 1.4043C4.20072 1.37452 4.65067 1.375 5.2002 1.375H10.7998C11.3493 1.375 11.7993 1.37452 12.1641 1.4043C12.5361 1.4347 12.8748 1.49987 13.1914 1.66113C13.6854 1.91281 14.0872 2.31467 14.3389 2.80859C14.5002 3.12523 14.5653 3.46388 14.5957 3.83594C14.6255 4.20072 14.625 4.65067 14.625 5.2002V10.7998Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/layouts/timeline-icon.tsx b/packages/propel/src/icons/layouts/timeline-icon.tsx
index 7c0669dce..91a01cb6b 100644
--- a/packages/propel/src/icons/layouts/timeline-icon.tsx
+++ b/packages/propel/src/icons/layouts/timeline-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const TimelineLayoutIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.5415 11.333C13.5415 11.0142 13.5416 10.8062 13.5308 10.6465C13.5203 10.4927 13.5017 10.4293 13.4878 10.3955C13.4159 10.2221 13.2784 10.0837 13.105 10.0117C13.0713 9.99777 13.008 9.98025 12.854 9.96973C12.6943 9.95884 12.4857 9.95802 12.1665 9.95802H6.8335C6.51462 9.95802 6.30666 9.95887 6.14698 9.96973C5.99329 9.98022 5.92974 9.9978 5.896 10.0117C5.72244 10.0836 5.58411 10.222 5.51222 10.3955C5.49828 10.4293 5.48071 10.4928 5.47022 10.6465C5.45935 10.8062 5.4585 11.0141 5.4585 11.333C5.4585 11.6519 5.45935 11.8599 5.47022 12.0195C5.48071 12.1732 5.49828 12.2368 5.51222 12.2705C5.58411 12.4441 5.72244 12.5824 5.896 12.6543C5.92974 12.6682 5.99329 12.6858 6.14698 12.6963C6.30666 12.7072 6.51462 12.708 6.8335 12.708H12.1665C12.4857 12.708 12.6943 12.7072 12.854 12.6963C13.008 12.6858 13.0713 12.6683 13.105 12.6543C13.2784 12.5824 13.4159 12.444 13.4878 12.2705C13.5017 12.2368 13.5203 12.1733 13.5308 12.0195C13.5416 11.8599 13.5415 11.6519 13.5415 11.333ZM10.5415 4.667C10.5415 4.34815 10.5416 4.14015 10.5308 3.98048C10.5203 3.82667 10.5017 3.76324 10.4878 3.7295C10.4159 3.55605 10.2784 3.41765 10.105 3.34571C10.0713 3.33176 10.008 3.31424 9.85401 3.30372C9.69428 3.29282 9.4857 3.292 9.16651 3.292H3.8335C3.51462 3.292 3.30666 3.29285 3.14698 3.30372C2.99329 3.31421 2.92974 3.33178 2.896 3.34571C2.72244 3.4176 2.58411 3.55594 2.51222 3.7295C2.49828 3.76324 2.48071 3.82678 2.47022 3.98048C2.45935 4.14015 2.4585 4.34811 2.4585 4.667C2.4585 4.98589 2.45935 5.19385 2.47022 5.35352C2.48071 5.50722 2.49828 5.57076 2.51222 5.6045C2.58411 5.77806 2.72244 5.9164 2.896 5.98829C2.92974 6.00222 2.99329 6.0198 3.14698 6.03028C3.30666 6.04115 3.51462 6.042 3.8335 6.042H9.16651C9.4857 6.042 9.69428 6.04118 9.85401 6.03028C10.008 6.01976 10.0713 6.00224 10.105 5.98829C10.2784 5.91635 10.4159 5.77795 10.4878 5.6045C10.5017 5.57076 10.5203 5.50733 10.5308 5.35352C10.5416 5.19385 10.5415 4.98585 10.5415 4.667ZM14.7915 11.333C14.7915 11.6351 14.7923 11.8933 14.7778 12.1055C14.763 12.3231 14.7305 12.5378 14.6431 12.749C14.4443 13.2289 14.0623 13.6098 13.5825 13.8086C13.3712 13.8961 13.1567 13.9295 12.939 13.9443C12.7268 13.9588 12.4686 13.958 12.1665 13.958H6.8335C6.53143 13.958 6.27319 13.9588 6.06104 13.9443C5.8434 13.9295 5.62874 13.8961 5.41749 13.8086C4.93769 13.6098 4.55668 13.2288 4.35792 12.749C4.27042 12.5378 4.23704 12.3231 4.22218 12.1055C4.2077 11.8933 4.2085 11.6351 4.2085 11.333C4.2085 11.0309 4.2077 10.7727 4.22218 10.5606C4.23704 10.3429 4.27042 10.1283 4.35792 9.917C4.55668 9.4372 4.93769 9.05619 5.41749 8.85743C5.62874 8.76993 5.8434 8.73656 6.06104 8.72169C6.27319 8.70721 6.53143 8.70802 6.8335 8.70802H12.1665C12.4686 8.70802 12.7268 8.70721 12.939 8.72169C13.1567 8.73654 13.3712 8.76996 13.5825 8.85743C14.0623 9.05618 14.4443 9.43715 14.6431 9.917C14.7305 10.1282 14.763 10.343 14.7778 10.5606C14.7923 10.7727 14.7915 11.0309 14.7915 11.333ZM11.7915 4.667C11.7915 4.96908 11.7923 5.22732 11.7778 5.43946C11.763 5.65705 11.7305 5.87183 11.6431 6.08302C11.4443 6.56287 11.0623 6.94384 10.5825 7.14259C10.3712 7.23005 10.1567 7.26347 9.93897 7.27833C9.72682 7.2928 9.46859 7.292 9.16651 7.292H3.8335C3.53143 7.292 3.27319 7.2928 3.06104 7.27833C2.8434 7.26346 2.62874 7.23009 2.41749 7.14259C1.93769 6.94383 1.55668 6.56281 1.35792 6.08302C1.27042 5.87177 1.23704 5.65711 1.22218 5.43946C1.2077 5.22731 1.2085 4.96908 1.2085 4.667C1.2085 4.36492 1.2077 4.10669 1.22218 3.89454C1.23704 3.67689 1.27042 3.46224 1.35792 3.25098C1.55668 2.77119 1.93769 2.39017 2.41749 2.19141C2.62874 2.10391 2.8434 2.07054 3.06104 2.05567C3.27319 2.0412 3.53143 2.042 3.8335 2.042H9.16651C9.46859 2.042 9.72682 2.0412 9.93897 2.05567C10.1567 2.07053 10.3712 2.10395 10.5825 2.19141C11.0623 2.39017 11.4443 2.77113 11.6431 3.25098C11.7305 3.46218 11.763 3.67695 11.7778 3.89454C11.7923 4.10668 11.7915 4.36492 11.7915 4.667Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function TimelineLayoutIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.5415 11.333C13.5415 11.0142 13.5416 10.8062 13.5308 10.6465C13.5203 10.4927 13.5017 10.4293 13.4878 10.3955C13.4159 10.2221 13.2784 10.0837 13.105 10.0117C13.0713 9.99777 13.008 9.98025 12.854 9.96973C12.6943 9.95884 12.4857 9.95802 12.1665 9.95802H6.8335C6.51462 9.95802 6.30666 9.95887 6.14698 9.96973C5.99329 9.98022 5.92974 9.9978 5.896 10.0117C5.72244 10.0836 5.58411 10.222 5.51222 10.3955C5.49828 10.4293 5.48071 10.4928 5.47022 10.6465C5.45935 10.8062 5.4585 11.0141 5.4585 11.333C5.4585 11.6519 5.45935 11.8599 5.47022 12.0195C5.48071 12.1732 5.49828 12.2368 5.51222 12.2705C5.58411 12.4441 5.72244 12.5824 5.896 12.6543C5.92974 12.6682 5.99329 12.6858 6.14698 12.6963C6.30666 12.7072 6.51462 12.708 6.8335 12.708H12.1665C12.4857 12.708 12.6943 12.7072 12.854 12.6963C13.008 12.6858 13.0713 12.6683 13.105 12.6543C13.2784 12.5824 13.4159 12.444 13.4878 12.2705C13.5017 12.2368 13.5203 12.1733 13.5308 12.0195C13.5416 11.8599 13.5415 11.6519 13.5415 11.333ZM10.5415 4.667C10.5415 4.34815 10.5416 4.14015 10.5308 3.98048C10.5203 3.82667 10.5017 3.76324 10.4878 3.7295C10.4159 3.55605 10.2784 3.41765 10.105 3.34571C10.0713 3.33176 10.008 3.31424 9.85401 3.30372C9.69428 3.29282 9.4857 3.292 9.16651 3.292H3.8335C3.51462 3.292 3.30666 3.29285 3.14698 3.30372C2.99329 3.31421 2.92974 3.33178 2.896 3.34571C2.72244 3.4176 2.58411 3.55594 2.51222 3.7295C2.49828 3.76324 2.48071 3.82678 2.47022 3.98048C2.45935 4.14015 2.4585 4.34811 2.4585 4.667C2.4585 4.98589 2.45935 5.19385 2.47022 5.35352C2.48071 5.50722 2.49828 5.57076 2.51222 5.6045C2.58411 5.77806 2.72244 5.9164 2.896 5.98829C2.92974 6.00222 2.99329 6.0198 3.14698 6.03028C3.30666 6.04115 3.51462 6.042 3.8335 6.042H9.16651C9.4857 6.042 9.69428 6.04118 9.85401 6.03028C10.008 6.01976 10.0713 6.00224 10.105 5.98829C10.2784 5.91635 10.4159 5.77795 10.4878 5.6045C10.5017 5.57076 10.5203 5.50733 10.5308 5.35352C10.5416 5.19385 10.5415 4.98585 10.5415 4.667ZM14.7915 11.333C14.7915 11.6351 14.7923 11.8933 14.7778 12.1055C14.763 12.3231 14.7305 12.5378 14.6431 12.749C14.4443 13.2289 14.0623 13.6098 13.5825 13.8086C13.3712 13.8961 13.1567 13.9295 12.939 13.9443C12.7268 13.9588 12.4686 13.958 12.1665 13.958H6.8335C6.53143 13.958 6.27319 13.9588 6.06104 13.9443C5.8434 13.9295 5.62874 13.8961 5.41749 13.8086C4.93769 13.6098 4.55668 13.2288 4.35792 12.749C4.27042 12.5378 4.23704 12.3231 4.22218 12.1055C4.2077 11.8933 4.2085 11.6351 4.2085 11.333C4.2085 11.0309 4.2077 10.7727 4.22218 10.5606C4.23704 10.3429 4.27042 10.1283 4.35792 9.917C4.55668 9.4372 4.93769 9.05619 5.41749 8.85743C5.62874 8.76993 5.8434 8.73656 6.06104 8.72169C6.27319 8.70721 6.53143 8.70802 6.8335 8.70802H12.1665C12.4686 8.70802 12.7268 8.70721 12.939 8.72169C13.1567 8.73654 13.3712 8.76996 13.5825 8.85743C14.0623 9.05618 14.4443 9.43715 14.6431 9.917C14.7305 10.1282 14.763 10.343 14.7778 10.5606C14.7923 10.7727 14.7915 11.0309 14.7915 11.333ZM11.7915 4.667C11.7915 4.96908 11.7923 5.22732 11.7778 5.43946C11.763 5.65705 11.7305 5.87183 11.6431 6.08302C11.4443 6.56287 11.0623 6.94384 10.5825 7.14259C10.3712 7.23005 10.1567 7.26347 9.93897 7.27833C9.72682 7.2928 9.46859 7.292 9.16651 7.292H3.8335C3.53143 7.292 3.27319 7.2928 3.06104 7.27833C2.8434 7.26346 2.62874 7.23009 2.41749 7.14259C1.93769 6.94383 1.55668 6.56281 1.35792 6.08302C1.27042 5.87177 1.23704 5.65711 1.22218 5.43946C1.2077 5.22731 1.2085 4.96908 1.2085 4.667C1.2085 4.36492 1.2077 4.10669 1.22218 3.89454C1.23704 3.67689 1.27042 3.46224 1.35792 3.25098C1.55668 2.77119 1.93769 2.39017 2.41749 2.19141C2.62874 2.10391 2.8434 2.07054 3.06104 2.05567C3.27319 2.0412 3.53143 2.042 3.8335 2.042H9.16651C9.46859 2.042 9.72682 2.0412 9.93897 2.05567C10.1567 2.07053 10.3712 2.10395 10.5825 2.19141C11.0623 2.39017 11.4443 2.77113 11.6431 3.25098C11.7305 3.46218 11.763 3.67695 11.7778 3.89454C11.7923 4.10668 11.7915 4.36492 11.7915 4.667Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/lead-icon.tsx b/packages/propel/src/icons/lead-icon.tsx
index c093b65a7..bd7c107e5 100644
--- a/packages/propel/src/icons/lead-icon.tsx
+++ b/packages/propel/src/icons/lead-icon.tsx
@@ -2,25 +2,27 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const LeadIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg className={className} viewBox="0 0 19 18" fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
-    <path
-      d="M0.571533 9C0.571533 4.02944 4.60097 0 9.57153 0C14.5421 0 18.5715 4.02944 18.5715 9C18.5715 13.9706 14.5421 18 9.57153 18C4.60097 18 0.571533 13.9706 0.571533 9Z"
-      fill="#3372FF"
-    />
-    <g clipPath="url(#clip0_8992_2377)">
-      <circle cx="9.57153" cy="6.5" r="2.5" fill="#F5F5FF" />
+export function LeadIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg className={className} viewBox="0 0 19 18" fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
       <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M8.94653 9.625C6.53029 9.625 4.57153 11.5838 4.57153 14H9.57153H14.5715C14.5715 11.5838 12.6128 9.625 10.1965 9.625H9.82153L10.8215 13.0278L9.57153 14L8.32153 13.0278L9.32153 9.625H8.94653Z"
-        fill="#F5F5FF"
+        d="M0.571533 9C0.571533 4.02944 4.60097 0 9.57153 0C14.5421 0 18.5715 4.02944 18.5715 9C18.5715 13.9706 14.5421 18 9.57153 18C4.60097 18 0.571533 13.9706 0.571533 9Z"
+        fill="#3372FF"
       />
-    </g>
-    <defs>
-      <clipPath id="clip0_8992_2377">
-        <rect width="10" height="10" fill="white" transform="translate(4.57153 4)" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+      <g clipPath="url(#clip0_8992_2377)">
+        <circle cx="9.57153" cy="6.5" r="2.5" fill="#F5F5FF" />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M8.94653 9.625C6.53029 9.625 4.57153 11.5838 4.57153 14H9.57153H14.5715C14.5715 11.5838 12.6128 9.625 10.1965 9.625H9.82153L10.8215 13.0278L9.57153 14L8.32153 13.0278L9.32153 9.625H8.94653Z"
+          fill="#F5F5FF"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_8992_2377">
+          <rect width="10" height="10" fill="white" transform="translate(4.57153 4)" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/module/backlog.tsx b/packages/propel/src/icons/module/backlog.tsx
index 0ae7de2da..1a4ff0a6c 100644
--- a/packages/propel/src/icons/module/backlog.tsx
+++ b/packages/propel/src/icons/module/backlog.tsx
@@ -2,38 +2,35 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const ModuleBacklogIcon: React.FC<ISvgIcons> = ({
-  width = "20",
-  height = "20",
-  className,
-  color = "#a3a3a3",
-}) => (
-  <svg
-    height={height}
-    width={width}
-    className={className}
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 323.15 323.03"
-  >
-    <g id="Layer_2" data-name="Layer 2">
-      <g id="Layer_1-2" data-name="Layer 1">
-        <path
-          fill={color}
-          d="M163.42,322.92A172.12,172.12,0,0,1,104.8,312.7c-3.92-1.4-5.22-3.05-3.07-7.1,2.4-4.52,3-11.38,6.64-13.48s9.34,2.47,14.23,3.81c29.55,8.11,58.78,7.25,87.57-3.31,4.08-1.5,5.86-1.05,7.09,3.21a82.63,82.63,0,0,0,4.6,11c1.19,2.57,1,4.06-2,5.2a163.84,163.84,0,0,1-40.05,9.76C173.84,322.45,167.89,323.34,163.42,322.92Z"
-        />
-        <path
-          fill={color}
-          d="M.07,163a174.76,174.76,0,0,1,10.07-58c1.59-4.57,3.53-5.59,7.8-3.2a61,61,0,0,0,10.11,4.19c3.11,1.06,4.07,2.46,2.71,5.79-6.43,15.73-9.17,32.33-9.23,49.14a132.65,132.65,0,0,0,8.17,47.35c2.44,6.5,2.33,6.57-4.06,9.35-3.35,1.45-6.83,2.63-10.11,4.23-2.44,1.19-3.54.49-4.43-1.86a162.3,162.3,0,0,1-10-41C.51,173.12-.24,167.17.07,163Z"
-        />
-        <path
-          fill={color}
-          d="M323,160.16a169.68,169.68,0,0,1-10.2,58.09c-1.45,4.08-3.21,5.07-7.14,3a105.3,105.3,0,0,0-11.48-4.81c-2.23-.85-3.2-1.85-2.16-4.41a133.86,133.86,0,0,0,9.57-48.59,132,132,0,0,0-8.9-50.69c-1.67-4.24-.8-5.79,3.29-7a84,84,0,0,0,11-4.62c2.65-1.24,4.05-.82,5.16,2.12a159.68,159.68,0,0,1,9.68,39C322.56,148.71,323.52,155.17,323,160.16Z"
-        />
-        <path
-          fill={color}
-          d="M161.59,0a164.28,164.28,0,0,1,58,10.72c2.81,1,3.75,2,2.41,4.93-2,4.38-3.86,8.84-5.5,13.37-.93,2.56-2.28,2.77-4.53,1.87a137.94,137.94,0,0,0-99.35-.52c-3.43,1.32-5.3,1.35-6.45-2.69a50.33,50.33,0,0,0-4.55-11c-2.25-3.93-.36-5.11,2.9-6.29A165.32,165.32,0,0,1,161.59,0Z"
-        />
+export function ModuleBacklogIcon({ width = "20", height = "20", className, color = "#a3a3a3" }: ISvgIcons) {
+  return (
+    <svg
+      height={height}
+      width={width}
+      className={className}
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 323.15 323.03"
+    >
+      <g id="Layer_2" data-name="Layer 2">
+        <g id="Layer_1-2" data-name="Layer 1">
+          <path
+            fill={color}
+            d="M163.42,322.92A172.12,172.12,0,0,1,104.8,312.7c-3.92-1.4-5.22-3.05-3.07-7.1,2.4-4.52,3-11.38,6.64-13.48s9.34,2.47,14.23,3.81c29.55,8.11,58.78,7.25,87.57-3.31,4.08-1.5,5.86-1.05,7.09,3.21a82.63,82.63,0,0,0,4.6,11c1.19,2.57,1,4.06-2,5.2a163.84,163.84,0,0,1-40.05,9.76C173.84,322.45,167.89,323.34,163.42,322.92Z"
+          />
+          <path
+            fill={color}
+            d="M.07,163a174.76,174.76,0,0,1,10.07-58c1.59-4.57,3.53-5.59,7.8-3.2a61,61,0,0,0,10.11,4.19c3.11,1.06,4.07,2.46,2.71,5.79-6.43,15.73-9.17,32.33-9.23,49.14a132.65,132.65,0,0,0,8.17,47.35c2.44,6.5,2.33,6.57-4.06,9.35-3.35,1.45-6.83,2.63-10.11,4.23-2.44,1.19-3.54.49-4.43-1.86a162.3,162.3,0,0,1-10-41C.51,173.12-.24,167.17.07,163Z"
+          />
+          <path
+            fill={color}
+            d="M323,160.16a169.68,169.68,0,0,1-10.2,58.09c-1.45,4.08-3.21,5.07-7.14,3a105.3,105.3,0,0,0-11.48-4.81c-2.23-.85-3.2-1.85-2.16-4.41a133.86,133.86,0,0,0,9.57-48.59,132,132,0,0,0-8.9-50.69c-1.67-4.24-.8-5.79,3.29-7a84,84,0,0,0,11-4.62c2.65-1.24,4.05-.82,5.16,2.12a159.68,159.68,0,0,1,9.68,39C322.56,148.71,323.52,155.17,323,160.16Z"
+          />
+          <path
+            fill={color}
+            d="M161.59,0a164.28,164.28,0,0,1,58,10.72c2.81,1,3.75,2,2.41,4.93-2,4.38-3.86,8.84-5.5,13.37-.93,2.56-2.28,2.77-4.53,1.87a137.94,137.94,0,0,0-99.35-.52c-3.43,1.32-5.3,1.35-6.45-2.69a50.33,50.33,0,0,0-4.55-11c-2.25-3.93-.36-5.11,2.9-6.29A165.32,165.32,0,0,1,161.59,0Z"
+          />
+        </g>
       </g>
-    </g>
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/module/cancelled.tsx b/packages/propel/src/icons/module/cancelled.tsx
index 2194ce3e0..c8498cf60 100644
--- a/packages/propel/src/icons/module/cancelled.tsx
+++ b/packages/propel/src/icons/module/cancelled.tsx
@@ -2,25 +2,27 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const ModuleCancelledIcon: React.FC<ISvgIcons> = ({ width = "20", height = "20", className }) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 16 16"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g clipPath="url(#clip0_4052_100277)">
-      <path
-        d="M8 8.84L10.58 11.42C10.7 11.54 10.84 11.6 11 11.6C11.16 11.6 11.3 11.54 11.42 11.42C11.54 11.3 11.6 11.16 11.6 11C11.6 10.84 11.54 10.7 11.42 10.58L8.84 8L11.42 5.42C11.54 5.3 11.6 5.16 11.6 5C11.6 4.84 11.54 4.7 11.42 4.58C11.3 4.46 11.16 4.4 11 4.4C10.84 4.4 10.7 4.46 10.58 4.58L8 7.16L5.42 4.58C5.3 4.46 5.16 4.4 5 4.4C4.84 4.4 4.7 4.46 4.58 4.58C4.46 4.7 4.4 4.84 4.4 5C4.4 5.16 4.46 5.3 4.58 5.42L7.16 8L4.58 10.58C4.46 10.7 4.4 10.84 4.4 11C4.4 11.16 4.46 11.3 4.58 11.42C4.7 11.54 4.84 11.6 5 11.6C5.16 11.6 5.3 11.54 5.42 11.42L8 8.84ZM8 16C6.90667 16 5.87333 15.79 4.9 15.37C3.92667 14.95 3.07667 14.3767 2.35 13.65C1.62333 12.9233 1.05 12.0733 0.63 11.1C0.21 10.1267 0 9.09333 0 8C0 6.89333 0.21 5.85333 0.63 4.88C1.05 3.90667 1.62333 3.06 2.35 2.34C3.07667 1.62 3.92667 1.05 4.9 0.63C5.87333 0.21 6.90667 0 8 0C9.10667 0 10.1467 0.21 11.12 0.63C12.0933 1.05 12.94 1.62 13.66 2.34C14.38 3.06 14.95 3.90667 15.37 4.88C15.79 5.85333 16 6.89333 16 8C16 9.09333 15.79 10.1267 15.37 11.1C14.95 12.0733 14.38 12.9233 13.66 13.65C12.94 14.3767 12.0933 14.95 11.12 15.37C10.1467 15.79 9.10667 16 8 16ZM8 14.8C9.89333 14.8 11.5 14.1367 12.82 12.81C14.14 11.4833 14.8 9.88 14.8 8C14.8 6.10667 14.14 4.5 12.82 3.18C11.5 1.86 9.89333 1.2 8 1.2C6.12 1.2 4.51667 1.86 3.19 3.18C1.86333 4.5 1.2 6.10667 1.2 8C1.2 9.88 1.86333 11.4833 3.19 12.81C4.51667 14.1367 6.12 14.8 8 14.8Z"
-        fill="#ef4444"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_4052_100277">
-        <rect width="16" height="16" fill="white" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function ModuleCancelledIcon({ width = "20", height = "20", className }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g clipPath="url(#clip0_4052_100277)">
+        <path
+          d="M8 8.84L10.58 11.42C10.7 11.54 10.84 11.6 11 11.6C11.16 11.6 11.3 11.54 11.42 11.42C11.54 11.3 11.6 11.16 11.6 11C11.6 10.84 11.54 10.7 11.42 10.58L8.84 8L11.42 5.42C11.54 5.3 11.6 5.16 11.6 5C11.6 4.84 11.54 4.7 11.42 4.58C11.3 4.46 11.16 4.4 11 4.4C10.84 4.4 10.7 4.46 10.58 4.58L8 7.16L5.42 4.58C5.3 4.46 5.16 4.4 5 4.4C4.84 4.4 4.7 4.46 4.58 4.58C4.46 4.7 4.4 4.84 4.4 5C4.4 5.16 4.46 5.3 4.58 5.42L7.16 8L4.58 10.58C4.46 10.7 4.4 10.84 4.4 11C4.4 11.16 4.46 11.3 4.58 11.42C4.7 11.54 4.84 11.6 5 11.6C5.16 11.6 5.3 11.54 5.42 11.42L8 8.84ZM8 16C6.90667 16 5.87333 15.79 4.9 15.37C3.92667 14.95 3.07667 14.3767 2.35 13.65C1.62333 12.9233 1.05 12.0733 0.63 11.1C0.21 10.1267 0 9.09333 0 8C0 6.89333 0.21 5.85333 0.63 4.88C1.05 3.90667 1.62333 3.06 2.35 2.34C3.07667 1.62 3.92667 1.05 4.9 0.63C5.87333 0.21 6.90667 0 8 0C9.10667 0 10.1467 0.21 11.12 0.63C12.0933 1.05 12.94 1.62 13.66 2.34C14.38 3.06 14.95 3.90667 15.37 4.88C15.79 5.85333 16 6.89333 16 8C16 9.09333 15.79 10.1267 15.37 11.1C14.95 12.0733 14.38 12.9233 13.66 13.65C12.94 14.3767 12.0933 14.95 11.12 15.37C10.1467 15.79 9.10667 16 8 16ZM8 14.8C9.89333 14.8 11.5 14.1367 12.82 12.81C14.14 11.4833 14.8 9.88 14.8 8C14.8 6.10667 14.14 4.5 12.82 3.18C11.5 1.86 9.89333 1.2 8 1.2C6.12 1.2 4.51667 1.86 3.19 3.18C1.86333 4.5 1.2 6.10667 1.2 8C1.2 9.88 1.86333 11.4833 3.19 12.81C4.51667 14.1367 6.12 14.8 8 14.8Z"
+          fill="#ef4444"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_4052_100277">
+          <rect width="16" height="16" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/module/completed.tsx b/packages/propel/src/icons/module/completed.tsx
index caf6ebb74..77d432d58 100644
--- a/packages/propel/src/icons/module/completed.tsx
+++ b/packages/propel/src/icons/module/completed.tsx
@@ -2,18 +2,20 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const ModuleCompletedIcon: React.FC<ISvgIcons> = ({ width = "20", height = "20", className }) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 16 16"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      d="M6.80486 9.80731L4.84856 7.85103C4.73197 7.73443 4.58542 7.67478 4.4089 7.67208C4.23238 7.66937 4.08312 7.72902 3.96113 7.85103C3.83913 7.97302 3.77814 8.12093 3.77814 8.29474C3.77814 8.46855 3.83913 8.61645 3.96113 8.73844L6.27206 11.0494C6.42428 11.2016 6.60188 11.2777 6.80486 11.2777C7.00782 11.2777 7.18541 11.2016 7.33764 11.0494L12.0227 6.36435C12.1393 6.24776 12.1989 6.10121 12.2016 5.92469C12.2043 5.74817 12.1447 5.59891 12.0227 5.47692C11.9007 5.35493 11.7528 5.29393 11.579 5.29393C11.4051 5.29393 11.2572 5.35493 11.1353 5.47692L6.80486 9.80731ZM8.00141 16C6.89494 16 5.85491 15.79 4.88132 15.3701C3.90772 14.9502 3.06082 14.3803 2.34064 13.6604C1.62044 12.9405 1.05028 12.094 0.63017 11.1208C0.210057 10.1477 0 9.10788 0 8.00141C0 6.89494 0.209966 5.85491 0.629896 4.88132C1.04983 3.90772 1.61972 3.06082 2.33958 2.34064C3.05946 1.62044 3.90598 1.05028 4.87915 0.630171C5.8523 0.210058 6.89212 0 7.99859 0C9.10506 0 10.1451 0.209966 11.1187 0.629897C12.0923 1.04983 12.9392 1.61972 13.6594 2.33959C14.3796 3.05946 14.9497 3.90598 15.3698 4.87915C15.7899 5.8523 16 6.89212 16 7.99859C16 9.10506 15.79 10.1451 15.3701 11.1187C14.9502 12.0923 14.3803 12.9392 13.6604 13.6594C12.9405 14.3796 12.094 14.9497 11.1208 15.3698C10.1477 15.7899 9.10788 16 8.00141 16ZM8 14.7369C9.88071 14.7369 11.4737 14.0842 12.779 12.779C14.0842 11.4737 14.7369 9.88071 14.7369 8C14.7369 6.11929 14.0842 4.52631 12.779 3.22104C11.4737 1.91577 9.88071 1.26314 8 1.26314C6.11929 1.26314 4.52631 1.91577 3.22104 3.22104C1.91577 4.52631 1.26314 6.11929 1.26314 8C1.26314 9.88071 1.91577 11.4737 3.22104 12.779C4.52631 14.0842 6.11929 14.7369 8 14.7369Z"
-      fill="#16a34a"
-    />
-  </svg>
-);
+export function ModuleCompletedIcon({ width = "20", height = "20", className }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M6.80486 9.80731L4.84856 7.85103C4.73197 7.73443 4.58542 7.67478 4.4089 7.67208C4.23238 7.66937 4.08312 7.72902 3.96113 7.85103C3.83913 7.97302 3.77814 8.12093 3.77814 8.29474C3.77814 8.46855 3.83913 8.61645 3.96113 8.73844L6.27206 11.0494C6.42428 11.2016 6.60188 11.2777 6.80486 11.2777C7.00782 11.2777 7.18541 11.2016 7.33764 11.0494L12.0227 6.36435C12.1393 6.24776 12.1989 6.10121 12.2016 5.92469C12.2043 5.74817 12.1447 5.59891 12.0227 5.47692C11.9007 5.35493 11.7528 5.29393 11.579 5.29393C11.4051 5.29393 11.2572 5.35493 11.1353 5.47692L6.80486 9.80731ZM8.00141 16C6.89494 16 5.85491 15.79 4.88132 15.3701C3.90772 14.9502 3.06082 14.3803 2.34064 13.6604C1.62044 12.9405 1.05028 12.094 0.63017 11.1208C0.210057 10.1477 0 9.10788 0 8.00141C0 6.89494 0.209966 5.85491 0.629896 4.88132C1.04983 3.90772 1.61972 3.06082 2.33958 2.34064C3.05946 1.62044 3.90598 1.05028 4.87915 0.630171C5.8523 0.210058 6.89212 0 7.99859 0C9.10506 0 10.1451 0.209966 11.1187 0.629897C12.0923 1.04983 12.9392 1.61972 13.6594 2.33959C14.3796 3.05946 14.9497 3.90598 15.3698 4.87915C15.7899 5.8523 16 6.89212 16 7.99859C16 9.10506 15.79 10.1451 15.3701 11.1187C14.9502 12.0923 14.3803 12.9392 13.6604 13.6594C12.9405 14.3796 12.094 14.9497 11.1208 15.3698C10.1477 15.7899 9.10788 16 8.00141 16ZM8 14.7369C9.88071 14.7369 11.4737 14.0842 12.779 12.779C14.0842 11.4737 14.7369 9.88071 14.7369 8C14.7369 6.11929 14.0842 4.52631 12.779 3.22104C11.4737 1.91577 9.88071 1.26314 8 1.26314C6.11929 1.26314 4.52631 1.91577 3.22104 3.22104C1.91577 4.52631 1.26314 6.11929 1.26314 8C1.26314 9.88071 1.91577 11.4737 3.22104 12.779C4.52631 14.0842 6.11929 14.7369 8 14.7369Z"
+        fill="#16a34a"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/module/in-progress.tsx b/packages/propel/src/icons/module/in-progress.tsx
index 6b996c500..8fa4681de 100644
--- a/packages/propel/src/icons/module/in-progress.tsx
+++ b/packages/propel/src/icons/module/in-progress.tsx
@@ -2,42 +2,39 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const ModuleInProgressIcon: React.FC<ISvgIcons> = ({
-  width = "20",
-  height = "20",
-  className,
-  color = "#f39e1f",
-}) => (
-  <svg
-    height={height}
-    width={width}
-    className={className}
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 152.93 152.95"
-  >
-    <g id="Layer_2" data-name="Layer 2">
-      <g id="Layer_1-2" data-name="Layer 1">
-        <path
-          fill={color}
-          d="M77.74,0C35.63-.62.78,32.9,0,74.94c-.77,42.74,33,77.34,76.23,78A76.48,76.48,0,0,0,77.74,0ZM75.46,142.68a66.24,66.24,0,1,1,3-132.45c35.71,1,66.31,31.26,64.16,70.08A66.23,66.23,0,0,1,75.46,142.68Z"
-        />
-        <path
-          fill={color}
-          d="M124.29,76.58a49.52,49.52,0,0,1-3.11,16.9c-.38,1-.77,1.27-1.81.78-2.15-1-4.34-1.92-6.56-2.72-1.3-.46-1.51-1-1-2.3a36.61,36.61,0,0,0,.64-23.77c-1-3.48-1.06-3.47,2.38-4.88,1.57-.65,3.15-1.27,4.68-2,.94-.44,1.34-.22,1.69.75A49.74,49.74,0,0,1,124.29,76.58Z"
-        />
-        <path
-          fill={color}
-          d="M94.65,32.63c-.1.22-.19.42-.27.63-1,2.5-2.08,5-3.09,7.51-.28.69-.55.89-1.37.59a37.3,37.3,0,0,0-26.82,0c-.91.34-1.15.08-1.46-.7-1-2.46-2-4.92-3.06-7.34-.42-.92-.07-1.18.69-1.46a47.66,47.66,0,0,1,34.43,0C94.06,32,94.68,32,94.65,32.63Z"
-        />
-        <path
-          fill={color}
-          d="M28.72,76.67a48.27,48.27,0,0,1,3-17.13c.45-1.25.92-1.34,2-.83,2.25,1,4.56,2,6.87,2.87.86.34,1.05.67.71,1.58a36.85,36.85,0,0,0-.07,26.36c.36,1,.3,1.46-.75,1.86-2.38.9-4.72,1.88-7,2.92-1,.43-1.33.2-1.68-.76A46.76,46.76,0,0,1,28.72,76.67Z"
-        />
-        <path
-          fill={color}
-          d="M76.37,124.22a48.11,48.11,0,0,1-16.91-3.08c-1.05-.38-1.26-.8-.79-1.82,1-2.31,2-4.66,2.93-7,.34-.87.69-1.06,1.61-.72a37.06,37.06,0,0,0,26.67,0c.75-.28,1.09-.23,1.39.55,1,2.56,2,5.13,3.18,7.65.49,1.08-.3,1.13-.86,1.34A46.53,46.53,0,0,1,76.37,124.22Z"
-        />
+export function ModuleInProgressIcon({ width = "20", height = "20", className, color = "#f39e1f" }: ISvgIcons) {
+  return (
+    <svg
+      height={height}
+      width={width}
+      className={className}
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 152.93 152.95"
+    >
+      <g id="Layer_2" data-name="Layer 2">
+        <g id="Layer_1-2" data-name="Layer 1">
+          <path
+            fill={color}
+            d="M77.74,0C35.63-.62.78,32.9,0,74.94c-.77,42.74,33,77.34,76.23,78A76.48,76.48,0,0,0,77.74,0ZM75.46,142.68a66.24,66.24,0,1,1,3-132.45c35.71,1,66.31,31.26,64.16,70.08A66.23,66.23,0,0,1,75.46,142.68Z"
+          />
+          <path
+            fill={color}
+            d="M124.29,76.58a49.52,49.52,0,0,1-3.11,16.9c-.38,1-.77,1.27-1.81.78-2.15-1-4.34-1.92-6.56-2.72-1.3-.46-1.51-1-1-2.3a36.61,36.61,0,0,0,.64-23.77c-1-3.48-1.06-3.47,2.38-4.88,1.57-.65,3.15-1.27,4.68-2,.94-.44,1.34-.22,1.69.75A49.74,49.74,0,0,1,124.29,76.58Z"
+          />
+          <path
+            fill={color}
+            d="M94.65,32.63c-.1.22-.19.42-.27.63-1,2.5-2.08,5-3.09,7.51-.28.69-.55.89-1.37.59a37.3,37.3,0,0,0-26.82,0c-.91.34-1.15.08-1.46-.7-1-2.46-2-4.92-3.06-7.34-.42-.92-.07-1.18.69-1.46a47.66,47.66,0,0,1,34.43,0C94.06,32,94.68,32,94.65,32.63Z"
+          />
+          <path
+            fill={color}
+            d="M28.72,76.67a48.27,48.27,0,0,1,3-17.13c.45-1.25.92-1.34,2-.83,2.25,1,4.56,2,6.87,2.87.86.34,1.05.67.71,1.58a36.85,36.85,0,0,0-.07,26.36c.36,1,.3,1.46-.75,1.86-2.38.9-4.72,1.88-7,2.92-1,.43-1.33.2-1.68-.76A46.76,46.76,0,0,1,28.72,76.67Z"
+          />
+          <path
+            fill={color}
+            d="M76.37,124.22a48.11,48.11,0,0,1-16.91-3.08c-1.05-.38-1.26-.8-.79-1.82,1-2.31,2-4.66,2.93-7,.34-.87.69-1.06,1.61-.72a37.06,37.06,0,0,0,26.67,0c.75-.28,1.09-.23,1.39.55,1,2.56,2,5.13,3.18,7.65.49,1.08-.3,1.13-.86,1.34A46.53,46.53,0,0,1,76.37,124.22Z"
+          />
+        </g>
       </g>
-    </g>
-  </svg>
-);
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/module/module-status-icon.tsx b/packages/propel/src/icons/module/module-status-icon.tsx
index 9b9fcddd1..875dd5ed4 100644
--- a/packages/propel/src/icons/module/module-status-icon.tsx
+++ b/packages/propel/src/icons/module/module-status-icon.tsx
@@ -16,7 +16,7 @@ type Props = {
   width?: string;
 };
 
-export const ModuleStatusIcon: React.FC<Props> = ({ status, className, height = "12px", width = "12px" }) => {
+export function ModuleStatusIcon({ status, className, height = "12px", width = "12px" }: Props) {
   if (status === "backlog") return <ModuleBacklogIcon className={className} height={height} width={width} />;
   else if (status === "cancelled") return <ModuleCancelledIcon className={className} height={height} width={width} />;
   else if (status === "completed") return <ModuleCompletedIcon className={className} height={height} width={width} />;
@@ -24,4 +24,4 @@ export const ModuleStatusIcon: React.FC<Props> = ({ status, className, height =
     return <ModuleInProgressIcon className={className} height={height} width={width} />;
   else if (status === "paused") return <ModulePausedIcon className={className} height={height} width={width} />;
   else return <ModulePlannedIcon className={className} height={height} width={width} />;
-};
+}
diff --git a/packages/propel/src/icons/module/paused.tsx b/packages/propel/src/icons/module/paused.tsx
index 021d2a8e1..d3afc0b52 100644
--- a/packages/propel/src/icons/module/paused.tsx
+++ b/packages/propel/src/icons/module/paused.tsx
@@ -2,25 +2,27 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const ModulePausedIcon: React.FC<ISvgIcons> = ({ width = "20", height = "20", className }) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 16 16"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g clipPath="url(#clip0_4052_100275)">
-      <path
-        d="M6.4435 10.34C6.6145 10.34 6.75667 10.2825 6.87 10.1675C6.98333 10.0525 7.04 9.91 7.04 9.74V6.24C7.04 6.07 6.98217 5.9275 6.8665 5.8125C6.75082 5.6975 6.60749 5.64 6.4365 5.64C6.2655 5.64 6.12333 5.6975 6.01 5.8125C5.89667 5.9275 5.84 6.07 5.84 6.24V9.74C5.84 9.91 5.89783 10.0525 6.0135 10.1675C6.12918 10.2825 6.27251 10.34 6.4435 10.34ZM9.5635 10.34C9.7345 10.34 9.87667 10.2825 9.99 10.1675C10.1033 10.0525 10.16 9.91 10.16 9.74V6.24C10.16 6.07 10.1022 5.9275 9.9865 5.8125C9.87082 5.6975 9.72749 5.64 9.5565 5.64C9.3855 5.64 9.24333 5.6975 9.13 5.8125C9.01667 5.9275 8.96 6.07 8.96 6.24V9.74C8.96 9.91 9.01783 10.0525 9.1335 10.1675C9.24918 10.2825 9.39251 10.34 9.5635 10.34ZM8 16C6.89333 16 5.85333 15.79 4.88 15.37C3.90667 14.95 3.06 14.38 2.34 13.66C1.62 12.94 1.05 12.0933 0.63 11.12C0.21 10.1467 0 9.10667 0 8C0 7.54667 0.0366667 7.09993 0.11 6.6598C0.183333 6.21965 0.293333 5.78639 0.44 5.36C0.493333 5.21333 0.593333 5.11667 0.74 5.07C0.886667 5.02333 1.02667 5.04199 1.16 5.12596C1.30285 5.20993 1.40523 5.33327 1.46714 5.49596C1.52905 5.65865 1.54 5.82 1.5 5.98C1.42 6.31333 1.35 6.64765 1.29 6.98294C1.23 7.31823 1.2 7.65725 1.2 8C1.2 9.89833 1.85875 11.5063 3.17624 12.8238C4.49375 14.1413 6.10167 14.8 8 14.8C9.89833 14.8 11.5063 14.1413 12.8238 12.8238C14.1413 11.5063 14.8 9.89833 14.8 8C14.8 6.10167 14.1413 4.49375 12.8238 3.17624C11.5063 1.85875 9.89833 1.2 8 1.2C7.63235 1.2 7.26852 1.22667 6.90852 1.28C6.54852 1.33333 6.19235 1.41333 5.84 1.52C5.68 1.57333 5.52 1.56667 5.36 1.5C5.2 1.43333 5.08667 1.32667 5.02 1.18C4.95333 1.03333 4.96 0.886667 5.04 0.74C5.12 0.593333 5.23333 0.493333 5.38 0.44C5.79333 0.306667 6.21333 0.2 6.64 0.12C7.06667 0.04 7.49333 0 7.92 0C9.02667 0 10.07 0.21 11.05 0.63C12.03 1.05 12.8863 1.62 13.6189 2.34C14.3516 3.06 14.9316 3.90667 15.3589 4.88C15.7863 5.85333 16 6.89333 16 8C16 9.10667 15.79 10.1467 15.37 11.12C14.95 12.0933 14.38 12.94 13.66 13.66C12.94 14.38 12.0933 14.95 11.12 15.37C10.1467 15.79 9.10667 16 8 16ZM2.65764 3.62C2.37921 3.62 2.14333 3.52255 1.95 3.32764C1.75667 3.13275 1.66 2.89608 1.66 2.61764C1.66 2.33921 1.75745 2.10333 1.95236 1.91C2.14725 1.71667 2.38392 1.62 2.66236 1.62C2.94079 1.62 3.17667 1.71745 3.37 1.91236C3.56333 2.10725 3.66 2.34392 3.66 2.62236C3.66 2.90079 3.56255 3.13667 3.36764 3.33C3.17275 3.52333 2.93608 3.62 2.65764 3.62Z"
-        fill="#525252"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_4052_100275">
-        <rect width="16" height="16" fill="white" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function ModulePausedIcon({ width = "20", height = "20", className }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g clipPath="url(#clip0_4052_100275)">
+        <path
+          d="M6.4435 10.34C6.6145 10.34 6.75667 10.2825 6.87 10.1675C6.98333 10.0525 7.04 9.91 7.04 9.74V6.24C7.04 6.07 6.98217 5.9275 6.8665 5.8125C6.75082 5.6975 6.60749 5.64 6.4365 5.64C6.2655 5.64 6.12333 5.6975 6.01 5.8125C5.89667 5.9275 5.84 6.07 5.84 6.24V9.74C5.84 9.91 5.89783 10.0525 6.0135 10.1675C6.12918 10.2825 6.27251 10.34 6.4435 10.34ZM9.5635 10.34C9.7345 10.34 9.87667 10.2825 9.99 10.1675C10.1033 10.0525 10.16 9.91 10.16 9.74V6.24C10.16 6.07 10.1022 5.9275 9.9865 5.8125C9.87082 5.6975 9.72749 5.64 9.5565 5.64C9.3855 5.64 9.24333 5.6975 9.13 5.8125C9.01667 5.9275 8.96 6.07 8.96 6.24V9.74C8.96 9.91 9.01783 10.0525 9.1335 10.1675C9.24918 10.2825 9.39251 10.34 9.5635 10.34ZM8 16C6.89333 16 5.85333 15.79 4.88 15.37C3.90667 14.95 3.06 14.38 2.34 13.66C1.62 12.94 1.05 12.0933 0.63 11.12C0.21 10.1467 0 9.10667 0 8C0 7.54667 0.0366667 7.09993 0.11 6.6598C0.183333 6.21965 0.293333 5.78639 0.44 5.36C0.493333 5.21333 0.593333 5.11667 0.74 5.07C0.886667 5.02333 1.02667 5.04199 1.16 5.12596C1.30285 5.20993 1.40523 5.33327 1.46714 5.49596C1.52905 5.65865 1.54 5.82 1.5 5.98C1.42 6.31333 1.35 6.64765 1.29 6.98294C1.23 7.31823 1.2 7.65725 1.2 8C1.2 9.89833 1.85875 11.5063 3.17624 12.8238C4.49375 14.1413 6.10167 14.8 8 14.8C9.89833 14.8 11.5063 14.1413 12.8238 12.8238C14.1413 11.5063 14.8 9.89833 14.8 8C14.8 6.10167 14.1413 4.49375 12.8238 3.17624C11.5063 1.85875 9.89833 1.2 8 1.2C7.63235 1.2 7.26852 1.22667 6.90852 1.28C6.54852 1.33333 6.19235 1.41333 5.84 1.52C5.68 1.57333 5.52 1.56667 5.36 1.5C5.2 1.43333 5.08667 1.32667 5.02 1.18C4.95333 1.03333 4.96 0.886667 5.04 0.74C5.12 0.593333 5.23333 0.493333 5.38 0.44C5.79333 0.306667 6.21333 0.2 6.64 0.12C7.06667 0.04 7.49333 0 7.92 0C9.02667 0 10.07 0.21 11.05 0.63C12.03 1.05 12.8863 1.62 13.6189 2.34C14.3516 3.06 14.9316 3.90667 15.3589 4.88C15.7863 5.85333 16 6.89333 16 8C16 9.10667 15.79 10.1467 15.37 11.12C14.95 12.0933 14.38 12.94 13.66 13.66C12.94 14.38 12.0933 14.95 11.12 15.37C10.1467 15.79 9.10667 16 8 16ZM2.65764 3.62C2.37921 3.62 2.14333 3.52255 1.95 3.32764C1.75667 3.13275 1.66 2.89608 1.66 2.61764C1.66 2.33921 1.75745 2.10333 1.95236 1.91C2.14725 1.71667 2.38392 1.62 2.66236 1.62C2.94079 1.62 3.17667 1.71745 3.37 1.91236C3.56333 2.10725 3.66 2.34392 3.66 2.62236C3.66 2.90079 3.56255 3.13667 3.36764 3.33C3.17275 3.52333 2.93608 3.62 2.65764 3.62Z"
+          fill="#525252"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_4052_100275">
+          <rect width="16" height="16" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/module/planned.tsx b/packages/propel/src/icons/module/planned.tsx
index 0dd0433a7..6dba8888a 100644
--- a/packages/propel/src/icons/module/planned.tsx
+++ b/packages/propel/src/icons/module/planned.tsx
@@ -2,18 +2,20 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const ModulePlannedIcon: React.FC<ISvgIcons> = ({ width = "20", height = "20", className }) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 16 16"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <path
-      d="M8.57177 7.43329L11.3665 10.228C11.4883 10.3498 11.5441 10.4809 11.5339 10.6213C11.5238 10.7617 11.4578 10.8928 11.336 11.0146C11.2142 11.1364 11.0794 11.1973 10.9317 11.1973C10.784 11.1973 10.6492 11.1364 10.5274 11.0146L7.64476 8.12349C7.57709 8.05582 7.52408 7.98139 7.48574 7.90018C7.4474 7.81898 7.42823 7.72538 7.42823 7.61936V3.51362C7.42823 3.35574 7.48405 3.22097 7.5957 3.10932C7.70734 2.99768 7.84211 2.94185 8 2.94185C8.15789 2.94185 8.29266 2.99768 8.4043 3.10932C8.51595 3.22097 8.57177 3.35574 8.57177 3.51362V7.43329ZM0.806954 11.4933C0.573486 11.04 0.390212 10.5655 0.257131 10.0698C0.124064 9.57411 0.0383541 9.07477 0 8.57177H1.15709C1.18077 8.98793 1.24646 9.38746 1.35418 9.77036C1.46188 10.1533 1.60427 10.5297 1.78133 10.8996L0.806954 11.4933ZM0.021992 7.42823C0.0603462 6.92523 0.143806 6.4273 0.272371 5.93444C0.400937 5.4416 0.579131 4.96567 0.806954 4.50665L1.80333 5.07842C1.62062 5.44834 1.47315 5.82983 1.36093 6.22287C1.24872 6.61591 1.18077 7.0177 1.15709 7.42823H0.021992ZM3.52381 14.6128C3.10877 14.3286 2.71855 14.0103 2.35315 13.6578C1.98774 13.3054 1.66294 12.9217 1.37872 12.5067L2.3751 11.9044C2.5939 12.2507 2.84879 12.5656 3.13976 12.8492C3.43073 13.1329 3.74934 13.3914 4.09558 13.6249L3.52381 14.6128ZM2.3751 4.09558L1.37872 3.52381C1.66294 3.09411 1.98408 2.70163 2.34215 2.34637C2.70023 1.99112 3.09411 1.67139 3.52381 1.38719L4.09558 2.3751C3.75837 2.60856 3.44568 2.86571 3.15753 3.14653C2.86937 3.42736 2.60856 3.7437 2.3751 4.09558ZM7.42823 16C6.92523 15.9616 6.4273 15.8745 5.93444 15.7386C5.4416 15.6027 4.96567 15.4209 4.50665 15.193L5.07842 14.2187C5.44834 14.4014 5.82983 14.5452 6.22287 14.6501C6.61591 14.7549 7.0177 14.8192 7.42823 14.8429V16ZM5.10042 1.80333L4.50665 0.806954C4.96567 0.579131 5.4416 0.397272 5.93444 0.261376C6.4273 0.125479 6.92523 0.0383541 7.42823 0V1.15709C7.0177 1.18077 6.61957 1.24872 6.23386 1.36093C5.84815 1.47315 5.47034 1.62062 5.10042 1.80333ZM8.57177 16V14.8429C8.9823 14.8192 9.38409 14.7549 9.77713 14.6501C10.1702 14.5452 10.5517 14.4014 10.9216 14.2187L11.4933 15.193C11.0343 15.4209 10.5584 15.6027 10.0656 15.7386C9.5727 15.8745 9.07477 15.9616 8.57177 16ZM10.9216 1.78133C10.5517 1.59862 10.1702 1.45482 9.77713 1.34994C9.38409 1.24505 8.9823 1.18077 8.57177 1.15709V0C9.07477 0.0383541 9.5727 0.125479 10.0656 0.261376C10.5584 0.397272 11.0343 0.579131 11.4933 0.806954L10.9216 1.78133ZM12.4762 14.6128L11.9044 13.6469C12.2563 13.4134 12.5726 13.149 12.8535 12.8535C13.1343 12.558 13.3914 12.2416 13.6249 11.9044L14.6128 12.4982C14.3286 12.9132 14.0052 13.297 13.6426 13.6494C13.28 14.0018 12.8912 14.323 12.4762 14.6128ZM13.6249 4.08713C13.3914 3.74991 13.1306 3.43862 12.8425 3.15328C12.5543 2.86796 12.2416 2.60856 11.9044 2.3751L12.4762 1.38719C12.8912 1.67703 13.28 1.99817 13.6426 2.3506C14.0052 2.70304 14.3314 3.08678 14.6213 3.50181L13.6249 4.08713ZM14.8429 7.42823C14.8192 7.0177 14.7535 6.61957 14.6458 6.23386C14.5381 5.84815 14.3929 5.46752 14.2102 5.09197L15.193 4.50665C15.4265 4.96003 15.6098 5.43314 15.7429 5.926C15.8759 6.41884 15.9616 6.91958 16 7.42823H14.8429ZM15.193 11.4933L14.2187 10.9216C14.4014 10.5517 14.5452 10.1702 14.6501 9.77713C14.7549 9.38409 14.8192 8.9823 14.8429 8.57177H16C15.9616 9.07477 15.8745 9.5727 15.7386 10.0656C15.6027 10.5584 15.4209 11.0343 15.193 11.4933Z"
-      fill="#3f76ff"
-    />
-  </svg>
-);
+export function ModulePlannedIcon({ width = "20", height = "20", className }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M8.57177 7.43329L11.3665 10.228C11.4883 10.3498 11.5441 10.4809 11.5339 10.6213C11.5238 10.7617 11.4578 10.8928 11.336 11.0146C11.2142 11.1364 11.0794 11.1973 10.9317 11.1973C10.784 11.1973 10.6492 11.1364 10.5274 11.0146L7.64476 8.12349C7.57709 8.05582 7.52408 7.98139 7.48574 7.90018C7.4474 7.81898 7.42823 7.72538 7.42823 7.61936V3.51362C7.42823 3.35574 7.48405 3.22097 7.5957 3.10932C7.70734 2.99768 7.84211 2.94185 8 2.94185C8.15789 2.94185 8.29266 2.99768 8.4043 3.10932C8.51595 3.22097 8.57177 3.35574 8.57177 3.51362V7.43329ZM0.806954 11.4933C0.573486 11.04 0.390212 10.5655 0.257131 10.0698C0.124064 9.57411 0.0383541 9.07477 0 8.57177H1.15709C1.18077 8.98793 1.24646 9.38746 1.35418 9.77036C1.46188 10.1533 1.60427 10.5297 1.78133 10.8996L0.806954 11.4933ZM0.021992 7.42823C0.0603462 6.92523 0.143806 6.4273 0.272371 5.93444C0.400937 5.4416 0.579131 4.96567 0.806954 4.50665L1.80333 5.07842C1.62062 5.44834 1.47315 5.82983 1.36093 6.22287C1.24872 6.61591 1.18077 7.0177 1.15709 7.42823H0.021992ZM3.52381 14.6128C3.10877 14.3286 2.71855 14.0103 2.35315 13.6578C1.98774 13.3054 1.66294 12.9217 1.37872 12.5067L2.3751 11.9044C2.5939 12.2507 2.84879 12.5656 3.13976 12.8492C3.43073 13.1329 3.74934 13.3914 4.09558 13.6249L3.52381 14.6128ZM2.3751 4.09558L1.37872 3.52381C1.66294 3.09411 1.98408 2.70163 2.34215 2.34637C2.70023 1.99112 3.09411 1.67139 3.52381 1.38719L4.09558 2.3751C3.75837 2.60856 3.44568 2.86571 3.15753 3.14653C2.86937 3.42736 2.60856 3.7437 2.3751 4.09558ZM7.42823 16C6.92523 15.9616 6.4273 15.8745 5.93444 15.7386C5.4416 15.6027 4.96567 15.4209 4.50665 15.193L5.07842 14.2187C5.44834 14.4014 5.82983 14.5452 6.22287 14.6501C6.61591 14.7549 7.0177 14.8192 7.42823 14.8429V16ZM5.10042 1.80333L4.50665 0.806954C4.96567 0.579131 5.4416 0.397272 5.93444 0.261376C6.4273 0.125479 6.92523 0.0383541 7.42823 0V1.15709C7.0177 1.18077 6.61957 1.24872 6.23386 1.36093C5.84815 1.47315 5.47034 1.62062 5.10042 1.80333ZM8.57177 16V14.8429C8.9823 14.8192 9.38409 14.7549 9.77713 14.6501C10.1702 14.5452 10.5517 14.4014 10.9216 14.2187L11.4933 15.193C11.0343 15.4209 10.5584 15.6027 10.0656 15.7386C9.5727 15.8745 9.07477 15.9616 8.57177 16ZM10.9216 1.78133C10.5517 1.59862 10.1702 1.45482 9.77713 1.34994C9.38409 1.24505 8.9823 1.18077 8.57177 1.15709V0C9.07477 0.0383541 9.5727 0.125479 10.0656 0.261376C10.5584 0.397272 11.0343 0.579131 11.4933 0.806954L10.9216 1.78133ZM12.4762 14.6128L11.9044 13.6469C12.2563 13.4134 12.5726 13.149 12.8535 12.8535C13.1343 12.558 13.3914 12.2416 13.6249 11.9044L14.6128 12.4982C14.3286 12.9132 14.0052 13.297 13.6426 13.6494C13.28 14.0018 12.8912 14.323 12.4762 14.6128ZM13.6249 4.08713C13.3914 3.74991 13.1306 3.43862 12.8425 3.15328C12.5543 2.86796 12.2416 2.60856 11.9044 2.3751L12.4762 1.38719C12.8912 1.67703 13.28 1.99817 13.6426 2.3506C14.0052 2.70304 14.3314 3.08678 14.6213 3.50181L13.6249 4.08713ZM14.8429 7.42823C14.8192 7.0177 14.7535 6.61957 14.6458 6.23386C14.5381 5.84815 14.3929 5.46752 14.2102 5.09197L15.193 4.50665C15.4265 4.96003 15.6098 5.43314 15.7429 5.926C15.8759 6.41884 15.9616 6.91958 16 7.42823H14.8429ZM15.193 11.4933L14.2187 10.9216C14.4014 10.5517 14.5452 10.1702 14.6501 9.77713C14.7549 9.38409 14.8192 8.9823 14.8429 8.57177H16C15.9616 9.07477 15.8745 9.5727 15.7386 10.0656C15.6027 10.5584 15.4209 11.0343 15.193 11.4933Z"
+        fill="#3f76ff"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/monospace-icon.tsx b/packages/propel/src/icons/monospace-icon.tsx
index bca4abcfa..a227a7386 100644
--- a/packages/propel/src/icons/monospace-icon.tsx
+++ b/packages/propel/src/icons/monospace-icon.tsx
@@ -2,15 +2,17 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const MonospaceIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg viewBox="0 0 16 14" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...rest}>
-    <path
-      d="M10.6149 13.0746V11.9267H13.0648C13.4568 11.9267 13.7415 11.838 13.9188 11.6607C14.1055 11.4833 14.1988 11.208 14.1988 10.8347V9.8547L14.2268 8.45473H13.9748L14.2128 8.24474C14.2128 8.80472 14.0261 9.24805 13.6528 9.57471C13.2795 9.90137 12.7802 10.0647 12.1548 10.0647C11.3615 10.0647 10.7362 9.80804 10.2789 9.29472C9.82156 8.77206 9.5929 8.07207 9.5929 7.19476V5.57079C9.5929 4.69347 9.82156 3.99815 10.2789 3.48483C10.7362 2.97151 11.3615 2.71484 12.1548 2.71484C12.7802 2.71484 13.2795 2.87817 13.6528 3.20483C14.0261 3.53149 14.2128 3.97482 14.2128 4.53481L13.9748 4.32481H14.2128V2.85484H15.4588V10.8347C15.4588 11.5253 15.2441 12.0713 14.8148 12.4727C14.3948 12.874 13.8068 13.0746 13.0508 13.0746H10.6149ZM12.5328 8.97272C13.0555 8.97272 13.4662 8.80939 13.7648 8.48273C14.0635 8.15607 14.2128 7.70341 14.2128 7.12476V5.65479C14.2128 5.07613 14.0635 4.62347 13.7648 4.29681C13.4662 3.97015 13.0555 3.80682 12.5328 3.80682C12.0008 3.80682 11.5855 3.96549 11.2869 4.28281C10.9975 4.60014 10.8529 5.05746 10.8529 5.65479V7.12476C10.8529 7.72208 10.9975 8.1794 11.2869 8.49673C11.5855 8.81406 12.0008 8.97272 12.5328 8.97272Z"
-      fill="currentColor"
-    />
-    <path
-      d="M0.666626 10.5538L3.32657 0.333984H5.02054L7.66649 10.5538H6.39251L5.72053 7.83784H2.62659L1.9546 10.5538H0.666626ZM2.87858 6.77386H5.45453L4.67055 3.62392C4.52122 3.0266 4.40455 2.52727 4.32055 2.12595C4.23656 1.72462 4.18522 1.46329 4.16656 1.34196C4.14789 1.46329 4.09656 1.72462 4.01256 2.12595C3.92856 2.52727 3.8119 3.02193 3.66257 3.60992L2.87858 6.77386Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function MonospaceIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 16 14" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...rest}>
+      <path
+        d="M10.6149 13.0746V11.9267H13.0648C13.4568 11.9267 13.7415 11.838 13.9188 11.6607C14.1055 11.4833 14.1988 11.208 14.1988 10.8347V9.8547L14.2268 8.45473H13.9748L14.2128 8.24474C14.2128 8.80472 14.0261 9.24805 13.6528 9.57471C13.2795 9.90137 12.7802 10.0647 12.1548 10.0647C11.3615 10.0647 10.7362 9.80804 10.2789 9.29472C9.82156 8.77206 9.5929 8.07207 9.5929 7.19476V5.57079C9.5929 4.69347 9.82156 3.99815 10.2789 3.48483C10.7362 2.97151 11.3615 2.71484 12.1548 2.71484C12.7802 2.71484 13.2795 2.87817 13.6528 3.20483C14.0261 3.53149 14.2128 3.97482 14.2128 4.53481L13.9748 4.32481H14.2128V2.85484H15.4588V10.8347C15.4588 11.5253 15.2441 12.0713 14.8148 12.4727C14.3948 12.874 13.8068 13.0746 13.0508 13.0746H10.6149ZM12.5328 8.97272C13.0555 8.97272 13.4662 8.80939 13.7648 8.48273C14.0635 8.15607 14.2128 7.70341 14.2128 7.12476V5.65479C14.2128 5.07613 14.0635 4.62347 13.7648 4.29681C13.4662 3.97015 13.0555 3.80682 12.5328 3.80682C12.0008 3.80682 11.5855 3.96549 11.2869 4.28281C10.9975 4.60014 10.8529 5.05746 10.8529 5.65479V7.12476C10.8529 7.72208 10.9975 8.1794 11.2869 8.49673C11.5855 8.81406 12.0008 8.97272 12.5328 8.97272Z"
+        fill="currentColor"
+      />
+      <path
+        d="M0.666626 10.5538L3.32657 0.333984H5.02054L7.66649 10.5538H6.39251L5.72053 7.83784H2.62659L1.9546 10.5538H0.666626ZM2.87858 6.77386H5.45453L4.67055 3.62392C4.52122 3.0266 4.40455 2.52727 4.32055 2.12595C4.23656 1.72462 4.18522 1.46329 4.16656 1.34196C4.14789 1.46329 4.09656 1.72462 4.01256 2.12595C3.92856 2.52727 3.8119 3.02193 3.66257 3.60992L2.87858 6.77386Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/multiple-sticky.tsx b/packages/propel/src/icons/multiple-sticky.tsx
index 6ec82be47..2c1a7eb44 100644
--- a/packages/propel/src/icons/multiple-sticky.tsx
+++ b/packages/propel/src/icons/multiple-sticky.tsx
@@ -2,27 +2,29 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const RecentStickyIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    width="20"
-    height="20"
-    viewBox="0 0 20 20"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-    {...rest}
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M2.23602 12.7638C2.60067 13.1285 3.09525 13.3333 3.61095 13.3333H9.72206C9.94307 13.3333 10.155 13.2455 10.3113 13.0892L13.0891 10.3115C13.2454 10.1552 13.3332 9.94323 13.3332 9.72221V3.6111C13.3332 3.0954 13.1283 2.60083 12.7637 2.23617C12.399 1.87152 11.9044 1.66666 11.3887 1.66666H3.61095C3.09525 1.66666 2.60067 1.87152 2.23602 2.23617C1.87136 2.60083 1.6665 3.0954 1.6665 3.6111V11.3889C1.6665 11.9046 1.87136 12.3992 2.23602 12.7638ZM11.0435 9.99999L9.99984 11.0437V10.2778C9.99984 10.2041 10.0291 10.1334 10.0812 10.0813C10.1333 10.0293 10.2039 9.99999 10.2776 9.99999H11.0435ZM8.33317 11.6667V10.2778C8.33317 9.76207 8.53803 9.26749 8.90269 8.90284C9.26734 8.53819 9.76192 8.33332 10.2776 8.33332H11.6665V3.6111C11.6665 3.53743 11.6372 3.46678 11.5851 3.41468C11.5331 3.36259 11.4624 3.33332 11.3887 3.33332H3.61095C3.53728 3.33332 3.46662 3.36259 3.41453 3.41468C3.36244 3.46678 3.33317 3.53743 3.33317 3.6111V11.3889C3.33317 11.4626 3.36244 11.5332 3.41453 11.5853C3.46662 11.6374 3.53728 11.6667 3.61095 11.6667H8.33317Z"
-      fill="currentColor"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M6.36088 16.832C6.65667 17.2545 7.10816 17.5421 7.61603 17.6317L13.6343 18.6928C13.852 18.7312 14.0759 18.6816 14.257 18.5548L17.4749 16.3016C17.656 16.1748 17.7792 15.9813 17.8176 15.7636L18.8788 9.74538C18.9683 9.23752 18.8525 8.71488 18.5567 8.29244C18.2609 7.87001 17.8094 7.58238 17.3015 7.49283L15.1445 7.11249C14.6913 7.03257 14.2591 7.33521 14.1792 7.78846C14.0992 8.2417 14.4019 8.67392 14.8551 8.75384L17.0121 9.13417C17.0847 9.14697 17.1492 9.18806 17.1914 9.2484C17.2337 9.30875 17.2502 9.38341 17.2374 9.45597L16.4174 14.1064L15.0497 13.8653C14.5418 13.7757 14.0192 13.8916 13.5967 14.1874C13.1743 14.4832 12.8867 14.9347 12.7971 15.4425L12.5559 16.8103L7.90544 15.9903C7.83289 15.9775 7.76839 15.9364 7.72613 15.8761C7.68388 15.8157 7.66733 15.7411 7.68012 15.6685L7.77252 15.1445C7.85244 14.6913 7.5498 14.259 7.09655 14.1791C6.64331 14.0992 6.21109 14.4018 6.13117 14.8551L6.03877 15.3791C5.94922 15.887 6.06509 16.4096 6.36088 16.832ZM14.3054 16.4862L14.4384 15.7319C14.4512 15.6594 14.4923 15.5949 14.5527 15.5526C14.613 15.5104 14.6877 15.4938 14.7602 15.5066L15.5145 15.6396L14.3054 16.4862Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function RecentStickyIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      width="20"
+      height="20"
+      viewBox="0 0 20 20"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      {...rest}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M2.23602 12.7638C2.60067 13.1285 3.09525 13.3333 3.61095 13.3333H9.72206C9.94307 13.3333 10.155 13.2455 10.3113 13.0892L13.0891 10.3115C13.2454 10.1552 13.3332 9.94323 13.3332 9.72221V3.6111C13.3332 3.0954 13.1283 2.60083 12.7637 2.23617C12.399 1.87152 11.9044 1.66666 11.3887 1.66666H3.61095C3.09525 1.66666 2.60067 1.87152 2.23602 2.23617C1.87136 2.60083 1.6665 3.0954 1.6665 3.6111V11.3889C1.6665 11.9046 1.87136 12.3992 2.23602 12.7638ZM11.0435 9.99999L9.99984 11.0437V10.2778C9.99984 10.2041 10.0291 10.1334 10.0812 10.0813C10.1333 10.0293 10.2039 9.99999 10.2776 9.99999H11.0435ZM8.33317 11.6667V10.2778C8.33317 9.76207 8.53803 9.26749 8.90269 8.90284C9.26734 8.53819 9.76192 8.33332 10.2776 8.33332H11.6665V3.6111C11.6665 3.53743 11.6372 3.46678 11.5851 3.41468C11.5331 3.36259 11.4624 3.33332 11.3887 3.33332H3.61095C3.53728 3.33332 3.46662 3.36259 3.41453 3.41468C3.36244 3.46678 3.33317 3.53743 3.33317 3.6111V11.3889C3.33317 11.4626 3.36244 11.5332 3.41453 11.5853C3.46662 11.6374 3.53728 11.6667 3.61095 11.6667H8.33317Z"
+        fill="currentColor"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M6.36088 16.832C6.65667 17.2545 7.10816 17.5421 7.61603 17.6317L13.6343 18.6928C13.852 18.7312 14.0759 18.6816 14.257 18.5548L17.4749 16.3016C17.656 16.1748 17.7792 15.9813 17.8176 15.7636L18.8788 9.74538C18.9683 9.23752 18.8525 8.71488 18.5567 8.29244C18.2609 7.87001 17.8094 7.58238 17.3015 7.49283L15.1445 7.11249C14.6913 7.03257 14.2591 7.33521 14.1792 7.78846C14.0992 8.2417 14.4019 8.67392 14.8551 8.75384L17.0121 9.13417C17.0847 9.14697 17.1492 9.18806 17.1914 9.2484C17.2337 9.30875 17.2502 9.38341 17.2374 9.45597L16.4174 14.1064L15.0497 13.8653C14.5418 13.7757 14.0192 13.8916 13.5967 14.1874C13.1743 14.4832 12.8867 14.9347 12.7971 15.4425L12.5559 16.8103L7.90544 15.9903C7.83289 15.9775 7.76839 15.9364 7.72613 15.8761C7.68388 15.8157 7.66733 15.7411 7.68012 15.6685L7.77252 15.1445C7.85244 14.6913 7.5498 14.259 7.09655 14.1791C6.64331 14.0992 6.21109 14.4018 6.13117 14.8551L6.03877 15.3791C5.94922 15.887 6.06509 16.4096 6.36088 16.832ZM14.3054 16.4862L14.4384 15.7319C14.4512 15.6594 14.4923 15.5949 14.5527 15.5526C14.613 15.5104 14.6877 15.4938 14.7602 15.5066L15.5145 15.6396L14.3054 16.4862Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/off-track-icon.tsx b/packages/propel/src/icons/off-track-icon.tsx
index 638bb689f..76ee3a113 100644
--- a/packages/propel/src/icons/off-track-icon.tsx
+++ b/packages/propel/src/icons/off-track-icon.tsx
@@ -2,20 +2,22 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const OffTrackIcon: React.FC<ISvgIcons> = ({ width = "16", height = "16" }) => (
-  <svg width={width} height={height} viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g clipPath="url(#clip0_365_7595)">
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M2.03658 7.33335H2.66663C3.03482 7.33335 3.33329 7.63183 3.33329 8.00002C3.33329 8.36821 3.03482 8.66669 2.66663 8.66669H2.03658C2.36821 11.6667 4.91159 14 7.99996 14C11.0883 14 13.6317 11.6667 13.9633 8.66669H13.3333C12.9651 8.66669 12.6666 8.36821 12.6666 8.00002C12.6666 7.63183 12.9651 7.33335 13.3333 7.33335H13.9633C13.6317 4.33339 11.0883 2.00002 7.99996 2.00002C4.91159 2.00002 2.36821 4.33339 2.03658 7.33335ZM0.666626 8.00002C0.666626 3.94993 3.94987 0.666687 7.99996 0.666687C12.05 0.666687 15.3333 3.94993 15.3333 8.00002C15.3333 12.0501 12.05 15.3334 7.99996 15.3334C3.94987 15.3334 0.666626 12.0501 0.666626 8.00002ZM6.66663 4.66669C7.03482 4.66669 7.33329 4.96516 7.33329 5.33335V8.00002C7.33329 8.36821 7.03482 8.66669 6.66663 8.66669C6.29844 8.66669 5.99996 8.36821 5.99996 8.00002V5.33335C5.99996 4.96516 6.29844 4.66669 6.66663 4.66669ZM9.33329 4.66669C9.70148 4.66669 9.99996 4.96516 9.99996 5.33335V8.00002C9.99996 8.36821 9.70148 8.66669 9.33329 8.66669C8.9651 8.66669 8.66663 8.36821 8.66663 8.00002V5.33335C8.66663 4.96516 8.9651 4.66669 9.33329 4.66669ZM5.99996 10.6667C5.99996 10.2985 6.29844 10 6.66663 10H6.67329C7.04148 10 7.33996 10.2985 7.33996 10.6667C7.33996 11.0349 7.04148 11.3334 6.67329 11.3334H6.66663C6.29844 11.3334 5.99996 11.0349 5.99996 10.6667ZM8.66663 10.6667C8.66663 10.2985 8.9651 10 9.33329 10H9.33996C9.70815 10 10.0066 10.2985 10.0066 10.6667C10.0066 11.0349 9.70815 11.3334 9.33996 11.3334H9.33329C8.9651 11.3334 8.66663 11.0349 8.66663 10.6667Z"
-        fill="#CC0000"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_365_7595">
-        <rect width="16" height="16" fill="white" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function OffTrackIcon({ width = "16", height = "16" }: ISvgIcons) {
+  return (
+    <svg width={width} height={height} viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <g clipPath="url(#clip0_365_7595)">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M2.03658 7.33335H2.66663C3.03482 7.33335 3.33329 7.63183 3.33329 8.00002C3.33329 8.36821 3.03482 8.66669 2.66663 8.66669H2.03658C2.36821 11.6667 4.91159 14 7.99996 14C11.0883 14 13.6317 11.6667 13.9633 8.66669H13.3333C12.9651 8.66669 12.6666 8.36821 12.6666 8.00002C12.6666 7.63183 12.9651 7.33335 13.3333 7.33335H13.9633C13.6317 4.33339 11.0883 2.00002 7.99996 2.00002C4.91159 2.00002 2.36821 4.33339 2.03658 7.33335ZM0.666626 8.00002C0.666626 3.94993 3.94987 0.666687 7.99996 0.666687C12.05 0.666687 15.3333 3.94993 15.3333 8.00002C15.3333 12.0501 12.05 15.3334 7.99996 15.3334C3.94987 15.3334 0.666626 12.0501 0.666626 8.00002ZM6.66663 4.66669C7.03482 4.66669 7.33329 4.96516 7.33329 5.33335V8.00002C7.33329 8.36821 7.03482 8.66669 6.66663 8.66669C6.29844 8.66669 5.99996 8.36821 5.99996 8.00002V5.33335C5.99996 4.96516 6.29844 4.66669 6.66663 4.66669ZM9.33329 4.66669C9.70148 4.66669 9.99996 4.96516 9.99996 5.33335V8.00002C9.99996 8.36821 9.70148 8.66669 9.33329 8.66669C8.9651 8.66669 8.66663 8.36821 8.66663 8.00002V5.33335C8.66663 4.96516 8.9651 4.66669 9.33329 4.66669ZM5.99996 10.6667C5.99996 10.2985 6.29844 10 6.66663 10H6.67329C7.04148 10 7.33996 10.2985 7.33996 10.6667C7.33996 11.0349 7.04148 11.3334 6.67329 11.3334H6.66663C6.29844 11.3334 5.99996 11.0349 5.99996 10.6667ZM8.66663 10.6667C8.66663 10.2985 8.9651 10 9.33329 10H9.33996C9.70815 10 10.0066 10.2985 10.0066 10.6667C10.0066 11.0349 9.70815 11.3334 9.33996 11.3334H9.33329C8.9651 11.3334 8.66663 11.0349 8.66663 10.6667Z"
+          fill="#CC0000"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_365_7595">
+          <rect width="16" height="16" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/on-track-icon.tsx b/packages/propel/src/icons/on-track-icon.tsx
index 26bb9f92c..53a977799 100644
--- a/packages/propel/src/icons/on-track-icon.tsx
+++ b/packages/propel/src/icons/on-track-icon.tsx
@@ -2,41 +2,43 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const OnTrackIcon: React.FC<ISvgIcons> = ({ width = "16", height = "16" }) => (
-  <svg width={width} height={height} viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g clipPath="url(#clip0_365_7535)">
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M11.0001 2.80075C9.81139 2.11486 8.42345 1.85723 7.06776 2.07082C5.71206 2.28441 4.47057 2.9563 3.55031 3.97445C2.63004 4.9926 2.08664 6.29547 2.01071 7.66578C1.93479 9.03609 2.33093 10.391 3.13308 11.5046C3.93523 12.6182 5.0949 13.4231 6.4187 13.7852C7.74249 14.1472 9.1504 14.0445 10.4076 13.4941C11.6649 12.9438 12.6954 11.979 13.3274 10.7608C13.9594 9.5426 14.1547 8.14453 13.8807 6.79975C13.8072 6.43897 14.0401 6.08691 14.4009 6.0134C14.7616 5.93988 15.1137 6.17276 15.1872 6.53353C15.5221 8.17715 15.2834 9.88591 14.511 11.3748C13.7385 12.8638 12.4789 14.0429 10.9423 14.7156C9.4057 15.3882 7.68493 15.5138 6.06696 15.0713C4.44898 14.6288 3.03161 13.645 2.05121 12.2839C1.0708 10.9229 0.586626 9.26684 0.679423 7.59202C0.772221 5.91719 1.43638 4.3248 2.56115 3.08039C3.68591 1.83598 5.2033 1.01478 6.86025 0.753732C8.51721 0.492682 10.2136 0.807564 11.6665 1.64587C11.9854 1.82987 12.0947 2.23757 11.9107 2.55648C11.7267 2.8754 11.319 2.98476 11.0001 2.80075ZM15.138 2.19524C15.3984 2.45559 15.3984 2.8777 15.138 3.13805L8.47136 9.80471C8.21101 10.0651 7.7889 10.0651 7.52855 9.80471L5.52856 7.80471C5.26821 7.54436 5.26821 7.12225 5.52856 6.8619C5.7889 6.60155 6.21101 6.60155 6.47136 6.8619L7.99996 8.3905L14.1952 2.19524C14.4556 1.93489 14.8777 1.93489 15.138 2.19524Z"
-        fill="#1FAD40"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M7.99996 15.3333C7.63177 15.3333 7.33329 15.0348x33329 14.6666V13.3333C7.33329 12.9651 7.63177 12.6666 7.99996 12.6666C8.36815 12.6666 8.66663 12.9651 8.66663 13.3333V14.6666C8.66663 15.0348 8.36815 15.3333 7.99996 15.3333Z"
-        fill="#1FAD40"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M7.99996 3.33331C7.63177 3.33331 7.33329 3.03483 7.33329 2.66664V1.33331C7.33329 0.965117 7.63177 0.66664 7.99996 0.66664C8.36815 0.66664 8.66663 0.965117 8.66663 1.33331V2.66664C8.66663 3.03483 8.36815 3.33331 7.99996 3.33331Z"
-        fill="#1FAD40"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M3.33329 7.99997C3.33329 8.36816 3.03482 8.66664 2.66663 8.66664H1.33329C0.965103 8.66664 0.666626 8.36816 0.666626 7.99997C0.666626 7.63178 0.965103 7.33331 1.33329 7.33331H2.66663C3.03482 7.33331 3.33329 7.63178 3.33329 7.99997Z"
-        fill="#1FAD40"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_365_7535">
+export function OnTrackIcon({ width = "16", height = "16" }: ISvgIcons) {
+  return (
+    <svg width={width} height={height} viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <g clipPath="url(#clip0_365_7535)">
         <path
-          d="M0 2C0 0.895431 0.895431 0 2 0H14C15.1046 0 16 0.895431 16 2V14C16 15.1046 15.1046 16 14 16H2C0.895431 16 0 15.1046 0 14V2Z"
-          fill="white"
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M11.0001 2.80075C9.81139 2.11486 8.42345 1.85723 7.06776 2.07082C5.71206 2.28441 4.47057 2.9563 3.55031 3.97445C2.63004 4.9926 2.08664 6.29547 2.01071 7.66578C1.93479 9.03609 2.33093 10.391 3.13308 11.5046C3.93523 12.6182 5.0949 13.4231 6.4187 13.7852C7.74249 14.1472 9.1504 14.0445 10.4076 13.4941C11.6649 12.9438 12.6954 11.979 13.3274 10.7608C13.9594 9.5426 14.1547 8.14453 13.8807 6.79975C13.8072 6.43897 14.0401 6.08691 14.4009 6.0134C14.7616 5.93988 15.1137 6.17276 15.1872 6.53353C15.5221 8.17715 15.2834 9.88591 14.511 11.3748C13.7385 12.8638 12.4789 14.0429 10.9423 14.7156C9.4057 15.3882 7.68493 15.5138 6.06696 15.0713C4.44898 14.6288 3.03161 13.645 2.05121 12.2839C1.0708 10.9229 0.586626 9.26684 0.679423 7.59202C0.772221 5.91719 1.43638 4.3248 2.56115 3.08039C3.68591 1.83598 5.2033 1.01478 6.86025 0.753732C8.51721 0.492682 10.2136 0.807564 11.6665 1.64587C11.9854 1.82987 12.0947 2.23757 11.9107 2.55648C11.7267 2.8754 11.319 2.98476 11.0001 2.80075ZM15.138 2.19524C15.3984 2.45559 15.3984 2.8777 15.138 3.13805L8.47136 9.80471C8.21101 10.0651 7.7889 10.0651 7.52855 9.80471L5.52856 7.80471C5.26821 7.54436 5.26821 7.12225 5.52856 6.8619C5.7889 6.60155 6.21101 6.60155 6.47136 6.8619L7.99996 8.3905L14.1952 2.19524C14.4556 1.93489 14.8777 1.93489 15.138 2.19524Z"
+          fill="#1FAD40"
         />
-      </clipPath>
-    </defs>
-  </svg>
-);
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M7.99996 15.3333C7.63177 15.3333 7.33329 15.0348x33329 14.6666V13.3333C7.33329 12.9651 7.63177 12.6666 7.99996 12.6666C8.36815 12.6666 8.66663 12.9651 8.66663 13.3333V14.6666C8.66663 15.0348 8.36815 15.3333 7.99996 15.3333Z"
+          fill="#1FAD40"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M7.99996 3.33331C7.63177 3.33331 7.33329 3.03483 7.33329 2.66664V1.33331C7.33329 0.965117 7.63177 0.66664 7.99996 0.66664C8.36815 0.66664 8.66663 0.965117 8.66663 1.33331V2.66664C8.66663 3.03483 8.36815 3.33331 7.99996 3.33331Z"
+          fill="#1FAD40"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M3.33329 7.99997C3.33329 8.36816 3.03482 8.66664 2.66663 8.66664H1.33329C0.965103 8.66664 0.666626 8.36816 0.666626 7.99997C0.666626 7.63178 0.965103 7.33331 1.33329 7.33331H2.66663C3.03482 7.33331 3.33329 7.63178 3.33329 7.99997Z"
+          fill="#1FAD40"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_365_7535">
+          <path
+            d="M0 2C0 0.895431 0.895431 0 2 0H14C15.1046 0 16 0.895431 16 2V14C16 15.1046 15.1046 16 14 16H2C0.895431 16 0 15.1046 0 14V2Z"
+            fill="white"
+          />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/overview-icon.tsx b/packages/propel/src/icons/overview-icon.tsx
index 6fe8f34fc..99f99728c 100644
--- a/packages/propel/src/icons/overview-icon.tsx
+++ b/packages/propel/src/icons/overview-icon.tsx
@@ -2,13 +2,15 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const OverviewIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg viewBox="0 0 12 12" className={className} fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M0.5 1C0.5 0.867392 0.552678 0.740215 0.646447 0.646447C0.740215 0.552678 0.867392 0.5 1 0.5H1.5C7.02267 0.5 11.5 4.97733 11.5 10.5V11C11.5 11.1326 11.4473 11.2598 11.3536 11.3536C11.2598 11.4473 11.1326 11.5 11 11.5H10.5C10.3674 11.5 10.2402 11.4473 10.1464 11.3536C10.0527 11.2598 10 11.1326 10 11V10.5C10 5.80533 6.19467 2 1.5 2H1C0.867392 2 0.740215 1.94732 0.646447 1.85355C0.552678 1.75979 0.5 1.63261 0.5 1.5V1ZM0.5 5.5C0.5 5.36739 0.552678 5.24022 0.646447 5.14645C0.740215 5.05268 0.867392 5 1 5H1.5C2.22227 5 2.93747 5.14226 3.60476 5.41866C4.27205 5.69506 4.87837 6.10019 5.38909 6.61091C5.89981 7.12164 6.30494 7.72795 6.58134 8.39524C6.85774 9.06253 7 9.77773 7 10.5V11C7 11.1326 6.94732 11.2598 6.85355 11.3536C6.75978 11.4473 6.63261 11.5 6.5 11.5H6C5.86739 11.5 5.74022 11.4473 5.64645 11.3536C5.55268 11.2598 5.5 11.1326 5.5 11V10.5C5.5 9.43913 5.07857 8.42172 4.32843 7.67157C3.57828 6.92143 2.56087 6.5 1.5 6.5H1C0.867392 6.5 0.740215 6.44732 0.646447 6.35355C0.552678 6.25978 0.5 6.13261 0.5 6V5.5ZM0.5 10.5C0.5 10.2348 0.605357 9.98043 0.792893 9.79289C0.98043 9.60536 1.23478 9.5 1.5 9.5C1.76522 9.5 2.01957 9.60536 2.20711 9.79289C2.39464 9.98043 2.5 10.2348 2.5 10.5C2.5 10.7652 2.39464 11.0196 2.20711 11.2071C2.01957 11.3946 1.76522 11.5 1.5 11.5C1.23478 11.5 0.98043 11.3946 0.792893 11.2071C0.605357 11.0196 0.5 10.7652 0.5 10.5Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function OverviewIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 12 12" className={className} fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M0.5 1C0.5 0.867392 0.552678 0.740215 0.646447 0.646447C0.740215 0.552678 0.867392 0.5 1 0.5H1.5C7.02267 0.5 11.5 4.97733 11.5 10.5V11C11.5 11.1326 11.4473 11.2598 11.3536 11.3536C11.2598 11.4473 11.1326 11.5 11 11.5H10.5C10.3674 11.5 10.2402 11.4473 10.1464 11.3536C10.0527 11.2598 10 11.1326 10 11V10.5C10 5.80533 6.19467 2 1.5 2H1C0.867392 2 0.740215 1.94732 0.646447 1.85355C0.552678 1.75979 0.5 1.63261 0.5 1.5V1ZM0.5 5.5C0.5 5.36739 0.552678 5.24022 0.646447 5.14645C0.740215 5.05268 0.867392 5 1 5H1.5C2.22227 5 2.93747 5.14226 3.60476 5.41866C4.27205 5.69506 4.87837 6.10019 5.38909 6.61091C5.89981 7.12164 6.30494 7.72795 6.58134 8.39524C6.85774 9.06253 7 9.77773 7 10.5V11C7 11.1326 6.94732 11.2598 6.85355 11.3536C6.75978 11.4473 6.63261 11.5 6.5 11.5H6C5.86739 11.5 5.74022 11.4473 5.64645 11.3536C5.55268 11.2598 5.5 11.1326 5.5 11V10.5C5.5 9.43913 5.07857 8.42172 4.32843 7.67157C3.57828 6.92143 2.56087 6.5 1.5 6.5H1C0.867392 6.5 0.740215 6.44732 0.646447 6.35355C0.552678 6.25978 0.5 6.13261 0.5 6V5.5ZM0.5 10.5C0.5 10.2348 0.605357 9.98043 0.792893 9.79289C0.98043 9.60536 1.23478 9.5 1.5 9.5C1.76522 9.5 2.01957 9.60536 2.20711 9.79289C2.39464 9.98043 2.5 10.2348 2.5 10.5C2.5 10.7652 2.39464 11.0196 2.20711 11.2071C2.01957 11.3946 1.76522 11.5 1.5 11.5C1.23478 11.5 0.98043 11.3946 0.792893 11.2071C0.605357 11.0196 0.5 10.7652 0.5 10.5Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/pending-icon.tsx b/packages/propel/src/icons/pending-icon.tsx
index efbe59318..ba97a4b49 100644
--- a/packages/propel/src/icons/pending-icon.tsx
+++ b/packages/propel/src/icons/pending-icon.tsx
@@ -2,26 +2,28 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const PendingState: React.FC<ISvgIcons> = ({ width = "10", height = "11", className, color = "#455068" }) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 24 24"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3ZM1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12Z"
-      fill={color}
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M12 5C12.5523 5 13 5.44772 13 6V11.382L16.4472 13.1056C16.9412 13.3526 17.1414 13.9532 16.8944 14.4472C16.6474 14.9412 16.0468 15.1414 15.5528 14.8944L11.5528 12.8944C11.214 12.725 11 12.3788 11 12V6C11 5.44772 11.4477 5 12 5Z"
-      fill={color}
-    />
-  </svg>
-);
+export function PendingState({ width = "10", height = "11", className, color = "#455068" }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3ZM1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12Z"
+        fill={color}
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M12 5C12.5523 5 13 5.44772 13 6V11.382L16.4472 13.1056C16.9412 13.3526 17.1414 13.9532 16.8944 14.4472C16.6474 14.9412 16.0468 15.1414 15.5528 14.8944L11.5528 12.8944C11.214 12.725 11 12.3788 11 12V6C11 5.44772 11.4477 5 12 5Z"
+        fill={color}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/photo-filter-icon.tsx b/packages/propel/src/icons/photo-filter-icon.tsx
index 162ac9048..9546bd262 100644
--- a/packages/propel/src/icons/photo-filter-icon.tsx
+++ b/packages/propel/src/icons/photo-filter-icon.tsx
@@ -2,31 +2,33 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const PhotoFilterIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      d="M21 12V19C21 19.5304 20.7893 20.0391 20.4142 20.4142C20.0391 20.7893 19.5304 21 19 21H5C4.46957 21 3.96086 20.7893 3.58579 20.4142C3.21071 20.0391 3 19.5304 3 19V5C3 4.46957 3.21071 3.96086 3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3H12"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M19 3L18.5778 4.28889C18.5562 4.35583 18.519 4.41668 18.4692 4.46643C18.4195 4.51619 18.3587 4.55344 18.2918 4.57511L17 5L18.2889 5.42222C18.3558 5.44384 18.4167 5.48104 18.4664 5.53076C18.5162 5.58048 18.5534 5.6413 18.5751 5.70822L19 7L19.4222 5.71111C19.4438 5.64417 19.481 5.58332 19.5308 5.53357C19.5805 5.48381 19.6413 5.44656 19.7082 5.42489L21 5L19.7111 4.57778C19.6442 4.55616 19.5833 4.51896 19.5336 4.46924C19.4838 4.41952 19.4466 4.3587 19.4249 4.29178L19 3Z"
-      fill="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M12 9L11.3667 10.9333C11.3342 11.0337 11.2784 11.125 11.2039 11.1997C11.1293 11.2743 11.038 11.3302 10.9377 11.3627L9 12L10.9333 12.6333C11.0337 12.6658 11.125 12.7216 11.1997 12.7961C11.2743 12.8707 11.3302 12.962 11.3627 13.0623L12 15L12.6333 13.0667C12.6658 12.9663 12.7216 12.875 12.7961 12.8003C12.8707 12.7257 12.962 12.6698 13.0623 12.6373L15 12L13.0667 11.3667C12.9663 11.3342 12.875 11.2784 12.8003 11.2039C12.7257 11.1293 12.6698 11.038 12.6373 10.9377L12 9Z"
-      fill="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+export function PhotoFilterIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        d="M21 12V19C21 19.5304 20.7893 20.0391 20.4142 20.4142C20.0391 20.7893 19.5304 21 19 21H5C4.46957 21 3.96086 20.7893 3.58579 20.4142C3.21071 20.0391 3 19.5304 3 19V5C3 4.46957 3.21071 3.96086 3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3H12"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M19 3L18.5778 4.28889C18.5562 4.35583 18.519 4.41668 18.4692 4.46643C18.4195 4.51619 18.3587 4.55344 18.2918 4.57511L17 5L18.2889 5.42222C18.3558 5.44384 18.4167 5.48104 18.4664 5.53076C18.5162 5.58048 18.5534 5.6413 18.5751 5.70822L19 7L19.4222 5.71111C19.4438 5.64417 19.481 5.58332 19.5308 5.53357C19.5805 5.48381 19.6413 5.44656 19.7082 5.42489L21 5L19.7111 4.57778C19.6442 4.55616 19.5833 4.51896 19.5336 4.46924C19.4838 4.41952 19.4466 4.3587 19.4249 4.29178L19 3Z"
+        fill="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M12 9L11.3667 10.9333C11.3342 11.0337 11.2784 11.125 11.2039 11.1997C11.1293 11.2743 11.038 11.3302 10.9377 11.3627L9 12L10.9333 12.6333C11.0337 12.6658 11.125 12.7216 11.1997 12.7961C11.2743 12.8707 11.3302 12.962 11.3627 13.0623L12 15L12.6333 13.0667C12.6658 12.9663 12.7216 12.875 12.7961 12.8003C12.8707 12.7257 12.962 12.6698 13.0623 12.6373L15 12L13.0667 11.3667C12.9663 11.3342 12.875 11.2784 12.8003 11.2039C12.7257 11.1293 12.6698 11.038 12.6373 10.9377L12 9Z"
+        fill="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/planned-icon.tsx b/packages/propel/src/icons/planned-icon.tsx
index e8ac5ae6e..298960c4c 100644
--- a/packages/propel/src/icons/planned-icon.tsx
+++ b/packages/propel/src/icons/planned-icon.tsx
@@ -2,39 +2,41 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const PlannedState: React.FC<ISvgIcons> = ({ width = "10", height = "11", className }) => (
-  <svg
-    width={width}
-    height={height}
-    viewBox="0 0 12 13"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-  >
-    <g clipPath="url(#clip0_3180_28635)">
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M7.11853 4.7C7.20073 4.88749 7.38342 5.01866 7.59656 5.02037C7.88848 5.02271 8.12698 4.7813 8.12925 4.48116L8.13344 3.92962C8.1348 3.74982 8.04958 3.58096 7.90581 3.47859C7.76203 3.37623 7.57832 3.3536 7.41509 3.41815L3.97959 4.77682C3.77547 4.85755 3.64077 5.05919 3.64077 5.28406L3.64077 9.0883C3.64077 9.27834 3.73732 9.45458 3.8954 9.55308C4.05347 9.65157 4.25011 9.65802 4.41396 9.57008L4.90523 9.30643C5.16402 9.16754 5.26431 8.83925 5.12922 8.57317C5.04115 8.39971 4.8748 8.29551 4.69795 8.28247L4.69795 5.65729L7.11853 4.7Z"
-        fill="#455068"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M5.00428 3.06914C5.08648 3.25663 5.26916 3.3878 5.4823 3.38951C5.77422 3.39185 6.01272 3.15044 6.015 2.8503L6.01918 2.29876C6.02054 2.11896 5.93532 1.9501 5.79155 1.84774C5.64777 1.74537 5.46406 1.72274 5.30084 1.78729L1.86534 3.14597C1.66121 3.22669 1.52652 3.42834 1.52652 3.6532L1.52652 7.45745C1.52652 7.64749 1.62307 7.82372 1.78114 7.92222C1.93922 8.02071 2.13585 8.02716 2.29971 7.93922L2.79097 7.67557C3.04977 7.53668 3.15005 7.20839 3.01496 6.94231C2.92689 6.76885 2.76054 6.66465 2.5837 6.65161L2.5837 4.02643L5.00428 3.06914Z"
-        fill="#455068"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M10.473 9.34799C10.4728 9.57269 10.3382 9.77413 10.1342 9.85482L6.70129 11.2129C6.53874 11.2772 6.35582 11.255 6.21225 11.1536C6.06867 11.0523 5.98288 10.8847 5.98288 10.7056L5.98288 6.90139C5.98288 6.67653 6.11757 6.47489 6.3217 6.39416L9.7572 5.03548C9.91981 4.97118 10.1028 4.99338 10.2464 5.09484C10.3899 5.19629 10.4757 5.36397 10.4756 5.5431L10.473 9.34799ZM9.41784 6.33426L7.04006 7.27463L7.04006 9.91423L9.41605 8.97431L9.41784 6.33426Z"
-        fill="#455068"
-      />
-    </g>
-    <defs>
-      <clipPath id="clip0_3180_28635">
-        <rect width="12" height="12" fill="white" transform="translate(0 0.5)" />
-      </clipPath>
-    </defs>
-  </svg>
-);
+export function PlannedState({ width = "10", height = "11", className }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 12 13"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <g clipPath="url(#clip0_3180_28635)">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M7.11853 4.7C7.20073 4.88749 7.38342 5.01866 7.59656 5.02037C7.88848 5.02271 8.12698 4.7813 8.12925 4.48116L8.13344 3.92962C8.1348 3.74982 8.04958 3.58096 7.90581 3.47859C7.76203 3.37623 7.57832 3.3536 7.41509 3.41815L3.97959 4.77682C3.77547 4.85755 3.64077 5.05919 3.64077 5.28406L3.64077 9.0883C3.64077 9.27834 3.73732 9.45458 3.8954 9.55308C4.05347 9.65157 4.25011 9.65802 4.41396 9.57008L4.90523 9.30643C5.16402 9.16754 5.26431 8.83925 5.12922 8.57317C5.04115 8.39971 4.8748 8.29551 4.69795 8.28247L4.69795 5.65729L7.11853 4.7Z"
+          fill="#455068"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M5.00428 3.06914C5.08648 3.25663 5.26916 3.3878 5.4823 3.38951C5.77422 3.39185 6.01272 3.15044 6.015 2.8503L6.01918 2.29876C6.02054 2.11896 5.93532 1.9501 5.79155 1.84774C5.64777 1.74537 5.46406 1.72274 5.30084 1.78729L1.86534 3.14597C1.66121 3.22669 1.52652 3.42834 1.52652 3.6532L1.52652 7.45745C1.52652 7.64749 1.62307 7.82372 1.78114 7.92222C1.93922 8.02071 2.13585 8.02716 2.29971 7.93922L2.79097 7.67557C3.04977 7.53668 3.15005 7.20839 3.01496 6.94231C2.92689 6.76885 2.76054 6.66465 2.5837 6.65161L2.5837 4.02643L5.00428 3.06914Z"
+          fill="#455068"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M10.473 9.34799C10.4728 9.57269 10.3382 9.77413 10.1342 9.85482L6.70129 11.2129C6.53874 11.2772 6.35582 11.255 6.21225 11.1536C6.06867 11.0523 5.98288 10.8847 5.98288 10.7056L5.98288 6.90139C5.98288 6.67653 6.11757 6.47489 6.3217 6.39416L9.7572 5.03548C9.91981 4.97118 10.1028 4.99338 10.2464 5.09484C10.3899 5.19629 10.4757 5.36397 10.4756 5.5431L10.473 9.34799ZM9.41784 6.33426L7.04006 7.27463L7.04006 9.91423L9.41605 8.97431L9.41784 6.33426Z"
+          fill="#455068"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_3180_28635">
+          <rect width="12" height="12" fill="white" transform="translate(0 0.5)" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/priority-icon.tsx b/packages/propel/src/icons/priority-icon.tsx
index e7da9debb..1b518e75b 100644
--- a/packages/propel/src/icons/priority-icon.tsx
+++ b/packages/propel/src/icons/priority-icon.tsx
@@ -12,7 +12,7 @@ interface IPriorityIcon {
   withContainer?: boolean;
 }
 
-export const PriorityIcon: React.FC<IPriorityIcon> = (props) => {
+export function PriorityIcon(props: IPriorityIcon) {
   const { priority, className = "", containerClassName = "", size = 14, withContainer = false } = props;
 
   const priorityClasses = {
@@ -75,4 +75,4 @@ export const PriorityIcon: React.FC<IPriorityIcon> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/packages/propel/src/icons/project/cycle-icon.tsx b/packages/propel/src/icons/project/cycle-icon.tsx
index cabbadcbc..645f8af56 100644
--- a/packages/propel/src/icons/project/cycle-icon.tsx
+++ b/packages/propel/src/icons/project/cycle-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const CycleIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function CycleIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -18,4 +18,4 @@ export const CycleIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/project/epic-icon.tsx b/packages/propel/src/icons/project/epic-icon.tsx
index b3fb6e23d..f241d01aa 100644
--- a/packages/propel/src/icons/project/epic-icon.tsx
+++ b/packages/propel/src/icons/project/epic-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const EpicIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M6.47557 3.58443C6.25869 3.59252 6.06151 3.70781 5.95506 3.88843L1.45506 11.5276C1.34621 11.7124 1.34883 11.9386 1.46092 12.1216C1.57303 12.3046 1.77799 12.4172 1.99999 12.4172H14C14.2176 12.4172 14.4196 12.3092 14.5332 12.1319C14.6467 11.9548 14.6555 11.734 14.5566 11.5491L11.5566 5.9465C11.4711 5.7869 11.3144 5.67271 11.1308 5.63504C10.9474 5.59752 10.7559 5.64062 10.6094 5.75254L9.14159 6.87343L7.01952 3.84927C6.8987 3.67699 6.69254 3.57638 6.47557 3.58443ZM8.48045 8.07824C8.5777 8.21691 8.73158 8.31005 8.90428 8.33561C9.07718 8.36107 9.254 8.31687 9.39061 8.21252L10.793 7.14106L12.9785 11.2236H3.06932L6.54686 5.31985L8.48045 8.07824Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function EpicIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M6.47557 3.58443C6.25869 3.59252 6.06151 3.70781 5.95506 3.88843L1.45506 11.5276C1.34621 11.7124 1.34883 11.9386 1.46092 12.1216C1.57303 12.3046 1.77799 12.4172 1.99999 12.4172H14C14.2176 12.4172 14.4196 12.3092 14.5332 12.1319C14.6467 11.9548 14.6555 11.734 14.5566 11.5491L11.5566 5.9465C11.4711 5.7869 11.3144 5.67271 11.1308 5.63504C10.9474 5.59752 10.7559 5.64062 10.6094 5.75254L9.14159 6.87343L7.01952 3.84927C6.8987 3.67699 6.69254 3.57638 6.47557 3.58443ZM8.48045 8.07824C8.5777 8.21691 8.73158 8.31005 8.90428 8.33561C9.07718 8.36107 9.254 8.31687 9.39061 8.21252L10.793 7.14106L12.9785 11.2236H3.06932L6.54686 5.31985L8.48045 8.07824Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/project/intake-icon.tsx b/packages/propel/src/icons/project/intake-icon.tsx
index 936b4e861..f3bd24d32 100644
--- a/packages/propel/src/icons/project/intake-icon.tsx
+++ b/packages/propel/src/icons/project/intake-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const IntakeIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function IntakeIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -14,4 +14,4 @@ export const IntakeIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...res
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/project/module-icon.tsx b/packages/propel/src/icons/project/module-icon.tsx
index 78c8a2af2..51a707747 100644
--- a/packages/propel/src/icons/project/module-icon.tsx
+++ b/packages/propel/src/icons/project/module-icon.tsx
@@ -3,27 +3,29 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ModuleIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 5.2002C13.375 4.62994 13.3743 4.23962 13.3496 3.9375C13.3255 3.64296 13.2821 3.48707 13.2256 3.37598C13.0938 3.11725 12.8827 2.90623 12.624 2.77441C12.5129 2.71788 12.357 2.67445 12.0625 2.65039C11.7604 2.62572 11.3701 2.625 10.7998 2.625H5.2002C4.62994 2.625 4.23962 2.62572 3.9375 2.65039C3.64296 2.67446 3.48707 2.71788 3.37598 2.77441C3.11725 2.90624 2.90624 3.11725 2.77441 3.37598C2.71788 3.48707 2.67446 3.64296 2.65039 3.9375C2.62572 4.23962 2.625 4.62994 2.625 5.2002V10.7998C2.625 11.3701 2.62572 11.7604 2.65039 12.0625C2.67445 12.357 2.71788 12.5129 2.77441 12.624C2.90623 12.8827 3.11725 13.0938 3.37598 13.2256C3.48707 13.2821 3.64295 13.3255 3.9375 13.3496C4.23962 13.3743 4.62994 13.375 5.2002 13.375H10.7998C11.3701 13.375 11.7604 13.3743 12.0625 13.3496C12.357 13.3255 12.5129 13.2821 12.624 13.2256C12.8827 13.0938 13.0938 12.8827 13.2256 12.624C13.2821 12.5129 13.3255 12.357 13.3496 12.0625C13.3743 11.7604 13.375 11.3701 13.375 10.7998V5.2002ZM14.625 10.7998C14.625 11.3493 14.6255 11.7993 14.5957 12.1641C14.5653 12.5361 14.5001 12.8748 14.3389 13.1914C14.0872 13.6854 13.6854 14.0872 13.1914 14.3389C12.8748 14.5001 12.5361 14.5653 12.1641 14.5957C11.7993 14.6255 11.3493 14.625 10.7998 14.625H5.2002C4.65067 14.625 4.20072 14.6255 3.83594 14.5957C3.46388 14.5653 3.12523 14.5002 2.80859 14.3389C2.31467 14.0872 1.91281 13.6854 1.66113 13.1914C1.49987 12.8748 1.4347 12.5361 1.4043 12.1641C1.37452 11.7993 1.375 11.3493 1.375 10.7998V5.2002C1.375 4.65067 1.37452 4.20072 1.4043 3.83594C1.4347 3.46388 1.49985 3.12523 1.66113 2.80859C1.9128 2.31466 2.31466 1.9128 2.80859 1.66113C3.12523 1.49985 3.46388 1.4347 3.83594 1.4043C4.20072 1.37452 4.65067 1.375 5.2002 1.375H10.7998C11.3493 1.375 11.7993 1.37452 12.1641 1.4043C12.5361 1.4347 12.8748 1.49987 13.1914 1.66113C13.6854 1.91281 14.0872 2.31467 14.3389 2.80859C14.5001 3.12523 14.5653 3.46388 14.5957 3.83594C14.6255 4.20072 14.625 4.65067 14.625 5.2002V10.7998Z"
-      fill={color}
-    />
-    <path
-      d="M6.54286 5H5.45714C5.29713 5 5.21712 5 5.156 5.03114C5.10224 5.05853 5.05853 5.10224 5.03114 5.156C5 5.21712 5 5.29713 5 5.45714V6.54286C5 6.70287 5 6.78288 5.03114 6.844C5.05853 6.89776 5.10224 6.94147 5.156 6.96886C5.21712 7 5.29713 7 5.45714 7H6.54286C6.70287 7 6.78288 7 6.844 6.96886C6.89776 6.94147 6.94147 6.89776 6.96886 6.844C7 6.78288 7 6.70287 7 6.54286V5.45714C7 5.29713 7 5.21712 6.96886 5.156C6.94147 5.10224 6.89776 5.05853 6.844 5.03114C6.78288 5 6.70287 5 6.54286 5Z"
-      fill={color}
-    />
-    <path
-      d="M10.5429 5H9.45714C9.29712 5 9.21711 5 9.156 5.03114C9.10223 5.05853 9.05854 5.10224 9.03114 5.156C9 5.21712 9 5.29713 9 5.45714V6.54286C9 6.70287 9 6.78288 9.03114 6.844C9.05854 6.89776 9.10223 6.94147 9.156 6.96886C9.21711 7 9.29712 7 9.45714 7H10.5429C10.7029 7 10.7829 7 10.844 6.96886C10.8978 6.94147 10.9415 6.89776 10.9689 6.844C11 6.78288 11 6.70287 11 6.54286V5.45714C11 5.29713 11 5.21712 10.9689 5.156C10.9415 5.10224 10.8978 5.05853 10.844 5.03114C10.7829 5 10.7029 5 10.5429 5Z"
-      fill={color}
-    />
-    <path
-      d="M10.5429 9H9.45714C9.29712 9 9.21711 9 9.156 9.03114C9.10223 9.05854 9.05854 9.10223 9.03114 9.156C9 9.21711 9 9.29712 9 9.45714V10.5429C9 10.7029 9 10.7829 9.03114 10.844C9.05854 10.8978 9.10223 10.9415 9.156 10.9689C9.21711 11 9.29712 11 9.45714 11H10.5429C10.7029 11 10.7829 11 10.844 10.9689C10.8978 10.9415 10.9415 10.8978 10.9689 10.844C11 10.7829 11 10.7029 11 10.5429V9.45714C11 9.29712 11 9.21711 10.9689 9.156C10.9415 9.10223 10.8978 9.05854 10.844 9.03114C10.7829 9 10.7029 9 10.5429 9Z"
-      fill={color}
-    />
-    <path
-      d="M6.54286 9H5.45714C5.29713 9 5.21712 9 5.156 9.03114C5.10224 9.05854 5.05853 9.10223 5.03114 9.156C5 9.21711 5 9.29712 5 9.45714V10.5429C5 10.7029 5 10.7829 5.03114 10.844C5.05853 10.8978 5.10224 10.9415 5.156 10.9689C5.21712 11 5.29713 11 5.45714 11H6.54286C6.70287 11 6.78288 11 6.844 10.9689C6.89776 10.9415 6.94147 10.8978 6.96886 10.844C7 10.7829 7 10.7029 7 10.5429V9.45714C7 9.29712 7 9.21711 6.96886 9.156C6.94147 9.10223 6.89776 9.05854 6.844 9.03114C6.78288 9 6.70287 9 6.54286 9Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function ModuleIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 5.2002C13.375 4.62994 13.3743 4.23962 13.3496 3.9375C13.3255 3.64296 13.2821 3.48707 13.2256 3.37598C13.0938 3.11725 12.8827 2.90623 12.624 2.77441C12.5129 2.71788 12.357 2.67445 12.0625 2.65039C11.7604 2.62572 11.3701 2.625 10.7998 2.625H5.2002C4.62994 2.625 4.23962 2.62572 3.9375 2.65039C3.64296 2.67446 3.48707 2.71788 3.37598 2.77441C3.11725 2.90624 2.90624 3.11725 2.77441 3.37598C2.71788 3.48707 2.67446 3.64296 2.65039 3.9375C2.62572 4.23962 2.625 4.62994 2.625 5.2002V10.7998C2.625 11.3701 2.62572 11.7604 2.65039 12.0625C2.67445 12.357 2.71788 12.5129 2.77441 12.624C2.90623 12.8827 3.11725 13.0938 3.37598 13.2256C3.48707 13.2821 3.64295 13.3255 3.9375 13.3496C4.23962 13.3743 4.62994 13.375 5.2002 13.375H10.7998C11.3701 13.375 11.7604 13.3743 12.0625 13.3496C12.357 13.3255 12.5129 13.2821 12.624 13.2256C12.8827 13.0938 13.0938 12.8827 13.2256 12.624C13.2821 12.5129 13.3255 12.357 13.3496 12.0625C13.3743 11.7604 13.375 11.3701 13.375 10.7998V5.2002ZM14.625 10.7998C14.625 11.3493 14.6255 11.7993 14.5957 12.1641C14.5653 12.5361 14.5001 12.8748 14.3389 13.1914C14.0872 13.6854 13.6854 14.0872 13.1914 14.3389C12.8748 14.5001 12.5361 14.5653 12.1641 14.5957C11.7993 14.6255 11.3493 14.625 10.7998 14.625H5.2002C4.65067 14.625 4.20072 14.6255 3.83594 14.5957C3.46388 14.5653 3.12523 14.5002 2.80859 14.3389C2.31467 14.0872 1.91281 13.6854 1.66113 13.1914C1.49987 12.8748 1.4347 12.5361 1.4043 12.1641C1.37452 11.7993 1.375 11.3493 1.375 10.7998V5.2002C1.375 4.65067 1.37452 4.20072 1.4043 3.83594C1.4347 3.46388 1.49985 3.12523 1.66113 2.80859C1.9128 2.31466 2.31466 1.9128 2.80859 1.66113C3.12523 1.49985 3.46388 1.4347 3.83594 1.4043C4.20072 1.37452 4.65067 1.375 5.2002 1.375H10.7998C11.3493 1.375 11.7993 1.37452 12.1641 1.4043C12.5361 1.4347 12.8748 1.49987 13.1914 1.66113C13.6854 1.91281 14.0872 2.31467 14.3389 2.80859C14.5001 3.12523 14.5653 3.46388 14.5957 3.83594C14.6255 4.20072 14.625 4.65067 14.625 5.2002V10.7998Z"
+        fill={color}
+      />
+      <path
+        d="M6.54286 5H5.45714C5.29713 5 5.21712 5 5.156 5.03114C5.10224 5.05853 5.05853 5.10224 5.03114 5.156C5 5.21712 5 5.29713 5 5.45714V6.54286C5 6.70287 5 6.78288 5.03114 6.844C5.05853 6.89776 5.10224 6.94147 5.156 6.96886C5.21712 7 5.29713 7 5.45714 7H6.54286C6.70287 7 6.78288 7 6.844 6.96886C6.89776 6.94147 6.94147 6.89776 6.96886 6.844C7 6.78288 7 6.70287 7 6.54286V5.45714C7 5.29713 7 5.21712 6.96886 5.156C6.94147 5.10224 6.89776 5.05853 6.844 5.03114C6.78288 5 6.70287 5 6.54286 5Z"
+        fill={color}
+      />
+      <path
+        d="M10.5429 5H9.45714C9.29712 5 9.21711 5 9.156 5.03114C9.10223 5.05853 9.05854 5.10224 9.03114 5.156C9 5.21712 9 5.29713 9 5.45714V6.54286C9 6.70287 9 6.78288 9.03114 6.844C9.05854 6.89776 9.10223 6.94147 9.156 6.96886C9.21711 7 9.29712 7 9.45714 7H10.5429C10.7029 7 10.7829 7 10.844 6.96886C10.8978 6.94147 10.9415 6.89776 10.9689 6.844C11 6.78288 11 6.70287 11 6.54286V5.45714C11 5.29713 11 5.21712 10.9689 5.156C10.9415 5.10224 10.8978 5.05853 10.844 5.03114C10.7829 5 10.7029 5 10.5429 5Z"
+        fill={color}
+      />
+      <path
+        d="M10.5429 9H9.45714C9.29712 9 9.21711 9 9.156 9.03114C9.10223 9.05854 9.05854 9.10223 9.03114 9.156C9 9.21711 9 9.29712 9 9.45714V10.5429C9 10.7029 9 10.7829 9.03114 10.844C9.05854 10.8978 9.10223 10.9415 9.156 10.9689C9.21711 11 9.29712 11 9.45714 11H10.5429C10.7029 11 10.7829 11 10.844 10.9689C10.8978 10.9415 10.9415 10.8978 10.9689 10.844C11 10.7829 11 10.7029 11 10.5429V9.45714C11 9.29712 11 9.21711 10.9689 9.156C10.9415 9.10223 10.8978 9.05854 10.844 9.03114C10.7829 9 10.7029 9 10.5429 9Z"
+        fill={color}
+      />
+      <path
+        d="M6.54286 9H5.45714C5.29713 9 5.21712 9 5.156 9.03114C5.10224 9.05854 5.05853 9.10223 5.03114 9.156C5 9.21711 5 9.29712 5 9.45714V10.5429C5 10.7029 5 10.7829 5.03114 10.844C5.05853 10.8978 5.10224 10.9415 5.156 10.9689C5.21712 11 5.29713 11 5.45714 11H6.54286C6.70287 11 6.78288 11 6.844 10.9689C6.89776 10.9415 6.94147 10.8978 6.96886 10.844C7 10.7829 7 10.7029 7 10.5429V9.45714C7 9.29712 7 9.21711 6.96886 9.156C6.94147 9.10223 6.89776 9.05854 6.844 9.03114C6.78288 9 6.70287 9 6.54286 9Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/project/page-icon.tsx b/packages/propel/src/icons/project/page-icon.tsx
index 0e855bcd4..2ab9b764c 100644
--- a/packages/propel/src/icons/project/page-icon.tsx
+++ b/packages/propel/src/icons/project/page-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const PageIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M2.0415 11.4668V4.53325C2.0415 3.98372 2.04103 3.53377 2.0708 3.16899C2.1012 2.79693 2.16636 2.45828 2.32764 2.14164C2.57931 1.64772 2.98117 1.24585 3.4751 0.994184C3.79173 0.832905 4.13038 0.767746 4.50244 0.737348C4.86722 0.707573 5.31717 0.708051 5.8667 0.708051H8.00732C8.46672 0.708051 8.79883 0.703776 9.11768 0.780317C9.26953 0.816778 9.41655 0.869103 9.55908 0.931684C9.57494 0.937854 9.58978 0.945771 9.60498 0.953168C9.6354 0.96723 9.6669 0.97896 9.69678 0.994184L9.87647 1.09477L10.0796 1.23637C10.2777 1.39055 10.4689 1.58472 10.7124 1.82817L12.8374 3.95414C13.1623 4.27904 13.4005 4.51048 13.5718 4.79008C13.627 4.88022 13.6744 4.97452 13.7183 5.07036C13.7229 5.0804 13.7278 5.0903 13.7319 5.10063C13.7959 5.24517 13.8482 5.39475 13.8853 5.54887C13.9618 5.86762 13.9585 6.19902 13.9585 6.65825V11.4668C13.9585 12.0164 13.959 12.4663 13.9292 12.8311C13.8988 13.2032 13.8337 13.5418 13.6724 13.8584C13.4521 14.2907 13.1168 14.6522 12.7056 14.9043L12.5249 15.0049C12.2082 15.1663 11.8697 15.2314 11.4976 15.2618C11.1327 15.2916 10.683 15.2911 10.1333 15.2911H5.8667C5.31716 15.2911 4.86723 15.2915 4.50244 15.2618C4.13034 15.2314 3.79177 15.1663 3.4751 15.0049C2.98126 14.7533 2.57932 14.3523 2.32764 13.8584C2.16631 13.5418 2.10122 13.2032 2.0708 12.8311C2.041 12.4663 2.0415 12.0164 2.0415 11.4668ZM9.3335 10.7081C9.67852 10.7082 9.9585 10.988 9.9585 11.3331C9.9585 11.6781 9.67852 11.9579 9.3335 11.9581H5.3335C4.98832 11.9581 4.7085 11.6782 4.7085 11.3331C4.7085 10.9879 4.98832 10.7081 5.3335 10.7081H9.3335ZM10.6665 8.04106C11.0116 8.04106 11.2913 8.32103 11.2915 8.66606C11.2915 9.01124 11.0117 9.29106 10.6665 9.29106H5.3335C4.98832 9.29106 4.7085 9.01124 4.7085 8.66606C4.70867 8.32103 4.98843 8.04106 5.3335 8.04106H10.6665ZM3.2915 11.4668C3.2915 12.037 3.29222 12.4275 3.3169 12.7295C3.34099 13.0241 3.38432 13.18 3.44092 13.2911C3.57274 13.5497 3.7838 13.7599 4.04248 13.8916C4.15358 13.9482 4.30934 13.9926 4.604 14.0166C4.90612 14.0413 5.29648 14.0411 5.8667 14.0411H10.1333C10.7036 14.0411 11.0939 14.0413 11.396 14.0166C11.6908 13.9926 11.8464 13.9483 11.9575 13.8916C12.2161 13.7599 12.4263 13.5496 12.5581 13.2911C12.6147 13.18 12.659 13.0241 12.6831 12.7295C12.7078 12.4275 12.7085 12.037 12.7085 11.4668V6.65825C12.7085 6.27228 12.7061 6.08627 12.6909 5.95805H10.3999C10.2235 5.95805 10.0532 5.95895 9.91065 5.94731C9.76096 5.93505 9.58746 5.90599 9.41357 5.81743C9.17042 5.69355 8.97292 5.49581 8.84912 5.25297C8.76041 5.07887 8.73148 4.90475 8.71924 4.75493C8.70762 4.61252 8.7085 4.44283 8.7085 4.26664V1.97465C8.58022 1.95949 8.39368 1.95805 8.00732 1.95805H5.8667C5.29645 1.95805 4.90613 1.95877 4.604 1.98344C4.30946 2.00751 4.15357 2.05093 4.04248 2.10747C3.78376 2.23929 3.57274 2.4503 3.44092 2.70903C3.38439 2.82012 3.34096 2.97601 3.3169 3.27055C3.29222 3.57268 3.2915 3.963 3.2915 4.53325V11.4668ZM9.96533 4.65336C9.96677 4.67091 9.96894 4.6836 9.97022 4.69243C9.97133 4.6937 9.97189 4.69521 9.97315 4.69633C9.98199 4.69763 9.99522 4.69975 10.0132 4.70122C10.093 4.70771 10.2032 4.70805 10.3999 4.70805H11.8237L9.9585 2.84184V4.26664C9.9585 4.46349 9.95882 4.57358 9.96533 4.65336Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function PageIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M2.0415 11.4668V4.53325C2.0415 3.98372 2.04103 3.53377 2.0708 3.16899C2.1012 2.79693 2.16636 2.45828 2.32764 2.14164C2.57931 1.64772 2.98117 1.24585 3.4751 0.994184C3.79173 0.832905 4.13038 0.767746 4.50244 0.737348C4.86722 0.707573 5.31717 0.708051 5.8667 0.708051H8.00732C8.46672 0.708051 8.79883 0.703776 9.11768 0.780317C9.26953 0.816778 9.41655 0.869103 9.55908 0.931684C9.57494 0.937854 9.58978 0.945771 9.60498 0.953168C9.6354 0.96723 9.6669 0.97896 9.69678 0.994184L9.87647 1.09477L10.0796 1.23637C10.2777 1.39055 10.4689 1.58472 10.7124 1.82817L12.8374 3.95414C13.1623 4.27904 13.4005 4.51048 13.5718 4.79008C13.627 4.88022 13.6744 4.97452 13.7183 5.07036C13.7229 5.0804 13.7278 5.0903 13.7319 5.10063C13.7959 5.24517 13.8482 5.39475 13.8853 5.54887C13.9618 5.86762 13.9585 6.19902 13.9585 6.65825V11.4668C13.9585 12.0164 13.959 12.4663 13.9292 12.8311C13.8988 13.2032 13.8337 13.5418 13.6724 13.8584C13.4521 14.2907 13.1168 14.6522 12.7056 14.9043L12.5249 15.0049C12.2082 15.1663 11.8697 15.2314 11.4976 15.2618C11.1327 15.2916 10.683 15.2911 10.1333 15.2911H5.8667C5.31716 15.2911 4.86723 15.2915 4.50244 15.2618C4.13034 15.2314 3.79177 15.1663 3.4751 15.0049C2.98126 14.7533 2.57932 14.3523 2.32764 13.8584C2.16631 13.5418 2.10122 13.2032 2.0708 12.8311C2.041 12.4663 2.0415 12.0164 2.0415 11.4668ZM9.3335 10.7081C9.67852 10.7082 9.9585 10.988 9.9585 11.3331C9.9585 11.6781 9.67852 11.9579 9.3335 11.9581H5.3335C4.98832 11.9581 4.7085 11.6782 4.7085 11.3331C4.7085 10.9879 4.98832 10.7081 5.3335 10.7081H9.3335ZM10.6665 8.04106C11.0116 8.04106 11.2913 8.32103 11.2915 8.66606C11.2915 9.01124 11.0117 9.29106 10.6665 9.29106H5.3335C4.98832 9.29106 4.7085 9.01124 4.7085 8.66606C4.70867 8.32103 4.98843 8.04106 5.3335 8.04106H10.6665ZM3.2915 11.4668C3.2915 12.037 3.29222 12.4275 3.3169 12.7295C3.34099 13.0241 3.38432 13.18 3.44092 13.2911C3.57274 13.5497 3.7838 13.7599 4.04248 13.8916C4.15358 13.9482 4.30934 13.9926 4.604 14.0166C4.90612 14.0413 5.29648 14.0411 5.8667 14.0411H10.1333C10.7036 14.0411 11.0939 14.0413 11.396 14.0166C11.6908 13.9926 11.8464 13.9483 11.9575 13.8916C12.2161 13.7599 12.4263 13.5496 12.5581 13.2911C12.6147 13.18 12.659 13.0241 12.6831 12.7295C12.7078 12.4275 12.7085 12.037 12.7085 11.4668V6.65825C12.7085 6.27228 12.7061 6.08627 12.6909 5.95805H10.3999C10.2235 5.95805 10.0532 5.95895 9.91065 5.94731C9.76096 5.93505 9.58746 5.90599 9.41357 5.81743C9.17042 5.69355 8.97292 5.49581 8.84912 5.25297C8.76041 5.07887 8.73148 4.90475 8.71924 4.75493C8.70762 4.61252 8.7085 4.44283 8.7085 4.26664V1.97465C8.58022 1.95949 8.39368 1.95805 8.00732 1.95805H5.8667C5.29645 1.95805 4.90613 1.95877 4.604 1.98344C4.30946 2.00751 4.15357 2.05093 4.04248 2.10747C3.78376 2.23929 3.57274 2.4503 3.44092 2.70903C3.38439 2.82012 3.34096 2.97601 3.3169 3.27055C3.29222 3.57268 3.2915 3.963 3.2915 4.53325V11.4668ZM9.96533 4.65336C9.96677 4.67091 9.96894 4.6836 9.97022 4.69243C9.97133 4.6937 9.97189 4.69521 9.97315 4.69633C9.98199 4.69763 9.99522 4.69975 10.0132 4.70122C10.093 4.70771 10.2032 4.70805 10.3999 4.70805H11.8237L9.9585 2.84184V4.26664C9.9585 4.46349 9.95882 4.57358 9.96533 4.65336Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/project/view-icon.tsx b/packages/propel/src/icons/project/view-icon.tsx
index 4079b4439..f597943c4 100644
--- a/packages/propel/src/icons/project/view-icon.tsx
+++ b/packages/propel/src/icons/project/view-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ViewsIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function ViewsIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -14,4 +14,4 @@ export const ViewsIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/project/work-items-icon.tsx b/packages/propel/src/icons/project/work-items-icon.tsx
index a08daaf71..586f0a597 100644
--- a/packages/propel/src/icons/project/work-items-icon.tsx
+++ b/packages/propel/src/icons/project/work-items-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const WorkItemsIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M14.2779 12.465L14.2045 12.5365L14.1028 12.6109C13.999 12.6752 13.8985 12.7093 13.8745 12.7186L8.09646 14.9677C7.9026 15.0431 7.68376 15.0174 7.51292 14.8987C7.34209 14.7799 7.24168 14.5838 7.24485 14.3758L7.28054 12.0898L5.14952 12.9194C4.95564 12.9949 4.73602 12.9685 4.56518 12.8498C4.39458 12.731 4.29394 12.5348 4.29711 12.3269L4.33279 10.0409L2.20178 10.8705C2.0079 10.946 1.78908 10.9202 1.61824 10.8015C1.44742 10.6828 1.347 10.4866 1.35017 10.2786L1.44444 4.07898C1.44497 4.04466 1.43911 3.86844 1.50017 3.70622C1.54848 3.57794 1.62751 3.46423 1.73091 3.37424C1.86169 3.26043 2.02889 3.20455 2.06088 3.1921L7.83894 0.943026C8.03281 0.867554 8.25164 0.893325 8.42248 1.01205C8.59332 1.13079 8.69372 1.32691 8.69055 1.53494L8.65623 3.82068L10.7859 2.99132C10.9796 2.9159 11.1986 2.94183 11.3694 3.06034C11.5403 3.17909 11.6415 3.37576 11.6383 3.58379L11.604 5.86953L13.7336 5.04017C13.9275 4.96469 14.1463 4.99045 14.3172 5.10919C14.488 5.22794 14.5884 5.42408 14.5852 5.63208L14.491 11.8317C14.4904 11.866 14.4963 12.0422 14.4352 12.2045L14.3939 12.2982C14.3622 12.3584 14.3233 12.4144 14.2779 12.465ZM2.41237 4.09289L2.35605 4.09179L2.45595 4.20643L2.41237 4.09289ZM2.35605 4.09179L2.41237 4.09289L2.45595 4.20643L2.35605 4.09179ZM4.39219 6.12784C4.39271 6.09351 4.38601 5.91676 4.44711 5.75452C4.4954 5.62627 4.57449 5.51251 4.67785 5.42253C4.80863 5.30872 4.97664 5.2534 5.00862 5.24095L7.39924 4.30992L7.42784 2.44478L2.69167 4.28821L2.61504 9.36909L4.35327 8.69224L4.39219 6.12784ZM5.36012 6.14174L5.30379 6.14065L5.4045 6.25584L5.36012 6.14174ZM5.30379 6.14065L5.36012 6.14174L5.4045 6.25584L5.30379 6.14065ZM7.33913 8.17613C7.33965 8.14181 7.3338 7.96558 7.39485 7.80337C7.44316 7.67508 7.52219 7.56138 7.6256 7.47139C7.75637 7.35758 7.92358 7.30169 7.95557 7.28924L10.3456 6.35901L10.3742 4.49387L5.63942 6.33706L5.56254 11.4166L7.30077 10.7397L7.33913 8.17613ZM8.30706 8.19003L8.25073 8.18894L8.35064 8.30357L8.30706 8.19003ZM8.25073 8.18894L8.30706 8.19003L8.35064 8.30357L8.25073 8.18894ZM13.3217 6.54137L8.58636 8.38535L8.50892 13.4657L13.2445 11.623L13.3217 6.54137Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function WorkItemsIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M14.2779 12.465L14.2045 12.5365L14.1028 12.6109C13.999 12.6752 13.8985 12.7093 13.8745 12.7186L8.09646 14.9677C7.9026 15.0431 7.68376 15.0174 7.51292 14.8987C7.34209 14.7799 7.24168 14.5838 7.24485 14.3758L7.28054 12.0898L5.14952 12.9194C4.95564 12.9949 4.73602 12.9685 4.56518 12.8498C4.39458 12.731 4.29394 12.5348 4.29711 12.3269L4.33279 10.0409L2.20178 10.8705C2.0079 10.946 1.78908 10.9202 1.61824 10.8015C1.44742 10.6828 1.347 10.4866 1.35017 10.2786L1.44444 4.07898C1.44497 4.04466 1.43911 3.86844 1.50017 3.70622C1.54848 3.57794 1.62751 3.46423 1.73091 3.37424C1.86169 3.26043 2.02889 3.20455 2.06088 3.1921L7.83894 0.943026C8.03281 0.867554 8.25164 0.893325 8.42248 1.01205C8.59332 1.13079 8.69372 1.32691 8.69055 1.53494L8.65623 3.82068L10.7859 2.99132C10.9796 2.9159 11.1986 2.94183 11.3694 3.06034C11.5403 3.17909 11.6415 3.37576 11.6383 3.58379L11.604 5.86953L13.7336 5.04017C13.9275 4.96469 14.1463 4.99045 14.3172 5.10919C14.488 5.22794 14.5884 5.42408 14.5852 5.63208L14.491 11.8317C14.4904 11.866 14.4963 12.0422 14.4352 12.2045L14.3939 12.2982C14.3622 12.3584 14.3233 12.4144 14.2779 12.465ZM2.41237 4.09289L2.35605 4.09179L2.45595 4.20643L2.41237 4.09289ZM2.35605 4.09179L2.41237 4.09289L2.45595 4.20643L2.35605 4.09179ZM4.39219 6.12784C4.39271 6.09351 4.38601 5.91676 4.44711 5.75452C4.4954 5.62627 4.57449 5.51251 4.67785 5.42253C4.80863 5.30872 4.97664 5.2534 5.00862 5.24095L7.39924 4.30992L7.42784 2.44478L2.69167 4.28821L2.61504 9.36909L4.35327 8.69224L4.39219 6.12784ZM5.36012 6.14174L5.30379 6.14065L5.4045 6.25584L5.36012 6.14174ZM5.30379 6.14065L5.36012 6.14174L5.4045 6.25584L5.30379 6.14065ZM7.33913 8.17613C7.33965 8.14181 7.3338 7.96558 7.39485 7.80337C7.44316 7.67508 7.52219 7.56138 7.6256 7.47139C7.75637 7.35758 7.92358 7.30169 7.95557 7.28924L10.3456 6.35901L10.3742 4.49387L5.63942 6.33706L5.56254 11.4166L7.30077 10.7397L7.33913 8.17613ZM8.30706 8.19003L8.25073 8.18894L8.35064 8.30357L8.30706 8.19003ZM8.25073 8.18894L8.30706 8.19003L8.35064 8.30357L8.25073 8.18894ZM13.3217 6.54137L8.58636 8.38535L8.50892 13.4657L13.2445 11.623L13.3217 6.54137Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/boolean-icon.tsx b/packages/propel/src/icons/properties/boolean-icon.tsx
index 5de7ba05a..d80eb44ac 100644
--- a/packages/propel/src/icons/properties/boolean-icon.tsx
+++ b/packages/propel/src/icons/properties/boolean-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const BooleanPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M14.041 8C14.041 6.13604 12.53 4.625 10.666 4.625H5.33301C3.46905 4.625 1.95801 6.13604 1.95801 8C1.95801 9.86396 3.46905 11.375 5.33301 11.375H10.666C12.53 11.375 14.041 9.86396 14.041 8ZM11.708 8C11.708 7.42471 11.2413 6.95801 10.666 6.95801C10.0909 6.95823 9.625 7.42485 9.625 8C9.62518 8.575 10.091 9.0408 10.666 9.04102C11.2412 9.04102 11.7078 8.57514 11.708 8ZM12.958 8C12.9578 9.26549 11.9316 10.291 10.666 10.291C9.40067 10.2908 8.37518 9.26536 8.375 8C8.375 6.73449 9.40056 5.70823 10.666 5.70801C11.9317 5.70801 12.958 6.73436 12.958 8ZM15.291 8C15.291 10.5543 13.2203 12.625 10.666 12.625H5.33301C2.77869 12.625 0.708008 10.5543 0.708008 8C0.708008 5.44568 2.77869 3.375 5.33301 3.375H10.666C13.2203 3.375 15.291 5.44568 15.291 8Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function BooleanPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M14.041 8C14.041 6.13604 12.53 4.625 10.666 4.625H5.33301C3.46905 4.625 1.95801 6.13604 1.95801 8C1.95801 9.86396 3.46905 11.375 5.33301 11.375H10.666C12.53 11.375 14.041 9.86396 14.041 8ZM11.708 8C11.708 7.42471 11.2413 6.95801 10.666 6.95801C10.0909 6.95823 9.625 7.42485 9.625 8C9.62518 8.575 10.091 9.0408 10.666 9.04102C11.2412 9.04102 11.7078 8.57514 11.708 8ZM12.958 8C12.9578 9.26549 11.9316 10.291 10.666 10.291C9.40067 10.2908 8.37518 9.26536 8.375 8C8.375 6.73449 9.40056 5.70823 10.666 5.70801C11.9317 5.70801 12.958 6.73436 12.958 8ZM15.291 8C15.291 10.5543 13.2203 12.625 10.666 12.625H5.33301C2.77869 12.625 0.708008 10.5543 0.708008 8C0.708008 5.44568 2.77869 3.375 5.33301 3.375H10.666C13.2203 3.375 15.291 5.44568 15.291 8Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/dropdown-icon.tsx b/packages/propel/src/icons/properties/dropdown-icon.tsx
index a5e83582a..7143ced3e 100644
--- a/packages/propel/src/icons/properties/dropdown-icon.tsx
+++ b/packages/propel/src/icons/properties/dropdown-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const DropdownPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function DropdownPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -14,4 +14,4 @@ export const DropdownPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColo
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/properties/due-date-icon.tsx b/packages/propel/src/icons/properties/due-date-icon.tsx
index 9e3074491..170ea39a0 100644
--- a/packages/propel/src/icons/properties/due-date-icon.tsx
+++ b/packages/propel/src/icons/properties/due-date-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const DueDatePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.5576 10.5576C13.8017 10.3135 14.1983 10.3135 14.4424 10.5576C14.6862 10.8016 14.6861 11.1974 14.4424 11.4414L11.4424 14.4414C11.1983 14.6855 10.8017 14.6855 10.5576 14.4414L9.22461 13.1084C8.98059 12.8644 8.9807 12.4687 9.22461 12.2246C9.46869 11.9805 9.86432 11.9805 10.1084 12.2246L10.999 13.1152L13.5576 10.5576ZM10.042 4V3.29102H5.95801V4C5.95783 4.34503 5.67808 4.625 5.33301 4.625C4.98809 4.62482 4.70818 4.34492 4.70801 4V3.29297C4.39072 3.29481 4.14362 3.29958 3.9375 3.31641C3.64272 3.34049 3.48709 3.38481 3.37598 3.44141C3.11725 3.57323 2.90624 3.78327 2.77441 4.04199C2.71783 4.15308 2.67448 4.30883 2.65039 4.60352C2.62571 4.90564 2.625 5.29592 2.625 5.86621V6.04102H13.375V5.86621C13.375 5.29591 13.3743 4.90564 13.3496 4.60352C13.3255 4.30883 13.2822 4.15308 13.2256 4.04199C13.0938 3.78327 12.8827 3.57322 12.624 3.44141C12.5129 3.38481 12.3572 3.34049 12.0625 3.31641C11.8564 3.29958 11.6093 3.29481 11.292 3.29297V4C11.2918 4.34492 11.0119 4.62482 10.667 4.625C10.3219 4.625 10.0422 4.34503 10.042 4ZM14.625 8.33301C14.625 8.67819 14.3452 8.95801 14 8.95801C13.6548 8.95801 13.375 8.67819 13.375 8.33301V7.29102H2.625V11.4668C2.625 12.0369 2.62571 12.4274 2.65039 12.7295C2.67449 13.024 2.71781 13.1799 2.77441 13.291C2.90624 13.5497 3.1173 13.7598 3.37598 13.8916C3.48708 13.9482 3.64284 13.9925 3.9375 14.0166C4.23962 14.0413 4.62998 14.041 5.2002 14.041H8C8.34507 14.041 8.62483 14.321 8.625 14.666C8.625 15.0112 8.34518 15.291 8 15.291H5.2002C4.65066 15.291 4.20073 15.2915 3.83594 15.2617C3.46383 15.2313 3.12526 15.1662 2.80859 15.0049C2.31476 14.7533 1.91282 14.3522 1.66113 13.8584C1.49981 13.5417 1.43471 13.2031 1.4043 12.8311C1.3745 12.4663 1.375 12.0163 1.375 11.4668V5.86621C1.375 5.31658 1.3745 4.86676 1.4043 4.50195C1.4347 4.1298 1.49976 3.79131 1.66113 3.47461C1.9128 2.98069 2.31467 2.57881 2.80859 2.32715C3.12519 2.16592 3.46393 2.10071 3.83594 2.07031C4.08533 2.04996 4.37446 2.04486 4.70801 2.04297V1.33301C4.70801 0.987938 4.98798 0.708184 5.33301 0.708008C5.67819 0.708008 5.95801 0.98783 5.95801 1.33301V2.04102H10.042V1.33301C10.042 0.98783 10.3218 0.708008 10.667 0.708008C11.012 0.708183 11.292 0.987938 11.292 1.33301V2.04297C11.6255 2.04486 11.9147 2.04996 12.1641 2.07031C12.5361 2.10071 12.8748 2.16593 13.1914 2.32715C13.6854 2.57882 14.0872 2.9807 14.3389 3.47461L14.3945 3.59473C14.5155 3.87672 14.5691 4.17636 14.5957 4.50195C14.6255 4.86677 14.625 5.31659 14.625 5.86621V8.33301Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function DueDatePropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.5576 10.5576C13.8017 10.3135 14.1983 10.3135 14.4424 10.5576C14.6862 10.8016 14.6861 11.1974 14.4424 11.4414L11.4424 14.4414C11.1983 14.6855 10.8017 14.6855 10.5576 14.4414L9.22461 13.1084C8.98059 12.8644 8.9807 12.4687 9.22461 12.2246C9.46869 11.9805 9.86432 11.9805 10.1084 12.2246L10.999 13.1152L13.5576 10.5576ZM10.042 4V3.29102H5.95801V4C5.95783 4.34503 5.67808 4.625 5.33301 4.625C4.98809 4.62482 4.70818 4.34492 4.70801 4V3.29297C4.39072 3.29481 4.14362 3.29958 3.9375 3.31641C3.64272 3.34049 3.48709 3.38481 3.37598 3.44141C3.11725 3.57323 2.90624 3.78327 2.77441 4.04199C2.71783 4.15308 2.67448 4.30883 2.65039 4.60352C2.62571 4.90564 2.625 5.29592 2.625 5.86621V6.04102H13.375V5.86621C13.375 5.29591 13.3743 4.90564 13.3496 4.60352C13.3255 4.30883 13.2822 4.15308 13.2256 4.04199C13.0938 3.78327 12.8827 3.57322 12.624 3.44141C12.5129 3.38481 12.3572 3.34049 12.0625 3.31641C11.8564 3.29958 11.6093 3.29481 11.292 3.29297V4C11.2918 4.34492 11.0119 4.62482 10.667 4.625C10.3219 4.625 10.0422 4.34503 10.042 4ZM14.625 8.33301C14.625 8.67819 14.3452 8.95801 14 8.95801C13.6548 8.95801 13.375 8.67819 13.375 8.33301V7.29102H2.625V11.4668C2.625 12.0369 2.62571 12.4274 2.65039 12.7295C2.67449 13.024 2.71781 13.1799 2.77441 13.291C2.90624 13.5497 3.1173 13.7598 3.37598 13.8916C3.48708 13.9482 3.64284 13.9925 3.9375 14.0166C4.23962 14.0413 4.62998 14.041 5.2002 14.041H8C8.34507 14.041 8.62483 14.321 8.625 14.666C8.625 15.0112 8.34518 15.291 8 15.291H5.2002C4.65066 15.291 4.20073 15.2915 3.83594 15.2617C3.46383 15.2313 3.12526 15.1662 2.80859 15.0049C2.31476 14.7533 1.91282 14.3522 1.66113 13.8584C1.49981 13.5417 1.43471 13.2031 1.4043 12.8311C1.3745 12.4663 1.375 12.0163 1.375 11.4668V5.86621C1.375 5.31658 1.3745 4.86676 1.4043 4.50195C1.4347 4.1298 1.49976 3.79131 1.66113 3.47461C1.9128 2.98069 2.31467 2.57881 2.80859 2.32715C3.12519 2.16592 3.46393 2.10071 3.83594 2.07031C4.08533 2.04996 4.37446 2.04486 4.70801 2.04297V1.33301C4.70801 0.987938 4.98798 0.708184 5.33301 0.708008C5.67819 0.708008 5.95801 0.98783 5.95801 1.33301V2.04102H10.042V1.33301C10.042 0.98783 10.3218 0.708008 10.667 0.708008C11.012 0.708183 11.292 0.987938 11.292 1.33301V2.04297C11.6255 2.04486 11.9147 2.04996 12.1641 2.07031C12.5361 2.10071 12.8748 2.16593 13.1914 2.32715C13.6854 2.57882 14.0872 2.9807 14.3389 3.47461L14.3945 3.59473C14.5155 3.87672 14.5691 4.17636 14.5957 4.50195C14.6255 4.86677 14.625 5.31659 14.625 5.86621V8.33301Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/duplicate-icon.tsx b/packages/propel/src/icons/properties/duplicate-icon.tsx
index 50ade4cf8..0e4fa89f9 100644
--- a/packages/propel/src/icons/properties/duplicate-icon.tsx
+++ b/packages/propel/src/icons/properties/duplicate-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const DuplicatePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function DuplicatePropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -14,4 +14,4 @@ export const DuplicatePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentCol
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/properties/estimate-icon.tsx b/packages/propel/src/icons/properties/estimate-icon.tsx
index 799655245..2df27ff77 100644
--- a/packages/propel/src/icons/properties/estimate-icon.tsx
+++ b/packages/propel/src/icons/properties/estimate-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const EstimatePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M7.47524 1.48544C7.80936 1.33685 8.19097 1.33692 8.52505 1.48544C8.78091 1.59922 8.94887 1.80061 9.06802 1.96884C9.18892 2.1396 9.31927 2.36541 9.4645 2.6163L14.9469 12.088C15.0927 12.3398 15.225 12.5655 15.3131 12.7559C15.3998 12.9434 15.4906 13.1898 15.4616 13.4688C15.4236 13.8331 15.2332 14.1646 14.9372 14.38C14.7103 14.5449 14.4514 14.5896 14.2458 14.6085C14.0367 14.6277 13.7743 14.627 13.4831 14.627H2.51723C2.22605 14.627 1.96354 14.6277 1.75454 14.6085C1.54891 14.5896 1.29002 14.5449 1.06313 14.38C0.767042 14.1646 0.576704 13.8331 0.538719 13.4688C0.509704 13.1898 0.600447 12.9434 0.687157 12.7559C0.775223 12.5656 0.906677 12.3397 1.05239 12.088L6.53579 2.6163C6.68101 2.36543 6.81136 2.13961 6.93227 1.96884C7.05143 1.80061 7.21939 1.59922 7.47524 1.48544ZM7.95278 2.6915C7.87286 2.80437 7.77538 2.97106 7.61782 3.24325L2.13442 12.714C1.97623 12.9872 1.88024 13.1553 1.82192 13.2813C1.80777 13.3119 1.79966 13.3353 1.7936 13.3517C1.81076 13.3546 1.83498 13.3603 1.8688 13.3634C2.00713 13.3761 2.2014 13.377 2.51723 13.377H13.4831C13.7989 13.377 13.9932 13.3761 14.1315 13.3634C14.1647 13.3603 14.1886 13.3546 14.2057 13.3517C14.1996 13.3353 14.1924 13.3117 14.1784 13.2813C14.1201 13.1553 14.0241 12.9872 13.8659 12.714L8.38247 3.24325C8.22492 2.97108 8.12743 2.80438 8.04751 2.6915C8.02757 2.66335 8.01084 2.64431 7.99966 2.63095C7.98851 2.6443 7.97249 2.66367 7.95278 2.6915Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function EstimatePropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M7.47524 1.48544C7.80936 1.33685 8.19097 1.33692 8.52505 1.48544C8.78091 1.59922 8.94887 1.80061 9.06802 1.96884C9.18892 2.1396 9.31927 2.36541 9.4645 2.6163L14.9469 12.088C15.0927 12.3398 15.225 12.5655 15.3131 12.7559C15.3998 12.9434 15.4906 13.1898 15.4616 13.4688C15.4236 13.8331 15.2332 14.1646 14.9372 14.38C14.7103 14.5449 14.4514 14.5896 14.2458 14.6085C14.0367 14.6277 13.7743 14.627 13.4831 14.627H2.51723C2.22605 14.627 1.96354 14.6277 1.75454 14.6085C1.54891 14.5896 1.29002 14.5449 1.06313 14.38C0.767042 14.1646 0.576704 13.8331 0.538719 13.4688C0.509704 13.1898 0.600447 12.9434 0.687157 12.7559C0.775223 12.5656 0.906677 12.3397 1.05239 12.088L6.53579 2.6163C6.68101 2.36543 6.81136 2.13961 6.93227 1.96884C7.05143 1.80061 7.21939 1.59922 7.47524 1.48544ZM7.95278 2.6915C7.87286 2.80437 7.77538 2.97106 7.61782 3.24325L2.13442 12.714C1.97623 12.9872 1.88024 13.1553 1.82192 13.2813C1.80777 13.3119 1.79966 13.3353 1.7936 13.3517C1.81076 13.3546 1.83498 13.3603 1.8688 13.3634C2.00713 13.3761 2.2014 13.377 2.51723 13.377H13.4831C13.7989 13.377 13.9932 13.3761 14.1315 13.3634C14.1647 13.3603 14.1886 13.3546 14.2057 13.3517C14.1996 13.3353 14.1924 13.3117 14.1784 13.2813C14.1201 13.1553 14.0241 12.9872 13.8659 12.714L8.38247 3.24325C8.22492 2.97108 8.12743 2.80438 8.04751 2.6915C8.02757 2.66335 8.01084 2.64431 7.99966 2.63095C7.98851 2.6443 7.97249 2.66367 7.95278 2.6915Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/hash-icon.tsx b/packages/propel/src/icons/properties/hash-icon.tsx
index 1b20d6fd8..cb67ec13c 100644
--- a/packages/propel/src/icons/properties/hash-icon.tsx
+++ b/packages/propel/src/icons/properties/hash-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const HashPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M12.1025 1.3836C12.443 1.44034 12.6729 1.76193 12.6162 2.10235L12.1816 4.70782H14C14.3451 4.70782 14.6248 4.98779 14.625 5.33282C14.625 5.678 14.3452 5.95782 14 5.95782H11.9736L11.293 10.0418H13.333C13.6782 10.0418 13.958 10.3216 13.958 10.6668C13.9578 11.0118 13.6781 11.2918 13.333 11.2918H11.085L10.6162 14.1024C10.5595 14.4428 10.2379 14.6727 9.89746 14.616C9.55703 14.5593 9.32714 14.2377 9.38379 13.8973L9.81836 11.2918H5.75195L5.2832 14.1024C5.22646 14.4428 4.90396 14.6728 4.56348 14.616C4.22334 14.5591 3.99325 14.2375 4.0498 13.8973L4.48438 11.2918H2C1.65493 11.2918 1.37518 11.0118 1.375 10.6668C1.375 10.3216 1.65482 10.0418 2 10.0418H4.69238L5.37305 5.95782H2.66699C2.32181 5.95782 2.04199 5.678 2.04199 5.33282C2.04217 4.98779 2.32192 4.70782 2.66699 4.70782H5.58105L6.0498 1.89728C6.10655 1.55679 6.42905 1.32686 6.76953 1.3836C7.10985 1.44041 7.33981 1.76201 7.2832 2.10235L6.84863 4.70782H10.915L11.3838 1.89728C11.4405 1.55685 11.7621 1.32695 12.1025 1.3836ZM5.95996 10.0418H10.0264L10.707 5.95782H6.64062L5.95996 10.0418Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function HashPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M12.1025 1.3836C12.443 1.44034 12.6729 1.76193 12.6162 2.10235L12.1816 4.70782H14C14.3451 4.70782 14.6248 4.98779 14.625 5.33282C14.625 5.678 14.3452 5.95782 14 5.95782H11.9736L11.293 10.0418H13.333C13.6782 10.0418 13.958 10.3216 13.958 10.6668C13.9578 11.0118 13.6781 11.2918 13.333 11.2918H11.085L10.6162 14.1024C10.5595 14.4428 10.2379 14.6727 9.89746 14.616C9.55703 14.5593 9.32714 14.2377 9.38379 13.8973L9.81836 11.2918H5.75195L5.2832 14.1024C5.22646 14.4428 4.90396 14.6728 4.56348 14.616C4.22334 14.5591 3.99325 14.2375 4.0498 13.8973L4.48438 11.2918H2C1.65493 11.2918 1.37518 11.0118 1.375 10.6668C1.375 10.3216 1.65482 10.0418 2 10.0418H4.69238L5.37305 5.95782H2.66699C2.32181 5.95782 2.04199 5.678 2.04199 5.33282C2.04217 4.98779 2.32192 4.70782 2.66699 4.70782H5.58105L6.0498 1.89728C6.10655 1.55679 6.42905 1.32686 6.76953 1.3836C7.10985 1.44041 7.33981 1.76201 7.2832 2.10235L6.84863 4.70782H10.915L11.3838 1.89728C11.4405 1.55685 11.7621 1.32695 12.1025 1.3836ZM5.95996 10.0418H10.0264L10.707 5.95782H6.64062L5.95996 10.0418Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/label-icon.tsx b/packages/propel/src/icons/properties/label-icon.tsx
index 2bfeae065..5f0df4f68 100644
--- a/packages/propel/src/icons/properties/label-icon.tsx
+++ b/packages/propel/src/icons/properties/label-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const LabelPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function LabelPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -18,4 +18,4 @@ export const LabelPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor",
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/properties/members-icon.tsx b/packages/propel/src/icons/properties/members-icon.tsx
index 95e903e97..ec6733dc7 100644
--- a/packages/propel/src/icons/properties/members-icon.tsx
+++ b/packages/propel/src/icons/properties/members-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const MembersPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M10.708 14C10.708 13.3702 10.7072 12.9287 10.6836 12.583C10.6604 12.2435 10.6173 12.0418 10.5527 11.8857C10.3455 11.3855 9.94754 10.9875 9.44727 10.7803C9.2912 10.7157 9.08953 10.6716 8.75 10.6484C8.40434 10.6249 7.96283 10.625 7.33301 10.625H5.33301C4.7032 10.625 4.26169 10.6249 3.91602 10.6484C3.57648 10.6716 3.37481 10.7157 3.21875 10.7803C2.71847 10.9875 2.3205 11.3855 2.11328 11.8857C2.0487 12.0418 2.00464 12.2435 1.98145 12.583C1.95786 12.9287 1.95801 13.3702 1.95801 14C1.95801 14.3452 1.67819 14.625 1.33301 14.625C0.987832 14.625 0.70801 14.3452 0.70801 14C0.70801 13.3873 0.707216 12.8961 0.734377 12.498C0.76193 12.0945 0.820736 11.741 0.958987 11.4072C1.29307 10.6007 1.93369 9.96008 2.74024 9.62598C3.07402 9.48772 3.42749 9.42892 3.83106 9.40137C4.22915 9.3742 4.72031 9.375 5.33301 9.375H7.33301C7.94572 9.375 8.43688 9.3742 8.83496 9.40137C9.23853 9.42892 9.592 9.48772 9.92578 9.62598C10.7323 9.96008 11.3729 10.6007 11.707 11.4072C11.8453 11.741 11.9041 12.0945 11.9316 12.498C11.9588 12.8961 11.958 13.3873 11.958 14C11.958 14.3452 11.6782 14.625 11.333 14.625C10.9878 14.625 10.708 14.3452 10.708 14ZM14.041 14V12.667C14.041 11.7166 13.3914 10.9163 12.5107 10.6895C12.1765 10.6034 11.9755 10.262 12.0615 9.92773C12.1478 9.59378 12.4882 9.39251 12.8223 9.47852C14.2418 9.84395 15.291 11.1324 15.291 12.667V14C15.291 14.3452 15.0112 14.625 14.666 14.625C14.321 14.6248 14.041 14.3451 14.041 14ZM8.375 4.66699C8.375 3.53941 7.46057 2.625 6.33301 2.625C5.20543 2.625 4.29102 3.53941 4.29102 4.66699C4.29119 5.79443 5.20554 6.70801 6.33301 6.70801C7.46046 6.70801 8.37483 5.79442 8.375 4.66699ZM11.375 4.66699C11.375 3.81123 10.8479 3.07683 10.0986 2.77344C9.77868 2.64392 9.62439 2.27894 9.75391 1.95898C9.88353 1.63935 10.2476 1.48494 10.5674 1.61426C11.7725 2.1021 12.625 3.28458 12.625 4.66699C12.6249 6.04925 11.7725 7.231 10.5674 7.71875C10.2475 7.84818 9.88345 7.69386 9.75391 7.37402C9.62442 7.05408 9.77871 6.69007 10.0986 6.56055C10.8479 6.2573 11.3749 5.52271 11.375 4.66699ZM9.625 4.66699C9.62483 6.48478 8.15081 7.95801 6.33301 7.95801C4.51518 7.95801 3.04119 6.48478 3.04102 4.66699C3.04102 2.84905 4.51507 1.375 6.33301 1.375C8.15092 1.375 9.625 2.84905 9.625 4.66699Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function MembersPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M10.708 14C10.708 13.3702 10.7072 12.9287 10.6836 12.583C10.6604 12.2435 10.6173 12.0418 10.5527 11.8857C10.3455 11.3855 9.94754 10.9875 9.44727 10.7803C9.2912 10.7157 9.08953 10.6716 8.75 10.6484C8.40434 10.6249 7.96283 10.625 7.33301 10.625H5.33301C4.7032 10.625 4.26169 10.6249 3.91602 10.6484C3.57648 10.6716 3.37481 10.7157 3.21875 10.7803C2.71847 10.9875 2.3205 11.3855 2.11328 11.8857C2.0487 12.0418 2.00464 12.2435 1.98145 12.583C1.95786 12.9287 1.95801 13.3702 1.95801 14C1.95801 14.3452 1.67819 14.625 1.33301 14.625C0.987832 14.625 0.70801 14.3452 0.70801 14C0.70801 13.3873 0.707216 12.8961 0.734377 12.498C0.76193 12.0945 0.820736 11.741 0.958987 11.4072C1.29307 10.6007 1.93369 9.96008 2.74024 9.62598C3.07402 9.48772 3.42749 9.42892 3.83106 9.40137C4.22915 9.3742 4.72031 9.375 5.33301 9.375H7.33301C7.94572 9.375 8.43688 9.3742 8.83496 9.40137C9.23853 9.42892 9.592 9.48772 9.92578 9.62598C10.7323 9.96008 11.3729 10.6007 11.707 11.4072C11.8453 11.741 11.9041 12.0945 11.9316 12.498C11.9588 12.8961 11.958 13.3873 11.958 14C11.958 14.3452 11.6782 14.625 11.333 14.625C10.9878 14.625 10.708 14.3452 10.708 14ZM14.041 14V12.667C14.041 11.7166 13.3914 10.9163 12.5107 10.6895C12.1765 10.6034 11.9755 10.262 12.0615 9.92773C12.1478 9.59378 12.4882 9.39251 12.8223 9.47852C14.2418 9.84395 15.291 11.1324 15.291 12.667V14C15.291 14.3452 15.0112 14.625 14.666 14.625C14.321 14.6248 14.041 14.3451 14.041 14ZM8.375 4.66699C8.375 3.53941 7.46057 2.625 6.33301 2.625C5.20543 2.625 4.29102 3.53941 4.29102 4.66699C4.29119 5.79443 5.20554 6.70801 6.33301 6.70801C7.46046 6.70801 8.37483 5.79442 8.375 4.66699ZM11.375 4.66699C11.375 3.81123 10.8479 3.07683 10.0986 2.77344C9.77868 2.64392 9.62439 2.27894 9.75391 1.95898C9.88353 1.63935 10.2476 1.48494 10.5674 1.61426C11.7725 2.1021 12.625 3.28458 12.625 4.66699C12.6249 6.04925 11.7725 7.231 10.5674 7.71875C10.2475 7.84818 9.88345 7.69386 9.75391 7.37402C9.62442 7.05408 9.77871 6.69007 10.0986 6.56055C10.8479 6.2573 11.3749 5.52271 11.375 4.66699ZM9.625 4.66699C9.62483 6.48478 8.15081 7.95801 6.33301 7.95801C4.51518 7.95801 3.04119 6.48478 3.04102 4.66699C3.04102 2.84905 4.51507 1.375 6.33301 1.375C8.15092 1.375 9.625 2.84905 9.625 4.66699Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/overdue-date-icon.tsx b/packages/propel/src/icons/properties/overdue-date-icon.tsx
index 97b36e673..a53c0edd7 100644
--- a/packages/propel/src/icons/properties/overdue-date-icon.tsx
+++ b/packages/propel/src/icons/properties/overdue-date-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const OverdueDatePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 7.29102H2.625V11.4668C2.625 12.0369 2.62571 12.4274 2.65039 12.7295C2.67449 13.024 2.71781 13.1799 2.77441 13.291C2.90624 13.5497 3.1173 13.7598 3.37598 13.8916C3.48708 13.9482 3.64284 13.9925 3.9375 14.0166C4.23962 14.0413 4.62998 14.041 5.2002 14.041H10.7998C11.37 14.041 11.7604 14.0413 12.0625 14.0166C12.3571 13.9925 12.5129 13.9482 12.624 13.8916C12.8827 13.7598 13.0938 13.5497 13.2256 13.291C13.2822 13.1799 13.3255 13.024 13.3496 12.7295C13.3743 12.4274 13.375 12.0369 13.375 11.4668V7.29102ZM9.22461 8.55762C9.46865 8.31362 9.86433 8.31367 10.1084 8.55762C10.3525 8.80168 10.3524 9.19733 10.1084 9.44141L8.88379 10.666L10.1084 11.8906C10.3525 12.1347 10.3525 12.5313 10.1084 12.7754C9.86437 13.0191 9.46861 13.0192 9.22461 12.7754L8 11.5498L6.77539 12.7754C6.53143 13.0192 6.13567 13.0191 5.8916 12.7754C5.64752 12.5313 5.64752 12.1347 5.8916 11.8906L7.11523 10.666L5.8916 9.44141C5.64752 9.19733 5.64752 8.80169 5.8916 8.55762C6.1357 8.31374 6.53138 8.31361 6.77539 8.55762L8 9.78223L9.22461 8.55762ZM10.042 4V3.29102H5.95801V4C5.95783 4.34503 5.67808 4.625 5.33301 4.625C4.98809 4.62482 4.70818 4.34492 4.70801 4V3.29297C4.39072 3.29481 4.14362 3.29958 3.9375 3.31641C3.64272 3.34049 3.48709 3.38481 3.37598 3.44141C3.11725 3.57323 2.90624 3.78327 2.77441 4.04199C2.71783 4.15308 2.67448 4.30883 2.65039 4.60352C2.62571 4.90564 2.625 5.29592 2.625 5.86621V6.04102H13.375V5.86621C13.375 5.29591 13.3743 4.90564 13.3496 4.60352C13.3255 4.30883 13.2822 4.15308 13.2256 4.04199C13.0938 3.78327 12.8827 3.57322 12.624 3.44141C12.5129 3.38481 12.3572 3.34049 12.0625 3.31641C11.8564 3.29958 11.6093 3.29481 11.292 3.29297V4C11.2918 4.34492 11.0119 4.62482 10.667 4.625C10.3219 4.625 10.0422 4.34503 10.042 4ZM14.625 11.4668C14.625 12.0163 14.6255 12.4663 14.5957 12.8311C14.5653 13.2031 14.5002 13.5417 14.3389 13.8584C14.0872 14.3522 13.6853 14.7533 13.1914 15.0049C12.8747 15.1662 12.5362 15.2313 12.1641 15.2617C11.7993 15.2915 11.3494 15.291 10.7998 15.291H5.2002C4.65066 15.291 4.20073 15.2915 3.83594 15.2617C3.46383 15.2313 3.12526 15.1662 2.80859 15.0049C2.31476 14.7533 1.91282 14.3522 1.66113 13.8584C1.49981 13.5417 1.43471 13.2031 1.4043 12.8311C1.3745 12.4663 1.375 12.0163 1.375 11.4668V5.86621C1.375 5.31658 1.3745 4.86676 1.4043 4.50195C1.4347 4.1298 1.49976 3.79131 1.66113 3.47461C1.9128 2.98069 2.31467 2.57881 2.80859 2.32715C3.12519 2.16592 3.46393 2.10071 3.83594 2.07031C4.08533 2.04996 4.37446 2.04486 4.70801 2.04297V1.33301C4.70801 0.987938 4.98798 0.708184 5.33301 0.708008C5.67819 0.708008 5.95801 0.98783 5.95801 1.33301V2.04102H10.042V1.33301C10.042 0.98783 10.3218 0.708008 10.667 0.708008C11.012 0.708183 11.292 0.987938 11.292 1.33301V2.04297C11.6255 2.04486 11.9147 2.04996 12.1641 2.07031C12.5361 2.10071 12.8748 2.16593 13.1914 2.32715C13.6854 2.57882 14.0872 2.9807 14.3389 3.47461L14.3945 3.59473C14.5155 3.87672 14.5691 4.17636 14.5957 4.50195C14.6255 4.86677 14.625 5.31659 14.625 5.86621V11.4668Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function OverdueDatePropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 7.29102H2.625V11.4668C2.625 12.0369 2.62571 12.4274 2.65039 12.7295C2.67449 13.024 2.71781 13.1799 2.77441 13.291C2.90624 13.5497 3.1173 13.7598 3.37598 13.8916C3.48708 13.9482 3.64284 13.9925 3.9375 14.0166C4.23962 14.0413 4.62998 14.041 5.2002 14.041H10.7998C11.37 14.041 11.7604 14.0413 12.0625 14.0166C12.3571 13.9925 12.5129 13.9482 12.624 13.8916C12.8827 13.7598 13.0938 13.5497 13.2256 13.291C13.2822 13.1799 13.3255 13.024 13.3496 12.7295C13.3743 12.4274 13.375 12.0369 13.375 11.4668V7.29102ZM9.22461 8.55762C9.46865 8.31362 9.86433 8.31367 10.1084 8.55762C10.3525 8.80168 10.3524 9.19733 10.1084 9.44141L8.88379 10.666L10.1084 11.8906C10.3525 12.1347 10.3525 12.5313 10.1084 12.7754C9.86437 13.0191 9.46861 13.0192 9.22461 12.7754L8 11.5498L6.77539 12.7754C6.53143 13.0192 6.13567 13.0191 5.8916 12.7754C5.64752 12.5313 5.64752 12.1347 5.8916 11.8906L7.11523 10.666L5.8916 9.44141C5.64752 9.19733 5.64752 8.80169 5.8916 8.55762C6.1357 8.31374 6.53138 8.31361 6.77539 8.55762L8 9.78223L9.22461 8.55762ZM10.042 4V3.29102H5.95801V4C5.95783 4.34503 5.67808 4.625 5.33301 4.625C4.98809 4.62482 4.70818 4.34492 4.70801 4V3.29297C4.39072 3.29481 4.14362 3.29958 3.9375 3.31641C3.64272 3.34049 3.48709 3.38481 3.37598 3.44141C3.11725 3.57323 2.90624 3.78327 2.77441 4.04199C2.71783 4.15308 2.67448 4.30883 2.65039 4.60352C2.62571 4.90564 2.625 5.29592 2.625 5.86621V6.04102H13.375V5.86621C13.375 5.29591 13.3743 4.90564 13.3496 4.60352C13.3255 4.30883 13.2822 4.15308 13.2256 4.04199C13.0938 3.78327 12.8827 3.57322 12.624 3.44141C12.5129 3.38481 12.3572 3.34049 12.0625 3.31641C11.8564 3.29958 11.6093 3.29481 11.292 3.29297V4C11.2918 4.34492 11.0119 4.62482 10.667 4.625C10.3219 4.625 10.0422 4.34503 10.042 4ZM14.625 11.4668C14.625 12.0163 14.6255 12.4663 14.5957 12.8311C14.5653 13.2031 14.5002 13.5417 14.3389 13.8584C14.0872 14.3522 13.6853 14.7533 13.1914 15.0049C12.8747 15.1662 12.5362 15.2313 12.1641 15.2617C11.7993 15.2915 11.3494 15.291 10.7998 15.291H5.2002C4.65066 15.291 4.20073 15.2915 3.83594 15.2617C3.46383 15.2313 3.12526 15.1662 2.80859 15.0049C2.31476 14.7533 1.91282 14.3522 1.66113 13.8584C1.49981 13.5417 1.43471 13.2031 1.4043 12.8311C1.3745 12.4663 1.375 12.0163 1.375 11.4668V5.86621C1.375 5.31658 1.3745 4.86676 1.4043 4.50195C1.4347 4.1298 1.49976 3.79131 1.66113 3.47461C1.9128 2.98069 2.31467 2.57881 2.80859 2.32715C3.12519 2.16592 3.46393 2.10071 3.83594 2.07031C4.08533 2.04996 4.37446 2.04486 4.70801 2.04297V1.33301C4.70801 0.987938 4.98798 0.708184 5.33301 0.708008C5.67819 0.708008 5.95801 0.98783 5.95801 1.33301V2.04102H10.042V1.33301C10.042 0.98783 10.3218 0.708008 10.667 0.708008C11.012 0.708183 11.292 0.987938 11.292 1.33301V2.04297C11.6255 2.04486 11.9147 2.04996 12.1641 2.07031C12.5361 2.10071 12.8748 2.16593 13.1914 2.32715C13.6854 2.57882 14.0872 2.9807 14.3389 3.47461L14.3945 3.59473C14.5155 3.87672 14.5691 4.17636 14.5957 4.50195C14.6255 4.86677 14.625 5.31659 14.625 5.86621V11.4668Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/parent-icon.tsx b/packages/propel/src/icons/properties/parent-icon.tsx
index 36dd58fc7..5e941aefc 100644
--- a/packages/propel/src/icons/properties/parent-icon.tsx
+++ b/packages/propel/src/icons/properties/parent-icon.tsx
@@ -3,19 +3,21 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ParentPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 2.66699C13.375 2.64398 13.356 2.625 13.333 2.625H2.66699C2.64398 2.625 2.625 2.64398 2.625 2.66699V6C2.625 6.02301 2.64398 6.04199 2.66699 6.04199H13.333C13.356 6.04199 13.375 6.02301 13.375 6V2.66699ZM14.625 6C14.625 6.71337 14.0464 7.29199 13.333 7.29199H2.66699C1.95362 7.29199 1.375 6.71337 1.375 6V2.66699C1.375 1.95362 1.95362 1.375 2.66699 1.375H13.333C14.0464 1.375 14.625 1.95362 14.625 2.66699V6Z"
-      fill={color}
-    />
-    <path
-      d="M13.3755 10C13.3755 9.97699 13.3565 9.95801 13.3335 9.95801H10.0005C9.97748 9.95801 9.9585 9.97699 9.9585 10V13.333C9.9585 13.356 9.97748 13.375 10.0005 13.375H13.3335C13.3565 13.375 13.3755 13.356 13.3755 13.333V10ZM14.6255 13.333C14.6255 14.0464 14.0469 14.625 13.3335 14.625H10.0005C9.28712 14.625 8.7085 14.0464 8.7085 13.333V10C8.7085 9.28663 9.28712 8.70801 10.0005 8.70801H13.3335C14.0469 8.70801 14.6255 9.28663 14.6255 10V13.333Z"
-      fill={color}
-    />
-    <path
-      d="M2.76367 10.5996V10.4033L2.41797 10.7148C2.16139 10.9455 1.766 10.9245 1.53516 10.668C1.30445 10.4114 1.32553 10.016 1.58203 9.78516L2.9707 8.53516L3.06543 8.46484C3.29681 8.32476 3.59877 8.34834 3.80664 8.53516L5.19629 9.78516C5.45278 10.0161 5.47307 10.4114 5.24219 10.668C5.01128 10.9245 4.61594 10.9458 4.35938 10.7148L4.01367 10.4033V10.5996C4.01367 11.0309 4.01466 11.313 4.03418 11.5283C4.05286 11.734 4.08474 11.8209 4.11426 11.873C4.20505 12.0334 4.35735 12.1758 4.55957 12.2686C4.64109 12.3059 4.76292 12.3385 5.00684 12.3564C5.25649 12.3748 5.57974 12.375 6.05566 12.375H7C7.34518 12.375 7.625 12.6548 7.625 13C7.625 13.3452 7.34518 13.625 7 13.625H6.05566C5.59824 13.625 5.22121 13.6251 4.91504 13.6025C4.60331 13.5796 4.31307 13.5304 4.03809 13.4043C3.61331 13.2094 3.25509 12.8932 3.02637 12.4893C2.87424 12.2205 2.81579 11.936 2.78906 11.6416C2.76321 11.3567 2.76367 11.0082 2.76367 10.5996Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function ParentPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 2.66699C13.375 2.64398 13.356 2.625 13.333 2.625H2.66699C2.64398 2.625 2.625 2.64398 2.625 2.66699V6C2.625 6.02301 2.64398 6.04199 2.66699 6.04199H13.333C13.356 6.04199 13.375 6.02301 13.375 6V2.66699ZM14.625 6C14.625 6.71337 14.0464 7.29199 13.333 7.29199H2.66699C1.95362 7.29199 1.375 6.71337 1.375 6V2.66699C1.375 1.95362 1.95362 1.375 2.66699 1.375H13.333C14.0464 1.375 14.625 1.95362 14.625 2.66699V6Z"
+        fill={color}
+      />
+      <path
+        d="M13.3755 10C13.3755 9.97699 13.3565 9.95801 13.3335 9.95801H10.0005C9.97748 9.95801 9.9585 9.97699 9.9585 10V13.333C9.9585 13.356 9.97748 13.375 10.0005 13.375H13.3335C13.3565 13.375 13.3755 13.356 13.3755 13.333V10ZM14.6255 13.333C14.6255 14.0464 14.0469 14.625 13.3335 14.625H10.0005C9.28712 14.625 8.7085 14.0464 8.7085 13.333V10C8.7085 9.28663 9.28712 8.70801 10.0005 8.70801H13.3335C14.0469 8.70801 14.6255 9.28663 14.6255 10V13.333Z"
+        fill={color}
+      />
+      <path
+        d="M2.76367 10.5996V10.4033L2.41797 10.7148C2.16139 10.9455 1.766 10.9245 1.53516 10.668C1.30445 10.4114 1.32553 10.016 1.58203 9.78516L2.9707 8.53516L3.06543 8.46484C3.29681 8.32476 3.59877 8.34834 3.80664 8.53516L5.19629 9.78516C5.45278 10.0161 5.47307 10.4114 5.24219 10.668C5.01128 10.9245 4.61594 10.9458 4.35938 10.7148L4.01367 10.4033V10.5996C4.01367 11.0309 4.01466 11.313 4.03418 11.5283C4.05286 11.734 4.08474 11.8209 4.11426 11.873C4.20505 12.0334 4.35735 12.1758 4.55957 12.2686C4.64109 12.3059 4.76292 12.3385 5.00684 12.3564C5.25649 12.3748 5.57974 12.375 6.05566 12.375H7C7.34518 12.375 7.625 12.6548 7.625 13C7.625 13.3452 7.34518 13.625 7 13.625H6.05566C5.59824 13.625 5.22121 13.6251 4.91504 13.6025C4.60331 13.5796 4.31307 13.5304 4.03809 13.4043C3.61331 13.2094 3.25509 12.8932 3.02637 12.4893C2.87424 12.2205 2.81579 11.936 2.78906 11.6416C2.76321 11.3567 2.76367 11.0082 2.76367 10.5996Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/priority-icon.tsx b/packages/propel/src/icons/properties/priority-icon.tsx
index de528a987..ed1ea3202 100644
--- a/packages/propel/src/icons/properties/priority-icon.tsx
+++ b/packages/propel/src/icons/properties/priority-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const PriorityPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M3.375 13.334V10.667C3.375 10.3218 3.65482 10.042 4 10.042C4.34518 10.042 4.625 10.3218 4.625 10.667V13.334C4.62482 13.679 4.34507 13.959 4 13.959C3.65493 13.959 3.37518 13.679 3.375 13.334ZM7.375 13.334V6.66699C7.375 6.32181 7.65482 6.04199 8 6.04199C8.34518 6.04199 8.625 6.32181 8.625 6.66699V13.334C8.62482 13.679 8.34507 13.959 8 13.959C7.65493 13.959 7.37518 13.679 7.375 13.334ZM11.375 13.334V2.66699C11.375 2.32181 11.6548 2.04199 12 2.04199C12.3452 2.04199 12.625 2.32181 12.625 2.66699V13.334C12.6248 13.679 12.3451 13.959 12 13.959C11.6549 13.959 11.3752 13.679 11.375 13.334Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function PriorityPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M3.375 13.334V10.667C3.375 10.3218 3.65482 10.042 4 10.042C4.34518 10.042 4.625 10.3218 4.625 10.667V13.334C4.62482 13.679 4.34507 13.959 4 13.959C3.65493 13.959 3.37518 13.679 3.375 13.334ZM7.375 13.334V6.66699C7.375 6.32181 7.65482 6.04199 8 6.04199C8.34518 6.04199 8.625 6.32181 8.625 6.66699V13.334C8.62482 13.679 8.34507 13.959 8 13.959C7.65493 13.959 7.37518 13.679 7.375 13.334ZM11.375 13.334V2.66699C11.375 2.32181 11.6548 2.04199 12 2.04199C12.3452 2.04199 12.625 2.32181 12.625 2.66699V13.334C12.6248 13.679 12.3451 13.959 12 13.959C11.6549 13.959 11.3752 13.679 11.375 13.334Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/relates-to-icon.tsx b/packages/propel/src/icons/properties/relates-to-icon.tsx
index 8328a1de8..02da39f2f 100644
--- a/packages/propel/src/icons/properties/relates-to-icon.tsx
+++ b/packages/propel/src/icons/properties/relates-to-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const RelatesToPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 14V13.4746C13.375 12.8344 13.3748 12.3916 13.3467 12.0479C13.3192 11.7115 13.2675 11.5255 13.1973 11.3877C13.0415 11.0819 12.7931 10.8326 12.4873 10.6768C12.3496 10.6066 12.1632 10.5558 11.8271 10.5283C11.4833 10.5002 11.0398 10.5 10.3994 10.5H9.50879L10.3164 11.3076C10.5605 11.5517 10.5605 11.9483 10.3164 12.1924C10.0723 12.436 9.67656 12.4362 9.43262 12.1924L7.55762 10.3174C7.31354 10.0733 7.31354 9.67669 7.55762 9.43262L9.43262 7.55762C9.67656 7.31375 10.0723 7.31398 10.3164 7.55762C10.5605 7.8017 10.5605 8.19831 10.3164 8.44238L9.50879 9.25H10.3994C11.0192 9.25 11.5222 9.24999 11.9287 9.2832C12.3424 9.31701 12.7114 9.3886 13.0547 9.56348C13.5955 9.83905 14.0359 10.2785 14.3115 10.8193C14.4865 11.1628 14.558 11.5325 14.5918 11.9463C14.625 12.3528 14.625 12.855 14.625 13.4746V14C14.625 14.3451 14.3451 14.6249 14 14.625C13.6548 14.625 13.375 14.3452 13.375 14ZM13.375 7.16699V5.2002C13.375 4.62993 13.3743 4.23962 13.3496 3.9375C13.3255 3.64301 13.2821 3.48711 13.2256 3.37598C13.0938 3.11726 12.8828 2.90623 12.624 2.77441C12.5129 2.71788 12.357 2.67446 12.0625 2.65039C11.7604 2.62572 11.3701 2.625 10.7998 2.625H5.2002C4.62993 2.625 4.23962 2.62572 3.9375 2.65039C3.643 2.67445 3.48711 2.71787 3.37598 2.77441C3.11726 2.90622 2.90622 3.11726 2.77441 3.37598C2.71787 3.48711 2.67445 3.643 2.65039 3.9375C2.62572 4.23962 2.625 4.62993 2.625 5.2002V10.7998C2.625 11.3701 2.62572 11.7604 2.65039 12.0625C2.67446 12.357 2.71788 12.5129 2.77441 12.624C2.90623 12.8828 3.11726 13.0938 3.37598 13.2256C3.48711 13.2821 3.64301 13.3255 3.9375 13.3496C4.23962 13.3743 4.62993 13.375 5.2002 13.375H8C8.34518 13.375 8.625 13.6548 8.625 14C8.625 14.3452 8.34518 14.625 8 14.625H5.2002C4.65066 14.625 4.20072 14.6255 3.83594 14.5957C3.46387 14.5653 3.12524 14.5001 2.80859 14.3389C2.31464 14.0872 1.91278 13.6853 1.66113 13.1914C1.49985 12.8748 1.4347 12.5361 1.4043 12.1641C1.37452 11.7993 1.375 11.3493 1.375 10.7998V5.2002C1.375 4.65066 1.37452 4.20072 1.4043 3.83594C1.4347 3.46388 1.49986 3.12523 1.66113 2.80859C1.91279 2.31464 2.31464 1.91279 2.80859 1.66113C3.12523 1.49986 3.46388 1.4347 3.83594 1.4043C4.20072 1.37452 4.65066 1.375 5.2002 1.375H10.7998C11.3493 1.375 11.7993 1.37452 12.1641 1.4043C12.5361 1.4347 12.8748 1.49985 13.1914 1.66113C13.6853 1.91278 14.0872 2.31464 14.3389 2.80859C14.5001 3.12524 14.5653 3.46387 14.5957 3.83594C14.6255 4.20072 14.625 4.65066 14.625 5.2002V7.16699C14.625 7.51216 14.3452 7.79198 14 7.79199C13.6549 7.79194 13.375 7.51213 13.375 7.16699Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function RelatesToPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 14V13.4746C13.375 12.8344 13.3748 12.3916 13.3467 12.0479C13.3192 11.7115 13.2675 11.5255 13.1973 11.3877C13.0415 11.0819 12.7931 10.8326 12.4873 10.6768C12.3496 10.6066 12.1632 10.5558 11.8271 10.5283C11.4833 10.5002 11.0398 10.5 10.3994 10.5H9.50879L10.3164 11.3076C10.5605 11.5517 10.5605 11.9483 10.3164 12.1924C10.0723 12.436 9.67656 12.4362 9.43262 12.1924L7.55762 10.3174C7.31354 10.0733 7.31354 9.67669 7.55762 9.43262L9.43262 7.55762C9.67656 7.31375 10.0723 7.31398 10.3164 7.55762C10.5605 7.8017 10.5605 8.19831 10.3164 8.44238L9.50879 9.25H10.3994C11.0192 9.25 11.5222 9.24999 11.9287 9.2832C12.3424 9.31701 12.7114 9.3886 13.0547 9.56348C13.5955 9.83905 14.0359 10.2785 14.3115 10.8193C14.4865 11.1628 14.558 11.5325 14.5918 11.9463C14.625 12.3528 14.625 12.855 14.625 13.4746V14C14.625 14.3451 14.3451 14.6249 14 14.625C13.6548 14.625 13.375 14.3452 13.375 14ZM13.375 7.16699V5.2002C13.375 4.62993 13.3743 4.23962 13.3496 3.9375C13.3255 3.64301 13.2821 3.48711 13.2256 3.37598C13.0938 3.11726 12.8828 2.90623 12.624 2.77441C12.5129 2.71788 12.357 2.67446 12.0625 2.65039C11.7604 2.62572 11.3701 2.625 10.7998 2.625H5.2002C4.62993 2.625 4.23962 2.62572 3.9375 2.65039C3.643 2.67445 3.48711 2.71787 3.37598 2.77441C3.11726 2.90622 2.90622 3.11726 2.77441 3.37598C2.71787 3.48711 2.67445 3.643 2.65039 3.9375C2.62572 4.23962 2.625 4.62993 2.625 5.2002V10.7998C2.625 11.3701 2.62572 11.7604 2.65039 12.0625C2.67446 12.357 2.71788 12.5129 2.77441 12.624C2.90623 12.8828 3.11726 13.0938 3.37598 13.2256C3.48711 13.2821 3.64301 13.3255 3.9375 13.3496C4.23962 13.3743 4.62993 13.375 5.2002 13.375H8C8.34518 13.375 8.625 13.6548 8.625 14C8.625 14.3452 8.34518 14.625 8 14.625H5.2002C4.65066 14.625 4.20072 14.6255 3.83594 14.5957C3.46387 14.5653 3.12524 14.5001 2.80859 14.3389C2.31464 14.0872 1.91278 13.6853 1.66113 13.1914C1.49985 12.8748 1.4347 12.5361 1.4043 12.1641C1.37452 11.7993 1.375 11.3493 1.375 10.7998V5.2002C1.375 4.65066 1.37452 4.20072 1.4043 3.83594C1.4347 3.46388 1.49986 3.12523 1.66113 2.80859C1.91279 2.31464 2.31464 1.91279 2.80859 1.66113C3.12523 1.49986 3.46388 1.4347 3.83594 1.4043C4.20072 1.37452 4.65066 1.375 5.2002 1.375H10.7998C11.3493 1.375 11.7993 1.37452 12.1641 1.4043C12.5361 1.4347 12.8748 1.49985 13.1914 1.66113C13.6853 1.91278 14.0872 2.31464 14.3389 2.80859C14.5001 3.12524 14.5653 3.46387 14.5957 3.83594C14.6255 4.20072 14.625 4.65066 14.625 5.2002V7.16699C14.625 7.51216 14.3452 7.79198 14 7.79199C13.6549 7.79194 13.375 7.51213 13.375 7.16699Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/relation-icon.tsx b/packages/propel/src/icons/properties/relation-icon.tsx
index 258ab030d..370406c71 100644
--- a/packages/propel/src/icons/properties/relation-icon.tsx
+++ b/packages/propel/src/icons/properties/relation-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const RelationPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 13.333C13.375 12.9419 13.0581 12.6252 12.667 12.625C12.2758 12.625 11.958 12.9418 11.958 13.333C11.958 13.7242 12.2758 14.041 12.667 14.041C13.0581 14.0408 13.375 13.7241 13.375 13.333ZM13.375 8C13.375 7.60889 13.0581 7.29119 12.667 7.29102C12.2758 7.29102 11.958 7.60878 11.958 8C11.9582 8.39107 12.2759 8.70801 12.667 8.70801C13.058 8.70783 13.3748 8.39096 13.375 8ZM2.625 8C2.62518 8.39096 2.94206 8.70783 3.33301 8.70801C3.72411 8.70801 4.04182 8.39107 4.04199 8C4.04199 7.60878 3.72422 7.29102 3.33301 7.29102C2.94195 7.29119 2.625 7.60889 2.625 8ZM13.375 2.66602C13.3748 2.27507 13.058 1.95818 12.667 1.95801C12.2759 1.95801 11.9582 2.27496 11.958 2.66602C11.958 3.05722 12.2758 3.375 12.667 3.375C13.0581 3.37482 13.375 3.05712 13.375 2.66602ZM14.625 2.66602C14.625 3.74746 13.7484 4.62482 12.667 4.625C11.8047 4.625 11.0729 4.06708 10.8115 3.29297C10.4437 3.29422 10.1655 3.29779 9.9375 3.31641C9.64277 3.34049 9.48713 3.38481 9.37598 3.44141C9.11726 3.57322 8.90623 3.78326 8.77441 4.04199C8.71782 4.15308 8.67448 4.30883 8.65039 4.60352C8.6257 4.90564 8.625 5.29591 8.625 5.86621V7.375H10.8115C11.0724 6.59996 11.804 6.04102 12.667 6.04102C13.7484 6.04119 14.625 6.91853 14.625 8C14.6248 9.08132 13.7483 9.95783 12.667 9.95801C11.8042 9.95801 11.0726 9.39973 10.8115 8.625H8.625V10.1328C8.625 10.7031 8.62572 11.0934 8.65039 11.3955C8.67445 11.69 8.71787 11.8459 8.77441 11.957C8.90622 12.2157 9.11726 12.4268 9.37598 12.5586C9.4871 12.6151 9.643 12.6586 9.9375 12.6826C10.1655 12.7012 10.4436 12.7048 10.8115 12.7061C11.073 11.9321 11.8048 11.375 12.667 11.375C13.7484 11.3752 14.625 12.2515 14.625 13.333C14.625 14.4145 13.7484 15.2908 12.667 15.291C11.803 15.291 11.0706 14.7315 10.8105 13.9551C10.4333 13.9538 10.1105 13.9511 9.83594 13.9287C9.46387 13.8983 9.12523 13.8331 8.80859 13.6719C8.31464 13.4202 7.91279 13.0184 7.66113 12.5244C7.49986 12.2078 7.4347 11.8691 7.4043 11.4971C7.37452 11.1323 7.375 10.6823 7.375 10.1328V8.625H5.18848C4.92744 9.39974 4.19576 9.95801 3.33301 9.95801C2.25171 9.95783 1.37518 9.08133 1.375 8C1.375 6.91852 2.25161 6.04119 3.33301 6.04102C4.19598 6.04102 4.92761 6.59996 5.18848 7.375H7.375V5.86621C7.375 5.31659 7.3745 4.86677 7.4043 4.50195C7.4347 4.1298 7.49975 3.79132 7.66113 3.47461L7.7627 3.29395C8.01489 2.88278 8.37641 2.54735 8.80859 2.32715C9.1252 2.16593 9.46392 2.10071 9.83594 2.07031C10.1105 2.0479 10.4333 2.0442 10.8105 2.04297C11.071 1.26718 11.8035 0.708008 12.667 0.708008C13.7483 0.708184 14.6248 1.58472 14.625 2.66602Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function RelationPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 13.333C13.375 12.9419 13.0581 12.6252 12.667 12.625C12.2758 12.625 11.958 12.9418 11.958 13.333C11.958 13.7242 12.2758 14.041 12.667 14.041C13.0581 14.0408 13.375 13.7241 13.375 13.333ZM13.375 8C13.375 7.60889 13.0581 7.29119 12.667 7.29102C12.2758 7.29102 11.958 7.60878 11.958 8C11.9582 8.39107 12.2759 8.70801 12.667 8.70801C13.058 8.70783 13.3748 8.39096 13.375 8ZM2.625 8C2.62518 8.39096 2.94206 8.70783 3.33301 8.70801C3.72411 8.70801 4.04182 8.39107 4.04199 8C4.04199 7.60878 3.72422 7.29102 3.33301 7.29102C2.94195 7.29119 2.625 7.60889 2.625 8ZM13.375 2.66602C13.3748 2.27507 13.058 1.95818 12.667 1.95801C12.2759 1.95801 11.9582 2.27496 11.958 2.66602C11.958 3.05722 12.2758 3.375 12.667 3.375C13.0581 3.37482 13.375 3.05712 13.375 2.66602ZM14.625 2.66602C14.625 3.74746 13.7484 4.62482 12.667 4.625C11.8047 4.625 11.0729 4.06708 10.8115 3.29297C10.4437 3.29422 10.1655 3.29779 9.9375 3.31641C9.64277 3.34049 9.48713 3.38481 9.37598 3.44141C9.11726 3.57322 8.90623 3.78326 8.77441 4.04199C8.71782 4.15308 8.67448 4.30883 8.65039 4.60352C8.6257 4.90564 8.625 5.29591 8.625 5.86621V7.375H10.8115C11.0724 6.59996 11.804 6.04102 12.667 6.04102C13.7484 6.04119 14.625 6.91853 14.625 8C14.6248 9.08132 13.7483 9.95783 12.667 9.95801C11.8042 9.95801 11.0726 9.39973 10.8115 8.625H8.625V10.1328C8.625 10.7031 8.62572 11.0934 8.65039 11.3955C8.67445 11.69 8.71787 11.8459 8.77441 11.957C8.90622 12.2157 9.11726 12.4268 9.37598 12.5586C9.4871 12.6151 9.643 12.6586 9.9375 12.6826C10.1655 12.7012 10.4436 12.7048 10.8115 12.7061C11.073 11.9321 11.8048 11.375 12.667 11.375C13.7484 11.3752 14.625 12.2515 14.625 13.333C14.625 14.4145 13.7484 15.2908 12.667 15.291C11.803 15.291 11.0706 14.7315 10.8105 13.9551C10.4333 13.9538 10.1105 13.9511 9.83594 13.9287C9.46387 13.8983 9.12523 13.8331 8.80859 13.6719C8.31464 13.4202 7.91279 13.0184 7.66113 12.5244C7.49986 12.2078 7.4347 11.8691 7.4043 11.4971C7.37452 11.1323 7.375 10.6823 7.375 10.1328V8.625H5.18848C4.92744 9.39974 4.19576 9.95801 3.33301 9.95801C2.25171 9.95783 1.37518 9.08133 1.375 8C1.375 6.91852 2.25161 6.04119 3.33301 6.04102C4.19598 6.04102 4.92761 6.59996 5.18848 7.375H7.375V5.86621C7.375 5.31659 7.3745 4.86677 7.4043 4.50195C7.4347 4.1298 7.49975 3.79132 7.66113 3.47461L7.7627 3.29395C8.01489 2.88278 8.37641 2.54735 8.80859 2.32715C9.1252 2.16593 9.46392 2.10071 9.83594 2.07031C10.1105 2.0479 10.4333 2.0442 10.8105 2.04297C11.071 1.26718 11.8035 0.708008 12.667 0.708008C13.7483 0.708184 14.6248 1.58472 14.625 2.66602Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/scope-icon.tsx b/packages/propel/src/icons/properties/scope-icon.tsx
index afee1b710..4cdd28739 100644
--- a/packages/propel/src/icons/properties/scope-icon.tsx
+++ b/packages/propel/src/icons/properties/scope-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ScopePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function ScopePropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -14,4 +14,4 @@ export const ScopePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor",
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/properties/start-date-icon.tsx b/packages/propel/src/icons/properties/start-date-icon.tsx
index db46c6817..31ec2b9aa 100644
--- a/packages/propel/src/icons/properties/start-date-icon.tsx
+++ b/packages/propel/src/icons/properties/start-date-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const StartDatePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M14.2085 10.833C14.2085 8.96905 12.6974 7.45801 10.8335 7.45801C8.96953 7.45801 7.4585 8.96905 7.4585 10.833C7.4585 12.697 8.96954 14.208 10.8335 14.208C12.6974 14.208 14.2085 12.6969 14.2085 10.833ZM10.2085 8.43262C10.2087 8.08762 10.4884 7.80762 10.8335 7.80762C11.1785 7.80762 11.4583 8.08762 11.4585 8.43262V10.4463L12.7134 11.0742C13.0217 11.2286 13.1467 11.6036 12.9927 11.9121C12.8383 12.2208 12.4625 12.3468 12.1538 12.1924L10.5542 11.3916C10.3425 11.2857 10.2085 11.0697 10.2085 10.833V8.43262ZM9.87549 3.83301V3.12402H5.7915V3.83301C5.79133 4.17804 5.51157 4.45801 5.1665 4.45801C4.82158 4.45783 4.54168 4.17793 4.5415 3.83301V3.12598C4.22421 3.12782 3.97711 3.13258 3.771 3.14941C3.47622 3.1735 3.32058 3.21782 3.20947 3.27441C2.95075 3.40624 2.73974 3.61628 2.60791 3.875C2.55132 3.98609 2.50797 4.14184 2.48389 4.43652C2.4592 4.73865 2.4585 5.12892 2.4585 5.69922V5.87402H5.8335C6.17857 5.87402 6.45832 6.154 6.4585 6.49902C6.4585 6.8442 6.17867 7.12402 5.8335 7.12402H2.4585V11.2998C2.4585 11.8699 2.45921 12.2604 2.48389 12.5625C2.50799 12.857 2.55131 13.0129 2.60791 13.124C2.73973 13.3827 2.95079 13.5928 3.20947 13.7246C3.32057 13.7812 3.47633 13.8255 3.771 13.8496C4.07311 13.8743 4.46347 13.874 5.03369 13.874C5.37867 13.8741 5.65852 14.1541 5.65869 14.499C5.65869 14.8441 5.37878 15.1239 5.03369 15.124C4.48416 15.124 4.03422 15.1245 3.66943 15.0947C3.29733 15.0643 2.95876 14.9992 2.64209 14.8379C2.14825 14.5863 1.74631 14.1852 1.49463 13.6914C1.33331 13.3748 1.26821 13.0361 1.23779 12.6641C1.20799 12.2993 1.2085 11.8494 1.2085 11.2998V5.69922C1.2085 5.14959 1.20799 4.69977 1.23779 4.33496C1.2682 3.96281 1.33326 3.62432 1.49463 3.30762C1.7463 2.8137 2.14817 2.41182 2.64209 2.16016C2.95869 1.99893 3.29743 1.93371 3.66943 1.90332C3.91882 1.88297 4.20796 1.87787 4.5415 1.87598V1.16602C4.5415 0.820946 4.82148 0.541192 5.1665 0.541016C5.51168 0.541016 5.7915 0.820838 5.7915 1.16602V1.87402H9.87549V1.16602C9.87549 0.820838 10.1553 0.541016 10.5005 0.541016C10.8455 0.541191 11.1255 0.820946 11.1255 1.16602V1.87598C11.459 1.87787 11.7482 1.88297 11.9976 1.90332C12.3696 1.93372 12.7083 1.99894 13.0249 2.16016C13.5188 2.41183 13.9207 2.8137 14.1724 3.30762L14.228 3.42773C14.349 3.70973 14.4026 4.00936 14.4292 4.33496C14.459 4.69977 14.4585 5.1496 14.4585 5.69922C14.4585 6.0444 14.1787 6.32422 13.8335 6.32422C13.4883 6.32422 13.2085 6.0444 13.2085 5.69922C13.2085 5.12893 13.2078 4.73865 13.1831 4.43652C13.159 4.14184 13.1157 3.98609 13.0591 3.875C12.9273 3.61627 12.7162 3.40623 12.4575 3.27441C12.3464 3.21781 12.1907 3.17349 11.896 3.14941C11.6899 3.13258 11.4428 3.12782 11.1255 3.12598V3.83301C11.1253 4.17793 10.8454 4.45783 10.5005 4.45801C10.1554 4.45801 9.87566 4.17804 9.87549 3.83301ZM15.4585 10.833C15.4585 13.3873 13.3878 15.458 10.8335 15.458C8.27918 15.458 6.2085 13.3873 6.2085 10.833C6.2085 8.27869 8.27918 6.20801 10.8335 6.20801C13.3878 6.20801 15.4585 8.27869 15.4585 10.833Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function StartDatePropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M14.2085 10.833C14.2085 8.96905 12.6974 7.45801 10.8335 7.45801C8.96953 7.45801 7.4585 8.96905 7.4585 10.833C7.4585 12.697 8.96954 14.208 10.8335 14.208C12.6974 14.208 14.2085 12.6969 14.2085 10.833ZM10.2085 8.43262C10.2087 8.08762 10.4884 7.80762 10.8335 7.80762C11.1785 7.80762 11.4583 8.08762 11.4585 8.43262V10.4463L12.7134 11.0742C13.0217 11.2286 13.1467 11.6036 12.9927 11.9121C12.8383 12.2208 12.4625 12.3468 12.1538 12.1924L10.5542 11.3916C10.3425 11.2857 10.2085 11.0697 10.2085 10.833V8.43262ZM9.87549 3.83301V3.12402H5.7915V3.83301C5.79133 4.17804 5.51157 4.45801 5.1665 4.45801C4.82158 4.45783 4.54168 4.17793 4.5415 3.83301V3.12598C4.22421 3.12782 3.97711 3.13258 3.771 3.14941C3.47622 3.1735 3.32058 3.21782 3.20947 3.27441C2.95075 3.40624 2.73974 3.61628 2.60791 3.875C2.55132 3.98609 2.50797 4.14184 2.48389 4.43652C2.4592 4.73865 2.4585 5.12892 2.4585 5.69922V5.87402H5.8335C6.17857 5.87402 6.45832 6.154 6.4585 6.49902C6.4585 6.8442 6.17867 7.12402 5.8335 7.12402H2.4585V11.2998C2.4585 11.8699 2.45921 12.2604 2.48389 12.5625C2.50799 12.857 2.55131 13.0129 2.60791 13.124C2.73973 13.3827 2.95079 13.5928 3.20947 13.7246C3.32057 13.7812 3.47633 13.8255 3.771 13.8496C4.07311 13.8743 4.46347 13.874 5.03369 13.874C5.37867 13.8741 5.65852 14.1541 5.65869 14.499C5.65869 14.8441 5.37878 15.1239 5.03369 15.124C4.48416 15.124 4.03422 15.1245 3.66943 15.0947C3.29733 15.0643 2.95876 14.9992 2.64209 14.8379C2.14825 14.5863 1.74631 14.1852 1.49463 13.6914C1.33331 13.3748 1.26821 13.0361 1.23779 12.6641C1.20799 12.2993 1.2085 11.8494 1.2085 11.2998V5.69922C1.2085 5.14959 1.20799 4.69977 1.23779 4.33496C1.2682 3.96281 1.33326 3.62432 1.49463 3.30762C1.7463 2.8137 2.14817 2.41182 2.64209 2.16016C2.95869 1.99893 3.29743 1.93371 3.66943 1.90332C3.91882 1.88297 4.20796 1.87787 4.5415 1.87598V1.16602C4.5415 0.820946 4.82148 0.541192 5.1665 0.541016C5.51168 0.541016 5.7915 0.820838 5.7915 1.16602V1.87402H9.87549V1.16602C9.87549 0.820838 10.1553 0.541016 10.5005 0.541016C10.8455 0.541191 11.1255 0.820946 11.1255 1.16602V1.87598C11.459 1.87787 11.7482 1.88297 11.9976 1.90332C12.3696 1.93372 12.7083 1.99894 13.0249 2.16016C13.5188 2.41183 13.9207 2.8137 14.1724 3.30762L14.228 3.42773C14.349 3.70973 14.4026 4.00936 14.4292 4.33496C14.459 4.69977 14.4585 5.1496 14.4585 5.69922C14.4585 6.0444 14.1787 6.32422 13.8335 6.32422C13.4883 6.32422 13.2085 6.0444 13.2085 5.69922C13.2085 5.12893 13.2078 4.73865 13.1831 4.43652C13.159 4.14184 13.1157 3.98609 13.0591 3.875C12.9273 3.61627 12.7162 3.40623 12.4575 3.27441C12.3464 3.21781 12.1907 3.17349 11.896 3.14941C11.6899 3.13258 11.4428 3.12782 11.1255 3.12598V3.83301C11.1253 4.17793 10.8454 4.45783 10.5005 4.45801C10.1554 4.45801 9.87566 4.17804 9.87549 3.83301ZM15.4585 10.833C15.4585 13.3873 13.3878 15.458 10.8335 15.458C8.27918 15.458 6.2085 13.3873 6.2085 10.833C6.2085 8.27869 8.27918 6.20801 10.8335 6.20801C13.3878 6.20801 15.4585 8.27869 15.4585 10.833Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/state-icon.tsx b/packages/propel/src/icons/properties/state-icon.tsx
index 80e6820de..6d3f73894 100644
--- a/packages/propel/src/icons/properties/state-icon.tsx
+++ b/packages/propel/src/icons/properties/state-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const StatePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function StatePropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -14,4 +14,4 @@ export const StatePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor",
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/properties/user-circle-icon.tsx b/packages/propel/src/icons/properties/user-circle-icon.tsx
index a28f72f1c..0fc747d09 100644
--- a/packages/propel/src/icons/properties/user-circle-icon.tsx
+++ b/packages/propel/src/icons/properties/user-circle-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const UserCirclePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function UserCirclePropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -14,4 +14,4 @@ export const UserCirclePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentCo
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/properties/user-icon.tsx b/packages/propel/src/icons/properties/user-icon.tsx
index 9e81972c3..05a139007 100644
--- a/packages/propel/src/icons/properties/user-icon.tsx
+++ b/packages/propel/src/icons/properties/user-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const UserPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M12.7085 14C12.7085 13.0241 12.7018 12.6747 12.6207 12.4072C12.4227 11.7547 11.9118 11.2438 11.2593 11.0459C10.9919 10.9648 10.6424 10.958 9.66655 10.958H6.33354C5.3581 10.958 5.00819 10.9649 4.74077 11.0459C4.08831 11.2438 3.57741 11.7547 3.37944 12.4072C3.29831 12.6747 3.29155 13.0241 3.29155 14C3.29155 14.3452 3.01173 14.625 2.66655 14.625C2.32137 14.625 2.04155 14.3452 2.04155 14C2.04155 13.1153 2.03476 12.5344 2.18315 12.0449C2.50227 10.9929 3.32548 10.1688 4.37749 9.84961C4.86708 9.70113 5.44863 9.70801 6.33354 9.70801H9.66655C10.5512 9.70801 11.1321 9.70127 11.6216 9.84961C12.6736 10.1687 13.4978 10.9929 13.8169 12.0449C13.9653 12.5344 13.9585 13.1153 13.9585 14C13.9585 14.3451 13.6786 14.6248 13.3335 14.625C12.9884 14.625 12.7085 14.3452 12.7085 14ZM10.3746 5C10.3746 3.68832 9.31125 2.625 7.99956 2.625C6.68803 2.62518 5.62456 3.68843 5.62456 5C5.62456 6.31157 6.68803 7.37482 7.99956 7.375C9.31125 7.375 10.3746 6.31168 10.3746 5ZM11.6246 5C11.6246 7.00203 10.0016 8.625 7.99956 8.625C5.99768 8.62482 4.37456 7.00192 4.37456 5C4.37456 2.99808 5.99768 1.37518 7.99956 1.375C10.0016 1.375 11.6246 2.99797 11.6246 5Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function UserPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M12.7085 14C12.7085 13.0241 12.7018 12.6747 12.6207 12.4072C12.4227 11.7547 11.9118 11.2438 11.2593 11.0459C10.9919 10.9648 10.6424 10.958 9.66655 10.958H6.33354C5.3581 10.958 5.00819 10.9649 4.74077 11.0459C4.08831 11.2438 3.57741 11.7547 3.37944 12.4072C3.29831 12.6747 3.29155 13.0241 3.29155 14C3.29155 14.3452 3.01173 14.625 2.66655 14.625C2.32137 14.625 2.04155 14.3452 2.04155 14C2.04155 13.1153 2.03476 12.5344 2.18315 12.0449C2.50227 10.9929 3.32548 10.1688 4.37749 9.84961C4.86708 9.70113 5.44863 9.70801 6.33354 9.70801H9.66655C10.5512 9.70801 11.1321 9.70127 11.6216 9.84961C12.6736 10.1687 13.4978 10.9929 13.8169 12.0449C13.9653 12.5344 13.9585 13.1153 13.9585 14C13.9585 14.3451 13.6786 14.6248 13.3335 14.625C12.9884 14.625 12.7085 14.3452 12.7085 14ZM10.3746 5C10.3746 3.68832 9.31125 2.625 7.99956 2.625C6.68803 2.62518 5.62456 3.68843 5.62456 5C5.62456 6.31157 6.68803 7.37482 7.99956 7.375C9.31125 7.375 10.3746 6.31168 10.3746 5ZM11.6246 5C11.6246 7.00203 10.0016 8.625 7.99956 8.625C5.99768 8.62482 4.37456 7.00192 4.37456 5C4.37456 2.99808 5.99768 1.37518 7.99956 1.375C10.0016 1.375 11.6246 2.99797 11.6246 5Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/properties/user-square-icon.tsx b/packages/propel/src/icons/properties/user-square-icon.tsx
index f7a6c4547..55d709527 100644
--- a/packages/propel/src/icons/properties/user-square-icon.tsx
+++ b/packages/propel/src/icons/properties/user-square-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const UserSquarePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function UserSquarePropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -14,4 +14,4 @@ export const UserSquarePropertyIcon: React.FC<ISvgIcons> = ({ color = "currentCo
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/properties/workflows-icon.tsx b/packages/propel/src/icons/properties/workflows-icon.tsx
index 7524911b8..79ebd8900 100644
--- a/packages/propel/src/icons/properties/workflows-icon.tsx
+++ b/packages/propel/src/icons/properties/workflows-icon.tsx
@@ -3,19 +3,21 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const WorkflowsPropertyIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M6.70801 3.33301C6.70783 2.94196 6.39109 2.625 6 2.625H3.33301C2.94206 2.62518 2.62518 2.94206 2.625 3.33301V6C2.625 6.39109 2.94196 6.70783 3.33301 6.70801H6C6.3912 6.70801 6.70801 6.3912 6.70801 6V3.33301ZM7.95801 6C7.95801 7.08156 7.08156 7.95801 6 7.95801H3.33301C2.2516 7.95783 1.375 7.08145 1.375 6V3.33301C1.37518 2.25171 2.25171 1.37518 3.33301 1.375H6C7.08145 1.375 7.95783 2.2516 7.95801 3.33301V6Z"
-      fill={color}
-    />
-    <path
-      d="M4.04167 10.0003V7.33333C4.04167 6.98816 4.32149 6.70833 4.66667 6.70833C5.01184 6.70833 5.29167 6.98816 5.29167 7.33333V10.0003C5.29175 10.1881 5.36594 10.3685 5.4987 10.5013C5.63146 10.6341 5.81193 10.7082 5.99967 10.7083H8.66667C9.01185 10.7083 9.29167 10.9882 9.29167 11.3333C9.29167 11.6785 9.01185 11.9583 8.66667 11.9583H5.99967C5.48041 11.9582 4.98209 11.7523 4.61491 11.3851C4.24773 11.0179 4.04175 10.5196 4.04167 10.0003Z"
-      fill={color}
-    />
-    <path
-      d="M13.3747 9.99967C13.3745 9.60862 13.0578 9.29167 12.6667 9.29167H9.99967C9.60873 9.29184 9.29184 9.60873 9.29167 9.99967V12.6667C9.29167 13.0578 9.60862 13.3745 9.99967 13.3747H12.6667C13.0579 13.3747 13.3747 13.0579 13.3747 12.6667V9.99967ZM14.6247 12.6667C14.6247 13.7482 13.7482 14.6247 12.6667 14.6247H9.99967C8.91827 14.6245 8.04167 13.7481 8.04167 12.6667V9.99967C8.04184 8.91838 8.91838 8.04184 9.99967 8.04167H12.6667C13.7481 8.04167 14.6245 8.91827 14.6247 9.99967V12.6667Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function WorkflowsPropertyIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M6.70801 3.33301C6.70783 2.94196 6.39109 2.625 6 2.625H3.33301C2.94206 2.62518 2.62518 2.94206 2.625 3.33301V6C2.625 6.39109 2.94196 6.70783 3.33301 6.70801H6C6.3912 6.70801 6.70801 6.3912 6.70801 6V3.33301ZM7.95801 6C7.95801 7.08156 7.08156 7.95801 6 7.95801H3.33301C2.2516 7.95783 1.375 7.08145 1.375 6V3.33301C1.37518 2.25171 2.25171 1.37518 3.33301 1.375H6C7.08145 1.375 7.95783 2.2516 7.95801 3.33301V6Z"
+        fill={color}
+      />
+      <path
+        d="M4.04167 10.0003V7.33333C4.04167 6.98816 4.32149 6.70833 4.66667 6.70833C5.01184 6.70833 5.29167 6.98816 5.29167 7.33333V10.0003C5.29175 10.1881 5.36594 10.3685 5.4987 10.5013C5.63146 10.6341 5.81193 10.7082 5.99967 10.7083H8.66667C9.01185 10.7083 9.29167 10.9882 9.29167 11.3333C9.29167 11.6785 9.01185 11.9583 8.66667 11.9583H5.99967C5.48041 11.9582 4.98209 11.7523 4.61491 11.3851C4.24773 11.0179 4.04175 10.5196 4.04167 10.0003Z"
+        fill={color}
+      />
+      <path
+        d="M13.3747 9.99967C13.3745 9.60862 13.0578 9.29167 12.6667 9.29167H9.99967C9.60873 9.29184 9.29184 9.60873 9.29167 9.99967V12.6667C9.29167 13.0578 9.60862 13.3745 9.99967 13.3747H12.6667C13.0579 13.3747 13.3747 13.0579 13.3747 12.6667V9.99967ZM14.6247 12.6667C14.6247 13.7482 13.7482 14.6247 12.6667 14.6247H9.99967C8.91827 14.6245 8.04167 13.7481 8.04167 12.6667V9.99967C8.04184 8.91838 8.91838 8.04184 9.99967 8.04167H12.6667C13.7481 8.04167 14.6245 8.91827 14.6247 9.99967V12.6667Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/related-icon.tsx b/packages/propel/src/icons/related-icon.tsx
index 3d467284c..d94cf73a0 100644
--- a/packages/propel/src/icons/related-icon.tsx
+++ b/packages/propel/src/icons/related-icon.tsx
@@ -2,25 +2,27 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const RelatedIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      d="M20 13V6C20 5.46957 19.7893 4.96086 19.4142 4.58579C19.0391 4.21071 18.5304 4 18 4H4C3.46957 4 2.96086 4.21071 2.58579 4.58579C2.21071 4.96086 2 5.46957 2 6V20C2 20.5304 2.21071 21.0391 2.58579 21.4142C2.96086 21.7893 3.46957 22 4 22H11"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path d="M12.125 19.25L9 16.125L12.125 13" strokeLinecap="round" strokeLinejoin="round" />
-    <path
-      d="M20 22V18.1818C20 17.6032 19.7366 17.0482 19.2678 16.639C18.7989 16.2299 18.163 16 17.5 16H10"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+export function RelatedIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        d="M20 13V6C20 5.46957 19.7893 4.96086 19.4142 4.58579C19.0391 4.21071 18.5304 4 18 4H4C3.46957 4 2.96086 4.21071 2.58579 4.58579C2.21071 4.96086 2 5.46957 2 6V20C2 20.5304 2.21071 21.0391 2.58579 21.4142C2.96086 21.7893 3.46957 22 4 22H11"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path d="M12.125 19.25L9 16.125L12.125 13" strokeLinecap="round" strokeLinejoin="round" />
+      <path
+        d="M20 22V18.1818C20 17.6032 19.7366 17.0482 19.2678 16.639C18.7989 16.2299 18.163 16 17.5 16H10"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/sans-serif-icon.tsx b/packages/propel/src/icons/sans-serif-icon.tsx
index a63fc1995..4c56e0fe8 100644
--- a/packages/propel/src/icons/sans-serif-icon.tsx
+++ b/packages/propel/src/icons/sans-serif-icon.tsx
@@ -2,15 +2,17 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const SansSerifIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...rest}>
-    <path
-      d="M12.4877 11.5341C11.9579 11.5341 11.502 11.4646 11.1198 11.3256C10.7406 11.1867 10.4308 11.0028 10.1905 10.7741C9.95021 10.5454 9.77071 10.295 9.65202 10.0228L10.7681 9.56253C10.8462 9.68991 10.9504 9.82453 11.0807 9.96639C11.2139 10.1111 11.3934 10.2342 11.6192 10.3355C11.8479 10.4368 12.1418 10.4875 12.5007 10.4875C12.9929 10.4875 13.3997 10.3674 13.721 10.1271C14.0424 9.88967 14.203 9.51042 14.203 8.98931V7.67785H14.1205C14.0424 7.81971 13.9295 7.97749 13.7818 8.15119C13.6371 8.3249 13.4373 8.47544 13.1825 8.60282C12.9278 8.7302 12.5963 8.79389 12.1881 8.79389C11.6612 8.79389 11.1864 8.67085 10.7637 8.42478C10.3439 8.1758 10.011 7.80958 9.76492 7.3261C9.52174 6.83973 9.40015 6.2419 9.40015 5.53262C9.40015 4.82333 9.52029 4.21537 9.76058 3.70873C10.0038 3.2021 10.3367 2.81416 10.7594 2.54492C11.1821 2.27279 11.6612 2.13672 12.1968 2.13672C12.6108 2.13672 12.9451 2.2062 13.1999 2.34516C13.4547 2.48123 13.653 2.64046 13.7948 2.82285C13.9396 3.00523 14.0511 3.16591 14.1292 3.30487H14.2248V2.22357H15.4971V9.04142C15.4971 9.61464 15.364 10.0851 15.0976 10.4528C14.8313 10.8204 14.4708 11.0926 14.0163 11.2692C13.5647 11.4458 13.0552 11.5341 12.4877 11.5341ZM12.4747 7.71693C12.8482 7.71693 13.1637 7.63008 13.4214 7.45638C13.6819 7.27978 13.8788 7.02791 14.012 6.70077C14.148 6.37073 14.2161 5.97556 14.2161 5.51525C14.2161 5.06651 14.1495 4.67134 14.0163 4.32972C13.8831 3.98811 13.6877 3.72176 13.4301 3.53069C13.1724 3.33672 12.8539 3.23973 12.4747 3.23973C12.0839 3.23973 11.7582 3.34106 11.4976 3.54371C11.2371 3.74347 11.0402 4.01561 10.907 4.36012C10.7767 4.70463 10.7116 5.08967 10.7116 5.51525C10.7116 5.9524 10.7782 6.33599 10.9114 6.66603C11.0445 6.99607 11.2414 7.25373 11.502 7.43901C11.7654 7.62429 12.0897 7.71693 12.4747 7.71693Z"
-      fill="currentColor"
-    />
-    <path
-      d="M2.09099 8.8936H0.666626L3.86711 0H5.41741L8.61789 8.8936H7.19353L4.67917 1.61544H4.60969L2.09099 8.8936ZM2.32983 5.41085H6.95034V6.53993H2.32983V5.41085Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function SansSerifIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...rest}>
+      <path
+        d="M12.4877 11.5341C11.9579 11.5341 11.502 11.4646 11.1198 11.3256C10.7406 11.1867 10.4308 11.0028 10.1905 10.7741C9.95021 10.5454 9.77071 10.295 9.65202 10.0228L10.7681 9.56253C10.8462 9.68991 10.9504 9.82453 11.0807 9.96639C11.2139 10.1111 11.3934 10.2342 11.6192 10.3355C11.8479 10.4368 12.1418 10.4875 12.5007 10.4875C12.9929 10.4875 13.3997 10.3674 13.721 10.1271C14.0424 9.88967 14.203 9.51042 14.203 8.98931V7.67785H14.1205C14.0424 7.81971 13.9295 7.97749 13.7818 8.15119C13.6371 8.3249 13.4373 8.47544 13.1825 8.60282C12.9278 8.7302 12.5963 8.79389 12.1881 8.79389C11.6612 8.79389 11.1864 8.67085 10.7637 8.42478C10.3439 8.1758 10.011 7.80958 9.76492 7.3261C9.52174 6.83973 9.40015 6.2419 9.40015 5.53262C9.40015 4.82333 9.52029 4.21537 9.76058 3.70873C10.0038 3.2021 10.3367 2.81416 10.7594 2.54492C11.1821 2.27279 11.6612 2.13672 12.1968 2.13672C12.6108 2.13672 12.9451 2.2062 13.1999 2.34516C13.4547 2.48123 13.653 2.64046 13.7948 2.82285C13.9396 3.00523 14.0511 3.16591 14.1292 3.30487H14.2248V2.22357H15.4971V9.04142C15.4971 9.61464 15.364 10.0851 15.0976 10.4528C14.8313 10.8204 14.4708 11.0926 14.0163 11.2692C13.5647 11.4458 13.0552 11.5341 12.4877 11.5341ZM12.4747 7.71693C12.8482 7.71693 13.1637 7.63008 13.4214 7.45638C13.6819 7.27978 13.8788 7.02791 14.012 6.70077C14.148 6.37073 14.2161 5.97556 14.2161 5.51525C14.2161 5.06651 14.1495 4.67134 14.0163 4.32972C13.8831 3.98811 13.6877 3.72176 13.4301 3.53069C13.1724 3.33672 12.8539 3.23973 12.4747 3.23973C12.0839 3.23973 11.7582 3.34106 11.4976 3.54371C11.2371 3.74347 11.0402 4.01561 10.907 4.36012C10.7767 4.70463 10.7116 5.08967 10.7116 5.51525C10.7116 5.9524 10.7782 6.33599 10.9114 6.66603C11.0445 6.99607 11.2414 7.25373 11.502 7.43901C11.7654 7.62429 12.0897 7.71693 12.4747 7.71693Z"
+        fill="currentColor"
+      />
+      <path
+        d="M2.09099 8.8936H0.666626L3.86711 0H5.41741L8.61789 8.8936H7.19353L4.67917 1.61544H4.60969L2.09099 8.8936ZM2.32983 5.41085H6.95034V6.53993H2.32983V5.41085Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/serif-icon.tsx b/packages/propel/src/icons/serif-icon.tsx
index 01ed92989..7ee42628b 100644
--- a/packages/propel/src/icons/serif-icon.tsx
+++ b/packages/propel/src/icons/serif-icon.tsx
@@ -2,15 +2,17 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const SerifIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...rest}>
-    <path
-      d="M11.6021 7.09532C11.2602 6.92843 10.9976 6.69641 10.8145 6.39927C10.6313 6.09806 10.5397 5.76631 10.5397 5.40404C10.5397 4.85046 10.7473 4.37422 11.1625 3.97531C11.5818 3.57641 12.117 3.37695 12.7683 3.37695C13.3015 3.37695 13.7635 3.50721 14.1543 3.76772H15.3388C15.5138 3.76772 15.6156 3.77382 15.6441 3.78603C15.6726 3.79418 15.6929 3.81046 15.7051 3.83488C15.7296 3.87151 15.7418 3.93664 15.7418 4.03026C15.7418 4.13609 15.7316 4.20936 15.7112 4.25007C15.699 4.27042 15.6766 4.2867 15.6441 4.29891C15.6156 4.31112 15.5138 4.31723 15.3388 4.31723H14.6122C14.8402 4.6103 14.9541 4.98479 14.9541 5.44068C14.9541 5.9617 14.7547 6.40741 14.3558 6.77782C13.9569 7.14824 13.4216 7.33344 12.75 7.33344C12.4732 7.33344 12.1903 7.29274 11.9013 7.21133C11.7222 7.36601 11.6001 7.50237 11.5349 7.62041C11.4739 7.73438 11.4434 7.83207 11.4434 7.91348C11.4434 7.98268 11.4759 8.04984 11.541 8.11497C11.6102 8.1801 11.7425 8.22691 11.9379 8.2554C12.0519 8.27168 12.3368 8.28593 12.7927 8.29814C13.6312 8.31849 14.1746 8.34699 14.4229 8.38362C14.8015 8.43654 15.1027 8.57697 15.3266 8.80491C15.5545 9.03286 15.6685 9.31372 15.6685 9.6475C15.6685 10.1075 15.4528 10.5389 15.0213 10.9419C14.3863 11.5362 13.558 11.8333 12.5363 11.8333C11.7507 11.8333 11.0872 11.6563 10.5458 11.3021C10.2405 11.0986 10.0879 10.887 10.0879 10.6672C10.0879 10.5695 10.1103 10.4718 10.1551 10.3741C10.2243 10.2235 10.3667 10.0138 10.5825 9.74519C10.6109 9.70856 10.8185 9.48875 11.2052 9.08578C10.9936 8.95959 10.843 8.84765 10.7534 8.74996C10.6679 8.6482 10.6252 8.53423 10.6252 8.40804C10.6252 8.26558 10.6822 8.09869 10.7962 7.90738C10.9142 7.71607 11.1828 7.44538 11.6021 7.09532ZM12.6645 3.67003C12.3633 3.67003 12.1109 3.79011 11.9074 4.03026C11.7039 4.27042 11.6021 4.6388 11.6021 5.13539C11.6021 5.77853 11.7405 6.27716 12.0173 6.63129C12.229 6.89994 12.4976 7.03426 12.8232 7.03426C13.1326 7.03426 13.387 6.91826 13.5865 6.68624C13.7859 6.45422 13.8856 6.08992 13.8856 5.59332C13.8856 4.94612 13.7452 4.43934 13.4643 4.073C13.2567 3.80435 12.9901 3.67003 12.6645 3.67003ZM11.541 9.13462C11.3497 9.34222 11.2052 9.53556 11.1075 9.71466C11.0099 9.89376 10.961 10.0586 10.961 10.2092C10.961 10.4046 11.079 10.5756 11.3151 10.7221C11.7222 10.9745 12.3104 11.1007 13.0797 11.1007C13.8124 11.1007 14.3517 10.9704 14.6977 10.7099C15.0477 10.4535 15.2228 10.1787 15.2228 9.88562C15.2228 9.67396 15.119 9.52335 14.9114 9.4338C14.6997 9.34425 14.2805 9.29133 13.6536 9.27505C12.7378 9.25063 12.0336 9.20382 11.541 9.13462Z"
-      fill="currentColor"
-    />
-    <path
-      d="M6.28997 6.36263H3.08448L2.52276 7.66925C2.38436 7.99081 2.31516 8.23097 2.31516 8.38972C2.31516 8.5159 2.37418 8.62784 2.49223 8.72553C2.61434 8.81915 2.87485 8.88021 3.27376 8.9087V9.13461H0.666626V8.9087C1.01262 8.84764 1.23649 8.76827 1.33825 8.67058C1.54585 8.4752 1.77583 8.07833 2.0282 7.47997L4.94061 0.666016H5.15431L8.0362 7.55324C8.26821 8.10682 8.47784 8.46706 8.66508 8.63394C8.8564 8.79676 9.12098 8.88835 9.45882 8.9087V9.13461H6.19228V8.9087C6.52199 8.89242 6.74383 8.83747 6.8578 8.74385C6.97584 8.65023 7.03486 8.53625 7.03486 8.40193C7.03486 8.22283 6.95345 7.93993 6.79064 7.55324L6.28997 6.36263ZM6.11901 5.91081L4.7147 2.56489L3.27376 5.91081H6.11901Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function SerifIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...rest}>
+      <path
+        d="M11.6021 7.09532C11.2602 6.92843 10.9976 6.69641 10.8145 6.39927C10.6313 6.09806 10.5397 5.76631 10.5397 5.40404C10.5397 4.85046 10.7473 4.37422 11.1625 3.97531C11.5818 3.57641 12.117 3.37695 12.7683 3.37695C13.3015 3.37695 13.7635 3.50721 14.1543 3.76772H15.3388C15.5138 3.76772 15.6156 3.77382 15.6441 3.78603C15.6726 3.79418 15.6929 3.81046 15.7051 3.83488C15.7296 3.87151 15.7418 3.93664 15.7418 4.03026C15.7418 4.13609 15.7316 4.20936 15.7112 4.25007C15.699 4.27042 15.6766 4.2867 15.6441 4.29891C15.6156 4.31112 15.5138 4.31723 15.3388 4.31723H14.6122C14.8402 4.6103 14.9541 4.98479 14.9541 5.44068C14.9541 5.9617 14.7547 6.40741 14.3558 6.77782C13.9569 7.14824 13.4216 7.33344 12.75 7.33344C12.4732 7.33344 12.1903 7.29274 11.9013 7.21133C11.7222 7.36601 11.6001 7.50237 11.5349 7.62041C11.4739 7.73438 11.4434 7.83207 11.4434 7.91348C11.4434 7.98268 11.4759 8.04984 11.541 8.11497C11.6102 8.1801 11.7425 8.22691 11.9379 8.2554C12.0519 8.27168 12.3368 8.28593 12.7927 8.29814C13.6312 8.31849 14.1746 8.34699 14.4229 8.38362C14.8015 8.43654 15.1027 8.57697 15.3266 8.80491C15.5545 9.03286 15.6685 9.31372 15.6685 9.6475C15.6685 10.1075 15.4528 10.5389 15.0213 10.9419C14.3863 11.5362 13.558 11.8333 12.5363 11.8333C11.7507 11.8333 11.0872 11.6563 10.5458 11.3021C10.2405 11.0986 10.0879 10.887 10.0879 10.6672C10.0879 10.5695 10.1103 10.4718 10.1551 10.3741C10.2243 10.2235 10.3667 10.0138 10.5825 9.74519C10.6109 9.70856 10.8185 9.48875 11.2052 9.08578C10.9936 8.95959 10.843 8.84765 10.7534 8.74996C10.6679 8.6482 10.6252 8.53423 10.6252 8.40804C10.6252 8.26558 10.6822 8.09869 10.7962 7.90738C10.9142 7.71607 11.1828 7.44538 11.6021 7.09532ZM12.6645 3.67003C12.3633 3.67003 12.1109 3.79011 11.9074 4.03026C11.7039 4.27042 11.6021 4.6388 11.6021 5.13539C11.6021 5.77853 11.7405 6.27716 12.0173 6.63129C12.229 6.89994 12.4976 7.03426 12.8232 7.03426C13.1326 7.03426 13.387 6.91826 13.5865 6.68624C13.7859 6.45422 13.8856 6.08992 13.8856 5.59332C13.8856 4.94612 13.7452 4.43934 13.4643 4.073C13.2567 3.80435 12.9901 3.67003 12.6645 3.67003ZM11.541 9.13462C11.3497 9.34222 11.2052 9.53556 11.1075 9.71466C11.0099 9.89376 10.961 10.0586 10.961 10.2092C10.961 10.4046 11.079 10.5756 11.3151 10.7221C11.7222 10.9745 12.3104 11.1007 13.0797 11.1007C13.8124 11.1007 14.3517 10.9704 14.6977 10.7099C15.0477 10.4535 15.2228 10.1787 15.2228 9.88562C15.2228 9.67396 15.119 9.52335 14.9114 9.4338C14.6997 9.34425 14.2805 9.29133 13.6536 9.27505C12.7378 9.25063 12.0336 9.20382 11.541 9.13462Z"
+        fill="currentColor"
+      />
+      <path
+        d="M6.28997 6.36263H3.08448L2.52276 7.66925C2.38436 7.99081 2.31516 8.23097 2.31516 8.38972C2.31516 8.5159 2.37418 8.62784 2.49223 8.72553C2.61434 8.81915 2.87485 8.88021 3.27376 8.9087V9.13461H0.666626V8.9087C1.01262 8.84764 1.23649 8.76827 1.33825 8.67058C1.54585 8.4752 1.77583 8.07833 2.0282 7.47997L4.94061 0.666016H5.15431L8.0362 7.55324C8.26821 8.10682 8.47784 8.46706 8.66508 8.63394C8.8564 8.79676 9.12098 8.88835 9.45882 8.9087V9.13461H6.19228V8.9087C6.52199 8.89242 6.74383 8.83747 6.8578 8.74385C6.97584 8.65023 7.03486 8.53625 7.03486 8.40193C7.03486 8.22283 6.95345 7.93993 6.79064 7.55324L6.28997 6.36263ZM6.11901 5.91081L4.7147 2.56489L3.27376 5.91081H6.11901Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/side-panel-icon.tsx b/packages/propel/src/icons/side-panel-icon.tsx
index 3327124a4..be2de3bd4 100644
--- a/packages/propel/src/icons/side-panel-icon.tsx
+++ b/packages/propel/src/icons/side-panel-icon.tsx
@@ -2,25 +2,27 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const SidePanelIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      d="M19 3H5C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3Z"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-    <path
-      d="M20 3H12V5V19V21H20C20.5523 21 21 20.1046 21 19V5C21 3.89543 20.5523 3 20 3Z"
-      fill="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    />
-  </svg>
-);
+export function SidePanelIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        d="M19 3H5C3.89543 3 3 3.89543 3 5V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V5C21 3.89543 20.1046 3 19 3Z"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M20 3H12V5V19V21H20C20.5523 21 21 20.1046 21 19V5C21 3.89543 20.5523 3 20 3Z"
+        fill="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/state/backlog-group-icon.tsx b/packages/propel/src/icons/state/backlog-group-icon.tsx
index 33fff30fd..d394c46cd 100644
--- a/packages/propel/src/icons/state/backlog-group-icon.tsx
+++ b/packages/propel/src/icons/state/backlog-group-icon.tsx
@@ -3,12 +3,7 @@ import * as React from "react";
 import type { ISvgIcons } from "../type";
 import { DashedCircle } from "./dashed-circle";
 
-export const BacklogGroupIcon: React.FC<ISvgIcons> = ({
-  width = "20",
-  height = "20",
-  className,
-  color = "#60646C",
-}) => {
+export function BacklogGroupIcon({ width = "20", height = "20", className, color = "#60646C" }: ISvgIcons) {
   // SVG parameters
   const viewBoxSize = 16;
   const center = viewBoxSize / 2;
@@ -24,4 +19,4 @@ export const BacklogGroupIcon: React.FC<ISvgIcons> = ({
       <DashedCircle center={center} radius={radius} color={color} percentage={0} />
     </svg>
   );
-};
+}
diff --git a/packages/propel/src/icons/state/cancelled-group-icon.tsx b/packages/propel/src/icons/state/cancelled-group-icon.tsx
index dde633980..6bd25d329 100644
--- a/packages/propel/src/icons/state/cancelled-group-icon.tsx
+++ b/packages/propel/src/icons/state/cancelled-group-icon.tsx
@@ -2,26 +2,28 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const CancelledGroupIcon: React.FC<ISvgIcons> = ({
+export function CancelledGroupIcon({
   className = "",
   color = "#9AA4BC",
   height = "20",
   width = "20",
   ...rest
-}) => (
-  <svg
-    height={height}
-    width={width}
-    className={className}
-    viewBox="0 0 16 16"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15ZM11.1018 4.89826C11.3947 5.19115 11.3947 5.66603 11.1018 5.95892L9.06068 8.00002L11.1018 10.0411C11.3947 10.334 11.3947 10.8089 11.1018 11.1018C10.8089 11.3947 10.334 11.3947 10.0411 11.1018L8.00002 9.06068L5.95892 11.1018C5.66603 11.3947 5.19115 11.3947 4.89826 11.1018C4.60537 10.8089 4.60537 10.334 4.89826 10.0411L6.93936 8.00002L4.89826 5.95892C4.60537 5.66603 4.60537 5.19115 4.89826 4.89826C5.19115 4.60537 5.66603 4.60537 5.95892 4.89826L8.00002 6.93936L10.0411 4.89826C10.334 4.60537 10.8089 4.60537 11.1018 4.89826Z"
-      fill={color}
-    />
-  </svg>
-);
+}: ISvgIcons) {
+  return (
+    <svg
+      height={height}
+      width={width}
+      className={className}
+      viewBox="0 0 16 16"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15ZM11.1018 4.89826C11.3947 5.19115 11.3947 5.66603 11.1018 5.95892L9.06068 8.00002L11.1018 10.0411C11.3947 10.334 11.3947 10.8089 11.1018 11.1018C10.8089 11.3947 10.334 11.3947 10.0411 11.1018L8.00002 9.06068L5.95892 11.1018C5.66603 11.3947 5.19115 11.3947 4.89826 11.1018C4.60537 10.8089 4.60537 10.334 4.89826 10.0411L6.93936 8.00002L4.89826 5.95892C4.60537 5.66603 4.60537 5.19115 4.89826 4.89826C5.19115 4.60537 5.66603 4.60537 5.95892 4.89826L8.00002 6.93936L10.0411 4.89826C10.334 4.60537 10.8089 4.60537 11.1018 4.89826Z"
+        fill={color}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/state/completed-group-icon.tsx b/packages/propel/src/icons/state/completed-group-icon.tsx
index e0c21a175..b6be3dfa0 100644
--- a/packages/propel/src/icons/state/completed-group-icon.tsx
+++ b/packages/propel/src/icons/state/completed-group-icon.tsx
@@ -2,26 +2,28 @@ import * as React from "react";
 
 import type { ISvgIcons } from "../type";
 
-export const CompletedGroupIcon: React.FC<ISvgIcons> = ({
+export function CompletedGroupIcon({
   className = "",
   color = "#46A758",
   height = "20",
   width = "20",
   ...rest
-}) => (
-  <svg
-    height={height}
-    width={width}
-    className={className}
-    viewBox="0 0 16 16"
-    xmlns="http://www.w3.org/2000/svg"
-    {...rest}
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15ZM11.3587 6.18828C11.6007 5.85214 11.5244 5.38343 11.1882 5.14141C10.8521 4.89938 10.3834 4.97568 10.1414 5.31183L7.03706 9.62335L5.25956 7.97751C4.95563 7.69609 4.4811 7.71434 4.19968 8.01828C3.91826 8.32221 3.93651 8.79673 4.24045 9.07815L6.64045 11.3004C6.79816 11.4464 7.01095 11.5178 7.22481 11.4963C7.43868 11.4749 7.63307 11.3627 7.75865 11.1883L11.3587 6.18828Z"
-      fill={color}
-    />
-  </svg>
-);
+}: ISvgIcons) {
+  return (
+    <svg
+      height={height}
+      width={width}
+      className={className}
+      viewBox="0 0 16 16"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15ZM11.3587 6.18828C11.6007 5.85214 11.5244 5.38343 11.1882 5.14141C10.8521 4.89938 10.3834 4.97568 10.1414 5.31183L7.03706 9.62335L5.25956 7.97751C4.95563 7.69609 4.4811 7.71434 4.19968 8.01828C3.91826 8.32221 3.93651 8.79673 4.24045 9.07815L6.64045 11.3004C6.79816 11.4464 7.01095 11.5178 7.22481 11.4963C7.43868 11.4749 7.63307 11.3627 7.75865 11.1883L11.3587 6.18828Z"
+        fill={color}
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/state/dashed-circle.tsx b/packages/propel/src/icons/state/dashed-circle.tsx
index 4ee64cdf0..541053ea3 100644
--- a/packages/propel/src/icons/state/dashed-circle.tsx
+++ b/packages/propel/src/icons/state/dashed-circle.tsx
@@ -8,7 +8,7 @@ interface DashedCircleProps {
   totalSegments?: number;
 }
 
-export const DashedCircle: React.FC<DashedCircleProps> = ({ center, color, percentage, totalSegments = 15 }) => {
+export function DashedCircle({ center, color, percentage, totalSegments = 15 }: DashedCircleProps) {
   // Ensure percentage is between 0 and 100
   const validPercentage = Math.max(0, Math.min(100, percentage));
 
@@ -37,4 +37,4 @@ export const DashedCircle: React.FC<DashedCircleProps> = ({ center, color, perce
   };
 
   return <g>{generateDashedCircle()}</g>;
-};
+}
diff --git a/packages/propel/src/icons/state/progress-circle.tsx b/packages/propel/src/icons/state/progress-circle.tsx
index 470a560fc..d86de0b13 100644
--- a/packages/propel/src/icons/state/progress-circle.tsx
+++ b/packages/propel/src/icons/state/progress-circle.tsx
@@ -9,24 +9,19 @@ interface ProgressCircleProps {
   dashOffset: number;
 }
 
-export const ProgressCircle: React.FC<ProgressCircleProps> = ({
-  center,
-  radius,
-  color,
-  strokeWidth,
-  circumference,
-  dashOffset,
-}) => (
-  <circle
-    cx={center}
-    cy={center}
-    r={radius}
-    fill="none"
-    stroke={color}
-    strokeWidth={strokeWidth}
-    strokeDasharray={circumference}
-    strokeDashoffset={dashOffset}
-    strokeLinecap="round"
-    transform={`rotate(-90 ${center} ${center})`}
-  />
-);
+export function ProgressCircle({ center, radius, color, strokeWidth, circumference, dashOffset }: ProgressCircleProps) {
+  return (
+    <circle
+      cx={center}
+      cy={center}
+      r={radius}
+      fill="none"
+      stroke={color}
+      strokeWidth={strokeWidth}
+      strokeDasharray={circumference}
+      strokeDashoffset={dashOffset}
+      strokeLinecap="round"
+      transform={`rotate(-90 ${center} ${center})`}
+    />
+  );
+}
diff --git a/packages/propel/src/icons/state/started-group-icon.tsx b/packages/propel/src/icons/state/started-group-icon.tsx
index 275fd70eb..019a99118 100644
--- a/packages/propel/src/icons/state/started-group-icon.tsx
+++ b/packages/propel/src/icons/state/started-group-icon.tsx
@@ -5,13 +5,13 @@ import { DashedCircle } from "./dashed-circle";
 import { ProgressCircle } from "./progress-circle";
 
 // StateIcon component implementation
-export const StartedGroupIcon: React.FC<ISvgIcons> = ({
+export function StartedGroupIcon({
   width = "20",
   height = "20",
   className,
   color = "#F59E0B",
   percentage = 100,
-}) => {
+}: ISvgIcons) {
   // Ensure percentage is between 0 and 100
   const normalized =
     typeof percentage === "number"
@@ -62,4 +62,4 @@ export const StartedGroupIcon: React.FC<ISvgIcons> = ({
       />
     </svg>
   );
-};
+}
diff --git a/packages/propel/src/icons/state/state-group-icon.tsx b/packages/propel/src/icons/state/state-group-icon.tsx
index b5e023d17..e94fdc40f 100644
--- a/packages/propel/src/icons/state/state-group-icon.tsx
+++ b/packages/propel/src/icons/state/state-group-icon.tsx
@@ -17,13 +17,13 @@ const iconComponents = {
   unstarted: UnstartedGroupIcon,
 };
 
-export const StateGroupIcon: React.FC<IStateGroupIcon> = ({
+export function StateGroupIcon({
   className = "",
   color,
   stateGroup,
   size = EIconSize.SM,
   percentage,
-}) => {
+}: IStateGroupIcon) {
   const StateIconComponent = iconComponents[stateGroup] || UnstartedGroupIcon;
 
   return (
@@ -35,4 +35,4 @@ export const StateGroupIcon: React.FC<IStateGroupIcon> = ({
       percentage={percentage}
     />
   );
-};
+}
diff --git a/packages/propel/src/icons/state/unstarted-group-icon.tsx b/packages/propel/src/icons/state/unstarted-group-icon.tsx
index fbc251649..be136dccf 100644
--- a/packages/propel/src/icons/state/unstarted-group-icon.tsx
+++ b/packages/propel/src/icons/state/unstarted-group-icon.tsx
@@ -5,13 +5,13 @@ import { DashedCircle } from "./dashed-circle";
 import { ProgressCircle } from "./progress-circle";
 
 // StateIcon component implementation
-export const UnstartedGroupIcon: React.FC<ISvgIcons> = ({
+export function UnstartedGroupIcon({
   width = "20",
   height = "20",
   className,
   color = "#F59E0B",
   percentage = 100,
-}) => {
+}: ISvgIcons) {
   // Ensure percentage is between 0 and 100
   const normalized =
     typeof percentage === "number"
@@ -48,4 +48,4 @@ export const UnstartedGroupIcon: React.FC<ISvgIcons> = ({
       />
     </svg>
   );
-};
+}
diff --git a/packages/propel/src/icons/sticky-note-icon.tsx b/packages/propel/src/icons/sticky-note-icon.tsx
index 875e23007..7323fe4c8 100644
--- a/packages/propel/src/icons/sticky-note-icon.tsx
+++ b/packages/propel/src/icons/sticky-note-icon.tsx
@@ -2,35 +2,37 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const StickyNoteIcon: React.FC<ISvgIcons> = ({ width = "17", height = "17", className, color }) => (
-  <svg
-    width={width}
-    height={height}
-    className={className}
-    viewBox="0 0 17 17"
-    fill={"currentColor"}
-    xmlns="http://www.w3.org/2000/svg"
-    style={{ color }}
-  >
-    <path
-      d="M11.9167 16.0833H2.75008C2.30805 16.0833 1.88413 15.9077 1.57157 15.5951C1.25901 15.2826 1.08341 14.8587 1.08341 14.4166V2.74996C1.08341 2.30793 1.25901 1.88401 1.57157 1.57145C1.88413 1.25889 2.30805 1.08329 2.75008 1.08329H14.4167C14.8588 1.08329 15.2827 1.25889 15.5953 1.57145C15.9078 1.88401 16.0834 2.30793 16.0834 2.74996V11.9166L11.9167 16.0833Z"
-      style={{ opacity: 0.5 }}
-      fill="currentColor"
-    />
-    <path
-      d="M11.0834 16.0833V12.75C11.0834 12.3079 11.259 11.884 11.5716 11.5714C11.8841 11.2589 12.3081 11.0833 12.7501 11.0833H16.0834"
-      style={{ opacity: 0.5 }}
-      fill="currentColor"
-    />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M1.27694 15.8898C1.66764 16.2805 2.19755 16.5 2.75008 16.5H11.9167C12.0273 16.5 12.1332 16.4561 12.2114 16.3779L16.378 12.2113C16.4562 12.1331 16.5001 12.0271 16.5001 11.9166V2.74996C16.5001 2.19742 16.2806 1.66752 15.8899 1.27682C15.4992 0.88612 14.9693 0.666626 14.4167 0.666626H2.75008C2.19755 0.666626 1.66764 0.88612 1.27694 1.27682C0.886241 1.66752 0.666748 2.19742 0.666748 2.74996V14.4166C0.666748 14.9692 0.886241 15.4991 1.27694 15.8898ZM15.6667 11.5V11.744L11.7442 15.6666H11.5001V12.75C11.5001 12.4184 11.6318 12.1005 11.8662 11.8661C12.1006 11.6317 12.4186 11.5 12.7501 11.5H15.6667ZM10.6667 15.6666V12.75C10.6667 12.1974 10.8862 11.6675 11.2769 11.2768C11.6676 10.8861 12.1975 10.6666 12.7501 10.6666H15.6667V2.74996C15.6667 2.41844 15.5351 2.1005 15.3006 1.86608C15.0662 1.63166 14.7483 1.49996 14.4167 1.49996H2.75008C2.41856 1.49996 2.10062 1.63166 1.8662 1.86608C1.63178 2.1005 1.50008 2.41844 1.50008 2.74996V14.4166C1.50008 14.7481 1.63178 15.0661 1.8662 15.3005C2.10062 15.5349 2.41856 15.6666 2.75008 15.6666H10.6667Z"
-      fill="currentColor"
-    />
-    <path
-      d="M11.0816 12.7499C11.0491 13.2706 11.0816 16.0833 11.0816 16.0833H11.9149L16.0816 11.9166V11.0833H12.7483C11.5001 11.0833 11.1141 12.2293 11.0816 12.7499Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function StickyNoteIcon({ width = "17", height = "17", className, color }: ISvgIcons) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      className={className}
+      viewBox="0 0 17 17"
+      fill={"currentColor"}
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ color }}
+    >
+      <path
+        d="M11.9167 16.0833H2.75008C2.30805 16.0833 1.88413 15.9077 1.57157 15.5951C1.25901 15.2826 1.08341 14.8587 1.08341 14.4166V2.74996C1.08341 2.30793 1.25901 1.88401 1.57157 1.57145C1.88413 1.25889 2.30805 1.08329 2.75008 1.08329H14.4167C14.8588 1.08329 15.2827 1.25889 15.5953 1.57145C15.9078 1.88401 16.0834 2.30793 16.0834 2.74996V11.9166L11.9167 16.0833Z"
+        style={{ opacity: 0.5 }}
+        fill="currentColor"
+      />
+      <path
+        d="M11.0834 16.0833V12.75C11.0834 12.3079 11.259 11.884 11.5716 11.5714C11.8841 11.2589 12.3081 11.0833 12.7501 11.0833H16.0834"
+        style={{ opacity: 0.5 }}
+        fill="currentColor"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M1.27694 15.8898C1.66764 16.2805 2.19755 16.5 2.75008 16.5H11.9167C12.0273 16.5 12.1332 16.4561 12.2114 16.3779L16.378 12.2113C16.4562 12.1331 16.5001 12.0271 16.5001 11.9166V2.74996C16.5001 2.19742 16.2806 1.66752 15.8899 1.27682C15.4992 0.88612 14.9693 0.666626 14.4167 0.666626H2.75008C2.19755 0.666626 1.66764 0.88612 1.27694 1.27682C0.886241 1.66752 0.666748 2.19742 0.666748 2.74996V14.4166C0.666748 14.9692 0.886241 15.4991 1.27694 15.8898ZM15.6667 11.5V11.744L11.7442 15.6666H11.5001V12.75C11.5001 12.4184 11.6318 12.1005 11.8662 11.8661C12.1006 11.6317 12.4186 11.5 12.7501 11.5H15.6667ZM10.6667 15.6666V12.75C10.6667 12.1974 10.8862 11.6675 11.2769 11.2768C11.6676 10.8861 12.1975 10.6666 12.7501 10.6666H15.6667V2.74996C15.6667 2.41844 15.5351 2.1005 15.3006 1.86608C15.0662 1.63166 14.7483 1.49996 14.4167 1.49996H2.75008C2.41856 1.49996 2.10062 1.63166 1.8662 1.86608C1.63178 2.1005 1.50008 2.41844 1.50008 2.74996V14.4166C1.50008 14.7481 1.63178 15.0661 1.8662 15.3005C2.10062 15.5349 2.41856 15.6666 2.75008 15.6666H10.6667Z"
+        fill="currentColor"
+      />
+      <path
+        d="M11.0816 12.7499C11.0491 13.2706 11.0816 16.0833 11.0816 16.0833H11.9149L16.0816 11.9166V11.0833H12.7483C11.5001 11.0833 11.1141 12.2293 11.0816 12.7499Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/sub-brand/pi-chat.tsx b/packages/propel/src/icons/sub-brand/pi-chat.tsx
index 1c97f60bd..9e2641d4f 100644
--- a/packages/propel/src/icons/sub-brand/pi-chat.tsx
+++ b/packages/propel/src/icons/sub-brand/pi-chat.tsx
@@ -3,13 +3,15 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const PiChatLogo: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} viewBox="0 0 24 24" {...rest}>
-    <path d="M5.25 4.5C5.25 3.67157 5.92157 3 6.75 3H11.25V21H5.25V4.5Z" fill={color} />
-    <path d="M12 3H16.5C17.3284 3 18 3.67157 18 4.5V13.5H12V3Z" fill={color} />
-    <path
-      d="M14.6782 18.8062C14.648 18.6894 14.5871 18.5828 14.5019 18.4975C14.4166 18.4123 14.31 18.3514 14.1932 18.3212L12.1227 17.7873C12.0873 17.7773 12.0563 17.756 12.0341 17.7267C12.012 17.6974 12 17.6617 12 17.625C12 17.5883 12.012 17.5526 12.0341 17.5233C12.0563 17.494 12.0873 17.4727 12.1227 17.4627L14.1932 16.9284C14.3099 16.8983 14.4165 16.8375 14.5018 16.7523C14.5871 16.667 14.648 16.5605 14.6782 16.4438L15.2121 14.3733C15.222 14.3378 15.2432 14.3066 15.2726 14.2843C15.3019 14.262 15.3377 14.25 15.3746 14.25C15.4114 14.25 15.4472 14.262 15.4765 14.2843C15.5059 14.3066 15.5271 14.3378 15.5371 14.3733L16.0706 16.4438C16.1008 16.5606 16.1616 16.6672 16.2469 16.7525C16.3322 16.8377 16.4388 16.8986 16.5556 16.9288L18.6261 17.4623C18.6617 17.4721 18.6931 17.4934 18.7155 17.5228C18.7379 17.5522 18.75 17.5881 18.75 17.625C18.75 17.6619 18.7379 17.6978 18.7155 17.7272C18.6931 17.7566 18.6617 17.7778 18.6261 17.7877L16.5556 18.3212C16.4388 18.3514 16.3322 18.4123 16.2469 18.4975C16.1616 18.5828 16.1008 18.6894 16.0706 18.8062L15.5367 20.8767C15.5268 20.9122 15.5056 20.9434 15.4762 20.9657C15.4469 20.988 15.4111 21 15.3742 21C15.3374 21 15.3016 20.988 15.2722 20.9657C15.2429 20.9434 15.2217 20.9122 15.2117 20.8767L14.6782 18.8062Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function PiChatLogo({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} viewBox="0 0 24 24" {...rest}>
+      <path d="M5.25 4.5C5.25 3.67157 5.92157 3 6.75 3H11.25V21H5.25V4.5Z" fill={color} />
+      <path d="M12 3H16.5C17.3284 3 18 3.67157 18 4.5V13.5H12V3Z" fill={color} />
+      <path
+        d="M14.6782 18.8062C14.648 18.6894 14.5871 18.5828 14.5019 18.4975C14.4166 18.4123 14.31 18.3514 14.1932 18.3212L12.1227 17.7873C12.0873 17.7773 12.0563 17.756 12.0341 17.7267C12.012 17.6974 12 17.6617 12 17.625C12 17.5883 12.012 17.5526 12.0341 17.5233C12.0563 17.494 12.0873 17.4727 12.1227 17.4627L14.1932 16.9284C14.3099 16.8983 14.4165 16.8375 14.5018 16.7523C14.5871 16.667 14.648 16.5605 14.6782 16.4438L15.2121 14.3733C15.222 14.3378 15.2432 14.3066 15.2726 14.2843C15.3019 14.262 15.3377 14.25 15.3746 14.25C15.4114 14.25 15.4472 14.262 15.4765 14.2843C15.5059 14.3066 15.5271 14.3378 15.5371 14.3733L16.0706 16.4438C16.1008 16.5606 16.1616 16.6672 16.2469 16.7525C16.3322 16.8377 16.4388 16.8986 16.5556 16.9288L18.6261 17.4623C18.6617 17.4721 18.6931 17.4934 18.7155 17.5228C18.7379 17.5522 18.75 17.5881 18.75 17.625C18.75 17.6619 18.7379 17.6978 18.7155 17.7272C18.6931 17.7566 18.6617 17.7778 18.6261 17.7877L16.5556 18.3212C16.4388 18.3514 16.3322 18.4123 16.2469 18.4975C16.1616 18.5828 16.1008 18.6894 16.0706 18.8062L15.5367 20.8767C15.5268 20.9122 15.5056 20.9434 15.4762 20.9657C15.4469 20.988 15.4111 21 15.3742 21C15.3374 21 15.3016 20.988 15.2722 20.9657C15.2429 20.9434 15.2217 20.9122 15.2117 20.8767L14.6782 18.8062Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/sub-brand/plane-icon.tsx b/packages/propel/src/icons/sub-brand/plane-icon.tsx
index 949fbfa6f..01d8fe4e4 100644
--- a/packages/propel/src/icons/sub-brand/plane-icon.tsx
+++ b/packages/propel/src/icons/sub-brand/plane-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const PlaneNewIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function PlaneNewIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -18,4 +18,4 @@ export const PlaneNewIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...r
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/sub-brand/wiki-icon.tsx b/packages/propel/src/icons/sub-brand/wiki-icon.tsx
index a3c9fe4d6..c6da52c03 100644
--- a/packages/propel/src/icons/sub-brand/wiki-icon.tsx
+++ b/packages/propel/src/icons/sub-brand/wiki-icon.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const WikiIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => {
+export function WikiIcon({ color = "currentColor", ...rest }: ISvgIcons) {
   const clipPathId = React.useId();
 
   return (
@@ -14,4 +14,4 @@ export const WikiIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest
       />
     </IconWrapper>
   );
-};
+}
diff --git a/packages/propel/src/icons/suspended-user.tsx b/packages/propel/src/icons/suspended-user.tsx
index ad1b793cb..eaf09af31 100644
--- a/packages/propel/src/icons/suspended-user.tsx
+++ b/packages/propel/src/icons/suspended-user.tsx
@@ -2,31 +2,33 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const SuspendedUserIcon: React.FC<ISvgIcons> = ({ className, ...rest }) => (
-  <svg viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...rest}>
-    <g clipPath="url(#clip0_806_120890)">
-      <path
-        d="M3 13C3 12.304 3.18158 11.6201 3.52681 11.0158C3.87204 10.4115 4.36897 9.90774 4.9685 9.55428C5.56802 9.20082 6.24939 9.00989 6.94529 9.00037C7.64119 8.99086 8.32753 9.16307 8.9365 9.5"
-        stroke="currentColor"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M7 9C8.38071 9 9.5 7.88071 9.5 6.5C9.5 5.11929 8.38071 4 7 4C5.61929 4 4.5 5.11929 4.5 6.5C4.5 7.88071 5.61929 9 7 9Z"
-        stroke="currentColor"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path d="M10.5 11L13 13.5" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" />
-      <path d="M13 11L10.5 13.5" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" />
-    </g>
-    <defs>
-      <clipPath id="clip0_806_120890">
+export function SuspendedUserIcon({ className, ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...rest}>
+      <g clipPath="url(#clip0_806_120890)">
         <path
-          d="M2 4.5C2 3.39543 2.89543 2.5 4 2.5H12C13.1046 2.5 14 3.39543 14 4.5V12.5C14 13.6046 13.1046 14.5 12 14.5H4C2.89543 14.5 2 13.6046 2 12.5V4.5Z"
-          fill="white"
+          d="M3 13C3 12.304 3.18158 11.6201 3.52681 11.0158C3.87204 10.4115 4.36897 9.90774 4.9685 9.55428C5.56802 9.20082 6.24939 9.00989 6.94529 9.00037C7.64119 8.99086 8.32753 9.16307 8.9365 9.5"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
         />
-      </clipPath>
-    </defs>
-  </svg>
-);
+        <path
+          d="M7 9C8.38071 9 9.5 7.88071 9.5 6.5C9.5 5.11929 8.38071 4 7 4C5.61929 4 4.5 5.11929 4.5 6.5C4.5 7.88071 5.61929 9 7 9Z"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path d="M10.5 11L13 13.5" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M13 11L10.5 13.5" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" />
+      </g>
+      <defs>
+        <clipPath id="clip0_806_120890">
+          <path
+            d="M2 4.5C2 3.39543 2.89543 2.5 4 2.5H12C13.1046 2.5 14 3.39543 14 4.5V12.5C14 13.6046 13.1046 14.5 12 14.5H4C2.89543 14.5 2 13.6046 2 12.5V4.5Z"
+            fill="white"
+          />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/teams.tsx b/packages/propel/src/icons/teams.tsx
index 56bc60dba..9475bd59b 100644
--- a/packages/propel/src/icons/teams.tsx
+++ b/packages/propel/src/icons/teams.tsx
@@ -2,18 +2,20 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const TeamsIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg className={className} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M8.25 6.75C8.25 5.75544 8.64509 4.80161 9.34835 4.09835C10.0516 3.39509 11.0054 3 12 3C12.9946 3 13.9484 3.39509 14.6517 4.09835C15.3549 4.80161 15.75 5.75544 15.75 6.75C15.75 7.74456 15.3549 8.69839 14.6517 9.40165C13.9484 10.1049 12.9946 10.5 12 10.5C11.0054 10.5 10.0516 10.1049 9.34835 9.40165C8.64509 8.69839 8.25 7.74456 8.25 6.75ZM15.75 9.75C15.75 8.95435 16.0661 8.19129 16.6287 7.62868C17.1913 7.06607 17.9544 6.75 18.75 6.75C19.5456 6.75 20.3087 7.06607 20.8713 7.62868C21.4339 8.19129 21.75 8.95435 21.75 9.75C21.75 10.5456 21.4339 11.3087 20.8713 11.8713C20.3087 12.4339 19.5456 12.75 18.75 12.75C17.9544 12.75 17.1913 12.4339 16.6287 11.8713C16.0661 11.3087 15.75 10.5456 15.75 9.75ZM2.25 9.75C2.25 8.95435 2.56607 8.19129 3.12868 7.62868C3.69129 7.06607 4.45435 6.75 5.25 6.75C6.04565 6.75 6.80871 7.06607 7.37132 7.62868C7.93393 8.19129 8.25 8.95435 8.25 9.75C8.25 10.5456 7.93393 11.3087 7.37132 11.8713C6.80871 12.4339 6.04565 12.75 5.25 12.75C4.45435 12.75 3.69129 12.4339 3.12868 11.8713C2.56607 11.3087 2.25 10.5456 2.25 9.75ZM6.31 15.117C6.91995 14.161 7.76108 13.3743 8.75562 12.8294C9.75016 12.2846 10.866 11.9994 12 12C12.9498 11.9991 13.8891 12.1989 14.7564 12.5862C15.6237 12.9734 16.3994 13.5395 17.0327 14.2474C17.6661 14.9552 18.1428 15.7888 18.4317 16.6936C18.7205 17.5985 18.815 18.5541 18.709 19.498C18.696 19.6153 18.6556 19.7278 18.591 19.8265C18.5263 19.9252 18.4393 20.0073 18.337 20.066C16.4086 21.1725 14.2233 21.7532 12 21.75C9.695 21.75 7.53 21.138 5.663 20.066C5.56069 20.0073 5.47368 19.9252 5.40904 19.8265C5.34441 19.7278 5.30396 19.6153 5.291 19.498C5.12305 17.9646 5.48246 16.4198 6.31 15.118V15.117Z"
-      fill="currentColor"
-      {...rest}
-    />
-    <path
-      d="M5.08208 14.2539C4.09584 15.7763 3.63633 17.5802 3.77408 19.3889C3.17359 19.2979 2.58299 19.1505 2.01008 18.9489L1.89508 18.9089C1.79248 18.8725 1.70263 18.8071 1.63643 18.7207C1.57023 18.6342 1.53051 18.5305 1.52208 18.4219L1.51208 18.3009C1.47169 17.7989 1.53284 17.2938 1.69188 16.816C1.85093 16.3381 2.10462 15.8971 2.4378 15.5194C2.77099 15.1417 3.17685 14.835 3.63116 14.6176C4.08547 14.4001 4.57893 14.2765 5.08208 14.2539ZM20.2261 19.3889C20.3638 17.5802 19.9043 15.7763 18.9181 14.2539C19.4212 14.2765 19.9147 14.4001 20.369 14.6176C20.8233 14.835 21.2292 15.1417 21.5624 15.5194C21.8955 15.8971 22.1492 16.3381 22.3083 16.816C22.4673 17.2938 22.5285 17.7989 22.4881 18.3009L22.4781 18.4219C22.4695 18.5303 22.4297 18.6338 22.3635 18.7201C22.2973 18.8063 22.2075 18.8716 22.1051 18.9079L21.9901 18.9479C21.4231 19.1479 20.8341 19.2969 20.2261 19.3889Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function TeamsIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg className={className} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M8.25 6.75C8.25 5.75544 8.64509 4.80161 9.34835 4.09835C10.0516 3.39509 11.0054 3 12 3C12.9946 3 13.9484 3.39509 14.6517 4.09835C15.3549 4.80161 15.75 5.75544 15.75 6.75C15.75 7.74456 15.3549 8.69839 14.6517 9.40165C13.9484 10.1049 12.9946 10.5 12 10.5C11.0054 10.5 10.0516 10.1049 9.34835 9.40165C8.64509 8.69839 8.25 7.74456 8.25 6.75ZM15.75 9.75C15.75 8.95435 16.0661 8.19129 16.6287 7.62868C17.1913 7.06607 17.9544 6.75 18.75 6.75C19.5456 6.75 20.3087 7.06607 20.8713 7.62868C21.4339 8.19129 21.75 8.95435 21.75 9.75C21.75 10.5456 21.4339 11.3087 20.8713 11.8713C20.3087 12.4339 19.5456 12.75 18.75 12.75C17.9544 12.75 17.1913 12.4339 16.6287 11.8713C16.0661 11.3087 15.75 10.5456 15.75 9.75ZM2.25 9.75C2.25 8.95435 2.56607 8.19129 3.12868 7.62868C3.69129 7.06607 4.45435 6.75 5.25 6.75C6.04565 6.75 6.80871 7.06607 7.37132 7.62868C7.93393 8.19129 8.25 8.95435 8.25 9.75C8.25 10.5456 7.93393 11.3087 7.37132 11.8713C6.80871 12.4339 6.04565 12.75 5.25 12.75C4.45435 12.75 3.69129 12.4339 3.12868 11.8713C2.56607 11.3087 2.25 10.5456 2.25 9.75ZM6.31 15.117C6.91995 14.161 7.76108 13.3743 8.75562 12.8294C9.75016 12.2846 10.866 11.9994 12 12C12.9498 11.9991 13.8891 12.1989 14.7564 12.5862C15.6237 12.9734 16.3994 13.5395 17.0327 14.2474C17.6661 14.9552 18.1428 15.7888 18.4317 16.6936C18.7205 17.5985 18.815 18.5541 18.709 19.498C18.696 19.6153 18.6556 19.7278 18.591 19.8265C18.5263 19.9252 18.4393 20.0073 18.337 20.066C16.4086 21.1725 14.2233 21.7532 12 21.75C9.695 21.75 7.53 21.138 5.663 20.066C5.56069 20.0073 5.47368 19.9252 5.40904 19.8265C5.34441 19.7278 5.30396 19.6153 5.291 19.498C5.12305 17.9646 5.48246 16.4198 6.31 15.118V15.117Z"
+        fill="currentColor"
+        {...rest}
+      />
+      <path
+        d="M5.08208 14.2539C4.09584 15.7763 3.63633 17.5802 3.77408 19.3889C3.17359 19.2979 2.58299 19.1505 2.01008 18.9489L1.89508 18.9089C1.79248 18.8725 1.70263 18.8071 1.63643 18.7207C1.57023 18.6342 1.53051 18.5305 1.52208 18.4219L1.51208 18.3009C1.47169 17.7989 1.53284 17.2938 1.69188 16.816C1.85093 16.3381 2.10462 15.8971 2.4378 15.5194C2.77099 15.1417 3.17685 14.835 3.63116 14.6176C4.08547 14.4001 4.57893 14.2765 5.08208 14.2539ZM20.2261 19.3889C20.3638 17.5802 19.9043 15.7763 18.9181 14.2539C19.4212 14.2765 19.9147 14.4001 20.369 14.6176C20.8233 14.835 21.2292 15.1417 21.5624 15.5194C21.8955 15.8971 22.1492 16.3381 22.3083 16.816C22.4673 17.2938 22.5285 17.7989 22.4881 18.3009L22.4781 18.4219C22.4695 18.5303 22.4297 18.6338 22.3635 18.7201C22.2973 18.8063 22.2075 18.8716 22.1051 18.9079L21.9901 18.9479C21.4231 19.1479 20.8341 19.2969 20.2261 19.3889Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/transfer-icon.tsx b/packages/propel/src/icons/transfer-icon.tsx
index ebda6edcc..badf2b098 100644
--- a/packages/propel/src/icons/transfer-icon.tsx
+++ b/packages/propel/src/icons/transfer-icon.tsx
@@ -2,8 +2,10 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const TransferIcon: React.FC<ISvgIcons> = ({ className = "fill-current", ...rest }) => (
-  <svg viewBox="0 0 24 20" className={`${className} `} fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
-    <path d="M6.16683 14.6667C4.54183 14.6667 3.16336 14.1007 2.03141 12.9688C0.899468 11.8368 0.333496 10.4583 0.333496 8.83333C0.333496 7.125 0.941135 5.73264 2.15641 4.65625C3.37169 3.57986 4.72933 3.09028 6.22933 3.1875L4.87516 1.83333C4.75016 1.70833 4.68766 1.55903 4.68766 1.38542C4.68766 1.21181 4.75016 1.0625 4.87516 0.9375C5.00016 0.8125 5.14947 0.75 5.32308 0.75C5.49669 0.75 5.646 0.8125 5.771 0.9375L8.22933 3.39583C8.29877 3.46528 8.34739 3.53472 8.37516 3.60417C8.40294 3.67361 8.41683 3.75 8.41683 3.83333C8.41683 3.91667 8.40294 3.99306 8.37516 4.0625C8.34739 4.13194 8.29877 4.20139 8.22933 4.27083L5.771 6.72917C5.646 6.85417 5.50016 6.91319 5.3335 6.90625C5.16683 6.89931 5.021 6.83333 4.896 6.70833C4.771 6.58333 4.7085 6.43403 4.7085 6.26042C4.7085 6.08681 4.771 5.9375 4.896 5.8125L6.29183 4.41667C4.97239 4.38889 3.8578 4.79167 2.94808 5.625C2.03836 6.45833 1.5835 7.52778 1.5835 8.83333C1.5835 10.0972 2.03141 11.1771 2.92725 12.0729C3.82308 12.9688 4.90294 13.4167 6.16683 13.4167H8.04183C8.22239 13.4167 8.37169 13.4757 8.48975 13.5938C8.6078 13.7118 8.66683 13.8611 8.66683 14.0417C8.66683 14.2222 8.6078 14.3715 8.48975 14.4896C8.37169 14.6076 8.22239 14.6667 8.04183 14.6667H6.16683ZM11.5835 14.6667C11.2363 14.6667 10.9411 14.5451 10.6981 14.3021C10.455 14.059 10.3335 13.7639 10.3335 13.4167V10.0833C10.3335 9.73611 10.455 9.44097 10.6981 9.19792C10.9411 8.95486 11.2363 8.83333 11.5835 8.83333H16.5835C16.9307 8.83333 17.2259 8.95486 17.4689 9.19792C17.712 9.44097 17.8335 9.73611 17.8335 10.0833V13.4167C17.8335 13.7639 17.712 14.059 17.4689 14.3021C17.2259 14.5451 16.9307 14.6667 16.5835 14.6667H11.5835ZM11.5835 13.4167H16.5835V10.0833H11.5835V13.4167ZM11.5835 7.16667C11.2363 7.16667 10.9411 7.04514 10.6981 6.80208C10.455 6.55903 10.3335 6.26389 10.3335 5.91667V2.58333C10.3335 2.23611 10.455 1.94097 10.6981 1.69792C10.9411 1.45486 11.2363 1.33333 11.5835 1.33333H16.5835C16.9307 1.33333 17.2259 1.45486 17.4689 1.69792C17.712 1.94097 17.8335 2.23611 17.8335 2.58333V5.91667C17.8335 6.26389 17.712 6.55903 17.4689 6.80208C17.2259 7.04514 16.9307 7.16667 16.5835 7.16667H11.5835Z" />
-  </svg>
-);
+export function TransferIcon({ className = "fill-current", ...rest }: ISvgIcons) {
+  return (
+    <svg viewBox="0 0 24 20" className={`${className} `} fill="none" xmlns="http://www.w3.org/2000/svg" {...rest}>
+      <path d="M6.16683 14.6667C4.54183 14.6667 3.16336 14.1007 2.03141 12.9688C0.899468 11.8368 0.333496 10.4583 0.333496 8.83333C0.333496 7.125 0.941135 5.73264 2.15641 4.65625C3.37169 3.57986 4.72933 3.09028 6.22933 3.1875L4.87516 1.83333C4.75016 1.70833 4.68766 1.55903 4.68766 1.38542C4.68766 1.21181 4.75016 1.0625 4.87516 0.9375C5.00016 0.8125 5.14947 0.75 5.32308 0.75C5.49669 0.75 5.646 0.8125 5.771 0.9375L8.22933 3.39583C8.29877 3.46528 8.34739 3.53472 8.37516 3.60417C8.40294 3.67361 8.41683 3.75 8.41683 3.83333C8.41683 3.91667 8.40294 3.99306 8.37516 4.0625C8.34739 4.13194 8.29877 4.20139 8.22933 4.27083L5.771 6.72917C5.646 6.85417 5.50016 6.91319 5.3335 6.90625C5.16683 6.89931 5.021 6.83333 4.896 6.70833C4.771 6.58333 4.7085 6.43403 4.7085 6.26042C4.7085 6.08681 4.771 5.9375 4.896 5.8125L6.29183 4.41667C4.97239 4.38889 3.8578 4.79167 2.94808 5.625C2.03836 6.45833 1.5835 7.52778 1.5835 8.83333C1.5835 10.0972 2.03141 11.1771 2.92725 12.0729C3.82308 12.9688 4.90294 13.4167 6.16683 13.4167H8.04183C8.22239 13.4167 8.37169 13.4757 8.48975 13.5938C8.6078 13.7118 8.66683 13.8611 8.66683 14.0417C8.66683 14.2222 8.6078 14.3715 8.48975 14.4896C8.37169 14.6076 8.22239 14.6667 8.04183 14.6667H6.16683ZM11.5835 14.6667C11.2363 14.6667 10.9411 14.5451 10.6981 14.3021C10.455 14.059 10.3335 13.7639 10.3335 13.4167V10.0833C10.3335 9.73611 10.455 9.44097 10.6981 9.19792C10.9411 8.95486 11.2363 8.83333 11.5835 8.83333H16.5835C16.9307 8.83333 17.2259 8.95486 17.4689 9.19792C17.712 9.44097 17.8335 9.73611 17.8335 10.0833V13.4167C17.8335 13.7639 17.712 14.059 17.4689 14.3021C17.2259 14.5451 16.9307 14.6667 16.5835 14.6667H11.5835ZM11.5835 13.4167H16.5835V10.0833H11.5835V13.4167ZM11.5835 7.16667C11.2363 7.16667 10.9411 7.04514 10.6981 6.80208C10.455 6.55903 10.3335 6.26389 10.3335 5.91667V2.58333C10.3335 2.23611 10.455 1.94097 10.6981 1.69792C10.9411 1.45486 11.2363 1.33333 11.5835 1.33333H16.5835C16.9307 1.33333 17.2259 1.45486 17.4689 1.69792C17.712 1.94097 17.8335 2.23611 17.8335 2.58333V5.91667C17.8335 6.26389 17.712 6.55903 17.4689 6.80208C17.2259 7.04514 16.9307 7.16667 16.5835 7.16667H11.5835Z" />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/tree-map-icon.tsx b/packages/propel/src/icons/tree-map-icon.tsx
index c37d10a3f..5356d958b 100644
--- a/packages/propel/src/icons/tree-map-icon.tsx
+++ b/packages/propel/src/icons/tree-map-icon.tsx
@@ -2,15 +2,17 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const TreeMapIcon: React.FC<ISvgIcons> = ({ className = "", ...rest }) => (
-  <svg className={className} viewBox="0 0 27 22" fill="currentColor" xmlns="http://www.w3.org/2000/svg" {...rest}>
-    <rect width="10" height="10" rx="1" fill="currentColor" />
-    <rect x="11.5" width="10" height="6" rx="1" fill="currentColor" />
-    <rect y="12" width="10" height="10" rx="1" fill="currentColor" />
-    <rect x="11.5" y="16" width="10" height="6" rx="1" fill="currentColor" />
-    <rect x="11.5" y="8" width="10" height="6" rx="1" fill="currentColor" />
-    <rect x="23" width="4" height="11" rx="1" fill="currentColor" />
-    <rect x="23" y="13" width="4" height="4" rx="1" fill="currentColor" />
-    <rect x="23" y="19" width="4" height="3" rx="1" fill="currentColor" />
-  </svg>
-);
+export function TreeMapIcon({ className = "", ...rest }: ISvgIcons) {
+  return (
+    <svg className={className} viewBox="0 0 27 22" fill="currentColor" xmlns="http://www.w3.org/2000/svg" {...rest}>
+      <rect width="10" height="10" rx="1" fill="currentColor" />
+      <rect x="11.5" width="10" height="6" rx="1" fill="currentColor" />
+      <rect y="12" width="10" height="10" rx="1" fill="currentColor" />
+      <rect x="11.5" y="16" width="10" height="6" rx="1" fill="currentColor" />
+      <rect x="11.5" y="8" width="10" height="6" rx="1" fill="currentColor" />
+      <rect x="23" width="4" height="11" rx="1" fill="currentColor" />
+      <rect x="23" y="13" width="4" height="4" rx="1" fill="currentColor" />
+      <rect x="23" y="19" width="4" height="3" rx="1" fill="currentColor" />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/updates-icon.tsx b/packages/propel/src/icons/updates-icon.tsx
index 5af0ffc6f..bdcb52d26 100644
--- a/packages/propel/src/icons/updates-icon.tsx
+++ b/packages/propel/src/icons/updates-icon.tsx
@@ -2,17 +2,26 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const UpdatesIcon: React.FC<ISvgIcons> = ({ className = "text-current" }) => (
-  <svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M6.54325 5.056C8.46325 2.58867 11.4633 1 14.8333 1C14.9659 1 15.093 1.05268 15.1868 1.14645C15.2806 1.24021 15.3333 1.36739 15.3333 1.5C15.3333 4.87067 13.7446 7.87 11.2773 9.79067C11.3799 10.4335 11.3418 11.0909 11.1656 11.7176C10.9895 12.3443 10.6795 12.9253 10.257 13.4205C9.83454 13.9158 9.30964 14.3135 8.71854 14.5862C8.12744 14.8588 7.48422 15 6.83325 15C6.70064 15 6.57347 14.9473 6.4797 14.8536C6.38593 14.7598 6.33325 14.6326 6.33325 14.5V11.746C5.6852 11.2342 5.09942 10.6482 4.58792 10H1.83325C1.70064 10 1.57347 9.94732 1.4797 9.85355C1.38593 9.75979 1.33325 9.63261 1.33325 9.5C1.3332 8.84897 1.47441 8.20568 1.74713 7.61453C2.01986 7.02337 2.41761 6.49843 2.91293 6.07594C3.40824 5.65345 3.98934 5.34346 4.6161 5.16737C5.24287 4.99128 5.90038 4.95328 6.54325 5.056ZM10.3333 4.5C9.93543 4.5 9.5539 4.65804 9.27259 4.93934C8.99129 5.22064 8.83325 5.60218 8.83325 6C8.83325 6.39782 8.99129 6.77936 9.27259 7.06066C9.5539 7.34196 9.93543 7.5 10.3333 7.5C10.7311 7.5 11.1126 7.34196 11.3939 7.06066C11.6752 6.77936 11.8333 6.39782 11.8333 6C11.8333 5.60218 11.6752 5.22064 11.3939 4.93934C11.1126 4.65804 10.7311 4.5 10.3333 4.5Z"
-      fill="#8591AD"
-    />
-    <path
-      d="M3.83994 11.4947C3.8926 11.4554 3.93701 11.4062 3.97064 11.3497C4.00426 11.2933 4.02645 11.2308 4.03592 11.1658C4.04539 11.1008 4.04197 11.0346 4.02584 10.9709C4.00972 10.9072 3.98121 10.8473 3.94194 10.7947C3.90268 10.742 3.85342 10.6976 3.797 10.664C3.74057 10.6304 3.67807 10.6082 3.61307 10.5987C3.54807 10.5892 3.48184 10.5927 3.41816 10.6088C3.35448 10.6249 3.2946 10.6534 3.24194 10.6927C2.73054 11.0731 2.33288 11.5861 2.092 12.1762C1.85111 12.7663 1.77617 13.4111 1.87528 14.0407C1.89139 14.1455 1.94045 14.2426 2.01536 14.3177C2.09026 14.3929 2.18713 14.4422 2.29194 14.4587C2.92163 14.5577 3.56641 14.4827 4.15652 14.2417C4.74664 14.0007 5.25961 13.6029 5.63994 13.0913C5.68047 13.0388 5.71015 12.9788 5.72723 12.9147C5.74432 12.8506 5.74848 12.7837 5.73948 12.718C5.73047 12.6522 5.70847 12.589 5.67476 12.5318C5.64105 12.4747 5.59631 12.4248 5.54315 12.3852C5.48998 12.3455 5.42945 12.3168 5.36508 12.3007C5.30071 12.2847 5.23379 12.2816 5.16821 12.2917C5.10264 12.3017 5.03973 12.3248 4.98314 12.3594C4.92655 12.394 4.87742 12.4395 4.83861 12.4933C4.60612 12.806 4.30366 13.0599 3.95544 13.2347C3.60722 13.4095 3.22291 13.5004 2.83328 13.5C2.83328 12.68 3.22794 11.9513 3.83994 11.4947Z"
-      fill="#8591AD"
-    />
-  </svg>
-);
+export function UpdatesIcon({ className = "text-current" }: ISvgIcons) {
+  return (
+    <svg
+      width="17"
+      height="16"
+      viewBox="0 0 17 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M6.54325 5.056C8.46325 2.58867 11.4633 1 14.8333 1C14.9659 1 15.093 1.05268 15.1868 1.14645C15.2806 1.24021 15.3333 1.36739 15.3333 1.5C15.3333 4.87067 13.7446 7.87 11.2773 9.79067C11.3799 10.4335 11.3418 11.0909 11.1656 11.7176C10.9895 12.3443 10.6795 12.9253 10.257 13.4205C9.83454 13.9158 9.30964 14.3135 8.71854 14.5862C8.12744 14.8588 7.48422 15 6.83325 15C6.70064 15 6.57347 14.9473 6.4797 14.8536C6.38593 14.7598 6.33325 14.6326 6.33325 14.5V11.746C5.6852 11.2342 5.09942 10.6482 4.58792 10H1.83325C1.70064 10 1.57347 9.94732 1.4797 9.85355C1.38593 9.75979 1.33325 9.63261 1.33325 9.5C1.3332 8.84897 1.47441 8.20568 1.74713 7.61453C2.01986 7.02337 2.41761 6.49843 2.91293 6.07594C3.40824 5.65345 3.98934 5.34346 4.6161 5.16737C5.24287 4.99128 5.90038 4.95328 6.54325 5.056ZM10.3333 4.5C9.93543 4.5 9.5539 4.65804 9.27259 4.93934C8.99129 5.22064 8.83325 5.60218 8.83325 6C8.83325 6.39782 8.99129 6.77936 9.27259 7.06066C9.5539 7.34196 9.93543 7.5 10.3333 7.5C10.7311 7.5 11.1126 7.34196 11.3939 7.06066C11.6752 6.77936 11.8333 6.39782 11.8333 6C11.8333 5.60218 11.6752 5.22064 11.3939 4.93934C11.1126 4.65804 10.7311 4.5 10.3333 4.5Z"
+        fill="#8591AD"
+      />
+      <path
+        d="M3.83994 11.4947C3.8926 11.4554 3.93701 11.4062 3.97064 11.3497C4.00426 11.2933 4.02645 11.2308 4.03592 11.1658C4.04539 11.1008 4.04197 11.0346 4.02584 10.9709C4.00972 10.9072 3.98121 10.8473 3.94194 10.7947C3.90268 10.742 3.85342 10.6976 3.797 10.664C3.74057 10.6304 3.67807 10.6082 3.61307 10.5987C3.54807 10.5892 3.48184 10.5927 3.41816 10.6088C3.35448 10.6249 3.2946 10.6534 3.24194 10.6927C2.73054 11.0731 2.33288 11.5861 2.092 12.1762C1.85111 12.7663 1.77617 13.4111 1.87528 14.0407C1.89139 14.1455 1.94045 14.2426 2.01536 14.3177C2.09026 14.3929 2.18713 14.4422 2.29194 14.4587C2.92163 14.5577 3.56641 14.4827 4.15652 14.2417C4.74664 14.0007 5.25961 13.6029 5.63994 13.0913C5.68047 13.0388 5.71015 12.9788 5.72723 12.9147C5.74432 12.8506 5.74848 12.7837 5.73948 12.718C5.73047 12.6522 5.70847 12.589 5.67476 12.5318C5.64105 12.4747 5.59631 12.4248 5.54315 12.3852C5.48998 12.3455 5.42945 12.3168 5.36508 12.3007C5.30071 12.2847 5.23379 12.2816 5.16821 12.2917C5.10264 12.3017 5.03973 12.3248 4.98314 12.3594C4.92655 12.394 4.87742 12.4395 4.83861 12.4933C4.60612 12.806 4.30366 13.0599 3.95544 13.2347C3.60722 13.4095 3.22291 13.5004 2.83328 13.5C2.83328 12.68 3.22794 11.9513 3.83994 11.4947Z"
+        fill="#8591AD"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/user-activity-icon.tsx b/packages/propel/src/icons/user-activity-icon.tsx
index 01bf740df..367920155 100644
--- a/packages/propel/src/icons/user-activity-icon.tsx
+++ b/packages/propel/src/icons/user-activity-icon.tsx
@@ -2,20 +2,22 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const UserActivityIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
-  <svg
-    viewBox="0 0 24 24"
-    className={`${className} stroke-2`}
-    stroke="currentColor"
-    fill="none"
-    strokeWidth="1.5"
-    xmlns="http://www.w3.org/2000/svg"
-    strokeLinecap="round"
-    strokeLinejoin="round"
-    {...rest}
-  >
-    <path d="M10.5 13C12.9853 13 15 10.9853 15 8.5C15 6.01472 12.9853 4 10.5 4C8.01472 4 6 6.01472 6 8.5C6 10.9853 8.01472 13 10.5 13Z" />
-    <path d="M13.9062 13.5903C12.8368 13.1001 11.661 12.8876 10.4877 12.9725C9.31437 13.0574 8.18144 13.437 7.19379 14.0761C6.20613 14.7152 5.39567 15.5931 4.83744 16.6286C4.2792 17.6641 3.99124 18.8237 4.0002 20" />
-    <path d="M21 16.5H19.6L18.2 20L16.8 13L15.4 16.5H14" />
-  </svg>
-);
+export function UserActivityIcon({ className = "text-current", ...rest }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      className={`${className} stroke-2`}
+      stroke="currentColor"
+      fill="none"
+      strokeWidth="1.5"
+      xmlns="http://www.w3.org/2000/svg"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      {...rest}
+    >
+      <path d="M10.5 13C12.9853 13 15 10.9853 15 8.5C15 6.01472 12.9853 4 10.5 4C8.01472 4 6 6.01472 6 8.5C6 10.9853 8.01472 13 10.5 13Z" />
+      <path d="M13.9062 13.5903C12.8368 13.1001 11.661 12.8876 10.4877 12.9725C9.31437 13.0574 8.18144 13.437 7.19379 14.0761C6.20613 14.7152 5.39567 15.5931 4.83744 16.6286C4.2792 17.6641 3.99124 18.8237 4.0002 20" />
+      <path d="M21 16.5H19.6L18.2 20L16.8 13L15.4 16.5H14" />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/workspace-icon.tsx b/packages/propel/src/icons/workspace-icon.tsx
index c097b9ad8..770133ddc 100644
--- a/packages/propel/src/icons/workspace-icon.tsx
+++ b/packages/propel/src/icons/workspace-icon.tsx
@@ -2,20 +2,22 @@ import * as React from "react";
 
 import type { ISvgIcons } from "./type";
 
-export const WorkspaceIcon: React.FC<ISvgIcons> = ({ className }) => (
-  <svg
-    viewBox="0 0 24 24"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    className={className}
-    role="img"
-    aria-label="Workspace icon"
-  >
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M2.25 3C2.25 2.58579 2.58579 2.25 3 2.25H15C15.4142 2.25 15.75 2.58579 15.75 3C15.75 3.41421 15.4142 3.75 15 3.75V6.75H21C21.4142 6.75 21.75 7.08579 21.75 7.5C21.75 7.91421 21.4142 8.25 21 8.25V20.25H21.75C22.1642 20.25 22.5 20.5858 22.5 21C22.5 21.4142 22.1642 21.75 21.75 21.75H2.25C1.83579 21.75 1.5 21.4142 1.5 21C1.5 20.5858 1.83579 20.25 2.25 20.25H3V3.75C2.58579 3.75 2.25 3.41421 2.25 3ZM4.5 3.75V20.25H6V17.625C6 16.5898 6.83979 15.75 7.875 15.75H10.125C11.1602 15.75 12 16.5898 12 17.625V20.25H13.5V3.75H4.5ZM15 8.25V20.25H19.5V8.25H15ZM10.5 20.25V17.625C10.5 17.4182 10.3318 17.25 10.125 17.25H7.875C7.66821 17.25 7.5 17.4182 7.5 17.625V20.25H10.5ZM6 6.75C6 6.33579 6.33579 6 6.75 6H7.5C7.91421 6 8.25 6.33579 8.25 6.75C8.25 7.16421 7.91421 7.5 7.5 7.5H6.75C6.33579 7.5 6 7.16421 6 6.75ZM9.75 6.75C9.75 6.33579 10.0858 6 10.5 6H11.25C11.6642 6 12 6.33579 12 6.75C12 7.16421 11.6642 7.5 11.25 7.5H10.5C10.0858 7.5 9.75 7.16421 9.75 6.75ZM6 9.75C6 9.33579 6.33579 9 6.75 9H7.5C7.91421 9 8.25 9.33579 8.25 9.75C8.25 10.1642 7.91421 10.5 7.5 10.5H6.75C6.33579 10.5 6 10.1642 6 9.75ZM9.75 9.75C9.75 9.33579 10.0858 9 10.5 9H11.25C11.6642 9 12 9.33579 12 9.75C12 10.1642 11.6642 10.5 11.25 10.5H10.5C10.0858 10.5 9.75 10.1642 9.75 9.75ZM16.5 11.25C16.5 10.8358 16.8358 10.5 17.25 10.5H17.258C17.6722 10.5 18.008 10.8358 18.008 11.25V11.258C18.008 11.6722 17.6722 12.008 17.258 12.008H17.25C16.8358 12.008 16.5 11.6722 16.5 11.258V11.25ZM6 12.75C6 12.3358 6.33579 12 6.75 12H7.5C7.91421 12 8.25 12.3358 8.25 12.75C8.25 13.1642 7.91421 13.5 7.5 13.5H6.75C6.33579 13.5 6 13.1642 6 12.75ZM9.75 12.75C9.75 12.3358 10.0858 12 10.5 12H11.25C11.6642 12 12 12.3358 12 12.75C12 13.1642 11.6642 13.5 11.25 13.5H10.5C10.0858 13.5 9.75 13.1642 9.75 12.75ZM16.5 14.25C16.5 13.8358 16.8358 13.5 17.25 13.5H17.258C17.6722 13.5 18.008 13.8358 18.008 14.25V14.258C18.008 14.6722 17.6722 15.008 17.258 15.008H17.25C16.8358 15.008 16.5 14.6722 16.5 14.258V14.25ZM16.5 17.25C16.5 16.8358 16.8358 16.5 17.25 16.5H17.258C17.6722 16.5 18.008 16.8358 18.008 17.25V17.258C18.008 17.6722 17.6722 18.008 17.258 18.008H17.25C16.8358 18.008 16.5 17.6722 16.5 17.258V17.25Z"
-      fill="currentColor"
-    />
-  </svg>
-);
+export function WorkspaceIcon({ className }: ISvgIcons) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      role="img"
+      aria-label="Workspace icon"
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M2.25 3C2.25 2.58579 2.58579 2.25 3 2.25H15C15.4142 2.25 15.75 2.58579 15.75 3C15.75 3.41421 15.4142 3.75 15 3.75V6.75H21C21.4142 6.75 21.75 7.08579 21.75 7.5C21.75 7.91421 21.4142 8.25 21 8.25V20.25H21.75C22.1642 20.25 22.5 20.5858 22.5 21C22.5 21.4142 22.1642 21.75 21.75 21.75H2.25C1.83579 21.75 1.5 21.4142 1.5 21C1.5 20.5858 1.83579 20.25 2.25 20.25H3V3.75C2.58579 3.75 2.25 3.41421 2.25 3ZM4.5 3.75V20.25H6V17.625C6 16.5898 6.83979 15.75 7.875 15.75H10.125C11.1602 15.75 12 16.5898 12 17.625V20.25H13.5V3.75H4.5ZM15 8.25V20.25H19.5V8.25H15ZM10.5 20.25V17.625C10.5 17.4182 10.3318 17.25 10.125 17.25H7.875C7.66821 17.25 7.5 17.4182 7.5 17.625V20.25H10.5ZM6 6.75C6 6.33579 6.33579 6 6.75 6H7.5C7.91421 6 8.25 6.33579 8.25 6.75C8.25 7.16421 7.91421 7.5 7.5 7.5H6.75C6.33579 7.5 6 7.16421 6 6.75ZM9.75 6.75C9.75 6.33579 10.0858 6 10.5 6H11.25C11.6642 6 12 6.33579 12 6.75C12 7.16421 11.6642 7.5 11.25 7.5H10.5C10.0858 7.5 9.75 7.16421 9.75 6.75ZM6 9.75C6 9.33579 6.33579 9 6.75 9H7.5C7.91421 9 8.25 9.33579 8.25 9.75C8.25 10.1642 7.91421 10.5 7.5 10.5H6.75C6.33579 10.5 6 10.1642 6 9.75ZM9.75 9.75C9.75 9.33579 10.0858 9 10.5 9H11.25C11.6642 9 12 9.33579 12 9.75C12 10.1642 11.6642 10.5 11.25 10.5H10.5C10.0858 10.5 9.75 10.1642 9.75 9.75ZM16.5 11.25C16.5 10.8358 16.8358 10.5 17.25 10.5H17.258C17.6722 10.5 18.008 10.8358 18.008 11.25V11.258C18.008 11.6722 17.6722 12.008 17.258 12.008H17.25C16.8358 12.008 16.5 11.6722 16.5 11.258V11.25ZM6 12.75C6 12.3358 6.33579 12 6.75 12H7.5C7.91421 12 8.25 12.3358 8.25 12.75C8.25 13.1642 7.91421 13.5 7.5 13.5H6.75C6.33579 13.5 6 13.1642 6 12.75ZM9.75 12.75C9.75 12.3358 10.0858 12 10.5 12H11.25C11.6642 12 12 12.3358 12 12.75C12 13.1642 11.6642 13.5 11.25 13.5H10.5C10.0858 13.5 9.75 13.1642 9.75 12.75ZM16.5 14.25C16.5 13.8358 16.8358 13.5 17.25 13.5H17.258C17.6722 13.5 18.008 13.8358 18.008 14.25V14.258C18.008 14.6722 17.6722 15.008 17.258 15.008H17.25C16.8358 15.008 16.5 14.6722 16.5 14.258V14.25ZM16.5 17.25C16.5 16.8358 16.8358 16.5 17.25 16.5H17.258C17.6722 16.5 18.008 16.8358 18.008 17.25V17.258C18.008 17.6722 17.6722 18.008 17.258 18.008H17.25C16.8358 18.008 16.5 17.6722 16.5 17.258V17.25Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/packages/propel/src/icons/workspace/analytics-icon.tsx b/packages/propel/src/icons/workspace/analytics-icon.tsx
index 5259dd22a..cc8bd16d6 100644
--- a/packages/propel/src/icons/workspace/analytics-icon.tsx
+++ b/packages/propel/src/icons/workspace/analytics-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const AnalyticsIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.375 5.2002C13.375 4.62994 13.3743 4.23962 13.3496 3.9375C13.3255 3.64296 13.2821 3.48707 13.2256 3.37598C13.0938 3.11725 12.8827 2.90624 12.624 2.77441C12.5129 2.71788 12.357 2.67446 12.0625 2.65039C11.7604 2.62572 11.3701 2.625 10.7998 2.625H5.2002C4.62994 2.625 4.23962 2.62572 3.9375 2.65039C3.64296 2.67446 3.48707 2.71788 3.37598 2.77441C3.11725 2.90624 2.90624 3.11725 2.77441 3.37598C2.71788 3.48707 2.67446 3.64296 2.65039 3.9375C2.62572 4.23962 2.625 4.62994 2.625 5.2002V10.7998C2.625 11.3701 2.62572 11.7604 2.65039 12.0625C2.67446 12.357 2.71788 12.5129 2.77441 12.624C2.90624 12.8827 3.11725 13.0938 3.37598 13.2256C3.48707 13.2821 3.64296 13.3255 3.9375 13.3496C4.23962 13.3743 4.62994 13.375 5.2002 13.375H10.7998C11.3701 13.375 11.7604 13.3743 12.0625 13.3496C12.357 13.3255 12.5129 13.2821 12.624 13.2256C12.8827 13.0938 13.0938 12.8827 13.2256 12.624C13.2821 12.5129 13.3255 12.357 13.3496 12.0625C13.3743 11.7604 13.375 11.3701 13.375 10.7998V5.2002ZM4.70801 11.333V8.66699C4.70801 8.32192 4.98798 8.04217 5.33301 8.04199C5.67819 8.04199 5.95801 8.32181 5.95801 8.66699V11.333C5.95801 11.6782 5.67819 11.958 5.33301 11.958C4.98798 11.9578 4.70801 11.6781 4.70801 11.333ZM7.375 11.333V4.66699C7.375 4.32181 7.65482 4.04199 8 4.04199C8.34518 4.04199 8.625 4.32181 8.625 4.66699V11.333C8.625 11.6782 8.34518 11.958 8 11.958C7.65482 11.958 7.375 11.6782 7.375 11.333ZM10.042 11.333V7.33301C10.0422 6.98798 10.3219 6.70801 10.667 6.70801C11.0119 6.70818 11.2918 6.98809 11.292 7.33301V11.333C11.292 11.6781 11.012 11.9578 10.667 11.958C10.3218 11.958 10.042 11.6782 10.042 11.333ZM14.625 10.7998C14.625 11.3493 14.6255 11.7993 14.5957 12.1641C14.5653 12.5361 14.5001 12.8748 14.3389 13.1914C14.0872 13.6853 13.6853 14.0872 13.1914 14.3389C12.8748 14.5001 12.5361 14.5653 12.1641 14.5957C11.7993 14.6255 11.3493 14.625 10.7998 14.625H5.2002C4.65067 14.625 4.20072 14.6255 3.83594 14.5957C3.46388 14.5653 3.12523 14.5001 2.80859 14.3389C2.31467 14.0872 1.9128 13.6853 1.66113 13.1914C1.49985 12.8748 1.4347 12.5361 1.4043 12.1641C1.37452 11.7993 1.375 11.3493 1.375 10.7998V5.2002C1.375 4.65067 1.37452 4.20072 1.4043 3.83594C1.4347 3.46388 1.49985 3.12523 1.66113 2.80859C1.9128 2.31467 2.31467 1.9128 2.80859 1.66113C3.12523 1.49985 3.46388 1.4347 3.83594 1.4043C4.20072 1.37452 4.65067 1.375 5.2002 1.375H10.7998C11.3493 1.375 11.7993 1.37452 12.1641 1.4043C12.5361 1.4347 12.8748 1.49986 13.1914 1.66113C13.6853 1.9128 14.0872 2.31467 14.3389 2.80859C14.5001 3.12523 14.5653 3.46388 14.5957 3.83594C14.6255 4.20072 14.625 4.65067 14.625 5.2002V10.7998Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function AnalyticsIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.375 5.2002C13.375 4.62994 13.3743 4.23962 13.3496 3.9375C13.3255 3.64296 13.2821 3.48707 13.2256 3.37598C13.0938 3.11725 12.8827 2.90624 12.624 2.77441C12.5129 2.71788 12.357 2.67446 12.0625 2.65039C11.7604 2.62572 11.3701 2.625 10.7998 2.625H5.2002C4.62994 2.625 4.23962 2.62572 3.9375 2.65039C3.64296 2.67446 3.48707 2.71788 3.37598 2.77441C3.11725 2.90624 2.90624 3.11725 2.77441 3.37598C2.71788 3.48707 2.67446 3.64296 2.65039 3.9375C2.62572 4.23962 2.625 4.62994 2.625 5.2002V10.7998C2.625 11.3701 2.62572 11.7604 2.65039 12.0625C2.67446 12.357 2.71788 12.5129 2.77441 12.624C2.90624 12.8827 3.11725 13.0938 3.37598 13.2256C3.48707 13.2821 3.64296 13.3255 3.9375 13.3496C4.23962 13.3743 4.62994 13.375 5.2002 13.375H10.7998C11.3701 13.375 11.7604 13.3743 12.0625 13.3496C12.357 13.3255 12.5129 13.2821 12.624 13.2256C12.8827 13.0938 13.0938 12.8827 13.2256 12.624C13.2821 12.5129 13.3255 12.357 13.3496 12.0625C13.3743 11.7604 13.375 11.3701 13.375 10.7998V5.2002ZM4.70801 11.333V8.66699C4.70801 8.32192 4.98798 8.04217 5.33301 8.04199C5.67819 8.04199 5.95801 8.32181 5.95801 8.66699V11.333C5.95801 11.6782 5.67819 11.958 5.33301 11.958C4.98798 11.9578 4.70801 11.6781 4.70801 11.333ZM7.375 11.333V4.66699C7.375 4.32181 7.65482 4.04199 8 4.04199C8.34518 4.04199 8.625 4.32181 8.625 4.66699V11.333C8.625 11.6782 8.34518 11.958 8 11.958C7.65482 11.958 7.375 11.6782 7.375 11.333ZM10.042 11.333V7.33301C10.0422 6.98798 10.3219 6.70801 10.667 6.70801C11.0119 6.70818 11.2918 6.98809 11.292 7.33301V11.333C11.292 11.6781 11.012 11.9578 10.667 11.958C10.3218 11.958 10.042 11.6782 10.042 11.333ZM14.625 10.7998C14.625 11.3493 14.6255 11.7993 14.5957 12.1641C14.5653 12.5361 14.5001 12.8748 14.3389 13.1914C14.0872 13.6853 13.6853 14.0872 13.1914 14.3389C12.8748 14.5001 12.5361 14.5653 12.1641 14.5957C11.7993 14.6255 11.3493 14.625 10.7998 14.625H5.2002C4.65067 14.625 4.20072 14.6255 3.83594 14.5957C3.46388 14.5653 3.12523 14.5001 2.80859 14.3389C2.31467 14.0872 1.9128 13.6853 1.66113 13.1914C1.49985 12.8748 1.4347 12.5361 1.4043 12.1641C1.37452 11.7993 1.375 11.3493 1.375 10.7998V5.2002C1.375 4.65067 1.37452 4.20072 1.4043 3.83594C1.4347 3.46388 1.49985 3.12523 1.66113 2.80859C1.9128 2.31467 2.31467 1.9128 2.80859 1.66113C3.12523 1.49985 3.46388 1.4347 3.83594 1.4043C4.20072 1.37452 4.65067 1.375 5.2002 1.375H10.7998C11.3493 1.375 11.7993 1.37452 12.1641 1.4043C12.5361 1.4347 12.8748 1.49986 13.1914 1.66113C13.6853 1.9128 14.0872 2.31467 14.3389 2.80859C14.5001 3.12523 14.5653 3.46388 14.5957 3.83594C14.6255 4.20072 14.625 4.65067 14.625 5.2002V10.7998Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/workspace/archive-icon.tsx b/packages/propel/src/icons/workspace/archive-icon.tsx
index d5998cec1..b4dd0d0bb 100644
--- a/packages/propel/src/icons/workspace/archive-icon.tsx
+++ b/packages/propel/src/icons/workspace/archive-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ArchiveIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M12.708 5.95804H3.29105V10.7998C3.29105 11.3701 3.29177 11.7604 3.31644 12.0625C3.34052 12.3573 3.38484 12.5129 3.44144 12.6241C3.57326 12.8828 3.7833 13.0938 4.04202 13.2256C4.15311 13.2822 4.30886 13.3256 4.60355 13.3496C4.90567 13.3743 5.29595 13.375 5.86624 13.375H10.1328C10.7031 13.375 11.0934 13.3743 11.3955 13.3496C11.69 13.3256 11.8459 13.2822 11.9571 13.2256C12.2158 13.0938 12.4268 12.8828 12.5586 12.6241C12.6152 12.5129 12.6586 12.357 12.6826 12.0625C12.7073 11.7604 12.708 11.3701 12.708 10.7998V5.95804ZM9.33304 8.04202C9.67822 8.04203 9.95804 8.32185 9.95804 8.66702C9.95786 9.01205 9.67811 9.29202 9.33304 9.29202H6.66605C6.32113 9.29185 6.04122 9.01194 6.04105 8.66702C6.04105 8.32196 6.32102 8.0422 6.66605 8.04202H9.33304ZM14.041 3.66702C14.041 3.32769 14.0379 3.24861 14.0274 3.19534C13.9715 2.91452 13.7525 2.69474 13.4717 2.6387C13.4185 2.62812 13.3395 2.62503 13 2.62503H3.00003C2.66062 2.62503 2.58156 2.62814 2.52835 2.6387C2.24737 2.69459 2.0276 2.91436 1.97171 3.19534C1.96115 3.24855 1.95804 3.32761 1.95804 3.66702C1.95804 4.00648 1.96113 4.08551 1.97171 4.1387C2.02776 4.41946 2.24752 4.63851 2.52835 4.69437C2.54804 4.69828 2.5862 4.70359 2.68265 4.70609C2.68757 4.70622 2.69241 4.7078 2.6973 4.70804H13.3018C13.3067 4.7078 13.3115 4.70622 13.3164 4.70609C13.413 4.70359 13.452 4.69828 13.4717 4.69437C13.7523 4.63834 13.9714 4.41925 14.0274 4.1387C14.038 4.08546 14.041 4.00645 14.041 3.66702ZM15.291 3.66702C15.291 3.94665 15.2945 4.17765 15.2539 4.38187C15.116 5.07554 14.6164 5.63287 13.958 5.85452V10.7998C13.958 11.3494 13.9585 11.7993 13.9287 12.1641C13.8983 12.5362 13.8332 12.8748 13.6719 13.1914C13.4202 13.6854 13.0184 14.0872 12.5244 14.3389C12.2078 14.5002 11.8692 14.5653 11.4971 14.5957C11.1323 14.6255 10.6824 14.625 10.1328 14.625H5.86624C5.31662 14.625 4.8668 14.6255 4.50199 14.5957C4.17639 14.5691 3.87675 14.5155 3.59476 14.3946L3.47464 14.3389C2.98073 14.0872 2.57885 13.6854 2.32718 13.1914C2.16596 12.8748 2.10074 12.5361 2.07034 12.1641C2.04057 11.7993 2.04105 11.3494 2.04105 10.7998V5.85355C1.38301 5.63175 0.88406 5.07532 0.746126 4.38187C0.705511 4.17758 0.708038 3.94664 0.70804 3.66702C0.70804 3.38721 0.70547 3.1556 0.746126 2.9512C0.900699 2.17451 1.50752 1.56769 2.28421 1.41312C2.48861 1.37246 2.72022 1.37503 3.00003 1.37503H13C13.2797 1.37503 13.5106 1.37251 13.7149 1.41312C14.4917 1.56763 15.0994 2.17438 15.2539 2.9512C15.2946 3.15554 15.291 3.38718 15.291 3.66702Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function ArchiveIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M12.708 5.95804H3.29105V10.7998C3.29105 11.3701 3.29177 11.7604 3.31644 12.0625C3.34052 12.3573 3.38484 12.5129 3.44144 12.6241C3.57326 12.8828 3.7833 13.0938 4.04202 13.2256C4.15311 13.2822 4.30886 13.3256 4.60355 13.3496C4.90567 13.3743 5.29595 13.375 5.86624 13.375H10.1328C10.7031 13.375 11.0934 13.3743 11.3955 13.3496C11.69 13.3256 11.8459 13.2822 11.9571 13.2256C12.2158 13.0938 12.4268 12.8828 12.5586 12.6241C12.6152 12.5129 12.6586 12.357 12.6826 12.0625C12.7073 11.7604 12.708 11.3701 12.708 10.7998V5.95804ZM9.33304 8.04202C9.67822 8.04203 9.95804 8.32185 9.95804 8.66702C9.95786 9.01205 9.67811 9.29202 9.33304 9.29202H6.66605C6.32113 9.29185 6.04122 9.01194 6.04105 8.66702C6.04105 8.32196 6.32102 8.0422 6.66605 8.04202H9.33304ZM14.041 3.66702C14.041 3.32769 14.0379 3.24861 14.0274 3.19534C13.9715 2.91452 13.7525 2.69474 13.4717 2.6387C13.4185 2.62812 13.3395 2.62503 13 2.62503H3.00003C2.66062 2.62503 2.58156 2.62814 2.52835 2.6387C2.24737 2.69459 2.0276 2.91436 1.97171 3.19534C1.96115 3.24855 1.95804 3.32761 1.95804 3.66702C1.95804 4.00648 1.96113 4.08551 1.97171 4.1387C2.02776 4.41946 2.24752 4.63851 2.52835 4.69437C2.54804 4.69828 2.5862 4.70359 2.68265 4.70609C2.68757 4.70622 2.69241 4.7078 2.6973 4.70804H13.3018C13.3067 4.7078 13.3115 4.70622 13.3164 4.70609C13.413 4.70359 13.452 4.69828 13.4717 4.69437C13.7523 4.63834 13.9714 4.41925 14.0274 4.1387C14.038 4.08546 14.041 4.00645 14.041 3.66702ZM15.291 3.66702C15.291 3.94665 15.2945 4.17765 15.2539 4.38187C15.116 5.07554 14.6164 5.63287 13.958 5.85452V10.7998C13.958 11.3494 13.9585 11.7993 13.9287 12.1641C13.8983 12.5362 13.8332 12.8748 13.6719 13.1914C13.4202 13.6854 13.0184 14.0872 12.5244 14.3389C12.2078 14.5002 11.8692 14.5653 11.4971 14.5957C11.1323 14.6255 10.6824 14.625 10.1328 14.625H5.86624C5.31662 14.625 4.8668 14.6255 4.50199 14.5957C4.17639 14.5691 3.87675 14.5155 3.59476 14.3946L3.47464 14.3389C2.98073 14.0872 2.57885 13.6854 2.32718 13.1914C2.16596 12.8748 2.10074 12.5361 2.07034 12.1641C2.04057 11.7993 2.04105 11.3494 2.04105 10.7998V5.85355C1.38301 5.63175 0.88406 5.07532 0.746126 4.38187C0.705511 4.17758 0.708038 3.94664 0.70804 3.66702C0.70804 3.38721 0.70547 3.1556 0.746126 2.9512C0.900699 2.17451 1.50752 1.56769 2.28421 1.41312C2.48861 1.37246 2.72022 1.37503 3.00003 1.37503H13C13.2797 1.37503 13.5106 1.37251 13.7149 1.41312C14.4917 1.56763 15.0994 2.17438 15.2539 2.9512C15.2946 3.15554 15.291 3.38718 15.291 3.66702Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/workspace/dashboard-icon.tsx b/packages/propel/src/icons/workspace/dashboard-icon.tsx
index eb3b1f33d..2d3785afd 100644
--- a/packages/propel/src/icons/workspace/dashboard-icon.tsx
+++ b/packages/propel/src/icons/workspace/dashboard-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const DashboardIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M13.3752 2.625H2.62524V7.4668C2.62524 8.03711 2.62497 8.42737 2.64966 8.72949C2.67375 9.02428 2.71803 9.17987 2.77466 9.29102C2.90641 9.54958 3.11671 9.75977 3.37524 9.8916C3.4863 9.94819 3.6422 9.9925 3.93677 10.0166C4.23884 10.0413 4.62934 10.042 5.19946 10.042H10.8C11.3704 10.042 11.7606 10.0413 12.0627 10.0166C12.3575 9.99251 12.5131 9.94823 12.6243 9.8916C12.8829 9.75981 13.0931 9.54963 13.2249 9.29102C13.2815 9.17988 13.3258 9.02426 13.3499 8.72949C13.3745 8.42737 13.3752 8.03711 13.3752 7.4668V2.625ZM10.5598 4.55566C10.8049 4.31293 11.2006 4.3148 11.4436 4.55957C11.6866 4.80474 11.6849 5.20135 11.4397 5.44434L9.6311 7.23633C9.5999 7.26726 9.46941 7.41161 9.29126 7.4873C9.19299 7.52903 9.08863 7.55175 8.98364 7.55566L8.87817 7.55371C8.69021 7.53788 8.52264 7.44647 8.47974 7.42578L7.12622 6.77148L5.4397 8.44434C5.19457 8.68696 4.79881 8.68531 4.55591 8.44043C4.31293 8.19526 4.31465 7.79865 4.55981 7.55566L6.36841 5.76367C6.39962 5.73274 6.53015 5.5884 6.70825 5.5127C6.83939 5.45697 6.9815 5.43463 7.12134 5.44629H7.12231C7.3101 5.46221 7.47687 5.55353 7.51978 5.57422L8.87231 6.22754L10.5598 4.55566ZM14.6252 7.4668C14.6252 8.01642 14.6257 8.46625 14.5959 8.83105C14.5693 9.15661 14.5157 9.45632 14.3948 9.73828L14.3391 9.8584C14.1189 10.2906 13.7836 10.6521 13.3723 10.9043L13.1917 11.0059C12.875 11.1672 12.5364 11.2323 12.1643 11.2627C11.7995 11.2925 11.3497 11.292 10.8 11.292H9.72681L12.3997 13.5195C12.6648 13.7405 12.7007 14.1352 12.4797 14.4004C12.2588 14.6652 11.8649 14.7012 11.5999 14.4805L8.62524 12.001V14C8.62524 14.3451 8.34527 14.6248 8.00024 14.625C7.65507 14.625 7.37524 14.3452 7.37524 14V12L4.39966 14.4805C4.13454 14.701 3.74067 14.6653 3.51978 14.4004C3.2988 14.1352 3.33468 13.7405 3.59985 13.5195L6.27271 11.292H5.19946C4.64993 11.292 4.19996 11.2925 3.83521 11.2627C3.46312 11.2323 3.12451 11.1672 2.80786 11.0059C2.37566 10.7856 2.01416 10.4503 1.76196 10.0391L1.66138 9.8584C1.50002 9.54169 1.43495 9.20321 1.40454 8.83105C1.37474 8.46624 1.37524 8.01645 1.37524 7.4668V2.625H1.33325C0.988074 2.625 0.708252 2.34518 0.708252 2C0.708252 1.65482 0.988074 1.375 1.33325 1.375H14.6663C15.0114 1.375 15.2913 1.65482 15.2913 2C15.2913 2.34518 15.0114 2.625 14.6663 2.625H14.6252V7.4668Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function DashboardIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M13.3752 2.625H2.62524V7.4668C2.62524 8.03711 2.62497 8.42737 2.64966 8.72949C2.67375 9.02428 2.71803 9.17987 2.77466 9.29102C2.90641 9.54958 3.11671 9.75977 3.37524 9.8916C3.4863 9.94819 3.6422 9.9925 3.93677 10.0166C4.23884 10.0413 4.62934 10.042 5.19946 10.042H10.8C11.3704 10.042 11.7606 10.0413 12.0627 10.0166C12.3575 9.99251 12.5131 9.94823 12.6243 9.8916C12.8829 9.75981 13.0931 9.54963 13.2249 9.29102C13.2815 9.17988 13.3258 9.02426 13.3499 8.72949C13.3745 8.42737 13.3752 8.03711 13.3752 7.4668V2.625ZM10.5598 4.55566C10.8049 4.31293 11.2006 4.3148 11.4436 4.55957C11.6866 4.80474 11.6849 5.20135 11.4397 5.44434L9.6311 7.23633C9.5999 7.26726 9.46941 7.41161 9.29126 7.4873C9.19299 7.52903 9.08863 7.55175 8.98364 7.55566L8.87817 7.55371C8.69021 7.53788 8.52264 7.44647 8.47974 7.42578L7.12622 6.77148L5.4397 8.44434C5.19457 8.68696 4.79881 8.68531 4.55591 8.44043C4.31293 8.19526 4.31465 7.79865 4.55981 7.55566L6.36841 5.76367C6.39962 5.73274 6.53015 5.5884 6.70825 5.5127C6.83939 5.45697 6.9815 5.43463 7.12134 5.44629H7.12231C7.3101 5.46221 7.47687 5.55353 7.51978 5.57422L8.87231 6.22754L10.5598 4.55566ZM14.6252 7.4668C14.6252 8.01642 14.6257 8.46625 14.5959 8.83105C14.5693 9.15661 14.5157 9.45632 14.3948 9.73828L14.3391 9.8584C14.1189 10.2906 13.7836 10.6521 13.3723 10.9043L13.1917 11.0059C12.875 11.1672 12.5364 11.2323 12.1643 11.2627C11.7995 11.2925 11.3497 11.292 10.8 11.292H9.72681L12.3997 13.5195C12.6648 13.7405 12.7007 14.1352 12.4797 14.4004C12.2588 14.6652 11.8649 14.7012 11.5999 14.4805L8.62524 12.001V14C8.62524 14.3451 8.34527 14.6248 8.00024 14.625C7.65507 14.625 7.37524 14.3452 7.37524 14V12L4.39966 14.4805C4.13454 14.701 3.74067 14.6653 3.51978 14.4004C3.2988 14.1352 3.33468 13.7405 3.59985 13.5195L6.27271 11.292H5.19946C4.64993 11.292 4.19996 11.2925 3.83521 11.2627C3.46312 11.2323 3.12451 11.1672 2.80786 11.0059C2.37566 10.7856 2.01416 10.4503 1.76196 10.0391L1.66138 9.8584C1.50002 9.54169 1.43495 9.20321 1.40454 8.83105C1.37474 8.46624 1.37524 8.01645 1.37524 7.4668V2.625H1.33325C0.988074 2.625 0.708252 2.34518 0.708252 2C0.708252 1.65482 0.988074 1.375 1.33325 1.375H14.6663C15.0114 1.375 15.2913 1.65482 15.2913 2C15.2913 2.34518 15.0114 2.625 14.6663 2.625H14.6252V7.4668Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/workspace/draft-icon.tsx b/packages/propel/src/icons/workspace/draft-icon.tsx
index 16860e518..8ec7f498f 100644
--- a/packages/propel/src/icons/workspace/draft-icon.tsx
+++ b/packages/propel/src/icons/workspace/draft-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const DraftIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M10.5577 2.26554C11.3042 1.51896 12.4862 1.47177 13.2872 2.12491L13.4425 2.26554L13.5821 2.41983C14.2354 3.22077 14.189 4.40271 13.4425 5.14933L5.06648 13.5243C4.85708 13.7337 4.68297 13.9138 4.47077 14.0439C4.29575 14.151 4.10496 14.2303 3.90534 14.2782C3.66318 14.3364 3.41264 14.3319 3.11628 14.3319H2.00007C1.65489 14.3319 1.37507 14.0521 1.37507 13.7069V12.5907C1.37507 12.2946 1.37079 12.0446 1.42878 11.8026C1.47675 11.6028 1.55593 11.4113 1.66316 11.2362H1.66413C1.79415 11.0241 1.97323 10.85 2.18269 10.6405L10.5577 2.26554ZM13.5391 11.9521C13.772 11.6975 14.1672 11.6793 14.4219 11.912C14.6767 12.1449 14.6939 12.541 14.461 12.7958L13.795 13.5243V13.5253C13.3294 14.0345 12.6848 14.3319 12.0001 14.3319C11.401 14.3319 10.8332 14.104 10.3887 13.706L10.2061 13.5253C9.96412 13.2617 9.64853 13.1259 9.33308 13.1259C9.01784 13.126 8.703 13.2618 8.46101 13.5253C8.22763 13.7796 7.83155 13.7968 7.57722 13.5634C7.32321 13.3301 7.30605 12.9348 7.53913 12.6806C8.00515 12.1727 8.64906 11.876 9.33308 11.8759C10.0172 11.8759 10.6619 12.1725 11.128 12.6806V12.6816C11.3696 12.9458 11.6848 13.0819 12.0001 13.0819C12.3153 13.0819 12.6305 12.9458 12.8721 12.6816L13.5391 11.9521ZM2.62507 13.0819H3.11628C3.47218 13.0819 3.54863 13.078 3.61335 13.0624C3.68545 13.0451 3.75417 13.0162 3.81745 12.9775C3.87425 12.9426 3.93123 12.892 4.18269 12.6405L12.5577 4.26554C12.8659 3.95734 12.8659 3.45754 12.5577 3.14933V3.14835C12.2494 2.84073 11.7504 2.84139 11.4425 3.14933L3.06648 11.5243C2.81511 11.7757 2.76438 11.8328 2.72956 11.8896C2.69077 11.9529 2.66192 12.0217 2.6446 12.0937C2.62904 12.1585 2.62507 12.2349 2.62507 12.5907V13.0819Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function DraftIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M10.5577 2.26554C11.3042 1.51896 12.4862 1.47177 13.2872 2.12491L13.4425 2.26554L13.5821 2.41983C14.2354 3.22077 14.189 4.40271 13.4425 5.14933L5.06648 13.5243C4.85708 13.7337 4.68297 13.9138 4.47077 14.0439C4.29575 14.151 4.10496 14.2303 3.90534 14.2782C3.66318 14.3364 3.41264 14.3319 3.11628 14.3319H2.00007C1.65489 14.3319 1.37507 14.0521 1.37507 13.7069V12.5907C1.37507 12.2946 1.37079 12.0446 1.42878 11.8026C1.47675 11.6028 1.55593 11.4113 1.66316 11.2362H1.66413C1.79415 11.0241 1.97323 10.85 2.18269 10.6405L10.5577 2.26554ZM13.5391 11.9521C13.772 11.6975 14.1672 11.6793 14.4219 11.912C14.6767 12.1449 14.6939 12.541 14.461 12.7958L13.795 13.5243V13.5253C13.3294 14.0345 12.6848 14.3319 12.0001 14.3319C11.401 14.3319 10.8332 14.104 10.3887 13.706L10.2061 13.5253C9.96412 13.2617 9.64853 13.1259 9.33308 13.1259C9.01784 13.126 8.703 13.2618 8.46101 13.5253C8.22763 13.7796 7.83155 13.7968 7.57722 13.5634C7.32321 13.3301 7.30605 12.9348 7.53913 12.6806C8.00515 12.1727 8.64906 11.876 9.33308 11.8759C10.0172 11.8759 10.6619 12.1725 11.128 12.6806V12.6816C11.3696 12.9458 11.6848 13.0819 12.0001 13.0819C12.3153 13.0819 12.6305 12.9458 12.8721 12.6816L13.5391 11.9521ZM2.62507 13.0819H3.11628C3.47218 13.0819 3.54863 13.078 3.61335 13.0624C3.68545 13.0451 3.75417 13.0162 3.81745 12.9775C3.87425 12.9426 3.93123 12.892 4.18269 12.6405L12.5577 4.26554C12.8659 3.95734 12.8659 3.45754 12.5577 3.14933V3.14835C12.2494 2.84073 11.7504 2.84139 11.4425 3.14933L3.06648 11.5243C2.81511 11.7757 2.76438 11.8328 2.72956 11.8896C2.69077 11.9529 2.66192 12.0217 2.6446 12.0937C2.62904 12.1585 2.62507 12.2349 2.62507 12.5907V13.0819Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/workspace/home-icon.tsx b/packages/propel/src/icons/workspace/home-icon.tsx
index d32facfa0..ba3034fb5 100644
--- a/packages/propel/src/icons/workspace/home-icon.tsx
+++ b/packages/propel/src/icons/workspace/home-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const HomeIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M9.36825 8.5908C9.3668 8.57319 9.36465 8.5605 9.36337 8.55174C9.36224 8.55047 9.36073 8.54993 9.35946 8.54881C9.35064 8.54753 9.33797 8.54536 9.3204 8.54393C9.24062 8.53741 9.13053 8.53709 8.93368 8.53709H7.06649C6.86964 8.53709 6.75955 8.53741 6.67977 8.54393C6.66156 8.54542 6.64858 8.54751 6.63974 8.54881C6.63851 8.54993 6.63691 8.55048 6.63583 8.55174C6.63456 8.5605 6.63336 8.57328 6.63192 8.5908C6.6254 8.67062 6.62509 8.78148 6.62509 8.9785V13.2871H9.37509V8.9785C9.37509 8.78148 9.37477 8.67061 9.36825 8.5908ZM10.6251 13.2871H11.8663C12.2499 13.2871 12.5005 13.2861 12.6915 13.2705C12.8752 13.2555 12.9486 13.2292 12.9884 13.209L13.0831 13.1513C13.173 13.086 13.247 13.0003 13.2979 12.9004C13.3182 12.8605 13.3444 12.7869 13.3595 12.6035C13.3751 12.4125 13.3751 12.162 13.3751 11.7783V6.95506C13.3751 6.53721 13.3695 6.44728 13.3487 6.37303C13.3255 6.29014 13.2876 6.21187 13.2364 6.14256C13.1906 6.08059 13.123 6.02126 12.7931 5.76463L8.27157 2.24803C8.14754 2.15155 8.08003 2.09893 8.02841 2.06444C8.01732 2.05703 8.00875 2.05221 8.00302 2.04881C8.00102 2.04867 7.99915 2.04867 7.99716 2.04881C7.99143 2.05221 7.98285 2.05703 7.97177 2.06444C7.92015 2.09893 7.85263 2.15155 7.7286 2.24803L3.20712 5.76463C2.8772 6.02125 2.80961 6.08057 2.76376 6.14256C2.71257 6.2118 2.67466 6.29012 2.65145 6.37303C2.63071 6.44726 2.62509 6.53709 2.62509 6.95506V11.7783C2.62509 12.162 2.62511 12.4125 2.64071 12.6035C2.65567 12.7862 2.68197 12.8595 2.70224 12.8994C2.77013 13.0326 2.87866 13.1411 3.01181 13.209L3.10653 13.2422C3.15275 13.253 3.21704 13.263 3.30868 13.2705C3.49965 13.2861 3.75025 13.2871 4.13388 13.2871H5.37509V8.9785C5.37509 8.80211 5.37418 8.63176 5.38583 8.48924C5.39807 8.33956 5.42717 8.16607 5.51571 7.99217L5.56552 7.9033C5.68964 7.70078 5.8676 7.53611 6.08016 7.42772L6.21005 7.37108C6.33947 7.32494 6.46577 7.30702 6.57821 7.29783C6.72062 7.28621 6.8903 7.28709 7.06649 7.28709H8.93368C9.10988 7.28709 9.27956 7.28621 9.42196 7.29783C9.5344 7.30702 9.66071 7.32494 9.79013 7.37108L9.92001 7.42772L10.0089 7.47752C10.2111 7.60162 10.3761 7.77956 10.4845 7.99217C10.573 8.16607 10.6021 8.33956 10.6143 8.48924C10.626 8.63176 10.6251 8.80211 10.6251 8.9785V13.2871ZM14.6251 11.7783C14.6251 12.1413 14.6253 12.4514 14.6046 12.7051C14.5832 12.966 14.5362 13.2224 14.4112 13.4678C14.2235 13.836 13.9241 14.1356 13.5558 14.3232C13.3104 14.4482 13.054 14.4953 12.7931 14.5166C12.5394 14.5373 12.2292 14.5371 11.8663 14.5371H4.13388C3.77098 14.5371 3.46075 14.5373 3.20712 14.5166C2.94616 14.4953 2.6898 14.4482 2.44442 14.3232C2.07603 14.1356 1.7767 13.836 1.58895 13.4678C1.46397 13.2224 1.41693 12.966 1.39559 12.7051C1.37487 12.4514 1.37509 12.1413 1.37509 11.7783V6.95506C1.37509 6.60766 1.36953 6.31438 1.44735 6.03611C1.51154 5.80678 1.61729 5.59086 1.75888 5.3994C1.93074 5.16703 2.16527 4.99065 2.43954 4.77733L6.96102 1.26072C7.14957 1.11407 7.38218 0.918674 7.6622 0.842755C7.88326 0.782884 8.11691 0.782884 8.33798 0.842755C8.618 0.918674 8.8506 1.11407 9.03915 1.26072L13.5606 4.77733C13.8349 4.99063 14.0694 5.16701 14.2413 5.3994L14.3409 5.54686C14.4333 5.69906 14.5046 5.86401 14.5528 6.03611C14.6306 6.31436 14.6251 6.60762 14.6251 6.95506V11.7783Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function HomeIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M9.36825 8.5908C9.3668 8.57319 9.36465 8.5605 9.36337 8.55174C9.36224 8.55047 9.36073 8.54993 9.35946 8.54881C9.35064 8.54753 9.33797 8.54536 9.3204 8.54393C9.24062 8.53741 9.13053 8.53709 8.93368 8.53709H7.06649C6.86964 8.53709 6.75955 8.53741 6.67977 8.54393C6.66156 8.54542 6.64858 8.54751 6.63974 8.54881C6.63851 8.54993 6.63691 8.55048 6.63583 8.55174C6.63456 8.5605 6.63336 8.57328 6.63192 8.5908C6.6254 8.67062 6.62509 8.78148 6.62509 8.9785V13.2871H9.37509V8.9785C9.37509 8.78148 9.37477 8.67061 9.36825 8.5908ZM10.6251 13.2871H11.8663C12.2499 13.2871 12.5005 13.2861 12.6915 13.2705C12.8752 13.2555 12.9486 13.2292 12.9884 13.209L13.0831 13.1513C13.173 13.086 13.247 13.0003 13.2979 12.9004C13.3182 12.8605 13.3444 12.7869 13.3595 12.6035C13.3751 12.4125 13.3751 12.162 13.3751 11.7783V6.95506C13.3751 6.53721 13.3695 6.44728 13.3487 6.37303C13.3255 6.29014 13.2876 6.21187 13.2364 6.14256C13.1906 6.08059 13.123 6.02126 12.7931 5.76463L8.27157 2.24803C8.14754 2.15155 8.08003 2.09893 8.02841 2.06444C8.01732 2.05703 8.00875 2.05221 8.00302 2.04881C8.00102 2.04867 7.99915 2.04867 7.99716 2.04881C7.99143 2.05221 7.98285 2.05703 7.97177 2.06444C7.92015 2.09893 7.85263 2.15155 7.7286 2.24803L3.20712 5.76463C2.8772 6.02125 2.80961 6.08057 2.76376 6.14256C2.71257 6.2118 2.67466 6.29012 2.65145 6.37303C2.63071 6.44726 2.62509 6.53709 2.62509 6.95506V11.7783C2.62509 12.162 2.62511 12.4125 2.64071 12.6035C2.65567 12.7862 2.68197 12.8595 2.70224 12.8994C2.77013 13.0326 2.87866 13.1411 3.01181 13.209L3.10653 13.2422C3.15275 13.253 3.21704 13.263 3.30868 13.2705C3.49965 13.2861 3.75025 13.2871 4.13388 13.2871H5.37509V8.9785C5.37509 8.80211 5.37418 8.63176 5.38583 8.48924C5.39807 8.33956 5.42717 8.16607 5.51571 7.99217L5.56552 7.9033C5.68964 7.70078 5.8676 7.53611 6.08016 7.42772L6.21005 7.37108C6.33947 7.32494 6.46577 7.30702 6.57821 7.29783C6.72062 7.28621 6.8903 7.28709 7.06649 7.28709H8.93368C9.10988 7.28709 9.27956 7.28621 9.42196 7.29783C9.5344 7.30702 9.66071 7.32494 9.79013 7.37108L9.92001 7.42772L10.0089 7.47752C10.2111 7.60162 10.3761 7.77956 10.4845 7.99217C10.573 8.16607 10.6021 8.33956 10.6143 8.48924C10.626 8.63176 10.6251 8.80211 10.6251 8.9785V13.2871ZM14.6251 11.7783C14.6251 12.1413 14.6253 12.4514 14.6046 12.7051C14.5832 12.966 14.5362 13.2224 14.4112 13.4678C14.2235 13.836 13.9241 14.1356 13.5558 14.3232C13.3104 14.4482 13.054 14.4953 12.7931 14.5166C12.5394 14.5373 12.2292 14.5371 11.8663 14.5371H4.13388C3.77098 14.5371 3.46075 14.5373 3.20712 14.5166C2.94616 14.4953 2.6898 14.4482 2.44442 14.3232C2.07603 14.1356 1.7767 13.836 1.58895 13.4678C1.46397 13.2224 1.41693 12.966 1.39559 12.7051C1.37487 12.4514 1.37509 12.1413 1.37509 11.7783V6.95506C1.37509 6.60766 1.36953 6.31438 1.44735 6.03611C1.51154 5.80678 1.61729 5.59086 1.75888 5.3994C1.93074 5.16703 2.16527 4.99065 2.43954 4.77733L6.96102 1.26072C7.14957 1.11407 7.38218 0.918674 7.6622 0.842755C7.88326 0.782884 8.11691 0.782884 8.33798 0.842755C8.618 0.918674 8.8506 1.11407 9.03915 1.26072L13.5606 4.77733C13.8349 4.99063 14.0694 5.16701 14.2413 5.3994L14.3409 5.54686C14.4333 5.69906 14.5046 5.86401 14.5528 6.03611C14.6306 6.31436 14.6251 6.60762 14.6251 6.95506V11.7783Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/workspace/inbox-icon.tsx b/packages/propel/src/icons/workspace/inbox-icon.tsx
index 296195902..243c61012 100644
--- a/packages/propel/src/icons/workspace/inbox-icon.tsx
+++ b/packages/propel/src/icons/workspace/inbox-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const InboxIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M14.0401 8.62507H12.0781C11.8582 8.62516 11.657 8.74968 11.5586 8.94636C11.2485 9.56676 10.6144 9.95906 9.92091 9.95906H6.07814C5.38471 9.95897 4.75057 9.56666 4.44044 8.94636C4.34199 8.74967 4.1409 8.62507 3.92091 8.62507H1.959C1.95888 8.66367 1.95802 8.70708 1.95802 8.75593V10.1339C1.95802 10.7042 1.95872 11.0944 1.98341 11.3966C2.00749 11.6912 2.05084 11.847 2.10743 11.9581C2.23925 12.2168 2.45027 12.4269 2.709 12.5587C2.8201 12.6153 2.97574 12.6596 3.27052 12.6837C3.57264 12.7083 3.96298 12.7091 4.53321 12.7091H11.4668C12.0369 12.7091 12.4274 12.7083 12.7295 12.6837C13.0241 12.6596 13.1799 12.6153 13.291 12.5587C13.5496 12.4268 13.7599 12.2167 13.8916 11.9581C13.9482 11.8469 13.9925 11.6913 14.0166 11.3966C14.0413 11.0944 14.041 10.7042 14.041 10.1339V8.75593C14.041 8.70708 14.0402 8.66367 14.0401 8.62507ZM5.97755 3.29207C5.21433 3.29207 4.98135 3.30027 4.78712 3.36726C4.59456 3.43373 4.41898 3.5421 4.27345 3.68464C4.12668 3.82841 4.01513 4.03332 3.67384 4.71589L2.34474 7.37507H3.92091C4.61442 7.37507 5.24844 7.7674 5.5586 8.38777C5.657 8.58446 5.85819 8.70897 6.07814 8.70906H9.92091C10.1409 8.70906 10.342 8.58445 10.4404 8.38777C10.7506 7.76744 11.3847 7.37516 12.0781 7.37507H13.6543L12.3252 4.71589C11.9839 4.03325 11.8724 3.82842 11.7256 3.68464C11.58 3.5421 11.4046 3.4337 11.2119 3.36726C11.0177 3.30027 10.7847 3.29207 10.0215 3.29207H5.97755ZM15.291 10.1339C15.291 10.6835 15.2915 11.1333 15.2617 11.4981C15.2351 11.8236 15.1824 12.1234 15.0615 12.4053L15.0049 12.5255C14.7533 13.0193 14.3522 13.4213 13.8584 13.6729C13.5417 13.8343 13.2032 13.8993 12.8311 13.9298C12.4663 13.9596 12.0164 13.9591 11.4668 13.9591H4.53321C3.98371 13.9591 3.53374 13.9595 3.16896 13.9298C2.79695 13.8994 2.45821 13.8342 2.14161 13.6729C1.70944 13.4527 1.34794 13.1173 1.09571 12.7061L0.994152 12.5255C0.832797 12.2088 0.767723 11.8703 0.737316 11.4981C0.707517 11.1333 0.708019 10.6835 0.708019 10.1339V8.75593C0.708019 8.49089 0.706677 8.29939 0.73341 8.10847C0.755917 7.94781 0.793061 7.78957 0.844738 7.63582L0.896496 7.4991C0.952354 7.36314 1.02352 7.2226 1.11232 7.045L2.55665 4.15632C2.85737 3.55488 3.06727 3.11738 3.39943 2.79207C3.67739 2.51984 4.01208 2.31249 4.37989 2.18562C4.81947 2.03402 5.30497 2.04207 5.97755 2.04207H10.0215C10.694 2.04207 11.1796 2.03412 11.6192 2.18562C11.987 2.31249 12.3226 2.51981 12.6006 2.79207C12.9326 3.11739 13.1426 3.5549 13.4434 4.15632L14.8877 7.045C15.0062 7.28198 15.0928 7.4524 15.1543 7.63484V7.63582C15.206 7.78963 15.2432 7.94783 15.2656 8.10847C15.2924 8.29945 15.291 8.49091 15.291 8.75593V10.1339Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function InboxIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M14.0401 8.62507H12.0781C11.8582 8.62516 11.657 8.74968 11.5586 8.94636C11.2485 9.56676 10.6144 9.95906 9.92091 9.95906H6.07814C5.38471 9.95897 4.75057 9.56666 4.44044 8.94636C4.34199 8.74967 4.1409 8.62507 3.92091 8.62507H1.959C1.95888 8.66367 1.95802 8.70708 1.95802 8.75593V10.1339C1.95802 10.7042 1.95872 11.0944 1.98341 11.3966C2.00749 11.6912 2.05084 11.847 2.10743 11.9581C2.23925 12.2168 2.45027 12.4269 2.709 12.5587C2.8201 12.6153 2.97574 12.6596 3.27052 12.6837C3.57264 12.7083 3.96298 12.7091 4.53321 12.7091H11.4668C12.0369 12.7091 12.4274 12.7083 12.7295 12.6837C13.0241 12.6596 13.1799 12.6153 13.291 12.5587C13.5496 12.4268 13.7599 12.2167 13.8916 11.9581C13.9482 11.8469 13.9925 11.6913 14.0166 11.3966C14.0413 11.0944 14.041 10.7042 14.041 10.1339V8.75593C14.041 8.70708 14.0402 8.66367 14.0401 8.62507ZM5.97755 3.29207C5.21433 3.29207 4.98135 3.30027 4.78712 3.36726C4.59456 3.43373 4.41898 3.5421 4.27345 3.68464C4.12668 3.82841 4.01513 4.03332 3.67384 4.71589L2.34474 7.37507H3.92091C4.61442 7.37507 5.24844 7.7674 5.5586 8.38777C5.657 8.58446 5.85819 8.70897 6.07814 8.70906H9.92091C10.1409 8.70906 10.342 8.58445 10.4404 8.38777C10.7506 7.76744 11.3847 7.37516 12.0781 7.37507H13.6543L12.3252 4.71589C11.9839 4.03325 11.8724 3.82842 11.7256 3.68464C11.58 3.5421 11.4046 3.4337 11.2119 3.36726C11.0177 3.30027 10.7847 3.29207 10.0215 3.29207H5.97755ZM15.291 10.1339C15.291 10.6835 15.2915 11.1333 15.2617 11.4981C15.2351 11.8236 15.1824 12.1234 15.0615 12.4053L15.0049 12.5255C14.7533 13.0193 14.3522 13.4213 13.8584 13.6729C13.5417 13.8343 13.2032 13.8993 12.8311 13.9298C12.4663 13.9596 12.0164 13.9591 11.4668 13.9591H4.53321C3.98371 13.9591 3.53374 13.9595 3.16896 13.9298C2.79695 13.8994 2.45821 13.8342 2.14161 13.6729C1.70944 13.4527 1.34794 13.1173 1.09571 12.7061L0.994152 12.5255C0.832797 12.2088 0.767723 11.8703 0.737316 11.4981C0.707517 11.1333 0.708019 10.6835 0.708019 10.1339V8.75593C0.708019 8.49089 0.706677 8.29939 0.73341 8.10847C0.755917 7.94781 0.793061 7.78957 0.844738 7.63582L0.896496 7.4991C0.952354 7.36314 1.02352 7.2226 1.11232 7.045L2.55665 4.15632C2.85737 3.55488 3.06727 3.11738 3.39943 2.79207C3.67739 2.51984 4.01208 2.31249 4.37989 2.18562C4.81947 2.03402 5.30497 2.04207 5.97755 2.04207H10.0215C10.694 2.04207 11.1796 2.03412 11.6192 2.18562C11.987 2.31249 12.3226 2.51981 12.6006 2.79207C12.9326 3.11739 13.1426 3.5549 13.4434 4.15632L14.8877 7.045C15.0062 7.28198 15.0928 7.4524 15.1543 7.63484V7.63582C15.206 7.78963 15.2432 7.94783 15.2656 8.10847C15.2924 8.29945 15.291 8.49091 15.291 8.75593V10.1339Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/workspace/project-icon.tsx b/packages/propel/src/icons/workspace/project-icon.tsx
index 0a01dff26..99fe2bb5c 100644
--- a/packages/propel/src/icons/workspace/project-icon.tsx
+++ b/packages/propel/src/icons/workspace/project-icon.tsx
@@ -3,11 +3,13 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const ProjectIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M14.041 9.77251C13.6575 9.86273 13.1544 9.9762 12.5771 10.0879C11.271 10.3407 9.55874 10.5996 8 10.5997C6.44125 10.5997 4.7291 10.3408 3.42285 10.0879C2.84526 9.97614 2.34163 9.86276 1.95801 9.77251V11.8409C1.95801 12.2244 1.95804 12.4751 1.97363 12.6661C1.98864 12.8498 2.01488 12.9231 2.03516 12.9629C2.10308 13.0962 2.21151 13.2046 2.34473 13.2725L2.43945 13.3047C2.48568 13.3156 2.54989 13.3265 2.6416 13.334C2.83257 13.3496 3.0832 13.3497 3.4668 13.3497H12.5332C12.9165 13.3497 13.1665 13.3496 13.3574 13.334C13.5407 13.319 13.6144 13.2928 13.6543 13.2725C13.7875 13.2046 13.896 13.0961 13.9639 12.9629L13.9971 12.8682C14.0079 12.822 14.0179 12.7577 14.0254 12.6661C14.041 12.4751 14.041 12.2245 14.041 11.8409V9.77251ZM3.4668 5.26665C3.08319 5.26665 2.83257 5.26668 2.6416 5.28227C2.45792 5.29728 2.38454 5.32351 2.34473 5.34379C2.22354 5.40557 2.12394 5.50122 2.05566 5.61821C2.05373 5.62932 2.0514 5.64383 2.04883 5.66215C2.03783 5.74053 2.02735 5.85115 2.01758 5.99126C1.99814 6.26994 1.98459 6.63077 1.97559 7.01372C1.96343 7.53069 1.96026 8.07474 1.95898 8.48833C2.00287 8.49907 2.0493 8.51164 2.09863 8.52348C2.48215 8.61553 3.02514 8.73847 3.66016 8.86137C4.9372 9.10854 6.55887 9.34965 8 9.34965C9.44093 9.34962 11.062 9.1085 12.3389 8.86137C12.9737 8.7385 13.5169 8.61552 13.9004 8.52348C13.9493 8.51175 13.9955 8.49898 14.0391 8.48833C14.0378 8.07474 14.0356 7.53069 14.0234 7.01372C14.0144 6.63077 14.0009 6.26994 13.9814 5.99126C13.9717 5.85117 13.9612 5.74052 13.9502 5.66215C13.9475 5.6432 13.9444 5.62848 13.9424 5.61723C13.8741 5.50082 13.7751 5.40536 13.6543 5.34379C13.6145 5.32353 13.5409 5.29727 13.3574 5.28227C13.1665 5.26671 12.9165 5.26665 12.5332 5.26665H3.4668ZM7.375 7.73442V7.72465C7.375 7.37948 7.65482 7.09965 8 7.09965C8.34503 7.09983 8.625 7.37958 8.625 7.72465V7.73442C8.625 8.07949 8.34503 8.35924 8 8.35942C7.65482 8.35942 7.375 8.0796 7.375 7.73442ZM8 2.59965C7.34034 2.59965 7.13232 2.60514 6.97754 2.64653C6.50307 2.77367 6.13203 3.14468 6.00488 3.61919C5.981 3.70849 5.97063 3.81544 5.96484 4.01665H10.0342C10.0284 3.8154 10.018 3.70851 9.99414 3.61919C9.86702 3.14477 9.49683 2.77373 9.02246 2.64653C8.86766 2.60505 8.65998 2.59966 8 2.59965ZM15.291 11.8409C15.291 12.2037 15.2922 12.514 15.2715 12.7676C15.2502 13.0285 15.2031 13.285 15.0781 13.5303C14.8904 13.8988 14.5902 14.1981 14.2217 14.3858C13.9764 14.5107 13.7208 14.5578 13.46 14.5791C13.2063 14.5999 12.8962 14.5997 12.5332 14.5997H3.4668C3.10389 14.5997 2.79368 14.5998 2.54004 14.5791C2.27905 14.5578 2.02275 14.5108 1.77734 14.3858C1.4089 14.1981 1.10958 13.8987 0.921875 13.5303C0.796827 13.2849 0.749839 13.0286 0.728516 12.7676C0.707814 12.514 0.708008 12.2038 0.708008 11.8409V8.97465C0.708008 8.60181 0.708206 7.76501 0.726563 6.98442C0.735721 6.59503 0.749071 6.21171 0.770508 5.90434C0.781165 5.75155 0.794714 5.60812 0.811524 5.48833C0.82359 5.40234 0.849238 5.22862 0.921875 5.08598L0.99707 4.95122C1.18524 4.64429 1.45479 4.39388 1.77734 4.22954C2.0227 4.10455 2.27911 4.0575 2.54004 4.03618C2.79366 4.01548 3.10391 4.01665 3.4668 4.01665H4.71387C4.72148 3.7397 4.74113 3.50667 4.79785 3.29497C5.04064 2.3894 5.74777 1.68228 6.65332 1.4395C7.00717 1.34469 7.42024 1.34965 8 1.34965C8.57959 1.34965 8.99192 1.34471 9.3457 1.4395C10.2514 1.68221 10.9594 2.3892 11.2021 3.29497C11.2589 3.50666 11.2775 3.73971 11.2852 4.01665H12.5332C12.8962 4.01665 13.2063 4.01545 13.46 4.03618C13.7207 4.0575 13.9765 4.1047 14.2217 4.22954C14.5901 4.41727 14.8904 4.71742 15.0781 5.08598C15.1506 5.22855 15.1754 5.40238 15.1875 5.48833C15.2043 5.60812 15.2179 5.75156 15.2285 5.90434C15.25 6.21171 15.2643 6.59503 15.2734 6.98442C15.2918 7.76501 15.291 8.60181 15.291 8.97465V11.8409Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function ProjectIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M14.041 9.77251C13.6575 9.86273 13.1544 9.9762 12.5771 10.0879C11.271 10.3407 9.55874 10.5996 8 10.5997C6.44125 10.5997 4.7291 10.3408 3.42285 10.0879C2.84526 9.97614 2.34163 9.86276 1.95801 9.77251V11.8409C1.95801 12.2244 1.95804 12.4751 1.97363 12.6661C1.98864 12.8498 2.01488 12.9231 2.03516 12.9629C2.10308 13.0962 2.21151 13.2046 2.34473 13.2725L2.43945 13.3047C2.48568 13.3156 2.54989 13.3265 2.6416 13.334C2.83257 13.3496 3.0832 13.3497 3.4668 13.3497H12.5332C12.9165 13.3497 13.1665 13.3496 13.3574 13.334C13.5407 13.319 13.6144 13.2928 13.6543 13.2725C13.7875 13.2046 13.896 13.0961 13.9639 12.9629L13.9971 12.8682C14.0079 12.822 14.0179 12.7577 14.0254 12.6661C14.041 12.4751 14.041 12.2245 14.041 11.8409V9.77251ZM3.4668 5.26665C3.08319 5.26665 2.83257 5.26668 2.6416 5.28227C2.45792 5.29728 2.38454 5.32351 2.34473 5.34379C2.22354 5.40557 2.12394 5.50122 2.05566 5.61821C2.05373 5.62932 2.0514 5.64383 2.04883 5.66215C2.03783 5.74053 2.02735 5.85115 2.01758 5.99126C1.99814 6.26994 1.98459 6.63077 1.97559 7.01372C1.96343 7.53069 1.96026 8.07474 1.95898 8.48833C2.00287 8.49907 2.0493 8.51164 2.09863 8.52348C2.48215 8.61553 3.02514 8.73847 3.66016 8.86137C4.9372 9.10854 6.55887 9.34965 8 9.34965C9.44093 9.34962 11.062 9.1085 12.3389 8.86137C12.9737 8.7385 13.5169 8.61552 13.9004 8.52348C13.9493 8.51175 13.9955 8.49898 14.0391 8.48833C14.0378 8.07474 14.0356 7.53069 14.0234 7.01372C14.0144 6.63077 14.0009 6.26994 13.9814 5.99126C13.9717 5.85117 13.9612 5.74052 13.9502 5.66215C13.9475 5.6432 13.9444 5.62848 13.9424 5.61723C13.8741 5.50082 13.7751 5.40536 13.6543 5.34379C13.6145 5.32353 13.5409 5.29727 13.3574 5.28227C13.1665 5.26671 12.9165 5.26665 12.5332 5.26665H3.4668ZM7.375 7.73442V7.72465C7.375 7.37948 7.65482 7.09965 8 7.09965C8.34503 7.09983 8.625 7.37958 8.625 7.72465V7.73442C8.625 8.07949 8.34503 8.35924 8 8.35942C7.65482 8.35942 7.375 8.0796 7.375 7.73442ZM8 2.59965C7.34034 2.59965 7.13232 2.60514 6.97754 2.64653C6.50307 2.77367 6.13203 3.14468 6.00488 3.61919C5.981 3.70849 5.97063 3.81544 5.96484 4.01665H10.0342C10.0284 3.8154 10.018 3.70851 9.99414 3.61919C9.86702 3.14477 9.49683 2.77373 9.02246 2.64653C8.86766 2.60505 8.65998 2.59966 8 2.59965ZM15.291 11.8409C15.291 12.2037 15.2922 12.514 15.2715 12.7676C15.2502 13.0285 15.2031 13.285 15.0781 13.5303C14.8904 13.8988 14.5902 14.1981 14.2217 14.3858C13.9764 14.5107 13.7208 14.5578 13.46 14.5791C13.2063 14.5999 12.8962 14.5997 12.5332 14.5997H3.4668C3.10389 14.5997 2.79368 14.5998 2.54004 14.5791C2.27905 14.5578 2.02275 14.5108 1.77734 14.3858C1.4089 14.1981 1.10958 13.8987 0.921875 13.5303C0.796827 13.2849 0.749839 13.0286 0.728516 12.7676C0.707814 12.514 0.708008 12.2038 0.708008 11.8409V8.97465C0.708008 8.60181 0.708206 7.76501 0.726563 6.98442C0.735721 6.59503 0.749071 6.21171 0.770508 5.90434C0.781165 5.75155 0.794714 5.60812 0.811524 5.48833C0.82359 5.40234 0.849238 5.22862 0.921875 5.08598L0.99707 4.95122C1.18524 4.64429 1.45479 4.39388 1.77734 4.22954C2.0227 4.10455 2.27911 4.0575 2.54004 4.03618C2.79366 4.01548 3.10391 4.01665 3.4668 4.01665H4.71387C4.72148 3.7397 4.74113 3.50667 4.79785 3.29497C5.04064 2.3894 5.74777 1.68228 6.65332 1.4395C7.00717 1.34469 7.42024 1.34965 8 1.34965C8.57959 1.34965 8.99192 1.34471 9.3457 1.4395C10.2514 1.68221 10.9594 2.3892 11.2021 3.29497C11.2589 3.50666 11.2775 3.73971 11.2852 4.01665H12.5332C12.8962 4.01665 13.2063 4.01545 13.46 4.03618C13.7207 4.0575 13.9765 4.1047 14.2217 4.22954C14.5901 4.41727 14.8904 4.71742 15.0781 5.08598C15.1506 5.22855 15.1754 5.40238 15.1875 5.48833C15.2043 5.60812 15.2179 5.75156 15.2285 5.90434C15.25 6.21171 15.2643 6.59503 15.2734 6.98442C15.2918 7.76501 15.291 8.60181 15.291 8.97465V11.8409Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/icons/workspace/your-work-icon.tsx b/packages/propel/src/icons/workspace/your-work-icon.tsx
index 577d25596..edd5885f2 100644
--- a/packages/propel/src/icons/workspace/your-work-icon.tsx
+++ b/packages/propel/src/icons/workspace/your-work-icon.tsx
@@ -3,15 +3,17 @@ import * as React from "react";
 import { IconWrapper } from "../icon-wrapper";
 import type { ISvgIcons } from "../type";
 
-export const YourWorkIcon: React.FC<ISvgIcons> = ({ color = "currentColor", ...rest }) => (
-  <IconWrapper color={color} {...rest}>
-    <path
-      d="M0.7083 14C0.7083 13.1154 0.701518 12.5344 0.849901 12.0449C1.16902 10.9929 1.99225 10.1687 3.04424 9.84961C3.53385 9.70109 4.11539 9.70801 5.00029 9.70801H8.00029C8.34521 9.70818 8.62512 9.98809 8.62529 10.333C8.62529 10.6781 8.34532 10.9578 8.00029 10.958H5.00029C4.0248 10.958 3.67493 10.9649 3.40752 11.0459C2.75503 11.2438 2.24415 11.7548 2.04619 12.4072C1.96506 12.6747 1.9583 13.0242 1.9583 14C1.9583 14.3452 1.67848 14.625 1.3333 14.625C0.988122 14.625 0.7083 14.3452 0.7083 14ZM9.04131 5C9.04131 3.68832 7.97798 2.625 6.66631 2.625C5.35478 2.62518 4.29131 3.68843 4.29131 5C4.29131 6.31157 5.35478 7.37482 6.66631 7.375C7.97798 7.375 9.04131 6.31168 9.04131 5ZM10.2913 5C10.2913 7.00203 8.66834 8.625 6.66631 8.625C4.66442 8.62482 3.04131 7.00192 3.04131 5C3.04131 2.99808 4.66442 1.37518 6.66631 1.375C8.66834 1.375 10.2913 2.99797 10.2913 5Z"
-      fill={color}
-    />
-    <path
-      d="M11.6338 9.27539C11.9026 9.27559 12.1415 9.44806 12.2265 9.70312L13.0332 12.124L13.1406 11.8027L13.1797 11.7109C13.2861 11.5072 13.4981 11.375 13.7334 11.375H14.667C15.0119 11.3752 15.2917 11.6551 15.292 12C15.292 12.3451 15.012 12.6248 14.667 12.625H14.1836L13.6259 14.2979C13.5409 14.5531 13.3022 14.7256 13.0332 14.7256C12.7642 14.7255 12.5255 14.553 12.4404 14.2979L11.6328 11.877L11.5263 12.1982C11.4412 12.4533 11.2024 12.6249 10.9336 12.625H9.99997C9.65479 12.625 9.37497 12.3452 9.37497 12C9.37518 11.655 9.65492 11.375 9.99997 11.375H10.4834L11.04 9.70312C11.1251 9.44791 11.3647 9.27539 11.6338 9.27539Z"
-      fill={color}
-    />
-  </IconWrapper>
-);
+export function YourWorkIcon({ color = "currentColor", ...rest }: ISvgIcons) {
+  return (
+    <IconWrapper color={color} {...rest}>
+      <path
+        d="M0.7083 14C0.7083 13.1154 0.701518 12.5344 0.849901 12.0449C1.16902 10.9929 1.99225 10.1687 3.04424 9.84961C3.53385 9.70109 4.11539 9.70801 5.00029 9.70801H8.00029C8.34521 9.70818 8.62512 9.98809 8.62529 10.333C8.62529 10.6781 8.34532 10.9578 8.00029 10.958H5.00029C4.0248 10.958 3.67493 10.9649 3.40752 11.0459C2.75503 11.2438 2.24415 11.7548 2.04619 12.4072C1.96506 12.6747 1.9583 13.0242 1.9583 14C1.9583 14.3452 1.67848 14.625 1.3333 14.625C0.988122 14.625 0.7083 14.3452 0.7083 14ZM9.04131 5C9.04131 3.68832 7.97798 2.625 6.66631 2.625C5.35478 2.62518 4.29131 3.68843 4.29131 5C4.29131 6.31157 5.35478 7.37482 6.66631 7.375C7.97798 7.375 9.04131 6.31168 9.04131 5ZM10.2913 5C10.2913 7.00203 8.66834 8.625 6.66631 8.625C4.66442 8.62482 3.04131 7.00192 3.04131 5C3.04131 2.99808 4.66442 1.37518 6.66631 1.375C8.66834 1.375 10.2913 2.99797 10.2913 5Z"
+        fill={color}
+      />
+      <path
+        d="M11.6338 9.27539C11.9026 9.27559 12.1415 9.44806 12.2265 9.70312L13.0332 12.124L13.1406 11.8027L13.1797 11.7109C13.2861 11.5072 13.4981 11.375 13.7334 11.375H14.667C15.0119 11.3752 15.2917 11.6551 15.292 12C15.292 12.3451 15.012 12.6248 14.667 12.625H14.1836L13.6259 14.2979C13.5409 14.5531 13.3022 14.7256 13.0332 14.7256C12.7642 14.7255 12.5255 14.553 12.4404 14.2979L11.6328 11.877L11.5263 12.1982C11.4412 12.4533 11.2024 12.6249 10.9336 12.625H9.99997C9.65479 12.625 9.37497 12.3452 9.37497 12C9.37518 11.655 9.65492 11.375 9.99997 11.375H10.4834L11.04 9.70312C11.1251 9.44791 11.3647 9.27539 11.6338 9.27539Z"
+        fill={color}
+      />
+    </IconWrapper>
+  );
+}
diff --git a/packages/propel/src/input/input.tsx b/packages/propel/src/input/input.tsx
index 04034b939..5d3b6a544 100644
--- a/packages/propel/src/input/input.tsx
+++ b/packages/propel/src/input/input.tsx
@@ -9,7 +9,7 @@ export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>
   hasError?: boolean;
 }
 
-const Input = React.forwardRef<HTMLInputElement, InputProps>((props, ref) => {
+const Input = React.forwardRef(function Input(props: InputProps, ref: React.ForwardedRef<HTMLInputElement>) {
   const {
     id,
     type,
diff --git a/packages/propel/src/menu/menu.tsx b/packages/propel/src/menu/menu.tsx
index c0cb4e09b..062c6a497 100644
--- a/packages/propel/src/menu/menu.tsx
+++ b/packages/propel/src/menu/menu.tsx
@@ -18,7 +18,7 @@ const SubMenuContext = React.createContext<{ closeSubmenu: () => void } | null>(
 const useSubMenu = () => React.useContext(SubMenuContext);
 
 // SubMenu implementation
-const SubMenu: React.FC<TSubMenuProps> = (props) => {
+function SubMenu(props: TSubMenuProps) {
   const { children, trigger, disabled = false, className = "" } = props;
 
   return (
@@ -34,9 +34,9 @@ const SubMenu: React.FC<TSubMenuProps> = (props) => {
       </BaseMenu.Portal>
     </BaseMenu.SubmenuRoot>
   );
-};
+}
 
-const MenuItem: React.FC<TMenuItemProps> = (props) => {
+function MenuItem(props: TMenuItemProps) {
   const { children, disabled = false, onClick, className } = props;
   const submenuContext = useSubMenu();
 
@@ -59,7 +59,7 @@ const MenuItem: React.FC<TMenuItemProps> = (props) => {
       {children}
     </BaseMenu.Item>
   );
-};
+}
 
 function Menu(props: TMenuProps) {
   const {
diff --git a/packages/propel/src/pill/pill.tsx b/packages/propel/src/pill/pill.tsx
index f9c58bc9f..7a0841cc7 100644
--- a/packages/propel/src/pill/pill.tsx
+++ b/packages/propel/src/pill/pill.tsx
@@ -49,8 +49,11 @@ const pillSizes = {
   [EPillSize.LG]: "px-3 py-1.5 text-base",
 };
 
-const Pill = React.forwardRef<HTMLSpanElement, PillProps>(
-  ({ variant = EPillVariant.DEFAULT, size = EPillSize.MD, className, children, ...props }, ref) => (
+const Pill = React.forwardRef(function Pill(
+  { variant = EPillVariant.DEFAULT, size = EPillSize.MD, className, children, ...props }: PillProps,
+  ref: React.ForwardedRef<HTMLSpanElement>
+) {
+  return (
     <span
       ref={ref}
       className={cn(
@@ -66,8 +69,8 @@ const Pill = React.forwardRef<HTMLSpanElement, PillProps>(
     >
       {children}
     </span>
-  )
-);
+  );
+});
 
 Pill.displayName = "Pill";
 
diff --git a/packages/propel/src/popover/root.tsx b/packages/propel/src/popover/root.tsx
index e5e46fa14..1dc0cffe3 100644
--- a/packages/propel/src/popover/root.tsx
+++ b/packages/propel/src/popover/root.tsx
@@ -13,7 +13,7 @@ export interface PopoverContentProps extends React.ComponentProps<typeof BasePop
 }
 
 // PopoverContent component
-const PopoverContent = React.memo<PopoverContentProps>(function PopoverContent({
+const PopoverContent = React.memo(function PopoverContent({
   children,
   className,
   placement,
@@ -45,19 +45,17 @@ const PopoverContent = React.memo<PopoverContentProps>(function PopoverContent({
 });
 
 // wrapper components
-const PopoverTrigger = React.memo<React.ComponentProps<typeof BasePopover.Trigger>>(function PopoverTrigger(props) {
+const PopoverTrigger = React.memo(function PopoverTrigger(props) {
   return <BasePopover.Trigger data-slot="popover-trigger" {...props} />;
 });
 
-const PopoverPortal = React.memo<React.ComponentProps<typeof BasePopover.Portal>>(function PopoverPortal(props) {
+const PopoverPortal = React.memo(function PopoverPortal(props) {
   return <BasePopover.Portal data-slot="popover-portal" {...props} />;
 });
 
-const PopoverPositioner = React.memo<React.ComponentProps<typeof BasePopover.Positioner>>(
-  function PopoverPositioner(props) {
-    return <BasePopover.Positioner data-slot="popover-positioner" {...props} />;
-  }
-);
+const PopoverPositioner = React.memo(function PopoverPositioner(props) {
+  return <BasePopover.Positioner data-slot="popover-positioner" {...props} />;
+});
 
 // compound components
 const Popover = Object.assign(
diff --git a/packages/propel/src/portal/modal-portal.tsx b/packages/propel/src/portal/modal-portal.tsx
index 0d716159e..6ada05e1f 100644
--- a/packages/propel/src/portal/modal-portal.tsx
+++ b/packages/propel/src/portal/modal-portal.tsx
@@ -26,7 +26,7 @@ import type { ModalPortalProps } from "./types";
  * @param closeOnOverlayClick - Whether clicking overlay closes modal
  * @param closeOnEscape - Whether pressing Escape closes modal
  */
-export const ModalPortal: React.FC<ModalPortalProps> = ({
+export function ModalPortal({
   children,
   isOpen,
   onClose,
@@ -40,7 +40,7 @@ export const ModalPortal: React.FC<ModalPortalProps> = ({
   showOverlay = true,
   closeOnOverlayClick = true,
   closeOnEscape = true,
-}) => {
+}: ModalPortalProps) {
   const contentRef = useRef<HTMLDivElement>(null);
 
   // Memoized overlay click handler
@@ -107,4 +107,4 @@ export const ModalPortal: React.FC<ModalPortalProps> = ({
   );
 
   return <PortalWrapper portalId={portalId}>{content}</PortalWrapper>;
-};
+}
diff --git a/packages/propel/src/portal/portal-wrapper.tsx b/packages/propel/src/portal/portal-wrapper.tsx
index d2a8306d7..7f1c08860 100644
--- a/packages/propel/src/portal/portal-wrapper.tsx
+++ b/packages/propel/src/portal/portal-wrapper.tsx
@@ -14,14 +14,14 @@ import type { PortalWrapperProps } from "./types";
  * @param onMount - Callback fired when portal is mounted
  * @param onUnmount - Callback fired when portal is unmounted
  */
-export const PortalWrapper: React.FC<PortalWrapperProps> = ({
+export function PortalWrapper({
   children,
   portalId = DEFAULT_PORTAL_ID,
   fallbackToDocument = true,
   className,
   onMount,
   onUnmount,
-}) => {
+}: PortalWrapperProps) {
   const [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null);
   const [isMounted, setIsMounted] = useState(false);
 
@@ -73,4 +73,4 @@ export const PortalWrapper: React.FC<PortalWrapperProps> = ({
   }
 
   return null;
-};
+}
diff --git a/packages/propel/src/portal/portal.stories.tsx b/packages/propel/src/portal/portal.stories.tsx
index 3a3dd794d..24526a592 100644
--- a/packages/propel/src/portal/portal.stories.tsx
+++ b/packages/propel/src/portal/portal.stories.tsx
@@ -40,7 +40,7 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 
 // Helper component for interactive stories
-const ModalDemo = ({
+function ModalDemo({
   children,
   buttonText = "Open Modal",
   buttonVariant = "primary",
@@ -48,7 +48,7 @@ const ModalDemo = ({
 }: Omit<Parameters<typeof ModalPortal>[0], "isOpen" | "onClose"> & {
   buttonText?: string;
   buttonVariant?: TButtonVariant;
-}) => {
+}) {
   const [isOpen, setIsOpen] = useState(false);
 
   return (
@@ -61,9 +61,9 @@ const ModalDemo = ({
       </ModalPortal>
     </>
   );
-};
+}
 
-const ModalContent = ({
+function ModalContent({
   title = "Modal Title",
   showCloseButton = true,
   description = "This is a modal portal component with full accessibility support. Try pressing Tab to navigate through elements or Escape to close.",
@@ -73,34 +73,36 @@ const ModalContent = ({
   showCloseButton?: boolean;
   description?: string;
   onClose?: () => void;
-}) => (
-  <div className="flex flex-col h-full bg-white">
-    <div className="flex items-center justify-between p-6 border-b border-gray-200">
-      <div>
-        <h2 className="text-xl font-semibold text-gray-900">{title}</h2>
-        <p className="text-sm text-gray-500 mt-1">Modal demonstration</p>
+}) {
+  return (
+    <div className="flex flex-col h-full bg-white">
+      <div className="flex items-center justify-between p-6 border-b border-gray-200">
+        <div>
+          <h2 className="text-xl font-semibold text-gray-900">{title}</h2>
+          <p className="text-sm text-gray-500 mt-1">Modal demonstration</p>
+        </div>
+        {showCloseButton && onClose && (
+          <Button variant="link-neutral" size="sm" onClick={onClose} aria-label="Close modal">
+            ✕
+          </Button>
+        )}
       </div>
-      {showCloseButton && onClose && (
-        <Button variant="link-neutral" size="sm" onClick={onClose} aria-label="Close modal">
-          ✕
-        </Button>
-      )}
-    </div>
-    <div className="flex-1 p-6 overflow-y-auto">
-      <p className="text-gray-600 mb-6">{description}</p>
+      <div className="flex-1 p-6 overflow-y-auto">
+        <p className="text-gray-600 mb-6">{description}</p>
 
-      <div className="space-y-4">
-        <div className="bg-gray-50 p-4 rounded-lg">
-          <h3 className="font-medium text-gray-900 mb-2">Feature Highlights</h3>
-          <ul className="text-sm text-gray-600 space-y-1">
-            <li>• ESC key closes the modal</li>
-            <li>• Click outside overlay to close</li>
-          </ul>
+        <div className="space-y-4">
+          <div className="bg-gray-50 p-4 rounded-lg">
+            <h3 className="font-medium text-gray-900 mb-2">Feature Highlights</h3>
+            <ul className="text-sm text-gray-600 space-y-1">
+              <li>• ESC key closes the modal</li>
+              <li>• Click outside overlay to close</li>
+            </ul>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-);
+  );
+}
 
 export const Default: Story = {};
 
diff --git a/packages/propel/src/separator/separator.tsx b/packages/propel/src/separator/separator.tsx
index 5e02309dc..08791679e 100644
--- a/packages/propel/src/separator/separator.tsx
+++ b/packages/propel/src/separator/separator.tsx
@@ -10,8 +10,11 @@ interface SeparatorProps extends React.ComponentProps<typeof SeparatorPrimitive>
   orientation?: "horizontal" | "vertical";
 }
 
-const Separator = React.forwardRef<React.ElementRef<typeof SeparatorPrimitive>, SeparatorProps>(
-  ({ orientation = "horizontal", ...props }, ref) => (
+const Separator = React.forwardRef(function Separator(
+  { orientation = "horizontal", ...props }: SeparatorProps,
+  ref: React.ForwardedRef<React.ElementRef<typeof SeparatorPrimitive>>
+) {
+  return (
     <SeparatorPrimitive
       ref={ref}
       orientation={orientation}
@@ -20,8 +23,8 @@ const Separator = React.forwardRef<React.ElementRef<typeof SeparatorPrimitive>,
       {...props}
       className={cn("bg-custom-border-200", "shrink-0", orientation === "horizontal" ? "h-px w-full" : "h-full w-px")}
     />
-  )
-);
+  );
+});
 
 Separator.displayName = "Separator";
 
diff --git a/packages/propel/src/skeleton/root.tsx b/packages/propel/src/skeleton/root.tsx
index dee2c27f0..bc899c24d 100644
--- a/packages/propel/src/skeleton/root.tsx
+++ b/packages/propel/src/skeleton/root.tsx
@@ -8,11 +8,13 @@ type SkeletonProps = {
   ariaLabel?: string;
 };
 
-const SkeletonRoot = ({ children, className = "", ariaLabel = "Loading content" }: SkeletonProps) => (
-  <div data-slot="skeleton" className={cn("animate-pulse", className)} role="status" aria-label={ariaLabel}>
-    {children}
-  </div>
-);
+function SkeletonRoot({ children, className = "", ariaLabel = "Loading content" }: SkeletonProps) {
+  return (
+    <div data-slot="skeleton" className={cn("animate-pulse", className)} role="status" aria-label={ariaLabel}>
+      {children}
+    </div>
+  );
+}
 
 type ItemProps = {
   height?: string;
@@ -20,13 +22,15 @@ type ItemProps = {
   className?: string;
 };
 
-const SkeletonItem: React.FC<ItemProps> = ({ height = "auto", width = "auto", className = "" }) => (
-  <div
-    data-slot="skeleton-item"
-    className={cn("rounded-md bg-custom-background-80", className)}
-    style={{ height, width }}
-  />
-);
+function SkeletonItem({ height = "auto", width = "auto", className = "" }: ItemProps) {
+  return (
+    <div
+      data-slot="skeleton-item"
+      className={cn("rounded-md bg-custom-background-80", className)}
+      style={{ height, width }}
+    />
+  );
+}
 
 const Skeleton = Object.assign(SkeletonRoot, { Item: SkeletonItem });
 
diff --git a/packages/propel/src/spinners/circular-bar-spinner.tsx b/packages/propel/src/spinners/circular-bar-spinner.tsx
index fb773397a..ab6b002ed 100644
--- a/packages/propel/src/spinners/circular-bar-spinner.tsx
+++ b/packages/propel/src/spinners/circular-bar-spinner.tsx
@@ -6,30 +6,28 @@ export interface ICircularBarSpinner extends React.SVGAttributes<SVGElement> {
   className?: string | undefined;
 }
 
-export const CircularBarSpinner: React.FC<ICircularBarSpinner> = ({
-  height = "16px",
-  width = "16px",
-  className = "",
-}) => (
-  <div role="status">
-    <svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24" className={className}>
-      <g>
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.14} />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.29} transform="rotate(30 12 12)" />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.43} transform="rotate(60 12 12)" />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.57} transform="rotate(90 12 12)" />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.71} transform="rotate(120 12 12)" />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.86} transform="rotate(150 12 12)" />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" transform="rotate(180 12 12)" />
-        <animateTransform
-          attributeName="transform"
-          calcMode="discrete"
-          dur="0.75s"
-          repeatCount="indefinite"
-          type="rotate"
-          values="0 12 12;30 12 12;60 12 12;90 12 12;120 12 12;150 12 12;180 12 12;210 12 12;240 12 12;270 12 12;300 12 12;330 12 12;360 12 12"
-        />
-      </g>
-    </svg>
-  </div>
-);
+export function CircularBarSpinner({ height = "16px", width = "16px", className = "" }: ICircularBarSpinner) {
+  return (
+    <div role="status">
+      <svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24" className={className}>
+        <g>
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.14} />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.29} transform="rotate(30 12 12)" />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.43} transform="rotate(60 12 12)" />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.57} transform="rotate(90 12 12)" />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.71} transform="rotate(120 12 12)" />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.86} transform="rotate(150 12 12)" />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" transform="rotate(180 12 12)" />
+          <animateTransform
+            attributeName="transform"
+            calcMode="discrete"
+            dur="0.75s"
+            repeatCount="indefinite"
+            type="rotate"
+            values="0 12 12;30 12 12;60 12 12;90 12 12;120 12 12;150 12 12;180 12 12;210 12 12;240 12 12;270 12 12;300 12 12;330 12 12;360 12 12"
+          />
+        </g>
+      </svg>
+    </div>
+  );
+}
diff --git a/packages/propel/src/spinners/circular-spinner.tsx b/packages/propel/src/spinners/circular-spinner.tsx
index 21dc1cb62..479fb8215 100644
--- a/packages/propel/src/spinners/circular-spinner.tsx
+++ b/packages/propel/src/spinners/circular-spinner.tsx
@@ -8,26 +8,28 @@ export interface ISpinner extends React.SVGAttributes<SVGElement> {
   className?: string | undefined;
 }
 
-export const Spinner: React.FC<ISpinner> = ({ height = "32px", width = "32px", className = "" }) => (
-  <div role="status">
-    <svg
-      aria-hidden="true"
-      height={height}
-      width={width}
-      className={clsx("animate-spin text-custom-text-200", className)}
-      viewBox="0 0 100 101"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-    >
-      <path
-        d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z"
-        fill="currentColor"
-      />
-      <path
-        className="fill-custom-primary-100"
-        d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z"
-      />
-    </svg>
-    <span className="sr-only">Loading...</span>
-  </div>
-);
+export function Spinner({ height = "32px", width = "32px", className = "" }: ISpinner) {
+  return (
+    <div role="status">
+      <svg
+        aria-hidden="true"
+        height={height}
+        width={width}
+        className={clsx("animate-spin text-custom-text-200", className)}
+        viewBox="0 0 100 101"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z"
+          fill="currentColor"
+        />
+        <path
+          className="fill-custom-primary-100"
+          d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z"
+        />
+      </svg>
+      <span className="sr-only">Loading...</span>
+    </div>
+  );
+}
diff --git a/packages/propel/src/switch/root.tsx b/packages/propel/src/switch/root.tsx
index 99cdf40a1..c83dec4d5 100644
--- a/packages/propel/src/switch/root.tsx
+++ b/packages/propel/src/switch/root.tsx
@@ -11,46 +11,48 @@ export interface IToggleSwitchProps {
   className?: string;
 }
 
-const Switch: React.FC<IToggleSwitchProps> = ({ value, onChange, label, size = "sm", disabled, className }) => (
-  <BaseSwitch.Root
-    checked={value}
-    disabled={disabled}
-    onCheckedChange={onChange}
-    aria-label={label}
-    className={cn(
-      "relative inline-flex flex-shrink-0 cursor-pointer rounded-full border border-custom-border-200 transition-colors duration-200 ease-in-out focus:outline-none",
-      // size
-      size === "sm" ? "h-4 w-6" : size === "md" ? "h-5 w-8" : "h-6 w-10",
-      // state
-      disabled
-        ? "cursor-not-allowed bg-custom-background-80"
-        : value
-          ? "cursor-pointer bg-custom-primary-100"
-          : "cursor-pointer bg-custom-background-90",
-      className
-    )}
-  >
-    {label && <span className="sr-only">{label}</span>}
-    <BaseSwitch.Thumb
-      aria-hidden="true"
+function Switch({ value, onChange, label, size = "sm", disabled, className }: IToggleSwitchProps) {
+  return (
+    <BaseSwitch.Root
+      checked={value}
+      disabled={disabled}
+      onCheckedChange={onChange}
+      aria-label={label}
       className={cn(
-        "inline-block self-center rounded-full shadow ring-0 transition-transform duration-200 ease-in-out",
+        "relative inline-flex flex-shrink-0 cursor-pointer rounded-full border border-custom-border-200 transition-colors duration-200 ease-in-out focus:outline-none",
         // size
-        size === "sm" ? "h-3 w-3" : size === "md" ? "h-4 w-4" : "h-5 w-5",
-        // position + color by state
-        value
-          ? size === "sm"
-            ? "translate-x-3 bg-white"
-            : size === "md"
-              ? "translate-x-4 bg-white"
-              : "translate-x-5 bg-white"
-          : "translate-x-0.5 bg-custom-background-90",
-        // disabled
-        disabled && "cursor-not-allowed bg-custom-background-90"
+        size === "sm" ? "h-4 w-6" : size === "md" ? "h-5 w-8" : "h-6 w-10",
+        // state
+        disabled
+          ? "cursor-not-allowed bg-custom-background-80"
+          : value
+            ? "cursor-pointer bg-custom-primary-100"
+            : "cursor-pointer bg-custom-background-90",
+        className
       )}
-    />
-  </BaseSwitch.Root>
-);
+    >
+      {label && <span className="sr-only">{label}</span>}
+      <BaseSwitch.Thumb
+        aria-hidden="true"
+        className={cn(
+          "inline-block self-center rounded-full shadow ring-0 transition-transform duration-200 ease-in-out",
+          // size
+          size === "sm" ? "h-3 w-3" : size === "md" ? "h-4 w-4" : "h-5 w-5",
+          // position + color by state
+          value
+            ? size === "sm"
+              ? "translate-x-3 bg-white"
+              : size === "md"
+                ? "translate-x-4 bg-white"
+                : "translate-x-5 bg-white"
+            : "translate-x-0.5 bg-custom-background-90",
+          // disabled
+          disabled && "cursor-not-allowed bg-custom-background-90"
+        )}
+      />
+    </BaseSwitch.Root>
+  );
+}
 
 Switch.displayName = "plane-ui-switch";
 
diff --git a/packages/propel/src/table/core.tsx b/packages/propel/src/table/core.tsx
index 074bb7f37..d3492f010 100644
--- a/packages/propel/src/table/core.tsx
+++ b/packages/propel/src/table/core.tsx
@@ -2,51 +2,67 @@ import * as React from "react";
 
 import { cn } from "../utils/classname";
 
-const Table = React.forwardRef<React.ComponentRef<"table">, React.ComponentPropsWithoutRef<"table">>(
-  ({ className, ...props }, ref) => (
+const Table = React.forwardRef(function Table(
+  { className, ...props }: React.ComponentPropsWithoutRef<"table">,
+  ref: React.ForwardedRef<React.ComponentRef<"table">>
+) {
+  return (
     <div className="relative w-full overflow-auto">
       <table ref={ref} className={cn("w-full caption-bottom text-sm", className)} {...props} />
     </div>
-  )
-);
+  );
+});
 Table.displayName = "Table";
 
-const TableHeader = React.forwardRef<React.ComponentRef<"thead">, React.ComponentPropsWithoutRef<"thead">>(
-  ({ className, ...props }, ref) => (
+const TableHeader = React.forwardRef(function TableHeader(
+  { className, ...props }: React.ComponentPropsWithoutRef<"thead">,
+  ref: React.ForwardedRef<React.ComponentRef<"thead">>
+) {
+  return (
     <thead
       ref={ref}
       className={cn("bg-custom-background-80 py-4 border-y border-custom-border-200", className)}
       {...props}
     />
-  )
-);
+  );
+});
 TableHeader.displayName = "TableHeader";
 
-const TableBody = React.forwardRef<React.ComponentRef<"tbody">, React.ComponentPropsWithoutRef<"tbody">>(
-  ({ className, ...props }, ref) => <tbody ref={ref} className={cn("", className)} {...props} />
-);
+const TableBody = React.forwardRef(function TableBody(
+  { className, ...props }: React.ComponentPropsWithoutRef<"tbody">,
+  ref: React.ForwardedRef<React.ComponentRef<"tbody">>
+) {
+  return <tbody ref={ref} className={cn("", className)} {...props} />;
+});
 TableBody.displayName = "TableBody";
 
-const TableFooter = React.forwardRef<React.ComponentRef<"tfoot">, React.ComponentPropsWithoutRef<"tfoot">>(
-  ({ className, ...props }, ref) => (
-    <tfoot ref={ref} className={cn("bg-custom-background-300 font-medium", className)} {...props} />
-  )
-);
+const TableFooter = React.forwardRef(function TableFooter(
+  { className, ...props }: React.ComponentPropsWithoutRef<"tfoot">,
+  ref: React.ForwardedRef<React.ComponentRef<"tfoot">>
+) {
+  return <tfoot ref={ref} className={cn("bg-custom-background-300 font-medium", className)} {...props} />;
+});
 TableFooter.displayName = "TableFooter";
 
-const TableRow = React.forwardRef<React.ComponentRef<"tr">, React.ComponentPropsWithoutRef<"tr">>(
-  ({ className, ...props }, ref) => (
+const TableRow = React.forwardRef(function TableRow(
+  { className, ...props }: React.ComponentPropsWithoutRef<"tr">,
+  ref: React.ForwardedRef<React.ComponentRef<"tr">>
+) {
+  return (
     <tr
       ref={ref}
       className={cn("transition-colors data-[state=selected]:bg-custom-background-100", className)}
       {...props}
     />
-  )
-);
+  );
+});
 TableRow.displayName = "TableRow";
 
-const TableHead = React.forwardRef<React.ComponentRef<"th">, React.ComponentPropsWithoutRef<"th">>(
-  ({ className, ...props }, ref) => (
+const TableHead = React.forwardRef(function TableHead(
+  { className, ...props }: React.ComponentPropsWithoutRef<"th">,
+  ref: React.ForwardedRef<React.ComponentRef<"th">>
+) {
+  return (
     <th
       ref={ref}
       className={cn(
@@ -55,26 +71,30 @@ const TableHead = React.forwardRef<React.ComponentRef<"th">, React.ComponentProp
       )}
       {...props}
     />
-  )
-);
+  );
+});
 TableHead.displayName = "TableHead";
 
-const TableCell = React.forwardRef<React.ComponentRef<"td">, React.ComponentPropsWithoutRef<"td">>(
-  ({ className, ...props }, ref) => (
+const TableCell = React.forwardRef(function TableCell(
+  { className, ...props }: React.ComponentPropsWithoutRef<"td">,
+  ref: React.ForwardedRef<React.ComponentRef<"td">>
+) {
+  return (
     <td
       ref={ref}
       className={cn("p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className)}
       {...props}
     />
-  )
-);
+  );
+});
 TableCell.displayName = "TableCell";
 
-const TableCaption = React.forwardRef<React.ComponentRef<"caption">, React.ComponentPropsWithoutRef<"caption">>(
-  ({ className, ...props }, ref) => (
-    <caption ref={ref} className={cn("mt-4 text-sm text-custom-text-300", className)} {...props} />
-  )
-);
+const TableCaption = React.forwardRef(function TableCaption(
+  { className, ...props }: React.ComponentPropsWithoutRef<"caption">,
+  ref: React.ForwardedRef<React.ComponentRef<"caption">>
+) {
+  return <caption ref={ref} className={cn("mt-4 text-sm text-custom-text-300", className)} {...props} />;
+});
 TableCaption.displayName = "TableCaption";
 
 export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption };
diff --git a/packages/propel/src/tabs/tabs.tsx b/packages/propel/src/tabs/tabs.tsx
index 5bd148ba4..08cec2d95 100644
--- a/packages/propel/src/tabs/tabs.tsx
+++ b/packages/propel/src/tabs/tabs.tsx
@@ -19,72 +19,90 @@ type TabsCompound = React.ForwardRefExoticComponent<
   Indicator: React.ForwardRefExoticComponent<React.ComponentProps<"div"> & React.RefAttributes<HTMLDivElement>>;
 };
 
-const TabsRoot = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Root>,
-  React.ComponentProps<typeof TabsPrimitive.Root>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.Root data-slot="tabs" className={cn("flex flex-col w-full h-full", className)} {...props} ref={ref} />
-));
+const TabsRoot = React.forwardRef(function TabsRoot(
+  { className, ...props }: React.ComponentProps<typeof TabsPrimitive.Root>,
+  ref: React.ForwardedRef<React.ElementRef<typeof TabsPrimitive.Root>>
+) {
+  return (
+    <TabsPrimitive.Root
+      data-slot="tabs"
+      className={cn("flex flex-col w-full h-full", className)}
+      {...props}
+      ref={ref}
+    />
+  );
+});
 
-const TabsList = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.List>,
-  React.ComponentProps<typeof TabsPrimitive.List>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.List
-    data-slot="tabs-list"
-    className={cn(
-      "flex w-full min-w-fit items-center justify-between gap-1.5 rounded-md text-sm p-0.5 bg-custom-background-80/60 relative overflow-auto",
-      className
-    )}
-    {...props}
-    ref={ref}
-  />
-));
+const TabsList = React.forwardRef(function TabsList(
+  { className, ...props }: React.ComponentProps<typeof TabsPrimitive.List>,
+  ref: React.ForwardedRef<React.ElementRef<typeof TabsPrimitive.List>>
+) {
+  return (
+    <TabsPrimitive.List
+      data-slot="tabs-list"
+      className={cn(
+        "flex w-full min-w-fit items-center justify-between gap-1.5 rounded-md text-sm p-0.5 bg-custom-background-80/60 relative overflow-auto",
+        className
+      )}
+      {...props}
+      ref={ref}
+    />
+  );
+});
 
-const TabsTrigger = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Tab>,
-  React.ComponentProps<typeof TabsPrimitive.Tab> & { size?: "sm" | "md" | "lg" }
->(({ className, size = "md", ...props }, ref) => (
-  <TabsPrimitive.Tab
-    data-slot="tabs-trigger"
-    className={cn(
-      "flex items-center justify-center p-1 min-w-fit w-full font-medium text-custom-text-100 outline-none focus:outline-none cursor-pointer transition-all duration-200 ease-in-out rounded",
-      "data-[selected]:bg-custom-background-100 data-[selected]:text-custom-text-100 data-[selected]:shadow-sm",
-      "text-custom-text-400 hover:text-custom-text-300 hover:bg-custom-background-80/60",
-      "disabled:text-custom-text-400 disabled:cursor-not-allowed",
-      {
-        "text-xs": size === "sm",
-        "text-sm": size === "md",
-        "text-base": size === "lg",
-      },
-      className
-    )}
-    {...props}
-    ref={ref}
-  />
-));
+const TabsTrigger = React.forwardRef(function TabsTrigger(
+  { className, size = "md", ...props }: React.ComponentProps<typeof TabsPrimitive.Tab> & { size?: "sm" | "md" | "lg" },
+  ref: React.ForwardedRef<React.ElementRef<typeof TabsPrimitive.Tab>>
+) {
+  return (
+    <TabsPrimitive.Tab
+      data-slot="tabs-trigger"
+      className={cn(
+        "flex items-center justify-center p-1 min-w-fit w-full font-medium text-custom-text-100 outline-none focus:outline-none cursor-pointer transition-all duration-200 ease-in-out rounded",
+        "data-[selected]:bg-custom-background-100 data-[selected]:text-custom-text-100 data-[selected]:shadow-sm",
+        "text-custom-text-400 hover:text-custom-text-300 hover:bg-custom-background-80/60",
+        "disabled:text-custom-text-400 disabled:cursor-not-allowed",
+        {
+          "text-xs": size === "sm",
+          "text-sm": size === "md",
+          "text-base": size === "lg",
+        },
+        className
+      )}
+      {...props}
+      ref={ref}
+    />
+  );
+});
 
-const TabsContent = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Panel>,
-  React.ComponentProps<typeof TabsPrimitive.Panel>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.Panel
-    data-slot="tabs-content"
-    className={cn("relative outline-none", className)}
-    {...props}
-    ref={ref}
-  />
-));
-const TabsIndicator = React.forwardRef<HTMLDivElement, React.ComponentProps<"div">>(({ className, ...props }, ref) => (
-  <div
-    className={cn(
-      "absolute left-0 top-[50%] z-[-1] h-6 w-[var(--active-tab-width)] translate-x-[var(--active-tab-left)] -translate-y-[50%] rounded-sm bg-custom-background-100 shadow-sm transition-[width,transform] duration-200 ease-in-out",
-      className
-    )}
-    {...props}
-    ref={ref}
-  />
-));
+const TabsContent = React.forwardRef(function TabsContent(
+  { className, ...props }: React.ComponentProps<typeof TabsPrimitive.Panel>,
+  ref: React.ForwardedRef<React.ElementRef<typeof TabsPrimitive.Panel>>
+) {
+  return (
+    <TabsPrimitive.Panel
+      data-slot="tabs-content"
+      className={cn("relative outline-none", className)}
+      {...props}
+      ref={ref}
+    />
+  );
+});
+const TabsIndicator = React.forwardRef(function TabsIndicator(
+  { className, ...props }: React.ComponentProps<"div">,
+  ref: React.ForwardedRef<HTMLDivElement>
+) {
+  return (
+    <div
+      className={cn(
+        "absolute left-0 top-[50%] z-[-1] h-6 w-[var(--active-tab-width)] translate-x-[var(--active-tab-left)] -translate-y-[50%] rounded-sm bg-custom-background-100 shadow-sm transition-[width,transform] duration-200 ease-in-out",
+        className
+      )}
+      {...props}
+      ref={ref}
+    />
+  );
+});
 
 export const Tabs = Object.assign(TabsRoot, {
   List: TabsList,
diff --git a/packages/propel/src/toast/toast.tsx b/packages/propel/src/toast/toast.tsx
index 3ab3663cb..060200f2e 100644
--- a/packages/propel/src/toast/toast.tsx
+++ b/packages/propel/src/toast/toast.tsx
@@ -49,15 +49,17 @@ export type ToastProps = {
 
 const toastManager = BaseToast.createToastManager();
 
-export const Toast = (props: ToastProps) => (
-  <BaseToast.Provider toastManager={toastManager}>
-    <BaseToast.Portal>
-      <BaseToast.Viewport data-theme={props.theme}>
-        <ToastList />
-      </BaseToast.Viewport>
-    </BaseToast.Portal>
-  </BaseToast.Provider>
-);
+export function Toast(props: ToastProps) {
+  return (
+    <BaseToast.Provider toastManager={toastManager}>
+      <BaseToast.Portal>
+        <BaseToast.Viewport data-theme={props.theme}>
+          <ToastList />
+        </BaseToast.Viewport>
+      </BaseToast.Portal>
+    </BaseToast.Provider>
+  );
+}
 
 const TOAST_DATA = {
   [TOAST_TYPE.SUCCESS]: {
@@ -97,12 +99,13 @@ const TOAST_DATA = {
     borderColorClassName: "border-toast-border-loading",
   },
 };
-const ToastList = () => {
+
+function ToastList() {
   const { toasts } = BaseToast.useToastManager();
   return toasts.map((toast) => <ToastRender key={toast.id} id={toast.id} toast={toast} />);
-};
+}
 
-const ToastRender = ({ id, toast }: { id: React.Key; toast: BaseToast.Root.ToastObject }) => {
+function ToastRender({ id, toast }: { id: React.Key; toast: BaseToast.Root.ToastObject }) {
   const toastData = toast.data as SetToastProps;
   const type = toastData.type as TOAST_TYPE;
   const data = TOAST_DATA[type];
@@ -194,7 +197,7 @@ const ToastRender = ({ id, toast }: { id: React.Key; toast: BaseToast.Root.Toast
       )}
     </BaseToast.Root>
   );
-};
+}
 
 export const setToast = (props: SetToastProps) => {
   let toastId: string | undefined;
diff --git a/packages/propel/src/toolbar/toolbar.tsx b/packages/propel/src/toolbar/toolbar.tsx
index 0acf3b20e..b939ad1ca 100644
--- a/packages/propel/src/toolbar/toolbar.tsx
+++ b/packages/propel/src/toolbar/toolbar.tsx
@@ -35,18 +35,26 @@ export interface ToolbarSubmitButtonProps extends React.ButtonHTMLAttributes<HTM
   children: React.ReactNode;
 }
 
-const ToolbarRoot = React.forwardRef<HTMLDivElement, ToolbarProps>(({ className, children, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn("flex h-9 w-full items-stretch gap-1.5 bg-custom-background-90 overflow-x-scroll", className)}
-    {...props}
-  >
-    {children}
-  </div>
-));
+const ToolbarRoot = React.forwardRef(function ToolbarRoot(
+  { className, children, ...props }: ToolbarProps,
+  ref: React.ForwardedRef<HTMLDivElement>
+) {
+  return (
+    <div
+      ref={ref}
+      className={cn("flex h-9 w-full items-stretch gap-1.5 bg-custom-background-90 overflow-x-scroll", className)}
+      {...props}
+    >
+      {children}
+    </div>
+  );
+});
 
-const ToolbarGroup = React.forwardRef<HTMLDivElement, ToolbarGroupProps>(
-  ({ className, children, isFirst = false, ...props }, ref) => (
+const ToolbarGroup = React.forwardRef(function ToolbarGroup(
+  { className, children, isFirst = false, ...props }: ToolbarGroupProps,
+  ref: React.ForwardedRef<HTMLDivElement>
+) {
+  return (
     <div
       ref={ref}
       className={cn(
@@ -60,56 +68,60 @@ const ToolbarGroup = React.forwardRef<HTMLDivElement, ToolbarGroupProps>(
     >
       {children}
     </div>
-  )
-);
+  );
+});
 
-const ToolbarItem = React.forwardRef<HTMLButtonElement, ToolbarItemProps>(
-  ({ icon: Icon, isActive = false, tooltip, shortcut, className, children, ...props }, ref) => {
-    const button = (
-      <button
-        ref={ref}
-        type="button"
-        className={cn(
-          "grid place-items-center aspect-square rounded-sm p-0.5 text-custom-text-400 hover:bg-custom-background-80 transition-colors",
-          {
-            "bg-custom-background-80 text-custom-text-100": isActive,
-          },
-          className
-        )}
-        {...props}
+const ToolbarItem = React.forwardRef(function ToolbarItem(
+  { icon: Icon, isActive = false, tooltip, shortcut, className, children, ...props }: ToolbarItemProps,
+  ref: React.ForwardedRef<HTMLButtonElement>
+) {
+  const button = (
+    <button
+      ref={ref}
+      type="button"
+      className={cn(
+        "grid place-items-center aspect-square rounded-sm p-0.5 text-custom-text-400 hover:bg-custom-background-80 transition-colors",
+        {
+          "bg-custom-background-80 text-custom-text-100": isActive,
+        },
+        className
+      )}
+      {...props}
+    >
+      <Icon
+        className={cn("h-3.5 w-3.5", {
+          "text-custom-text-100": isActive,
+        })}
+        strokeWidth={2.5}
+      />
+      {children}
+    </button>
+  );
+
+  if (tooltip) {
+    return (
+      <Tooltip
+        tooltipContent={
+          <div className="flex flex-col gap-1 text-center text-xs">
+            <span className="font-medium">{tooltip}</span>
+            {shortcut && <kbd className="text-custom-text-400">{shortcut.join(" + ")}</kbd>}
+          </div>
+        }
       >
-        <Icon
-          className={cn("h-3.5 w-3.5", {
-            "text-custom-text-100": isActive,
-          })}
-          strokeWidth={2.5}
-        />
-        {children}
-      </button>
+        {button}
+      </Tooltip>
     );
-
-    if (tooltip) {
-      return (
-        <Tooltip
-          tooltipContent={
-            <div className="flex flex-col gap-1 text-center text-xs">
-              <span className="font-medium">{tooltip}</span>
-              {shortcut && <kbd className="text-custom-text-400">{shortcut.join(" + ")}</kbd>}
-            </div>
-          }
-        >
-          {button}
-        </Tooltip>
-      );
-    }
-
-    return button;
   }
-);
 
-const ToolbarSeparator = React.forwardRef<HTMLDivElement, ToolbarSeparatorProps>(({ className, ...props }, ref) => (
-  <div ref={ref} className={cn("h-full w-px bg-custom-border-200 mx-1", className)} {...props} />
-));
+  return button;
+});
+
+const ToolbarSeparator = React.forwardRef(function ToolbarSeparator(
+  { className, ...props }: ToolbarSeparatorProps,
+  ref: React.ForwardedRef<HTMLDivElement>
+) {
+  return <div ref={ref} className={cn("h-full w-px bg-custom-border-200 mx-1", className)} {...props} />;
+});
 
 const buttonVariants = {
   primary: "bg-custom-primary-100 text-white hover:bg-custom-primary-200 focus:bg-custom-primary-200",
@@ -121,8 +133,11 @@ const buttonVariants = {
   destructive: "bg-red-500 text-white hover:bg-red-600 focus:bg-red-600",
 };
 
-const ToolbarSubmitButton = React.forwardRef<HTMLButtonElement, ToolbarSubmitButtonProps>(
-  ({ loading = false, variant = "primary", className, children, disabled, ...props }, ref) => (
+const ToolbarSubmitButton = React.forwardRef(function ToolbarSubmitButton(
+  { loading = false, variant = "primary", className, children, disabled, ...props }: ToolbarSubmitButtonProps,
+  ref: React.ForwardedRef<HTMLButtonElement>
+) {
+  return (
     <div className="sticky right-1">
       <button
         ref={ref}
@@ -140,8 +155,8 @@ const ToolbarSubmitButton = React.forwardRef<HTMLButtonElement, ToolbarSubmitBut
         {children}
       </button>
     </div>
-  )
-);
+  );
+});
 
 ToolbarRoot.displayName = "ToolbarRoot";
 ToolbarGroup.displayName = "ToolbarGroup";
diff --git a/packages/ui/src/auth-form/auth-confirm-password-input.tsx b/packages/ui/src/auth-form/auth-confirm-password-input.tsx
index 81994790b..95afe3377 100644
--- a/packages/ui/src/auth-form/auth-confirm-password-input.tsx
+++ b/packages/ui/src/auth-form/auth-confirm-password-input.tsx
@@ -15,7 +15,7 @@ export interface AuthConfirmPasswordInputProps
   onPasswordMatchChange?: (matches: boolean) => void;
 }
 
-export const AuthConfirmPasswordInput: React.FC<AuthConfirmPasswordInputProps> = ({
+export function AuthConfirmPasswordInput({
   password,
   label = "Confirm Password",
   error,
@@ -27,7 +27,7 @@ export const AuthConfirmPasswordInput: React.FC<AuthConfirmPasswordInputProps> =
   onChange,
   onPasswordMatchChange,
   ...props
-}) => {
+}: AuthConfirmPasswordInputProps) {
   const [isFocused, setIsFocused] = useState(false);
 
   const confirmPassword = value as string;
@@ -74,4 +74,4 @@ export const AuthConfirmPasswordInput: React.FC<AuthConfirmPasswordInputProps> =
       {confirmPassword && passwordsMatch && <p className="text-sm text-green-500">Passwords match</p>}
     </div>
   );
-};
+}
diff --git a/packages/ui/src/auth-form/auth-forgot-password.tsx b/packages/ui/src/auth-form/auth-forgot-password.tsx
index 02df0380e..23ade0668 100644
--- a/packages/ui/src/auth-form/auth-forgot-password.tsx
+++ b/packages/ui/src/auth-form/auth-forgot-password.tsx
@@ -8,12 +8,12 @@ export interface AuthForgotPasswordProps {
   disabled?: boolean;
 }
 
-export const AuthForgotPassword: React.FC<AuthForgotPasswordProps> = ({
+export function AuthForgotPassword({
   onForgotPassword,
   className = "",
   text = "Forgot your password?",
   disabled = false,
-}) => {
+}: AuthForgotPasswordProps) {
   const handleClick = (e: React.MouseEvent) => {
     e.preventDefault();
     if (!disabled && onForgotPassword) {
@@ -38,4 +38,4 @@ export const AuthForgotPassword: React.FC<AuthForgotPasswordProps> = ({
       {text}
     </button>
   );
-};
+}
diff --git a/packages/ui/src/auth-form/auth-form.tsx b/packages/ui/src/auth-form/auth-form.tsx
index e44991c8f..524daeb63 100644
--- a/packages/ui/src/auth-form/auth-form.tsx
+++ b/packages/ui/src/auth-form/auth-form.tsx
@@ -35,7 +35,7 @@ export interface AuthFormProps {
   alternateModeButtonText?: string;
 }
 
-export const AuthForm: React.FC<AuthFormProps> = ({
+export function AuthForm({
   mode,
   initialData = {},
   onSubmit,
@@ -52,7 +52,7 @@ export const AuthForm: React.FC<AuthFormProps> = ({
   submitButtonText,
   alternateModeText,
   alternateModeButtonText,
-}) => {
+}: AuthFormProps) {
   const [formData, setFormData] = useState<AuthFormData>({
     email: initialData.email || "",
     password: initialData.password || "",
@@ -204,4 +204,4 @@ export const AuthForm: React.FC<AuthFormProps> = ({
       </div>
     </form>
   );
-};
+}
diff --git a/packages/ui/src/auth-form/auth-input.tsx b/packages/ui/src/auth-form/auth-input.tsx
index 7038a005b..36d36674a 100644
--- a/packages/ui/src/auth-form/auth-input.tsx
+++ b/packages/ui/src/auth-form/auth-input.tsx
@@ -13,7 +13,7 @@ export interface AuthInputProps extends Omit<React.InputHTMLAttributes<HTMLInput
 
 const baseContainerClassName = "flex flex-col gap-1.5";
 
-export const AuthInput: React.FC<AuthInputProps> = ({
+export function AuthInput({
   label,
   error,
   showPasswordToggle = false,
@@ -21,7 +21,7 @@ export const AuthInput: React.FC<AuthInputProps> = ({
   className = "",
   type = "text",
   ...props
-}) => {
+}: AuthInputProps) {
   const { id } = props;
   const [showPassword, setShowPassword] = useState(false);
   const isPasswordType = type === "password";
@@ -63,4 +63,4 @@ export const AuthInput: React.FC<AuthInputProps> = ({
       {error && <p className={cn("text-sm text-red-500", errorClassName)}>{error}</p>}
     </div>
   );
-};
+}
diff --git a/packages/ui/src/auth-form/auth-password-input.tsx b/packages/ui/src/auth-form/auth-password-input.tsx
index 2a468e170..184137981 100644
--- a/packages/ui/src/auth-form/auth-password-input.tsx
+++ b/packages/ui/src/auth-form/auth-password-input.tsx
@@ -16,7 +16,7 @@ export interface AuthPasswordInputProps extends Omit<React.InputHTMLAttributes<H
   onPasswordStrengthChange?: (strength: E_PASSWORD_STRENGTH) => void;
 }
 
-export const AuthPasswordInput: React.FC<AuthPasswordInputProps> = ({
+export function AuthPasswordInput({
   label = "Password",
   error,
   showPasswordStrength = true,
@@ -29,7 +29,7 @@ export const AuthPasswordInput: React.FC<AuthPasswordInputProps> = ({
   onPasswordChange,
   onPasswordStrengthChange,
   ...props
-}) => {
+}: AuthPasswordInputProps) {
   const [isFocused, setIsFocused] = useState(false);
 
   const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
@@ -74,4 +74,4 @@ export const AuthPasswordInput: React.FC<AuthPasswordInputProps> = ({
       )}
     </div>
   );
-};
+}
diff --git a/packages/ui/src/avatar/avatar-group.tsx b/packages/ui/src/avatar/avatar-group.tsx
index 991fdd34e..2be8e0206 100644
--- a/packages/ui/src/avatar/avatar-group.tsx
+++ b/packages/ui/src/avatar/avatar-group.tsx
@@ -32,7 +32,7 @@ type Props = {
   size?: TAvatarSize;
 };
 
-export const AvatarGroup: React.FC<Props> = (props) => {
+export function AvatarGroup(props: Props) {
   const { children, max = 2, showTooltip = true, size = "md" } = props;
 
   // calculate total length of avatars inside the group
@@ -88,4 +88,4 @@ export const AvatarGroup: React.FC<Props> = (props) => {
       )}
     </div>
   );
-};
+}
diff --git a/packages/ui/src/avatar/avatar.tsx b/packages/ui/src/avatar/avatar.tsx
index 37cc0668b..3e4703837 100644
--- a/packages/ui/src/avatar/avatar.tsx
+++ b/packages/ui/src/avatar/avatar.tsx
@@ -113,7 +113,7 @@ export const getBorderRadius = (shape: "circle" | "square") => {
  */
 export const isAValidNumber = (value: any) => typeof value === "number" && !isNaN(value);
 
-export const Avatar: React.FC<Props> = (props) => {
+export function Avatar(props: Props) {
   const {
     name,
     fallbackBackgroundColor,
@@ -166,4 +166,4 @@ export const Avatar: React.FC<Props> = (props) => {
       </div>
     </Tooltip>
   );
-};
+}
diff --git a/packages/ui/src/badge/badge.tsx b/packages/ui/src/badge/badge.tsx
index 663e7f25e..7f1cca1c4 100644
--- a/packages/ui/src/badge/badge.tsx
+++ b/packages/ui/src/badge/badge.tsx
@@ -15,7 +15,7 @@ export interface BadgeProps extends React.ButtonHTMLAttributes<HTMLButtonElement
   children: React.ReactNode;
 }
 
-const Badge = React.forwardRef<HTMLButtonElement, BadgeProps>((props, ref) => {
+const Badge = React.forwardRef(function Badge(props: BadgeProps, ref: React.ForwardedRef<HTMLButtonElement>) {
   const {
     variant = "primary",
     size = "md",
diff --git a/packages/ui/src/breadcrumbs/breadcrumbs.stories.tsx b/packages/ui/src/breadcrumbs/breadcrumbs.stories.tsx
index bb047f57e..7615c18a1 100644
--- a/packages/ui/src/breadcrumbs/breadcrumbs.stories.tsx
+++ b/packages/ui/src/breadcrumbs/breadcrumbs.stories.tsx
@@ -19,7 +19,7 @@ type TBreadcrumbBlockProps = {
 };
 
 // TODO: remove this component and use web Link component
-const BreadcrumbBlock: React.FC<TBreadcrumbBlockProps> = (props) => {
+function BreadcrumbBlock(props: TBreadcrumbBlockProps) {
   const { label, icon, disableTooltip = false } = props;
 
   return (
@@ -30,7 +30,7 @@ const BreadcrumbBlock: React.FC<TBreadcrumbBlockProps> = (props) => {
       </Breadcrumbs.ItemWrapper>
     </>
   );
-};
+}
 
 export default meta;
 type Story = StoryObj<typeof Breadcrumbs>;
diff --git a/packages/ui/src/breadcrumbs/breadcrumbs.tsx b/packages/ui/src/breadcrumbs/breadcrumbs.tsx
index 2da6b88c4..7b058c8a3 100644
--- a/packages/ui/src/breadcrumbs/breadcrumbs.tsx
+++ b/packages/ui/src/breadcrumbs/breadcrumbs.tsx
@@ -10,16 +10,18 @@ type BreadcrumbsProps = {
   isLoading?: boolean;
 };
 
-export const BreadcrumbItemLoader = () => (
-  <div className="flex items-center gap-2 h-7 animate-pulse">
-    <div className="group h-full flex items-center gap-2 rounded px-2 py-1 text-sm font-medium">
-      <span className="h-full w-5 bg-custom-background-80 rounded" />
-      <span className="h-full w-16 bg-custom-background-80 rounded" />
+export function BreadcrumbItemLoader() {
+  return (
+    <div className="flex items-center gap-2 h-7 animate-pulse">
+      <div className="group h-full flex items-center gap-2 rounded px-2 py-1 text-sm font-medium">
+        <span className="h-full w-5 bg-custom-background-80 rounded" />
+        <span className="h-full w-16 bg-custom-background-80 rounded" />
+      </div>
     </div>
-  </div>
-);
+  );
+}
 
-const Breadcrumbs = ({ className, children, onBack, isLoading = false }: BreadcrumbsProps) => {
+function Breadcrumbs({ className, children, onBack, isLoading = false }: BreadcrumbsProps) {
   const [isSmallScreen, setIsSmallScreen] = React.useState(false);
 
   React.useEffect(() => {
@@ -82,7 +84,7 @@ const Breadcrumbs = ({ className, children, onBack, isLoading = false }: Breadcr
       {isSmallScreen && childrenArray.length === 1 && childrenArray}
     </div>
   );
-};
+}
 
 // breadcrumb item
 type BreadcrumbItemProps = {
@@ -91,7 +93,7 @@ type BreadcrumbItemProps = {
   isLast?: boolean;
 };
 
-const BreadcrumbItem: React.FC<BreadcrumbItemProps> = (props) => {
+function BreadcrumbItem(props: BreadcrumbItemProps) {
   const { component, showSeparator = true, isLast = false } = props;
   return (
     <div className="flex items-center gap-0.5 h-6">
@@ -99,7 +101,7 @@ const BreadcrumbItem: React.FC<BreadcrumbItemProps> = (props) => {
       {showSeparator && !isLast && <BreadcrumbSeparator />}
     </div>
   );
-};
+}
 
 // breadcrumb icon
 type BreadcrumbIconProps = {
@@ -107,10 +109,10 @@ type BreadcrumbIconProps = {
   className?: string;
 };
 
-const BreadcrumbIcon: React.FC<BreadcrumbIconProps> = (props) => {
+function BreadcrumbIcon(props: BreadcrumbIconProps) {
   const { children, className } = props;
   return <div className={cn("flex size-4 items-center justify-start overflow-hidden", className)}>{children}</div>;
-};
+}
 
 // breadcrumb label
 type BreadcrumbLabelProps = {
@@ -118,14 +120,14 @@ type BreadcrumbLabelProps = {
   className?: string;
 };
 
-const BreadcrumbLabel: React.FC<BreadcrumbLabelProps> = (props) => {
+function BreadcrumbLabel(props: BreadcrumbLabelProps) {
   const { children, className } = props;
   return (
     <div className={cn("relative line-clamp-1 block max-w-[150px] overflow-hidden truncate", className)}>
       {children}
     </div>
   );
-};
+}
 
 // breadcrumb separator
 type BreadcrumbSeparatorProps = {
@@ -135,7 +137,7 @@ type BreadcrumbSeparatorProps = {
   showDivider?: boolean;
 };
 
-const BreadcrumbSeparator: React.FC<BreadcrumbSeparatorProps> = (props) => {
+function BreadcrumbSeparator(props: BreadcrumbSeparatorProps) {
   const { className, containerClassName, iconClassName, showDivider = false } = props;
   return (
     <div className={cn("relative flex items-center justify-center h-full px-1.5 py-1", className)}>
@@ -150,7 +152,7 @@ const BreadcrumbSeparator: React.FC<BreadcrumbSeparatorProps> = (props) => {
       </div>
     </div>
   );
-};
+}
 
 // breadcrumb wrapper
 type BreadcrumbItemWrapperProps = {
@@ -162,7 +164,7 @@ type BreadcrumbItemWrapperProps = {
   isLast?: boolean;
 };
 
-const BreadcrumbItemWrapper: React.FC<BreadcrumbItemWrapperProps> = (props) => {
+function BreadcrumbItemWrapper(props: BreadcrumbItemWrapperProps) {
   const { label, disableTooltip = false, children, className, type = "link", isLast = false } = props;
   return (
     <Tooltip tooltipContent={label} position="bottom" disabled={!label || label === "" || disableTooltip}>
@@ -179,7 +181,7 @@ const BreadcrumbItemWrapper: React.FC<BreadcrumbItemWrapperProps> = (props) => {
       </div>
     </Tooltip>
   );
-};
+}
 
 Breadcrumbs.Item = BreadcrumbItem;
 Breadcrumbs.Icon = BreadcrumbIcon;
diff --git a/packages/ui/src/breadcrumbs/navigation-dropdown.tsx b/packages/ui/src/breadcrumbs/navigation-dropdown.tsx
index d06bb4636..9fb4e0e4e 100644
--- a/packages/ui/src/breadcrumbs/navigation-dropdown.tsx
+++ b/packages/ui/src/breadcrumbs/navigation-dropdown.tsx
@@ -17,7 +17,7 @@ type TBreadcrumbNavigationDropdownProps = {
   isLast?: boolean;
 };
 
-export const BreadcrumbNavigationDropdown = (props: TBreadcrumbNavigationDropdownProps) => {
+export function BreadcrumbNavigationDropdown(props: TBreadcrumbNavigationDropdownProps) {
   const { selectedItemKey, navigationItems, navigationDisabled = false, handleOnClick, isLast = false } = props;
   const [isOpen, setIsOpen] = React.useState(false);
   // derived values
@@ -29,31 +29,33 @@ export const BreadcrumbNavigationDropdown = (props: TBreadcrumbNavigationDropdow
   // if no selected item, return null
   if (!selectedItem) return null;
 
-  const NavigationButton = () => (
-    <Tooltip tooltipContent={selectedItem.title} position="bottom" disabled={isOpen}>
-      <button
-        onClick={(e) => {
-          if (!isLast) {
-            e.preventDefault();
-            e.stopPropagation();
-            handleOnClick?.();
-          }
-        }}
-        className={cn(
-          "group h-full flex items-center gap-2 px-1.5 py-1 text-sm font-medium text-custom-text-300 cursor-pointer rounded rounded-r-none",
-          {
-            "hover:bg-custom-background-80 hover:text-custom-text-100": !isLast,
-          }
-        )}
-      >
-        <div className="flex @4xl:hidden text-custom-text-300">...</div>
-        <div className="hidden @4xl:flex gap-2">
-          {selectedItemIcon && <Breadcrumbs.Icon>{selectedItemIcon}</Breadcrumbs.Icon>}
-          <Breadcrumbs.Label>{selectedItem.title}</Breadcrumbs.Label>
-        </div>
-      </button>
-    </Tooltip>
-  );
+  function NavigationButton() {
+    return (
+      <Tooltip tooltipContent={selectedItem.title} position="bottom" disabled={isOpen}>
+        <button
+          onClick={(e) => {
+            if (!isLast) {
+              e.preventDefault();
+              e.stopPropagation();
+              handleOnClick?.();
+            }
+          }}
+          className={cn(
+            "group h-full flex items-center gap-2 px-1.5 py-1 text-sm font-medium text-custom-text-300 cursor-pointer rounded rounded-r-none",
+            {
+              "hover:bg-custom-background-80 hover:text-custom-text-100": !isLast,
+            }
+          )}
+        >
+          <div className="flex @4xl:hidden text-custom-text-300">...</div>
+          <div className="hidden @4xl:flex gap-2">
+            {selectedItemIcon && <Breadcrumbs.Icon>{selectedItemIcon}</Breadcrumbs.Icon>}
+            <Breadcrumbs.Label>{selectedItem.title}</Breadcrumbs.Label>
+          </div>
+        </button>
+      </Tooltip>
+    );
+  }
 
   if (navigationDisabled) {
     return <NavigationButton />;
@@ -133,4 +135,4 @@ export const BreadcrumbNavigationDropdown = (props: TBreadcrumbNavigationDropdow
       })}
     </CustomMenu>
   );
-};
+}
diff --git a/packages/ui/src/breadcrumbs/navigation-search-dropdown.tsx b/packages/ui/src/breadcrumbs/navigation-search-dropdown.tsx
index cd3d96083..7edc317f4 100644
--- a/packages/ui/src/breadcrumbs/navigation-search-dropdown.tsx
+++ b/packages/ui/src/breadcrumbs/navigation-search-dropdown.tsx
@@ -19,7 +19,7 @@ type TBreadcrumbNavigationSearchDropdownProps = {
   shouldTruncate?: boolean;
 };
 
-export const BreadcrumbNavigationSearchDropdown: React.FC<TBreadcrumbNavigationSearchDropdownProps> = (props) => {
+export function BreadcrumbNavigationSearchDropdown(props: TBreadcrumbNavigationSearchDropdownProps) {
   const {
     icon,
     title,
@@ -102,4 +102,4 @@ export const BreadcrumbNavigationSearchDropdown: React.FC<TBreadcrumbNavigationS
       )}
     />
   );
-};
+}
diff --git a/packages/ui/src/button/button.tsx b/packages/ui/src/button/button.tsx
index c5e01f24d..1717d8a8a 100644
--- a/packages/ui/src/button/button.tsx
+++ b/packages/ui/src/button/button.tsx
@@ -15,7 +15,7 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
   children: React.ReactNode;
 }
 
-const Button = React.forwardRef<HTMLButtonElement, ButtonProps>((props, ref) => {
+const Button = React.forwardRef(function Button(props: ButtonProps, ref: React.ForwardedRef<HTMLButtonElement>) {
   const {
     variant = "primary",
     size = "md",
diff --git a/packages/ui/src/button/toggle-switch.tsx b/packages/ui/src/button/toggle-switch.tsx
index c97428c2f..5225b6356 100644
--- a/packages/ui/src/button/toggle-switch.tsx
+++ b/packages/ui/src/button/toggle-switch.tsx
@@ -12,7 +12,7 @@ interface IToggleSwitchProps {
   className?: string;
 }
 
-const ToggleSwitch: React.FC<IToggleSwitchProps> = (props) => {
+function ToggleSwitch(props: IToggleSwitchProps) {
   const { value, onChange, label, size = "sm", disabled, className } = props;
 
   return (
@@ -49,7 +49,7 @@ const ToggleSwitch: React.FC<IToggleSwitchProps> = (props) => {
       />
     </Switch>
   );
-};
+}
 
 ToggleSwitch.displayName = "plane-ui-toggle-switch";
 
diff --git a/packages/ui/src/card/card.tsx b/packages/ui/src/card/card.tsx
index 174fda0e2..444d5772e 100644
--- a/packages/ui/src/card/card.tsx
+++ b/packages/ui/src/card/card.tsx
@@ -11,7 +11,7 @@ export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
   children: React.ReactNode;
 }
 
-const Card = React.forwardRef<HTMLDivElement, CardProps>((props, ref) => {
+const Card = React.forwardRef(function Card(props: CardProps, ref: React.ForwardedRef<HTMLDivElement>) {
   const {
     variant = ECardVariant.WITH_SHADOW,
     direction = ECardDirection.COLUMN,
diff --git a/packages/ui/src/collapsible/collapsible-button.tsx b/packages/ui/src/collapsible/collapsible-button.tsx
index c618ab74d..53ccfe3fa 100644
--- a/packages/ui/src/collapsible/collapsible-button.tsx
+++ b/packages/ui/src/collapsible/collapsible-button.tsx
@@ -15,7 +15,7 @@ type Props = {
   ChevronIcon?: React.FC<ISvgIcons>;
 };
 
-export const CollapsibleButton: FC<Props> = (props) => {
+export function CollapsibleButton(props: Props) {
   const {
     isOpen,
     title,
@@ -49,4 +49,4 @@ export const CollapsibleButton: FC<Props> = (props) => {
       {actionItemElement && isOpen && actionItemElement}
     </div>
   );
-};
+}
diff --git a/packages/ui/src/collapsible/collapsible.tsx b/packages/ui/src/collapsible/collapsible.tsx
index 529451a60..f5babab07 100644
--- a/packages/ui/src/collapsible/collapsible.tsx
+++ b/packages/ui/src/collapsible/collapsible.tsx
@@ -13,7 +13,7 @@ export type TCollapsibleProps = {
   defaultOpen?: boolean;
 };
 
-export const Collapsible: FC<TCollapsibleProps> = (props) => {
+export function Collapsible(props: TCollapsibleProps) {
   const { title, children, buttonRef, className, buttonClassName, isOpen, onToggle, defaultOpen } = props;
   // state
   const [localIsOpen, setLocalIsOpen] = useState<boolean>(isOpen || defaultOpen ? true : false);
@@ -51,4 +51,4 @@ export const Collapsible: FC<TCollapsibleProps> = (props) => {
       </Transition>
     </Disclosure>
   );
-};
+}
diff --git a/packages/ui/src/color-picker/color-picker.tsx b/packages/ui/src/color-picker/color-picker.tsx
index e53fdc10d..d6993d653 100644
--- a/packages/ui/src/color-picker/color-picker.tsx
+++ b/packages/ui/src/color-picker/color-picker.tsx
@@ -6,7 +6,7 @@ interface ColorPickerProps {
   className?: string;
 }
 
-export const ColorPicker: React.FC<ColorPickerProps> = (props) => {
+export function ColorPicker(props: ColorPickerProps) {
   const { value, onChange, className = "" } = props;
   // refs
   const inputRef = React.useRef<HTMLInputElement>(null);
@@ -35,4 +35,4 @@ export const ColorPicker: React.FC<ColorPickerProps> = (props) => {
       />
     </div>
   );
-};
+}
diff --git a/packages/ui/src/content-wrapper/content-wrapper.tsx b/packages/ui/src/content-wrapper/content-wrapper.tsx
index 526ef4955..af79cbc75 100644
--- a/packages/ui/src/content-wrapper/content-wrapper.tsx
+++ b/packages/ui/src/content-wrapper/content-wrapper.tsx
@@ -11,7 +11,10 @@ export interface ContentWrapperProps extends React.HTMLAttributes<HTMLDivElement
 }
 const DEFAULT_STYLE = "flex flex-col vertical-scrollbar scrollbar-lg h-full w-full overflow-y-auto";
 
-const ContentWrapper = React.forwardRef<HTMLDivElement, ContentWrapperProps>((props, ref) => {
+const ContentWrapper = React.forwardRef(function ContentWrapper(
+  props: ContentWrapperProps,
+  ref: React.ForwardedRef<HTMLDivElement>
+) {
   const { variant = ERowVariant.REGULAR, className = "", children, ...rest } = props;
 
   return (
diff --git a/packages/ui/src/control-link/control-link.tsx b/packages/ui/src/control-link/control-link.tsx
index 83c719ca1..b5df552df 100644
--- a/packages/ui/src/control-link/control-link.tsx
+++ b/packages/ui/src/control-link/control-link.tsx
@@ -10,7 +10,10 @@ export type TControlLink = React.AnchorHTMLAttributes<HTMLAnchorElement> & {
   draggable?: boolean;
 };
 
-export const ControlLink = React.forwardRef<HTMLAnchorElement, TControlLink>((props, ref) => {
+export const ControlLink = React.forwardRef(function ControlLink(
+  props: TControlLink,
+  ref: React.ForwardedRef<HTMLAnchorElement>
+) {
   const { href, onClick, children, target = "_blank", disabled = false, className, draggable = false, ...rest } = props;
   const LEFT_CLICK_EVENT_CODE = 0;
 
diff --git a/packages/ui/src/drag-handle.tsx b/packages/ui/src/drag-handle.tsx
index 5ec26ecd3..f60930fed 100644
--- a/packages/ui/src/drag-handle.tsx
+++ b/packages/ui/src/drag-handle.tsx
@@ -8,7 +8,10 @@ interface IDragHandle {
   disabled?: boolean;
 }
 
-export const DragHandle = forwardRef<HTMLButtonElement | null, IDragHandle>((props, ref) => {
+export const DragHandle = forwardRef(function DragHandle(
+  props: IDragHandle,
+  ref: React.ForwardedRef<HTMLButtonElement | null>
+) {
   const { className, disabled = false } = props;
 
   if (disabled) {
diff --git a/packages/ui/src/drop-indicator.tsx b/packages/ui/src/drop-indicator.tsx
index b8982be06..1fab9c116 100644
--- a/packages/ui/src/drop-indicator.tsx
+++ b/packages/ui/src/drop-indicator.tsx
@@ -6,7 +6,7 @@ type Props = {
   classNames?: string;
 };
 
-export const DropIndicator = (props: Props) => {
+export function DropIndicator(props: Props) {
   const { isVisible, classNames = "" } = props;
 
   return (
@@ -22,4 +22,4 @@ export const DropIndicator = (props: Props) => {
       )}
     />
   );
-};
+}
diff --git a/packages/ui/src/dropdown/common/button.tsx b/packages/ui/src/dropdown/common/button.tsx
index 9e7d55a6e..2045f29b7 100644
--- a/packages/ui/src/dropdown/common/button.tsx
+++ b/packages/ui/src/dropdown/common/button.tsx
@@ -4,7 +4,7 @@ import React, { Fragment } from "react";
 import { cn } from "../../utils";
 import type { IMultiSelectDropdownButton, ISingleSelectDropdownButton } from "../dropdown";
 
-export const DropdownButton: React.FC<IMultiSelectDropdownButton | ISingleSelectDropdownButton> = (props) => {
+export function DropdownButton(props: IMultiSelectDropdownButton | ISingleSelectDropdownButton) {
   const {
     isOpen,
     buttonContent,
@@ -34,4 +34,4 @@ export const DropdownButton: React.FC<IMultiSelectDropdownButton | ISingleSelect
       </button>
     </Combobox.Button>
   );
-};
+}
diff --git a/packages/ui/src/dropdown/common/input-search.tsx b/packages/ui/src/dropdown/common/input-search.tsx
index d82d573dc..eb08c6921 100644
--- a/packages/ui/src/dropdown/common/input-search.tsx
+++ b/packages/ui/src/dropdown/common/input-search.tsx
@@ -16,7 +16,7 @@ interface IInputSearch {
   isMobile: boolean;
 }
 
-export const InputSearch: FC<IInputSearch> = (props) => {
+export function InputSearch(props: IInputSearch) {
   const { isOpen, query, updateQuery, inputIcon, inputContainerClassName, inputClassName, inputPlaceholder, isMobile } =
     props;
 
@@ -58,4 +58,4 @@ export const InputSearch: FC<IInputSearch> = (props) => {
       />
     </div>
   );
-};
+}
diff --git a/packages/ui/src/dropdown/common/loader.tsx b/packages/ui/src/dropdown/common/loader.tsx
index c19bda620..4ab196511 100644
--- a/packages/ui/src/dropdown/common/loader.tsx
+++ b/packages/ui/src/dropdown/common/loader.tsx
@@ -1,10 +1,12 @@
 import { range } from "lodash-es";
 import React from "react";
 
-export const DropdownOptionsLoader = () => (
-  <div className="flex flex-col gap-1 animate-pulse">
-    {range(6).map((index) => (
-      <div key={index} className="flex h-[1.925rem] w-full rounded px-1 py-1.5 bg-custom-background-90" />
-    ))}
-  </div>
-);
+export function DropdownOptionsLoader() {
+  return (
+    <div className="flex flex-col gap-1 animate-pulse">
+      {range(6).map((index) => (
+        <div key={index} className="flex h-[1.925rem] w-full rounded px-1 py-1.5 bg-custom-background-90" />
+      ))}
+    </div>
+  );
+}
diff --git a/packages/ui/src/dropdown/common/options.tsx b/packages/ui/src/dropdown/common/options.tsx
index 90eef932c..91fa37f1e 100644
--- a/packages/ui/src/dropdown/common/options.tsx
+++ b/packages/ui/src/dropdown/common/options.tsx
@@ -8,7 +8,7 @@ import type { IMultiSelectDropdownOptions, ISingleSelectDropdownOptions } from "
 // components
 import { DropdownOptionsLoader, InputSearch } from ".";
 
-export const DropdownOptions: React.FC<IMultiSelectDropdownOptions | ISingleSelectDropdownOptions> = (props) => {
+export function DropdownOptions(props: IMultiSelectDropdownOptions | ISingleSelectDropdownOptions) {
   const {
     isOpen,
     query,
@@ -88,4 +88,4 @@ export const DropdownOptions: React.FC<IMultiSelectDropdownOptions | ISingleSele
       </div>
     </>
   );
-};
+}
diff --git a/packages/ui/src/dropdown/multi-select.tsx b/packages/ui/src/dropdown/multi-select.tsx
index 8a98c33f8..b54308dff 100644
--- a/packages/ui/src/dropdown/multi-select.tsx
+++ b/packages/ui/src/dropdown/multi-select.tsx
@@ -12,7 +12,7 @@ import { DropdownButton } from "./common";
 import { DropdownOptions } from "./common/options";
 import type { IMultiSelectDropdown } from "./dropdown";
 
-export const MultiSelectDropdown: FC<IMultiSelectDropdown> = (props) => {
+export function MultiSelectDropdown(props: IMultiSelectDropdown) {
   const {
     value,
     onChange,
@@ -165,4 +165,4 @@ export const MultiSelectDropdown: FC<IMultiSelectDropdown> = (props) => {
       )}
     </Combobox>
   );
-};
+}
diff --git a/packages/ui/src/dropdown/single-select.tsx b/packages/ui/src/dropdown/single-select.tsx
index 8d6088805..e78f717ca 100644
--- a/packages/ui/src/dropdown/single-select.tsx
+++ b/packages/ui/src/dropdown/single-select.tsx
@@ -12,7 +12,7 @@ import { DropdownButton } from "./common";
 import { DropdownOptions } from "./common/options";
 import type { ISingleSelectDropdown } from "./dropdown";
 
-export const Dropdown: FC<ISingleSelectDropdown> = (props) => {
+export function Dropdown(props: ISingleSelectDropdown) {
   const {
     value,
     onChange,
@@ -165,4 +165,4 @@ export const Dropdown: FC<ISingleSelectDropdown> = (props) => {
       )}
     </Combobox>
   );
-};
+}
diff --git a/packages/ui/src/dropdowns/combo-box.tsx b/packages/ui/src/dropdowns/combo-box.tsx
index bbb0446dc..a0d81cd2a 100644
--- a/packages/ui/src/dropdowns/combo-box.tsx
+++ b/packages/ui/src/dropdowns/combo-box.tsx
@@ -17,7 +17,7 @@ type Props = {
   children: ReactNode;
 };
 
-const ComboDropDown = forwardRef((props: Props, ref) => {
+const ComboDropDown = forwardRef(function ComboDropDown(props: Props, ref) {
   const { button, renderByDefault = true, children, ...rest } = props;
 
   const dropDownButtonRef = useRef<HTMLDivElement | null>(null);
diff --git a/packages/ui/src/dropdowns/context-menu/item.tsx b/packages/ui/src/dropdowns/context-menu/item.tsx
index 892ca9890..3f5c78aed 100644
--- a/packages/ui/src/dropdowns/context-menu/item.tsx
+++ b/packages/ui/src/dropdowns/context-menu/item.tsx
@@ -14,7 +14,7 @@ type ContextMenuItemProps = {
   item: TContextMenuItem;
 };
 
-export const ContextMenuItem: React.FC<ContextMenuItemProps> = (props) => {
+export function ContextMenuItem(props: ContextMenuItemProps) {
   const { handleActiveItem, handleClose, isActive, item } = props;
 
   // Nested menu state
@@ -243,4 +243,4 @@ export const ContextMenuItem: React.FC<ContextMenuItemProps> = (props) => {
       )}
     </>
   );
-};
+}
diff --git a/packages/ui/src/dropdowns/context-menu/root.tsx b/packages/ui/src/dropdowns/context-menu/root.tsx
index b801a62df..c87b8b097 100644
--- a/packages/ui/src/dropdowns/context-menu/root.tsx
+++ b/packages/ui/src/dropdowns/context-menu/root.tsx
@@ -28,7 +28,7 @@ interface PortalProps {
   container?: Element | null;
 }
 
-export const Portal: React.FC<PortalProps> = ({ children, container }) => {
+export function Portal({ children, container }: PortalProps) {
   const [mounted, setMounted] = React.useState(false);
 
   React.useEffect(() => {
@@ -42,7 +42,7 @@ export const Portal: React.FC<PortalProps> = ({ children, container }) => {
 
   const targetContainer = container || document.body;
   return ReactDOM.createPortal(children, targetContainer);
-};
+}
 
 // Context for managing nested menus
 export const ContextMenuContext = React.createContext<{
@@ -57,7 +57,7 @@ type ContextMenuProps = {
   portalContainer?: Element | null;
 };
 
-const ContextMenuWithoutPortal: React.FC<ContextMenuProps> = (props) => {
+function ContextMenuWithoutPortal(props: ContextMenuProps) {
   const { parentRef, items, portalContainer } = props;
   // states
   const [isOpen, setIsOpen] = useState(false);
@@ -227,11 +227,11 @@ const ContextMenuWithoutPortal: React.FC<ContextMenuProps> = (props) => {
       </div>
     </div>
   );
-};
+}
 
-export const ContextMenu: React.FC<ContextMenuProps> = (props) => {
+export function ContextMenu(props: ContextMenuProps) {
   let contextMenu = <ContextMenuWithoutPortal {...props} />;
   const portal = document.querySelector("#context-menu-portal");
   if (portal) contextMenu = ReactDOM.createPortal(contextMenu, portal);
   return contextMenu;
-};
+}
diff --git a/packages/ui/src/dropdowns/custom-menu.tsx b/packages/ui/src/dropdowns/custom-menu.tsx
index c63bcd52b..5d2308850 100644
--- a/packages/ui/src/dropdowns/custom-menu.tsx
+++ b/packages/ui/src/dropdowns/custom-menu.tsx
@@ -25,7 +25,7 @@ interface PortalProps {
   asChild?: boolean;
 }
 
-const Portal: React.FC<PortalProps> = ({ children, container, asChild = false }) => {
+function Portal({ children, container, asChild = false }: PortalProps) {
   const [mounted, setMounted] = React.useState(false);
 
   React.useEffect(() => {
@@ -44,7 +44,7 @@ const Portal: React.FC<PortalProps> = ({ children, container, asChild = false })
   }
 
   return ReactDOM.createPortal(<div data-radix-portal="">{children}</div>, targetContainer);
-};
+}
 
 // Context for main menu to communicate with submenus
 const MenuContext = React.createContext<{
@@ -52,7 +52,7 @@ const MenuContext = React.createContext<{
   registerSubmenu: (closeSubmenu: () => void) => () => void;
 } | null>(null);
 
-const CustomMenu = (props: ICustomMenuDropdownProps) => {
+function CustomMenu(props: ICustomMenuDropdownProps) {
   const {
     ariaLabel,
     buttonClassName = "",
@@ -295,7 +295,7 @@ const CustomMenu = (props: ICustomMenuDropdownProps) => {
       )}
     </Menu>
   );
-};
+}
 
 // SubMenu context for closing submenu from nested items
 const SubMenuContext = React.createContext<{ closeSubmenu: () => void } | null>(null);
@@ -304,7 +304,7 @@ const SubMenuContext = React.createContext<{ closeSubmenu: () => void } | null>(
 const useSubMenu = () => React.useContext(SubMenuContext);
 
 // SubMenu implementation
-const SubMenu: React.FC<ICustomSubMenuProps> = (props) => {
+function SubMenu(props: ICustomSubMenuProps) {
   const {
     children,
     trigger,
@@ -447,9 +447,9 @@ const SubMenu: React.FC<ICustomSubMenuProps> = (props) => {
       )}
     </div>
   );
-};
+}
 
-const MenuItem: React.FC<ICustomMenuItemProps> = (props) => {
+function MenuItem(props: ICustomMenuItemProps) {
   const { children, disabled = false, onClick, className } = props;
   const submenuContext = useSubMenu();
 
@@ -479,9 +479,9 @@ const MenuItem: React.FC<ICustomMenuItemProps> = (props) => {
       )}
     </Menu.Item>
   );
-};
+}
 
-const SubMenuTrigger: React.FC<ICustomSubMenuTriggerProps> = (props) => {
+function SubMenuTrigger(props: ICustomSubMenuTriggerProps) {
   const { children, disabled = false, className } = props;
 
   return (
@@ -505,9 +505,9 @@ const SubMenuTrigger: React.FC<ICustomSubMenuTriggerProps> = (props) => {
       )}
     </Menu.Item>
   );
-};
+}
 
-const SubMenuContent: React.FC<ICustomSubMenuContentProps> = (props) => {
+function SubMenuContent(props: ICustomSubMenuContentProps) {
   const { children, className } = props;
 
   return (
@@ -520,7 +520,7 @@ const SubMenuContent: React.FC<ICustomSubMenuContentProps> = (props) => {
       {children}
     </div>
   );
-};
+}
 
 // Add all components as static properties for external use
 CustomMenu.Portal = Portal;
diff --git a/packages/ui/src/dropdowns/custom-search-select.tsx b/packages/ui/src/dropdowns/custom-search-select.tsx
index 54175aad5..b471e5f15 100644
--- a/packages/ui/src/dropdowns/custom-search-select.tsx
+++ b/packages/ui/src/dropdowns/custom-search-select.tsx
@@ -12,7 +12,7 @@ import { useDropdownKeyDown } from "../hooks/use-dropdown-key-down";
 import { cn } from "../utils";
 import type { ICustomSearchSelectProps } from "./helper";
 
-export const CustomSearchSelect = (props: ICustomSearchSelectProps) => {
+export function CustomSearchSelect(props: ICustomSearchSelectProps) {
   const {
     customButtonClassName = "",
     buttonClassName = "",
@@ -223,4 +223,4 @@ export const CustomSearchSelect = (props: ICustomSearchSelectProps) => {
       }}
     </Combobox>
   );
-};
+}
diff --git a/packages/ui/src/dropdowns/custom-select.tsx b/packages/ui/src/dropdowns/custom-select.tsx
index 8f720fa29..3876ee9fd 100644
--- a/packages/ui/src/dropdowns/custom-select.tsx
+++ b/packages/ui/src/dropdowns/custom-select.tsx
@@ -13,7 +13,7 @@ import { cn } from "../utils";
 // types
 import type { ICustomSelectItemProps, ICustomSelectProps } from "./helper";
 
-const CustomSelect = (props: ICustomSelectProps) => {
+function CustomSelect(props: ICustomSelectProps) {
   const {
     customButtonClassName = "",
     buttonClassName = "",
@@ -131,9 +131,9 @@ const CustomSelect = (props: ICustomSelectProps) => {
         )}
     </Combobox>
   );
-};
+}
 
-const Option = (props: ICustomSelectItemProps) => {
+function Option(props: ICustomSelectItemProps) {
   const { children, value, className } = props;
   return (
     <Combobox.Option
@@ -156,7 +156,7 @@ const Option = (props: ICustomSelectItemProps) => {
       )}
     </Combobox.Option>
   );
-};
+}
 
 CustomSelect.Option = Option;
 
diff --git a/packages/ui/src/favorite-star.tsx b/packages/ui/src/favorite-star.tsx
index 8614f6565..dce54b172 100644
--- a/packages/ui/src/favorite-star.tsx
+++ b/packages/ui/src/favorite-star.tsx
@@ -10,7 +10,7 @@ type Props = {
   selected: boolean;
 };
 
-export const FavoriteStar: React.FC<Props> = (props) => {
+export function FavoriteStar(props: Props) {
   const { buttonClassName, iconClassName, onClick, selected } = props;
 
   return (
@@ -26,4 +26,4 @@ export const FavoriteStar: React.FC<Props> = (props) => {
       />
     </button>
   );
-};
+}
diff --git a/packages/ui/src/form-fields/checkbox.tsx b/packages/ui/src/form-fields/checkbox.tsx
index 7f9b8134d..2aecef8d0 100644
--- a/packages/ui/src/form-fields/checkbox.tsx
+++ b/packages/ui/src/form-fields/checkbox.tsx
@@ -8,7 +8,7 @@ export interface CheckboxProps extends React.InputHTMLAttributes<HTMLInputElemen
   indeterminate?: boolean;
 }
 
-const Checkbox = React.forwardRef<HTMLInputElement, CheckboxProps>((props, ref) => {
+const Checkbox = React.forwardRef(function Checkbox(props: CheckboxProps, ref: React.ForwardedRef<HTMLInputElement>) {
   const {
     id,
     name,
diff --git a/packages/ui/src/form-fields/input-color-picker.tsx b/packages/ui/src/form-fields/input-color-picker.tsx
index 0294dff52..39e18106b 100644
--- a/packages/ui/src/form-fields/input-color-picker.tsx
+++ b/packages/ui/src/form-fields/input-color-picker.tsx
@@ -19,7 +19,7 @@ export interface InputColorPickerProps {
   placeholder: string;
 }
 
-export const InputColorPicker: React.FC<InputColorPickerProps> = (props) => {
+export function InputColorPicker(props: InputColorPickerProps) {
   const { value, hasError, onChange, name, className, style, placeholder } = props;
 
   const [referenceElement, setReferenceElement] = React.useState<HTMLButtonElement | null>(null);
@@ -111,4 +111,4 @@ export const InputColorPicker: React.FC<InputColorPickerProps> = (props) => {
       </Popover>
     </div>
   );
-};
+}
diff --git a/packages/ui/src/form-fields/input.tsx b/packages/ui/src/form-fields/input.tsx
index d42c4c098..1263289ba 100644
--- a/packages/ui/src/form-fields/input.tsx
+++ b/packages/ui/src/form-fields/input.tsx
@@ -10,7 +10,7 @@ export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>
   autoComplete?: "on" | "off";
 }
 
-const Input = React.forwardRef<HTMLInputElement, InputProps>((props, ref) => {
+const Input = React.forwardRef(function Input(props: InputProps, ref: React.ForwardedRef<HTMLInputElement>) {
   const {
     id,
     type,
diff --git a/packages/ui/src/form-fields/password/indicator.tsx b/packages/ui/src/form-fields/password/indicator.tsx
index 72ce44850..a2eabbfbf 100644
--- a/packages/ui/src/form-fields/password/indicator.tsx
+++ b/packages/ui/src/form-fields/password/indicator.tsx
@@ -10,11 +10,11 @@ export interface PasswordStrengthIndicatorProps {
   isFocused?: boolean;
 }
 
-export const PasswordStrengthIndicator: React.FC<PasswordStrengthIndicatorProps> = ({
+export function PasswordStrengthIndicator({
   password,
   showCriteria = true,
   isFocused = false,
-}) => {
+}: PasswordStrengthIndicatorProps) {
   const strength = getPasswordStrength(password);
   const criteria = getPasswordCriteria(password);
   const strengthInfo = getStrengthInfo(strength);
@@ -72,4 +72,4 @@ export const PasswordStrengthIndicator: React.FC<PasswordStrengthIndicatorProps>
       )}
     </div>
   );
-};
+}
diff --git a/packages/ui/src/form-fields/password/password-input.tsx b/packages/ui/src/form-fields/password/password-input.tsx
index ad990f257..b5165e1bc 100644
--- a/packages/ui/src/form-fields/password/password-input.tsx
+++ b/packages/ui/src/form-fields/password/password-input.tsx
@@ -13,7 +13,7 @@ interface PasswordInputProps {
   error?: boolean;
 }
 
-export const PasswordInput: React.FC<PasswordInputProps> = ({
+export function PasswordInput({
   id,
   value,
   onChange,
@@ -21,7 +21,7 @@ export const PasswordInput: React.FC<PasswordInputProps> = ({
   className,
   showToggle = true,
   error = false,
-}) => {
+}: PasswordInputProps) {
   const [showPassword, setShowPassword] = useState(false);
   return (
     <div className="relative">
@@ -66,4 +66,4 @@ export const PasswordInput: React.FC<PasswordInputProps> = ({
       )}
     </div>
   );
-};
+}
diff --git a/packages/ui/src/form-fields/root.tsx b/packages/ui/src/form-fields/root.tsx
index 782b6e1aa..393734853 100644
--- a/packages/ui/src/form-fields/root.tsx
+++ b/packages/ui/src/form-fields/root.tsx
@@ -8,11 +8,13 @@ interface LabelProps {
   className?: string;
 }
 
-export const Label: React.FC<LabelProps> = ({ htmlFor, children, className }) => (
-  <label htmlFor={htmlFor} className={cn("block text-sm font-medium text-custom-text-100", className)}>
-    {children}
-  </label>
-);
+export function Label({ htmlFor, children, className }: LabelProps) {
+  return (
+    <label htmlFor={htmlFor} className={cn("block text-sm font-medium text-custom-text-100", className)}>
+      {children}
+    </label>
+  );
+}
 
 // Reusable Form Field Component
 interface FormFieldProps {
@@ -23,15 +25,17 @@ interface FormFieldProps {
   optional?: boolean;
 }
 
-export const FormField: React.FC<FormFieldProps> = ({ label, htmlFor, children, className, optional = false }) => (
-  <div className={cn("flex flex-col gap-1.5", className)}>
-    <Label htmlFor={htmlFor}>
-      {label}
-      {optional && <span className="text-custom-text-400 text-sm"> (optional)</span>}
-    </Label>
-    {children}
-  </div>
-);
+export function FormField({ label, htmlFor, children, className, optional = false }: FormFieldProps) {
+  return (
+    <div className={cn("flex flex-col gap-1.5", className)}>
+      <Label htmlFor={htmlFor}>
+        {label}
+        {optional && <span className="text-custom-text-400 text-sm"> (optional)</span>}
+      </Label>
+      {children}
+    </div>
+  );
+}
 
 // Reusable Validation Message Component
 interface ValidationMessageProps {
@@ -40,17 +44,19 @@ interface ValidationMessageProps {
   className?: string;
 }
 
-export const ValidationMessage: React.FC<ValidationMessageProps> = ({ type, message, className }) => (
-  <p
-    className={cn(
-      "text-sm",
-      {
-        "text-red-500": type === "error",
-        "text-green-500": type === "success",
-      },
-      className
-    )}
-  >
-    {message}
-  </p>
-);
+export function ValidationMessage({ type, message, className }: ValidationMessageProps) {
+  return (
+    <p
+      className={cn(
+        "text-sm",
+        {
+          "text-red-500": type === "error",
+          "text-green-500": type === "success",
+        },
+        className
+      )}
+    >
+      {message}
+    </p>
+  );
+}
diff --git a/packages/ui/src/form-fields/textarea.tsx b/packages/ui/src/form-fields/textarea.tsx
index b4ad0c4bc..970fa977f 100644
--- a/packages/ui/src/form-fields/textarea.tsx
+++ b/packages/ui/src/form-fields/textarea.tsx
@@ -11,7 +11,10 @@ export interface TextAreaProps extends React.TextareaHTMLAttributes<HTMLTextArea
   className?: string;
 }
 
-const TextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>((props, ref) => {
+const TextArea = React.forwardRef(function TextArea(
+  props: TextAreaProps,
+  ref: React.ForwardedRef<HTMLTextAreaElement>
+) {
   const {
     id,
     name,
diff --git a/packages/ui/src/header/header.tsx b/packages/ui/src/header/header.tsx
index ba98c58d3..90f65a59d 100644
--- a/packages/ui/src/header/header.tsx
+++ b/packages/ui/src/header/header.tsx
@@ -13,7 +13,8 @@ export interface HeaderProps {
 }
 
 const HeaderContext = React.createContext<THeaderVariant | null>(null);
-const Header = (props: HeaderProps) => {
+
+function Header(props: HeaderProps) {
   const {
     variant = EHeaderVariant.PRIMARY,
     className = "",
@@ -35,19 +36,22 @@ const Header = (props: HeaderProps) => {
       </Row>
     </HeaderContext.Provider>
   );
-};
+}
 
-const LeftItem = (props: HeaderProps) => (
-  <div
-    className={cn(
-      "flex flex-wrap items-center gap-2 overflow-ellipsis whitespace-nowrap max-w-[80%] flex-grow",
-      props.className
-    )}
-  >
-    {props.children}
-  </div>
-);
-const RightItem = (props: HeaderProps) => {
+function LeftItem(props: HeaderProps) {
+  return (
+    <div
+      className={cn(
+        "flex flex-wrap items-center gap-2 overflow-ellipsis whitespace-nowrap max-w-[80%] flex-grow",
+        props.className
+      )}
+    >
+      {props.children}
+    </div>
+  );
+}
+
+function RightItem(props: HeaderProps) {
   const variant = React.useContext(HeaderContext);
   if (variant === undefined) throw new Error("RightItem must be used within Header");
   return (
@@ -63,7 +67,7 @@ const RightItem = (props: HeaderProps) => {
       {props.children}
     </div>
   );
-};
+}
 
 Header.LeftItem = LeftItem;
 Header.RightItem = RightItem;
diff --git a/packages/ui/src/link/block.tsx b/packages/ui/src/link/block.tsx
index 1b98e27b0..65c472282 100644
--- a/packages/ui/src/link/block.tsx
+++ b/packages/ui/src/link/block.tsx
@@ -14,7 +14,7 @@ export type TLinkItemBlockProps = {
   onClick?: () => void;
 };
 
-export const LinkItemBlock: FC<TLinkItemBlockProps> = (props) => {
+export function LinkItemBlock(props: TLinkItemBlockProps) {
   // props
   const { title, url, createdAt, menuItems, onClick } = props;
   // icons
@@ -67,4 +67,4 @@ export const LinkItemBlock: FC<TLinkItemBlockProps> = (props) => {
       )}
     </div>
   );
-};
+}
diff --git a/packages/ui/src/loader.tsx b/packages/ui/src/loader.tsx
index 6eaa74c65..7f89514a9 100644
--- a/packages/ui/src/loader.tsx
+++ b/packages/ui/src/loader.tsx
@@ -7,11 +7,13 @@ type Props = {
   className?: string;
 };
 
-const Loader = ({ children, className = "" }: Props) => (
-  <div className={cn("animate-pulse", className)} role="status">
-    {children}
-  </div>
-);
+function Loader({ children, className = "" }: Props) {
+  return (
+    <div className={cn("animate-pulse", className)} role="status">
+      {children}
+    </div>
+  );
+}
 
 type ItemProps = {
   height?: string;
@@ -19,9 +21,11 @@ type ItemProps = {
   className?: string;
 };
 
-const Item: React.FC<ItemProps> = ({ height = "auto", width = "auto", className = "" }) => (
-  <div className={cn("rounded-md bg-custom-background-80", className)} style={{ height: height, width: width }} />
-);
+function Item({ height = "auto", width = "auto", className = "" }: ItemProps) {
+  return (
+    <div className={cn("rounded-md bg-custom-background-80", className)} style={{ height: height, width: width }} />
+  );
+}
 
 Loader.Item = Item;
 
diff --git a/packages/ui/src/modals/alert-modal.tsx b/packages/ui/src/modals/alert-modal.tsx
index dfffec802..329b2ae8f 100644
--- a/packages/ui/src/modals/alert-modal.tsx
+++ b/packages/ui/src/modals/alert-modal.tsx
@@ -45,7 +45,7 @@ const VARIANT_CLASSES: Record<TModalVariant, string> = {
   primary: "bg-custom-primary-100/20 text-custom-primary-100",
 };
 
-export const AlertModalCore: React.FC<Props> = (props) => {
+export function AlertModalCore(props: Props) {
   const {
     content,
     handleClose,
@@ -94,4 +94,4 @@ export const AlertModalCore: React.FC<Props> = (props) => {
       </div>
     </ModalCore>
   );
-};
+}
diff --git a/packages/ui/src/modals/modal-core.tsx b/packages/ui/src/modals/modal-core.tsx
index ff8e94a74..1b629e35d 100644
--- a/packages/ui/src/modals/modal-core.tsx
+++ b/packages/ui/src/modals/modal-core.tsx
@@ -13,7 +13,7 @@ type Props = {
   width?: EModalWidth;
   className?: string;
 };
-export const ModalCore: React.FC<Props> = (props) => {
+export function ModalCore(props: Props) {
   const {
     children,
     handleClose,
@@ -64,4 +64,4 @@ export const ModalCore: React.FC<Props> = (props) => {
       </Dialog>
     </Transition.Root>
   );
-};
+}
diff --git a/packages/ui/src/oauth/oauth-button.tsx b/packages/ui/src/oauth/oauth-button.tsx
index 1bf454dad..9995ead89 100644
--- a/packages/ui/src/oauth/oauth-button.tsx
+++ b/packages/ui/src/oauth/oauth-button.tsx
@@ -7,7 +7,10 @@ export interface OAuthButtonProps extends React.ButtonHTMLAttributes<HTMLButtonE
   compact?: boolean;
 }
 
-const OAuthButton = React.forwardRef<HTMLButtonElement, OAuthButtonProps>((props, ref) => {
+const OAuthButton = React.forwardRef(function OAuthButton(
+  props: OAuthButtonProps,
+  ref: React.ForwardedRef<HTMLButtonElement>
+) {
   const { text, icon, compact = false, className = "", ...rest } = props;
 
   return (
diff --git a/packages/ui/src/oauth/oauth-options.tsx b/packages/ui/src/oauth/oauth-options.tsx
index 1c42cb19d..019b872eb 100644
--- a/packages/ui/src/oauth/oauth-options.tsx
+++ b/packages/ui/src/oauth/oauth-options.tsx
@@ -18,7 +18,7 @@ type OAuthOptionsProps = {
   containerClassName?: string;
 };
 
-export const OAuthOptions = (props: OAuthOptionsProps) => {
+export function OAuthOptions(props: OAuthOptionsProps) {
   const { options, compact = false, className = "", containerClassName = "" } = props;
 
   // Filter enabled options
@@ -54,4 +54,4 @@ export const OAuthOptions = (props: OAuthOptionsProps) => {
       </div>
     </div>
   );
-};
+}
diff --git a/packages/ui/src/popovers/popover-menu.tsx b/packages/ui/src/popovers/popover-menu.tsx
index fa5f2833a..0cd6cabc8 100644
--- a/packages/ui/src/popovers/popover-menu.tsx
+++ b/packages/ui/src/popovers/popover-menu.tsx
@@ -6,7 +6,7 @@ import { Popover } from "./popover";
 // types
 import type { TPopoverMenu } from "./types";
 
-export const PopoverMenu = <T,>(props: TPopoverMenu<T>) => {
+export function PopoverMenu<T>(props: TPopoverMenu<T>) {
   const {
     popperPosition = "bottom-end",
     popperPadding = 0,
@@ -42,4 +42,4 @@ export const PopoverMenu = <T,>(props: TPopoverMenu<T>) => {
       </Fragment>
     </Popover>
   );
-};
+}
diff --git a/packages/ui/src/popovers/popover.tsx b/packages/ui/src/popovers/popover.tsx
index 96027798d..db008bcb3 100644
--- a/packages/ui/src/popovers/popover.tsx
+++ b/packages/ui/src/popovers/popover.tsx
@@ -8,7 +8,7 @@ import { cn } from "../utils";
 // types
 import type { TPopover } from "./types";
 
-export const Popover = (props: TPopover) => {
+export function Popover(props: TPopover) {
   const {
     popperPosition = "bottom-end",
     popperPadding = 0,
@@ -76,4 +76,4 @@ export const Popover = (props: TPopover) => {
       </Transition>
     </HeadlessReactPopover>
   );
-};
+}
diff --git a/packages/ui/src/progress/circular-progress-indicator.tsx b/packages/ui/src/progress/circular-progress-indicator.tsx
index 139297c40..cfbb1ff2e 100644
--- a/packages/ui/src/progress/circular-progress-indicator.tsx
+++ b/packages/ui/src/progress/circular-progress-indicator.tsx
@@ -8,7 +8,7 @@ interface ICircularProgressIndicator {
   children?: React.ReactNode;
 }
 
-export const CircularProgressIndicator: React.FC<ICircularProgressIndicator> = (props) => {
+export function CircularProgressIndicator(props: ICircularProgressIndicator) {
   const { size = 40, percentage = 25, strokeWidth = 6, strokeColor = "stroke-custom-primary-100", children } = props;
 
   const sqSize = size;
@@ -81,4 +81,4 @@ export const CircularProgressIndicator: React.FC<ICircularProgressIndicator> = (
       </div>
     </div>
   );
-};
+}
diff --git a/packages/ui/src/progress/linear-progress-indicator.tsx b/packages/ui/src/progress/linear-progress-indicator.tsx
index 9400690e3..8769a1157 100644
--- a/packages/ui/src/progress/linear-progress-indicator.tsx
+++ b/packages/ui/src/progress/linear-progress-indicator.tsx
@@ -11,14 +11,14 @@ type Props = {
   barClassName?: string;
 };
 
-export const LinearProgressIndicator: React.FC<Props> = ({
+export function LinearProgressIndicator({
   data,
   noTooltip = false,
   inPercentage = false,
   size = "sm",
   className = "",
   barClassName = "",
-}) => {
+}: Props) {
   const total = data.reduce((acc: any, cur: any) => acc + cur.value, 0);
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   let progress = 0;
@@ -54,4 +54,4 @@ export const LinearProgressIndicator: React.FC<Props> = ({
       </div>
     </div>
   );
-};
+}
diff --git a/packages/ui/src/progress/progress-bar.tsx b/packages/ui/src/progress/progress-bar.tsx
index b92b568ac..4493548b8 100644
--- a/packages/ui/src/progress/progress-bar.tsx
+++ b/packages/ui/src/progress/progress-bar.tsx
@@ -9,14 +9,14 @@ type Props = {
   inactiveStrokeColor?: string;
 };
 
-export const ProgressBar: React.FC<Props> = ({
+export function ProgressBar({
   maxValue = 0,
   value = 0,
   radius = 8,
   strokeWidth = 2,
   activeStrokeColor = "#3e98c7",
   inactiveStrokeColor = "#ddd",
-}) => {
+}: Props) {
   // PIE Calc Fn
   const generatePie = (value: any) => {
     const x = radius - Math.cos((2 * Math.PI) / (100 / value)) * radius;
@@ -65,4 +65,4 @@ export const ProgressBar: React.FC<Props> = ({
       <circle r={radius - strokeWidth} cx={radius} cy={radius} className="progress-bar" />
     </svg>
   );
-};
+}
diff --git a/packages/ui/src/progress/radial-progress.tsx b/packages/ui/src/progress/radial-progress.tsx
index ea386b06b..173566d27 100644
--- a/packages/ui/src/progress/radial-progress.tsx
+++ b/packages/ui/src/progress/radial-progress.tsx
@@ -5,7 +5,7 @@ interface IRadialProgressBar {
   progress: number;
 }
 
-export const RadialProgressBar: FC<IRadialProgressBar> = (props) => {
+export function RadialProgressBar(props: IRadialProgressBar) {
   const { progress } = props;
   const [circumference, setCircumference] = useState(0);
 
@@ -43,4 +43,4 @@ export const RadialProgressBar: FC<IRadialProgressBar> = (props) => {
       </svg>
     </div>
   );
-};
+}
diff --git a/packages/ui/src/row/row.tsx b/packages/ui/src/row/row.tsx
index 740e22fc5..cc223c0e8 100644
--- a/packages/ui/src/row/row.tsx
+++ b/packages/ui/src/row/row.tsx
@@ -9,7 +9,7 @@ export interface RowProps extends React.HTMLAttributes<HTMLDivElement> {
   children: React.ReactNode;
 }
 
-const Row = React.forwardRef<HTMLDivElement, RowProps>((props, ref) => {
+const Row = React.forwardRef(function Row(props: RowProps, ref: React.ForwardedRef<HTMLDivElement>) {
   const { variant = ERowVariant.REGULAR, className = "", children, ...rest } = props;
 
   const style = rowStyle[variant];
diff --git a/packages/ui/src/scroll-area.tsx b/packages/ui/src/scroll-area.tsx
index 9378b4638..77c73b56d 100644
--- a/packages/ui/src/scroll-area.tsx
+++ b/packages/ui/src/scroll-area.tsx
@@ -24,7 +24,7 @@ const thumbSizeStyles = {
   lg: "before:absolute before:left-1/2 before:top-1/2 before:size-full before:min-h-17 before:min-w-17 before:-translate-x-1/2 before:-translate-y-1/2",
 };
 
-export const ScrollArea: FC<TScrollAreaProps> = (props) => {
+export function ScrollArea(props: TScrollAreaProps) {
   const { type = "always", className = "", scrollHideDelay = 600, size = "md", children } = props;
 
   return (
@@ -64,4 +64,4 @@ export const ScrollArea: FC<TScrollAreaProps> = (props) => {
       </RadixScrollArea.Scrollbar>
     </RadixScrollArea.Root>
   );
-};
+}
diff --git a/packages/ui/src/sortable/draggable.tsx b/packages/ui/src/sortable/draggable.tsx
index cea7f5065..8661eec2c 100644
--- a/packages/ui/src/sortable/draggable.tsx
+++ b/packages/ui/src/sortable/draggable.tsx
@@ -20,7 +20,8 @@ type Props = {
   data: any; //@todo make this generic
   className?: string;
 };
-const Draggable = ({ children, data, className }: Props) => {
+
+function Draggable({ children, data, className }: Props) {
   const ref = useRef<HTMLDivElement>(null);
   const [dragging, setDragging] = useState<boolean>(false); // NEW
   const [isDraggedOver, setIsDraggedOver] = useState(false);
@@ -69,6 +70,6 @@ const Draggable = ({ children, data, className }: Props) => {
       {<DropIndicator isVisible={isDraggedOver && closestEdge === "bottom"} />}
     </div>
   );
-};
+}
 
 export { Draggable };
diff --git a/packages/ui/src/sortable/sortable.tsx b/packages/ui/src/sortable/sortable.tsx
index 0461e9b87..1d7599b72 100644
--- a/packages/ui/src/sortable/sortable.tsx
+++ b/packages/ui/src/sortable/sortable.tsx
@@ -59,7 +59,7 @@ const moveItem = <T,>(
   };
 };
 
-export const Sortable = <T,>({ data, render, onChange, keyExtractor, containerClassName, id }: Props<T>) => {
+export function Sortable<T>({ data, render, onChange, keyExtractor, containerClassName, id }: Props<T>) {
   useEffect(() => {
     const unsubscribe = monitorForElements({
       // @ts-expect-error Due to live server dependencies
@@ -100,6 +100,6 @@ export const Sortable = <T,>({ data, render, onChange, keyExtractor, containerCl
       ))}
     </>
   );
-};
+}
 
 export default Sortable;
diff --git a/packages/ui/src/spinners/circular-bar-spinner.tsx b/packages/ui/src/spinners/circular-bar-spinner.tsx
index 3be8af43a..ab5e5ef75 100644
--- a/packages/ui/src/spinners/circular-bar-spinner.tsx
+++ b/packages/ui/src/spinners/circular-bar-spinner.tsx
@@ -6,30 +6,28 @@ interface ICircularBarSpinner extends React.SVGAttributes<SVGElement> {
   className?: string | undefined;
 }
 
-export const CircularBarSpinner: React.FC<ICircularBarSpinner> = ({
-  height = "16px",
-  width = "16px",
-  className = "",
-}) => (
-  <div role="status">
-    <svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24" className={className}>
-      <g>
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.14} />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.29} transform="rotate(30 12 12)" />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.43} transform="rotate(60 12 12)" />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.57} transform="rotate(90 12 12)" />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.71} transform="rotate(120 12 12)" />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.86} transform="rotate(150 12 12)" />
-        <rect width={2} height={5} x={11} y={1} fill="currentColor" transform="rotate(180 12 12)" />
-        <animateTransform
-          attributeName="transform"
-          calcMode="discrete"
-          dur="0.75s"
-          repeatCount="indefinite"
-          type="rotate"
-          values="0 12 12;30 12 12;60 12 12;90 12 12;120 12 12;150 12 12;180 12 12;210 12 12;240 12 12;270 12 12;300 12 12;330 12 12;360 12 12"
-        />
-      </g>
-    </svg>
-  </div>
-);
+export function CircularBarSpinner({ height = "16px", width = "16px", className = "" }: ICircularBarSpinner) {
+  return (
+    <div role="status">
+      <svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24" className={className}>
+        <g>
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.14} />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.29} transform="rotate(30 12 12)" />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.43} transform="rotate(60 12 12)" />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.57} transform="rotate(90 12 12)" />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.71} transform="rotate(120 12 12)" />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" opacity={0.86} transform="rotate(150 12 12)" />
+          <rect width={2} height={5} x={11} y={1} fill="currentColor" transform="rotate(180 12 12)" />
+          <animateTransform
+            attributeName="transform"
+            calcMode="discrete"
+            dur="0.75s"
+            repeatCount="indefinite"
+            type="rotate"
+            values="0 12 12;30 12 12;60 12 12;90 12 12;120 12 12;150 12 12;180 12 12;210 12 12;240 12 12;270 12 12;300 12 12;330 12 12;360 12 12"
+          />
+        </g>
+      </svg>
+    </div>
+  );
+}
diff --git a/packages/ui/src/spinners/circular-spinner.tsx b/packages/ui/src/spinners/circular-spinner.tsx
index 357f00908..1edc22b9f 100644
--- a/packages/ui/src/spinners/circular-spinner.tsx
+++ b/packages/ui/src/spinners/circular-spinner.tsx
@@ -8,26 +8,28 @@ export interface ISpinner extends React.SVGAttributes<SVGElement> {
   className?: string | undefined;
 }
 
-export const Spinner: React.FC<ISpinner> = ({ height = "32px", width = "32px", className = "" }) => (
-  <div role="status">
-    <svg
-      aria-hidden="true"
-      height={height}
-      width={width}
-      className={cn("animate-spin fill-custom-primary-100 text-custom-text-200", className)}
-      viewBox="0 0 100 101"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-    >
-      <path
-        d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z"
-        fill="currentColor"
-      />
-      <path
-        d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z"
-        fill="currentFill"
-      />
-    </svg>
-    <span className="sr-only">Loading...</span>
-  </div>
-);
+export function Spinner({ height = "32px", width = "32px", className = "" }: ISpinner) {
+  return (
+    <div role="status">
+      <svg
+        aria-hidden="true"
+        height={height}
+        width={width}
+        className={cn("animate-spin fill-custom-primary-100 text-custom-text-200", className)}
+        viewBox="0 0 100 101"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z"
+          fill="currentColor"
+        />
+        <path
+          d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z"
+          fill="currentFill"
+        />
+      </svg>
+      <span className="sr-only">Loading...</span>
+    </div>
+  );
+}
diff --git a/packages/ui/src/tables/table.tsx b/packages/ui/src/tables/table.tsx
index 707a1677b..66a9235c4 100644
--- a/packages/ui/src/tables/table.tsx
+++ b/packages/ui/src/tables/table.tsx
@@ -4,7 +4,7 @@ import { cn } from "../utils";
 // types
 import type { TTableData } from "./types";
 
-export const Table = <T,>(props: TTableData<T>) => {
+export function Table<T>(props: TTableData<T>) {
   const {
     data,
     columns,
@@ -45,4 +45,4 @@ export const Table = <T,>(props: TTableData<T>) => {
       </tbody>
     </table>
   );
-};
+}
diff --git a/packages/ui/src/tabs/tab-list.tsx b/packages/ui/src/tabs/tab-list.tsx
index 5a828f2ce..560d592f3 100644
--- a/packages/ui/src/tabs/tab-list.tsx
+++ b/packages/ui/src/tabs/tab-list.tsx
@@ -22,51 +22,53 @@ type TTabListProps = {
   onTabChange?: (key: string) => void;
 };
 
-export const TabList: FC<TTabListProps> = ({
+export function TabList({
   tabs,
   tabListClassName,
   tabClassName,
   size = "md",
   selectedTab,
   onTabChange,
-}) => (
-  <Tab.List
-    as="div"
-    className={cn(
-      "flex w-full min-w-fit items-center justify-between gap-1.5 rounded-md text-sm p-0.5 bg-custom-background-80/60",
-      tabListClassName
-    )}
-  >
-    {tabs.map((tab) => (
-      <Tab
-        className={({ selected }) =>
-          cn(
-            "flex items-center justify-center p-1 min-w-fit w-full font-medium text-custom-text-100 outline-none focus:outline-none cursor-pointer transition-all rounded",
-            (selectedTab ? selectedTab === tab.key : selected)
-              ? "bg-custom-background-100 text-custom-text-100 shadow-sm"
-              : tab.disabled
-                ? "text-custom-text-400 cursor-not-allowed"
-                : "text-custom-text-400 hover:text-custom-text-300 hover:bg-custom-background-80/60",
-            {
-              "text-xs": size === "sm",
-              "text-sm": size === "md",
-              "text-base": size === "lg",
-            },
-            tabClassName
-          )
-        }
-        key={tab.key}
-        onClick={() => {
-          if (!tab.disabled) {
-            onTabChange?.(tab.key);
-            tab.onClick?.();
+}: TTabListProps) {
+  return (
+    <Tab.List
+      as="div"
+      className={cn(
+        "flex w-full min-w-fit items-center justify-between gap-1.5 rounded-md text-sm p-0.5 bg-custom-background-80/60",
+        tabListClassName
+      )}
+    >
+      {tabs.map((tab) => (
+        <Tab
+          className={({ selected }) =>
+            cn(
+              "flex items-center justify-center p-1 min-w-fit w-full font-medium text-custom-text-100 outline-none focus:outline-none cursor-pointer transition-all rounded",
+              (selectedTab ? selectedTab === tab.key : selected)
+                ? "bg-custom-background-100 text-custom-text-100 shadow-sm"
+                : tab.disabled
+                  ? "text-custom-text-400 cursor-not-allowed"
+                  : "text-custom-text-400 hover:text-custom-text-300 hover:bg-custom-background-80/60",
+              {
+                "text-xs": size === "sm",
+                "text-sm": size === "md",
+                "text-base": size === "lg",
+              },
+              tabClassName
+            )
           }
-        }}
-        disabled={tab.disabled}
-      >
-        {tab.icon && <tab.icon className="size-4" />}
-        {tab.label}
-      </Tab>
-    ))}
-  </Tab.List>
-);
+          key={tab.key}
+          onClick={() => {
+            if (!tab.disabled) {
+              onTabChange?.(tab.key);
+              tab.onClick?.();
+            }
+          }}
+          disabled={tab.disabled}
+        >
+          {tab.icon && <tab.icon className="size-4" />}
+          {tab.label}
+        </Tab>
+      ))}
+    </Tab.List>
+  );
+}
diff --git a/packages/ui/src/tabs/tabs.tsx b/packages/ui/src/tabs/tabs.tsx
index 03cfd1de8..3aa7167b9 100644
--- a/packages/ui/src/tabs/tabs.tsx
+++ b/packages/ui/src/tabs/tabs.tsx
@@ -28,7 +28,7 @@ type TTabsProps = {
   storeInLocalStorage?: boolean;
 };
 
-export const Tabs: FC<TTabsProps> = (props: TTabsProps) => {
+export function Tabs(props: TTabsProps) {
   const {
     tabs,
     storageKey,
@@ -87,4 +87,4 @@ export const Tabs: FC<TTabsProps> = (props: TTabsProps) => {
       </Tab.Group>
     </div>
   );
-};
+}
diff --git a/packages/ui/src/tag/tag.tsx b/packages/ui/src/tag/tag.tsx
index 2e602507b..8ae14f07a 100644
--- a/packages/ui/src/tag/tag.tsx
+++ b/packages/ui/src/tag/tag.tsx
@@ -10,7 +10,7 @@ export interface TagProps extends React.ComponentProps<"div"> {
   children: React.ReactNode;
 }
 
-const Tag = React.forwardRef<HTMLDivElement, TagProps>((props, ref) => {
+const Tag = React.forwardRef(function Tag(props: TagProps, ref: React.ForwardedRef<HTMLDivElement>) {
   const { variant = ETagVariant.OUTLINED, className = "", size = ETagSize.SM, children, ...rest } = props;
 
   const style = getTagStyle(variant, size);
diff --git a/packages/ui/src/tooltip/tooltip.tsx b/packages/ui/src/tooltip/tooltip.tsx
index 677a9ef66..2946b1d0a 100644
--- a/packages/ui/src/tooltip/tooltip.tsx
+++ b/packages/ui/src/tooltip/tooltip.tsx
@@ -33,7 +33,7 @@ interface ITooltipProps {
   renderByDefault?: boolean;
 }
 
-export const Tooltip: React.FC<ITooltipProps> = ({
+export function Tooltip({
   tooltipHeading,
   tooltipContent,
   position = "top",
@@ -43,8 +43,10 @@ export const Tooltip: React.FC<ITooltipProps> = ({
   openDelay = 200,
   closeDelay,
   isMobile = false,
-  renderByDefault = true, //FIXME: tooltip should always render on hover and not by default, this is a temporary fix
-}) => {
+
+  //FIXME: tooltip should always render on hover and not by default, this is a temporary fix
+  renderByDefault = true,
+}: ITooltipProps) {
   const toolTipRef = useRef<HTMLDivElement | null>(null);
 
   const [shouldRender, setShouldRender] = useState(renderByDefault);
@@ -107,4 +109,4 @@ export const Tooltip: React.FC<ITooltipProps> = ({
       }
     />
   );
-};
+}
diff --git a/packages/ui/src/typography/sub-heading.tsx b/packages/ui/src/typography/sub-heading.tsx
index 094d041ef..93e4f0673 100644
--- a/packages/ui/src/typography/sub-heading.tsx
+++ b/packages/ui/src/typography/sub-heading.tsx
@@ -6,10 +6,13 @@ type Props = {
   className?: string;
   noMargin?: boolean;
 };
-const SubHeading = ({ children, className, noMargin }: Props) => (
-  <h3 className={cn("text-xl font-medium text-custom-text-200 block leading-7", !noMargin && "mb-2", className)}>
-    {children}
-  </h3>
-);
+
+function SubHeading({ children, className, noMargin }: Props) {
+  return (
+    <h3 className={cn("text-xl font-medium text-custom-text-200 block leading-7", !noMargin && "mb-2", className)}>
+      {children}
+    </h3>
+  );
+}
 
 export { SubHeading };
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index bdea5148e..eb53f26b5 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -734,6 +734,21 @@ importers:
         specifier: ^5.1.4
         version: 5.1.4(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))
 
+  packages/codemods:
+    devDependencies:
+      '@hypermod/utils':
+        specifier: ^0.7.1
+        version: 0.7.1
+      '@types/jscodeshift':
+        specifier: ^17.3.0
+        version: 17.3.0
+      jscodeshift:
+        specifier: ^17.3.0
+        version: 17.3.0
+      vitest:
+        specifier: ^4.0.8
+        version: 4.0.8(@types/debug@4.1.12)(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)
+
   packages/constants:
     dependencies:
       '@plane/types':
@@ -1674,6 +1689,12 @@ packages:
     engines: {node: '>=6.0.0'}
     hasBin: true
 
+  '@babel/plugin-syntax-flow@7.27.1':
+    resolution: {integrity: sha512-p9OkPbZ5G7UT1MofwYFigGebnrzGJacoBSQM0/6bi/PUMVE+qlWDD/OalvQKbwgQzU6dl0xAv6r4X7Jme0RYxA==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
   '@babel/plugin-syntax-jsx@7.27.1':
     resolution: {integrity: sha512-y8YTNIeKoyhGd9O0Jiyzyyqk8gdjnumGTQPsz0xOZOQ2RmkVJeZ1vmmfIvFEKqucBG6axJGBZDE/7iI5suUI/w==}
     engines: {node: '>=6.9.0'}
@@ -1686,24 +1707,66 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
+  '@babel/plugin-transform-class-properties@7.27.1':
+    resolution: {integrity: sha512-D0VcalChDMtuRvJIu3U/fwWjf8ZMykz5iZsg77Nuj821vCKI3zCyRLwRdWbsuJ/uRwZhZ002QtCqIkwC/ZkvbA==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/plugin-transform-flow-strip-types@7.27.1':
+    resolution: {integrity: sha512-G5eDKsu50udECw7DL2AcsysXiQyB7Nfg521t2OAJ4tbfTJ27doHLeF/vlI1NZGlLdbb/v+ibvtL1YBQqYOwJGg==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
   '@babel/plugin-transform-modules-commonjs@7.27.1':
     resolution: {integrity: sha512-OJguuwlTYlN0gBZFRPqwOGNWssZjfIUdS7HMYtN8c1KmwpwHFBwTeFZrg9XZa+DFTitWOW5iTAG7tyCUPsCCyw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
+  '@babel/plugin-transform-nullish-coalescing-operator@7.27.1':
+    resolution: {integrity: sha512-aGZh6xMo6q9vq1JGcw58lZ1Z0+i0xB2x0XaauNIUXd6O1xXc3RwoWEBlsTQrY4KQ9Jf0s5rgD6SiNkaUdJegTA==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/plugin-transform-optional-chaining@7.28.5':
+    resolution: {integrity: sha512-N6fut9IZlPnjPwgiQkXNhb+cT8wQKFlJNqcZkWlcTqkcqx6/kU4ynGmLFoa4LViBSirn05YAwk+sQBbPfxtYzQ==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/plugin-transform-private-methods@7.27.1':
+    resolution: {integrity: sha512-10FVt+X55AjRAYI9BrdISN9/AQWHqldOeZDUoLyif1Kn05a56xVBXb8ZouL8pZ9jem8QpXaOt8TS7RHUIS+GPA==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
   '@babel/plugin-transform-typescript@7.28.0':
     resolution: {integrity: sha512-4AEiDEBPIZvLQaWlc9liCavE0xRM0dNca41WtBeM3jgFptfUOSG9z0uteLhq6+3rq+WB6jIvUwKDTpXEHPJ2Vg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
+  '@babel/preset-flow@7.27.1':
+    resolution: {integrity: sha512-ez3a2it5Fn6P54W8QkbfIyyIbxlXvcxyWHHvno1Wg0Ej5eiJY5hBb8ExttoIOJJk7V2dZE6prP7iby5q2aQ0Lg==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
   '@babel/preset-typescript@7.27.1':
     resolution: {integrity: sha512-l7WfQfX0WK4M0v2RudjuQK4u99BS6yLHYEmdtVPP7lKV013zr9DygFuWNlnbvQ9LR+LS0Egz/XAvGx5U9MX0fQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
+  '@babel/register@7.28.3':
+    resolution: {integrity: sha512-CieDOtd8u208eI49bYl4z1J22ySFw87IGwE+IswFEExH7e3rLgKb0WNQeumnacQ1+VoDJLYI5QFA3AJZuyZQfA==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
   '@babel/runtime@7.26.10':
     resolution: {integrity: sha512-2WJMeRQPHKSPemqk/awGrAiuFfzBmOIPXKizAsVhWH9YJqLZ0H+HS4c8loHGgW6utJ3E/ejXQUsiGaQy2NZ9Fw==}
     engines: {node: '>=6.9.0'}
@@ -2076,6 +2139,10 @@ packages:
     resolution: {integrity: sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA==}
     deprecated: Use @eslint/object-schema instead
 
+  '@hypermod/utils@0.7.1':
+    resolution: {integrity: sha512-bo8A75w3Xd3vbOin4BPNEDaIyL0ghw/NmWgJXpugx3mnNzPezwLnNeT5/qD3j6xpbKLfIlmYhxFLFsE+xiZ/zw==}
+    engines: {node: '>=20.17'}
+
   '@hypnosphi/create-react-context@0.3.1':
     resolution: {integrity: sha512-V1klUed202XahrWJLLOT3EXNeCpFHCcJntdFGI15ntCwau+jfT386w7OFTMaCqOgXUH1fa0w/I1oZs+i/Rfr0A==}
     peerDependencies:
@@ -3223,6 +3290,9 @@ packages:
     resolution: {integrity: sha512-fMR2d+EHwbzBa0S1fp45SNUTProxmyFBp+DeBWWQOSP9IU6AH6ea2rqrpMAnp/skkcdW4z4LSRrOEpMZ5rWXLw==}
     engines: {node: '>= 14'}
 
+  '@standard-schema/spec@1.0.0':
+    resolution: {integrity: sha512-m2bOd0f2RT9k8QJx1JN85cZYyH1RqFBdlwtkSlf4tBDYLCiiZnv1fIIwacK6cqwXavOydf0NPToMQgpKq+dVlA==}
+
   '@storybook/addon-actions@8.6.14':
     resolution: {integrity: sha512-mDQxylxGGCQSK7tJPkD144J8jWh9IU9ziJMHfB84PKpI/V5ZgqMDnpr2bssTrUaGDqU5e1/z8KcRF+Melhs9pQ==}
     peerDependencies:
@@ -3948,6 +4018,9 @@ packages:
   '@types/http-errors@2.0.5':
     resolution: {integrity: sha512-r8Tayk8HJnX0FztbZN7oVqGccWgw98T/0neJphO91KkmOzug1KkofZURD4UaD5uH8AqcFLfdPErnBod0u71/qg==}
 
+  '@types/jscodeshift@17.3.0':
+    resolution: {integrity: sha512-ogvGG8VQQqAQQ096uRh+d6tBHrYuZjsumHirKtvBa5qEyTMN3IQJ7apo+sw9lxaB/iKWIhbbLlF3zmAWk9XQIg==}
+
   '@types/json-schema@7.0.15':
     resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
 
@@ -4235,6 +4308,9 @@ packages:
   '@vitest/expect@3.2.4':
     resolution: {integrity: sha512-Io0yyORnB6sikFlt8QW5K7slY4OjqNX9jmJQ02QDda8lyM6B5oNgVWoSoKPac8/kgnCUzuHQKrSLtu/uOqqrig==}
 
+  '@vitest/expect@4.0.8':
+    resolution: {integrity: sha512-Rv0eabdP/xjAHQGr8cjBm+NnLHNoL268lMDK85w2aAGLFoVKLd8QGnVon5lLtkXQCoYaNL0wg04EGnyKkkKhPA==}
+
   '@vitest/mocker@3.2.4':
     resolution: {integrity: sha512-46ryTE9RZO/rfDd7pEqFl7etuyzekzEhUbTW3BvmeO/BcCMEgq59BKhek3dXDWgAj4oMK6OZi+vRr1wPW6qjEQ==}
     peerDependencies:
@@ -4246,6 +4322,17 @@ packages:
       vite:
         optional: true
 
+  '@vitest/mocker@4.0.8':
+    resolution: {integrity: sha512-9FRM3MZCedXH3+pIh+ME5Up2NBBHDq0wqwhOKkN4VnvCiKbVxddqH9mSGPZeawjd12pCOGnl+lo/ZGHt0/dQSg==}
+    peerDependencies:
+      msw: ^2.4.9
+      vite: 7.1.11
+    peerDependenciesMeta:
+      msw:
+        optional: true
+      vite:
+        optional: true
+
   '@vitest/pretty-format@2.0.5':
     resolution: {integrity: sha512-h8k+1oWHfwTkyTkb9egzwNMfJAEx4veaPSnMeKbVSjp4euqGSbQlm5+6VHwTr7u4FJslVVsUG5nopCaAYdOmSQ==}
 
@@ -4255,12 +4342,24 @@ packages:
   '@vitest/pretty-format@3.2.4':
     resolution: {integrity: sha512-IVNZik8IVRJRTr9fxlitMKeJeXFFFN0JaB9PHPGQ8NKQbGpfjlTx9zO4RefN8gp7eqjNy8nyK3NZmBzOPeIxtA==}
 
+  '@vitest/pretty-format@4.0.8':
+    resolution: {integrity: sha512-qRrjdRkINi9DaZHAimV+8ia9Gq6LeGz2CgIEmMLz3sBDYV53EsnLZbJMR1q84z1HZCMsf7s0orDgZn7ScXsZKg==}
+
+  '@vitest/runner@4.0.8':
+    resolution: {integrity: sha512-mdY8Sf1gsM8hKJUQfiPT3pn1n8RF4QBcJYFslgWh41JTfrK1cbqY8whpGCFzBl45LN028g0njLCYm0d7XxSaQQ==}
+
+  '@vitest/snapshot@4.0.8':
+    resolution: {integrity: sha512-Nar9OTU03KGiubrIOFhcfHg8FYaRaNT+bh5VUlNz8stFhCZPNrJvmZkhsr1jtaYvuefYFwK2Hwrq026u4uPWCw==}
+
   '@vitest/spy@2.0.5':
     resolution: {integrity: sha512-c/jdthAhvJdpfVuaexSrnawxZz6pywlTPe84LUB2m/4t3rl2fTo9NFGBG4oWgaD+FTgDDV8hJ/nibT7IfH3JfA==}
 
   '@vitest/spy@3.2.4':
     resolution: {integrity: sha512-vAfasCOe6AIK70iP5UD11Ac4siNUNJ9i/9PZ3NKx07sG6sUxeag1LWdNrMWeKKYBLlzuK+Gn65Yd5nyL6ds+nw==}
 
+  '@vitest/spy@4.0.8':
+    resolution: {integrity: sha512-nvGVqUunyCgZH7kmo+Ord4WgZ7lN0sOULYXUOYuHr55dvg9YvMz3izfB189Pgp28w0vWFbEEfNc/c3VTrqrXeA==}
+
   '@vitest/utils@2.0.5':
     resolution: {integrity: sha512-d8HKbqIcya+GR67mkZbrzhS5kKhtp8dQLcmRZLGTscGVg7yImT82cIrhtn2L8+VujWcy6KZweApgNmPsTAO/UQ==}
 
@@ -4270,6 +4369,9 @@ packages:
   '@vitest/utils@3.2.4':
     resolution: {integrity: sha512-fB2V0JFrQSMsCo9HiSq3Ezpdv4iYaXRG1Sx8edX3MwxfyNn83mKiGzOcH+Fkxt4MHxr3y42fQi1oeAInqgX2QA==}
 
+  '@vitest/utils@4.0.8':
+    resolution: {integrity: sha512-pdk2phO5NDvEFfUTxcTP8RFYjVj/kfLSPIN5ebP2Mu9kcIMeAQTbknqcFEyBcC4z2pJlJI9aS5UQjcYfhmKAow==}
+
   '@webassemblyjs/ast@1.14.1':
     resolution: {integrity: sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ==}
 
@@ -4684,6 +4786,10 @@ packages:
     resolution: {integrity: sha512-4zNhdJD/iOjSH0A05ea+Ke6MU5mmpQcbQsSOkgdaUMJ9zTlDTD/GYlwohmIE2u0gaxHYiVHEn1Fw9mZ/ktJWgw==}
     engines: {node: '>=18'}
 
+  chai@6.2.0:
+    resolution: {integrity: sha512-aUTnJc/JipRzJrNADXVvpVqi6CO0dn3nx4EVPxijri+fj3LUUDyZQOgVeW54Ob3Y1Xh9Iz8f+CgaCl8v0mn9bA==}
+    engines: {node: '>=18'}
+
   chalk-template@0.4.0:
     resolution: {integrity: sha512-/ghrgmhfY8RaSdeo43hNXxpoHAtxdbskUHjPpfqUWGttFgycUhYPGx3YZBCnUCvOa7Doivn1IZec3DEGFoMgLg==}
     engines: {node: '>=12'}
@@ -4768,6 +4874,10 @@ packages:
     resolution: {integrity: sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==}
     engines: {node: '>=12'}
 
+  clone-deep@4.0.1:
+    resolution: {integrity: sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==}
+    engines: {node: '>=6'}
+
   clone@2.1.2:
     resolution: {integrity: sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==}
     engines: {node: '>=0.8'}
@@ -5556,6 +5666,10 @@ packages:
     resolution: {integrity: sha512-eNTPlAD67BmP31LDINZ3U7HSF8l57TxOY2PmBJ1shpCvpnxBF93mWCE8YHBnXs8qiUZJc9WDcWIeC3a2HIAMfw==}
     engines: {node: '>=6'}
 
+  expect-type@1.2.2:
+    resolution: {integrity: sha512-JhFGDVJ7tmDJItKhYgJCGLOWjuK9vPxiXoUFLwLDc99NlmklilbiQJwoctZtt13+xMw91MCk/REan6MWHqDjyA==}
+    engines: {node: '>=12.0.0'}
+
   export-to-csv@1.4.0:
     resolution: {integrity: sha512-6CX17Cu+rC2Fi2CyZ4CkgVG3hLl6BFsdAxfXiZkmDFIDY4mRx2y2spdeH6dqPHI9rP+AsHEfGeKz84Uuw7+Pmg==}
     engines: {node: ^v12.20.0 || >=v14.13.0}
@@ -5647,10 +5761,18 @@ packages:
     resolution: {integrity: sha512-6BN9trH7bp3qvnrRyzsBz+g3lZxTNZTbVO2EV1CS0WIcDbawYVdYvGflME/9QP0h0pYlCDBCTjYa9nZzMDpyxQ==}
     engines: {node: '>= 0.8'}
 
+  find-cache-dir@2.1.0:
+    resolution: {integrity: sha512-Tq6PixE0w/VMFfCgbONnkiQIVol/JJL7nRMi20fqzA4NRs9AfeqMGeRdPi3wIhYkxjeBaWh2rxwapn5Tu3IqOQ==}
+    engines: {node: '>=6'}
+
   find-cache-dir@3.3.2:
     resolution: {integrity: sha512-wXZV5emFEjrridIgED11OoUKLxiYjAcqot/NJdAkOhlJ+vGzwhOAfcG5OX1jP+S0PcjEn8bdMJv+g2jwQ3Onig==}
     engines: {node: '>=8'}
 
+  find-up@3.0.0:
+    resolution: {integrity: sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==}
+    engines: {node: '>=6'}
+
   find-up@4.1.0:
     resolution: {integrity: sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==}
     engines: {node: '>=8'}
@@ -5676,6 +5798,10 @@ packages:
   flatted@3.3.3:
     resolution: {integrity: sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==}
 
+  flow-parser@0.291.0:
+    resolution: {integrity: sha512-MLqjFn72Dvndqrkjy280HaIs4AV9Z6nxVRmNPO3TjbYcipg4hR7QX7tEYZYsVvaaZWZPGe6Mithluk2aPGlDOw==}
+    engines: {node: '>=0.4.0'}
+
   fn.name@1.1.0:
     resolution: {integrity: sha512-GRnmB5gPyJpAhTQdSZTSp9uaPSvl09KoYcMQtsB9rQoOmzs9dH6ffeccH+Z+cv6P68Hu5bC6JjRh4Ah/mHSNRw==}
 
@@ -6168,6 +6294,10 @@ packages:
     resolution: {integrity: sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==}
     engines: {node: '>=12'}
 
+  is-plain-object@2.0.4:
+    resolution: {integrity: sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==}
+    engines: {node: '>=0.10.0'}
+
   is-port-reachable@4.0.0:
     resolution: {integrity: sha512-9UoipoxYmSk6Xy7QFgRv2HDyaysmgSG75TFQs6S+3pDM7ZhKTF/bskZV+0UlABHzKjNVhPjYCLfeZUEg1wXxig==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
@@ -6233,6 +6363,10 @@ packages:
     resolution: {integrity: sha512-LpB/54B+/2J5hqQ7imZHfdU31OlgQqx7ZicVlkm9kzg9/w8GKLEcFfJl/t7DCEDueOyBAD6zCCwTO6Fzs0NoEQ==}
     engines: {node: '>=16'}
 
+  isobject@3.0.1:
+    resolution: {integrity: sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==}
+    engines: {node: '>=0.10.0'}
+
   isomorphic.js@0.2.5:
     resolution: {integrity: sha512-PIeMbHqMt4DnUP3MA/Flc0HElYjMXArsw1qwJZcm9sqR8mq3l8NYizFMty0pWwE/tzIGH3EKK5+jes5mAr85yw==}
 
@@ -6266,6 +6400,16 @@ packages:
     resolution: {integrity: sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA==}
     hasBin: true
 
+  jscodeshift@17.3.0:
+    resolution: {integrity: sha512-LjFrGOIORqXBU+jwfC9nbkjmQfFldtMIoS6d9z2LG/lkmyNXsJAySPT+2SWXJEoE68/bCWcxKpXH37npftgmow==}
+    engines: {node: '>=16'}
+    hasBin: true
+    peerDependencies:
+      '@babel/preset-env': ^7.1.6
+    peerDependenciesMeta:
+      '@babel/preset-env':
+        optional: true
+
   jsdoc-type-pratt-parser@4.8.0:
     resolution: {integrity: sha512-iZ8Bdb84lWRuGHamRXFyML07r21pcwBrLkHEuHgEY5UbCouBwv7ECknDRKzsQIXMiqpPymqtIf8TC/shYKB5rw==}
     engines: {node: '>=12.0.0'}
@@ -6321,6 +6465,10 @@ packages:
   keyv@4.5.4:
     resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==}
 
+  kind-of@6.0.3:
+    resolution: {integrity: sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==}
+    engines: {node: '>=0.10.0'}
+
   kleur@4.1.5:
     resolution: {integrity: sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==}
     engines: {node: '>=6'}
@@ -6373,6 +6521,10 @@ packages:
     resolution: {integrity: sha512-3R/1M+yS3j5ou80Me59j7F9IMs4PXs3VqRrm0TU3AbKPxlmpoY1TNscJV/oGJXo8qCatFGTfDbY6W6ipGOYXfg==}
     engines: {node: '>=6.11.5'}
 
+  locate-path@3.0.0:
+    resolution: {integrity: sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==}
+    engines: {node: '>=6'}
+
   locate-path@5.0.0:
     resolution: {integrity: sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==}
     engines: {node: '>=8'}
@@ -6452,13 +6604,17 @@ packages:
     resolution: {integrity: sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==}
     hasBin: true
 
-  magic-string@0.30.19:
-    resolution: {integrity: sha512-2N21sPY9Ws53PZvsEpVtNuSW+ScYbQdp4b9qUaL+9QkHUrGFKo56Lg9Emg5s9V/qrtNBmiR01sYhUOwu3H+VOw==}
+  magic-string@0.30.21:
+    resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
 
   magic-string@0.30.8:
     resolution: {integrity: sha512-ISQTe55T2ao7XtlAStud6qwYPZjE4GK1S/BeVPus4jrq6JuOnQ00YKQC581RWhR122W7msZV263KzVeLoqidyQ==}
     engines: {node: '>=12'}
 
+  make-dir@2.1.0:
+    resolution: {integrity: sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==}
+    engines: {node: '>=6'}
+
   make-dir@3.1.0:
     resolution: {integrity: sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==}
     engines: {node: '>=8'}
@@ -7043,6 +7199,10 @@ packages:
     resolution: {integrity: sha512-5b0R4txpzjPWVw/cXXUResoD4hb6U/x9BH08L7nw+GN1sezDzPdxeRvpc9c433fZhBan/wusjbCsqwqm4EIBIQ==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
 
+  p-locate@3.0.0:
+    resolution: {integrity: sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==}
+    engines: {node: '>=6'}
+
   p-locate@4.1.0:
     resolution: {integrity: sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==}
     engines: {node: '>=8'}
@@ -7106,6 +7266,10 @@ packages:
   path-case@3.0.4:
     resolution: {integrity: sha512-qO4qCFjXqVTrcbPt/hQfhTQ+VhFsqNKOPtytgNKkKxSoEp3XPUQ8ObFuePylOIok5gjn69ry8XiULxCwot3Wfg==}
 
+  path-exists@3.0.0:
+    resolution: {integrity: sha512-bpC7GYwiDYQ4wYLe+FA8lhRjhQCMcQGuSgGGqDkg/QerRWw9CmGRT0iSOVRSZJ29NMLZgIzqaljJ63oaL4NIJQ==}
+    engines: {node: '>=4'}
+
   path-exists@4.0.0:
     resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==}
     engines: {node: '>=8'}
@@ -7174,10 +7338,18 @@ packages:
     resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
     engines: {node: '>=0.10.0'}
 
+  pify@4.0.1:
+    resolution: {integrity: sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==}
+    engines: {node: '>=6'}
+
   pirates@4.0.7:
     resolution: {integrity: sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==}
     engines: {node: '>= 6'}
 
+  pkg-dir@3.0.0:
+    resolution: {integrity: sha512-/E57AYkoeQ25qkxMj5PBOVgF8Kiu/h7cYS30Z5+R7WaiCCBfLq58ZI/dSeaEKb9WVJV5n/03QwrN3IeWIFllvw==}
+    engines: {node: '>=6'}
+
   pkg-dir@4.2.0:
     resolution: {integrity: sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==}
     engines: {node: '>=8'}
@@ -7886,6 +8058,10 @@ packages:
   scroll-into-view-if-needed@3.1.0:
     resolution: {integrity: sha512-49oNpRjWRvnU8NyGVmUaYG4jtTkNonFZI86MmGRDqBphEK2EXT9gdEUoQPZhuBM8yWHxCWbobltqYO5M4XrUvQ==}
 
+  semver@5.7.2:
+    resolution: {integrity: sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==}
+    hasBin: true
+
   semver@6.3.1:
     resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==}
     hasBin: true
@@ -7935,6 +8111,10 @@ packages:
   setprototypeof@1.2.0:
     resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==}
 
+  shallow-clone@3.0.1:
+    resolution: {integrity: sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==}
+    engines: {node: '>=8'}
+
   shebang-command@2.0.0:
     resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==}
     engines: {node: '>=8'}
@@ -7962,6 +8142,9 @@ packages:
     resolution: {integrity: sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==}
     engines: {node: '>= 0.4'}
 
+  siginfo@2.0.0:
+    resolution: {integrity: sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==}
+
   signal-exit@3.0.7:
     resolution: {integrity: sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==}
 
@@ -8014,6 +8197,9 @@ packages:
   stack-trace@0.0.10:
     resolution: {integrity: sha512-KGzahc7puUKkzyMt+IqAep+TVNbKP+k2Lmwhub39m1AsTSkaDutx56aDCo+HLDzf/D26BIHTJWNiTG1KAJiQCg==}
 
+  stackback@0.0.2:
+    resolution: {integrity: sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==}
+
   standard-as-callback@2.1.0:
     resolution: {integrity: sha512-qoRRSyROncaz1z0mvYqIE4lCd9p2R90i6GxW3uZv5ucSu8tU7B5HXUP1gG8pVZsYNVaXjk8ClXHPttLyxAL48A==}
 
@@ -8021,6 +8207,9 @@ packages:
     resolution: {integrity: sha512-RwNA9Z/7PrK06rYLIzFMlaF+l73iwpzsqRIFgbMLbTcLD6cOao82TaWefPXQvB2fOC4AjuYSEndS7N/mTCbkdQ==}
     engines: {node: '>= 0.8'}
 
+  std-env@3.10.0:
+    resolution: {integrity: sha512-5GS12FdOZNliM5mAOxFRg7Ir0pWz8MdpYm6AY6VPkGpbA7ZzmbzNcBJQ0GPvvyWgcY7QAhCgf9Uy89I03faLkg==}
+
   stop-iteration-iterator@1.1.0:
     resolution: {integrity: sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==}
     engines: {node: '>= 0.4'}
@@ -8243,9 +8432,15 @@ packages:
   tiny-invariant@1.3.3:
     resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==}
 
+  tinybench@2.9.0:
+    resolution: {integrity: sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==}
+
   tinycolor2@1.6.0:
     resolution: {integrity: sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==}
 
+  tinyexec@0.3.2:
+    resolution: {integrity: sha512-KQQR9yN7R5+OSwaK0XQoj22pwHoTlgYqmUscPYoknOoWCWfj/5/ABTMRi69FrKU5ffPVh5QcFikpWJI/P1ocHA==}
+
   tinyexec@1.0.1:
     resolution: {integrity: sha512-5uC6DDlmeqiOwCPmK9jMSdOuZTh8bU39Ys6yidB+UTt5hfZUPGAypSgFRiEp+jbi9qH40BLDvy85jIU88wKSqw==}
 
@@ -8261,6 +8456,10 @@ packages:
     resolution: {integrity: sha512-op4nsTR47R6p0vMUUoYl/a+ljLFVtlfaXkLQmqfLR1qHma1h/ysYk4hEXZ880bf2CYgTskvTa/e196Vd5dDQXw==}
     engines: {node: '>=14.0.0'}
 
+  tinyrainbow@3.0.3:
+    resolution: {integrity: sha512-PSkbLUoxOFRzJYjjxHJt9xro7D+iilgMX/C9lawzVuYiIdcihh9DXmVibBe8lmcFrRi/VzlPjBxbN7rH24q8/Q==}
+    engines: {node: '>=14.0.0'}
+
   tinyspy@3.0.2:
     resolution: {integrity: sha512-n1cw8k1k0x4pgA2+9XrOkFydTerNcJ1zWCO5Nn9scWHTD+5tp8dghT2x1uduQePZTZgd3Tupf+x9BxJjeJi77Q==}
     engines: {node: '>=14.0.0'}
@@ -8277,6 +8476,10 @@ packages:
     peerDependencies:
       '@tiptap/core': ^2.0.3
 
+  tmp@0.2.5:
+    resolution: {integrity: sha512-voyz6MApa1rQGUxT3E+BK7/ROe8itEx7vD8/HEvt4xwXucvQ5G5oeEiHkmHZJuBO21RpOf+YYm9MOivj709jow==}
+    engines: {node: '>=14.14'}
+
   to-regex-range@5.0.1:
     resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
     engines: {node: '>=8.0'}
@@ -8707,6 +8910,40 @@ packages:
       yaml:
         optional: true
 
+  vitest@4.0.8:
+    resolution: {integrity: sha512-urzu3NCEV0Qa0Y2PwvBtRgmNtxhj5t5ULw7cuKhIHh3OrkKTLlut0lnBOv9qe5OvbkMH2g38G7KPDCTpIytBVg==}
+    engines: {node: ^20.0.0 || ^22.0.0 || >=24.0.0}
+    hasBin: true
+    peerDependencies:
+      '@edge-runtime/vm': '*'
+      '@types/debug': ^4.1.12
+      '@types/node': ^20.0.0 || ^22.0.0 || >=24.0.0
+      '@vitest/browser-playwright': 4.0.8
+      '@vitest/browser-preview': 4.0.8
+      '@vitest/browser-webdriverio': 4.0.8
+      '@vitest/ui': 4.0.8
+      happy-dom: 20.0.2
+      jsdom: '*'
+    peerDependenciesMeta:
+      '@edge-runtime/vm':
+        optional: true
+      '@types/debug':
+        optional: true
+      '@types/node':
+        optional: true
+      '@vitest/browser-playwright':
+        optional: true
+      '@vitest/browser-preview':
+        optional: true
+      '@vitest/browser-webdriverio':
+        optional: true
+      '@vitest/ui':
+        optional: true
+      happy-dom:
+        optional: true
+      jsdom:
+        optional: true
+
   w3c-keyname@2.2.8:
     resolution: {integrity: sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ==}
 
@@ -8792,6 +9029,11 @@ packages:
     engines: {node: ^16.13.0 || >=18.0.0}
     hasBin: true
 
+  why-is-node-running@2.3.0:
+    resolution: {integrity: sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==}
+    engines: {node: '>=8'}
+    hasBin: true
+
   widest-line@4.0.1:
     resolution: {integrity: sha512-o0cyEG0e8GPzT4iGHphIOh0cJOV8fivsXxddQasHPHfoZf1ZexrfeA21w2NaEN1RHE+fXlfISmOE8R9N3u3Qig==}
     engines: {node: '>=12'}
@@ -8816,6 +9058,10 @@ packages:
     resolution: {integrity: sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==}
     engines: {node: '>=12'}
 
+  write-file-atomic@5.0.1:
+    resolution: {integrity: sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==}
+    engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
+
   ws@7.5.10:
     resolution: {integrity: sha512-+dbF1tHwZpXcbOJdVOkzLDxZP1ailvSxM6ZweXTegylPny803bFhA+vqBYw4s31NSAk4S2Qz+AKXK9a4wkdjcQ==}
     engines: {node: '>=8.3.0'}
@@ -9076,6 +9322,11 @@ snapshots:
     dependencies:
       '@babel/types': 7.28.4
 
+  '@babel/plugin-syntax-flow@7.27.1(@babel/core@7.28.4)':
+    dependencies:
+      '@babel/core': 7.28.4
+      '@babel/helper-plugin-utils': 7.27.1
+
   '@babel/plugin-syntax-jsx@7.27.1(@babel/core@7.28.4)':
     dependencies:
       '@babel/core': 7.28.4
@@ -9086,6 +9337,20 @@ snapshots:
       '@babel/core': 7.28.4
       '@babel/helper-plugin-utils': 7.27.1
 
+  '@babel/plugin-transform-class-properties@7.27.1(@babel/core@7.28.4)':
+    dependencies:
+      '@babel/core': 7.28.4
+      '@babel/helper-create-class-features-plugin': 7.28.3(@babel/core@7.28.4)
+      '@babel/helper-plugin-utils': 7.27.1
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/plugin-transform-flow-strip-types@7.27.1(@babel/core@7.28.4)':
+    dependencies:
+      '@babel/core': 7.28.4
+      '@babel/helper-plugin-utils': 7.27.1
+      '@babel/plugin-syntax-flow': 7.27.1(@babel/core@7.28.4)
+
   '@babel/plugin-transform-modules-commonjs@7.27.1(@babel/core@7.28.4)':
     dependencies:
       '@babel/core': 7.28.4
@@ -9094,6 +9359,27 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@babel/plugin-transform-nullish-coalescing-operator@7.27.1(@babel/core@7.28.4)':
+    dependencies:
+      '@babel/core': 7.28.4
+      '@babel/helper-plugin-utils': 7.27.1
+
+  '@babel/plugin-transform-optional-chaining@7.28.5(@babel/core@7.28.4)':
+    dependencies:
+      '@babel/core': 7.28.4
+      '@babel/helper-plugin-utils': 7.27.1
+      '@babel/helper-skip-transparent-expression-wrappers': 7.27.1
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/plugin-transform-private-methods@7.27.1(@babel/core@7.28.4)':
+    dependencies:
+      '@babel/core': 7.28.4
+      '@babel/helper-create-class-features-plugin': 7.28.3(@babel/core@7.28.4)
+      '@babel/helper-plugin-utils': 7.27.1
+    transitivePeerDependencies:
+      - supports-color
+
   '@babel/plugin-transform-typescript@7.28.0(@babel/core@7.28.4)':
     dependencies:
       '@babel/core': 7.28.4
@@ -9105,6 +9391,13 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@babel/preset-flow@7.27.1(@babel/core@7.28.4)':
+    dependencies:
+      '@babel/core': 7.28.4
+      '@babel/helper-plugin-utils': 7.27.1
+      '@babel/helper-validator-option': 7.27.1
+      '@babel/plugin-transform-flow-strip-types': 7.27.1(@babel/core@7.28.4)
+
   '@babel/preset-typescript@7.27.1(@babel/core@7.28.4)':
     dependencies:
       '@babel/core': 7.28.4
@@ -9116,6 +9409,15 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@babel/register@7.28.3(@babel/core@7.28.4)':
+    dependencies:
+      '@babel/core': 7.28.4
+      clone-deep: 4.0.1
+      find-cache-dir: 2.1.0
+      make-dir: 2.1.0
+      pirates: 4.0.7
+      source-map-support: 0.5.21
+
   '@babel/runtime@7.26.10':
     dependencies:
       regenerator-runtime: 0.14.1
@@ -9517,6 +9819,13 @@ snapshots:
 
   '@humanwhocodes/object-schema@2.0.3': {}
 
+  '@hypermod/utils@0.7.1':
+    dependencies:
+      jscodeshift: 17.3.0
+    transitivePeerDependencies:
+      - '@babel/preset-env'
+      - supports-color
+
   '@hypnosphi/create-react-context@0.3.1(prop-types@15.8.1)(react@18.3.1)':
     dependencies:
       gud: 1.0.0
@@ -9550,7 +9859,7 @@ snapshots:
   '@joshwooding/vite-plugin-react-docgen-typescript@0.6.1(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))':
     dependencies:
       glob: 11.1.0
-      magic-string: 0.30.19
+      magic-string: 0.30.21
       react-docgen-typescript: 2.4.0(typescript@5.8.3)
       vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)
     optionalDependencies:
@@ -10751,6 +11060,8 @@ snapshots:
       - encoding
       - supports-color
 
+  '@standard-schema/spec@1.0.0': {}
+
   '@storybook/addon-actions@8.6.14(storybook@8.6.14(prettier@3.6.2))':
     dependencies:
       '@storybook/global': 5.0.0
@@ -10915,7 +11226,7 @@ snapshots:
       es-module-lexer: 1.7.0
       fork-ts-checker-webpack-plugin: 8.0.0(typescript@5.8.3)(webpack@5.101.3(@swc/core@1.13.5(@swc/helpers@0.5.17))(esbuild@0.25.0))
       html-webpack-plugin: 5.6.4(webpack@5.101.3(@swc/core@1.13.5(@swc/helpers@0.5.17))(esbuild@0.25.0))
-      magic-string: 0.30.19
+      magic-string: 0.30.21
       path-browserify: 1.0.1
       process: 0.11.10
       semver: 7.7.2
@@ -11007,7 +11318,7 @@ snapshots:
       '@storybook/react-docgen-typescript-plugin': 1.0.6--canary.9.0c3f3b7.0(typescript@5.8.3)(webpack@5.101.3(@swc/core@1.13.5(@swc/helpers@0.5.17))(esbuild@0.25.0))
       '@types/semver': 7.7.1
       find-up: 5.0.0
-      magic-string: 0.30.19
+      magic-string: 0.30.21
       react: 18.3.1
       react-docgen: 7.1.1
       react-dom: 18.3.1(react@18.3.1)
@@ -11063,7 +11374,7 @@ snapshots:
       '@storybook/builder-vite': 9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))
       '@storybook/react': 9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3)
       find-up: 7.0.0
-      magic-string: 0.30.19
+      magic-string: 0.30.21
       react: 18.3.1
       react-docgen: 8.0.1
       react-dom: 18.3.1(react@18.3.1)
@@ -11658,6 +11969,11 @@ snapshots:
 
   '@types/http-errors@2.0.5': {}
 
+  '@types/jscodeshift@17.3.0':
+    dependencies:
+      ast-types: 0.16.1
+      recast: 0.23.11
+
   '@types/json-schema@7.0.15': {}
 
   '@types/json5@0.0.29': {}
@@ -11950,11 +12266,28 @@ snapshots:
       chai: 5.3.3
       tinyrainbow: 2.0.0
 
+  '@vitest/expect@4.0.8':
+    dependencies:
+      '@standard-schema/spec': 1.0.0
+      '@types/chai': 5.2.2
+      '@vitest/spy': 4.0.8
+      '@vitest/utils': 4.0.8
+      chai: 6.2.0
+      tinyrainbow: 3.0.3
+
   '@vitest/mocker@3.2.4(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))':
     dependencies:
       '@vitest/spy': 3.2.4
       estree-walker: 3.0.3
-      magic-string: 0.30.19
+      magic-string: 0.30.21
+    optionalDependencies:
+      vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)
+
+  '@vitest/mocker@4.0.8(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))':
+    dependencies:
+      '@vitest/spy': 4.0.8
+      estree-walker: 3.0.3
+      magic-string: 0.30.21
     optionalDependencies:
       vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)
 
@@ -11970,6 +12303,21 @@ snapshots:
     dependencies:
       tinyrainbow: 2.0.0
 
+  '@vitest/pretty-format@4.0.8':
+    dependencies:
+      tinyrainbow: 3.0.3
+
+  '@vitest/runner@4.0.8':
+    dependencies:
+      '@vitest/utils': 4.0.8
+      pathe: 2.0.3
+
+  '@vitest/snapshot@4.0.8':
+    dependencies:
+      '@vitest/pretty-format': 4.0.8
+      magic-string: 0.30.21
+      pathe: 2.0.3
+
   '@vitest/spy@2.0.5':
     dependencies:
       tinyspy: 3.0.2
@@ -11978,6 +12326,8 @@ snapshots:
     dependencies:
       tinyspy: 4.0.3
 
+  '@vitest/spy@4.0.8': {}
+
   '@vitest/utils@2.0.5':
     dependencies:
       '@vitest/pretty-format': 2.0.5
@@ -11997,6 +12347,11 @@ snapshots:
       loupe: 3.2.1
       tinyrainbow: 2.0.0
 
+  '@vitest/utils@4.0.8':
+    dependencies:
+      '@vitest/pretty-format': 4.0.8
+      tinyrainbow: 3.0.3
+
   '@webassemblyjs/ast@1.14.1':
     dependencies:
       '@webassemblyjs/helper-numbers': 1.13.2
@@ -12474,6 +12829,8 @@ snapshots:
       loupe: 3.2.1
       pathval: 2.0.1
 
+  chai@6.2.0: {}
+
   chalk-template@0.4.0:
     dependencies:
       chalk: 4.1.2
@@ -12563,6 +12920,12 @@ snapshots:
       strip-ansi: 6.0.1
       wrap-ansi: 7.0.0
 
+  clone-deep@4.0.1:
+    dependencies:
+      is-plain-object: 2.0.4
+      kind-of: 6.0.3
+      shallow-clone: 3.0.1
+
   clone@2.1.2: {}
 
   clsx@2.1.1: {}
@@ -13468,6 +13831,8 @@ snapshots:
 
   exit-hook@2.2.1: {}
 
+  expect-type@1.2.2: {}
+
   export-to-csv@1.4.0: {}
 
   express-winston@4.2.0(winston@3.17.0):
@@ -13591,12 +13956,22 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  find-cache-dir@2.1.0:
+    dependencies:
+      commondir: 1.0.1
+      make-dir: 2.1.0
+      pkg-dir: 3.0.0
+
   find-cache-dir@3.3.2:
     dependencies:
       commondir: 1.0.1
       make-dir: 3.1.0
       pkg-dir: 4.2.0
 
+  find-up@3.0.0:
+    dependencies:
+      locate-path: 3.0.0
+
   find-up@4.1.0:
     dependencies:
       locate-path: 5.0.0
@@ -13627,6 +14002,8 @@ snapshots:
 
   flatted@3.3.3: {}
 
+  flow-parser@0.291.0: {}
+
   fn.name@1.1.0: {}
 
   follow-redirects@1.15.11: {}
@@ -14197,6 +14574,10 @@ snapshots:
 
   is-plain-obj@4.1.0: {}
 
+  is-plain-object@2.0.4:
+    dependencies:
+      isobject: 3.0.1
+
   is-port-reachable@4.0.0: {}
 
   is-regex@1.2.1:
@@ -14254,6 +14635,8 @@ snapshots:
 
   isexe@3.1.1: {}
 
+  isobject@3.0.1: {}
+
   isomorphic.js@0.2.5: {}
 
   iterator.prototype@1.1.5:
@@ -14289,6 +14672,29 @@ snapshots:
     dependencies:
       argparse: 2.0.1
 
+  jscodeshift@17.3.0:
+    dependencies:
+      '@babel/core': 7.28.4
+      '@babel/parser': 7.28.4
+      '@babel/plugin-transform-class-properties': 7.27.1(@babel/core@7.28.4)
+      '@babel/plugin-transform-modules-commonjs': 7.27.1(@babel/core@7.28.4)
+      '@babel/plugin-transform-nullish-coalescing-operator': 7.27.1(@babel/core@7.28.4)
+      '@babel/plugin-transform-optional-chaining': 7.28.5(@babel/core@7.28.4)
+      '@babel/plugin-transform-private-methods': 7.27.1(@babel/core@7.28.4)
+      '@babel/preset-flow': 7.27.1(@babel/core@7.28.4)
+      '@babel/preset-typescript': 7.27.1(@babel/core@7.28.4)
+      '@babel/register': 7.28.3(@babel/core@7.28.4)
+      flow-parser: 0.291.0
+      graceful-fs: 4.2.11
+      micromatch: 4.0.8
+      neo-async: 2.6.2
+      picocolors: 1.1.1
+      recast: 0.23.11
+      tmp: 0.2.5
+      write-file-atomic: 5.0.1
+    transitivePeerDependencies:
+      - supports-color
+
   jsdoc-type-pratt-parser@4.8.0: {}
 
   jsesc@3.0.2: {}
@@ -14334,6 +14740,8 @@ snapshots:
     dependencies:
       json-buffer: 3.0.1
 
+  kind-of@6.0.3: {}
+
   kleur@4.1.5: {}
 
   kuler@2.0.0: {}
@@ -14386,6 +14794,11 @@ snapshots:
 
   loader-runner@4.3.0: {}
 
+  locate-path@3.0.0:
+    dependencies:
+      p-locate: 3.0.0
+      path-exists: 3.0.0
+
   locate-path@5.0.0:
     dependencies:
       p-locate: 4.1.0
@@ -14457,7 +14870,7 @@ snapshots:
 
   lz-string@1.5.0: {}
 
-  magic-string@0.30.19:
+  magic-string@0.30.21:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.5
 
@@ -14465,6 +14878,11 @@ snapshots:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.5
 
+  make-dir@2.1.0:
+    dependencies:
+      pify: 4.0.1
+      semver: 5.7.2
+
   make-dir@3.1.0:
     dependencies:
       semver: 6.3.1
@@ -15325,6 +15743,10 @@ snapshots:
     dependencies:
       yocto-queue: 1.2.1
 
+  p-locate@3.0.0:
+    dependencies:
+      p-limit: 2.3.0
+
   p-locate@4.1.0:
     dependencies:
       p-limit: 2.3.0
@@ -15385,6 +15807,8 @@ snapshots:
       dot-case: 3.0.4
       tslib: 2.8.1
 
+  path-exists@3.0.0: {}
+
   path-exists@4.0.0: {}
 
   path-exists@5.0.0: {}
@@ -15432,8 +15856,14 @@ snapshots:
 
   pify@2.3.0: {}
 
+  pify@4.0.1: {}
+
   pirates@4.0.7: {}
 
+  pkg-dir@3.0.0:
+    dependencies:
+      find-up: 3.0.0
+
   pkg-dir@4.2.0:
     dependencies:
       find-up: 4.1.0
@@ -16190,7 +16620,7 @@ snapshots:
       debug: 4.4.3
       dts-resolver: 2.1.2
       get-tsconfig: 4.10.1
-      magic-string: 0.30.19
+      magic-string: 0.30.21
       rolldown: 1.0.0-beta.34
     optionalDependencies:
       typescript: 5.8.3
@@ -16311,6 +16741,8 @@ snapshots:
     dependencies:
       compute-scroll-into-view: 3.1.1
 
+  semver@5.7.2: {}
+
   semver@6.3.1: {}
 
   semver@7.7.2: {}
@@ -16404,6 +16836,10 @@ snapshots:
 
   setprototypeof@1.2.0: {}
 
+  shallow-clone@3.0.1:
+    dependencies:
+      kind-of: 6.0.3
+
   shebang-command@2.0.0:
     dependencies:
       shebang-regex: 3.0.0
@@ -16440,6 +16876,8 @@ snapshots:
       side-channel-map: 1.0.1
       side-channel-weakmap: 1.0.2
 
+  siginfo@2.0.0: {}
+
   signal-exit@3.0.7: {}
 
   signal-exit@4.1.0: {}
@@ -16488,10 +16926,14 @@ snapshots:
 
   stack-trace@0.0.10: {}
 
+  stackback@0.0.2: {}
+
   standard-as-callback@2.1.0: {}
 
   statuses@2.0.1: {}
 
+  std-env@3.10.0: {}
+
   stop-iteration-iterator@1.1.0:
     dependencies:
       es-errors: 1.3.0
@@ -16760,8 +17202,12 @@ snapshots:
 
   tiny-invariant@1.3.3: {}
 
+  tinybench@2.9.0: {}
+
   tinycolor2@1.6.0: {}
 
+  tinyexec@0.3.2: {}
+
   tinyexec@1.0.1: {}
 
   tinyglobby@0.2.15:
@@ -16773,6 +17219,8 @@ snapshots:
 
   tinyrainbow@2.0.0: {}
 
+  tinyrainbow@3.0.3: {}
+
   tinyspy@3.0.2: {}
 
   tinyspy@4.0.3: {}
@@ -16789,6 +17237,8 @@ snapshots:
       markdown-it-task-lists: 2.1.1
       prosemirror-markdown: 1.13.2
 
+  tmp@0.2.5: {}
+
   to-regex-range@5.0.1:
     dependencies:
       is-number: 7.0.0
@@ -17280,6 +17730,45 @@ snapshots:
       terser: 5.43.1
       yaml: 2.8.1
 
+  vitest@4.0.8(@types/debug@4.1.12)(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1):
+    dependencies:
+      '@vitest/expect': 4.0.8
+      '@vitest/mocker': 4.0.8(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))
+      '@vitest/pretty-format': 4.0.8
+      '@vitest/runner': 4.0.8
+      '@vitest/snapshot': 4.0.8
+      '@vitest/spy': 4.0.8
+      '@vitest/utils': 4.0.8
+      debug: 4.4.3
+      es-module-lexer: 1.7.0
+      expect-type: 1.2.2
+      magic-string: 0.30.21
+      pathe: 2.0.3
+      picomatch: 4.0.3
+      std-env: 3.10.0
+      tinybench: 2.9.0
+      tinyexec: 0.3.2
+      tinyglobby: 0.2.15
+      tinyrainbow: 3.0.3
+      vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)
+      why-is-node-running: 2.3.0
+    optionalDependencies:
+      '@types/debug': 4.1.12
+      '@types/node': 22.12.0
+    transitivePeerDependencies:
+      - jiti
+      - less
+      - lightningcss
+      - msw
+      - sass
+      - sass-embedded
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+      - tsx
+      - yaml
+
   w3c-keyname@2.2.8: {}
 
   warning@4.0.3:
@@ -17409,6 +17898,11 @@ snapshots:
     dependencies:
       isexe: 3.1.1
 
+  why-is-node-running@2.3.0:
+    dependencies:
+      siginfo: 2.0.0
+      stackback: 0.0.2
+
   widest-line@4.0.1:
     dependencies:
       string-width: 5.1.2
@@ -17447,6 +17941,11 @@ snapshots:
       string-width: 5.1.2
       strip-ansi: 7.1.2
 
+  write-file-atomic@5.0.1:
+    dependencies:
+      imurmurhash: 0.1.4
+      signal-exit: 4.1.0
+
   ws@7.5.10: {}
 
   ws@8.18.3: {}