SHARE
TWEET

Untitled

a guest May 26th, 2019 63 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. const ProjectsGrid = (props: IProps) => {
  2.   const { projectsWithComments } = props;
  3.  
  4.   /**
  5.    * Collect all projects in a map by id for easy access
  6.    */
  7.   const projectsById: ProjectsById = projectsWithComments.reduce((acc, val) => {
  8.     acc[val.project.id] = val;
  9.     return acc;
  10.   }, {});
  11.  
  12.   /**
  13.    * Define React hooks for managing modals
  14.    */
  15.   const [
  16.     commentsOpenForProjectId,
  17.     setCommentsOpenForProjectId,
  18.   ] = React.useState(undefined as CommentsOpenState);
  19.  
  20.   const [projectDetailsOpenForId, setProjectDetailsOpenForId] = React.useState(
  21.     undefined as ProjectDetailsState
  22.   );
  23.  
  24.   const closeComment = () => setCommentsOpenForProjectId(undefined);
  25.   const closeDescription = () => setProjectDetailsOpenForId(undefined);
  26.  
  27.   const onOpenDescriptionForProjectId = (projectId: number) => async () => {
  28.     const detailedProjectResult = await getProject(projectId);
  29.     setProjectDetailsOpenForId({
  30.       details: detailedProjectResult,
  31.       id: projectId,
  32.     });
  33.   };
  34.  
  35.   const onOpenCommentsForProjectId = (projectId: number) => () =>
  36.     setCommentsOpenForProjectId(projectId);
  37.  
  38.   return (
  39.     <Grid
  40.       columns={{
  41.         count: 3,
  42.         size: "auto",
  43.       }}
  44.       gap="small"
  45.     >
  46.       {/* Project boxes */}
  47.       {projectsWithComments.map((projectWithComments, i) => (
  48.         <ProjectBox
  49.           project={projectWithComments.project}
  50.           onOpenDescription={onOpenDescriptionForProjectId(
  51.             projectWithComments.project.id
  52.           )}
  53.           onOpenComments={onOpenCommentsForProjectId(
  54.             projectWithComments.project.id
  55.           )}
  56.           key={`project_${i}`}
  57.         />
  58.       ))}
  59.       {/* Project details modal */}
  60.       {projectDetailsOpenForId && (
  61.         <DescriptionModal
  62.           projectAndComments={projectsById[projectDetailsOpenForId.id]}
  63.           details={projectDetailsOpenForId.details}
  64.           close={closeDescription}
  65.         />
  66.       )}
  67.       {/* Comments modal */}
  68.       {commentsOpenForProjectId && (
  69.         <CommentsOpenModal
  70.           projectAndComments={projectsById[commentsOpenForProjectId]}
  71.           closeComment={closeComment}
  72.         />
  73.       )}
  74.       )}
  75.     </Grid>
  76.   );
  77. };
  78.  
  79. export default ProjectsGrid;
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top