fix: check if update is available based on auto-detected version channel.

This commit is contained in:
killian-larcher
2026-01-28 20:22:14 +01:00
parent 6231002043
commit 46022e8711
5 changed files with 37 additions and 37 deletions
-2
View File
@@ -29,5 +29,3 @@ AUTH_GOOGLE_METHOD=
# Retention
RETENTION_CRON="* * * * *"
# Updates
NEXT_PUBLIC_UPDATE_CHANNEL=stable
-2
View File
@@ -44,11 +44,9 @@ export const env = createEnv({
},
client: {
NEXT_PUBLIC_PROJECT_VERSION: z.string().optional(),
NEXT_PUBLIC_UPDATE_CHANNEL: z.enum(["stable", "beta", "rc"]).default("stable"),
},
runtimeEnv: {
NEXT_PUBLIC_PROJECT_VERSION: version || "Unknown Version",
NEXT_PUBLIC_UPDATE_CHANNEL: process.env.NEXT_PUBLIC_UPDATE_CHANNEL || "stable",
PROJECT_NAME: process.env.PROJECT_NAME,
PROJECT_DESCRIPTION: process.env.PROJECT_DESCRIPTION,
@@ -1,13 +1,14 @@
"use client";
import { useUpdateCheck } from "../hooks/use-update-check";
import { useSidebar, SidebarGroup, SidebarGroupContent, SidebarMenu, SidebarMenuItem, SidebarMenuButton } from "@/components/ui/sidebar";
import { X, ArrowUpCircle, MoveRight } from "lucide-react";
import {useUpdateCheck} from "../hooks/use-update-check";
import {useSidebar, SidebarGroup, SidebarGroupContent, SidebarMenu, SidebarMenuItem} from "@/components/ui/sidebar";
import {X, ArrowUpCircle, MoveRight} from "lucide-react";
import Link from "next/link";
export const UpdateNotification = () => {
const { isUpdateAvailable, latestRelease, dismissUpdate } = useUpdateCheck();
const { state } = useSidebar();
const {isUpdateAvailable, latestRelease, dismissUpdate} = useUpdateCheck();
const {state} = useSidebar();
if (!isUpdateAvailable || !latestRelease || state !== "expanded") {
return null;
@@ -18,33 +19,36 @@ export const UpdateNotification = () => {
<SidebarGroupContent>
<SidebarMenu>
<SidebarMenuItem className="px-2">
<div className="relative flex flex-col gap-2 rounded-lg border bg-primary/5 p-3 text-sidebar-foreground border-primary/20">
<button
<div
className="relative flex flex-col gap-2 rounded-lg border bg-primary/5 p-3 text-sidebar-foreground border-primary/20">
<button
onClick={dismissUpdate}
className="absolute right-2 top-2 rounded-md p-0.5 text-muted-foreground/50 hover:bg-sidebar-accent hover:text-foreground transition-colors"
>
<X className="size-3" />
<X className="size-3"/>
<span className="sr-only">Dismiss</span>
</button>
<div className="flex items-center gap-2.5">
<div className="flex size-7 shrink-0 items-center justify-center rounded-full bg-primary/10 text-primary">
<ArrowUpCircle className="size-4" />
<div
className="flex size-7 shrink-0 items-center justify-center rounded-full bg-primary/10 text-primary">
<ArrowUpCircle className="size-4"/>
</div>
<div className="flex flex-col min-w-0">
<div className="flex items-center gap-1.5">
<span className="text-[12px] font-semibold leading-none">Update available</span>
<span className="text-[10px] text-muted-foreground font-medium px-1.5 py-0.5 bg-primary/10 rounded-full">
<span
className="text-[10px] text-muted-foreground font-medium px-1.5 py-0.5 bg-primary/10 rounded-full">
v{latestRelease.tag_name.replace(/^v/, "")}
</span>
</div>
<Link
href={latestRelease.html_url}
target="_blank"
<Link
href={latestRelease.html_url}
target="_blank"
className="group inline-flex items-center gap-1 text-[11px] text-primary hover:underline font-medium mt-1"
>
See what's new
<MoveRight className="size-3 transition-transform group-hover:translate-x-0.5" />
<MoveRight className="size-3 transition-transform group-hover:translate-x-0.5"/>
</Link>
</div>
</div>
+11 -10
View File
@@ -1,23 +1,24 @@
"use client";
import { useQuery } from "@tanstack/react-query";
import { getLatestRelease } from "../services/github";
import { env } from "@/env.mjs";
import { useEffect, useState } from "react";
import {useQuery} from "@tanstack/react-query";
import {getLatestRelease} from "../services/github";
import {env} from "@/env.mjs";
import {useEffect, useState} from "react";
const DISMISS_KEY = "portabase-update-dismissed";
const DISMISS_DURATION = 1000 * 60 * 60 * 24;
const DISMISS_DURATION = 1000 * 60 * 60 * 24;
export const useUpdateCheck = () => {
const [isDismissed, setIsDismissed] = useState(true);
const { data: latestRelease, isLoading } = useQuery({
queryKey: ["latest-release", env.NEXT_PUBLIC_UPDATE_CHANNEL],
queryFn: () => getLatestRelease(env.NEXT_PUBLIC_UPDATE_CHANNEL as any),
const currentVersion = env.NEXT_PUBLIC_PROJECT_VERSION!;
const {data: latestRelease, isLoading} = useQuery({
queryKey: ["latest-release"],
queryFn: () => getLatestRelease(currentVersion),
staleTime: 1000 * 60 * 60,
});
const currentVersion = env.NEXT_PUBLIC_PROJECT_VERSION;
useEffect(() => {
if (!latestRelease) return;
@@ -28,7 +29,7 @@ export const useUpdateCheck = () => {
if (latestVersion && cleanCurrentVersion && latestVersion !== cleanCurrentVersion) {
const dismissedData = localStorage.getItem(DISMISS_KEY);
if (dismissedData) {
const { version, timestamp } = JSON.parse(dismissedData);
const {version, timestamp} = JSON.parse(dismissedData);
const now = Date.now();
if (version === latestRelease.tag_name && now - timestamp < DISMISS_DURATION) {
setIsDismissed(true);
+6 -7
View File
@@ -6,7 +6,7 @@ export interface GitHubRelease {
body: string;
}
export const getLatestRelease = async (channel: "stable" | "beta" | "rc" = "stable"): Promise<GitHubRelease | null> => {
export const getLatestRelease = async (currentVersion: string): Promise<GitHubRelease | null> => {
try {
const response = await fetch("https://api.github.com/repos/Portabase/portabase/releases");
if (!response.ok) {
@@ -14,15 +14,14 @@ export const getLatestRelease = async (channel: "stable" | "beta" | "rc" = "stab
}
const releases: GitHubRelease[] = await response.json();
if (channel === "stable") {
const isStable = /^\d+\.\d+\.\d+$/.test(currentVersion);
const isRc = /^\d+\.\d+\.\d+-rc\.\d+$/.test(currentVersion);
if (isStable) {
return releases.find(r => !r.prerelease) || null;
}
if (channel === "beta") {
return releases.find(r => r.tag_name.includes("beta") || !r.prerelease) || null;
}
if (channel === "rc") {
if (isRc) {
return releases.find(r => r.tag_name.includes("rc") || !r.prerelease) || null;
}