fix scroll

Signed-off-by: jingyang <3161362058@qq.com>
labring · Dec 16, 2023 · 3486089 · 3486089
1 parent b06bd04
commit 3486089
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 22 deletions.
diff --git a/frontend/providers/template/src/pages/develop/components/YamlList.tsx b/frontend/providers/template/src/pages/develop/components/YamlList.tsx
@@ -8,13 +8,12 @@ const YamlList = ({ yamlList = [] }: { yamlList: YamlItemType[] }) => {
   return (
     <Flex
       flexGrow={1}
-      h="0"
+      // h="0"
       mt={'12px'}
       alignItems={'start'}
       zIndex={1}
       position={'relative'}
-      overflow={'scroll'}
-    >
+      overflow={'scroll'}>
       <Box flexShrink={0} mt={3} borderRadius={'sm'} overflow={'hidden'} bg={'white'}>
         {yamlList.map((file, index) => (
           <Box
@@ -39,8 +38,7 @@ const YamlList = ({ yamlList = [] }: { yamlList: YamlItemType[] }) => {
                   borderColor: 'myGray.200',
                   backgroundColor: 'transparent'
                 })}
-            onClick={() => setSelectedIndex(index)}
-          >
+            onClick={() => setSelectedIndex(index)}>
             {file.filename.replace(/-.*/, '')}
           </Box>
         ))}

diff --git a/frontend/providers/template/src/pages/develop/index.tsx b/frontend/providers/template/src/pages/develop/index.tsx
@@ -53,13 +53,11 @@ export default function Develop() {
     data: EnvResponse;
   };
 
-  const onYamlChange = useCallback(
-    debounce((state: EditorState) => {
-      const value = state.doc.toString();
-      parseTemplate(value);
-    }, 1000),
-    [debounce]
-  );
+  const onYamlChange = debounce((state: EditorState) => {
+    const value = state.doc.toString();
+    parseTemplate(value);
+  }, 1000);
+
   const getYamlSource = (str: string): TemplateSourceType => {
     const yamlData = JsYaml.loadAll(str);
     const templateYaml: TemplateType = yamlData.find(
@@ -229,8 +227,7 @@ export default function Develop() {
         borderRadius={'8px'}
         overflowY={'hidden'}
         overflowX={'scroll'}
-        flex={1}
-      >
+        flex={1}>
         {/* left */}
         <Flex flexDirection={'column'} w="50%" borderRight={'1px solid #EFF0F1'}>
           <Flex
@@ -240,8 +237,7 @@ export default function Develop() {
             alignItems={'center'}
             backgroundColor={'#F8FAFB'}
             px="36px"
-            borderRadius={'8px 8px 0px 0px '}
-          >
+            borderRadius={'8px 8px 0px 0px '}>
             <MyIcon name="dev" color={'#24282C'} w={'24px'} h={'24px'}></MyIcon>
             <Text fontWeight={'500'} fontSize={'16px'} color={'#24282C'} ml="8px">
               {t('develop.Development')}
@@ -267,8 +263,7 @@ export default function Develop() {
             alignItems={'center'}
             backgroundColor={'#F8FAFB'}
             pl="42px"
-            borderRadius={'8px 8px 0px 0px '}
-          >
+            borderRadius={'8px 8px 0px 0px '}>
             <MyIcon name="eyeShow" color={'#24282C'} w={'24px'} h={'24px'}></MyIcon>
             <Text fontWeight={'500'} fontSize={'16px'} color={'#24282C'} ml="8px">
               {t('develop.Preview')}
@@ -280,8 +275,7 @@ export default function Develop() {
               pt="26px"
               pr={{ sm: '20px', md: '60px' }}
               borderBottom={'1px solid #EFF0F1'}
-              flexDirection={'column'}
-            >
+              flexDirection={'column'}>
               <Text fontWeight={'500'} fontSize={'18px'} color={'#24282C'}>
                 {t('develop.Configure Form')}
               </Text>
@@ -297,8 +291,7 @@ export default function Develop() {
                   minW={'100px'}
                   h={'34px'}
                   variant={'link'}
-                  onClick={handleExportYaml}
-                >
+                  onClick={handleExportYaml}>
                   {t('Export')} Yaml
                 </Button>
               </Flex>