Merge branch 'development/ideaspace' into alicefate/pr1

dev-launchers · May 11, 2023 · d5431de · d5431de
2 parents 067171c + a2a7850
commit d5431de
Show file tree

Hide file tree

Showing 128 changed files with 3,127 additions and 3,347 deletions.
diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
@@ -0,0 +1,20 @@
+# Shared Packages
+packages/ @dev-launchers/platform-enablement
+
+# Ideaspace code
+apps/ideaspace/ @dev-launchers/ideaspace-team
+
+# Recruitment code
+apps/dev-recruiters/ @dev-launchers/dev-recruit-team
+
+# Website code
+apps/website/ @Enjoy2Live @pyxld-kris
+
+# Website code
+apps/app/ @Enjoy2Live @pyxld-kris
+
+# Code in the backend directory
+strapiv4/ @dev-launchers/backend-devs
+
+# Deps
+package.json @Enjoy2Live
diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
@@ -30,6 +30,7 @@ jobs:
         uses: actions/setup-node@v3
         with:
           node-version: 16.x
+          cache: yarn
 
       - name: install deps
         run: corepack enable && yarn
@@ -44,10 +45,13 @@ jobs:
           workingDir: packages/UI
           projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
           token: ${{ secrets.GITHUB_TOKEN }}
+          onlyChanged: true
+
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "Storybook build for ${{ github.head_ref }}.${{ github.sha }} ","url":  ${{steps.chromatic.outputs.storybookUrl}}}]'
+          DISCORD_EMBEDS: '[{"title": "UI changes are ready for review: ${{ github.event.pull_request.comment }}","description": "Started by ${{ github.event.pull_request.user.login }}. Click [here](${{ steps.chromatic.outputs.buildUrl }}) to view the Chromatic review.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+
         uses: Ilshidur/action-discord@master
         with:
           args: 'New build for {{ EVENT_PAYLOAD.repository.full_name }} Finished.'

diff --git a/.github/workflows/staging-apps.yaml b/.github/workflows/staging-apps.yaml
@@ -0,0 +1,77 @@
+name: deploy-staging-apps
+
+on:
+  push:
+    branches:
+      - 'staging/ideaspace'
+      - 'staging/ideaspace[1-2]'
+      - 'staging/recruitment'
+      - 'staging/recruitment[1-2]'
+      - 'staging/projects'
+      - 'staging/projects[1-2]'
+      - 'staging/website'
+      - 'staging/website[1-2]'
+
+jobs:
+  Publish:
+    runs-on: ubuntu-latest
+
+    permissions:
+      contents: read
+      deployments: write
+
+    steps:
+      - name: Checkout 🛎
+        uses: actions/checkout@v3
+
+      - name: Extract branch name
+        shell: bash
+        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | sed 's/staging\///')" >>$GITHUB_OUTPUT
+        id: extract_branch
+
+      - name: Setup node env 🏗
+        uses: actions/setup-node@v3
+        with:
+          node-version: lts/gallium
+          cache: 'yarn'
+
+      - name: Install dependencies 👨🏻‍💻
+        run: yarn --frozen-lockfile --silent
+
+      - name: disable Image optimization
+        shell: bash
+        run: "sed -ie 's$unoptimized: false$unoptimized: true$g' ./apps/app/next.config.js"
+
+      - name: Run build
+        run: yarn workspace @devlaunchers/app build
+
+      - name: Export
+        run: yarn workspace @devlaunchers/app export
+
+      - name: Publish
+        uses: cloudflare/pages-action@v1
+        with:
+          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          accountId: "b0eb1f5510cb71344976cb9cac51e2af"
+          projectName: ${{ steps.extract_branch.outputs.branch }}
+          directory: ./apps/app/out
+          branch: main
+#I think this needs a bit of explanation.
+#I'm extracting the branch name and modifying it to only show what comes after staging/
+#for example: if this action was triggered on staging/ideaspace the modified string becomes 'ideaspace'.
+
+#I'm doing this because in cloudflare pages dashboard I created these projects
+
+#- 'ideaspace'
+#- 'ideaspace1'
+#- 'ideaspace2'
+#- 'recruitment'
+#- 'recruitment1'
+#- 'recruitment2'
+#- 'projects'
+#- 'projects1'
+#- 'projects2'
+#- 'website'
+#- 'website1'
+#- 'website2'
+#and on every commit that touches the branches of these teams I deploy to the app from the branch name extraction step:  Extract branch name
diff --git a/.github/workflows/staging-storybook.yml b/.github/workflows/staging-storybook.yml
@@ -38,6 +38,7 @@ jobs:
         uses: actions/setup-node@v3
         with:
           node-version: 16.x
+          cache: yarn
       - name: install deps
         run: corepack enable && yarn workspaces focus
       - name: build storybook

diff --git a/.github/workflows/typechecks.yml b/.github/workflows/typechecks.yml
@@ -0,0 +1,26 @@
+name: Typecheck Tests
+
+on:
+  push:
+    paths:
+      - 'packages/UI/.storybook/**'
+      - 'packages/UI/src/**'
+
+defaults:
+  run:
+    working-directory: packages/UI
+
+jobs:
+  test:
+    timeout-minutes: 60
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2
+        with:
+          node-version: '16.x'
+          cache: yarn
+      - name: Install dependencies
+        run: yarn
+      - name: Run typecheck tests
+        run: yarn typecheck
diff --git a/.github/workflows/ui-test.yml b/.github/workflows/ui-test.yml
@@ -15,6 +15,7 @@ jobs:
       - uses: actions/setup-node@v2
         with:
           node-version: '14.x'
+          cache: yarn
       - name: Install dependencies
         run: yarn
       - name: Run Storybook tests

diff --git a/README.md b/README.md
@@ -14,7 +14,7 @@ Dev Launchers is a nonprofit tech company working to democratize access to techn
 
 ## Contributing
 
-Visit https://devlaunchers.org/projects to join one of our teams!
+Visit https://www.volunteermatch.org/s/srp/orgOpps?org=1189675 to join one of our teams!
 
 ---
 
@@ -79,6 +79,14 @@ Once you are ready to create a new release, create a PR to merge master branch t
 
 ---
 
+## UI/UX Testing
+
+> Available at: https://staging.devlaunchers.org
+> This runs the main development branch (`master`) and is automatically redeployed when that branch is updated
+
+---
+
+
 ## Licenses
 
 The Dev Launchers platform is licensed under [GNU General Public License v3](./LICENSE.md).
diff --git a/apps/app/next.config.js b/apps/app/next.config.js
@@ -38,6 +38,7 @@ const nextConfig = {
       'lh3.googleusercontent.com',
     ],
     disableStaticImages: true,
+    unoptimized: false
   },
   webpack: (
     config,

diff --git a/apps/app/package.json b/apps/app/package.json
@@ -6,7 +6,6 @@
   "homepage": "http://devlaunchers.org/",
   "dependencies": {
     "@builder.io/partytown": "0.7.4",
-    "@cloudflare/wrangler": "^1.19.12",
     "@devlaunchers/dev-recruiters": "workspace:^",
     "@devlaunchers/ideaspace": "*",
     "@devlaunchers/site-projects": "*",
@@ -43,7 +42,7 @@
     "styled-components": "5.3.5",
     "styled-normalize": "^8.0.7",
     "tabletop": "1.6.3",
-    "wrangler": "^2.0.24"
+    "wrangler": "2.14.0"
   },
   "devDependencies": {
     "@devlaunchers/eslint-config-bases": "workspace:^",
@@ -64,6 +63,7 @@
   "scripts": {
     "dev": "next dev",
     "build": "next build --debug",
+    "export": "next export",
     "start": "next start",
     "prettier": "prettier --write \"./**/*.{js,jsx,json}\"",
     "pre-commit": "eslint '*/**/*.{js,jsx}' --fix",

diff --git a/apps/app/pages/_app.js b/apps/app/pages/_app.js
@@ -1,7 +1,6 @@
 import Head from 'next/head';
 
-import Footer from '@devlaunchers/components/components/Footer';
-import Navigation from '@devlaunchers/components/components/organisms/Navigation';
+import { Footer, Navigation } from '@devlaunchers/components/components/organisms';
 import { UserDataProvider } from '@devlaunchers/components/context/UserDataContext';
 import {
   initGA,

diff --git a/apps/ideaspace/src/components/common/Button/Button.js b/apps/ideaspace/src/components/common/Button/Button.js
@@ -42,15 +42,15 @@ const onHoverBackgroundColor = (hexColor) => {
 };
 const Button = styled.a`
   font-family: ${({ theme }) => theme.fonts.headline}, sans-serif;
-  background-color: ${({ theme, bgColor }) => bgColor || theme.colors.ACCENT_1};
-  color: ${({ theme, textColor }) => textColor || theme.colors.NEUTRAL_2};
+  background-color: ${({ theme, bgColor }) => bgColor || theme.colors.ORANGE};
+  color: ${({ theme, textColor }) => textColor || theme.colors.GREYSCALE_OFF_WHITE};
   transition: background-color 0.5s, color 0.5s;
 
   width: ${({ width }) => width || ""};
   border: 0px;
   border-bottom: 3px solid
     ${({ theme, bgColor }) =>
-      colorUnderButtons(bgColor || theme.colors.ACCENT_1)};
+      colorUnderButtons(bgColor || theme.colors.ORANGE)};
   cursor: pointer;
   font-size: ${({ fontSize }) => fontSize || "1.5rem"};
   margin-top: ${({ marginTop }) => marginTop || ""};
@@ -98,9 +98,9 @@ const Button = styled.a`
     `}
   &:hover {
     background-color: ${({ theme, bgColor }) =>
-      onHoverBackgroundColor(bgColor || theme.colors.ACCENT_2)};
+      onHoverBackgroundColor(bgColor || theme.colors.YELLOW)};
     color: ${({ theme, bgColor }) =>
-      (bgColor && shadeColor(bgColor, -40)) || theme.colors.ACCENT_3};
+      (bgColor && shadeColor(bgColor, -40)) || theme.colors.BLUE};
   }
 `;
 export default Button;
diff --git a/apps/ideaspace/src/components/common/IdeaCard/IdeaCard.js b/apps/ideaspace/src/components/common/IdeaCard/IdeaCard.js
@@ -5,7 +5,6 @@ import { atoms } from '@devlaunchers/components/src/components';
 import {
   ImgButton,
   StatuBox,
-  IdeaCardButton,
 } from './StyledIdeaCard';
 import IdeaCardImg from './IdeaCardImg';
 import IdeaCardTag from './IdeaCardTag';
@@ -70,39 +69,48 @@ function IdeaCard({ cards, cardType }) {
 
       <IdeaCardImg
         cardId={cards.id}
+        cardImg={cards.imgSrc}
       />
 
-      <atoms.Box flexDirection='column' alignItems='flex-start' justifyContent='space-between'
-        margin='0rem 2rem 1.5rem' style={{ maxWidth: '18.5rem' }}>
-
-        <atoms.Typography type='h3' style={{ fontSize: '1.5rem', marginBottom: '2rem' }}>
-          {cards.ideaName}
-        </atoms.Typography>
-
-        <IdeaCardComment
-          commentLength={cards.comments.length}
-        />
-
-        <IdeaCardUpdated
-          updatedAt={cards.updated_at}
-        />
-
-        {tagContent == "archived" ? (
-          <IdeaCardButton
-            onClick={reactivateIdea}
+      <Link href={{ pathname: urlPath }}>
+        <atoms.Box flexDirection='column' alignItems='flex-start' justifyContent='space-between'
+          padding='0rem 2rem 2rem' style={{ maxWidth: '18.5rem' }}>
+
+          <atoms.Typography type='h3' style={{ fontSize: '1.5rem', marginBottom: '2rem' }}>
+            {cards.ideaName}
+          </atoms.Typography>
+
+          <IdeaCardComment
+            commentLength={cards.comments.length}
+          />
+
+          <IdeaCardUpdated
+            updatedAt={cards.updated_at}
+          />
+        </atoms.Box>
+      </Link>
+
+      {tagContent == "archived" ? (
+        <atoms.Button
+          buttonSize='standard'
+          buttonType='alternative'
+          style={{ margin: '0rem 2rem 1.5rem' }}
+          onClick={reactivateIdea}
+        >
+          {buttonContent}
+        </atoms.Button>
+      ) : (
+        <Link href={{ pathname: urlPath }}>
+          <atoms.Button
+            buttonSize='standard'
+            buttonType='alternative'
+            style={{ margin: '0rem 2rem 1.5rem' }}
           >
             {buttonContent}
-          </IdeaCardButton>
-        ) : (
-          <Link href={{ pathname: urlPath }}>
-            <IdeaCardButton>
-              {buttonContent}
-            </IdeaCardButton>
-          </Link>
-        )}
-        <UpdateFailure />
-
-      </atoms.Box>
+          </atoms.Button>
+        </Link>
+      )}
+      <UpdateFailure />
 
     </atoms.Box>
   )