From 44046bfa4b98e4793e608e1161f8c1bd6a7b891e Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sun, 12 Mar 2023 14:43:37 -0500
Subject: [PATCH 001/111] feat(alicefate): change OpenResponse, FormField

---
 packages/UI/src/components/organisms/FormField/FormField.tsx  | 4 +++-
 packages/UI/src/components/organisms/FormField/index.ts       | 3 ++-
 .../UI/src/components/organisms/OpenResponse/OpenResponse.tsx | 2 ++
 packages/UI/src/components/organisms/OpenResponse/index.ts    | 1 +
 4 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/UI/src/components/organisms/FormField/FormField.tsx b/packages/UI/src/components/organisms/FormField/FormField.tsx
index 0fc9cc096..72628160b 100644
--- a/packages/UI/src/components/organisms/FormField/FormField.tsx
+++ b/packages/UI/src/components/organisms/FormField/FormField.tsx
@@ -20,12 +20,13 @@ function FormField({
   touched,
   onChange,
   name,
+  value,
 }: InputProps) {
   return (
     <>
       <Label htmlFor={id}>
         <Typography type="label">
-          {label} {required && <span css={{ color: 'red' }}>*</span>}
+          {label} {required && <span style={{ color: 'red' }}>*</span>}
         </Typography>
         <InputWrapper>
           <Input
@@ -40,6 +41,7 @@ function FormField({
             error={error}
             disabled={disabled}
             onChange={onChange}
+            value={value}
           />
           {/* The field doesn't have to be required for the Error Icon to show.
            For Example: I want to validate if the url passed is correct but it's not required for them fill. */}
diff --git a/packages/UI/src/components/organisms/FormField/index.ts b/packages/UI/src/components/organisms/FormField/index.ts
index 6cd200d15..dae3e38cf 100644
--- a/packages/UI/src/components/organisms/FormField/index.ts
+++ b/packages/UI/src/components/organisms/FormField/index.ts
@@ -1,5 +1,5 @@
 export { default } from './FormField';
-import type CSS from 'csstype'
+import type CSS from 'csstype';
 import type { ChangeEvent } from 'react';
 
 export interface InputProps {
@@ -14,4 +14,5 @@ export interface InputProps {
   valid?: boolean;
   touched?: boolean;
   onChange: (value: ChangeEvent<HTMLInputElement>) => void;
+  value?: string;
 }
diff --git a/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx b/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
index 0ebbc68e0..e3cb3f8e0 100644
--- a/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
+++ b/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
@@ -20,6 +20,7 @@ function OpenResponse({
   error,
   touched,
   onChange,
+  value,
 }: OpenResponseProps) {
   return (
     <>
@@ -41,6 +42,7 @@ function OpenResponse({
             error={error}
             disabled={disabled}
             onChange={onChange}
+            value={value}
           />
         </InputWrapper>
       </Label>
diff --git a/packages/UI/src/components/organisms/OpenResponse/index.ts b/packages/UI/src/components/organisms/OpenResponse/index.ts
index e57602030..1699609e5 100644
--- a/packages/UI/src/components/organisms/OpenResponse/index.ts
+++ b/packages/UI/src/components/organisms/OpenResponse/index.ts
@@ -16,4 +16,5 @@ export interface OpenResponseProps {
   valid?: boolean;
   touched?: boolean;
   onChange: (value: ChangeEvent<HTMLTextAreaElement>) => void;
+  value?: string;
 }

From 374d3475d922605309e67b1eeadda03025f4a6aa Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Fri, 24 Mar 2023 21:00:01 +0300
Subject: [PATCH 002/111] inital commit for progressBar

---
 packages/UI/package.json                      |  2 +-
 .../ProgressBar/ProgressBar.stories.tsx       | 21 +++++++++++++++++++
 .../molecules/ProgressBar/ProgressBar.tsx     |  9 ++++++++
 .../ProgressBar/StyledProgressBar.ts          |  7 +++++++
 .../components/molecules/ProgressBar/index.ts |  4 ++++
 5 files changed, 42 insertions(+), 1 deletion(-)
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/index.ts

diff --git a/packages/UI/package.json b/packages/UI/package.json
index c4904400a..b12f03e46 100644
--- a/packages/UI/package.json
+++ b/packages/UI/package.json
@@ -25,7 +25,7 @@
     "zod-formik-adapter": "1.1.1"
   },
   "scripts": {
-    "storybook": "NODE_OPTIONS=--openssl-legacy-provider start-storybook -p 6006",
+    "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook",
     "clean": "rimraf --no-glob ./tsconfig.tsbuildinfo",
     "lint": "eslint . --ext .ts,.tsx,.js,.jsx,.cjs,.mjs,.mdx",
diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
new file mode 100644
index 000000000..30e39ed99
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
@@ -0,0 +1,21 @@
+import type { ComponentStory, ComponentMeta } from '@storybook/react';
+
+import ProgressBar from './ProgressBar';
+export default {
+  title: 'Molecules/ProgressBar',
+  component: ProgressBar,
+} as ComponentMeta<typeof ProgressBar>;
+
+const TemplateProgressBar: ComponentStory<typeof ProgressBar> = (args) => (
+  <ProgressBar {...args}></ProgressBar>
+);
+
+export const InProgress = TemplateProgressBar.bind({});
+InProgress.args = {
+  percentage: 50,
+};
+
+export const Finished = TemplateProgressBar.bind({});
+Finished.args = {
+  percentage: 100,
+};
diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
new file mode 100644
index 000000000..d18721c18
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -0,0 +1,9 @@
+import * as React from 'react';
+import type { ProgressBarProps } from '.';
+import { Wrapper } from './StyledProgressBar';
+
+const ProgressBar: React.FC<ProgressBarProps> = (props) => {
+  return <Wrapper>{props.percentage}%</Wrapper>;
+};
+
+export default ProgressBar;
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
new file mode 100644
index 000000000..4320431f4
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -0,0 +1,7 @@
+import { radiusStyles } from '../../atoms/Radius';
+import styled from 'styled-components';
+
+export const Wrapper = styled.div`
+  background-color: ${({ theme }) => theme.colors.NOTIFICATION};
+  ${radiusStyles['radius300']};
+`;
diff --git a/packages/UI/src/components/molecules/ProgressBar/index.ts b/packages/UI/src/components/molecules/ProgressBar/index.ts
new file mode 100644
index 000000000..b0905925d
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/index.ts
@@ -0,0 +1,4 @@
+export interface ProgressBarProps {
+  percentage: number;
+}
+export { default } from './ProgressBar';

From 771ac38eb010e9746de255b5b86b625df7caf8a4 Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sat, 25 Mar 2023 16:12:05 -0500
Subject: [PATCH 003/111] change it back to css in FormField.tsx

---
 packages/UI/src/components/organisms/FormField/FormField.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/FormField/FormField.tsx b/packages/UI/src/components/organisms/FormField/FormField.tsx
index 72628160b..a4b17ffc5 100644
--- a/packages/UI/src/components/organisms/FormField/FormField.tsx
+++ b/packages/UI/src/components/organisms/FormField/FormField.tsx
@@ -26,7 +26,7 @@ function FormField({
     <>
       <Label htmlFor={id}>
         <Typography type="label">
-          {label} {required && <span style={{ color: 'red' }}>*</span>}
+          {label} {required && <span css={{ color: 'red' }}>*</span>}
         </Typography>
         <InputWrapper>
           <Input

From 07e7186e676ab21189965957fb71478a25aad512 Mon Sep 17 00:00:00 2001
From: Hredhya <hredhya3107@gmail.com>
Date: Sat, 1 Apr 2023 18:10:30 -0400
Subject: [PATCH 004/111] feat(Hredhya) Add Progress Bar Component

---
 .../molecules/ProgressBar/ProgressBar.tsx     | 22 ++++++--
 .../ProgressBar/StyledProgressBar.ts          | 53 +++++++++++++++++--
 2 files changed, 69 insertions(+), 6 deletions(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
index d18721c18..793c41d43 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -1,9 +1,25 @@
 import * as React from 'react';
+import Icon from '../../../assets/icons/rawSvg/check-circle.svg';
+import {
+  Wrapper,
+  Progress,
+  CheckIcon,
+  PercentageWrapper,
+  Percentage,
+} from './StyledProgressBar';
 import type { ProgressBarProps } from '.';
-import { Wrapper } from './StyledProgressBar';
 
 const ProgressBar: React.FC<ProgressBarProps> = (props) => {
-  return <Wrapper>{props.percentage}%</Wrapper>;
+  return (
+    <Wrapper percentage={props.percentage}>
+      <Progress percentage={props.percentage} />
+      <PercentageWrapper>
+        <Percentage percentage={props.percentage}>
+          {props.percentage}%
+        </Percentage>
+        {props.percentage === 100 && <CheckIcon src={Icon} />}
+      </PercentageWrapper>
+    </Wrapper>
+  );
 };
-
 export default ProgressBar;
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index 4320431f4..ef1823c89 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -1,7 +1,54 @@
-import { radiusStyles } from '../../atoms/Radius';
+import type { DefaultTheme } from 'styled-components';
 import styled from 'styled-components';
+import { radiusStyles } from '../../atoms/Radius';
+import type { ProgressBarProps } from '.';
 
-export const Wrapper = styled.div`
-  background-color: ${({ theme }) => theme.colors.NOTIFICATION};
+const getColor = (percentage: number, theme: DefaultTheme) => {
+  return percentage === 100 ? theme.colors.SUCCESS : theme.colors.NOTIFICATION;
+};
+
+export const Wrapper = styled.div<ProgressBarProps>`
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  position: relative;
+  ${radiusStyles['radius300']};
+  height: 26px;
+  width: 320px;
+  top: 36px;
+  background-color: ${({ theme }) => theme.colors.GREYSCALE_OFF_WHITE};
+  border: 2px solid ${({ percentage, theme }) => getColor(percentage, theme)};
+`;
+export const Progress = styled.div<ProgressBarProps>`
+  box-sizing: border-box;
+  border: 2px solid ${({ percentage, theme }) => getColor(percentage, theme)};
+  background-color: ${({ percentage, theme }) => getColor(percentage, theme)};
   ${radiusStyles['radius300']};
+  height: 26px;
+  // top: 36px;
+  width: ${(props) => props.percentage}%;
+`;
+export const PercentageWrapper = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  top: -26px;
+  width: 100%;
+  gap: 12px;
+`;
+export const Percentage = styled.span<ProgressBarProps>`
+  font-family: 'Nunito Sans';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 16px;
+  line-height: 24px;
+  color: ${({ percentage, theme }) => getColor(percentage, theme)};
+  width: 35px;
+  height: 24px;
+`;
+export const CheckIcon = styled.img`
+  width: 20px;
+  height: 20px;
 `;

From 27b4ef0950b2e539c533348fcf1276f3b8a206dc Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 11:36:46 -0500
Subject: [PATCH 005/111] components/discord-webhook: testing discord hook.

---
 .github/workflows/chromatic.yml | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 72244e5fa..db9e876fe 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -47,7 +47,8 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          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}}"}]'
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.head_ref }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. Click [here](${{ steps.chromatic.outputs.buildUrl }}) to view the Chromatic review.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+
 
         uses: Ilshidur/action-discord@master
         with:

From c4a4deb4ebcd0ff039d551d345cd80e2edbacff1 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 11:48:17 -0500
Subject: [PATCH 006/111] triggering the webhook.

---
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx        | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 29150f5f6a7c22002d55a146ac08b60d0e6f7680 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 11:58:26 -0500
Subject: [PATCH 007/111] triggering another hook.

---
 .github/workflows/chromatic.yml                              | 5 +++--
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx    | 1 -
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index db9e876fe..f588fceb0 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -47,12 +47,13 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.head_ref }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. Click [here](${{ steps.chromatic.outputs.buildUrl }}) to view the Chromatic review.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${GITHUB_REF##*/} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
+          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.'
+          args: 'New build for ${GITHUB_REF##*/} Finished.'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0d69a488a..0ef0e1d4f 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,7 +6,6 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
-
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 8cd688666f3b067e8bc54140963073845f4a5b0f Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 12:06:16 -0500
Subject: [PATCH 008/111] one more try

---
 .github/workflows/chromatic.yml                               | 4 ++--
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx     | 1 +
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index f588fceb0..bc68c40fa 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -47,13 +47,13 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${GITHUB_REF##*/} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{GITHUB_REF##*/}} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
           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 ${GITHUB_REF##*/} Finished.'
+          args: 'New build for ${{GITHUB_REF##*/}} Finished.'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 5a5187bfb4cec735a113b15fe209f0486979eb7e Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 12:18:31 -0500
Subject: [PATCH 009/111] once again.

---
 .github/workflows/chromatic.yml                               | 4 ++--
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx     | 1 -
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index bc68c40fa..fc833e247 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -47,13 +47,13 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{GITHUB_REF##*/}} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.event.pull_request.title }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
           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 ${{GITHUB_REF##*/}} Finished.'
+          args: 'New build for ${{ github.event.pull_request.title }} has Finished.'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0d69a488a..0ef0e1d4f 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,7 +6,6 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
-
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 8a3091b2a1e08602d7262181a65ab15f3b6f2e4d Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Thu, 6 Apr 2023 13:06:13 +0300
Subject: [PATCH 010/111] fix(ci): chromatic webhook readability

---
 .github/workflows/chromatic.yml | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index fc833e247..6f170c05f 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -21,11 +21,17 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       code: ${{ steps.chromatic.outputs.code }}
+      branch: ${{ steps.extract_branch.outputs.branch }}
     # The list of steps that the action will go through
     steps:
       - name: Checkout
         uses: actions/checkout@v1
-
+      
+      - name: Extract branch name
+        shell: bash
+        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/})" >>$GITHUB_OUTPUT
+        id: extract_branch
+        
       - name: Use Node.js 16.x
         uses: actions/setup-node@v3
         with:
@@ -47,13 +53,12 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.event.pull_request.title }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
-          Click [here](${{ steps.chromatic.outputs.buildUrl }}) to view the Chromatic review.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
 
 
         uses: Ilshidur/action-discord@master
         with:
-          args: 'New build for ${{ github.event.pull_request.title }} has Finished.'
+          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:

From 37a5eb4d30be1e6c379a28803325021404d622b0 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Thu, 6 Apr 2023 13:15:59 +0300
Subject: [PATCH 011/111] fix json error

---
 .github/workflows/chromatic.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 6f170c05f..45dffa183 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -53,7 +53,7 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "Chromatic","description": View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
 
 
         uses: Ilshidur/action-discord@master

From f03956cddc75d986fb026883a2c0488b607aac55 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Thu, 6 Apr 2023 09:57:51 -0500
Subject: [PATCH 012/111] test

---
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx        | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 7a6f266c3f99066cada6b6d8cd38bb84ba134885 Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sat, 8 Apr 2023 23:40:59 -0500
Subject: [PATCH 013/111] fix(alicefate): fix: Text content did not match.

---
 .../components/organisms/Footer/RandomQuote/RandomQuote.js | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js b/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js
index 85551875e..6b971404e 100644
--- a/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js
+++ b/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js
@@ -1,3 +1,4 @@
+import React, { useState } from 'react';
 import Wrapper from './StyledRandomQuote';
 
 // Retrieve all quotes from our content layer
@@ -6,7 +7,11 @@ const quotes =
 
 export default function RandomQuote() {
   // Select and display a random quote from our quotes collection
-  const randomQuote = quotes[parseInt(quotes.length * Math.random(), 10)];
+  const [randomNum, setRandomNum] = useState(0);
+  React.useEffect(() => {
+    setRandomNum(parseInt(quotes.length * Math.random(), 10));
+  }, []);
+  const randomQuote = quotes[randomNum];
   return (
     <Wrapper>
       &quot;{randomQuote.body}&quot; - {randomQuote.author}

From bbba145272d811e35990fdb628a12c7a6b8cbdeb Mon Sep 17 00:00:00 2001
From: Hredhya <hredhya3107@gmail.com>
Date: Mon, 10 Apr 2023 21:58:11 -0400
Subject: [PATCH 014/111] set min and max percentage value and set min width as
 5% for inner bar

---
 .../components/molecules/ProgressBar/ProgressBar.tsx | 12 +++++++-----
 .../molecules/ProgressBar/StyledProgressBar.ts       |  5 +++--
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
index 793c41d43..64d73be49 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -10,14 +10,16 @@ import {
 import type { ProgressBarProps } from '.';
 
 const ProgressBar: React.FC<ProgressBarProps> = (props) => {
+  // Check if percentage is less than 0 or greater than 100, set it to 0 or 100 respectively
+  const percentage = Math.max(0, Math.min(100, props.percentage));
   return (
-    <Wrapper percentage={props.percentage}>
-      <Progress percentage={props.percentage} />
+    <Wrapper percentage={percentage}>
+      <Progress percentage={percentage} />
       <PercentageWrapper>
-        <Percentage percentage={props.percentage}>
-          {props.percentage}%
+        <Percentage percentage={percentage}>
+          {percentage}%
         </Percentage>
-        {props.percentage === 100 && <CheckIcon src={Icon} />}
+        {percentage === 100 && <CheckIcon src={Icon} />}
       </PercentageWrapper>
     </Wrapper>
   );
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index ef1823c89..af6cf0e7e 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -26,8 +26,9 @@ export const Progress = styled.div<ProgressBarProps>`
   background-color: ${({ percentage, theme }) => getColor(percentage, theme)};
   ${radiusStyles['radius300']};
   height: 26px;
-  // top: 36px;
-  width: ${(props) => props.percentage}%;
+  width: ${(props) => (props.percentage < 5 ? '5%' : `${props.percentage}%`)};
+  // Set a minimum width of 5% when percentage is less than 5
+  min-width: 5%;
 `;
 export const PercentageWrapper = styled.div`
   display: flex;

From 5cbeda793febdd83e78ccaade900361e131cc88c Mon Sep 17 00:00:00 2001
From: Hredhya <hredhya3107@gmail.com>
Date: Tue, 11 Apr 2023 21:41:00 -0400
Subject: [PATCH 015/111] Set a min width of 5% when percentage is less than 5
 and make it invisible at 0 percentage

---
 .../components/molecules/ProgressBar/ProgressBar.tsx  |  4 +---
 .../molecules/ProgressBar/StyledProgressBar.ts        | 11 ++++++++---
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
index 64d73be49..dfb5247cb 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -16,9 +16,7 @@ const ProgressBar: React.FC<ProgressBarProps> = (props) => {
     <Wrapper percentage={percentage}>
       <Progress percentage={percentage} />
       <PercentageWrapper>
-        <Percentage percentage={percentage}>
-          {percentage}%
-        </Percentage>
+        <Percentage percentage={percentage}>{percentage}%</Percentage>
         {percentage === 100 && <CheckIcon src={Icon} />}
       </PercentageWrapper>
     </Wrapper>
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index af6cf0e7e..f7656dc95 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -26,9 +26,14 @@ export const Progress = styled.div<ProgressBarProps>`
   background-color: ${({ percentage, theme }) => getColor(percentage, theme)};
   ${radiusStyles['radius300']};
   height: 26px;
-  width: ${(props) => (props.percentage < 5 ? '5%' : `${props.percentage}%`)};
-  // Set a minimum width of 5% when percentage is less than 5
-  min-width: 5%;
+  // Set a min width of 5% when percentage is less than 5 and make it invisible at 0 percentage
+  width: ${(props) =>
+    props.percentage === 0
+      ? '0%'
+      : props.percentage < 5
+      ? '5%'
+      : `${props.percentage}%`};
+  opacity: ${(props) => (props.percentage === 0 ? '0' : '1')};
 `;
 export const PercentageWrapper = styled.div`
   display: flex;

From 83b61655ff2fbefc488d3945834471ed82de0db2 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Thu, 13 Apr 2023 06:23:42 -0500
Subject: [PATCH 016/111] Roman/discord-webhook: Creating a new file for the
 webhook and adjusting chromatic.yml

---
 .github/workflows/chromatic.yml       | 10 +-------
 .github/workflows/discord-webhook.yml | 37 +++++++++++++++++++++++++++
 2 files changed, 38 insertions(+), 9 deletions(-)
 create mode 100644 .github/workflows/discord-webhook.yml

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 45dffa183..eb12fa773 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -50,15 +50,7 @@ jobs:
           workingDir: packages/UI
           projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
           token: ${{ secrets.GITHUB_TOKEN }}
-      - name: Discord Channel Notification
-        env:
-          DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
-
-
-        uses: Ilshidur/action-discord@master
-        with:
-          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
+          onlyChanged: true
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
new file mode 100644
index 000000000..d33f6390c
--- /dev/null
+++ b/.github/workflows/discord-webhook.yml
@@ -0,0 +1,37 @@
+name: Discord Webhook
+on:
+  pull_request:
+    paths:
+      - 'packages/UI/.storybook/**'
+      - 'packages/UI/src/**'
+jobs:
+  discord:
+    runs-on: ubuntu-latest
+    outputs:
+      url: ${{ steps.chromatic.outputs.url }}
+      buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
+      storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
+      branch: ${{ steps.extract_branch.outputs.branch }}
+      pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
+    steps:
+     - name: Extract branch name
+        shell: bash
+        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | sed 's/staging\///')" >>$GITHUB_OUTPUT
+        id: extract_branch
+     - name: Extract PR name
+        shell: bash
+        run: |
+          pr_number="${GITHUB_REF#refs/pull/}"
+          pr_number="${pr_number%/*}"
+           echo "pr_number=$pr_number" >> $GITHUB_OUTPUT
+        id: extract_pr_number
+      - name: Discord Channel Notification
+        env:
+          BRANCH: ${{steps.extract_branch.outputs.branch}}
+          URL:  ${{steps.deploy.outputs.url}}
+          DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": " https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}, {"title": "Storybook","description": "View the storybook for this change.","url": " https://${{steps.extract_branch.outputs.branch}}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
+        
+        uses: Ilshidur/action-discord@master
+        with:
+          args: 'New build for ${{ BRANCH }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'

From 67db0a3ed195f5d2a22a041d142b179757cb27bb Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sun, 16 Apr 2023 12:17:27 -0500
Subject: [PATCH 017/111] fix:unsubmited required input & textfield turn red

---
 packages/UI/src/components/organisms/FormField/FormField.tsx    | 2 +-
 .../UI/src/components/organisms/OpenResponse/OpenResponse.tsx   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/UI/src/components/organisms/FormField/FormField.tsx b/packages/UI/src/components/organisms/FormField/FormField.tsx
index 72628160b..3ce5ca38d 100644
--- a/packages/UI/src/components/organisms/FormField/FormField.tsx
+++ b/packages/UI/src/components/organisms/FormField/FormField.tsx
@@ -38,7 +38,7 @@ function FormField({
             autoComplete="off"
             placeholder={placeholder}
             valid={touched && !error}
-            error={error}
+            error={touched ? error : ''}
             disabled={disabled}
             onChange={onChange}
             value={value}
diff --git a/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx b/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
index e3cb3f8e0..1479d1b9c 100644
--- a/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
+++ b/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
@@ -39,7 +39,7 @@ function OpenResponse({
             autoCorrect="off"
             autoComplete="off"
             valid={touched && !error}
-            error={error}
+            error={touched ? error : ''}
             disabled={disabled}
             onChange={onChange}
             value={value}

From 8b65491556beaad41ad9058081b514d41194ea17 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:08:31 -0500
Subject: [PATCH 018/111] Webhook changes

---
 .github/workflows/discord-webhook.yml | 22 ++++++++++------------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index d33f6390c..9cb7c23d6 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -14,24 +14,22 @@ jobs:
       branch: ${{ steps.extract_branch.outputs.branch }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
-     - name: Extract branch name
+      - name: Checkout
+        uses: actions/checkout@v2
+      - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | sed 's/staging\///')" >>$GITHUB_OUTPUT
+        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
-     - name: Extract PR name
+      - name: Extract PR number
         shell: bash
-        run: |
-          pr_number="${GITHUB_REF#refs/pull/}"
-          pr_number="${pr_number%/*}"
-           echo "pr_number=$pr_number" >> $GITHUB_OUTPUT
+        run: echo "pr_number=$(echo "$GITHUB_REF" | awk -F / '{print $3}')" >> $GITHUB_OUTPUT
         id: extract_pr_number
       - name: Discord Channel Notification
         env:
-          BRANCH: ${{steps.extract_branch.outputs.branch}}
-          URL:  ${{steps.deploy.outputs.url}}
+          BRANCH: ${{ steps.extract_branch.outputs.branch }}
+          URL: ${{ steps.deploy.outputs.url }}
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": " https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}, {"title": "Storybook","description": "View the storybook for this change.","url": " https://${{steps.extract_branch.outputs.branch}}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
-        
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": "https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "https://${{ steps.extract_branch.outputs.branch }}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
         uses: Ilshidur/action-discord@master
         with:
-          args: 'New build for ${{ BRANCH }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
+          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'

From f8c77734cfcec57b68e17cfc6feeff374813e882 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:22:06 -0500
Subject: [PATCH 019/111] Changing branch name output.

---
 .github/workflows/discord-webhook.yml | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 9cb7c23d6..603e0f6ad 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -12,13 +12,14 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       branch: ${{ steps.extract_branch.outputs.branch }}
+      BRANCH_NAME: ${{ github.base_ref ||  }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
       - name: Checkout
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | tr / -)" >> $GITHUB_OUTPUT
+        run: echo "branch=$(echo ${github.head_ref} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From c49cc1d8d94e4d4c485a3721c8e42dd505e1a8b6 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:22:58 -0500
Subject: [PATCH 020/111] Fixing error

---
 .github/workflows/discord-webhook.yml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 603e0f6ad..5c8a6cd0d 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -12,7 +12,6 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       branch: ${{ steps.extract_branch.outputs.branch }}
-      BRANCH_NAME: ${{ github.base_ref ||  }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
       - name: Checkout

From 58ff14670d47d8a493ca3f5b6fc4f81048970428 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:24:19 -0500
Subject: [PATCH 021/111] trying out a different branch name approach

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 5c8a6cd0d..12ca69bf7 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${github.head_ref} | tr / -)" >> $GITHUB_OUTPUT
+        run: echo "branch=$(echo ${github.base_ref} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From 2f4c0b9a2171e7a52cac35310352890758cef90d Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:25:49 -0500
Subject: [PATCH 022/111] One more approach to branch name

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 12ca69bf7..dab8b1e18 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${github.base_ref} | tr / -)" >> $GITHUB_OUTPUT
+        run: echo "branch=$(echo ${GITHUB_REF##*/} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From 18b0a223607f768b41c3a4d2bf8651b5f74ddda3 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:34:30 -0500
Subject: [PATCH 023/111] One more attempt at branch name output.

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index dab8b1e18..cbf87c456 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${GITHUB_REF##*/} | tr / -)" >> $GITHUB_OUTPUT
+        run:  echo "branch=$(echo ${GITHUB_REF}" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From b42eed228b354f979c2229e27346ba2075a2ef34 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:36:31 -0500
Subject: [PATCH 024/111] fixing mistake

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index cbf87c456..3549169c8 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run:  echo "branch=$(echo ${GITHUB_REF}" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
+        run:  echo "branch=$(echo "$GITHUB_REF" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From c858a0bbab614d8341129ccfd94717ef27b402fe Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:40:48 +0300
Subject: [PATCH 025/111] Extract head branch name from GITHUB_REF step

---
 .github/workflows/discord-webhook.yml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 3549169c8..f974068ed 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -20,6 +20,12 @@ jobs:
         shell: bash
         run:  echo "branch=$(echo "$GITHUB_REF" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
         id: extract_branch
+    
+      - name: Extract head branch name from GITHUB_REF
+        run: |
+          headBranch="${{ GITHUB_REF#refs/pull/*/merge }}"
+          echo "Head branch name: $headBranch"
+          
       - name: Extract PR number
         shell: bash
         run: echo "pr_number=$(echo "$GITHUB_REF" | awk -F / '{print $3}')" >> $GITHUB_OUTPUT

From 1079fb85b118e1cb091caa7c629c85c473c3434d Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:43:18 +0300
Subject: [PATCH 026/111] fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index f974068ed..415ba1bb3 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -22,10 +22,9 @@ jobs:
         id: extract_branch
     
       - name: Extract head branch name from GITHUB_REF
-        run: |
-          headBranch="${{ GITHUB_REF#refs/pull/*/merge }}"
-          echo "Head branch name: $headBranch"
-          
+        shell: bash
+        run: headBranch="${{ GITHUB_REF#refs/pull/*/merge }}" && echo "Head branch name: $headBranch"
+
       - name: Extract PR number
         shell: bash
         run: echo "pr_number=$(echo "$GITHUB_REF" | awk -F / '{print $3}')" >> $GITHUB_OUTPUT

From e7556f8463e2b1a3030834d4c369518f13f088cc Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:44:46 +0300
Subject: [PATCH 027/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 415ba1bb3..1d7c41204 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: headBranch="${{ GITHUB_REF#refs/pull/*/merge }}" && echo "Head branch name: $headBranch"
+        run: echo "Head branch name: ${{ GITHUB_REF#refs/pull/*/merge }}"
 
       - name: Extract PR number
         shell: bash

From d655c5e67521dd32afba2d9f6a85705aa05b7431 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:46:26 +0300
Subject: [PATCH 028/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 1d7c41204..84d8e8b1c 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name: ${{ GITHUB_REF#refs/pull/*/merge }}"
+        run: echo "Head branch name: $GITHUB_REF#refs/pull/*/merge"
 
       - name: Extract PR number
         shell: bash

From b9477e656967cfe5e25b054d3646001d35493349 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:48:19 +0300
Subject: [PATCH 029/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 84d8e8b1c..3f0c101bc 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name: $GITHUB_REF#refs/pull/*/merge"
+        run: echo "Head branch name $GITHUB_REF#refs/pull/*/merge"
 
       - name: Extract PR number
         shell: bash

From bd1feedf7f95c2e6bed2359c38e0bfe2c95c0d48 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:50:41 +0300
Subject: [PATCH 030/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 3f0c101bc..d803e140f 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name $GITHUB_REF#refs/pull/*/merge"
+        run: echo "Head branch name ${{ github.event.pull_request.base.ref }}"
 
       - name: Extract PR number
         shell: bash

From 2b5b0a9d43e6e69a444136b9135534b1583b5445 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:54:32 +0300
Subject: [PATCH 031/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index d803e140f..4379e8dce 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name ${{ github.event.pull_request.base.ref }}"
+        run: echo "Head branch name ${{ github.event.pull_request.head.ref }}"
 
       - name: Extract PR number
         shell: bash

From a5b2a8026eedd5474e0210c69ebe89ca6b915308 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:56:31 +0300
Subject: [PATCH 032/111] final test for branch name

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 4379e8dce..5f8e7315b 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run:  echo "branch=$(echo "$GITHUB_REF" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
+        run:  echo "branch=$(echo "${{ github.event.pull_request.head.ref }}" | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
     
       - name: Extract head branch name from GITHUB_REF

From 70671be0aea84b597e298fb344e51a505e1a3958 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:59:08 +0300
Subject: [PATCH 033/111] test for commit message

---
 .github/workflows/discord-webhook.yml | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 5f8e7315b..01f08d8ec 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -20,10 +20,6 @@ jobs:
         shell: bash
         run:  echo "branch=$(echo "${{ github.event.pull_request.head.ref }}" | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
-    
-      - name: Extract head branch name from GITHUB_REF
-        shell: bash
-        run: echo "Head branch name ${{ github.event.pull_request.head.ref }}"
 
       - name: Extract PR number
         shell: bash
@@ -37,4 +33,4 @@ jobs:
           DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": "https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "https://${{ steps.extract_branch.outputs.branch }}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
         uses: Ilshidur/action-discord@master
         with:
-          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
+          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.pull_request.head_commit.message }}'

From b84f99a2d44444abe317282a0f0193c4eb7e7817 Mon Sep 17 00:00:00 2001
From: Hredhya <hredhya3107@gmail.com>
Date: Sun, 23 Apr 2023 17:09:40 -0400
Subject: [PATCH 034/111] (fix/hredhya) Use progress tag instead of nested div

---
 .../ProgressBar/ProgressBar.stories.tsx       |  4 +-
 .../molecules/ProgressBar/ProgressBar.tsx     | 22 ++++-----
 .../ProgressBar/StyledProgressBar.ts          | 45 +++++++++----------
 .../components/molecules/ProgressBar/index.ts |  2 +-
 4 files changed, 37 insertions(+), 36 deletions(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
index 30e39ed99..1193f21fe 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
@@ -12,10 +12,10 @@ const TemplateProgressBar: ComponentStory<typeof ProgressBar> = (args) => (
 
 export const InProgress = TemplateProgressBar.bind({});
 InProgress.args = {
-  percentage: 50,
+  value: 50,
 };
 
 export const Finished = TemplateProgressBar.bind({});
 Finished.args = {
-  percentage: 100,
+  value: 100,
 };
diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
index dfb5247cb..d5808c7c3 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -1,25 +1,27 @@
 import * as React from 'react';
 import Icon from '../../../assets/icons/rawSvg/check-circle.svg';
 import {
-  Wrapper,
-  Progress,
+  ProgressBarWrapper,
   CheckIcon,
   PercentageWrapper,
   Percentage,
 } from './StyledProgressBar';
 import type { ProgressBarProps } from '.';
 
-const ProgressBar: React.FC<ProgressBarProps> = (props) => {
-  // Check if percentage is less than 0 or greater than 100, set it to 0 or 100 respectively
-  const percentage = Math.max(0, Math.min(100, props.percentage));
+const ProgressBar: React.FC<ProgressBarProps> = ({ value }) => {
+  let progressValue = value;
+  if (value >= 1 && value < 3) {
+    progressValue = 3;
+  }
+  const max = 100;
   return (
-    <Wrapper percentage={percentage}>
-      <Progress percentage={percentage} />
+    <ProgressBarWrapper value={value}>
+      <progress value={progressValue} max={max} />
       <PercentageWrapper>
-        <Percentage percentage={percentage}>{percentage}%</Percentage>
-        {percentage === 100 && <CheckIcon src={Icon} />}
+        <Percentage value={value}>{value}%</Percentage>
+        {value >= 100 && <CheckIcon src={Icon} />}
       </PercentageWrapper>
-    </Wrapper>
+    </ProgressBarWrapper>
   );
 };
 export default ProgressBar;
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index f7656dc95..2b212a73d 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -4,36 +4,35 @@ import { radiusStyles } from '../../atoms/Radius';
 import type { ProgressBarProps } from '.';
 
 const getColor = (percentage: number, theme: DefaultTheme) => {
-  return percentage === 100 ? theme.colors.SUCCESS : theme.colors.NOTIFICATION;
+  return percentage >= 100 ? theme.colors.SUCCESS : theme.colors.NOTIFICATION;
 };
 
-export const Wrapper = styled.div<ProgressBarProps>`
+export const ProgressBarWrapper = styled.div<ProgressBarProps>`
   box-sizing: border-box;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   position: relative;
-  ${radiusStyles['radius300']};
-  height: 26px;
   width: 320px;
-  top: 36px;
-  background-color: ${({ theme }) => theme.colors.GREYSCALE_OFF_WHITE};
-  border: 2px solid ${({ percentage, theme }) => getColor(percentage, theme)};
-`;
-export const Progress = styled.div<ProgressBarProps>`
-  box-sizing: border-box;
-  border: 2px solid ${({ percentage, theme }) => getColor(percentage, theme)};
-  background-color: ${({ percentage, theme }) => getColor(percentage, theme)};
-  ${radiusStyles['radius300']};
-  height: 26px;
-  // Set a min width of 5% when percentage is less than 5 and make it invisible at 0 percentage
-  width: ${(props) =>
-    props.percentage === 0
-      ? '0%'
-      : props.percentage < 5
-      ? '5%'
-      : `${props.percentage}%`};
-  opacity: ${(props) => (props.percentage === 0 ? '0' : '1')};
+  progress[value] {
+    // to reset default styles
+    -webkit-appearance: none;
+    appearance: none;
+    border: none;
+    width: 320px;
+    height: 26px;
+    top: 36px;
+    // styling the progress element container and value element
+    ::-webkit-progress-bar {
+      background-color: ${({ theme }) => theme.colors.GREYSCALE_OFF_WHITE};
+      ${radiusStyles['radius300']};
+      border: 2px solid ${({ value, theme }) => getColor(value, theme)};
+    }
+    ::-webkit-progress-value {
+      background-color: ${({ value, theme }) => getColor(value, theme)};
+      ${radiusStyles['radius300']};
+    }
+  }
 `;
 export const PercentageWrapper = styled.div`
   display: flex;
@@ -50,7 +49,7 @@ export const Percentage = styled.span<ProgressBarProps>`
   font-weight: 400;
   font-size: 16px;
   line-height: 24px;
-  color: ${({ percentage, theme }) => getColor(percentage, theme)};
+  color: ${({ value, theme }) => getColor(value, theme)};
   width: 35px;
   height: 24px;
 `;
diff --git a/packages/UI/src/components/molecules/ProgressBar/index.ts b/packages/UI/src/components/molecules/ProgressBar/index.ts
index b0905925d..84d0f53d1 100644
--- a/packages/UI/src/components/molecules/ProgressBar/index.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/index.ts
@@ -1,4 +1,4 @@
 export interface ProgressBarProps {
-  percentage: number;
+  value: number;
 }
 export { default } from './ProgressBar';

From a85ea554e7d16b90545fc089dc084b32c9497937 Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sat, 8 Apr 2023 23:40:59 -0500
Subject: [PATCH 035/111] fix(alicefate): fix: Text content did not match.

---
 .../components/organisms/Footer/RandomQuote/RandomQuote.js | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js b/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js
index 85551875e..6b971404e 100644
--- a/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js
+++ b/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js
@@ -1,3 +1,4 @@
+import React, { useState } from 'react';
 import Wrapper from './StyledRandomQuote';
 
 // Retrieve all quotes from our content layer
@@ -6,7 +7,11 @@ const quotes =
 
 export default function RandomQuote() {
   // Select and display a random quote from our quotes collection
-  const randomQuote = quotes[parseInt(quotes.length * Math.random(), 10)];
+  const [randomNum, setRandomNum] = useState(0);
+  React.useEffect(() => {
+    setRandomNum(parseInt(quotes.length * Math.random(), 10));
+  }, []);
+  const randomQuote = quotes[randomNum];
   return (
     <Wrapper>
       &quot;{randomQuote.body}&quot; - {randomQuote.author}

From eddc91d97690996bef999c1816afe5a1c313b29d Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sun, 16 Apr 2023 12:17:27 -0500
Subject: [PATCH 036/111] fix:unsubmited required input & textfield turn red

---
 packages/UI/src/components/organisms/FormField/FormField.tsx    | 2 +-
 .../UI/src/components/organisms/OpenResponse/OpenResponse.tsx   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/UI/src/components/organisms/FormField/FormField.tsx b/packages/UI/src/components/organisms/FormField/FormField.tsx
index 72628160b..3ce5ca38d 100644
--- a/packages/UI/src/components/organisms/FormField/FormField.tsx
+++ b/packages/UI/src/components/organisms/FormField/FormField.tsx
@@ -38,7 +38,7 @@ function FormField({
             autoComplete="off"
             placeholder={placeholder}
             valid={touched && !error}
-            error={error}
+            error={touched ? error : ''}
             disabled={disabled}
             onChange={onChange}
             value={value}
diff --git a/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx b/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
index e3cb3f8e0..1479d1b9c 100644
--- a/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
+++ b/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
@@ -39,7 +39,7 @@ function OpenResponse({
             autoCorrect="off"
             autoComplete="off"
             valid={touched && !error}
-            error={error}
+            error={touched ? error : ''}
             disabled={disabled}
             onChange={onChange}
             value={value}

From 62403a8997a311590927b3eeab3f309f31aba175 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 11:36:46 -0500
Subject: [PATCH 037/111] components/discord-webhook: testing discord hook.

---
 .github/workflows/chromatic.yml | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index f2db41728..7abf907c6 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -50,7 +50,8 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          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}}"}]'
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.head_ref }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. Click [here](${{ steps.chromatic.outputs.buildUrl }}) to view the Chromatic review.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+
 
         uses: Ilshidur/action-discord@master
         with:

From e59d16808d612fe349e0834aace498d6ad9a7ce6 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 11:48:17 -0500
Subject: [PATCH 038/111] triggering the webhook.

---
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx        | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 8267726d58d120bd538e99134e6e286f891675ca Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 11:58:26 -0500
Subject: [PATCH 039/111] triggering another hook.

---
 .github/workflows/chromatic.yml                              | 5 +++--
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx    | 1 -
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 7abf907c6..68b5a3619 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -50,12 +50,13 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.head_ref }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. Click [here](${{ steps.chromatic.outputs.buildUrl }}) to view the Chromatic review.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${GITHUB_REF##*/} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
+          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.'
+          args: 'New build for ${GITHUB_REF##*/} Finished.'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0d69a488a..0ef0e1d4f 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,7 +6,6 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
-
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From d8239f5b6b24a3e221ca250f09331f12307f1e98 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 12:06:16 -0500
Subject: [PATCH 040/111] one more try

---
 .github/workflows/chromatic.yml                               | 4 ++--
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx     | 1 +
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 68b5a3619..ac18276fd 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -50,13 +50,13 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${GITHUB_REF##*/} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{GITHUB_REF##*/}} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
           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 ${GITHUB_REF##*/} Finished.'
+          args: 'New build for ${{GITHUB_REF##*/}} Finished.'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From a7dc5ee42984637d50843e2f6a915283c2077342 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 12:18:31 -0500
Subject: [PATCH 041/111] once again.

---
 .github/workflows/chromatic.yml                               | 4 ++--
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx     | 1 -
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index ac18276fd..575f6face 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -50,13 +50,13 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{GITHUB_REF##*/}} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.event.pull_request.title }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
           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 ${{GITHUB_REF##*/}} Finished.'
+          args: 'New build for ${{ github.event.pull_request.title }} has Finished.'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0d69a488a..0ef0e1d4f 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,7 +6,6 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
-
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 8adc35248b58d6bdad7d1acef05d124576c6bafe Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Thu, 6 Apr 2023 13:06:13 +0300
Subject: [PATCH 042/111] fix(ci): chromatic webhook readability

---
 .github/workflows/chromatic.yml | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 575f6face..da7630e98 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -21,11 +21,17 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       code: ${{ steps.chromatic.outputs.code }}
+      branch: ${{ steps.extract_branch.outputs.branch }}
     # The list of steps that the action will go through
     steps:
       - name: Checkout
         uses: actions/checkout@v1
-
+      
+      - name: Extract branch name
+        shell: bash
+        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/})" >>$GITHUB_OUTPUT
+        id: extract_branch
+        
       - name: Use Node.js 16.x
         uses: actions/setup-node@v3
         with:
@@ -50,13 +56,12 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.event.pull_request.title }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
-          Click [here](${{ steps.chromatic.outputs.buildUrl }}) to view the Chromatic review.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
 
 
         uses: Ilshidur/action-discord@master
         with:
-          args: 'New build for ${{ github.event.pull_request.title }} has Finished.'
+          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:

From dcd390974ef92ed1d6d226f8ab9082f8c68e38d6 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Thu, 6 Apr 2023 13:15:59 +0300
Subject: [PATCH 043/111] fix json error

---
 .github/workflows/chromatic.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index da7630e98..860cf1db5 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -56,7 +56,7 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "Chromatic","description": View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
 
 
         uses: Ilshidur/action-discord@master

From a408763eb7980de71951b7905e75ba9ac5784336 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Thu, 6 Apr 2023 09:57:51 -0500
Subject: [PATCH 044/111] test

---
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx        | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 7d2b0ba1a9dd4f3282adcebf013b3bd37d684948 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Thu, 13 Apr 2023 06:23:42 -0500
Subject: [PATCH 045/111] Roman/discord-webhook: Creating a new file for the
 webhook and adjusting chromatic.yml

---
 .github/workflows/chromatic.yml       | 10 --------
 .github/workflows/discord-webhook.yml | 37 +++++++++++++++++++++++++++
 2 files changed, 37 insertions(+), 10 deletions(-)
 create mode 100644 .github/workflows/discord-webhook.yml

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 860cf1db5..00c055ca2 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -52,16 +52,6 @@ jobs:
           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": "Chromatic","description": "View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
-
-
-        uses: Ilshidur/action-discord@master
-        with:
-          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
new file mode 100644
index 000000000..d33f6390c
--- /dev/null
+++ b/.github/workflows/discord-webhook.yml
@@ -0,0 +1,37 @@
+name: Discord Webhook
+on:
+  pull_request:
+    paths:
+      - 'packages/UI/.storybook/**'
+      - 'packages/UI/src/**'
+jobs:
+  discord:
+    runs-on: ubuntu-latest
+    outputs:
+      url: ${{ steps.chromatic.outputs.url }}
+      buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
+      storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
+      branch: ${{ steps.extract_branch.outputs.branch }}
+      pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
+    steps:
+     - name: Extract branch name
+        shell: bash
+        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | sed 's/staging\///')" >>$GITHUB_OUTPUT
+        id: extract_branch
+     - name: Extract PR name
+        shell: bash
+        run: |
+          pr_number="${GITHUB_REF#refs/pull/}"
+          pr_number="${pr_number%/*}"
+           echo "pr_number=$pr_number" >> $GITHUB_OUTPUT
+        id: extract_pr_number
+      - name: Discord Channel Notification
+        env:
+          BRANCH: ${{steps.extract_branch.outputs.branch}}
+          URL:  ${{steps.deploy.outputs.url}}
+          DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": " https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}, {"title": "Storybook","description": "View the storybook for this change.","url": " https://${{steps.extract_branch.outputs.branch}}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
+        
+        uses: Ilshidur/action-discord@master
+        with:
+          args: 'New build for ${{ BRANCH }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'

From b6cc9f5878a8eaa313cc8bda7b87a95f03a4605a Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:08:31 -0500
Subject: [PATCH 046/111] Webhook changes

---
 .github/workflows/discord-webhook.yml | 22 ++++++++++------------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index d33f6390c..9cb7c23d6 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -14,24 +14,22 @@ jobs:
       branch: ${{ steps.extract_branch.outputs.branch }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
-     - name: Extract branch name
+      - name: Checkout
+        uses: actions/checkout@v2
+      - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | sed 's/staging\///')" >>$GITHUB_OUTPUT
+        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
-     - name: Extract PR name
+      - name: Extract PR number
         shell: bash
-        run: |
-          pr_number="${GITHUB_REF#refs/pull/}"
-          pr_number="${pr_number%/*}"
-           echo "pr_number=$pr_number" >> $GITHUB_OUTPUT
+        run: echo "pr_number=$(echo "$GITHUB_REF" | awk -F / '{print $3}')" >> $GITHUB_OUTPUT
         id: extract_pr_number
       - name: Discord Channel Notification
         env:
-          BRANCH: ${{steps.extract_branch.outputs.branch}}
-          URL:  ${{steps.deploy.outputs.url}}
+          BRANCH: ${{ steps.extract_branch.outputs.branch }}
+          URL: ${{ steps.deploy.outputs.url }}
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": " https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}, {"title": "Storybook","description": "View the storybook for this change.","url": " https://${{steps.extract_branch.outputs.branch}}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
-        
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": "https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "https://${{ steps.extract_branch.outputs.branch }}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
         uses: Ilshidur/action-discord@master
         with:
-          args: 'New build for ${{ BRANCH }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
+          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'

From a293d8edd113771d890ca2b585e677a4c727cb0f Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:22:06 -0500
Subject: [PATCH 047/111] Changing branch name output.

---
 .github/workflows/discord-webhook.yml | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 9cb7c23d6..603e0f6ad 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -12,13 +12,14 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       branch: ${{ steps.extract_branch.outputs.branch }}
+      BRANCH_NAME: ${{ github.base_ref ||  }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
       - name: Checkout
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | tr / -)" >> $GITHUB_OUTPUT
+        run: echo "branch=$(echo ${github.head_ref} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From f5bdd37e5378d73b04b0378d2cf211e7eae69e6b Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:22:58 -0500
Subject: [PATCH 048/111] Fixing error

---
 .github/workflows/discord-webhook.yml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 603e0f6ad..5c8a6cd0d 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -12,7 +12,6 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       branch: ${{ steps.extract_branch.outputs.branch }}
-      BRANCH_NAME: ${{ github.base_ref ||  }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
       - name: Checkout

From 1d1bed85012837ab59304c394a1056299968cd23 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:24:19 -0500
Subject: [PATCH 049/111] trying out a different branch name approach

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 5c8a6cd0d..12ca69bf7 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${github.head_ref} | tr / -)" >> $GITHUB_OUTPUT
+        run: echo "branch=$(echo ${github.base_ref} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From 486c57c6118baaacae5e3320ecdced393ecc51af Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:25:49 -0500
Subject: [PATCH 050/111] One more approach to branch name

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 12ca69bf7..dab8b1e18 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${github.base_ref} | tr / -)" >> $GITHUB_OUTPUT
+        run: echo "branch=$(echo ${GITHUB_REF##*/} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From e3a5e9bdc8b324c723617b8c5b681172cb898698 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:34:30 -0500
Subject: [PATCH 051/111] One more attempt at branch name output.

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index dab8b1e18..cbf87c456 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${GITHUB_REF##*/} | tr / -)" >> $GITHUB_OUTPUT
+        run:  echo "branch=$(echo ${GITHUB_REF}" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From b3722b0e776f9a03da4b0fd469d1f109a502ff6e Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:36:31 -0500
Subject: [PATCH 052/111] fixing mistake

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index cbf87c456..3549169c8 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run:  echo "branch=$(echo ${GITHUB_REF}" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
+        run:  echo "branch=$(echo "$GITHUB_REF" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From d4600bba91ecb521a3e39f35e8cd8321fddc65b3 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:40:48 +0300
Subject: [PATCH 053/111] Extract head branch name from GITHUB_REF step

---
 .github/workflows/discord-webhook.yml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 3549169c8..f974068ed 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -20,6 +20,12 @@ jobs:
         shell: bash
         run:  echo "branch=$(echo "$GITHUB_REF" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
         id: extract_branch
+    
+      - name: Extract head branch name from GITHUB_REF
+        run: |
+          headBranch="${{ GITHUB_REF#refs/pull/*/merge }}"
+          echo "Head branch name: $headBranch"
+          
       - name: Extract PR number
         shell: bash
         run: echo "pr_number=$(echo "$GITHUB_REF" | awk -F / '{print $3}')" >> $GITHUB_OUTPUT

From 0715ecfb9deb19dc9eefa359fa966e0369fb50fd Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:43:18 +0300
Subject: [PATCH 054/111] fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index f974068ed..415ba1bb3 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -22,10 +22,9 @@ jobs:
         id: extract_branch
     
       - name: Extract head branch name from GITHUB_REF
-        run: |
-          headBranch="${{ GITHUB_REF#refs/pull/*/merge }}"
-          echo "Head branch name: $headBranch"
-          
+        shell: bash
+        run: headBranch="${{ GITHUB_REF#refs/pull/*/merge }}" && echo "Head branch name: $headBranch"
+
       - name: Extract PR number
         shell: bash
         run: echo "pr_number=$(echo "$GITHUB_REF" | awk -F / '{print $3}')" >> $GITHUB_OUTPUT

From 2d3fb18a1bfe67f507965e013e0963b1e5676498 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:44:46 +0300
Subject: [PATCH 055/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 415ba1bb3..1d7c41204 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: headBranch="${{ GITHUB_REF#refs/pull/*/merge }}" && echo "Head branch name: $headBranch"
+        run: echo "Head branch name: ${{ GITHUB_REF#refs/pull/*/merge }}"
 
       - name: Extract PR number
         shell: bash

From efb8b8ac3556f140dec6f477fd61eb046eb25114 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:46:26 +0300
Subject: [PATCH 056/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 1d7c41204..84d8e8b1c 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name: ${{ GITHUB_REF#refs/pull/*/merge }}"
+        run: echo "Head branch name: $GITHUB_REF#refs/pull/*/merge"
 
       - name: Extract PR number
         shell: bash

From 7349c73b42b659f89c9ed18367542db02f899577 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:48:19 +0300
Subject: [PATCH 057/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 84d8e8b1c..3f0c101bc 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name: $GITHUB_REF#refs/pull/*/merge"
+        run: echo "Head branch name $GITHUB_REF#refs/pull/*/merge"
 
       - name: Extract PR number
         shell: bash

From c3b13bad8276d998640b135ad3e9ad031d72591a Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:50:41 +0300
Subject: [PATCH 058/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 3f0c101bc..d803e140f 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name $GITHUB_REF#refs/pull/*/merge"
+        run: echo "Head branch name ${{ github.event.pull_request.base.ref }}"
 
       - name: Extract PR number
         shell: bash

From 54103bb3701dd694e826d3230f4bb4b1e536cee5 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:54:32 +0300
Subject: [PATCH 059/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index d803e140f..4379e8dce 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name ${{ github.event.pull_request.base.ref }}"
+        run: echo "Head branch name ${{ github.event.pull_request.head.ref }}"
 
       - name: Extract PR number
         shell: bash

From dc79ed58a87890bdc2d437b0e365bfc4424a6b50 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:56:31 +0300
Subject: [PATCH 060/111] final test for branch name

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 4379e8dce..5f8e7315b 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run:  echo "branch=$(echo "$GITHUB_REF" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
+        run:  echo "branch=$(echo "${{ github.event.pull_request.head.ref }}" | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
     
       - name: Extract head branch name from GITHUB_REF

From 64d83a03b412cac42b81137ab164d2ab5fd4ca5d Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:59:08 +0300
Subject: [PATCH 061/111] test for commit message

---
 .github/workflows/discord-webhook.yml | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 5f8e7315b..01f08d8ec 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -20,10 +20,6 @@ jobs:
         shell: bash
         run:  echo "branch=$(echo "${{ github.event.pull_request.head.ref }}" | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
-    
-      - name: Extract head branch name from GITHUB_REF
-        shell: bash
-        run: echo "Head branch name ${{ github.event.pull_request.head.ref }}"
 
       - name: Extract PR number
         shell: bash
@@ -37,4 +33,4 @@ jobs:
           DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": "https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "https://${{ steps.extract_branch.outputs.branch }}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
         uses: Ilshidur/action-discord@master
         with:
-          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
+          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.pull_request.head_commit.message }}'

From e63e0392a7ec4dd6e2dfb640829edc530d383260 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Fri, 24 Mar 2023 21:00:01 +0300
Subject: [PATCH 062/111] inital commit for progressBar

---
 .../ProgressBar/ProgressBar.stories.tsx       | 21 +++++++++++++++++++
 .../molecules/ProgressBar/ProgressBar.tsx     |  9 ++++++++
 .../ProgressBar/StyledProgressBar.ts          |  7 +++++++
 .../components/molecules/ProgressBar/index.ts |  4 ++++
 4 files changed, 41 insertions(+)
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/index.ts

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
new file mode 100644
index 000000000..30e39ed99
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
@@ -0,0 +1,21 @@
+import type { ComponentStory, ComponentMeta } from '@storybook/react';
+
+import ProgressBar from './ProgressBar';
+export default {
+  title: 'Molecules/ProgressBar',
+  component: ProgressBar,
+} as ComponentMeta<typeof ProgressBar>;
+
+const TemplateProgressBar: ComponentStory<typeof ProgressBar> = (args) => (
+  <ProgressBar {...args}></ProgressBar>
+);
+
+export const InProgress = TemplateProgressBar.bind({});
+InProgress.args = {
+  percentage: 50,
+};
+
+export const Finished = TemplateProgressBar.bind({});
+Finished.args = {
+  percentage: 100,
+};
diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
new file mode 100644
index 000000000..d18721c18
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -0,0 +1,9 @@
+import * as React from 'react';
+import type { ProgressBarProps } from '.';
+import { Wrapper } from './StyledProgressBar';
+
+const ProgressBar: React.FC<ProgressBarProps> = (props) => {
+  return <Wrapper>{props.percentage}%</Wrapper>;
+};
+
+export default ProgressBar;
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
new file mode 100644
index 000000000..4320431f4
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -0,0 +1,7 @@
+import { radiusStyles } from '../../atoms/Radius';
+import styled from 'styled-components';
+
+export const Wrapper = styled.div`
+  background-color: ${({ theme }) => theme.colors.NOTIFICATION};
+  ${radiusStyles['radius300']};
+`;
diff --git a/packages/UI/src/components/molecules/ProgressBar/index.ts b/packages/UI/src/components/molecules/ProgressBar/index.ts
new file mode 100644
index 000000000..b0905925d
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/index.ts
@@ -0,0 +1,4 @@
+export interface ProgressBarProps {
+  percentage: number;
+}
+export { default } from './ProgressBar';

From b95dd642aa119daea0dc61a2f03b8a79d69b7276 Mon Sep 17 00:00:00 2001
From: Hredhya <hredhya3107@gmail.com>
Date: Sat, 1 Apr 2023 18:10:30 -0400
Subject: [PATCH 063/111] feat(Hredhya) Add Progress Bar Component

---
 .../molecules/ProgressBar/ProgressBar.tsx     | 22 ++++++--
 .../ProgressBar/StyledProgressBar.ts          | 53 +++++++++++++++++--
 2 files changed, 69 insertions(+), 6 deletions(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
index d18721c18..793c41d43 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -1,9 +1,25 @@
 import * as React from 'react';
+import Icon from '../../../assets/icons/rawSvg/check-circle.svg';
+import {
+  Wrapper,
+  Progress,
+  CheckIcon,
+  PercentageWrapper,
+  Percentage,
+} from './StyledProgressBar';
 import type { ProgressBarProps } from '.';
-import { Wrapper } from './StyledProgressBar';
 
 const ProgressBar: React.FC<ProgressBarProps> = (props) => {
-  return <Wrapper>{props.percentage}%</Wrapper>;
+  return (
+    <Wrapper percentage={props.percentage}>
+      <Progress percentage={props.percentage} />
+      <PercentageWrapper>
+        <Percentage percentage={props.percentage}>
+          {props.percentage}%
+        </Percentage>
+        {props.percentage === 100 && <CheckIcon src={Icon} />}
+      </PercentageWrapper>
+    </Wrapper>
+  );
 };
-
 export default ProgressBar;
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index 4320431f4..ef1823c89 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -1,7 +1,54 @@
-import { radiusStyles } from '../../atoms/Radius';
+import type { DefaultTheme } from 'styled-components';
 import styled from 'styled-components';
+import { radiusStyles } from '../../atoms/Radius';
+import type { ProgressBarProps } from '.';
 
-export const Wrapper = styled.div`
-  background-color: ${({ theme }) => theme.colors.NOTIFICATION};
+const getColor = (percentage: number, theme: DefaultTheme) => {
+  return percentage === 100 ? theme.colors.SUCCESS : theme.colors.NOTIFICATION;
+};
+
+export const Wrapper = styled.div<ProgressBarProps>`
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  position: relative;
+  ${radiusStyles['radius300']};
+  height: 26px;
+  width: 320px;
+  top: 36px;
+  background-color: ${({ theme }) => theme.colors.GREYSCALE_OFF_WHITE};
+  border: 2px solid ${({ percentage, theme }) => getColor(percentage, theme)};
+`;
+export const Progress = styled.div<ProgressBarProps>`
+  box-sizing: border-box;
+  border: 2px solid ${({ percentage, theme }) => getColor(percentage, theme)};
+  background-color: ${({ percentage, theme }) => getColor(percentage, theme)};
   ${radiusStyles['radius300']};
+  height: 26px;
+  // top: 36px;
+  width: ${(props) => props.percentage}%;
+`;
+export const PercentageWrapper = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  top: -26px;
+  width: 100%;
+  gap: 12px;
+`;
+export const Percentage = styled.span<ProgressBarProps>`
+  font-family: 'Nunito Sans';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 16px;
+  line-height: 24px;
+  color: ${({ percentage, theme }) => getColor(percentage, theme)};
+  width: 35px;
+  height: 24px;
+`;
+export const CheckIcon = styled.img`
+  width: 20px;
+  height: 20px;
 `;

From d17686b2d64ea2815b0afa4272a79a7289dad4d0 Mon Sep 17 00:00:00 2001
From: Hredhya <hredhya3107@gmail.com>
Date: Mon, 10 Apr 2023 21:58:11 -0400
Subject: [PATCH 064/111] set min and max percentage value and set min width as
 5% for inner bar

---
 .../components/molecules/ProgressBar/ProgressBar.tsx | 12 +++++++-----
 .../molecules/ProgressBar/StyledProgressBar.ts       |  5 +++--
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
index 793c41d43..64d73be49 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -10,14 +10,16 @@ import {
 import type { ProgressBarProps } from '.';
 
 const ProgressBar: React.FC<ProgressBarProps> = (props) => {
+  // Check if percentage is less than 0 or greater than 100, set it to 0 or 100 respectively
+  const percentage = Math.max(0, Math.min(100, props.percentage));
   return (
-    <Wrapper percentage={props.percentage}>
-      <Progress percentage={props.percentage} />
+    <Wrapper percentage={percentage}>
+      <Progress percentage={percentage} />
       <PercentageWrapper>
-        <Percentage percentage={props.percentage}>
-          {props.percentage}%
+        <Percentage percentage={percentage}>
+          {percentage}%
         </Percentage>
-        {props.percentage === 100 && <CheckIcon src={Icon} />}
+        {percentage === 100 && <CheckIcon src={Icon} />}
       </PercentageWrapper>
     </Wrapper>
   );
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index ef1823c89..af6cf0e7e 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -26,8 +26,9 @@ export const Progress = styled.div<ProgressBarProps>`
   background-color: ${({ percentage, theme }) => getColor(percentage, theme)};
   ${radiusStyles['radius300']};
   height: 26px;
-  // top: 36px;
-  width: ${(props) => props.percentage}%;
+  width: ${(props) => (props.percentage < 5 ? '5%' : `${props.percentage}%`)};
+  // Set a minimum width of 5% when percentage is less than 5
+  min-width: 5%;
 `;
 export const PercentageWrapper = styled.div`
   display: flex;

From f7deb4a782253d91a1792797f76878e7af592d66 Mon Sep 17 00:00:00 2001
From: Hredhya <hredhya3107@gmail.com>
Date: Tue, 11 Apr 2023 21:41:00 -0400
Subject: [PATCH 065/111] Set a min width of 5% when percentage is less than 5
 and make it invisible at 0 percentage

---
 .../components/molecules/ProgressBar/ProgressBar.tsx  |  4 +---
 .../molecules/ProgressBar/StyledProgressBar.ts        | 11 ++++++++---
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
index 64d73be49..dfb5247cb 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -16,9 +16,7 @@ const ProgressBar: React.FC<ProgressBarProps> = (props) => {
     <Wrapper percentage={percentage}>
       <Progress percentage={percentage} />
       <PercentageWrapper>
-        <Percentage percentage={percentage}>
-          {percentage}%
-        </Percentage>
+        <Percentage percentage={percentage}>{percentage}%</Percentage>
         {percentage === 100 && <CheckIcon src={Icon} />}
       </PercentageWrapper>
     </Wrapper>
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index af6cf0e7e..f7656dc95 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -26,9 +26,14 @@ export const Progress = styled.div<ProgressBarProps>`
   background-color: ${({ percentage, theme }) => getColor(percentage, theme)};
   ${radiusStyles['radius300']};
   height: 26px;
-  width: ${(props) => (props.percentage < 5 ? '5%' : `${props.percentage}%`)};
-  // Set a minimum width of 5% when percentage is less than 5
-  min-width: 5%;
+  // Set a min width of 5% when percentage is less than 5 and make it invisible at 0 percentage
+  width: ${(props) =>
+    props.percentage === 0
+      ? '0%'
+      : props.percentage < 5
+      ? '5%'
+      : `${props.percentage}%`};
+  opacity: ${(props) => (props.percentage === 0 ? '0' : '1')};
 `;
 export const PercentageWrapper = styled.div`
   display: flex;

From aab744532f16760b8f96a0bcd7f9b6aa6a991a18 Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sat, 25 Mar 2023 16:12:05 -0500
Subject: [PATCH 066/111] change it back to css in FormField.tsx

---
 packages/UI/src/components/organisms/FormField/FormField.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/FormField/FormField.tsx b/packages/UI/src/components/organisms/FormField/FormField.tsx
index 3ce5ca38d..7fa204662 100644
--- a/packages/UI/src/components/organisms/FormField/FormField.tsx
+++ b/packages/UI/src/components/organisms/FormField/FormField.tsx
@@ -26,7 +26,7 @@ function FormField({
     <>
       <Label htmlFor={id}>
         <Typography type="label">
-          {label} {required && <span style={{ color: 'red' }}>*</span>}
+          {label} {required && <span css={{ color: 'red' }}>*</span>}
         </Typography>
         <InputWrapper>
           <Input

From 366034a25ca91b87c34e0104ff87d967576b59fb Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sat, 8 Apr 2023 23:40:59 -0500
Subject: [PATCH 067/111] fix(alicefate): fix: Text content did not match.

---
 .../components/organisms/Footer/RandomQuote/RandomQuote.js | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js b/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js
index 85551875e..6b971404e 100644
--- a/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js
+++ b/packages/UI/src/components/organisms/Footer/RandomQuote/RandomQuote.js
@@ -1,3 +1,4 @@
+import React, { useState } from 'react';
 import Wrapper from './StyledRandomQuote';
 
 // Retrieve all quotes from our content layer
@@ -6,7 +7,11 @@ const quotes =
 
 export default function RandomQuote() {
   // Select and display a random quote from our quotes collection
-  const randomQuote = quotes[parseInt(quotes.length * Math.random(), 10)];
+  const [randomNum, setRandomNum] = useState(0);
+  React.useEffect(() => {
+    setRandomNum(parseInt(quotes.length * Math.random(), 10));
+  }, []);
+  const randomQuote = quotes[randomNum];
   return (
     <Wrapper>
       &quot;{randomQuote.body}&quot; - {randomQuote.author}

From 8151dc2920a70eacb835c5a9860bfcb557928acf Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sun, 16 Apr 2023 12:17:27 -0500
Subject: [PATCH 068/111] fix:unsubmited required input & textfield turn red

---
 packages/UI/src/components/organisms/FormField/FormField.tsx    | 2 +-
 .../UI/src/components/organisms/OpenResponse/OpenResponse.tsx   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/UI/src/components/organisms/FormField/FormField.tsx b/packages/UI/src/components/organisms/FormField/FormField.tsx
index 72628160b..3ce5ca38d 100644
--- a/packages/UI/src/components/organisms/FormField/FormField.tsx
+++ b/packages/UI/src/components/organisms/FormField/FormField.tsx
@@ -38,7 +38,7 @@ function FormField({
             autoComplete="off"
             placeholder={placeholder}
             valid={touched && !error}
-            error={error}
+            error={touched ? error : ''}
             disabled={disabled}
             onChange={onChange}
             value={value}
diff --git a/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx b/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
index e3cb3f8e0..1479d1b9c 100644
--- a/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
+++ b/packages/UI/src/components/organisms/OpenResponse/OpenResponse.tsx
@@ -39,7 +39,7 @@ function OpenResponse({
             autoCorrect="off"
             autoComplete="off"
             valid={touched && !error}
-            error={error}
+            error={touched ? error : ''}
             disabled={disabled}
             onChange={onChange}
             value={value}

From 314bd3610d8297d44f7713aac30aafa228e906bd Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 11:36:46 -0500
Subject: [PATCH 069/111] components/discord-webhook: testing discord hook.

---
 .github/workflows/chromatic.yml | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index f2db41728..7abf907c6 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -50,7 +50,8 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          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}}"}]'
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.head_ref }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. Click [here](${{ steps.chromatic.outputs.buildUrl }}) to view the Chromatic review.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+
 
         uses: Ilshidur/action-discord@master
         with:

From 22ff3b45c96dd1878f53fe2c67aa72deabd5c655 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 11:48:17 -0500
Subject: [PATCH 070/111] triggering the webhook.

---
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx        | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 8c289f768a4bd60e3cbd571c6ae96352b2a9b88b Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 11:58:26 -0500
Subject: [PATCH 071/111] triggering another hook.

---
 .github/workflows/chromatic.yml                              | 5 +++--
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx    | 1 -
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 7abf907c6..68b5a3619 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -50,12 +50,13 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.head_ref }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. Click [here](${{ steps.chromatic.outputs.buildUrl }}) to view the Chromatic review.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${GITHUB_REF##*/} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
+          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.'
+          args: 'New build for ${GITHUB_REF##*/} Finished.'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0d69a488a..0ef0e1d4f 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,7 +6,6 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
-
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 6ee77e0d1c964222e0f11c190870107003113f60 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 12:06:16 -0500
Subject: [PATCH 072/111] one more try

---
 .github/workflows/chromatic.yml                               | 4 ++--
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx     | 1 +
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 68b5a3619..ac18276fd 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -50,13 +50,13 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${GITHUB_REF##*/} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{GITHUB_REF##*/}} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
           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 ${GITHUB_REF##*/} Finished.'
+          args: 'New build for ${{GITHUB_REF##*/}} Finished.'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 02c18ba3bb288c34d17e9788bbd62b357996893c Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 12:18:31 -0500
Subject: [PATCH 073/111] once again.

---
 .github/workflows/chromatic.yml                               | 4 ++--
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx     | 1 -
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index ac18276fd..575f6face 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -50,13 +50,13 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{GITHUB_REF##*/}} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
+          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.event.pull_request.title }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
           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 ${{GITHUB_REF##*/}} Finished.'
+          args: 'New build for ${{ github.event.pull_request.title }} has Finished.'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0d69a488a..0ef0e1d4f 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,7 +6,6 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
-
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 5956dd96f21319836ac84e8a5006c93fe6431ff5 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Thu, 6 Apr 2023 13:06:13 +0300
Subject: [PATCH 074/111] fix(ci): chromatic webhook readability

---
 .github/workflows/chromatic.yml | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 575f6face..da7630e98 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -21,11 +21,17 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       code: ${{ steps.chromatic.outputs.code }}
+      branch: ${{ steps.extract_branch.outputs.branch }}
     # The list of steps that the action will go through
     steps:
       - name: Checkout
         uses: actions/checkout@v1
-
+      
+      - name: Extract branch name
+        shell: bash
+        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/})" >>$GITHUB_OUTPUT
+        id: extract_branch
+        
       - name: Use Node.js 16.x
         uses: actions/setup-node@v3
         with:
@@ -50,13 +56,12 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "UI changes for branch ${{ github.event.pull_request.title }} are ready for review","description": "${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}. 
-          Click [here](${{ steps.chromatic.outputs.buildUrl }}) to view the Chromatic review.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
 
 
         uses: Ilshidur/action-discord@master
         with:
-          args: 'New build for ${{ github.event.pull_request.title }} has Finished.'
+          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:

From 11deebe34cf7a03af1f4184dc115a478e32af5e9 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Thu, 6 Apr 2023 13:15:59 +0300
Subject: [PATCH 075/111] fix json error

---
 .github/workflows/chromatic.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index da7630e98..860cf1db5 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -56,7 +56,7 @@ jobs:
       - name: Discord Channel Notification
         env:
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "Chromatic","description": View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
 
 
         uses: Ilshidur/action-discord@master

From 2f1767b3565b40f825236bdb916c267611524ef5 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Thu, 6 Apr 2023 09:57:51 -0500
Subject: [PATCH 076/111] test

---
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx        | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 0af31fd6a815784e78bdef7fadcdc67ad497548a Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Thu, 13 Apr 2023 06:23:42 -0500
Subject: [PATCH 077/111] Roman/discord-webhook: Creating a new file for the
 webhook and adjusting chromatic.yml

---
 .github/workflows/chromatic.yml       | 10 --------
 .github/workflows/discord-webhook.yml | 37 +++++++++++++++++++++++++++
 2 files changed, 37 insertions(+), 10 deletions(-)
 create mode 100644 .github/workflows/discord-webhook.yml

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 860cf1db5..00c055ca2 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -52,16 +52,6 @@ jobs:
           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": "Chromatic","description": "View the Chromatic review.","url": "${{steps.chromatic.outputs.buildUrl}}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "${{steps.chromatic.outputs.storybookUrl}}"}]'
-
-
-        uses: Ilshidur/action-discord@master
-        with:
-          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
       - name: Run Storybook tests
         run: yarn test-storybook
         env:
diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
new file mode 100644
index 000000000..d33f6390c
--- /dev/null
+++ b/.github/workflows/discord-webhook.yml
@@ -0,0 +1,37 @@
+name: Discord Webhook
+on:
+  pull_request:
+    paths:
+      - 'packages/UI/.storybook/**'
+      - 'packages/UI/src/**'
+jobs:
+  discord:
+    runs-on: ubuntu-latest
+    outputs:
+      url: ${{ steps.chromatic.outputs.url }}
+      buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
+      storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
+      branch: ${{ steps.extract_branch.outputs.branch }}
+      pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
+    steps:
+     - name: Extract branch name
+        shell: bash
+        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | sed 's/staging\///')" >>$GITHUB_OUTPUT
+        id: extract_branch
+     - name: Extract PR name
+        shell: bash
+        run: |
+          pr_number="${GITHUB_REF#refs/pull/}"
+          pr_number="${pr_number%/*}"
+           echo "pr_number=$pr_number" >> $GITHUB_OUTPUT
+        id: extract_pr_number
+      - name: Discord Channel Notification
+        env:
+          BRANCH: ${{steps.extract_branch.outputs.branch}}
+          URL:  ${{steps.deploy.outputs.url}}
+          DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": " https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}, {"title": "Storybook","description": "View the storybook for this change.","url": " https://${{steps.extract_branch.outputs.branch}}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
+        
+        uses: Ilshidur/action-discord@master
+        with:
+          args: 'New build for ${{ BRANCH }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'

From a808e1d92b34653da5560834a499d1c57263ad53 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:08:31 -0500
Subject: [PATCH 078/111] Webhook changes

---
 .github/workflows/discord-webhook.yml | 22 ++++++++++------------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index d33f6390c..9cb7c23d6 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -14,24 +14,22 @@ jobs:
       branch: ${{ steps.extract_branch.outputs.branch }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
-     - name: Extract branch name
+      - name: Checkout
+        uses: actions/checkout@v2
+      - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | sed 's/staging\///')" >>$GITHUB_OUTPUT
+        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
-     - name: Extract PR name
+      - name: Extract PR number
         shell: bash
-        run: |
-          pr_number="${GITHUB_REF#refs/pull/}"
-          pr_number="${pr_number%/*}"
-           echo "pr_number=$pr_number" >> $GITHUB_OUTPUT
+        run: echo "pr_number=$(echo "$GITHUB_REF" | awk -F / '{print $3}')" >> $GITHUB_OUTPUT
         id: extract_pr_number
       - name: Discord Channel Notification
         env:
-          BRANCH: ${{steps.extract_branch.outputs.branch}}
-          URL:  ${{steps.deploy.outputs.url}}
+          BRANCH: ${{ steps.extract_branch.outputs.branch }}
+          URL: ${{ steps.deploy.outputs.url }}
           DISCORD_WEBHOOK: ${{ secrets.UI_BUILDS_WEBHOOK }}
-          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": " https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}, {"title": "Storybook","description": "View the storybook for this change.","url": " https://${{steps.extract_branch.outputs.branch}}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
-        
+          DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": "https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "https://${{ steps.extract_branch.outputs.branch }}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
         uses: Ilshidur/action-discord@master
         with:
-          args: 'New build for ${{ BRANCH }} has Finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
+          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'

From 6d8a03456981fb0ee3d37d09582906a91ae477d8 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:22:06 -0500
Subject: [PATCH 079/111] Changing branch name output.

---
 .github/workflows/discord-webhook.yml | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 9cb7c23d6..603e0f6ad 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -12,13 +12,14 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       branch: ${{ steps.extract_branch.outputs.branch }}
+      BRANCH_NAME: ${{ github.base_ref ||  }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
       - name: Checkout
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${GITHUB_REF#refs/heads/} | tr / -)" >> $GITHUB_OUTPUT
+        run: echo "branch=$(echo ${github.head_ref} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From 2721de4d5e9cdfefd056dbda11fedde8a6f3dd74 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:22:58 -0500
Subject: [PATCH 080/111] Fixing error

---
 .github/workflows/discord-webhook.yml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 603e0f6ad..5c8a6cd0d 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -12,7 +12,6 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       branch: ${{ steps.extract_branch.outputs.branch }}
-      BRANCH_NAME: ${{ github.base_ref ||  }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
       - name: Checkout

From 27c7f42de2fe558eb8f7c5f516d13dd4c3361e6d Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:24:19 -0500
Subject: [PATCH 081/111] trying out a different branch name approach

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 5c8a6cd0d..12ca69bf7 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${github.head_ref} | tr / -)" >> $GITHUB_OUTPUT
+        run: echo "branch=$(echo ${github.base_ref} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From e23b9a2dc66e5aaf4852632b0fca7d53dac47121 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:25:49 -0500
Subject: [PATCH 082/111] One more approach to branch name

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 12ca69bf7..dab8b1e18 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${github.base_ref} | tr / -)" >> $GITHUB_OUTPUT
+        run: echo "branch=$(echo ${GITHUB_REF##*/} | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From 8bc0a0492488ecec7854dea5b3fc4f58014b4dcb Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:34:30 -0500
Subject: [PATCH 083/111] One more attempt at branch name output.

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index dab8b1e18..cbf87c456 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run: echo "branch=$(echo ${GITHUB_REF##*/} | tr / -)" >> $GITHUB_OUTPUT
+        run:  echo "branch=$(echo ${GITHUB_REF}" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From 299e7032983fda701670e16b4718bde4e8436673 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:36:31 -0500
Subject: [PATCH 084/111] fixing mistake

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index cbf87c456..3549169c8 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run:  echo "branch=$(echo ${GITHUB_REF}" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
+        run:  echo "branch=$(echo "$GITHUB_REF" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
         id: extract_branch
       - name: Extract PR number
         shell: bash

From ae3f0d7066e5ac89472f71e5d22e2bf69014dc6e Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:40:48 +0300
Subject: [PATCH 085/111] Extract head branch name from GITHUB_REF step

---
 .github/workflows/discord-webhook.yml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 3549169c8..f974068ed 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -20,6 +20,12 @@ jobs:
         shell: bash
         run:  echo "branch=$(echo "$GITHUB_REF" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
         id: extract_branch
+    
+      - name: Extract head branch name from GITHUB_REF
+        run: |
+          headBranch="${{ GITHUB_REF#refs/pull/*/merge }}"
+          echo "Head branch name: $headBranch"
+          
       - name: Extract PR number
         shell: bash
         run: echo "pr_number=$(echo "$GITHUB_REF" | awk -F / '{print $3}')" >> $GITHUB_OUTPUT

From 53588da7db7fded04db30b6f9a48bc1f70396eb3 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:43:18 +0300
Subject: [PATCH 086/111] fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index f974068ed..415ba1bb3 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -22,10 +22,9 @@ jobs:
         id: extract_branch
     
       - name: Extract head branch name from GITHUB_REF
-        run: |
-          headBranch="${{ GITHUB_REF#refs/pull/*/merge }}"
-          echo "Head branch name: $headBranch"
-          
+        shell: bash
+        run: headBranch="${{ GITHUB_REF#refs/pull/*/merge }}" && echo "Head branch name: $headBranch"
+
       - name: Extract PR number
         shell: bash
         run: echo "pr_number=$(echo "$GITHUB_REF" | awk -F / '{print $3}')" >> $GITHUB_OUTPUT

From 1f5e42dc0b9531b988372f0c20d6a9e84e35fdce Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:44:46 +0300
Subject: [PATCH 087/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 415ba1bb3..1d7c41204 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: headBranch="${{ GITHUB_REF#refs/pull/*/merge }}" && echo "Head branch name: $headBranch"
+        run: echo "Head branch name: ${{ GITHUB_REF#refs/pull/*/merge }}"
 
       - name: Extract PR number
         shell: bash

From 58080f6c2dadfabfaba5f13e16b124efc5b9d7a3 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:46:26 +0300
Subject: [PATCH 088/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 1d7c41204..84d8e8b1c 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name: ${{ GITHUB_REF#refs/pull/*/merge }}"
+        run: echo "Head branch name: $GITHUB_REF#refs/pull/*/merge"
 
       - name: Extract PR number
         shell: bash

From 6ee1b8fa15cd6f8f69e070c7d565ea6bd1d6cc72 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:48:19 +0300
Subject: [PATCH 089/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 84d8e8b1c..3f0c101bc 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name: $GITHUB_REF#refs/pull/*/merge"
+        run: echo "Head branch name $GITHUB_REF#refs/pull/*/merge"
 
       - name: Extract PR number
         shell: bash

From 6343ef60738f70bf22dde0197a90a73d750de0e4 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:50:41 +0300
Subject: [PATCH 090/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 3f0c101bc..d803e140f 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name $GITHUB_REF#refs/pull/*/merge"
+        run: echo "Head branch name ${{ github.event.pull_request.base.ref }}"
 
       - name: Extract PR number
         shell: bash

From 5cb543bc9d3bd8799ad15ea47aeafc6a26d4fe8d Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:54:32 +0300
Subject: [PATCH 091/111] final fix extract head branch name from GITHUB_REF

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index d803e140f..4379e8dce 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -23,7 +23,7 @@ jobs:
     
       - name: Extract head branch name from GITHUB_REF
         shell: bash
-        run: echo "Head branch name ${{ github.event.pull_request.base.ref }}"
+        run: echo "Head branch name ${{ github.event.pull_request.head.ref }}"
 
       - name: Extract PR number
         shell: bash

From 4a96d43005e3ff891f57eb9b7206222699fa7343 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:56:31 +0300
Subject: [PATCH 092/111] final test for branch name

---
 .github/workflows/discord-webhook.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 4379e8dce..5f8e7315b 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
       - name: Extract branch name
         shell: bash
-        run:  echo "branch=$(echo "$GITHUB_REF" | awk -F / '{print $2}')" >> $GITHUB_OUTPUT
+        run:  echo "branch=$(echo "${{ github.event.pull_request.head.ref }}" | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
     
       - name: Extract head branch name from GITHUB_REF

From d8373693de5da97cdcb3c8c0b8fbfd1afc71074d Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:59:08 +0300
Subject: [PATCH 093/111] test for commit message

---
 .github/workflows/discord-webhook.yml | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 5f8e7315b..01f08d8ec 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -20,10 +20,6 @@ jobs:
         shell: bash
         run:  echo "branch=$(echo "${{ github.event.pull_request.head.ref }}" | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
-    
-      - name: Extract head branch name from GITHUB_REF
-        shell: bash
-        run: echo "Head branch name ${{ github.event.pull_request.head.ref }}"
 
       - name: Extract PR number
         shell: bash
@@ -37,4 +33,4 @@ jobs:
           DISCORD_EMBEDS: '[{"title": "Chromatic","description": "View the Chromatic review.","url": "https://www.chromatic.com/pullrequest?appId=632ca21aeea1618b7fa0bf48&number=${{ steps.extract_pr_number.outputs.pr_number }}"}, {"title": "Storybook","description": "View the storybook for this change.","url": "https://${{ steps.extract_branch.outputs.branch }}--632ca21aeea1618b7fa0bf48.chromatic.com/"}]'
         uses: Ilshidur/action-discord@master
         with:
-          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.head_commit.message }}'
+          args: 'New build for ${{ steps.extract_branch.outputs.branch }} has finished. ${{ github.event.head_commit.author.name }} has made changes with the following commit message: ${{ github.event.pull_request.head_commit.message }}'

From 37127460ebb7d86e159958f8a00294e7abfafd55 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Fri, 24 Mar 2023 21:00:01 +0300
Subject: [PATCH 094/111] inital commit for progressBar

---
 .../ProgressBar/ProgressBar.stories.tsx       | 21 +++++++++++++++++++
 .../molecules/ProgressBar/ProgressBar.tsx     |  9 ++++++++
 .../ProgressBar/StyledProgressBar.ts          |  7 +++++++
 .../components/molecules/ProgressBar/index.ts |  4 ++++
 4 files changed, 41 insertions(+)
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
 create mode 100644 packages/UI/src/components/molecules/ProgressBar/index.ts

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
new file mode 100644
index 000000000..30e39ed99
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.stories.tsx
@@ -0,0 +1,21 @@
+import type { ComponentStory, ComponentMeta } from '@storybook/react';
+
+import ProgressBar from './ProgressBar';
+export default {
+  title: 'Molecules/ProgressBar',
+  component: ProgressBar,
+} as ComponentMeta<typeof ProgressBar>;
+
+const TemplateProgressBar: ComponentStory<typeof ProgressBar> = (args) => (
+  <ProgressBar {...args}></ProgressBar>
+);
+
+export const InProgress = TemplateProgressBar.bind({});
+InProgress.args = {
+  percentage: 50,
+};
+
+export const Finished = TemplateProgressBar.bind({});
+Finished.args = {
+  percentage: 100,
+};
diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
new file mode 100644
index 000000000..d18721c18
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -0,0 +1,9 @@
+import * as React from 'react';
+import type { ProgressBarProps } from '.';
+import { Wrapper } from './StyledProgressBar';
+
+const ProgressBar: React.FC<ProgressBarProps> = (props) => {
+  return <Wrapper>{props.percentage}%</Wrapper>;
+};
+
+export default ProgressBar;
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
new file mode 100644
index 000000000..4320431f4
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -0,0 +1,7 @@
+import { radiusStyles } from '../../atoms/Radius';
+import styled from 'styled-components';
+
+export const Wrapper = styled.div`
+  background-color: ${({ theme }) => theme.colors.NOTIFICATION};
+  ${radiusStyles['radius300']};
+`;
diff --git a/packages/UI/src/components/molecules/ProgressBar/index.ts b/packages/UI/src/components/molecules/ProgressBar/index.ts
new file mode 100644
index 000000000..b0905925d
--- /dev/null
+++ b/packages/UI/src/components/molecules/ProgressBar/index.ts
@@ -0,0 +1,4 @@
+export interface ProgressBarProps {
+  percentage: number;
+}
+export { default } from './ProgressBar';

From e7bf68c8e9cd28bdc25ad801d157658f09b2ec86 Mon Sep 17 00:00:00 2001
From: Hredhya <hredhya3107@gmail.com>
Date: Sat, 1 Apr 2023 18:10:30 -0400
Subject: [PATCH 095/111] feat(Hredhya) Add Progress Bar Component

---
 .../molecules/ProgressBar/ProgressBar.tsx     | 22 ++++++--
 .../ProgressBar/StyledProgressBar.ts          | 53 +++++++++++++++++--
 2 files changed, 69 insertions(+), 6 deletions(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
index d18721c18..793c41d43 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -1,9 +1,25 @@
 import * as React from 'react';
+import Icon from '../../../assets/icons/rawSvg/check-circle.svg';
+import {
+  Wrapper,
+  Progress,
+  CheckIcon,
+  PercentageWrapper,
+  Percentage,
+} from './StyledProgressBar';
 import type { ProgressBarProps } from '.';
-import { Wrapper } from './StyledProgressBar';
 
 const ProgressBar: React.FC<ProgressBarProps> = (props) => {
-  return <Wrapper>{props.percentage}%</Wrapper>;
+  return (
+    <Wrapper percentage={props.percentage}>
+      <Progress percentage={props.percentage} />
+      <PercentageWrapper>
+        <Percentage percentage={props.percentage}>
+          {props.percentage}%
+        </Percentage>
+        {props.percentage === 100 && <CheckIcon src={Icon} />}
+      </PercentageWrapper>
+    </Wrapper>
+  );
 };
-
 export default ProgressBar;
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index 4320431f4..ef1823c89 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -1,7 +1,54 @@
-import { radiusStyles } from '../../atoms/Radius';
+import type { DefaultTheme } from 'styled-components';
 import styled from 'styled-components';
+import { radiusStyles } from '../../atoms/Radius';
+import type { ProgressBarProps } from '.';
 
-export const Wrapper = styled.div`
-  background-color: ${({ theme }) => theme.colors.NOTIFICATION};
+const getColor = (percentage: number, theme: DefaultTheme) => {
+  return percentage === 100 ? theme.colors.SUCCESS : theme.colors.NOTIFICATION;
+};
+
+export const Wrapper = styled.div<ProgressBarProps>`
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  position: relative;
+  ${radiusStyles['radius300']};
+  height: 26px;
+  width: 320px;
+  top: 36px;
+  background-color: ${({ theme }) => theme.colors.GREYSCALE_OFF_WHITE};
+  border: 2px solid ${({ percentage, theme }) => getColor(percentage, theme)};
+`;
+export const Progress = styled.div<ProgressBarProps>`
+  box-sizing: border-box;
+  border: 2px solid ${({ percentage, theme }) => getColor(percentage, theme)};
+  background-color: ${({ percentage, theme }) => getColor(percentage, theme)};
   ${radiusStyles['radius300']};
+  height: 26px;
+  // top: 36px;
+  width: ${(props) => props.percentage}%;
+`;
+export const PercentageWrapper = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  position: absolute;
+  top: -26px;
+  width: 100%;
+  gap: 12px;
+`;
+export const Percentage = styled.span<ProgressBarProps>`
+  font-family: 'Nunito Sans';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 16px;
+  line-height: 24px;
+  color: ${({ percentage, theme }) => getColor(percentage, theme)};
+  width: 35px;
+  height: 24px;
+`;
+export const CheckIcon = styled.img`
+  width: 20px;
+  height: 20px;
 `;

From fd7dc939d2cb7ab1687bd4b3df5d2c1daa18160b Mon Sep 17 00:00:00 2001
From: Hredhya <hredhya3107@gmail.com>
Date: Mon, 10 Apr 2023 21:58:11 -0400
Subject: [PATCH 096/111] set min and max percentage value and set min width as
 5% for inner bar

---
 .../components/molecules/ProgressBar/ProgressBar.tsx | 12 +++++++-----
 .../molecules/ProgressBar/StyledProgressBar.ts       |  5 +++--
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
index 793c41d43..64d73be49 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -10,14 +10,16 @@ import {
 import type { ProgressBarProps } from '.';
 
 const ProgressBar: React.FC<ProgressBarProps> = (props) => {
+  // Check if percentage is less than 0 or greater than 100, set it to 0 or 100 respectively
+  const percentage = Math.max(0, Math.min(100, props.percentage));
   return (
-    <Wrapper percentage={props.percentage}>
-      <Progress percentage={props.percentage} />
+    <Wrapper percentage={percentage}>
+      <Progress percentage={percentage} />
       <PercentageWrapper>
-        <Percentage percentage={props.percentage}>
-          {props.percentage}%
+        <Percentage percentage={percentage}>
+          {percentage}%
         </Percentage>
-        {props.percentage === 100 && <CheckIcon src={Icon} />}
+        {percentage === 100 && <CheckIcon src={Icon} />}
       </PercentageWrapper>
     </Wrapper>
   );
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index ef1823c89..af6cf0e7e 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -26,8 +26,9 @@ export const Progress = styled.div<ProgressBarProps>`
   background-color: ${({ percentage, theme }) => getColor(percentage, theme)};
   ${radiusStyles['radius300']};
   height: 26px;
-  // top: 36px;
-  width: ${(props) => props.percentage}%;
+  width: ${(props) => (props.percentage < 5 ? '5%' : `${props.percentage}%`)};
+  // Set a minimum width of 5% when percentage is less than 5
+  min-width: 5%;
 `;
 export const PercentageWrapper = styled.div`
   display: flex;

From 55ab98d4dfcb64c34464b00081a3566140199a2e Mon Sep 17 00:00:00 2001
From: Hredhya <hredhya3107@gmail.com>
Date: Tue, 11 Apr 2023 21:41:00 -0400
Subject: [PATCH 097/111] Set a min width of 5% when percentage is less than 5
 and make it invisible at 0 percentage

---
 .../components/molecules/ProgressBar/ProgressBar.tsx  |  4 +---
 .../molecules/ProgressBar/StyledProgressBar.ts        | 11 ++++++++---
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
index 64d73be49..dfb5247cb 100644
--- a/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
+++ b/packages/UI/src/components/molecules/ProgressBar/ProgressBar.tsx
@@ -16,9 +16,7 @@ const ProgressBar: React.FC<ProgressBarProps> = (props) => {
     <Wrapper percentage={percentage}>
       <Progress percentage={percentage} />
       <PercentageWrapper>
-        <Percentage percentage={percentage}>
-          {percentage}%
-        </Percentage>
+        <Percentage percentage={percentage}>{percentage}%</Percentage>
         {percentage === 100 && <CheckIcon src={Icon} />}
       </PercentageWrapper>
     </Wrapper>
diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index af6cf0e7e..f7656dc95 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -26,9 +26,14 @@ export const Progress = styled.div<ProgressBarProps>`
   background-color: ${({ percentage, theme }) => getColor(percentage, theme)};
   ${radiusStyles['radius300']};
   height: 26px;
-  width: ${(props) => (props.percentage < 5 ? '5%' : `${props.percentage}%`)};
-  // Set a minimum width of 5% when percentage is less than 5
-  min-width: 5%;
+  // Set a min width of 5% when percentage is less than 5 and make it invisible at 0 percentage
+  width: ${(props) =>
+    props.percentage === 0
+      ? '0%'
+      : props.percentage < 5
+      ? '5%'
+      : `${props.percentage}%`};
+  opacity: ${(props) => (props.percentage === 0 ? '0' : '1')};
 `;
 export const PercentageWrapper = styled.div`
   display: flex;

From b1ae2d7a989b24201e02db0cb5bdbfd88df67c4f Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sat, 25 Mar 2023 16:12:05 -0500
Subject: [PATCH 098/111] change it back to css in FormField.tsx

---
 packages/UI/src/components/organisms/FormField/FormField.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/FormField/FormField.tsx b/packages/UI/src/components/organisms/FormField/FormField.tsx
index 3ce5ca38d..7fa204662 100644
--- a/packages/UI/src/components/organisms/FormField/FormField.tsx
+++ b/packages/UI/src/components/organisms/FormField/FormField.tsx
@@ -26,7 +26,7 @@ function FormField({
     <>
       <Label htmlFor={id}>
         <Typography type="label">
-          {label} {required && <span style={{ color: 'red' }}>*</span>}
+          {label} {required && <span css={{ color: 'red' }}>*</span>}
         </Typography>
         <InputWrapper>
           <Input

From 0d70e559f2ea257e9dfb7f23c017aaa1048c6d9c Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 11:58:26 -0500
Subject: [PATCH 099/111] triggering another hook.

---
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx        | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0d69a488a..0ef0e1d4f 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,7 +6,6 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
-
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From e1ae396d9ec968943e168cce272d3d4cd454cc94 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 12:06:16 -0500
Subject: [PATCH 100/111] one more try

---
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx        | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 639308959aa82e1b3c3d46ff2104d8fb72c320ec Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Wed, 5 Apr 2023 12:18:31 -0500
Subject: [PATCH 101/111] once again.

---
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx        | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0d69a488a..0ef0e1d4f 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,7 +6,6 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
-
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From 9e8998e074203cc1e0798053ac075b343f5f33b4 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Thu, 6 Apr 2023 09:57:51 -0500
Subject: [PATCH 102/111] test

---
 .../organisms/cards/ProductCardLarge/ProductCardLarge.tsx        | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
index 0ef0e1d4f..0d69a488a 100644
--- a/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
+++ b/packages/UI/src/components/organisms/cards/ProductCardLarge/ProductCardLarge.tsx
@@ -6,6 +6,7 @@ import { typographyStyles } from '../../../atoms/Typography';
 import { LikeButton, SaveButton, ShareButton } from '../../../molecules';
 import { CardDescription } from '../StyledCommonComponents';
 import type { ProductProps } from '.';
+
 const ProductCardLarge = ({
   socialButton,
   defaultButton,

From bcdfcd5839cf1c2921dcd1daf198849d0b9452cd Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:22:06 -0500
Subject: [PATCH 103/111] Changing branch name output.

---
 .github/workflows/discord-webhook.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 01f08d8ec..ca570c03d 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -12,6 +12,7 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       branch: ${{ steps.extract_branch.outputs.branch }}
+      BRANCH_NAME: ${{ github.base_ref ||  }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
       - name: Checkout

From 395704a91d4583313c7446a3fb9adc70b9f9ee66 Mon Sep 17 00:00:00 2001
From: mfvil <rarefyev@gmail.com>
Date: Sun, 16 Apr 2023 14:22:58 -0500
Subject: [PATCH 104/111] Fixing error

---
 .github/workflows/discord-webhook.yml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index ca570c03d..01f08d8ec 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -12,7 +12,6 @@ jobs:
       buildUrl: ${{ steps.chromatic.outputs.buildUrl }}
       storybookUrl: ${{ steps.chromatic.outputs.storybookUrl }}
       branch: ${{ steps.extract_branch.outputs.branch }}
-      BRANCH_NAME: ${{ github.base_ref ||  }}
       pr_number: ${{ steps.extract_pr_number.outputs.pr_number }}
     steps:
       - name: Checkout

From 6540acb1a8e6794764843cc757bb28daf1d68878 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sun, 16 Apr 2023 22:40:48 +0300
Subject: [PATCH 105/111] Extract head branch name from GITHUB_REF step

---
 .github/workflows/discord-webhook.yml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/.github/workflows/discord-webhook.yml b/.github/workflows/discord-webhook.yml
index 01f08d8ec..6d56f5a67 100644
--- a/.github/workflows/discord-webhook.yml
+++ b/.github/workflows/discord-webhook.yml
@@ -20,7 +20,6 @@ jobs:
         shell: bash
         run:  echo "branch=$(echo "${{ github.event.pull_request.head.ref }}" | tr / -)" >> $GITHUB_OUTPUT
         id: extract_branch
-
       - name: Extract PR number
         shell: bash
         run: echo "pr_number=$(echo "$GITHUB_REF" | awk -F / '{print $3}')" >> $GITHUB_OUTPUT

From 60f3170c8a0037c744bd39e57d0277c3ef758bbe Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sun, 12 Mar 2023 14:43:37 -0500
Subject: [PATCH 106/111] feat(alicefate): change OpenResponse, FormField

---
 packages/UI/src/components/organisms/FormField/FormField.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/FormField/FormField.tsx b/packages/UI/src/components/organisms/FormField/FormField.tsx
index 7fa204662..3ce5ca38d 100644
--- a/packages/UI/src/components/organisms/FormField/FormField.tsx
+++ b/packages/UI/src/components/organisms/FormField/FormField.tsx
@@ -26,7 +26,7 @@ function FormField({
     <>
       <Label htmlFor={id}>
         <Typography type="label">
-          {label} {required && <span css={{ color: 'red' }}>*</span>}
+          {label} {required && <span style={{ color: 'red' }}>*</span>}
         </Typography>
         <InputWrapper>
           <Input

From 9063aa42276ec3c7020b967ab4965eaa6212cb4f Mon Sep 17 00:00:00 2001
From: Iris <2300018151@qq.com>
Date: Sat, 25 Mar 2023 16:12:05 -0500
Subject: [PATCH 107/111] change it back to css in FormField.tsx

---
 packages/UI/src/components/organisms/FormField/FormField.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/FormField/FormField.tsx b/packages/UI/src/components/organisms/FormField/FormField.tsx
index 3ce5ca38d..7fa204662 100644
--- a/packages/UI/src/components/organisms/FormField/FormField.tsx
+++ b/packages/UI/src/components/organisms/FormField/FormField.tsx
@@ -26,7 +26,7 @@ function FormField({
     <>
       <Label htmlFor={id}>
         <Typography type="label">
-          {label} {required && <span style={{ color: 'red' }}>*</span>}
+          {label} {required && <span css={{ color: 'red' }}>*</span>}
         </Typography>
         <InputWrapper>
           <Input

From dc8cf896746ec3d1646f7c90004a5e27cdec5224 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Tue, 25 Apr 2023 08:28:02 +0300
Subject: [PATCH 108/111] remove dynamic picture to reduce snapshot usage

---
 .../organisms/cards/PositionCard/PositionCard.stories.tsx       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/UI/src/components/organisms/cards/PositionCard/PositionCard.stories.tsx b/packages/UI/src/components/organisms/cards/PositionCard/PositionCard.stories.tsx
index df9437b95..2f4cfe2db 100644
--- a/packages/UI/src/components/organisms/cards/PositionCard/PositionCard.stories.tsx
+++ b/packages/UI/src/components/organisms/cards/PositionCard/PositionCard.stories.tsx
@@ -14,7 +14,7 @@ const content = {
   title: 'Web Developer',
   level: 'junior',
   timeCommittment: '5 hrs per week',
-  imgUrl: 'https://picsum.photos/200/300',
+  imgUrl: 'https://images.unsplash.com/photo-1573335553610-a871dfd95bf5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1035&q=80',
   role: ' We are looking for a junior web developer who is willing and eagerto learn various web technologies mainly in the field of React while working within a team of ambitious developers! Our goal is to designa platform that brings people of from a diverse range of specialties together to collaboratively design the best possible software solutions. This project provides a space for people to establish and develop their ideas into working projects with input from others.',
   tags: ['unity', 'react', 'social', 'agile', 'digital media'],
   benifits: [

From f4323a9f0fd7482450c24c225f528a4b58dc45c0 Mon Sep 17 00:00:00 2001
From: Enjoy2Live <iMohammedMaqbol@gmail.com>
Date: Sat, 29 Apr 2023 15:41:26 +0300
Subject: [PATCH 109/111] fix percentage text going off bounds

---
 .../src/components/molecules/ProgressBar/StyledProgressBar.ts   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
index 2b212a73d..31ddc0e92 100644
--- a/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
+++ b/packages/UI/src/components/molecules/ProgressBar/StyledProgressBar.ts
@@ -39,7 +39,7 @@ export const PercentageWrapper = styled.div`
   align-items: center;
   justify-content: flex-end;
   position: absolute;
-  top: -26px;
+  bottom: 88%;
   width: 100%;
   gap: 12px;
 `;

From c14d3c2ebf4b844a06c96b9102b11518a7768aa5 Mon Sep 17 00:00:00 2001
From: Roman Arefyev <rarefyev@gmail.com>
Date: Sat, 20 May 2023 13:38:08 -0500
Subject: [PATCH 110/111] Roman/export-types: Exporting all components. (#1051)

* Roman/export-types: Exporting various compnents.

* Roman/export-types: removing the header export.

* exporting common components in the index file.

* Trying something else to fix the import issue with framer motion.

* Roman/export-types: Downgrading framer-motion.

---------

Co-authored-by: Enjoy2Live <iMohammedMaqbol@gmail.com>
---
 packages/UI/package.json                      |  2 +-
 packages/UI/src/components/atoms/index.ts     |  4 +
 packages/UI/src/components/molecules/index.ts |  1 +
 .../cards/StyledCommonComponents.tsx          |  2 +-
 packages/UI/src/components/organisms/index.ts |  7 ++
 yarn.lock                                     | 76 ++++++++++++++-----
 6 files changed, 69 insertions(+), 23 deletions(-)

diff --git a/packages/UI/package.json b/packages/UI/package.json
index b12f03e46..74ffe6780 100644
--- a/packages/UI/package.json
+++ b/packages/UI/package.json
@@ -10,7 +10,7 @@
     "babel-loader": "8.2.5",
     "constate": "^3.3.2",
     "formik": "2.2.9",
-    "framer-motion": "8.4.3",
+    "framer-motion": "6.5.1",
     "next": "^12.2.3",
     "polished": "^4.2.2",
     "react": "^17.0.2",
diff --git a/packages/UI/src/components/atoms/index.ts b/packages/UI/src/components/atoms/index.ts
index 10f97d9cd..e6b887837 100644
--- a/packages/UI/src/components/atoms/index.ts
+++ b/packages/UI/src/components/atoms/index.ts
@@ -7,5 +7,9 @@ export { default as Button } from './Button';
 export { default as Checkbox } from './Checkbox';
 export { default as Link } from './Link';
 export { default as Tag } from './Tags';
+export { default as NavLink } from './NavLink';
+export { default as Overlay } from './Overlay';
+export { default as Radio } from './Radio';
+export { default as Tooltip } from './Tooltip';
 export { radiusStyles } from './Radius';
 export { default as BaseLayer } from './BaseLayer';
diff --git a/packages/UI/src/components/molecules/index.ts b/packages/UI/src/components/molecules/index.ts
index adc4cfb88..dba99d3a2 100644
--- a/packages/UI/src/components/molecules/index.ts
+++ b/packages/UI/src/components/molecules/index.ts
@@ -3,3 +3,4 @@ export { default as BackButton } from './BackButton';
 export { default as ShareButton } from './InteractionButtons/ShareButton';
 export { default as LikeButton } from './InteractionButtons/LikeButton';
 export { default as SaveButton } from './InteractionButtons/SaveButton';
+export { default as SocialIconButton } from './SocialIconButton';
diff --git a/packages/UI/src/components/organisms/cards/StyledCommonComponents.tsx b/packages/UI/src/components/organisms/cards/StyledCommonComponents.tsx
index f151df454..0dc0ed1dd 100644
--- a/packages/UI/src/components/organisms/cards/StyledCommonComponents.tsx
+++ b/packages/UI/src/components/organisms/cards/StyledCommonComponents.tsx
@@ -1,5 +1,5 @@
 import { motion, LazyMotion, domAnimation } from 'framer-motion';
-import { useState, useRef, useLayoutEffect } from 'react';
+import React, { useState, useRef, useLayoutEffect } from 'react';
 import Box from '../../atoms/Box';
 import Tags from '../../atoms/Tags';
 import Typography from '../../atoms/Typography';
diff --git a/packages/UI/src/components/organisms/index.ts b/packages/UI/src/components/organisms/index.ts
index 49e91155a..343ac8785 100644
--- a/packages/UI/src/components/organisms/index.ts
+++ b/packages/UI/src/components/organisms/index.ts
@@ -2,3 +2,10 @@ export { default as FormField } from './FormField';
 export { default as OpenResponse } from './OpenResponse';
 export { default as Footer } from './Footer';
 export { default as Navigation } from './Navigation';
+export { default as PositionCard } from './cards/PositionCard';
+export { default as ProductCardLarge } from './cards/ProductCardLarge';
+export { default as ProductCardLong } from './cards/ProductCardLong';
+export { default as UserCard } from './cards/UserCard';
+export { TagsContainer } from './cards/StyledCommonComponents';
+export { CardDescription } from './cards/StyledCommonComponents';
+export { ExpandableBlurb } from './cards/StyledCommonComponents';
diff --git a/yarn.lock b/yarn.lock
index 534b18599..be77045f2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2527,7 +2527,7 @@ __metadata:
     eslint-plugin-react-hooks: 4.6.0
     eslint-plugin-testing-library: 5.6.0
     formik: 2.2.9
-    framer-motion: 8.4.3
+    framer-motion: 6.5.1
     jest: ^27.0.6
     next: ^12.2.3
     npm-run-all: 4.1.5
@@ -4403,7 +4403,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@motionone/animation@npm:^10.15.1":
+"@motionone/animation@npm:^10.12.0":
   version: 10.15.1
   resolution: "@motionone/animation@npm:10.15.1"
   dependencies:
@@ -4415,17 +4415,17 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@motionone/dom@npm:^10.15.3":
-  version: 10.15.5
-  resolution: "@motionone/dom@npm:10.15.5"
+"@motionone/dom@npm:10.12.0":
+  version: 10.12.0
+  resolution: "@motionone/dom@npm:10.12.0"
   dependencies:
-    "@motionone/animation": ^10.15.1
-    "@motionone/generators": ^10.15.1
-    "@motionone/types": ^10.15.1
-    "@motionone/utils": ^10.15.1
+    "@motionone/animation": ^10.12.0
+    "@motionone/generators": ^10.12.0
+    "@motionone/types": ^10.12.0
+    "@motionone/utils": ^10.12.0
     hey-listen: ^1.0.8
     tslib: ^2.3.1
-  checksum: 2453fe3df6a2b4b339d075bcd598bda1eee1926ba0ad881edfd154362b0992c91f31c08d83c469c7e8cb8bf8ebc0ed5530972673cf5c74d99e46e3772cf5f1cb
+  checksum: 123356f28e44362c4f081aae3df22e576f46bfcb07e01257b2ac64a115668448f29b8de67e4b6e692c5407cffb78ffe7cf9fa1bc064007482bab5dd23a69d380
   languageName: node
   linkType: hard
 
@@ -4439,7 +4439,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@motionone/generators@npm:^10.15.1":
+"@motionone/generators@npm:^10.12.0":
   version: 10.15.1
   resolution: "@motionone/generators@npm:10.15.1"
   dependencies:
@@ -4450,14 +4450,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@motionone/types@npm:^10.15.1":
+"@motionone/types@npm:^10.12.0, @motionone/types@npm:^10.15.1":
   version: 10.15.1
   resolution: "@motionone/types@npm:10.15.1"
   checksum: 98091f7dca257508d94d1080678c433da39a814e8e58aaa742212bf6c2a5b5e2120a6251a06e3ea522219ce6d1b6eb6aa2cab224b803fe52789033d8398ef0aa
   languageName: node
   linkType: hard
 
-"@motionone/utils@npm:^10.15.1":
+"@motionone/utils@npm:^10.12.0, @motionone/utils@npm:^10.15.1":
   version: 10.15.1
   resolution: "@motionone/utils@npm:10.15.1"
   dependencies:
@@ -17375,21 +17375,33 @@ __metadata:
   languageName: node
   linkType: hard
 
-"framer-motion@npm:8.4.3":
-  version: 8.4.3
-  resolution: "framer-motion@npm:8.4.3"
+"framer-motion@npm:6.5.1":
+  version: 6.5.1
+  resolution: "framer-motion@npm:6.5.1"
   dependencies:
     "@emotion/is-prop-valid": ^0.8.2
-    "@motionone/dom": ^10.15.3
+    "@motionone/dom": 10.12.0
+    framesync: 6.0.1
     hey-listen: ^1.0.8
-    tslib: ^2.4.0
+    popmotion: 11.0.3
+    style-value-types: 5.0.0
+    tslib: ^2.1.0
   peerDependencies:
-    react: ^18.0.0
-    react-dom: ^18.0.0
+    react: ">=16.8 || ^17.0.0 || ^18.0.0"
+    react-dom: ">=16.8 || ^17.0.0 || ^18.0.0"
   dependenciesMeta:
     "@emotion/is-prop-valid":
       optional: true
-  checksum: 5b350f0afb6e6e8482519c3ea685911d80c2fecaff3d8dd57d11b43a3e1f44d45e932312afe54ec349c6be849a94efc66671663e7d6a8d22d334afe3dc721226
+  checksum: 737959063137b4ccafe01e0ac0c9e5a9531bf3f729f62c34ca7a5d7955e6664f70affd22b044f7db51df41acb21d120a4f71a860e17a80c4db766ad66f2153a1
+  languageName: node
+  linkType: hard
+
+"framesync@npm:6.0.1":
+  version: 6.0.1
+  resolution: "framesync@npm:6.0.1"
+  dependencies:
+    tslib: ^2.1.0
+  checksum: a23ebe8f7e20a32c0b99c2f8175b6f07af3ec6316aad52a2316316a6d011d717af8d2175dcc2827031c59fabb30232ed3e19a720a373caba7f070e1eae436325
   languageName: node
   linkType: hard
 
@@ -26972,6 +26984,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"popmotion@npm:11.0.3":
+  version: 11.0.3
+  resolution: "popmotion@npm:11.0.3"
+  dependencies:
+    framesync: 6.0.1
+    hey-listen: ^1.0.8
+    style-value-types: 5.0.0
+    tslib: ^2.1.0
+  checksum: 9fe7d03b4ec0e85bfb9dadc23b745147bfe42e16f466ba06e6327197d0e38b72015afc2f918a8051dedc3680310417f346ffdc463be6518e2e92e98f48e30268
+  languageName: node
+  linkType: hard
+
 "popper.js@npm:1.16.1-lts":
   version: 1.16.1-lts
   resolution: "popper.js@npm:1.16.1-lts"
@@ -32979,6 +33003,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"style-value-types@npm:5.0.0":
+  version: 5.0.0
+  resolution: "style-value-types@npm:5.0.0"
+  dependencies:
+    hey-listen: ^1.0.8
+    tslib: ^2.1.0
+  checksum: 16d198302cd102edf9dba94e7752a2364c93b1eaa5cc7c32b42b28eef4af4ccb5149a3f16bc2a256adc02616a2404f4612bd15f3081c1e8ca06132cae78be6c0
+  languageName: node
+  linkType: hard
+
 "styled-components@npm:5.3.5":
   version: 5.3.5
   resolution: "styled-components@npm:5.3.5"

From f0d90eb05de1ba685631310b766c9db578d12276 Mon Sep 17 00:00:00 2001
From: Mohammed Maqbol <iMohammedMaqbol@gmail.com>
Date: Wed, 24 May 2023 00:25:44 +0300
Subject: [PATCH 111/111] created a staging area for user-profile app (#1137)

---
 .github/workflows/staging-apps.yaml | 29 +++++++++++++++++------------
 1 file changed, 17 insertions(+), 12 deletions(-)

diff --git a/.github/workflows/staging-apps.yaml b/.github/workflows/staging-apps.yaml
index 1bf238c29..5d83f47dd 100644
--- a/.github/workflows/staging-apps.yaml
+++ b/.github/workflows/staging-apps.yaml
@@ -11,6 +11,8 @@ on:
       - 'staging/projects[1-2]'
       - 'staging/website'
       - 'staging/website[1-2]'
+      - 'staging/user-profile'
+      - 'staging/user-profile[1-2]'
 
 jobs:
   Publish:
@@ -62,16 +64,19 @@ jobs:
 
 #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'
+#- 'ideaspace' => ideaspace.pages.dev
+#- 'ideaspace1' => ideaspace1.pages.dev
+#- 'ideaspace2' => ideaspace2.pages.dev
+#- 'recruitment' => recruitment-djw.pages.dev
+#- 'recruitment1' => recruitment1.pages.dev
+#- 'recruitment2' => recruitment2.pages.dev
+#- 'projects' => projects-2w7.pages.dev
+#- 'projects1' => projects1-1ut.pages.dev
+#- 'projects2' => projects2.pages.dev
+#- 'website' => website-386.pages.dev
+#- 'website1' => website1-c59.pages.dev
+#- 'website2' => website2-7s8.pages.dev
+#- 'user-profile' => user-profile-4zw.pages.dev
+#- 'user-profile1' => user-profile1.pages.dev
+#- 'user-profile2' => user-profile2.pages.dev
 #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