Merge branch 'main' into dependabot/pip/backend/urllib3-1.26.18

.env.dev.example

@@ -9,11 +9,11 @@
 
 # Replace with your domain or host
 HOST=localhost
-HTTP_PROTOCOL=http://
+HTTP_PROTOCOL=https://
 
 # Frontend dev
-NEXTAUTH_URL=http://localhost
-OAUTH_REDIRECT_URI=http://localhost
+NEXTAUTH_URL=https://localhost
+OAUTH_REDIRECT_URI=https://localhost
 BACKEND_API_BASE=http://backend:8000
 NEXT_PUBLIC_BACKEND_API_BASE=https://localhost/service
 NEXT_PUBLIC_NEXTAUTH_PROVIDERS=google,github,gitlab
@@ -34,7 +34,7 @@ GITLAB_CLIENT_SECRET=
 
 # Backend dev
 ALLOWED_HOSTS=localhost,backend
-ALLOWED_ORIGINS=http://localhost
+ALLOWED_ORIGINS=https://localhost
 SESSION_COOKIE_DOMAIN=localhost
 
 # Database credentials. Change all these values as required, except DATABASE_HOST
@@ -43,3 +43,6 @@ DATABASE_PORT=5432
 DATABASE_NAME=postgres-db-name
 DATABASE_USER=postgres-user
 DATABASE_PASSWORD=postgres-password
+
+# Disable NextJs telemtry
+NEXT_TELEMETRY_DISABLED=1

.env.example

@@ -36,3 +36,7 @@ DATABASE_PORT=5432
 DATABASE_NAME=postgres-db-name
 DATABASE_USER=postgres-user
 DATABASE_PASSWORD=a765b221799be364c53c8a32acccf5dd90d5fc832607bdd14fccaaaa0062adfd
+
+
+# Disable NextJs telemtry
+NEXT_TELEMETRY_DISABLED=1

.github/ISSUE_TEMPLATE/feature_request.md

@@ -1,34 +1,21 @@
 ---
-name: Bug report
-about: Create a report to help us improve
-title: ""
-labels: bug
-assignees: ""
----
-
-### Describe the bug
+name: Feature request
+about: Suggest a feature for Phase
+labels: enhancement, feature
 
-A clear and concise description of what the bug is.
+---
 
-### To Reproduce
+## Is your feature request related to a problem?
 
-Steps to reproduce the behavior:
+*Please describe.*
 
-1. Go to '...'
-2. Click on '....'
-3. Scroll down to '....'
-4. See error
+## Describe the solution you'd like
 
-### Expected behavior
 
-A clear and concise description of what you expected to happen.
 
-### Screenshots
+## Describe alternatives you've considered
 
-If applicable, add screenshots to help explain your problem.
 
-### Platform you are having the issue on:
 
-### Additional context
+## Additional context
 
-Add any other context about the problem here.

backend/Dockerfile

@@ -15,6 +15,7 @@ RUN set -ex \
     && apk add --virtual rundeps $runDeps \
     && apk del .build-deps
 
+RUN apk add --no-cache curl
 RUN addgroup -S app && adduser -S app -G app
 ADD . /app
 WORKDIR /app

backend/backend/graphene/types.py

@@ -38,7 +38,7 @@ def resolve_recovery(self, info):
             user=info.context.user, organisation=self, deleted_at=None)
         return org_member.wrapped_recovery
 
-    def resolve_idenity_key(self, info):
+    def resolve_identity_key(self, info):
         org_member = OrganisationMember.objects.get(
             user=info.context.user, organisation=self, deleted_at=None)
         return org_member.identity_key

backend/requirements.txt

@@ -9,7 +9,7 @@ certifi==2023.7.22
 cffi==1.15.1
 charset-normalizer==3.0.1
 constantly==15.1.0
-cryptography==41.0.2
+cryptography==41.0.4
 defusedxml==0.7.1
 dj-rest-auth==3.0.0
 Django==4.2.3

docker-compose.yml

@@ -31,6 +31,7 @@ services:
       BACKEND_API_BASE: "http://backend:8000"
       NEXT_PUBLIC_BACKEND_API_BASE: "${HTTP_PROTOCOL}${HOST}/service"
       NEXT_PUBLIC_NEXTAUTH_PROVIDERS: "${SSO_PROVIDERS}"
+      NEXT_PUBLIC_POSTHOG_KEY: "${NEXT_PUBLIC_POSTHOG_KEY}"
     networks:
       - phase-net
 

frontend/Dockerfile

@@ -3,6 +3,9 @@ FROM node:alpine AS base
 # set working directory
 WORKDIR /app
 
+# install system dependencies
+RUN apk add curl
+
 # Add a new user "app" and change ownership of the /app directory
 RUN addgroup app && adduser -S -G app app && chown -R app:app /app
 
@@ -14,9 +17,10 @@ COPY --chown=app:app package.json yarn.lock ./
 
 # ---- Dependencies ----
 FROM base AS dependencies
+
 # install node packages
 RUN yarn install --frozen-lockfile --no-cache && yarn cache clean
-# copy production node_modules aside (this is a neat trick to get only production modules)
+# copy production node_modules aside
 RUN cp -R node_modules /tmp/node_modules
 # install ALL node_modules, including 'devDependencies'
 RUN yarn install --frozen-lockfile
@@ -29,6 +33,7 @@ COPY --chown=app:app . .
 ARG NEXT_PUBLIC_BACKEND_API_BASE=BAKED_NEXT_PUBLIC_BACKEND_API_BASE
 ARG NEXT_PUBLIC_NEXTAUTH_PROVIDERS=BAKED_NEXT_PUBLIC_NEXTAUTH_PROVIDERS
 ARG NEXT_PUBLIC_APP_HOST=BAKED_NEXT_PUBLIC_APP_HOST
+ARG NEXT_PUBLIC_POSTHOG_KEY=BAKED_NEXT_PUBLIC_POSTHOG_KEY
 RUN yarn build
 
 # ---- Release ----

frontend/Dockerfile.dev

@@ -6,12 +6,12 @@ WORKDIR /app
 
 # Copy over package files 
 COPY package.json ./
-COPY package-lock.json ./
+COPY yarn.lock ./
 
 # Install dependencies
-RUN npm install
+RUN yarn install --frozen-lockfile --no-cache && yarn cache clean
 
 # Copy all files 
 COPY . .
 
-CMD ["npm", "run", "dev"]
+CMD ["yarn", "dev"]

frontend/apollo/client.ts

@@ -5,8 +5,10 @@ import { signOut, SignOutParams } from 'next-auth/react'
 import { UrlUtils } from '@/utils/auth'
 import axios from 'axios'
 import { toast } from 'react-toastify'
+import posthog from 'posthog-js'
 
 export const handleSignout = async (options?: SignOutParams<true> | undefined) => {
+  posthog.reset()
   const response = await axios.post(
     UrlUtils.makeUrl(process.env.NEXT_PUBLIC_BACKEND_API_BASE!, 'logout'),
     {},

frontend/app/[team]/apps/[app]/members/page.tsx

@@ -410,7 +410,7 @@ export default function Members({ params }: { params: { team: string; app: strin
                                         minLength={16}
                                         required
                                         autoFocus
-                                        className="custom w-full text-zinc-800 font-mono dark:text-white bg-zinc-100 dark:bg-zinc-800 rounded-md"
+                                        className="custom w-full text-zinc-800 font-mono dark:text-white bg-zinc-100 dark:bg-zinc-800 rounded-md ph-no-capture"
                                       />
                                       <button
                                         className="bg-zinc-100 dark:bg-zinc-800 px-4 text-neutral-500 rounded-md"
@@ -820,7 +820,7 @@ export default function Members({ params }: { params: { team: string; app: strin
                               minLength={16}
                               required
                               autoFocus
-                              className="custom w-full text-zinc-800 font-mono dark:text-white bg-zinc-100 dark:bg-zinc-800 rounded-md"
+                              className="custom w-full text-zinc-800 font-mono dark:text-white bg-zinc-100 dark:bg-zinc-800 rounded-md ph-no-capture"
                             />
                             <button
                               className="bg-zinc-100 dark:bg-zinc-800 px-4 text-neutral-500 rounded-md"

frontend/app/[team]/apps/[app]/page.tsx

@@ -234,7 +234,7 @@ export default function Secrets({ params }: { params: { team: string; app: strin
           <div className="flex justify-between items-center w-full">
             <code
               className={clsx(
-                'break-all whitespace-break-spaces max-w-full',
+                'break-all whitespace-break-spaces max-w-full ph-no-capture',
                 sameAsProd ? 'text-amber-500' : 'text-emerald-500'
               )}
             >
@@ -299,7 +299,7 @@ export default function Secrets({ params }: { params: { team: string; app: strin
             >
               <td
                 className={clsx(
-                  'px-6 py-3 whitespace-nowrap font-mono text-zinc-800 dark:text-zinc-300 flex items-center gap-2',
+                  'px-6 py-3 whitespace-nowrap font-mono text-zinc-800 dark:text-zinc-300 flex items-center gap-2 ph-no-capture',
                   open ? 'font-bold' : 'font-medium'
                 )}
               >

frontend/app/[team]/apps/[app]/tokens/page.tsx

@@ -231,7 +231,9 @@ export default function Tokens({ params }: { params: { team: string; app: string
             </div>
             {!appSecret && <RotateAppDialog />}
           </div>
-          <code className="text-xs text-red-500">{appSecret || appSecretPlaceholder}</code>
+          <code className="text-xs text-red-500 ph-no-capture">
+            {appSecret || appSecretPlaceholder}
+          </code>
         </div>
       </div>
     )

frontend/app/[team]/newdevice/page.tsx

@@ -34,7 +34,7 @@ export default function NewDevice({ params }: { params: { team: string } }) {
       icon: <MdOutlineKey />,
       title: 'Sudo password',
       description:
-        "Please set up a strong 'sudo' password to continue. This will be used to to perform administrative tasks and to encrypt keys locally on this device.",
+        "Please set up a strong 'sudo' password to continue. This will be used to encrypt keys and perform administrative tasks.",
     },
   ])
 
@@ -74,7 +74,7 @@ export default function NewDevice({ params }: { params: { team: string } }) {
           icon: <MdOutlineKey />,
           title: 'Sudo password',
           description:
-            "Please set up a strong 'sudo' password to continue. This will be used to to perform administrative tasks and to encrypt keys locally on this device.",
+            "Please set up a strong 'sudo' password to continue. This will be used to encrypt keys and perform administrative tasks.",
         },
       ])
 
@@ -241,7 +241,7 @@ export default function NewDevice({ params }: { params: { team: string } }) {
                       minLength={16}
                       required
                       autoFocus
-                      className="custom w-full text-zinc-800 font-mono dark:text-white bg-zinc-100 dark:bg-zinc-800 rounded-md"
+                      className="custom w-full text-zinc-800 font-mono dark:text-white bg-zinc-100 dark:bg-zinc-800 rounded-md ph-no-capture"
                     />
                     <button
                       className="bg-zinc-100 dark:bg-zinc-800 px-4 text-neutral-500 rounded-md"

frontend/app/[team]/settings/page.tsx

@@ -4,14 +4,16 @@ import { Alert } from '@/components/common/Alert'
 import { Avatar } from '@/components/common/Avatar'
 import { Button } from '@/components/common/Button'
 import { ModeToggle } from '@/components/common/ModeToggle'
-import { AccountSeedGen } from '@/components/onboarding/AccountSeedGen'
+import { AccountRecovery } from '@/components/onboarding/AccountRecovery'
 import { RoleLabel } from '@/components/users/RoleLabel'
 import { organisationContext } from '@/contexts/organisationContext'
 import { cryptoUtils } from '@/utils/auth'
+import { copyRecoveryKit, generateRecoveryPdf } from '@/utils/recovery'
 import { Dialog, Transition } from '@headlessui/react'
 import { useSession } from 'next-auth/react'
 import { Fragment, useContext, useState } from 'react'
 import { FaEye, FaEyeSlash, FaMoon, FaSun, FaTimes } from 'react-icons/fa'
+import { toast } from 'react-toastify'
 
 const ViewRecoveryDialog = () => {
   const { activeOrganisation } = useContext(organisationContext)
@@ -49,22 +51,46 @@ const ViewRecoveryDialog = () => {
     setIsOpen(true)
   }
 
+  const handleDownloadRecoveryKit = async () => {
+    toast.promise(
+      generateRecoveryPdf(
+        recovery,
+        session?.user?.email!,
+        activeOrganisation!.name,
+        session?.user?.name || undefined
+      ),
+      {
+        pending: 'Generating recovery kit',
+        success: 'Downloaded recovery kit',
+      }
+    )
+  }
+
+  const handleCopyRecoveryKit = () => {
+    copyRecoveryKit(
+      recovery,
+      session?.user?.email!,
+      activeOrganisation!.name,
+      session?.user?.name || undefined
+    )
+  }
+
   return (
     <>
       <div className="flex flex-col gap-4">
         <Alert variant="info" icon={true}>
           <div className="flex flex-col gap-2">
-            <p>Your recovery phrase is encrypted.</p>
+            <p>Your account keys are encrypted.</p>
 
             <p>
-              Backup your account recovery phrase in a safe place if you haven&apos;t already. If
-              you forget your sudo password, it is the only way to restore your accout keys.
+              Store your account recovery kit in a safe place if you haven&apos;t already. If you
+              forget your sudo password, it is the only way to restore your accout keys.
             </p>
           </div>
         </Alert>
         <div>
           <Button variant="primary" onClick={openModal} title="View recovery">
-            <FaEye /> View recovery
+            <FaEye /> View recovery info
           </Button>
         </div>
       </div>
@@ -106,7 +132,13 @@ const ViewRecoveryDialog = () => {
                   </Dialog.Title>
 
                   <div className="py-4">
-                    {recovery && <AccountSeedGen mnemonic={recovery} />}
+                    {recovery && (
+                      <AccountRecovery
+                        mnemonic={recovery}
+                        onDownload={handleDownloadRecoveryKit}
+                        onCopy={handleCopyRecoveryKit}
+                      />
+                    )}
 
                     {!recovery && (
                       <form onSubmit={handleDecryptRecovery}>
@@ -133,7 +165,7 @@ const ViewRecoveryDialog = () => {
                                 minLength={16}
                                 required
                                 autoFocus
-                                className="custom w-full text-zinc-800 font-mono dark:text-white bg-zinc-100 dark:bg-zinc-800 rounded-md"
+                                className="custom w-full text-zinc-800 font-mono dark:text-white bg-zinc-100 dark:bg-zinc-800 rounded-md ph-no-capture"
                               />
                               <button
                                 className="bg-zinc-100 dark:bg-zinc-800 px-4 text-neutral-500 rounded-md"
@@ -195,7 +227,7 @@ export default function Settings({ params }: { params: { team: string } }) {
           </div>
 
           <div className="flex flex-col gap-4">
-            <div className="text-lg font-medium">Recovery phrase</div>
+            <div className="text-lg font-medium">Recovery</div>
             <ViewRecoveryDialog />
           </div>