From 175eb6c741ee2f4909a70a8a657cbc342bc7baa0 Mon Sep 17 00:00:00 2001
From: Stefano Ricci <SteRiccio@users.noreply.github.com>
Date: Mon, 25 Sep 2023 14:32:16 +0200
Subject: [PATCH] first time helper: hide unnecessary buttons

---
 .../App/views/Home/Dashboard/Helper/Helper.js | 36 +++++--------------
 .../Home/Dashboard/SurveyInfo/SurveyInfo.js   | 21 ++++++++---
 2 files changed, 26 insertions(+), 31 deletions(-)

diff --git a/webapp/views/App/views/Home/Dashboard/Helper/Helper.js b/webapp/views/App/views/Home/Dashboard/Helper/Helper.js
index 6d348114fb..ba276e473f 100644
--- a/webapp/views/App/views/Home/Dashboard/Helper/Helper.js
+++ b/webapp/views/App/views/Home/Dashboard/Helper/Helper.js
@@ -21,19 +21,13 @@ const HelperFirstTimeSurvey = () => {
           values={{ surveyName: Survey.getName(surveyInfo).toUpperCase() }}
           components={{
             title: <h2 />,
-            linkWithIcon: (
-              <LinkWithIcon
-                to={appModuleUri(homeModules.surveyInfo)}
-                className="btn-s btn-transparent"
-                iconLeft={<span className="icon icon-pencil icon-14px" />}
-              />
-            ),
+            linkWithIcon: <LinkWithIcon to={appModuleUri(homeModules.surveyInfo)} iconLeft="icon-pencil" />,
             basicLink: <Link to={appModuleUri(homeModules.surveyInfo)} className="btn-s btn-transparent" />,
           }}
-        ></Trans>
+        />
 
         <div className="helper__first_time_help-survey-info">
-          <SurveyInfo />
+          <SurveyInfo firstTime />
         </div>
       </div>
 
@@ -42,15 +36,9 @@ const HelperFirstTimeSurvey = () => {
           i18nKey="homeView.dashboard.surveyPropUpdate.secondary"
           values={{ surveyName: Survey.getName(surveyInfo).toUpperCase() }}
           components={{
-            linkWithIcon: (
-              <LinkWithIcon
-                to={appModuleUri(designerModules.formDesigner)}
-                className="btn-s btn-transparent"
-                iconLeft={<span className="icon icon-quill icon-14px" />}
-              />
-            ),
+            linkWithIcon: <LinkWithIcon to={appModuleUri(designerModules.formDesigner)} iconLeft="icon-quill" />,
           }}
-        ></Trans>
+        />
       </div>
     </div>
   )
@@ -71,15 +59,9 @@ const HelperWithoutAttributes = () => {
             values={{ surveyName: Survey.getName(surveyInfo).toUpperCase() }}
             components={{
               title: <h2 />,
-              linkWithIcon: (
-                <LinkWithIcon
-                  to={appModuleUri(designerModules.formDesigner)}
-                  className="btn-s btn-transparent"
-                  iconLeft={<span className="icon icon-pencil icon-14px" />}
-                />
-              ),
+              linkWithIcon: <LinkWithIcon to={appModuleUri(designerModules.formDesigner)} iconLeft="icon-pencil" />,
             }}
-          ></Trans>
+          />
         </div>
       </div>
     </>
@@ -98,9 +80,9 @@ const HelpersByType = {
 
 const LinkWithIcon = ({ to, iconLeft, iconRight, children }) => (
   <Link to={to} className="btn-s btn-transparent">
-    {iconLeft}
+    {iconLeft && <span className={`icon ${iconLeft} icon-14px`} />}
     {children}
-    {iconRight}
+    {iconRight && <span className={`icon ${iconRight} icon-14px`} />}
   </Link>
 )
 
diff --git a/webapp/views/App/views/Home/Dashboard/SurveyInfo/SurveyInfo.js b/webapp/views/App/views/Home/Dashboard/SurveyInfo/SurveyInfo.js
index c031f14a0d..d49ca31e48 100644
--- a/webapp/views/App/views/Home/Dashboard/SurveyInfo/SurveyInfo.js
+++ b/webapp/views/App/views/Home/Dashboard/SurveyInfo/SurveyInfo.js
@@ -1,6 +1,7 @@
 import './SurveyInfo.scss'
 
 import React, { useCallback } from 'react'
+import PropTypes from 'prop-types'
 import { useDispatch } from 'react-redux'
 import { Link, useNavigate } from 'react-router-dom'
 
@@ -18,7 +19,9 @@ import Header from '@webapp/components/header'
 import ButtonPublishSurvey from '@webapp/components/buttonPublishSurvey'
 import { Button, ButtonMenu } from '@webapp/components'
 
-const SurveyInfo = () => {
+const SurveyInfo = (props) => {
+  const { firstTime } = props
+
   const i18n = useI18n()
   const dispatch = useDispatch()
   const navigate = useNavigate()
@@ -84,9 +87,11 @@ const SurveyInfo = () => {
             {i18n.t(canEditSurvey ? 'homeView.surveyInfo.editInfo' : 'homeView.surveyInfo.viewInfo')}
           </Link>
 
-          {canEditSurvey && <ButtonPublishSurvey className="btn-transparent" disabled={!Survey.isDraft(surveyInfo)} />}
+          {!firstTime && canEditSurvey && (
+            <ButtonPublishSurvey className="btn-transparent" disabled={!Survey.isDraft(surveyInfo)} />
+          )}
 
-          {canExportSurvey && (
+          {!firstTime && canExportSurvey && (
             <ButtonMenu
               className="btn-s btn-transparent btn-menu-export"
               iconClassName="icon-download2 icon-14px"
@@ -122,7 +127,7 @@ const SurveyInfo = () => {
               ]}
             />
           )}
-          {canEditSurvey && (
+          {!firstTime && canEditSurvey && (
             <ButtonMenu
               className="btn-s btn-transparent btn-menu-advanced"
               iconClassName="icon-cog icon-14px"
@@ -176,4 +181,12 @@ const SurveyInfo = () => {
   )
 }
 
+SurveyInfo.propTypes = {
+  firstTime: PropTypes.bool,
+}
+
+SurveyInfo.defaultProps = {
+  firstTime: false,
+}
+
 export default SurveyInfo