strapi-plugin-app-version
Version:
This plugin displays the version in the Strapi settings
65 lines (64 loc) • 2.71 kB
JavaScript
import { jsxs, jsx, Fragment } from "react/jsx-runtime";
import { getFetchClient, Page, Layouts } from "@strapi/strapi/admin";
import { Routes, Route } from "react-router-dom";
import { useState, useEffect, useMemo } from "react";
import { Card, Flex, Loader, Typography, LinkButton } from "@strapi/design-system";
import { Code, ExternalLink } from "@strapi/icons";
import { P as PLUGIN_ID } from "./index-DMl7Katw.mjs";
const HomePage = () => {
const { get } = getFetchClient();
const [isLoading, setIsLoading] = useState(true);
const [config, setConfig] = useState(void 0);
useEffect(() => {
setIsLoading(true);
get(`/${PLUGIN_ID}/config`).then(({ data }) => {
setConfig(data);
}).catch((error) => {
console.error("Failed to fetch version:", error);
setConfig({ version: "unknown" });
}).finally(() => {
setIsLoading(false);
});
}, []);
const dateFormatter = useMemo(() => Intl.DateTimeFormat(navigator.languages && navigator.languages.length ? navigator.languages[0] : navigator.language, {
year: "numeric",
month: "long",
day: "numeric",
hour: "2-digit",
minute: "2-digit",
second: "2-digit"
}), []);
return /* @__PURE__ */ jsxs(Page.Main, { children: [
/* @__PURE__ */ jsx(
Layouts.Header,
{
title: "App Version"
}
),
/* @__PURE__ */ jsx(Layouts.Content, { children: /* @__PURE__ */ jsx(Card, { padding: 8, children: /* @__PURE__ */ jsx(Flex, { direction: "column", gap: 2, children: isLoading ? /* @__PURE__ */ jsx(Loader, {}) : /* @__PURE__ */ jsxs(Fragment, { children: [
/* @__PURE__ */ jsxs(Flex, { gap: 4, children: [
/* @__PURE__ */ jsx(Code, { width: 60, height: 60 }),
/* @__PURE__ */ jsxs(Typography, { variant: "beta", children: [
"Version: ",
config?.version
] })
] }),
(config?.date || config?.url) && /* @__PURE__ */ jsxs(Flex, { style: { marginTop: "3rem" }, direction: "column", gap: 6, children: [
config?.date && /* @__PURE__ */ jsxs(Typography, { variant: "delta", children: [
"Date: ",
dateFormatter.format(new Date(config.date))
] }),
config?.url && /* @__PURE__ */ jsx(LinkButton, { variant: "tertiary", href: config.url, isExternal: true, endIcon: /* @__PURE__ */ jsx(ExternalLink, {}), children: "More information" })
] })
] }) }) }) })
] });
};
const App = () => {
return /* @__PURE__ */ jsxs(Routes, { children: [
/* @__PURE__ */ jsx(Route, { index: true, element: /* @__PURE__ */ jsx(HomePage, {}) }),
/* @__PURE__ */ jsx(Route, { path: "*", element: /* @__PURE__ */ jsx(Page.Error, {}) })
] });
};
export {
App as default
};