OY2-16868: Add Jira Issue Collector Feedback Tab to Dev Environment (#…

…891)
Enterprise-CMCS · Apr 1, 2022 · 41aca2e · 41aca2e
1 parent ac1575b
commit 41aca2e
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 2 deletions.
diff --git a/services/app-web/public/index.html b/services/app-web/public/index.html
@@ -26,6 +26,7 @@
     <body>
         <noscript>You need to enable JavaScript to run this app.</noscript>
         <div id="root"></div>
+
         <!--
       This HTML file is a template.
       If you open it directly in the browser, you will see an empty page.

diff --git a/services/app-web/src/hooks/useScript.ts b/services/app-web/src/hooks/useScript.ts
@@ -0,0 +1,22 @@
+import { useEffect } from 'react'
+
+// Add script to bottom of page, with handling for some generic boolean value to flag on or off
+const useScript = (url: string, featureFlag: boolean): void => {
+    useEffect(() => {
+        if (featureFlag) {
+            const script = document.createElement('script')
+
+            script.src = url
+            script.async = true
+            script.text = 'text/javascript'
+
+            document.body.appendChild(script)
+
+            return () => {
+                document.body.removeChild(script)
+            }
+        }
+    }, [url, featureFlag])
+}
+
+export { useScript }
diff --git a/services/app-web/src/pages/App/App.tsx b/services/app-web/src/pages/App/App.tsx
@@ -8,13 +8,14 @@ import {
 } from '@apollo/client'
 
 import { AppBody } from './AppBody'
-import { logEvent } from '../../log_event'
 import { AuthProvider } from '../../contexts/AuthContext'
 import { PageProvider } from '../../contexts/PageContext'
+import { logEvent } from '../../log_event'
 import TraceProvider from '../../contexts/TraceContext'
 import { GenericErrorPage } from '../Errors/GenericErrorPage'
 import { AuthModeType } from '../../common-code/domain-models'
 import { S3Provider } from '../../contexts/S3Context'
+import { useScript } from '../../hooks/useScript'
 import type { S3ClientT } from '../../s3'
 
 function ErrorFallback({
@@ -23,6 +24,7 @@ function ErrorFallback({
     error: Error
     resetErrorBoundary?: () => void
 }): React.ReactElement {
+    console.error(error)
     return <GenericErrorPage />
 }
 
@@ -39,6 +41,14 @@ function App({
         logEvent('on_load', { success: true })
     }, [])
 
+    // This is a hacky way to fake feature flags before we have feature flags.
+    // please avoid reading env vars outside of index.tsx in general.
+    const environmentName = process.env.REACT_APP_STAGE_NAME || ''
+    const isProdEnvironment = ['prod', 'val'].includes(environmentName)
+    const jiraTicketCollectorURL = `https://meghantest.atlassian.net/s/d41d8cd98f00b204e9800998ecf8427e-T/-9zew5j/b/7/c95134bc67d3a521bb3f4331beb9b804/_/download/batch/com.atlassian.jira.collector.plugin.jira-issue-collector-plugin:issuecollector/com.atlassian.jira.collector.plugin.jira-issue-collector-plugin:issuecollector.js?locale=en-US&collectorId=e59b8faf`
+
+    useScript(jiraTicketCollectorURL, !isProdEnvironment)
+
     return (
         <ErrorBoundary FallbackComponent={ErrorFallback}>
             <BrowserRouter>
@@ -47,7 +57,9 @@ function App({
                         <S3Provider client={s3Client}>
                             <AuthProvider authMode={authMode}>
                                 <PageProvider>
-                                    <AppBody authMode={authMode} />
+                                    <>
+                                        <AppBody authMode={authMode} />
+                                    </>
                                 </PageProvider>
                             </AuthProvider>
                         </S3Provider>