fix(portal): capitalize env select options (#138)

* fix(portal): capitalize env select options * fix(portal): adjust check icon on quick start guide
mycloudnexus · Nov 15, 2024 · f8a2876 · f8a2876
1 parent 6e1e771
commit f8a2876
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 2 deletions.
diff --git a/kraken-app/kraken-app-portal/src/pages/HomePage/components/ActivityDiagrams/index.tsx b/kraken-app/kraken-app-portal/src/pages/HomePage/components/ActivityDiagrams/index.tsx
@@ -21,6 +21,7 @@ import ApiActivityDiagram from "./ApiActivityDiagram";
 import ErrorBrakedownDiagram from "./ErrorDiagram";
 import MostPopularEndpoints from "./MostPopularEndpoints";
 import styles from "./index.module.scss";
+import { capitalize } from 'lodash';
 
 export type DiagramProps = {
   envId: string;
@@ -77,7 +78,7 @@ const DiagramWrapper = ({ envs }: Props) => {
     return (
       envs?.map((env) => ({
         value: env.id,
-        label: env.name,
+        label: capitalize(env.name),
       })) ?? []
     );
   }, [envs]);

diff --git a/kraken-app/kraken-app-portal/src/pages/HomePage/components/QuickStartGuide/index.tsx b/kraken-app/kraken-app-portal/src/pages/HomePage/components/QuickStartGuide/index.tsx
@@ -112,7 +112,9 @@ const QuickStartGuide = () => {
                             goal as keyof (typeof quickStartGuideData)[keyof IQuickStartGuideObject]
                           ] ? (
                             <Flex key={goal} gap={10}>
-                              <CheckFilled />
+                              <div className={styles.iconContainer}>
+                                <CheckFilled />
+                              </div>
                               <Text.LightMedium>
                                 {i.goals[goal as keyof typeof i.goals]}
                               </Text.LightMedium>

diff --git a/kraken-app/kraken-app-portal/src/pages/HomePage/components/index.module.scss b/kraken-app/kraken-app-portal/src/pages/HomePage/components/index.module.scss
@@ -4,6 +4,10 @@
   border-radius: 8px;
 }
 
+.iconContainer {
+  width: 20px;
+}
+
 .guideContainer {
   justify-content: center;
   align-items: center;