fix: Add GitHub app URL to env var (#3847)

Co-authored-by: Kyle Johnson <[email protected]> Co-authored-by: Matthew Elwell <[email protected]>
Flagsmith · Apr 29, 2024 · 210dbf7 · 210dbf7
1 parent 686e1ab
commit 210dbf7
Show file tree

Hide file tree

Showing 7 changed files with 74 additions and 56 deletions.
diff --git a/api/app/settings/common.py b/api/app/settings/common.py
@@ -1095,6 +1095,12 @@
     default=None,
 )
 
+# The URL used to install the GitHub integration
+GITHUB_APP_URL = env.int(
+    "GITHUB_APP_URL",
+    default=None,
+)
+
 # LDAP setting
 LDAP_INSTALLED = importlib.util.find_spec("flagsmith_ldap")
 # The URL of the LDAP server.

diff --git a/api/app/views.py b/api/app/views.py
@@ -55,6 +55,7 @@ def project_overrides(request):
         "sentry": "SENTRY_API_KEY",
         "useSecureCookies": "USE_SECURE_COOKIES",
         "cookieSameSite": "COOKIE_SAME_SITE",
+        "githubAppURL": "GITHUB_APP_URL",
     }
 
     override_data = {

diff --git a/docs/docs/integrations/project-management/github.md b/docs/docs/integrations/project-management/github.md
@@ -47,4 +47,4 @@ View your Flagsmith Flags inside your GitHub Issues and Pull Request
 
 1. In the Integrations Option in the side bar, find the GitHub integration and click on 'Manage Integration'.
 2. Click on 'Delete Integracion' button, and confirm.
-3. In your Github organisation, uninstall the Flagsmith GitHub App.
+3. In your GitHub organisation, uninstall the Flagsmith GitHub App.
diff --git a/frontend/api/index.js b/frontend/api/index.js
@@ -113,13 +113,17 @@ app.get('/config/project-overrides', (req, res) => {
       value: envToBool('DISABLE_INVITE_LINKS', false),
     },
     { name: 'albacross', value: process.env.ALBACROSS_CLIENT_ID },
-    {name: 'useSecureCookies', value: envToBool('USE_SECURE_COOKIES', true)},
-    {name: 'cookieSameSite', value: process.env.USE_SECURE_COOKIES}
+    { name: 'useSecureCookies', value: envToBool('USE_SECURE_COOKIES', true) },
+    { name: 'cookieSameSite', value: process.env.USE_SECURE_COOKIES },
+    {
+      name: 'githubAppURL',
+      value: process.env.GITHUB_APP_URL,
+    },
   ]
   let output = values.map(getVariable).join('')
   let dynatrace = ''
   if (process.env.DYNATRACE_URL) {
-    dynatrace=`
+    dynatrace = `
 window.enableDynatrace = true;
 (function(){function va(){document.cookie="".concat("__dTCookie","=").concat("1",";SameSite=Lax");var ua=-1!==document.cookie.indexOf("__dTCookie");document.cookie="".concat("__dTCookie","=").concat("1","; expires=Thu, 01-Jan-1970 00:00:01 GMT");return ua}function Sa(){return void 0===eb.dialogArguments?navigator.cookieEnabled||va():va()}function fb(){var ua;if(Sa()&&!window.dT_){var kb=(ua={},ua.cfg="app=8e35f25923c61ac7|cors=1|featureHash=A2NVfqru|vcv=2|reportUrl=${process.env.DYNATRACE_URL}/bf|rdnt=1|uxrgce=1|bp=3|cuc=2zmvahr4|mel=100000|dpvc=1|ssv=4|lastModification=1688993944019|tp=500,50,0,1|featureHash=A2NVfqru|agentUri=https://js-cdn.dynatrace.com/jstag/17b5f18726d/ruxitagent_A2NVfqru_10269230615181503.js|auto=|domain=|rid=RID_|rpid=|app=8e35f25923c61ac7",ua.iCE=
             Sa,ua);window.dT_=kb}}this.dT_&&dT_.prm&&dT_.prm();var eb="undefined"!==typeof window?window:self,La;eb.dT_?(null===(La=eb.console)||void 0===La?void 0:La.log("Duplicate agent injection detected, turning off redundant initConfig."),eb.dT_.di=1):fb()})();
@@ -196,8 +200,6 @@ window.enableDynatrace = true;
     
     ${dynatrace}
     `)
-
-
 })
 
 // Optionally proxy the API to get around CSRF issues, exposing the API to the world
@@ -267,12 +269,18 @@ app.get('/version', (req, res) => {
   }
 
   try {
-    releasePleaseManifest = JSON.parse(fs.readFileSync('./.versions.json', 'utf8'))
-    res.send({ 'ci_commit_sha': commitSha, 'image_tag': releasePleaseManifest["."], 'package_versions': releasePleaseManifest })
+    releasePleaseManifest = JSON.parse(
+      fs.readFileSync('./.versions.json', 'utf8'),
+    )
+    res.send({
+      'ci_commit_sha': commitSha,
+      'image_tag': releasePleaseManifest['.'],
+      'package_versions': releasePleaseManifest,
+    })
   } catch (err) {
     // eslint-disable-next-line
     console.log('Unable to read .versions.json file')
-    res.send({ 'ci_commit_sha': commitSha, 'image_tag': imageTag})
+    res.send({ 'ci_commit_sha': commitSha, 'image_tag': imageTag })
   }
 })
 
@@ -331,18 +339,18 @@ app.post('/api/webflow/webhook', (req, res) => {
       console.log('Contact Us Form - Creating Pipedrive Lead')
 
       const newPerson = pipedrive.NewPerson.constructFromObject({
-        name: req.body.data.name,
         email: [
           {
-            value: req.body.data.email,
             primary: 'true',
+            value: req.body.data.email,
           },
         ],
+        name: req.body.data.name,
         phone: [
           {
             label: 'work',
-            value: req.body.data.phone,
             primary: 'true',
+            value: req.body.data.phone,
           },
         ],
       })
@@ -356,9 +364,9 @@ app.post('/api/webflow/webhook', (req, res) => {
           )
 
           const newLead = pipedrive.AddLeadRequest.constructFromObject({
-            title: `${personData.data.primary_email}`,
-            person_id: personData.data.id,
             f001193d9249bb49d631d7c2c516ab72f9ebd204: 'Website Contact Us Form',
+            person_id: personData.data.id,
+            title: `${personData.data.primary_email}`,
           })
 
           console.log('Adding Lead.')
@@ -369,12 +377,12 @@ app.post('/api/webflow/webhook', (req, res) => {
               )
 
               const newNote = pipedrive.AddNoteRequest.constructFromObject({
-                lead_id: leadData.data.id,
                 content: `From Website Contact Us Form: ${
                   req.body.data.message != null
                     ? req.body.data.message
                     : 'No note supplied'
                 }`,
+                lead_id: leadData.data.id,
               })
 
               console.log('Adding Note.')
@@ -386,13 +394,15 @@ app.post('/api/webflow/webhook', (req, res) => {
                   //todo: Tidy up above with async calls and call destinations in parallel
                   if (process.env.DATA_RELAY_API_KEY && postToSlack) {
                     try {
-                      await dataRelay
-                          .sendEvent(
-                              req.body.data,
-                              { apiKey: process.env.DATA_RELAY_API_KEY },
-                          )
+                      await dataRelay.sendEvent(req.body.data, {
+                        apiKey: process.env.DATA_RELAY_API_KEY,
+                      })
                     } catch (e) {
-                        console.log('Error sending Contact us form sent to Relay:\r\n', e, formMessage)
+                      console.log(
+                        'Error sending Contact us form sent to Relay:\r\n',
+                        e,
+                        formMessage,
+                      )
                     }
                   }
                   return res.status(200).json({})

diff --git a/frontend/web/components/IntegrationList.js b/frontend/web/components/IntegrationList.js
@@ -38,7 +38,7 @@ class Integration extends Component {
 
   openChildWin = () => {
     const childWindow = window.open(
-      'https://github.com/apps/flagsmith/installations/select_target',
+      `${Project.githubAppURL}`,
       '_blank',
       'height=600,width=600,status=yes,toolbar=no,menubar=no,addressbar=no',
     )
@@ -47,16 +47,12 @@ class Integration extends Component {
       'githubIntegrationSetupFromFlagsmith',
       GITHUB_INSTALLATION_SETUP,
     )
-    const messageEventHandler = (event) => {
-      const urlParams = new URLSearchParams(childWindow.location.href)
-      const installationId = urlParams.get('installation_id')
+    window.addEventListener('message', (event) => {
       if (
         event.source === childWindow &&
         (event.data?.hasOwnProperty('installationId') || installationId)
       ) {
-        this.setState({
-          windowInstallationId: event.data.installationId || installationId,
-        })
+        this.setState({ windowInstallationId: event.data.installationId })
         localStorage.removeItem('githubIntegrationSetupFromFlagsmith')
         childWindow.close()
         getGithubIntegration(
@@ -70,10 +66,8 @@ class Integration extends Component {
             reFetchgithubId: res?.data?.results[0]?.id,
           })
         })
-        window.removeEventListener('message', messageEventHandler)
       }
-    }
-    window.addEventListener('message', messageEventHandler)
+    })
   }
 
   remove = (integration) => {

diff --git a/frontend/web/components/modals/CreateFlag.js b/frontend/web/components/modals/CreateFlag.js
@@ -673,30 +673,34 @@ const CreateFlag = class extends Component {
                           })}
                         />
                       </div>
-                      {externalResourceType == 'Github Issue' ? (
-                        <MyIssueSelect
-                          orgId={AccountStore.getOrganisation().id}
-                          onChange={(v) =>
-                            this.setState({
-                              featureExternalResource: v,
-                              status: 'open',
-                            })
-                          }
-                          repoOwner={repoOwner}
-                          repoName={repoName}
-                        />
-                      ) : externalResourceType == 'Github PR' ? (
-                        <MyPullRequestsSelect
-                          orgId={AccountStore.getOrganisation().id}
-                          onChange={(v) =>
-                            this.setState({ featureExternalResource: v.value })
-                          }
-                          repoOwner={repoOwner}
-                          repoName={repoName}
-                        />
-                      ) : (
-                        <></>
-                      )}
+                      <Flex className='ml-4'>
+                        {externalResourceType == 'Github Issue' ? (
+                          <MyIssueSelect
+                            orgId={AccountStore.getOrganisation().id}
+                            onChange={(v) =>
+                              this.setState({
+                                featureExternalResource: v,
+                                status: 'open',
+                              })
+                            }
+                            repoOwner={repoOwner}
+                            repoName={repoName}
+                          />
+                        ) : externalResourceType == 'Github PR' ? (
+                          <MyPullRequestsSelect
+                            orgId={AccountStore.getOrganisation().id}
+                            onChange={(v) =>
+                              this.setState({
+                                featureExternalResource: v.value,
+                              })
+                            }
+                            repoOwner={repoOwner}
+                            repoName={repoName}
+                          />
+                        ) : (
+                          <></>
+                        )}
+                      </Flex>
                       {(externalResourceType == 'Github Issue' ||
                         externalResourceType == 'Github PR') && (
                         <Button

diff --git a/frontend/web/components/pages/GitHubSetupPage.tsx b/frontend/web/components/pages/GitHubSetupPage.tsx
@@ -45,6 +45,7 @@ const GitHubSetupPage: FC<GitHubSetupPageType> = ({ location }) => {
   const { data: repos, isSuccess: reposLoaded } = useGetGithubReposQuery(
     {
       installation_id: installationId,
+      organisation_id: organisation,
     },
     { skip: !installationId },
   )
@@ -85,7 +86,9 @@ const GitHubSetupPage: FC<GitHubSetupPageType> = ({ location }) => {
         organisation_id: JSON.parse(localStorage.lastEnv).orgId,
       }).then(async (res) => {
         if (res?.data && githubIntegrationSetupFromFlagsmithValue) {
-          const dataToSend = { 'installationId': installationId }
+          const dataToSend = {
+            'installationId': installationId,
+          }
           window.opener.postMessage(dataToSend, '*')
         }
       })