opensource/sealos
3
0
Fork 0
mirror of https://github.com/labring/sealos.git synced 2026-09-24 15:46:19 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: template evaluate expression (#5628)

Browse Source 
* feat: template add scripts

* dev

* update annotations

* fix evaluateExpression

* update
This commit is contained in:
jingyang
2025-06-03 12:02:46 +08:00
committed by GitHub
parent 8bf8231a3d
commit f11d60782f
7 changed files with 86 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/providers/template/.vscode/settings.json
Vendored
+1 -1
View File
@@ -11,7 +11,7 @@
"i18n-ally.keystyle": "nested",
"i18n-ally.sortKeys": true,
"i18n-ally.keepFulfilled": false,
"i18n-ally.sourceLanguage": "zh",
"i18n-ally.sourceLanguage": "en",
"i18n-ally.displayLanguage": "zh",
"i18n-ally.pathMatcher": "{locale}/{namespaces}.json",
"i18n-ally.extract.targetPickingStrategy": "most-similar-by-key"
frontend/providers/template/src/constants/theme.ts
+37 -1
View File
@@ -7,12 +7,48 @@ import {
} from '@chakra-ui/react';
import { theme as sealosTheme } from '@sealos/ui';
// @ts-ignore
import { selectAnatomy, switchAnatomy } from '@chakra-ui/anatomy';
import { modalAnatomy, selectAnatomy, switchAnatomy } from '@chakra-ui/anatomy';
const { definePartsStyle: selectPart, defineMultiStyleConfig: selectMultiStyle } =
createMultiStyleConfigHelpers(selectAnatomy.keys);
const { definePartsStyle: switchPart, defineMultiStyleConfig: switchMultiStyle } =
createMultiStyleConfigHelpers(switchAnatomy.keys);
const ModalHelper = createMultiStyleConfigHelpers(modalAnatomy.keys);
export const Modal = ModalHelper.defineMultiStyleConfig({
baseStyle: {
header: {
bg: '#fff',
borderTopRadius: '16px',
fontSize: '16px',
borderBottom: 'none',
color: 'grayModern.900',
fontWeight: '500',
py: '11.5px',
lineHeight: '24px'
},
closeButton: {
fill: '#111824',
svg: {
width: '12px',
height: '12px'
}
},
dialog: {
borderRadius: '16px'
},
body: {
px: '36px',
py: '24px'
},
footer: {
px: '36px',
pb: '24px',
pt: '0px'
}
}
});
const Button = defineStyleConfig({
baseStyle: {
_active: {
frontend/providers/template/src/pages/_document.tsx
+4
View File
@@ -2,6 +2,7 @@ import { Html, Head, Main, NextScript } from 'next/document';
export default function Document() {
const brandName = process.env.NEXT_PUBLIC_BRAND_NAME;
const scripts: { [key: string]: string }[] = JSON.parse(process.env.CUSTOM_SCRIPTS ?? '[]');
return (
<Html lang="en">
@@ -17,6 +18,9 @@ export default function Document() {
<body>
<Main />
<NextScript />
{scripts.map((script, i) => (
<script key={i} {...script} async />
))}
</body>
</Html>
);
frontend/providers/template/src/pages/instance/components/header.tsx
+26 -8
View File
@@ -14,6 +14,7 @@ import {
Modal,
ModalCloseButton,
ModalContent,
ModalFooter,
ModalHeader,
ModalOverlay,
Text,
@@ -61,9 +62,9 @@ export default function Header({ instanceName }: { instanceName: string }) {
const handleDisplayName = async () => {
try {
if (yamlCR.current) {
yamlCR.current.metadata.labels = yamlCR.current.metadata.labels ?? {};
yamlCR.current.metadata.annotations = yamlCR.current.metadata.annotations ?? {};
if (displayName) {
yamlCR.current.metadata.labels[templateDisplayNameKey] = displayName;
yamlCR.current.metadata.annotations[templateDisplayNameKey] = displayName;
}
const yaml = JsYaml.dump(yamlCR.current);
await postDeployApp([yaml], 'replace');
@@ -174,16 +175,33 @@ export default function Header({ instanceName }: { instanceName: string }) {
<Modal isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalHeader>{t('Edit App Name')}</ModalHeader>
<ModalHeader bg={'#fff'} borderBottom={'none'}>
{t('set_app_remark')}
</ModalHeader>
<ModalCloseButton />
<Flex flexDirection={'column'} p="24px 36px">
<Flex flexDirection={'column'} p="16px 24px">
<Text fontSize={'14px'} fontWeight={500} color={'#24282C'}>
{t('App Name')}
</Text>
<Input mt="8px" value={displayName} onChange={(e) => setDisplayName(e.target.value)} />
<Button mt="24px" alignSelf={'end'} variant={'primary'} onClick={handleDisplayName}>
{t('Confirm')}
</Button>
<Input
w="100%"
mt="8px"
value={displayName}
onChange={(e) => setDisplayName(e.target.value)}
/>
<ModalFooter p={'0px'} gap={'12px'} mt="16px">
<Button
variant={'outline'}
onClick={() => {
onClose();
}}
>
{t('Cancel')}
</Button>
<Button variant={'primary'} onClick={handleDisplayName}>
{t('Confirm')}
</Button>
</ModalFooter>
</Flex>
</ModalContent>
</Modal>
frontend/providers/template/src/types/app.ts
+1
View File
@@ -102,6 +102,7 @@ export type TemplateInstanceType = {
name: string;
creationTimestamp?: string;
labels?: Record<string, string>;
annotations?: Record<string, string>;
};
spec: {
categories: string[];
frontend/providers/template/src/utils/adapt.ts
+4 -1
View File
@@ -51,7 +51,10 @@ export function adaptInstanceListItem(item: TemplateInstanceType): InstanceListI
title: item.spec?.title,
url: item.spec?.url,
yamlCR: item,
displayName: item.metadata?.labels?.[templateDisplayNameKey]
// Compatible with old versions
displayName:
item.metadata?.annotations?.[templateDisplayNameKey] ??
item.metadata?.labels?.[templateDisplayNameKey]
};
}
frontend/providers/template/src/utils/json-yaml.ts
+13 -1
View File
@@ -189,12 +189,24 @@ export function evaluateExpression(
try {
// console.log("expression: ", expression, " data: ", data)
// const result = new Function('data', `with(data) { return ${expression}; }`)(data);
const processedExpression = expression.replace(
/(\w+)\.([a-zA-Z_$][\w\-]*)/g,
(match, obj, prop) => {
if (prop.includes('-')) {
return `${obj}['${prop}']`;
}
return match;
}
);
const initInterpreterFunc = (interpreter: any, ctx: any) => {
interpreter.setProperty(ctx, 'data', interpreter.nativeToPseudo(data));
interpreter.setProperty(ctx, 'random', interpreter.createNativeFunction(nanoid));
interpreter.setProperty(ctx, 'base64', interpreter.createNativeFunction(base64));
};
const interpreter = new Interpreter(`with(data) { ${expression} }`, initInterpreterFunc);
const interpreter = new Interpreter(
`with(data) { ${processedExpression} }`,
initInterpreterFunc
);
interpreter.run();
// console.log('resoult: ', interpreter.value)
return interpreter.value;