Working on the s3 feature.

This commit is contained in:
charlesgauthereau
2025-07-29 09:53:38 +02:00
parent d3f465b5d4
commit a6b960ffb2
5 changed files with 45 additions and 49 deletions
@@ -1,16 +1,19 @@
import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
import { Info, ShieldCheck } from "lucide-react";
import { Switch } from "@/components/ui/switch";
import { Label } from "@/components/ui/label";
import { StorageS3Form } from "@/components/wrappers/dashboard/admin/admin-storage-tab/storage-s3/storage-s3-form";
import { useState } from "react";
import { ButtonWithLoading } from "@/components/wrappers/common/button/button-with-loading";
import { useMutation } from "@tanstack/react-query";
import { checkConnexionToS3 } from "@/features/upload/public/upload.action";
import { toast } from "sonner";
import { useRouter } from "next/navigation";
import { updateStorageSettingsAction } from "@/components/wrappers/dashboard/admin/admin-storage-tab/storage-s3/s3-form.action";
import {Alert, AlertDescription, AlertTitle} from "@/components/ui/alert";
import {Info, ShieldCheck} from "lucide-react";
import {Switch} from "@/components/ui/switch";
import {Label} from "@/components/ui/label";
import {StorageS3Form} from "@/components/wrappers/dashboard/admin/admin-storage-tab/storage-s3/storage-s3-form";
import {useState} from "react";
import {ButtonWithLoading} from "@/components/wrappers/common/button/button-with-loading";
import {useMutation} from "@tanstack/react-query";
import {checkConnexionToS3} from "@/features/upload/public/upload.action";
import {toast} from "sonner";
import {useRouter} from "next/navigation";
import {
updateStorageSettingsAction
} from "@/components/wrappers/dashboard/admin/admin-storage-tab/storage-s3/s3-form.action";
import {Setting} from "@/db/schema/00_setting";
import {S3FormType} from "@/components/wrappers/dashboard/admin/admin-storage-tab/storage-s3/s3-form.schema";
export type SettingsStorageTabProps = {
settings: Setting;
@@ -33,7 +36,7 @@ export const SettingsStorageTab = (props: SettingsStorageTabProps) => {
const [isSwitched, setIsSwitched] = useState<boolean>(props.settings.storage !== "local");
const updateMutation = useMutation({
mutationFn: () => updateStorageSettingsAction({ name: "system", data: { storage: isSwitched ? "s3" : "local" } }),
mutationFn: () => updateStorageSettingsAction({name: "system", data: {storage: isSwitched ? "s3" : "local"}}),
onSuccess: () => {
toast.success(`Settings updated successfully.`);
router.refresh();
@@ -48,14 +51,25 @@ export const SettingsStorageTab = (props: SettingsStorageTabProps) => {
await updateMutation.mutateAsync();
};
const extractS3FormValues = (settings: Setting): S3FormType | undefined => {
if (!settings.s3EndPointUrl) return undefined;
return {
s3EndPointUrl: settings.s3EndPointUrl,
s3AccessKeyId: settings.s3AccessKeyId!,
s3SecretAccessKey: settings.s3SecretAccessKey!,
S3BucketName: settings.S3BucketName!,
};
};
return (
<div className="flex flex-col h-full py-4">
<h1>Settings for Portabase storage</h1>
<Alert className="mt-3">
<Info className="h-4 w-4" />
<Info className="h-4 w-4"/>
<AlertTitle>Informations</AlertTitle>
<AlertDescription>
Actually you can only store you data in one place : s3 compatible or in local. For exemple you cannot choose to store images in one place
Actually you can only store you data in one place : s3 compatible or in local. For exemple you
cannot choose to store images in one place
and .dump files in another.
</AlertDescription>
</Alert>
@@ -79,14 +93,14 @@ export const SettingsStorageTab = (props: SettingsStorageTabProps) => {
onClick={async () => {
await mutation.mutateAsync();
}}
icon={<ShieldCheck />}
icon={<ShieldCheck/>}
text="Test connexion"
/>
</div>
</div>
{isSwitched && (
<div className="mt-5">
<StorageS3Form defaultValues={props.settings.s3EndPointUrl ? props.settings : null} />
<StorageS3Form defaultValues={extractS3FormValues(props.settings)}/>
</div>
)}
</div>
@@ -53,6 +53,8 @@ export const AvatarWithUpload = (props: AvatarWithUploadProps) => {
submitImage.mutate(file);
};
return (
<div className="relative ">
<Avatar className="size-14 mr-3 ">
-31
View File
@@ -5,37 +5,6 @@ import {db} from "@/db";
import * as drizzleDb from "@/db";
import {eq} from "drizzle-orm";
// const settings = await prisma.settings.findUnique({
// where:{
// name: "system"
// }
// })
// Create a new Minio client with the S3 endpoint, access key, and secret key
// export const s3Client = env.NODE_ENV === "production" ?
// new Minio.Client({
// endPoint: env.S3_ENDPOINT ?? "",
// accessKey: env.S3_ACCESS_KEY ?? "",
// secretKey: env.S3_SECRET_KEY ?? "",
// }) : new Minio.Client({
// endPoint: env.S3_ENDPOINT ?? "",
// port: Number(env.S3_PORT ?? 0),
// accessKey: env.S3_ACCESS_KEY ?? "",
// secretKey: env.S3_SECRET_KEY ?? "",
// useSSL: env.S3_USE_SSL === 'true'
// })
// export const s3Client = env.NODE_ENV === "production" ?
// new Minio.Client({
// endPoint: settings.s3EndPointUrl ?? "",
// accessKey: settings.s3AccessKeyId ?? "",
// secretKey: settings.s3SecretAccessKey ?? "",
// }) : new Minio.Client({
// endPoint: settings.s3EndPointUrl ?? "",
// port: Number(env.S3_PORT ?? 0),
// accessKey: settings.s3AccessKeyId ?? "",
// secretKey: settings.s3SecretAccessKey ?? "",
// useSSL: env.S3_USE_SSL === 'true'
// })
async function getS3Client() {
const settings = await db