From afbe5ca0f6596143a23a750d9e6c37488824cad2 Mon Sep 17 00:00:00 2001
From: Timm Fitschen <t.fitschen@indiscale.com>
Date: Tue, 19 Mar 2024 04:46:33 +0100
Subject: [PATCH] cosmetics
---
pages/api/auth/[...nextauth].ts | 5 ++--
pages/fdo/create/index.tsx | 4 +++
src/components/fdos/create.tsx | 53 ++++++++++++++++++++++++++-------
src/components/fdos/list.tsx | 2 +-
src/providers/dataProvider.tsx | 2 +-
5 files changed, 51 insertions(+), 15 deletions(-)
diff --git a/pages/api/auth/[...nextauth].ts b/pages/api/auth/[...nextauth].ts
index c4d36c8..b8a6f91 100644
--- a/pages/api/auth/[...nextauth].ts
+++ b/pages/api/auth/[...nextauth].ts
@@ -1,6 +1,7 @@
import NextAuth from 'next-auth'
import KeycloakProvider from 'next-auth/providers/keycloak'
+const secretSessionKey = process.env.SECRET_SESSION_KEY || 'UItTuD1HcGXIj8ZfHUswhYdNd40Lc325R8VlxQPUoR0='
const clientId = 'gwdg-fdoman-test'
const clientSecret = process.env.KEY_CLOAK_CLIENT_SECRET || ''
const issuer = 'https://keycloak.sso.gwdg.de/auth/realms/academiccloud'
@@ -101,7 +102,7 @@ export const authOptions = {
}
}
- if (token.lastRefresh + 10000 > Date.now()) {
+ if (token.lastRefresh + 60000 > Date.now()) {
// return if last refresh is 10 seconds or younger
return token
}
@@ -110,6 +111,6 @@ export const authOptions = {
return refreshAccessToken(token)
}
},
- secret: 'UItTuD1HcGXIj8ZfHUswhYdNd40Lc325R8VlxQPUoR0='
+ secret: secretSessionKey
}
export default NextAuth(authOptions)
diff --git a/pages/fdo/create/index.tsx b/pages/fdo/create/index.tsx
index d7ca064..dfd6827 100644
--- a/pages/fdo/create/index.tsx
+++ b/pages/fdo/create/index.tsx
@@ -6,10 +6,14 @@ import { GetServerSideProps } from 'next'
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
const CreateFDO = () => {
+ return <FdoCreate/>
+ /*
return (
<Authenticated key="fdo-create">
<FdoCreate/>
</Authenticated>)
+
+ */
}
export default CreateFDO
diff --git a/src/components/fdos/create.tsx b/src/components/fdos/create.tsx
index 227bdd5..b5df2af 100644
--- a/src/components/fdos/create.tsx
+++ b/src/components/fdos/create.tsx
@@ -1,5 +1,8 @@
+import { useState, useEffect } from 'react'
import { useGo, IResourceComponentsProps, useList, HttpError, useGetIdentity } from '@refinedev/core'
-import { Create, SaveButton } from '@refinedev/mui'
+import { Create } from '@refinedev/mui'
+import LoadingButton from '@mui/lab/LoadingButton'
+import SaveIcon from '@mui/icons-material/Save'
import { useTheme, styled } from '@mui/material/styles'
import Skeleton from '@mui/material/Skeleton'
@@ -112,14 +115,30 @@ const VisuallyHiddenInput = styled('input')({
width: 1
})
-const StepMetadata: React.FC<any> = ({ control, register, errors }) => {
- return <FileUpload register={register} errors={errors} name="fdo_metadata" label="Upload metadata file"/>
+const StepMetadata: React.FC<any> = ({ control, register, errors, setError }) => {
+ return <FileUpload register={register} errors={errors} name="fdo_metadata" validate={validate} label="Upload metadata file" setError={setError}/>
}
-const FileUpload: React.FC<any> = ({ register, errors, name, label }) => {
+const FileUpload: React.FC<any> = ({ register, errors, name, label, setError }) => {
+ const validate = { lessThan10MB: files => files[0]?.size < 10000000 || 'Max 10MB' }
+ const accept = 'max 10MB'
+ const [files, setFiles] = useState([])
+ const inputProps = register(name, {
+ required: 'This field is required.',
+ validate
+ })
+
+ console.log(inputProps)
+ const onChange = (e: any) => {
+ setFiles(e.target?.files)
+ inputProps.onChange(e)
+ }
+
return (
+ <Stack>
+ {accept && <FormHelperText>Accepted: {accept}</FormHelperText>}
<FormControl error={!!errors[name]} fullWidth>
- <span>
+ <span>
<Button
component="label"
role={undefined}
@@ -128,11 +147,13 @@ const FileUpload: React.FC<any> = ({ register, errors, name, label }) => {
startIcon={<CloudUploadIcon />}
>
{label}
- <VisuallyHiddenInput {...register(name, { required: 'This field is required.' })} type="file"/>
- </Button>
+ <VisuallyHiddenInput {...inputProps} accept={accept} onChange={onChange} type="file"/>
+ </Button>
</span>
+ <FormHelperText>{files.length > 0 && files[0].name }</FormHelperText>
<FormHelperText>{errors[name]?.message}</FormHelperText>
</FormControl>
+ </Stack>
)
}
@@ -146,7 +167,9 @@ export const FdoCreate: React.FC<IResourceComponentsProps> = () => {
console.log('accessToken: ', accessToken)
const formRet = useStepsForm<any, HttpError, any>({ defaultValues: { repository: '', profile: '' }, refineCoreProps: { meta: { headers: { Authentication: `Bearer ${accessToken}` } } } })
+ console.log('formRet', formRet)
const {
+ setError,
saveButtonProps,
refineCore: {
formLoading, onFinish,
@@ -177,15 +200,15 @@ export const FdoCreate: React.FC<IResourceComponentsProps> = () => {
switch (step) {
case 0:
return (
- <StepRepository control={control} register={register} errors={errors}/>
+ <StepRepository control={control} register={register} errors={errors} setError={setError}/>
)
case 1:
return (
- <StepMetadata control={control} register={register} errors={errors}/>
+ <StepMetadata control={control} register={register} errors={errors} setError={setError}/>
)
case 2:
return (
- <StepData control={control} register={register} errors={errors}/>
+ <StepData control={control} register={register} errors={errors} setError={setError}/>
)
}
}
@@ -216,7 +239,15 @@ export const FdoCreate: React.FC<IResourceComponentsProps> = () => {
</Button>
)}
{currentStep === stepTitles.length - 1 && (
- <SaveButton onClick={handleSubmit(onSubmit)} />
+ <LoadingButton
+ loading={isLoading}
+ loadingPosition="start"
+ startIcon={<SaveIcon />}
+ variant="outlined"
+ onClick={handleSubmit(onSubmit)}
+ >
+ Save
+ </LoadingButton>
)}
</>
}
diff --git a/src/components/fdos/list.tsx b/src/components/fdos/list.tsx
index f3dc471..58697f2 100644
--- a/src/components/fdos/list.tsx
+++ b/src/components/fdos/list.tsx
@@ -26,7 +26,7 @@ const columns: Array<GridColDef<OperationsLogRecord>> = [
type: 'string',
renderCell: (params): string => {
console.log('params', params)
- return ''
+ return <Link href={`/fdo/${params.id}`}>{params.id}</Link>
}
}
]
diff --git a/src/providers/dataProvider.tsx b/src/providers/dataProvider.tsx
index 2a905a7..ad9336c 100644
--- a/src/providers/dataProvider.tsx
+++ b/src/providers/dataProvider.tsx
@@ -94,7 +94,7 @@ const apiDataProvider = (apiUrl: string): DataProvider => {
},
getList: async ({ resource, pagination, sorters, filters, meta }) => {
const data = (await callOperation(resource, 'list', { pagination, sorters, filters, meta })).data
- return { data, total: data.length }
+ return { data, total: data?.length || 0 }
},
getApiUrl: () => apiUrl
}
--
GitLab