Refactor AboutApp component in about.tsx

This commit is contained in:
n4ze3m 2024-04-05 20:38:19 +05:30
parent ac347a3970
commit 0e59aa77cf

View File

@ -3,6 +3,7 @@ import { useTranslation } from "react-i18next"
import { useQuery } from "@tanstack/react-query" import { useQuery } from "@tanstack/react-query"
import { Skeleton } from "antd" import { Skeleton } from "antd"
import { cleanUrl } from "@/libs/clean-url" import { cleanUrl } from "@/libs/clean-url"
import { Descriptions } from "antd"
export const AboutApp = () => { export const AboutApp = () => {
const { t } = useTranslation("settings") const { t } = useTranslation("settings")
@ -41,37 +42,23 @@ export const AboutApp = () => {
{status === "pending" && <Skeleton paragraph={{ rows: 4 }} active />} {status === "pending" && <Skeleton paragraph={{ rows: 4 }} active />}
{status === "success" && ( {status === "success" && (
<div className="flex flex-col space-y-4"> <div className="flex flex-col space-y-4">
<div> <Descriptions
<div> title={t("about.heading")}
<h2 className="text-base font-semibold leading-7 text-gray-900 dark:text-white"> column={1}
{t("about.heading")} size="middle"
</h2> items={[
<div className="border border-b border-gray-200 dark:border-gray-600 mt-3 mb-6"></div> {
</div> key: 1,
</div> label: t("about.chromeVersion"),
children: data.chromeVersion
<div> },
<div className="flex flex-col space-y-6"> {
<div className="flex gap-6"> key: 1,
<span className="text-sm text-gray-500 dark:text-gray-400"> label: t("about.ollamaVersion"),
{t("about.chromeVersion")} children: data.ollama
</span> }
<span className="text-sm text-gray-900 dark:text-white"> ]}
{data.chromeVersion} />
</span>
</div>
<div className="flex gap-6">
<span className="text-sm text-gray-500 dark:text-gray-400">
{t("about.ollamaVersion")}
</span>
<span className="text-sm text-gray-900 dark:text-white">
{data.ollama}
</span>
</div>
</div>
</div>
<div> <div>
<p className="text-sm text-gray-500 dark:text-gray-400 mb-4"> <p className="text-sm text-gray-500 dark:text-gray-400 mb-4">
{t("about.support")} {t("about.support")}