Skip to content

Commit a17e6a3

Browse files
NixieboluoNixieboluo
authored
fix(template): app yaml parsing fails if not rendered (#6058)
fix(template): app yaml parsing fails if not rendered with default values Signed-off-by: Nixieboluo <me@sagirii.me>
1 parent c39d7bd commit a17e6a3

4 files changed

Lines changed: 66 additions & 65 deletions

File tree

‎frontend/providers/template/src/pages/api/getTemplateSource.ts‎

Lines changed: 33 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,8 @@ import type { NextApiRequest, NextApiResponse } from 'next';
1414
import path from 'path';
1515
import { replaceRawWithCDN } from './listTemplate';
1616
import { getTemplateEnvs } from '@/utils/tools';
17-
import { getResourceUsage } from '@/utils/usage';
17+
import { getResourceUsage, ResourceUsage } from '@/utils/usage';
18+
import { generateYamlData, getTemplateDefaultValues } from '@/utils/template';
1819

1920
export default async function handler(req: NextApiRequest, res: NextApiResponse) {
2021
try {
@@ -57,20 +58,41 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
5758
return jsonRes(res, { code, message });
5859
}
5960

60-
// ? Not rendering the template here, hope it's parsable.
61-
const requirements = getResourceUsage([appYaml ?? '']);
61+
if (!appYaml || !templateName || !templateYaml || !TemplateEnvs) {
62+
return jsonRes(res, {
63+
code: 400,
64+
message: 'Invalid template request!'
65+
});
66+
}
67+
68+
const templateSource = {
69+
source: {
70+
...dataSource,
71+
...TemplateEnvs
72+
},
73+
appYaml,
74+
templateYaml,
75+
readmeContent,
76+
readUrl
77+
};
78+
79+
let requirements: ResourceUsage | null = null;
80+
try {
81+
const platformEnvs = getTemplateEnvs(user_namespace);
82+
const renderedYaml = generateYamlData(
83+
templateSource,
84+
getTemplateDefaultValues(templateSource),
85+
platformEnvs
86+
);
87+
requirements = getResourceUsage(renderedYaml.map((item) => item.value));
88+
} catch (error) {
89+
console.error(`Error getting default resource requirements for template '${templateName}'`);
90+
}
6291

6392
jsonRes(res, {
6493
code: 200,
6594
data: {
66-
source: {
67-
...dataSource,
68-
...TemplateEnvs
69-
},
70-
appYaml,
71-
templateYaml,
72-
readmeContent,
73-
readUrl,
95+
...templateSource,
7496
requirements
7597
}
7698
});

‎frontend/providers/template/src/pages/deploy/index.tsx‎

Lines changed: 3 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import { useCallback, useEffect, useMemo, useState, useRef } from 'react';
2020
import { useForm } from 'react-hook-form';
2121
import Form from './components/Form';
2222
import ReadMe from './components/ReadMe';
23-
import { getTemplateInputDefaultValues, getTemplateValues } from '@/utils/template';
23+
import { generateYamlData, getTemplateInputDefaultValues } from '@/utils/template';
2424
import { getResourceUsage } from '@/utils/usage';
2525
import Head from 'next/head';
2626
import { useMessage } from '@sealos/ui';
@@ -94,32 +94,12 @@ export default function EditApp({
9494
content: 'Do you want to jump to the app details page'
9595
});
9696

97-
const generateYamlData = useCallback(
98-
(templateSource: TemplateSourceType, inputs: Record<string, string>): YamlItemType[] => {
99-
if (!templateSource) return [];
100-
const app_name = templateSource?.source?.defaults?.app_name?.value;
101-
const { defaults, defaultInputs } = getTemplateValues(templateSource);
102-
const data = {
103-
...platformEnvs,
104-
...templateSource?.source,
105-
inputs: {
106-
...defaultInputs,
107-
...inputs
108-
},
109-
defaults: defaults
110-
};
111-
const generateStr = parseTemplateString(templateSource.appYaml, data);
112-
return generateYamlList(generateStr, app_name);
113-
},
114-
[platformEnvs]
115-
);
116-
11797
const debouncedFnRef = useRef<any>(null);
11898
useEffect(() => {
11999
debouncedFnRef.current = debounce((inputValues: Record<string, string>) => {
120100
try {
121101
if (!templateSource) return;
122-
const list = generateYamlData(templateSource, inputValues);
102+
const list = generateYamlData(templateSource, inputValues, platformEnvs);
123103
setYamlList(list);
124104
} catch (error) {
125105
console.log(error);
@@ -128,7 +108,7 @@ export default function EditApp({
128108
return () => {
129109
debouncedFnRef.current = null;
130110
};
131-
}, [templateSource, generateYamlData]);
111+
}, [templateSource, platformEnvs]);
132112

133113
const formOnchangeDebounce = useCallback((inputs: Record<string, string>) => {
134114
if (debouncedFnRef.current) {

‎frontend/providers/template/src/pages/develop/index.tsx‎

Lines changed: 7 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -5,21 +5,16 @@ import { editModeMap } from '@/constants/editApp';
55
import { useLoading } from '@/hooks/useLoading';
66
import { useToast } from '@/hooks/useToast';
77
import { YamlItemType } from '@/types';
8-
import { TemplateSourceType, TemplateType } from '@/types/app';
8+
import { TemplateSourceType } from '@/types/app';
99
import { EnvResponse } from '@/types/index';
1010
import { serviceSideProps } from '@/utils/i18n';
11-
import {
12-
developGenerateYamlList,
13-
handleTemplateToInstanceYaml,
14-
parseTemplateString,
15-
getYamlSource
16-
} from '@/utils/json-yaml';
17-
import { getTemplateInputDefaultValues, getTemplateValues } from '@/utils/template';
11+
import { getYamlSource } from '@/utils/json-yaml';
12+
import { generateYamlData, getTemplateInputDefaultValues } from '@/utils/template';
1813
import { downLoadBold } from '@/utils/tools';
19-
import { Button, Center, Flex, Spinner, Text } from '@chakra-ui/react';
14+
import { Button, Flex, Text } from '@chakra-ui/react';
2015
import { useQuery } from '@tanstack/react-query';
2116
import dayjs from 'dayjs';
22-
import { debounce, has, isObject, mapValues } from 'lodash';
17+
import { debounce, has, isObject } from 'lodash';
2318
import { useTranslation } from 'next-i18next';
2419
import { useCallback, useEffect, useRef, useState } from 'react';
2520
import { useForm } from 'react-hook-form';
@@ -48,25 +43,6 @@ export default function Develop() {
4843
}
4944
);
5045

51-
const generateYamlData = useCallback(
52-
(yamlSource: TemplateSourceType, inputs: Record<string, string> = {}): YamlItemType[] => {
53-
const { defaults, defaultInputs } = getTemplateValues(yamlSource);
54-
const data = {
55-
...platformEnvs,
56-
...yamlSource?.source,
57-
inputs: {
58-
...defaultInputs,
59-
...inputs
60-
},
61-
defaults: defaults
62-
};
63-
const generateStr = parseTemplateString(yamlSource.appYaml, data);
64-
const _instanceName = yamlSource?.source?.defaults?.app_name?.value || '';
65-
return developGenerateYamlList(generateStr, _instanceName);
66-
},
67-
[platformEnvs]
68-
);
69-
7046
const parseTemplate = useCallback(
7147
(str: string) => {
7248
if (!str || !str.trim()) {
@@ -78,7 +54,7 @@ export default function Develop() {
7854
const result = getYamlSource(str, platformEnvs);
7955
const formInputs = formHook.getValues();
8056
setTemplateSource(result);
81-
const correctYamlList = generateYamlData(result, formInputs);
57+
const correctYamlList = generateYamlData(result, formInputs, platformEnvs);
8258
setYamlList(correctYamlList);
8359
} catch (error: any) {
8460
toast({
@@ -90,7 +66,7 @@ export default function Develop() {
9066
});
9167
}
9268
},
93-
[platformEnvs, generateYamlData]
69+
[platformEnvs]
9470
);
9571

9672
const onYamlChange = useCallback(

‎frontend/providers/template/src/utils/template.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
1+
import { EnvResponse, YamlItemType } from '@/types';
12
import { TemplateSourceType } from '@/types/app';
23
import { reduce, mapValues } from 'lodash';
4+
import { generateYamlList, parseTemplateString } from './json-yaml';
35

46
export const getTemplateInputDefaultValues = (templateSource: TemplateSourceType | undefined) => {
57
const inputs = templateSource?.source?.inputs;
@@ -41,3 +43,24 @@ export function findTopKeyWords(keywordsList: string[][], topCount: number) {
4143

4244
return topKeywords;
4345
}
46+
47+
export const generateYamlData = (
48+
templateSource: TemplateSourceType,
49+
inputs: Record<string, string>,
50+
platformEnvs?: EnvResponse
51+
): YamlItemType[] => {
52+
if (!templateSource) return [];
53+
const app_name = templateSource?.source?.defaults?.app_name?.value;
54+
const { defaults, defaultInputs } = getTemplateValues(templateSource);
55+
const data = {
56+
...platformEnvs,
57+
...templateSource?.source,
58+
inputs: {
59+
...defaultInputs,
60+
...inputs
61+
},
62+
defaults: defaults
63+
};
64+
const generateStr = parseTemplateString(templateSource.appYaml, data);
65+
return generateYamlList(generateStr, app_name);
66+
};

0 commit comments

Comments
 (0)