UI tweaks

apps/client/public/locales/en-US/translation.json

@@ -116,6 +116,7 @@
   "No group found": "No group found",
   "No page history saved yet.": "No page history saved yet.",
   "No pages yet": "No pages yet",
+  "No shared pages": "No shared pages",
   "No results found...": "No results found...",
   "No user found": "No user found",
   "Overview": "Overview",

apps/client/src/ee/licence/components/oss-details.tsx

@@ -1,39 +1,76 @@
-import { Group, Table, ThemeIcon } from "@mantine/core";
+import { Group, List, Stack, Table, Text, ThemeIcon } from "@mantine/core";
 import { IconCheck } from "@tabler/icons-react";
 
+const enterpriseFeatures = [
+  "SSO (SAML, OIDC, LDAP)",
+  "Multi-factor Authentication",
+  "Page-level Permissions",
+  "Audit Logs",
+  "API Keys",
+  "AI Integration",
+  "MCP Support",
+  "Advanced Search Engine Support",
+  "Full-text Search in Attachments (PDF, DOCX)",
+  "Resolve Comments",
+  "Confluence Import",
+  "DOCX Import",
+];
+
 export default function OssDetails() {
   return (
-    <Table.ScrollContainer minWidth={500} py="md">
+    <Stack gap="lg">
-      <Table
+      <Table.ScrollContainer minWidth={500} py="md">
-        variant="vertical"
+        <Table
-        verticalSpacing="sm"
+          variant="vertical"
-        layout="fixed"
+          verticalSpacing="sm"
-        withTableBorder
+          layout="fixed"
-      >
+          withTableBorder
-        <Table.Caption>
+        >
-          To unlock enterprise features like SSO, AI, Page-level permissions, SSO, MFA, Resolve comments, contact sales@docmost.com.
+          <Table.Tbody>
-        </Table.Caption>
+            <Table.Tr>
-        <Table.Tbody>
+              <Table.Th w={160}>Edition</Table.Th>
-          <Table.Tr>
+              <Table.Td>
-            <Table.Th w={160}>Edition</Table.Th>
+                <Group wrap="nowrap">
-            <Table.Td>
+                  Open Source
-              <Group wrap="nowrap">
+                  <div>
-                Open Source
+                    <ThemeIcon
-                <div>
+                      color="green"
-                  <ThemeIcon
+                      variant="light"
-                    color="green"
+                      size={24}
-                    variant="light"
+                      radius="xl"
-                    size={24}
+                    >
-                    radius="xl"
+                      <IconCheck size={16} />
-                  >
+                    </ThemeIcon>
-                    <IconCheck size={16} />
+                  </div>
-                  </ThemeIcon>
+                </Group>
-                </div>
+              </Table.Td>
-              </Group>
+            </Table.Tr>
-            </Table.Td>
+          </Table.Tbody>
-          </Table.Tr>
+        </Table>
-        </Table.Tbody>
+      </Table.ScrollContainer>
-      </Table>
+
-    </Table.ScrollContainer>
+      <Stack gap="md">
+        <Text fw={500}>Upgrade to the Enterprise Edition to unlock:</Text>
+
+        <List
+          spacing={4}
+          size="sm"
+          icon={
+            <ThemeIcon size={20} color={"gray"} radius="xl">
+              <IconCheck size={14} />
+            </ThemeIcon>
+          }
+        >
+          {enterpriseFeatures.map((feature) => (
+            <List.Item key={feature}>{feature}</List.Item>
+          ))}
+        </List>
+
+        <Text size="sm" c="dimmed">
+          Contact <a href="mailto:sales@docmost.com">sales@docmost.com </a> for
+          enquiries.
+        </Text>
+      </Stack>
+    </Stack>
   );
 }

apps/client/src/features/comment/components/comment-list-with-tabs.tsx

@@ -25,7 +25,6 @@ import { usePageQuery } from "@/features/page/queries/page-query.ts";
 import { IPagination } from "@/lib/types.ts";
 import { extractPageSlugId } from "@/lib";
 import { useTranslation } from "react-i18next";
-import { useIsCloudEE } from "@/hooks/use-is-cloud-ee";
 import { useGetSpaceBySlugQuery } from "@/features/space/queries/space-query.ts";
 import { IconArrowUp, IconMessageOff } from "@tabler/icons-react";
 

apps/client/src/features/share/components/share-list.tsx

@@ -2,6 +2,7 @@ import { Table, Group, Text, Anchor } from "@mantine/core";
 import React from "react";
 import { Link } from "react-router-dom";
 import { useTranslation } from "react-i18next";
+import { IconWorld } from "@tabler/icons-react";
 import Paginate from "@/components/common/paginate.tsx";
 import { useCursorPaginate } from "@/hooks/use-cursor-paginate";
 import { useGetSharesQuery } from "@/features/share/queries/share-query.ts";
@@ -11,6 +12,7 @@ import ShareActionMenu from "@/features/share/components/share-action-menu.tsx";
 import { buildSharedPageUrl } from "@/features/page/page.utils.ts";
 import { getPageIcon } from "@/lib";
 import { CustomAvatar } from "@/components/ui/custom-avatar.tsx";
+import { EmptyState } from "@/components/ui/empty-state.tsx";
 import classes from "./share.module.css";
 
 export default function ShareList() {
@@ -18,6 +20,10 @@ export default function ShareList() {
   const { cursor, goNext, goPrev } = useCursorPaginate();
   const { data, isLoading } = useGetSharesQuery({ cursor });
 
+  if (!isLoading && data?.items.length === 0) {
+    return <EmptyState icon={IconWorld} title={t("No shared pages")} />;
+  }
+
   return (
     <>
       <Table.ScrollContainer minWidth={500}>

apps/client/src/features/workspace/components/members/components/workspace-members-table.tsx

@@ -94,14 +94,17 @@ export default function WorkspaceMembersTable() {
                     )}
                   </Table.Td>
                   <Table.Td>
-                    <RoleSelectMenu
+                    {isAdmin ? (
-                      roles={assignableUserRoles}
+                      <RoleSelectMenu
-                      roleName={getUserRoleLabel(user.role)}
+                        roles={assignableUserRoles}
-                      onChange={(newRole) =>
+                        roleName={getUserRoleLabel(user.role)}
-                        handleRoleChange(user.id, user.role, newRole)
+                        onChange={(newRole) =>
-                      }
+                          handleRoleChange(user.id, user.role, newRole)
-                      disabled={!isAdmin}
+                        }
-                    />
+                      />
+                    ) : (
+                      <Text fz="sm">{t(getUserRoleLabel(user.role))}</Text>
+                    )}
                   </Table.Td>
                   <Table.Td>
                     {isAdmin && (