✨ Supports release assets & installers
This commit is contained in:
@@ -11,15 +11,16 @@ import {
|
||||
Typography,
|
||||
Grid2 as Grid,
|
||||
IconButton,
|
||||
Card,
|
||||
} from '@mui/material'
|
||||
import { useRouter } from 'next-nprogress-bar'
|
||||
import { useEffect, useState } from 'react'
|
||||
import { useForm } from 'react-hook-form'
|
||||
import { MaProduct, MaRelease, MaReleaseAsset, MaReleaseInstaller, MaReleaseInstallerPatch } from 'solar-js-sdk'
|
||||
import MonacoEditor from '@monaco-editor/react'
|
||||
|
||||
import ErrorIcon from '@mui/icons-material/Error'
|
||||
import CloseIcon from '@mui/icons-material/Close'
|
||||
import { MaProduct } from 'solar-js-sdk'
|
||||
import { version } from 'node:os'
|
||||
|
||||
export interface MatrixReleaseForm {
|
||||
version: string
|
||||
@@ -28,7 +29,8 @@ export interface MatrixReleaseForm {
|
||||
title: string
|
||||
description: string
|
||||
content: string
|
||||
assets: Record<string, any>
|
||||
assets: Record<string, MaReleaseAsset>
|
||||
installers: Record<string, MaReleaseInstaller>
|
||||
attachments: string[]
|
||||
}
|
||||
|
||||
@@ -41,7 +43,7 @@ export default function MaReleaseForm({
|
||||
onSubmit: (data: MatrixReleaseForm) => Promise<any>
|
||||
onSuccess?: () => void
|
||||
parent: Partial<MaProduct>
|
||||
defaultValue?: any
|
||||
defaultValue?: MaRelease
|
||||
}) {
|
||||
const { handleSubmit, register } = useForm<MatrixReleaseForm>({
|
||||
defaultValues: {
|
||||
@@ -56,17 +58,25 @@ export default function MaReleaseForm({
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
if (defaultValue) {
|
||||
if (defaultValue?.assets) {
|
||||
setAssets(Object.keys(defaultValue.assets).map((k) => ({ k, v: defaultValue.assets[k] })))
|
||||
}
|
||||
if (defaultValue?.installers) {
|
||||
setInstallers(Object.keys(defaultValue.installers).map((k) => ({ k, v: defaultValue.installers[k] })))
|
||||
}
|
||||
}, [])
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
const [assets, setAssets] = useState<{ k: string; v: string }[]>([])
|
||||
const [assets, setAssets] = useState<{ k: string; v: MaReleaseAsset }[]>([])
|
||||
const [installers, setInstallers] = useState<{ k: string; v: MaReleaseInstaller }[]>([])
|
||||
|
||||
function addAsset() {
|
||||
setAssets((val) => [...val, { k: '', v: '' }])
|
||||
setAssets((val) => [...val, { k: '', v: { uri: '', contentType: '' } }])
|
||||
}
|
||||
|
||||
function addInstaller() {
|
||||
setInstallers((val) => [...val, { k: '', v: { workdir: '', script: '', patches: [] } }])
|
||||
}
|
||||
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
@@ -83,7 +93,11 @@ export default function MaReleaseForm({
|
||||
async function submit(data: MatrixReleaseForm) {
|
||||
try {
|
||||
setBusy(true)
|
||||
await onSubmit({ ...data, assets: assets.reduce((a, { k, v }) => ({ ...a, [k]: v }), {}) })
|
||||
await onSubmit({
|
||||
...data,
|
||||
assets: assets.reduce((a, { k, v }) => ({ ...a, [k]: v }), {}),
|
||||
installers: installers.reduce((a, { k, v }) => ({ ...a, [k]: v }), {}),
|
||||
})
|
||||
callback()
|
||||
} catch (err: any) {
|
||||
setError(err.toString())
|
||||
@@ -105,7 +119,12 @@ export default function MaReleaseForm({
|
||||
|
||||
<FormControl fullWidth>
|
||||
<InputLabel id="release-type">Type</InputLabel>
|
||||
<Select labelId="release-type" label="Type" {...register('type', { required: true })}>
|
||||
<Select
|
||||
labelId="release-type"
|
||||
label="Type"
|
||||
defaultValue={defaultValue?.type}
|
||||
{...register('type', { required: true })}
|
||||
>
|
||||
<MenuItem value={0}>Full Release</MenuItem>
|
||||
<MenuItem value={1}>Patch Release</MenuItem>
|
||||
</Select>
|
||||
@@ -120,44 +139,64 @@ export default function MaReleaseForm({
|
||||
<TextField minRows={5} multiline label="Content" {...register('content')} />
|
||||
|
||||
<Box sx={{ mt: 3, display: 'flex', flexDirection: 'column', gap: 2 }}>
|
||||
<Typography variant="subtitle1">Assets</Typography>
|
||||
<Typography variant="h5">Assets</Typography>
|
||||
|
||||
{assets.map(({ k, v }, idx) => (
|
||||
<Grid container key={idx} spacing={2}>
|
||||
<Grid size={4}>
|
||||
<TextField
|
||||
label="Platform"
|
||||
sx={{ width: '100%' }}
|
||||
value={k}
|
||||
onChange={(val) => {
|
||||
setAssets((data) =>
|
||||
data.map((ele, index) => (index == idx ? { k: val.target.value, v: ele.v } : ele)),
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid size={7}>
|
||||
<TextField
|
||||
label="URL"
|
||||
sx={{ width: '100%' }}
|
||||
value={v}
|
||||
onChange={(val) => {
|
||||
setAssets((data) =>
|
||||
data.map((ele, index) => (index == idx ? { v: val.target.value, k: ele.k } : ele)),
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid size={1} sx={{ display: 'grid', placeItems: 'center' }}>
|
||||
<IconButton
|
||||
onClick={() => {
|
||||
setAssets((data) => data.filter((_, index) => index != idx))
|
||||
}}
|
||||
>
|
||||
<CloseIcon />
|
||||
</IconButton>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Card variant="outlined" key={idx}>
|
||||
<Box sx={{ pl: 2, pr: 4, py: 2 }}>
|
||||
<Grid container spacing={2}>
|
||||
<Grid size={11}>
|
||||
<TextField
|
||||
label="Platform"
|
||||
sx={{ width: '100%' }}
|
||||
value={k}
|
||||
onChange={(val) => {
|
||||
setAssets((data) =>
|
||||
data.map((ele, index) => (index == idx ? { k: val.target.value, v: ele.v } : ele)),
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid size={1} sx={{ display: 'grid', placeItems: 'center' }}>
|
||||
<IconButton
|
||||
onClick={() => {
|
||||
setAssets((data) => data.filter((_, index) => index != idx))
|
||||
}}
|
||||
>
|
||||
<CloseIcon />
|
||||
</IconButton>
|
||||
</Grid>
|
||||
<Grid size={8}>
|
||||
<TextField
|
||||
label="URI"
|
||||
sx={{ width: '100%' }}
|
||||
value={v.uri}
|
||||
onChange={(val) => {
|
||||
setAssets((data) =>
|
||||
data.map((ele, index) =>
|
||||
index == idx ? { v: { ...ele.v, uri: val.target.value }, k: ele.k } : ele,
|
||||
),
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid size={4}>
|
||||
<TextField
|
||||
label="Content Type"
|
||||
sx={{ width: '100%' }}
|
||||
value={v.contentType}
|
||||
onChange={(val) => {
|
||||
setAssets((data) =>
|
||||
data.map((ele, index) =>
|
||||
index == idx ? { v: { ...ele.v, contentType: val.target.value }, k: ele.k } : ele,
|
||||
),
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Box>
|
||||
</Card>
|
||||
))}
|
||||
|
||||
<Box>
|
||||
@@ -167,6 +206,109 @@ export default function MaReleaseForm({
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
<Box sx={{ mt: 3, display: 'flex', flexDirection: 'column', gap: 2 }}>
|
||||
<Typography variant="h5">Installers</Typography>
|
||||
|
||||
{installers.map(({ k, v }, idx) => (
|
||||
<Card variant="outlined" key={idx}>
|
||||
<Box sx={{ pl: 2, pr: 4, py: 2 }}>
|
||||
<Grid container spacing={2}>
|
||||
<Grid size={4}>
|
||||
<TextField
|
||||
label="Platform"
|
||||
sx={{ width: '100%' }}
|
||||
value={k}
|
||||
onChange={(val) => {
|
||||
setInstallers((data) =>
|
||||
data.map((ele, index) => (index == idx ? { k: val.target.value, v: ele.v } : ele)),
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid size={7}>
|
||||
<TextField
|
||||
label="Working Directory"
|
||||
sx={{ width: '100%' }}
|
||||
value={v.workdir}
|
||||
onChange={(val) => {
|
||||
setInstallers((data) =>
|
||||
data.map((ele, index) =>
|
||||
index == idx ? { k: ele.k, v: { ...ele.v, workdir: val.target.value } } : ele,
|
||||
),
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid size={1} sx={{ display: 'grid', placeItems: 'center' }}>
|
||||
<IconButton
|
||||
onClick={() => {
|
||||
setInstallers((data) => data.filter((_, index) => index != idx))
|
||||
}}
|
||||
>
|
||||
<CloseIcon />
|
||||
</IconButton>
|
||||
</Grid>
|
||||
<Grid size={12}>
|
||||
<Typography variant="subtitle1" sx={{ mx: 1 }}>
|
||||
Script
|
||||
</Typography>
|
||||
<Card variant="outlined">
|
||||
<MonacoEditor
|
||||
height="280px"
|
||||
width="100%"
|
||||
options={{ minimap: { enabled: false } }}
|
||||
defaultValue={v.script}
|
||||
onChange={(val) =>
|
||||
setInstallers((data) =>
|
||||
data.map((ele, index) => (index == idx ? { v: { ...ele.v, script: val }, k: ele.k } : ele)),
|
||||
)
|
||||
}
|
||||
/>
|
||||
</Card>
|
||||
</Grid>
|
||||
<Grid size={12}>
|
||||
<Typography variant="subtitle1" sx={{ mx: 1 }}>
|
||||
Patches
|
||||
</Typography>
|
||||
<Card variant="outlined">
|
||||
<MonacoEditor
|
||||
height="280px"
|
||||
width="100%"
|
||||
options={{ minimap: { enabled: false } }}
|
||||
defaultValue={v.patches.map((p) => `${p.action}:${p.glob}`).join('\n')}
|
||||
onChange={(val) =>
|
||||
setInstallers((data) =>
|
||||
data.map((ele, index) =>
|
||||
index == idx
|
||||
? {
|
||||
v: {
|
||||
...ele.v,
|
||||
patches: val?.split('\n')?.map((p) => ({
|
||||
action: p.split(':')[0],
|
||||
glob: p.split(':')[1],
|
||||
})) as MaReleaseInstallerPatch[],
|
||||
},
|
||||
k: ele.k,
|
||||
}
|
||||
: ele,
|
||||
),
|
||||
)
|
||||
}
|
||||
/>
|
||||
</Card>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Box>
|
||||
</Card>
|
||||
))}
|
||||
|
||||
<Box>
|
||||
<Button variant="outlined" onClick={addInstaller}>
|
||||
Add
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
<Box sx={{ mt: 5 }} display="flex" gap={2}>
|
||||
<Button variant="contained" type="submit" disabled={busy}>
|
||||
Submit
|
||||
|
||||
Reference in New Issue
Block a user