feat: add version check (#922)

* Add version endpoint

* version indicator

* refetch

* * Translate strings
* Handle error

apps/client/src/components/settings/app-version.tsx

@@ -0,0 +1,53 @@
+import { useAppVersion } from "@/features/workspace/queries/workspace-query.ts";
+import { isCloud } from "@/lib/config.ts";
+import classes from "@/components/settings/settings.module.css";
+import { Indicator, Text, Tooltip } from "@mantine/core";
+import React from "react";
+import semverGt from "semver/functions/gt";
+import { useTranslation } from "react-i18next";
+
+export default function AppVersion() {
+  const { t } = useTranslation();
+  const { data: appVersion } = useAppVersion(!isCloud());
+  let hasUpdate = false;
+  try {
+    hasUpdate =
+      appVersion &&
+      parseFloat(appVersion.latestVersion) > 0 &&
+      semverGt(appVersion.latestVersion, appVersion.currentVersion);
+  } catch (err) {
+    console.error(err);
+  }
+
+  return (
+    <div className={classes.text}>
+      <Tooltip
+        label={t("{{latestVersion}} is available", {
+          latestVersion: `v${appVersion?.latestVersion}`,
+        })}
+        disabled={!hasUpdate}
+      >
+        <Indicator
+          label={t("New update")}
+          color="gray"
+          inline
+          size={16}
+          position="middle-end"
+          style={{ cursor: "pointer" }}
+          disabled={!hasUpdate}
+        >
+          <Text
+            size="sm"
+            c="dimmed"
+            component="a"
+            mr={45}
+            href="https://github.com/docmost/docmost/releases"
+            target="_blank"
+          >
+            v{APP_VERSION}
+          </Text>
+        </Indicator>
+      </Tooltip>
+    </div>
+  );
+}

apps/client/src/components/settings/settings-sidebar.tsx

@@ -27,6 +27,7 @@ import {
   prefetchSsoProviders,
   prefetchWorkspaceMembers,
 } from "@/components/settings/settings-queries.tsx";
+import AppVersion from "@/components/settings/app-version.tsx";
 
 interface DataItem {
   label: string;
@@ -205,19 +206,8 @@ export default function SettingsSidebar() {
       </Group>
 
       <ScrollArea w="100%">{menuItems}</ScrollArea>
-      {!isCloud() && (
-        <div className={classes.text}>
-          <Text
-            size="sm"
-            c="dimmed"
-            component="a"
-            href="https://github.com/docmost/docmost/releases"
-            target="_blank"
-          >
-            v{APP_VERSION}
-          </Text>
-        </div>
-      )}
+
+      {!isCloud() && <AppVersion />}
 
       {isCloud() && (
         <div className={classes.text}>

apps/client/src/features/workspace/queries/workspace-query.ts

@@ -15,6 +15,7 @@ import {
   revokeInvitation,
   getWorkspace,
   getWorkspacePublicData,
+  getAppVersion,
 } from "@/features/workspace/services/workspace-service";
 import { IPagination, QueryParams } from "@/lib/types.ts";
 import { notifications } from "@mantine/notifications";
@@ -22,6 +23,7 @@ import {
   ICreateInvite,
   IInvitation,
   IPublicWorkspace,
+  IVersion,
   IWorkspace,
 } from "@/features/workspace/types/workspace.types.ts";
 import { IUser } from "@/features/user/types/user.types.ts";
@@ -153,3 +155,15 @@ export function useGetInvitationQuery(
     enabled: !!invitationId,
   });
 }
+
+export function useAppVersion(
+  isEnabled: boolean,
+): UseQueryResult<IVersion, Error> {
+  return useQuery({
+    queryKey: ["version"],
+    queryFn: () => getAppVersion(),
+    staleTime: 60 * 60 * 1000, // 1 hr
+    enabled: isEnabled,
+    refetchOnMount: true,
+  });
+}

apps/client/src/features/workspace/services/workspace-service.ts

@@ -7,6 +7,7 @@ import {
   IAcceptInvite,
   IPublicWorkspace,
   IInvitationLink,
+  IVersion,
 } from "../types/workspace.types";
 import { IPagination, QueryParams } from "@/lib/types.ts";
 import { ISetupWorkspace } from "@/features/auth/types/auth.types.ts";
@@ -73,7 +74,6 @@ export async function getInviteLink(data: {
 export async function resendInvitation(data: {
   invitationId: string;
 }): Promise<void> {
-  console.log(data);
   await api.post("/workspace/invites/resend", data);
 }
 
@@ -97,6 +97,11 @@ export async function createWorkspace(
   return req.data;
 }
 
+export async function getAppVersion(): Promise<IVersion> {
+  const req = await api.post("/version");
+  return req.data;
+}
+
 export async function uploadLogo(file: File) {
   const formData = new FormData();
   formData.append("type", "workspace-logo");

apps/client/src/features/workspace/types/workspace.types.ts

@@ -57,3 +57,9 @@ export interface IPublicWorkspace {
   authProviders: IAuthProvider[];
   hasLicenseKey?: boolean;
 }
+
+export interface IVersion {
+  currentVersion: string;
+  latestVersion: string;
+  releaseUrl: string;
+}