Merge pull request #1571 from dev-launchers/master

release
dev-launchers · Dec 10, 2023 · bf76776 · bf76776
2 parents 6826407 + 65656cf
commit bf76776
Show file tree

Hide file tree

Showing 31 changed files with 484 additions and 536 deletions.
diff --git a/apps/ideaspace/src/components/common/CommonStyles.js b/apps/ideaspace/src/components/common/CommonStyles.js
@@ -0,0 +1,26 @@
+import styled from "styled-components";
+
+export const HeadWapper = styled.div`
+  background-color: #FFFFFF;
+  padding: 6rem 1rem 4rem 1rem;
+  text-align: center;
+
+  @media (max-width: 1712px) {
+    padding: 3rem 1rem 2rem 1rem;
+  }
+
+  @media (max-width: 529px) {
+    padding: 5rem 1rem 1rem 1rem;
+  }
+`;
+
+export const Headline = styled.div`
+  font-family: 'Abel';
+  font-style: normal;
+  font-weight: 400;
+  font-size: 4rem;
+  line-height: 68px;
+  text-align: center;
+  letter-spacing: -0.02em;
+  color: #1C1C1C;
+`;
diff --git a/apps/ideaspace/src/components/common/IdeaCard/IdeaCard.js b/apps/ideaspace/src/components/common/IdeaCard/IdeaCard.js
@@ -7,18 +7,17 @@ import IdeaCardComment from './IdeaCardComment';
 import IdeaCardUpdated from './IdeaCardUpdated';
 import useConfirm from '../DialogBox/DialogBox';
 import { LikeButton } from '@devlaunchers/components/src/components/molecules';
-import {
-  useUserDataContext,
-} from '@devlaunchers/components/src/context/UserDataContext';
+import { useUserDataContext } from '@devlaunchers/components/context/UserDataContext';
 import { agent } from '@devlaunchers/utility';
+import SaveIdea from '../../modules/SaveIdea/SaveIdea';
 
 function IdeaCard({ cards, cardType }) {
   const [tagContent, setTagContent] = useState(cards.status);
   const [buttonContent, setButtonContent] = useState('');
   const [urlPath, setUrlPath] = useState('');
-  const [isFilled, setIsFilled] = useState(false);
   const [liked, setLiked] = useState(false);
-  const { userData, isAuthenticated } = useUserDataContext();
+  const { isAuthenticated, userData } = useUserDataContext();
+  const [savedCards, setSavedCards] = useState([]);
 
   const [UpdateFailure, confirmFailure] = useConfirm(
     ['Unable to reactivate your idea', '', ''],
@@ -64,18 +63,29 @@ function IdeaCard({ cards, cardType }) {
         borderRadius: '1rem',
       }}
     >
+
       <atoms.Box>
-        <IdeaCardTag status={tagContent} />
+        <IdeaCardTag
+          status={tagContent}
+        />
+        {isAuthenticated ? <SaveIdea 
+          savedCards={savedCards} 
+          setSavedCards={setSavedCards} 
+          id={cards.id} 
+          user={userData.id}/> : null}
       </atoms.Box>
 
-      <IdeaCardImg cardId={cards.id} cardImg={cards.imgSrc} />
+      <IdeaCardImg
+        cardId={cards.id}
+        cardImg={cards.imgSrc}
+      />
 
       <Link href={{ pathname: urlPath }}>
-        <atoms.Box
-          flexDirection="column"
-          alignItems="flex-start"
-          justifyContent="space-between"
-          padding="0rem 2rem 2rem"
+        <atoms.Box 
+          flexDirection='column' 
+          alignItems='flex-start' 
+          justifyContent='space-between'
+          padding='0rem 2rem 2rem' 
           style={{ maxWidth: '18.5rem' }}
         >
           <atoms.Typography
@@ -85,25 +95,28 @@ function IdeaCard({ cards, cardType }) {
             {cards.ideaName}
           </atoms.Typography>
 
-          <IdeaCardComment commentLength={cards.comments.length} />
-
-          <IdeaCardUpdated updatedAt={cards.updated_at} />
+          <atoms.Box alignItems='center' >
+            <atoms.Typography type='p' style={{ fontSize: '1rem', textAlign: 'left' }} />
+            <IdeaCardComment commentLength={cards.comments?.length} />
+          </atoms.Box>
+        <IdeaCardUpdated updatedAt={cards.mostRecentCommentTime} />
         </atoms.Box>
       </Link>
 
-      <atoms.Box padding="0rem 2rem 2rem">
+      {isAuthenticated ? <atoms.Box padding="0rem 2rem 2rem">
         <LikeButton
           onClick={() => setLiked((prev) => !prev)}
           filled={liked}
           text={liked ? 1 : ''}
-          disabled={isAuthenticated ? false : true}
         ></LikeButton>
       </atoms.Box>
+      : null}
+
 
-      {tagContent == 'archived' ? (
+      {tagContent == "archived" ? (
         <atoms.Button
-          buttonSize="standard"
-          buttonType="alternative"
+          buttonSize='standard'
+          buttonType='alternative'
           style={{ margin: '0rem 2rem 1.5rem' }}
           onClick={reactivateIdea}
         >
@@ -112,8 +125,8 @@ function IdeaCard({ cards, cardType }) {
       ) : (
         <Link href={{ pathname: urlPath }}>
           <atoms.Button
-            buttonSize="standard"
-            buttonType="alternative"
+            buttonSize='standard'
+            buttonType='alternative'
             style={{ margin: '0rem 2rem 1.5rem' }}
           >
             {buttonContent}

diff --git a/apps/ideaspace/src/components/common/IdeaCard/IdeaCardUpdated.js b/apps/ideaspace/src/components/common/IdeaCard/IdeaCardUpdated.js
@@ -58,10 +58,10 @@ const IdeaCardUpdated = ({
 
     return (
         <atoms.Box alignItems='center' style={{ marginTop: '0.5rem' }} >
-          <img alt='timeSvg' src={timeSvg} />
-          <atoms.Typography type='p'>
+        <img alt='timeSvg' src={timeSvg} />
+        <atoms.Typography type='p'>
             &nbsp;UPDATED:&nbsp;{updated}
-          </atoms.Typography>
+        </atoms.Typography>
         </atoms.Box>
     )
 };

diff --git a/apps/ideaspace/src/components/common/IdeaCard/StyledIdeaCard.js b/apps/ideaspace/src/components/common/IdeaCard/StyledIdeaCard.js
@@ -15,7 +15,7 @@ export const ImgButton = styled.button`
   cursor: pointer;
   border: 0 none;
   padding: 0;
-  margin-top: -1.9rem;
+  margin-top: -3rem;
   width: 22.5rem;
 `;
 
@@ -29,7 +29,7 @@ border-radius: 1rem;
 z-index: 1;
 position: relative;
 left: 1.5rem;
-top: 1.5rem;
+top: 1rem;
 padding: 0.2rem 0.5rem;
 
 font-family: 'Nunito Sans';

diff --git a/apps/ideaspace/src/components/common/IdeaForm/IdeaForm.js b/apps/ideaspace/src/components/common/IdeaForm/IdeaForm.js
@@ -81,7 +81,7 @@ const IdeaForm = ({
 								<Field
 									required
 									as={organisms.OpenResponse}
-									label='What is your idea?&nbsp;'
+									label='What Is Your Idea?&nbsp;'
 									placeholder='What is your product idea? Would it be helpful or fun? Who would use it and why?'
 									id='description'
 									name='description'
@@ -95,7 +95,7 @@ const IdeaForm = ({
 								<Field
 									required
 									as={organisms.OpenResponse}
-									label='Do you have any relevant experience in Development or design?&nbsp;'
+									label='Do You Have Any Relevant Experience in Development or Design?&nbsp;'
 									placeholder="If you have any relevant experience in development or design, please explain here. This information will be shared with Devlaunchers and won't be publicly shown in the workshopping page."
 									id='experience'
 									name='experience'
@@ -108,7 +108,7 @@ const IdeaForm = ({
 							<atoms.Box flexDirection='column'>
 								<Field
 									as={organisms.OpenResponse}
-									label='who do you think your idea is helpful to?'
+									label='Who Do You Think Your Idea is Helpful To?'
 									placeholder='Describe your audience, including their demographic information, technology experience, why they would be interested in your idea, etc.'
 									id='targetAudience'
 									name='targetAudience'
@@ -120,7 +120,7 @@ const IdeaForm = ({
 								<Field
 									required
 									as={organisms.OpenResponse}
-									label='What Features would your Product have?&nbsp;'
+									label='What Features Would Your Product Have?&nbsp;'
 									placeholder='A list of possible features your product could have.'
 									id='features'
 									name='features'
@@ -132,7 +132,7 @@ const IdeaForm = ({
 							</atoms.Box>
 							<Field
 								as={organisms.OpenResponse}
-								label='Anything else you would like to share with us?'
+								label='Anything Else You Would Like to Share With Us?'
 								placeholder='Want to share something else not listed above?'
 								id='extraInfo'
 								name='extraInfo'
@@ -141,15 +141,15 @@ const IdeaForm = ({
 							/>
 							<Field
 								as={organisms.FormField}
-								label='Do you have a catchy tagline for this idea submission?'
+								label='Do You Have a Catchy Tagline for This Idea Submission?'
 								placeholder='Your Tagline'
 								id='tagline'
 								name='tagline'
 							/>
 
 							<atoms.Box flexDirection='column'>
 								<atoms.Typography type='label' style={{ marginLeft: '1rem', marginBottom: '0.5rem' }}>
-									what level of involvement do you want to have after submission?<span style={{color:"red"}}>&nbsp;*</span>
+									What Level of Involvement Do You Want to Have After Submission?<span style={{color:"red"}}>&nbsp;*</span>
 								</atoms.Typography>
 								<atoms.Box flexDirection='row' alignItems='flex-end' justifyContent='space-between'>
 									<Field
@@ -159,6 +159,7 @@ const IdeaForm = ({
 										name="involveLevel" 
 										style={{ fontSize: '1rem', padding: '0.5rem', width: '95%' }}
 									>
+										<option value="" disabled>Select desired level of involvement</option>
 										<option value="none">I don't want to be involved after submitting</option>
 										<option value="minimum">I want to “own” this idea to help with workshopping and designing until it become a project</option>
 										<option value="medium">I want to “own” this idea and also be part of the development/design team when it becomes a project</option>
@@ -177,7 +178,7 @@ const IdeaForm = ({
 							</atoms.Box>
 
 							<atoms.Typography type='p'>
-								After submitting your idea will be reviewed and enter the workshopping stage!
+								After submitting your idea, it will be reviewed and enter the workshopping stage!
 							</atoms.Typography>
 
 							<atoms.Box style={{ fontSize: '1rem', alignItems:'center'}}>

diff --git a/apps/ideaspace/src/components/modules/BrowseIdeas/BrowseIdeas.js b/apps/ideaspace/src/components/modules/BrowseIdeas/BrowseIdeas.js
@@ -10,12 +10,11 @@ import useResponsive from '@devlaunchers/components/src/hooks/useResponsive';
 
 import {
   PageWrapper,
-  HeadWapper,
-  Headline,
   StyledRanbow,
   IdeaCardWrapper,
   FilterDiv,
 } from './StyledBrowseIdeas';
+import { HeadWapper, Headline } from '../../common/CommonStyles';
 
 function BrowseIdeas() {
   const [cards, setCards] = React.useState([]);
@@ -77,16 +76,19 @@ function BrowseIdeas() {
     const getCards = ideaCards.map((item) => {  
       if (item?.comments?.data) {
         item.comments = cleanDataList(item.comments.data);
+
+        const recentCommentedTime = item.comments.length > 0 ? new Date(
+          item.comments[0]?.updatedAt
+        ) :  new Date(item.updatedAt);
+
         return {
           ...item,
-          mostRecentCommentTime: new Date(
-            item.comments[0]?.updated_at
-          )?.getTime(),
+          mostRecentCommentTime: recentCommentedTime
         };
       }
       return {
         ...item,
-        mostRecentCommentTime: new Date()?.getTime(),
+        mostRecentCommentTime: new Date(item.updatedAt)?.getTime(),
       };
     });
 

diff --git a/apps/ideaspace/src/components/modules/BrowseIdeas/StyledBrowseIdeas.js b/apps/ideaspace/src/components/modules/BrowseIdeas/StyledBrowseIdeas.js
@@ -15,30 +15,6 @@ export const PageWrapper = styled.section`
   }
 `;
 
-export const HeadWapper = styled.div`
-  background-color: #FFFFFF;
-  padding: 6rem 1rem 4rem 1rem;
-
-  @media (max-width: 1712px) {
-    padding: 3rem 1rem 2rem 1rem;
-  }
-
-  @media (max-width: 529px) {
-    padding: 5rem 1rem 1rem 1rem;
-  }
-`;
-
-export const Headline = styled.div`
-  font-family: 'Abel';
-  font-style: normal;
-  font-weight: 400;
-  font-size: 4rem;
-  line-height: 68px;
-  text-align: center;
-  letter-spacing: -0.02em;
-  color: #1C1C1C;
-`;
-
 export const StyledRanbow = styled.div`
   margin: 1.3rem auto 0 auto;
   max-width: 21rem;

diff --git a/apps/ideaspace/src/components/modules/DashboardPage/DashboardPage.js b/apps/ideaspace/src/components/modules/DashboardPage/DashboardPage.js
@@ -17,14 +17,7 @@ import {
 
 function DashboardPage() {
 
-  let { userData, setUserData, isAuthenticated } = useUserDataContext();
-  if (process.env.NEXT_PUBLIC_NAME == 'DEVELOPMENT') {
-    isAuthenticated = true;
-
-    React.useEffect(() => {
-      setUserData({ ...userData, id: 2 });
-    }, []);
-  }
+  let { userData, isAuthenticated } = useUserDataContext();
 
   const [loading, setLoading] = React.useState(true);
   const [sourceCards, setSourceCards] = React.useState([]);
@@ -33,9 +26,9 @@ function DashboardPage() {
   React.useEffect(async () => {
     if (isAuthenticated) {
       const data = cleanDataList(await agent.Ideas.get(
-        new URLSearchParams(`populate=*`)));
+        new URLSearchParams(`populate=*pagination[pageSize]=1000`)));
 
-        const cards = data.map((item) => {
+        const allCards = data.map((item) => {
           item.comments = cleanDataList(item.comments.data);
           return {
             ...item,
@@ -46,7 +39,7 @@ function DashboardPage() {
         });
 
         setLoading(false);
-        setSourceCards(cards);
+        setSourceCards(allCards);
     }
   }, [isAuthenticated]);
 

diff --git a/apps/ideaspace/src/components/modules/EditIdea/EditIdea.js b/apps/ideaspace/src/components/modules/EditIdea/EditIdea.js
@@ -18,14 +18,7 @@ import {
 } from './StyledEditIdea';
 
 function EditIdea() {
-  let { userData, setUserData, isAuthenticated } = useUserDataContext();
-  if (process.env.NEXT_PUBLIC_NAME == 'DEVELOPMENT') {
-    isAuthenticated = true;
-
-    useEffect(() => {
-      setUserData({ ...userData, id: 30 });
-    }, []);
-  }
+  let { userData, isAuthenticated } = useUserDataContext();
 
   const router = useRouter();
   const { ideaId } = router.query;
@@ -157,7 +150,6 @@ function EditIdea() {
         return 'You have unsaved changes. Do you really want to leave?';
       }
     };
-
     if (unsavedChanges && urrl == '') {
       const routeChangeStart = (url) => {
         handleDialog(url);