Merge branch 'master' into beta

packages/editor-mobile/src/components/header.tsx

@@ -139,6 +139,7 @@ function Header({
 }): JSX.Element {
   const tab = useTabContext();
   const editor = editors[tab.id];
+  const tableOfContents = editorControllers[tab.id]?.getTableOfContents?.();
   const insets = useSafeArea();
   const openedTabsCount = useTabStore((state) => state.tabs.length);
   const [isOpen, setOpen] = useState(false);
@@ -148,6 +149,8 @@ function Header({
     state.canGoForward
   ]);
 
+  console.log(tableOfContents?.length);
+
   return (
     <div
       style={{
@@ -496,26 +499,29 @@ function Header({
                 </span>
               </MenuItem>
 
-              <MenuItem
-                value="toc"
-                style={{
-                  display: "flex",
-                  gap: 10,
-                  alignItems: "center"
-                }}
-              >
-                <TableOfContentsIcon
-                  size={20 * settings.fontScale}
-                  color="var(--nn_primary_icon)"
-                />
-                <span
+              {tableOfContents?.length ? (
+                <MenuItem
+                  value="toc"
                   style={{
-                    color: "var(--nn_primary_paragraph)"
+                    display: "flex",
+                    gap: 10,
+                    alignItems: "center"
                   }}
                 >
-                  {strings.toc()}
-                </span>
-              </MenuItem>
+                  <TableOfContentsIcon
+                    size={20 * settings.fontScale}
+                    color="var(--nn_primary_icon)"
+                  />
+                  <span
+                    style={{
+                      color: "var(--nn_primary_paragraph)"
+                    }}
+                  >
+                    {strings.toc()}
+                  </span>
+                </MenuItem>
+              ) : null}
+
               <MenuItem
                 value="scroll-top"
                 style={{

packages/editor-mobile/src/components/tags.tsx

@@ -113,13 +113,19 @@ function Tags(props: { settings: Settings; loading?: boolean }) {
             backgroundColor:
               index !== 0 ? "transparent" : "var(--nn_secondary_background)",
             borderRadius: 6,
-            padding: "0px 4px",
-            height: "24px",
+            padding: "2px 4px",
+            height: "25px",
             fontFamily: "Inter",
             fontSize: 12,
             color: "var(--nn_primary_icon)",
             userSelect: "none",
-            WebkitUserSelect: "none"
+            WebkitUserSelect: "none",
+            textAlign: "left",
+            maxWidth: 150,
+            textOverflow: "ellipsis",
+            overflow: "hidden",
+            wordWrap: "break-word",
+            whiteSpace: "nowrap"
           }}
           onClick={(e) => {
             e.preventDefault();