Use brain icon for automatic generate action button

the-deep · Jul 17, 2024 · b7308c3 · b7308c3
1 parent ac0fd31
commit b7308c3
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 4 deletions.
diff --git a/app/views/PillarAnalysis/AnalyticalStatementInput/StoryAnalysisModal/index.tsx b/app/views/PillarAnalysis/AnalyticalStatementInput/StoryAnalysisModal/index.tsx
@@ -18,6 +18,7 @@ import {
     QuickActionButton,
     QuickActionConfirmButton,
     SegmentInput,
+    Svg,
     Tab,
     TabList,
     TabPanel,
@@ -34,7 +35,6 @@ import {
     listToGroupList,
     isTruthyString,
 } from '@togglecorp/fujs';
-import { IoIosRefresh } from 'react-icons/io';
 import {
     IoChevronForward,
     IoChevronBackOutline,
@@ -52,6 +52,7 @@ import {
     AnalyticalInformationSummaryQuery,
     AnalyticalInformationSummaryQueryVariables,
 } from '#generated/types';
+import brainIcon from '#resources/img/brain.svg';
 import EntryCard from './EntryCard';
 import EntryContext from '../../context';
 import Summary from './Summary';
@@ -603,8 +604,12 @@ function StoryAnalysisModal(props: Props) {
                                                 message="You are about to auto generate information gap using NLP. This will replace the current information gap. Are you sure you want to continue?"
                                                 onConfirm={informationGapOnClick}
                                                 disabled={project?.isPrivate || pending}
+                                                variant="nlp-primary"
                                             >
-                                                <IoIosRefresh />
+                                                <Svg
+                                                    className={styles.brainIcon}
+                                                    src={brainIcon}
+                                                />
                                             </QuickActionConfirmButton>
                                             {project?.isPrivate && (
                                                 <div className={styles.info}>
@@ -667,8 +672,12 @@ function StoryAnalysisModal(props: Props) {
                                                 message="You are about to auto generate analytical statement using NLP. This will replace the current analytical statement. Are you sure you want to continue?"
                                                 onConfirm={analyticalStatementOnClick}
                                                 disabled={project?.isPrivate || pending}
+                                                variant="nlp-primary"
                                             >
-                                                <IoIosRefresh />
+                                                <Svg
+                                                    className={styles.brainIcon}
+                                                    src={brainIcon}
+                                                />
                                             </QuickActionConfirmButton>
                                             {project?.isPrivate && (
                                                 <div className={styles.info}>
@@ -705,8 +714,12 @@ function StoryAnalysisModal(props: Props) {
                                                 message="You are about to auto generate my analysis using NLP. This will use the current analytical statement, automatic summary, informations gap, entries and replace the current my analysis. Are you sure you want to continue?"
                                                 onConfirm={myAnalysisOnClick}
                                                 disabled={project?.isPrivate || pending}
+                                                variant="nlp-primary"
                                             >
-                                                <IoIosRefresh />
+                                                <Svg
+                                                    className={styles.brainIcon}
+                                                    src={brainIcon}
+                                                />
                                             </QuickActionConfirmButton>
                                             {project?.isPrivate && (
                                                 <div className={styles.info}>

diff --git a/app/views/PillarAnalysis/AnalyticalStatementInput/StoryAnalysisModal/styles.css b/app/views/PillarAnalysis/AnalyticalStatementInput/StoryAnalysisModal/styles.css
@@ -141,6 +141,11 @@
 
                     .label-container-action {
                         display: flex;
+
+                        .brain-icon {
+                            width: auto;
+                            height: var(--dui-font-size-extra-large);
+                        }
                     }
                 }
             }