Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat:launchpad support shared storage #5336

Closed
wants to merge 4 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions frontend/providers/applaunchpad/data/config.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ common:
apiEnabled: false
gpuEnabled: false
launchpad:
storageClassName: "choosable"
pvcStorageMax: 100
eventAnalyze:
enabled: false
Expand Down
7 changes: 5 additions & 2 deletions frontend/providers/applaunchpad/public/locales/en/common.json
Original file line number Diff line number Diff line change
Expand Up @@ -276,5 +276,8 @@
"add_configmap": "Add Configmaps",
"storage_path_placeholder": "For Example: /data"
},
"guide_deploy_button": "Complete creation"
}
"guide_deploy_button": "Complete creation",
"shared_storage": "shared storage",
"data_can_be_communicated_between_multiple_instances": "Data can be shared across multiple instances",
"shared": "Shard"
}
7 changes: 5 additions & 2 deletions frontend/providers/applaunchpad/public/locales/zh/common.json
Original file line number Diff line number Diff line change
Expand Up @@ -277,5 +277,8 @@
"add_configmap": "新增配置文件",
"storage_path_placeholder": "如:/data"
},
"guide_deploy_button": "完成创建"
}
"guide_deploy_button": "完成创建",
"shared_storage": "共享存储",
"data_can_be_communicated_between_multiple_instances": "数据可在多个实例间相互共享",
"shared": "共享"
}
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ export type Response = {
DESKTOP_DOMAIN: string;
PVC_STORAGE_MAX: number;
GPU_ENABLED: boolean;
STORAGE_CLASSNAME: string;
};

export const defaultAppConfig: AppConfigType = {
Expand All @@ -39,6 +40,7 @@ export const defaultAppConfig: AppConfigType = {
gpuEnabled: false
},
launchpad: {
storageClassName: 'choosable',
currencySymbol: Coin.shellCoin,
pvcStorageMax: 20,
eventAnalyze: {
Expand Down Expand Up @@ -99,7 +101,8 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
SEALOS_USER_DOMAINS: global.AppConfig.cloud.userDomains || [],
DESKTOP_DOMAIN: global.AppConfig.cloud.desktopDomain,
PVC_STORAGE_MAX: global.AppConfig.launchpad.pvcStorageMax || 20,
GPU_ENABLED: global.AppConfig.common.gpuEnabled
GPU_ENABLED: global.AppConfig.common.gpuEnabled,
STORAGE_CLASSNAME: global.AppConfig.launchpad.storageClassName
}
});
} catch (error) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -413,6 +413,9 @@ const AppBaseInfo = ({ app = MOCK_APP_DETAIL }: { app: AppDetailType }) => {
{item.value} Gi
</Box>
</Box>
<Box fontSize={'12px'} color={'grayModern.600'}>
{item.isShared ? t('shared') : ''}
</Box>
</Flex>
))}
</Box>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -94,6 +94,7 @@ const ConfigmapModal = ({
{t('file value')}{' '}
</Box>
<Textarea
whiteSpace={'pre-wrap'}
rows={10}
resize={'both'}
{...register('value', {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -77,13 +77,13 @@ const EditEnvs = ({
{t('Environment Variables')}
</Box>
<Textarea
whiteSpace={'pre-wrap'}
h={'350px'}
maxH={'100%'}
value={inputVal}
resize={'both'}
placeholder={t('Env Placeholder') || ''}
overflowX={'auto'}
whiteSpace={inputVal === '' ? 'pre-wrap' : 'nowrap'}
onChange={(e) => setInputVal(e.target.value)}
/>
</ModalBody>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -410,7 +410,7 @@ const Form = ({
pr={`${pxVal}px`}
height={'100%'}
position={'relative'}
overflowY={'scroll'}
// overflowY={'scroll'}
>
{/* base info */}
<Box id={'baseInfo'} {...boxStyles}>
Expand Down Expand Up @@ -1128,17 +1128,19 @@ const Form = ({
w={'320px'}
height={'32px'}
variant={'outline'}
onClick={() => setStoreEdit({ name: '', path: '', value: 1 })}
onClick={() =>
setStoreEdit({ name: '', path: '', value: 1, isShared: false })
}
leftIcon={<MyIcon name="plus" w={'16px'} fill="#485264" />}
>
{t('Add volume')}
</Button>
<Tip
{/* <Tip
ml={4}
icon={<InfoOutlineIcon />}
size="sm"
text={t('Data cannot be communicated between multiple instances')}
/>
/> */}
</Flex>
<Box mt={4} pl={`${labelWidth}px`}>
{storeList.map((item, index) => (
Expand All @@ -1157,7 +1159,7 @@ const Form = ({
>
<MyIcon name={'store'} />
<Box ml={4} flex={'1 0 0'} w={0}>
<Box color={'myGray.900'} fontWeight={'bold'}>
<Box color={'grayModern.900'} fontWeight={'bold'}>
{item.path}
</Box>
<Box
Expand All @@ -1168,6 +1170,9 @@ const Form = ({
{item.value} Gi
</Box>
</Box>
<Box fontSize={'12px'} color={'grayModern.600'}>
{item.isShared ? t('shared') : ''}
</Box>
</Flex>
<IconButton
height={'32px'}
Expand Down Expand Up @@ -1262,7 +1267,8 @@ const Form = ({
storeList.map((item) => ({
name: item.id === e.id ? e.name : item.name,
path: item.id === e.id ? e.path : item.path,
value: item.id === e.id ? e.value : item.value
value: item.id === e.id ? e.value : item.value,
isShared: item.id === e.id ? e.isShared : item.isShared
}))
);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,27 +15,35 @@ import {
NumberInputField,
NumberInputStepper,
NumberIncrementStepper,
NumberDecrementStepper
NumberDecrementStepper,
Flex,
Switch,
Text
} from '@chakra-ui/react';
import { useForm } from 'react-hook-form';
import MyFormControl from '@/components/FormControl';
import { useTranslation } from 'next-i18next';
import { pathToNameFormat } from '@/utils/tools';
import { MyTooltip } from '@sealos/ui';
import { MyTooltip, Tip } from '@sealos/ui';
import { PVC_STORAGE_MAX } from '@/store/static';
import { InfoOutlineIcon } from '@chakra-ui/icons';
import { getValueByPointer } from 'fast-json-patch';
import { STORAGE_CLASSNAME } from '@/store/static';

export type StoreType = {
id?: string;
name: string;
path: string;
value: number;
isShared: boolean;
};

const StoreModal = ({
defaultValue = {
name: '',
path: '',
value: 1
value: 1,
isShared: false
},
listNames,
isEditStore,
Expand All @@ -57,6 +65,8 @@ const StoreModal = ({
const {
register,
setValue,

watch,
handleSubmit,
formState: { errors }
} = useForm({
Expand Down Expand Up @@ -156,6 +166,28 @@ const StoreModal = ({
}
})}
/>
{STORAGE_CLASSNAME && (
<Flex alignItems={'center'} mt={'8px'}>
<Text fontSize={'14px'} fontWeight={500} color={'grayModern.900'}>
{t('shared_storage')}
</Text>
<Switch
ml={'8px'}
isChecked={watch('isShared')}
onChange={(e) => setValue('isShared', e.target.checked)}
/>
</Flex>
)}
<Tip
mt={'8px'}
icon={<InfoOutlineIcon />}
size="sm"
text={
watch('isShared')
? t('data_can_be_communicated_between_multiple_instances')
: t('Data cannot be communicated between multiple instances')
}
/>
</MyFormControl>
</ModalBody>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -328,6 +328,7 @@ const EditApp = ({ appName, tabType }: { appName?: string; tabType: string }) =>
h={'100%'}
minWidth={'1024px'}
backgroundColor={'grayModern.100'}
overflowY={'auto'}
>
<Header
appName={formHook.getValues('appName')}
Expand Down
5 changes: 4 additions & 1 deletion frontend/providers/applaunchpad/src/store/static.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ export let UPLOAD_LIMIT = 50;
export let DOWNLOAD_LIMIT = 100;
export let PVC_STORAGE_MAX = 20;
export let GPU_ENABLED = false;
export let STORAGE_CLASSNAME = '';

export const loadInitData = async () => {
try {
Expand All @@ -26,14 +27,16 @@ export const loadInitData = async () => {
DESKTOP_DOMAIN = res.DESKTOP_DOMAIN;
PVC_STORAGE_MAX = res.PVC_STORAGE_MAX;
GPU_ENABLED = res.GPU_ENABLED;
STORAGE_CLASSNAME = res.STORAGE_CLASSNAME;

return {
SEALOS_DOMAIN,
DOMAIN_PORT,
CURRENCY,
FORM_SLIDER_LIST_CONFIG: res.FORM_SLIDER_LIST_CONFIG,
DESKTOP_DOMAIN: res.DESKTOP_DOMAIN,
GPU_ENABLED
GPU_ENABLED,
STORAGE_CLASSNAME
};
} catch (error) {}

Expand Down
1 change: 1 addition & 0 deletions frontend/providers/applaunchpad/src/types/app.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -106,6 +106,7 @@ export interface AppEditType {
name: string;
path: string;
value: number;
isShared: boolean;
}[];
labels: { [key: string]: string };
}
Expand Down
1 change: 1 addition & 0 deletions frontend/providers/applaunchpad/src/types/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ export type AppConfigType = {
gpuEnabled: boolean;
};
launchpad: {
storageClassName: string;
currencySymbol: Coin;
pvcStorageMax: number;
eventAnalyze: {
Expand Down
3 changes: 2 additions & 1 deletion frontend/providers/applaunchpad/src/utils/adapt.ts
Original file line number Diff line number Diff line change
Expand Up @@ -370,7 +370,8 @@ export const adaptAppDetail = async (configs: DeployKindsType[]): Promise<AppDet
? deployKindsMap.StatefulSet?.spec?.volumeClaimTemplates.map((item) => ({
name: item.metadata?.name || '',
path: item.metadata?.annotations?.path || '',
value: Number(item.metadata?.annotations?.value || 0)
value: Number(item.metadata?.annotations?.value || 0),
isShared: item.spec?.accessModes?.[0] === 'ReadWriteMany' ? true : false
}))
: [],
source: getAppSource(appDeploy)
Expand Down
5 changes: 3 additions & 2 deletions frontend/providers/applaunchpad/src/utils/deployYaml2Json.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import {
minReplicasKey,
publicDomainKey
} from '@/constants/app';
import { SEALOS_USER_DOMAINS } from '@/store/static';
import { SEALOS_USER_DOMAINS, STORAGE_CLASSNAME } from '@/store/static';
import type { AppEditType } from '@/types/app';
import { pathFormat, pathToNameFormat, str2Num, strToBase64 } from '@/utils/tools';
import dayjs from 'dayjs';
Expand Down Expand Up @@ -125,7 +125,8 @@ export const json2DeployCr = (data: AppEditType, type: 'deployment' | 'statefuls
name: store.name
},
spec: {
accessModes: ['ReadWriteOnce'],
...(STORAGE_CLASSNAME && store.isShared ? { storageClassName: STORAGE_CLASSNAME } : {}),
accessModes: [STORAGE_CLASSNAME && store.isShared ? 'ReadWriteMany' : 'ReadWriteOnce'],
resources: {
requests: {
storage: `${store.value}Gi`
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
item?.metadata?.name &&
!DBVersionMap[db].find((db) => db.id === item.metadata.name)
) {
DBVersionMap[db].push({
DBVersionMap[db].unshift({
id: item.metadata.name,
label: item.metadata.name
});
Expand Down
5 changes: 4 additions & 1 deletion frontend/providers/dbprovider/src/store/static.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,10 @@ let retryGetPrice = 3;
let retryVersion = 3;
let retryGetEnv = 3;
export let DBVersionMap: DBVersionMapType = {
[DBTypeEnum.postgresql]: [{ id: 'postgresql-14.8.0', label: 'postgresql-14.8.0' }],
[DBTypeEnum.postgresql]: [
{ id: 'postgresql-12.14.0', label: 'postgresql-12.14.0' },
{ id: 'postgresql-14.8.0', label: 'postgresql-14.8.0' }
],
[DBTypeEnum.mongodb]: [{ id: 'mongodb-5.0', label: 'mongodb-5.0' }],
[DBTypeEnum.mysql]: [{ id: 'ac-mysql-8.0.30', label: 'ac-mysql-8.0.30' }],
[DBTypeEnum.redis]: [{ id: 'redis-7.0.6', label: 'redis-7.0.6' }],
Expand Down
Loading