diff --git a/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/page.tsx b/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/page.tsx
index e117d0ab21c..735474cd4d2 100644
--- a/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/page.tsx
+++ b/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/page.tsx
@@ -6,6 +6,7 @@ import { useParams } from "next/navigation";
 import { useTheme } from "next-themes";
 import useSWR from "swr";
 // plane imports
+import { EIssueServiceType } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Loader } from "@plane/ui";
 // components
@@ -16,6 +17,7 @@ import { IssueDetailRoot } from "@/components/issues";
 import { useAppTheme, useIssueDetail, useProject } from "@/hooks/store";
 // assets
 import { useAppRouter } from "@/hooks/use-app-router";
+import { useWorkItemProperties } from "@/plane-web/hooks/use-issue-properties";
 import { ProjectAuthWrapper } from "@/plane-web/layouts/project-wrapper";
 import emptyIssueDark from "@/public/empty-state/search/issues-dark.webp";
 import emptyIssueLight from "@/public/empty-state/search/issues-light.webp";
@@ -53,6 +55,13 @@ const IssueDetailsPage = observer(() => {
   const issueLoader = !issue || isLoading;
   const pageTitle = project && issue ? `${project?.identifier}-${issue?.sequence_id} ${issue?.name}` : undefined;
 
+  useWorkItemProperties(
+    projectId,
+    workspaceSlug.toString(),
+    issueId,
+    issue?.is_epic ? EIssueServiceType.EPICS : EIssueServiceType.ISSUES
+  );
+
   useEffect(() => {
     const handleToggleIssueDetailSidebar = () => {
       if (window && window.innerWidth < 768) {
diff --git a/web/ce/hooks/use-issue-properties.tsx b/web/ce/hooks/use-issue-properties.tsx
new file mode 100644
index 00000000000..c4d35d6add2
--- /dev/null
+++ b/web/ce/hooks/use-issue-properties.tsx
@@ -0,0 +1,10 @@
+import { TIssueServiceType } from "@plane/types";
+
+export const useWorkItemProperties = (
+  projectId: string | null | undefined,
+  workspaceSlug: string | null | undefined,
+  workItemId: string | null | undefined,
+  issueServiceType: TIssueServiceType
+) => {
+  if (!projectId || !workspaceSlug || !workItemId) return;
+};
diff --git a/web/core/components/issues/peek-overview/root.tsx b/web/core/components/issues/peek-overview/root.tsx
index 9d6653440ef..5ea7855bb8d 100644
--- a/web/core/components/issues/peek-overview/root.tsx
+++ b/web/core/components/issues/peek-overview/root.tsx
@@ -12,6 +12,7 @@ import {
   ISSUE_RESTORED,
   EUserPermissions,
   EUserPermissionsLevel,
+  EIssueServiceType,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { TIssue, IWorkItemPeekOverview } from "@plane/types";
@@ -23,6 +24,7 @@ import { IssueView, TIssueOperations } from "@/components/issues";
 // hooks
 import { useEventTracker, useIssueDetail, useIssues, useUserPermissions } from "@/hooks/store";
 import { useIssueStoreType } from "@/hooks/use-issue-layout-store";
+import { useWorkItemProperties } from "@/plane-web/hooks/use-issue-properties";
 
 
 export const IssuePeekOverview: FC<IWorkItemPeekOverview> = observer((props) => {
@@ -51,6 +53,13 @@ export const IssuePeekOverview: FC<IWorkItemPeekOverview> = observer((props) =>
   const storeType = issueStoreFromProps ?? issueStoreType;
   const { issues } = useIssues(storeType);
   const { captureIssueEvent } = useEventTracker();
+
+  useWorkItemProperties(
+    peekIssue?.projectId,
+    peekIssue?.workspaceSlug,
+    peekIssue?.issueId,
+    storeType === EIssuesStoreType.EPIC ? EIssueServiceType.EPICS : EIssueServiceType.ISSUES
+  );
   // state
   const [error, setError] = useState(false);
 
diff --git a/web/core/components/settings/content-wrapper.tsx b/web/core/components/settings/content-wrapper.tsx
index dce3d197cc5..87a695416e7 100644
--- a/web/core/components/settings/content-wrapper.tsx
+++ b/web/core/components/settings/content-wrapper.tsx
@@ -12,7 +12,7 @@ export const SettingsContentWrapper = observer((props: TProps) => {
   return (
     <div
       className={cn("flex flex-col w-full items-center mx-auto py-4 md:py-0", {
-        "md:p-4 max-w-[800px] 2xl:max-w-[1000px]": size === "md",
+        "md:px-4 max-w-[800px] 2xl:max-w-[1000px]": size === "md",
         "md:px-16": size === "lg",
       })}
     >
diff --git a/web/core/hooks/store/use-issue-detail.ts b/web/core/hooks/store/use-issue-detail.ts
index 309bfedbaaf..dd96ddf0568 100644
--- a/web/core/hooks/store/use-issue-detail.ts
+++ b/web/core/hooks/store/use-issue-detail.ts
@@ -4,7 +4,7 @@ import { TIssueServiceType } from "@plane/types";
 // mobx store
 import { StoreContext } from "@/lib/store-context";
 // types
-import { IIssueDetail } from "@/store/issue/issue-details/root.store";
+import { IIssueDetail } from "@/plane-web/store/issue/issue-details/root.store";
 
 export const useIssueDetail = (serviceType: TIssueServiceType = EIssueServiceType.ISSUES): IIssueDetail => {
   const context = useContext(StoreContext);
diff --git a/web/core/store/issue/issue-details/root.store.ts b/web/core/store/issue/issue-details/root.store.ts
index 1d795dd9409..69248ccec8a 100644
--- a/web/core/store/issue/issue-details/root.store.ts
+++ b/web/core/store/issue/issue-details/root.store.ts
@@ -114,7 +114,7 @@ export interface IIssueDetail
   relation: IIssueRelationStore;
 }
 
-export class IssueDetail implements IIssueDetail {
+export abstract class IssueDetail implements IIssueDetail {
   // observables
   peekIssue: TPeekIssue | undefined = undefined;
   relationKey: TIssueRelationTypes | null = null;
diff --git a/web/ee/hooks/use-issue-properties.tsx b/web/ee/hooks/use-issue-properties.tsx
new file mode 100644
index 00000000000..05a59ba5603
--- /dev/null
+++ b/web/ee/hooks/use-issue-properties.tsx
@@ -0,0 +1 @@
+export * from "ce/hooks/use-issue-properties";