diff --git a/live/src/server.ts b/live/src/server.ts
index 494342305..94b44ccba 100644
--- a/live/src/server.ts
+++ b/live/src/server.ts
@@ -41,7 +41,7 @@ router.ws("/collaboration", (ws, req) => {
 
 app.use(process.env.LIVE_BASE_PATH || "/live", router);
 
-app.use((_req, res, _next) => {
+app.use((_req, res) => {
   res.status(404).send("Not Found");
 });
 
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 9d5a42a81..4d7008f2e 100644
--- a/packages/editor/src/core/components/editors/document/collaborative-editor.tsx
+++ b/packages/editor/src/core/components/editors/document/collaborative-editor.tsx
@@ -3,14 +3,14 @@ import React from "react";
 import { PageRenderer } from "@/components/editors";
 // constants
 import { DEFAULT_DISPLAY_CONFIG } from "@/constants/config";
+// extensions
+import { IssueWidget } from "@/extensions";
 // helpers
 import { getEditorClassNames } from "@/helpers/common";
-// plane editor types
-import { TEmbedConfig } from "@/plane-editor/types";
+// hooks
+import { useCollaborativeEditor } from "@/hooks/use-collaborative-editor";
 // types
 import { EditorRefApi, ICollaborativeDocumentEditor } from "@/types";
-import { useCollaborativeEditor } from "@/hooks/use-collaborative-editor";
-import { IssueWidget } from "@/extensions";
 
 const CollaborativeDocumentEditor = (props: ICollaborativeDocumentEditor) => {
   const {
diff --git a/web/core/components/icons/locked-component.tsx b/web/core/components/icons/locked-component.tsx
index 653d2b8e7..36230a093 100644
--- a/web/core/components/icons/locked-component.tsx
+++ b/web/core/components/icons/locked-component.tsx
@@ -4,7 +4,7 @@ import { Tooltip } from "@plane/ui";
 export const LockedComponent = (props: { toolTipContent?: string }) => {
   const { toolTipContent } = props;
   const lockedComponent = (
-    <div className="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">
+    <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">
       <Lock className="h-3 w-3" />
       <span>Locked</span>
     </div>
diff --git a/web/core/components/pages/editor/header/extra-options.tsx b/web/core/components/pages/editor/header/extra-options.tsx
index 096310aeb..c45d9e99f 100644
--- a/web/core/components/pages/editor/header/extra-options.tsx
+++ b/web/core/components/pages/editor/header/extra-options.tsx
@@ -63,7 +63,7 @@ export const PageExtraOptions: React.FC<Props> = observer((props) => {
     <div className="flex items-center justify-end gap-3">
       {is_locked && <LockedComponent />}
       {archived_at && (
-        <div className="flex h-7 items-center gap-2 rounded-full bg-blue-500/20 px-3 py-0.5 text-xs font-medium text-blue-500">
+        <div className="flex-shrink-0 flex h-7 items-center gap-2 rounded-full bg-blue-500/20 px-3 py-0.5 text-xs font-medium text-blue-500">
           <ArchiveIcon className="flex-shrink-0 size-3" />
           <span>Archived at {renderFormattedDate(archived_at)}</span>
         </div>
@@ -73,7 +73,7 @@ export const PageExtraOptions: React.FC<Props> = observer((props) => {
           tooltipHeading="You are offline"
           tooltipContent="All changes made will be saved locally and will be synced when the internet connection is re-established."
         >
-          <div className="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">
+          <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">
             <span className="flex-shrink-0 size-1.5 rounded-full bg-custom-text-300" />
             <span>Offline</span>
           </div>
@@ -84,14 +84,19 @@ export const PageExtraOptions: React.FC<Props> = observer((props) => {
           tooltipHeading="Connection failed"
           tooltipContent="All changes made will be saved locally and will be synced when the connection is re-established."
         >
-          <div className="flex h-7 items-center gap-2 rounded-full bg-red-500/20 px-3 py-0.5 text-xs font-medium text-red-500">
+          <div className="flex-shrink-0 flex h-7 items-center gap-2 rounded-full bg-red-500/20 px-3 py-0.5 text-xs font-medium text-red-500">
             <CircleAlert className="flex-shrink-0 size-3" />
             <span>Server error</span>
           </div>
         </Tooltip>
       )}
       {canCurrentUserFavoritePage && (
-        <FavoriteStar selected={is_favorite} onClick={handleFavorite} iconClassName="text-custom-text-100" />
+        <FavoriteStar
+          selected={is_favorite}
+          onClick={handleFavorite}
+          buttonClassName="flex-shrink-0"
+          iconClassName="text-custom-text-100"
+        />
       )}
       <PageInfoPopover editorRef={isContentEditable ? editorRef.current : readOnlyEditorRef.current} />
       <PageOptionsDropdown