From aab1ef1c3a422afe2587e8bb8b615fe9b2c6aa94 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Sun, 8 Sep 2024 13:21:50 +0700 Subject: [PATCH 01/21] feat: fixing date --- .../src/api/routes/posts.controller.ts | 3 +- .../components/launches/calendar.context.tsx | 3 +- .../src/components/launches/calendar.tsx | 88 +++++++++---------- .../launches/new.calendar.component.tsx | 2 - .../prisma/comments/comments.repository.ts | 3 +- .../prisma/comments/comments.service.ts | 4 +- .../database/prisma/posts/posts.repository.ts | 6 +- .../src/dtos/posts/get.posts.dto.ts | 4 - 8 files changed, 52 insertions(+), 61 deletions(-) diff --git a/apps/backend/src/api/routes/posts.controller.ts b/apps/backend/src/api/routes/posts.controller.ts index c13c614a..8814a6b0 100644 --- a/apps/backend/src/api/routes/posts.controller.ts +++ b/apps/backend/src/api/routes/posts.controller.ts @@ -53,8 +53,7 @@ export class PostsController { this._commentsService.getAllCommentsByWeekYear( org.id, query.year, - query.week, - query.isIsoWeek === 'true' + query.week ), ]); diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index 0105bda9..3d625ad8 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -109,8 +109,7 @@ export const CalendarWeekProvider: FC<{ const params = useMemo(() => { return new URLSearchParams({ week: filters.currentWeek.toString(), - year: filters.currentYear.toString(), - isIsoWeek: isIsoWeek.toString(), + year: filters.currentYear.toString() }).toString(); }, [filters]); diff --git a/apps/frontend/src/components/launches/calendar.tsx b/apps/frontend/src/components/launches/calendar.tsx index c24d4923..bdba443e 100644 --- a/apps/frontend/src/components/launches/calendar.tsx +++ b/apps/frontend/src/components/launches/calendar.tsx @@ -144,44 +144,44 @@ export const Calendar = () => { ); }; +// export const CalendarColumn: FC<{ day: number; hour: string }> = (props) => { +// const { day, hour } = props; +// const { currentWeek, currentYear } = useCalendar(); +// +// const getDate = useMemo(() => { +// const date = +// dayjs() +// .year(currentYear) +// .isoWeek(currentWeek) +// .isoWeekday(day) +// .format('YYYY-MM-DD') + +// 'T' + +// hour + +// ':00'; +// return dayjs(date); +// }, [currentWeek]); +// +// const isBeforeNow = useMemo(() => { +// return getDate.isBefore(dayjs()); +// }, [getDate]); +// +// const [ref, entry] = useIntersectionObserver({ +// threshold: 0.5, +// root: null, +// rootMargin: '0px', +// }); +// +// return ( +//
+// {!entry?.isIntersecting ? ( +//
+// ) : ( +// +// )} +//
+// ); +// }; export const CalendarColumn: FC<{ day: number; hour: string }> = (props) => { - const { day, hour } = props; - const { currentWeek, currentYear } = useCalendar(); - - const getDate = useMemo(() => { - const date = - dayjs() - .year(currentYear) - .isoWeek(currentWeek) - .isoWeekday(day) - .format('YYYY-MM-DD') + - 'T' + - hour + - ':00'; - return dayjs(date); - }, [currentWeek]); - - const isBeforeNow = useMemo(() => { - return getDate.isBefore(dayjs()); - }, [getDate]); - - const [ref, entry] = useIntersectionObserver({ - threshold: 0.5, - root: null, - rootMargin: '0px', - }); - - return ( -
- {!entry?.isIntersecting ? ( -
- ) : ( - - )} -
- ); -}; -const CalendarColumnRender: FC<{ day: number; hour: string }> = (props) => { const { day, hour } = props; const user = useUser(); const { @@ -201,12 +201,13 @@ const CalendarColumnRender: FC<{ day: number; hour: string }> = (props) => { const date = dayjs() .year(currentYear) - .isoWeek(currentWeek) - .isoWeekday(day) + .week(currentWeek) + .day(day + 1) .format('YYYY-MM-DD') + 'T' + hour + ':00'; + return dayjs(date); }, [currentWeek]); @@ -311,6 +312,7 @@ const CalendarColumnRender: FC<{ day: number; hour: string }> = (props) => { return previewPublication(post); } const data = await (await fetch(`/posts/${post.id}`)).json(); + const publishDate = dayjs.utc(data.posts[0].publishDate).local(); modal.openModal({ closeOnClickOutside: false, @@ -327,7 +329,7 @@ const CalendarColumnRender: FC<{ day: number; hour: string }> = (props) => { .slice(0) .filter((f) => f.id === data.integration) .map((p) => ({ ...p, picture: data.integrationPicture }))} - date={getDate} + date={publishDate} /> ), @@ -361,7 +363,7 @@ const CalendarColumnRender: FC<{ day: number; hour: string }> = (props) => { const addProvider = useAddProvider(); return ( -
+
= (props) => { 'data-tooltip-content': 'Predicted GitHub Trending Change', } : {})} - ref={drop} className={clsx( - 'flex-col flex-1 text-[12px] pointer w-full overflow-hidden justify-center overflow-x-auto flex scrollbar scrollbar-thumb-tableBorder scrollbar-track-secondary', + 'flex-col flex-1 text-[12px] pointer w-full cursor-pointer overflow-hidden justify-center overflow-x-auto flex scrollbar scrollbar-thumb-tableBorder scrollbar-track-secondary', isBeforeNow && 'bg-customColor23', - canDrop && 'bg-white/80', canBeTrending && 'bg-customColor24' )} > diff --git a/apps/frontend/src/components/launches/new.calendar.component.tsx b/apps/frontend/src/components/launches/new.calendar.component.tsx index 63dae17f..720443d6 100644 --- a/apps/frontend/src/components/launches/new.calendar.component.tsx +++ b/apps/frontend/src/components/launches/new.calendar.component.tsx @@ -1,6 +1,4 @@ 'use client'; -import { ChevronLeft, ChevronRight, Plus } from 'lucide-react'; -import { Button } from '@gitroom/react/form/button'; import { Fragment } from 'react'; import { CalendarColumn } from '@gitroom/frontend/components/launches/calendar'; import { DNDProvider } from '@gitroom/frontend/components/launches/helpers/dnd.provider'; diff --git a/libraries/nestjs-libraries/src/database/prisma/comments/comments.repository.ts b/libraries/nestjs-libraries/src/database/prisma/comments/comments.repository.ts index 58230c0c..655ed7a8 100644 --- a/libraries/nestjs-libraries/src/database/prisma/comments/comments.repository.ts +++ b/libraries/nestjs-libraries/src/database/prisma/comments/comments.repository.ts @@ -116,10 +116,9 @@ export class CommentsRepository { orgId: string, year: number, week: number, - isIsoWeek: boolean ) { const dateYear = dayjs().year(year); - const date = isIsoWeek ? dateYear.isoWeek(week) : dateYear.week(week); + const date = dateYear.isoWeek(week); const startDate = date.startOf('isoWeek').subtract(2, 'days').toDate(); const endDate = date.endOf('isoWeek').add(2, 'days').toDate(); diff --git a/libraries/nestjs-libraries/src/database/prisma/comments/comments.service.ts b/libraries/nestjs-libraries/src/database/prisma/comments/comments.service.ts index 85b4c755..7882a01e 100644 --- a/libraries/nestjs-libraries/src/database/prisma/comments/comments.service.ts +++ b/libraries/nestjs-libraries/src/database/prisma/comments/comments.service.ts @@ -44,7 +44,7 @@ export class CommentsService { ); } - getAllCommentsByWeekYear(orgId: string, year: number, week: number, isIsoWeek: boolean) { - return this._commentsRepository.getAllCommentsByWeekYear(orgId, year, week, isIsoWeek); + getAllCommentsByWeekYear(orgId: string, year: number, week: number) { + return this._commentsRepository.getAllCommentsByWeekYear(orgId, year, week); } } diff --git a/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts b/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts index 70b86ed4..e5931498 100644 --- a/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts +++ b/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts @@ -64,10 +64,10 @@ export class PostsRepository { getPosts(orgId: string, query: GetPostsDto) { const dateYear = dayjs().year(query.year); - const date = query.isIsoWeek === 'true' ? dateYear.isoWeek(query.week) : dateYear.week(query.week); + const date = dateYear.isoWeek(query.week); - const startDate = date.startOf('week').subtract(2, 'days').toDate(); - const endDate = date.endOf('week').add(2, 'days').toDate(); + const startDate = date.startOf('isoWeek').subtract(2, 'days').toDate(); + const endDate = date.endOf('isoWeek').add(2, 'days').toDate(); return this._post.model.post.findMany({ where: { diff --git a/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts b/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts index 557f551d..4872a787 100644 --- a/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts +++ b/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts @@ -14,8 +14,4 @@ export class GetPostsDto { @Max(dayjs().add(10, 'year').year()) @Min(2022) year: number; - - @IsIn(['true', 'false']) - @IsString() - isIsoWeek: 'true' | 'false'; } From 9fb979687dc0ee43eeefb8cf228884f3e8abf543 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Sun, 8 Sep 2024 20:27:19 +0700 Subject: [PATCH 02/21] feat: month view --- .../src/api/routes/posts.controller.ts | 14 +- apps/frontend/src/app/colors.scss | 2 +- .../components/launches/add.edit.model.tsx | 3 - .../components/launches/calendar.context.tsx | 94 +++-- .../src/components/launches/calendar.tsx | 389 ++++++++---------- .../src/components/launches/filters.tsx | 141 ++++++- .../launches/launches.component.tsx | 8 +- .../launches/new.calendar.component.tsx | 54 --- .../database/prisma/posts/posts.repository.ts | 6 +- .../src/dtos/posts/get.posts.dto.ts | 10 +- 10 files changed, 381 insertions(+), 340 deletions(-) delete mode 100644 apps/frontend/src/components/launches/new.calendar.component.tsx diff --git a/apps/backend/src/api/routes/posts.controller.ts b/apps/backend/src/api/routes/posts.controller.ts index 8814a6b0..dccdd28c 100644 --- a/apps/backend/src/api/routes/posts.controller.ts +++ b/apps/backend/src/api/routes/posts.controller.ts @@ -48,18 +48,18 @@ export class PostsController { @GetOrgFromRequest() org: Organization, @Query() query: GetPostsDto ) { - const [posts, comments] = await Promise.all([ + const [posts] = await Promise.all([ this._postsService.getPosts(org.id, query), - this._commentsService.getAllCommentsByWeekYear( - org.id, - query.year, - query.week - ), + // this._commentsService.getAllCommentsByWeekYear( + // org.id, + // query.year, + // query.week + // ), ]); return { posts, - comments, + // comments, }; } diff --git a/apps/frontend/src/app/colors.scss b/apps/frontend/src/app/colors.scss index 0a3cf3ca..961de950 100644 --- a/apps/frontend/src/app/colors.scss +++ b/apps/frontend/src/app/colors.scss @@ -34,7 +34,7 @@ --color-custom20: #121b2c; --color-custom21: #506490; --color-custom22: #b91c1c; - --color-custom23: #06080d; + --color-custom23: #000000; --color-custom24: #eaff00; --color-custom25: #2e3336; --color-custom26: #1d9bf0; diff --git a/apps/frontend/src/components/launches/add.edit.model.tsx b/apps/frontend/src/components/launches/add.edit.model.tsx index f54a97c5..5bc20e65 100644 --- a/apps/frontend/src/components/launches/add.edit.model.tsx +++ b/apps/frontend/src/components/launches/add.edit.model.tsx @@ -12,7 +12,6 @@ import React, { import dayjs from 'dayjs'; import { Integrations } from '@gitroom/frontend/components/launches/calendar.context'; import clsx from 'clsx'; -import { commands } from '@uiw/react-md-editor'; import { usePreventWindowUnload } from '@gitroom/react/helpers/use.prevent.window.unload'; import { deleteDialog } from '@gitroom/react/helpers/delete.dialog'; import { useModals } from '@mantine/modals'; @@ -27,7 +26,6 @@ import { import { useFetch } from '@gitroom/helpers/utils/custom.fetch'; import { useMoveToIntegration } from '@gitroom/frontend/components/launches/helpers/use.move.to.integration'; import { useExistingData } from '@gitroom/frontend/components/launches/helpers/use.existing.data'; -import { newImage } from '@gitroom/frontend/components/launches/helpers/new.image.component'; import { MultiMediaComponent } from '@gitroom/frontend/components/media/media.component'; import { useExpend } from '@gitroom/frontend/components/launches/helpers/use.expend'; import { TopTitle } from '@gitroom/frontend/components/launches/helpers/top.title.component'; @@ -36,7 +34,6 @@ import { ProvidersOptions } from '@gitroom/frontend/components/launches/provider import { v4 as uuidv4 } from 'uuid'; import useSWR, { useSWRConfig } from 'swr'; import { useToaster } from '@gitroom/react/toaster/toaster'; -import { postSelector } from '@gitroom/frontend/components/post-url-selector/post.url.selector'; import { UpDownArrow } from '@gitroom/frontend/components/launches/up.down.arrow'; import { DatePicker } from '@gitroom/frontend/components/launches/helpers/date.picker'; import { arrayMoveImmutable } from 'array-move'; diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index 3d625ad8..5cb333b1 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -21,12 +21,23 @@ import { isGeneral } from '@gitroom/react/helpers/is.general'; const CalendarContext = createContext({ currentWeek: dayjs().week(), currentYear: dayjs().year(), + currentMonth: dayjs().month(), comments: [] as Array<{ date: string; total: number }>, integrations: [] as Integrations[], trendings: [] as string[], posts: [] as Array, - setFilters: (filters: { currentWeek: number; currentYear: number }) => {}, - changeDate: (id: string, date: dayjs.Dayjs) => {}, + display: 'week', + setFilters: (filters: { + currentWeek: number; + currentYear: number; + currentMonth: number; + display: 'week' | 'month'; + }) => { + /** empty **/ + }, + changeDate: (id: string, date: dayjs.Dayjs) => { + /** empty **/ + }, }); export interface Integrations { @@ -40,28 +51,21 @@ export interface Integrations { } function getWeekNumber(date: Date) { - // Copy date so don't modify original - const targetDate = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate())); - // Set to nearest Thursday: current date + 4 - current day number - // Make Sunday's day number 7 - targetDate.setUTCDate(targetDate.getUTCDate() + 4 - (targetDate.getUTCDay() || 7)); - // Get first day of year - const yearStart = new Date(Date.UTC(targetDate.getUTCFullYear(), 0, 1)); - // Calculate full weeks to nearest Thursday - return Math.ceil((((targetDate.getTime() - yearStart.getTime()) / 86400000) + 1) / 7); -} - -function isISOWeek(date: Date, weekNumber: number): boolean { - // Copy date so don't modify original - const targetDate = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate())); - // Set to nearest Thursday: current date + 4 - current day number - // Make Sunday's day number 7 - targetDate.setUTCDate(targetDate.getUTCDate() + 4 - (targetDate.getUTCDay() || 7)); - // Get first day of year - const yearStart = new Date(Date.UTC(targetDate.getUTCFullYear(), 0, 1)); - // Calculate full weeks to nearest Thursday - const isoWeekNo = Math.ceil((((targetDate.getTime() - yearStart.getTime()) / 86400000) + 1) / 7); - return isoWeekNo === weekNumber; + // Copy date so don't modify original + const targetDate = new Date( + Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()) + ); + // Set to nearest Thursday: current date + 4 - current day number + // Make Sunday's day number 7 + targetDate.setUTCDate( + targetDate.getUTCDate() + 4 - (targetDate.getUTCDay() || 7) + ); + // Get first day of year + const yearStart = new Date(Date.UTC(targetDate.getUTCFullYear(), 0, 1)); + // Calculate full weeks to nearest Thursday + return Math.ceil( + ((targetDate.getTime() - yearStart.getTime()) / 86400000 + 1) / 7 + ); } export const CalendarWeekProvider: FC<{ @@ -84,20 +88,32 @@ export const CalendarWeekProvider: FC<{ })(); }, []); + const display = searchParams.get('month') ? 'month' : 'week'; const [filters, setFilters] = useState({ - currentWeek: +(searchParams.get('week') || getWeekNumber(new Date())), + currentWeek: + display === 'week' + ? +(searchParams.get('week') || getWeekNumber(new Date())) + : 0, + currentMonth: + display === 'week' ? 0 : +(searchParams.get('month') || dayjs().month()), currentYear: +(searchParams.get('year') || dayjs().year()), + display, }); - const isIsoWeek = useMemo(() => { - return isISOWeek(new Date(), filters.currentWeek); - }, [filters]); - const setFiltersWrapper = useCallback( - (filters: { currentWeek: number; currentYear: number }) => { + (filters: { + currentWeek: number; + currentYear: number; + currentMonth: number; + display: 'week' | 'month'; + }) => { setFilters(filters); router.replace( - `/launches?week=${filters.currentWeek}&year=${filters.currentYear}` + `/launches?${ + filters.currentWeek + ? `week=${filters.currentWeek}` + : `month=${filters.currentMonth}` + }&year=${filters.currentYear}` ); setTimeout(() => { mutate('/posts'); @@ -107,14 +123,22 @@ export const CalendarWeekProvider: FC<{ ); const params = useMemo(() => { - return new URLSearchParams({ - week: filters.currentWeek.toString(), - year: filters.currentYear.toString() - }).toString(); + return new URLSearchParams( + filters.currentWeek + ? { + week: filters.currentWeek.toString(), + year: filters.currentYear.toString(), + } + : { + year: filters.currentYear.toString(), + month: (filters.currentMonth + 1).toString(), + } + ).toString(); }, [filters]); const loadData = useCallback( async (url: string) => { + setInternalData([]); const data = (await fetch(`${url}?${params}`)).json(); return data; }, diff --git a/apps/frontend/src/components/launches/calendar.tsx b/apps/frontend/src/components/launches/calendar.tsx index bdba443e..5a048898 100644 --- a/apps/frontend/src/components/launches/calendar.tsx +++ b/apps/frontend/src/components/launches/calendar.tsx @@ -1,6 +1,6 @@ 'use client'; -import React, { FC, useCallback, useMemo } from 'react'; +import React, { FC, Fragment, useCallback, useMemo } from 'react'; import { Integrations, useCalendar, @@ -17,14 +17,12 @@ import { Integration, Post, State } from '@prisma/client'; import { useAddProvider } from '@gitroom/frontend/components/launches/add.provider.component'; import { CommentComponent } from '@gitroom/frontend/components/launches/comments/comment.component'; import { useSWRConfig } from 'swr'; -import { useIntersectionObserver } from '@uidotdev/usehooks'; import { useToaster } from '@gitroom/react/toaster/toaster'; import { useUser } from '@gitroom/frontend/components/layout/user.context'; import { IntegrationContext } from '@gitroom/frontend/components/launches/helpers/use.integration'; import { PreviewPopup } from '@gitroom/frontend/components/marketplace/special.message'; export const days = [ - '', 'Monday', 'Tuesday', 'Wednesday', @@ -33,192 +31,143 @@ export const days = [ 'Saturday', 'Sunday', ]; -export const hours = [ - '00:00', - '01:00', - '02:00', - '03:00', - '04:00', - '05:00', - '06:00', - '07:00', - '08:00', - '09:00', - '10:00', - '11:00', - '12:00', - '13:00', - '14:00', - '15:00', - '16:00', - '17:00', - '18:00', - '19:00', - '20:00', - '21:00', - '22:00', - '23:00', -]; - -export const Calendar = () => { - const { currentWeek, currentYear, comments } = useCalendar(); +export const hours = Array.from({ length: 24 }, (_, i) => i); - const firstDay = useMemo(() => { - return dayjs().year(currentYear).isoWeek(currentWeek).isoWeekday(1); - }, [currentYear, currentWeek]); +export const WeekView = () => { + const { currentYear, currentWeek } = useCalendar(); return ( - -
-
+
+
+
+
{days.map((day, index) => (
-
{day}
-
- {day && `(${firstDay.add(index - 1, 'day').format('DD/MM')})`} -
+
{day}
))} - {hours.map((hour) => - days.map((day, index) => ( - <> - {index === 0 ? ( -
- {['00', '10', '20', '30', '40', '50'].map((num) => ( -
- {hour.split(':')[0] + ':' + num} -
- ))} -
- ) : ( -
- - dayjs - .utc(p.date) - .local() - .format('YYYY-MM-DD HH:mm') === - dayjs() - .isoWeek(currentWeek) - .isoWeekday(index + 1) - .hour(+hour.split(':')[0] - 1) - .minute(0) - .format('YYYY-MM-DD HH:mm') - )?.total || 0 - } - date={dayjs() - .isoWeek(currentWeek) - .isoWeekday(index + 1) - .hour(+hour.split(':')[0] - 1) - .minute(0)} + {hours.map((hour) => ( + +
+ {hour.toString().padStart(2, '0')}:00 +
+ {days.map((day, indexDay) => ( + +
+ - {['00', '10', '20', '30', '40', '50'].map((num) => ( - - ))}
- )} - - )) - )} + + ))} + + ))}
+
+ ); +}; + +export const MonthView = () => { + const { currentYear, currentMonth } = useCalendar(); + + const calendarDays = useMemo(() => { + const startOfMonth = dayjs(new Date(currentYear, currentMonth, 1)); + + // Calculate the day offset for Monday (isoWeekday() returns 1 for Monday) + const startDayOfWeek = startOfMonth.isoWeekday(); // 1 for Monday, 7 for Sunday + const daysBeforeMonth = startDayOfWeek - 1; // Days to show from the previous month + + // Get the start date (Monday of the first week that includes this month) + const startDate = startOfMonth.subtract(daysBeforeMonth, 'day'); + + // Create an array to hold the calendar days (6 weeks * 7 days = 42 days max) + const calendarDays = []; + let currentDay = startDate; + + for (let i = 0; i < 42; i++) { + let label = 'current-month'; + if (currentDay.month() < currentMonth) label = 'previous-month'; + if (currentDay.month() > currentMonth) label = 'next-month'; + + calendarDays.push({ + day: currentDay, + label, + }); + + // Move to the next day + currentDay = currentDay.add(1, 'day'); + } + + return calendarDays; + }, [currentYear, currentMonth]); + + return ( +
+
+
+ {days.map((day) => ( +
+
{day}
+
+ ))} + {calendarDays.map((date, index) => ( +
+ +
+ ))} +
+
+
+ ); +}; + +export const Calendar = () => { + const { display } = useCalendar(); + return ( + + {display === 'week' ? : } ); }; -// export const CalendarColumn: FC<{ day: number; hour: string }> = (props) => { -// const { day, hour } = props; -// const { currentWeek, currentYear } = useCalendar(); -// -// const getDate = useMemo(() => { -// const date = -// dayjs() -// .year(currentYear) -// .isoWeek(currentWeek) -// .isoWeekday(day) -// .format('YYYY-MM-DD') + -// 'T' + -// hour + -// ':00'; -// return dayjs(date); -// }, [currentWeek]); -// -// const isBeforeNow = useMemo(() => { -// return getDate.isBefore(dayjs()); -// }, [getDate]); -// -// const [ref, entry] = useIntersectionObserver({ -// threshold: 0.5, -// root: null, -// rootMargin: '0px', -// }); -// -// return ( -//
-// {!entry?.isIntersecting ? ( -//
-// ) : ( -// -// )} -//
-// ); -// }; -export const CalendarColumn: FC<{ day: number; hour: string }> = (props) => { - const { day, hour } = props; +export const CalendarColumn: FC<{ + getDate: dayjs.Dayjs; + randomHour?: boolean; +}> = (props) => { + const { getDate, randomHour } = props; const user = useUser(); - const { - currentWeek, - currentYear, - integrations, - posts, - trendings, - changeDate, - } = useCalendar(); + const { integrations, posts, trendings, changeDate, display } = useCalendar(); const toaster = useToaster(); const modal = useModals(); const fetch = useFetch(); - const getDate = useMemo(() => { - const date = - dayjs() - .year(currentYear) - .week(currentWeek) - .day(day + 1) - .format('YYYY-MM-DD') + - 'T' + - hour + - ':00'; - - return dayjs(date); - }, [currentWeek]); - const postList = useMemo(() => { return posts.filter((post) => { - return dayjs - .utc(post.publishDate) - .local() - .isBetween(getDate, getDate.add(59, 'minute'), 'minute', '[)'); + const pList = dayjs.utc(post.publishDate).local(); + return display === 'week' + ? pList.isBetween(getDate.startOf('hour'), getDate.endOf('hour')) + : pList.format('DD/MM/YYYY') === getDate.format('DD/MM/YYYY'); }); - }, [posts]); + }, [posts, display, getDate]); const canBeTrending = useMemo(() => { return !!trendings.find((trend) => { @@ -351,7 +300,9 @@ export const CalendarColumn: FC<{ day: number; hour: string }> = (props) => { children: ( ({ ...p }))} - date={getDate} + date={ + randomHour ? getDate.hour(Math.floor(Math.random() * 24)) : getDate + } reopenModal={() => ({})} /> ), @@ -363,70 +314,85 @@ export const CalendarColumn: FC<{ day: number; hour: string }> = (props) => { const addProvider = useAddProvider(); return ( -
+
+ {display === 'month' && ( +
+ {getDate.date()} +
+ )}
- {postList.map((post) => ( -
-
- +
+ {postList.map((post) => ( +
+
+ +
-
- ))} -
- {!isBeforeNow && ( -
-
+ ))} +
+ {!isBeforeNow && ( +
+ > +
+
-
- )} + )} +
); }; const CalendarItem: FC<{ date: dayjs.Dayjs; + isBeforeNow: boolean; editPost: () => void; integrations: Integrations[]; state: State; post: Post & { integration: Integration }; }> = (props) => { - const { editPost, post, date, integrations, state } = props; + const { editPost, post, date, isBeforeNow, state } = props; const [{ opacity }, dragRef] = useDrag( () => ({ type: 'post', @@ -444,7 +410,7 @@ const CalendarItem: FC<{ className={clsx( 'gap-[5px] w-full flex h-full flex-1 rounded-[10px] border border-seventh px-[5px] p-[2.5px]', 'relative', - state === 'DRAFT' && '!grayscale' + (state === 'DRAFT' || isBeforeNow) && '!grayscale' )} style={{ opacity }} > @@ -458,7 +424,10 @@ const CalendarItem: FC<{ src={`/icons/platforms/${post.integration?.providerIdentifier}.png`} />
-
{post.content}
+
+ {state === 'DRAFT' ? 'Draft: ' : ''} + {post.content} +
); }; diff --git a/apps/frontend/src/components/launches/filters.tsx b/apps/frontend/src/components/launches/filters.tsx index af3025c6..a789fea8 100644 --- a/apps/frontend/src/components/launches/filters.tsx +++ b/apps/frontend/src/components/launches/filters.tsx @@ -1,32 +1,109 @@ 'use client'; import { useCalendar } from '@gitroom/frontend/components/launches/calendar.context'; +import clsx from 'clsx'; import dayjs from 'dayjs'; -import {useCallback} from "react"; +import { useCallback } from 'react'; export const Filters = () => { const week = useCalendar(); const betweenDates = - dayjs().year(week.currentYear).isoWeek(week.currentWeek).startOf('isoWeek').format('DD/MM/YYYY') + - ' - ' + - dayjs().year(week.currentYear).isoWeek(week.currentWeek).endOf('isoWeek').format('DD/MM/YYYY'); + week.display === 'week' + ? dayjs() + .year(week.currentYear) + .isoWeek(week.currentWeek) + .startOf('isoWeek') + .format('DD/MM/YYYY') + + ' - ' + + dayjs() + .year(week.currentYear) + .isoWeek(week.currentWeek) + .endOf('isoWeek') + .format('DD/MM/YYYY') + : dayjs() + .year(week.currentYear) + .month(week.currentMonth) + .startOf('month') + .format('DD/MM/YYYY') + + ' - ' + + dayjs() + .year(week.currentYear) + .month(week.currentMonth) + .endOf('month') + .format('DD/MM/YYYY'); - const nextWeek = useCallback(() => { - week.setFilters({ - currentWeek: week.currentWeek === 52 ? 1 : week.currentWeek + 1, - currentYear: week.currentWeek === 52 ? week.currentYear + 1 : week.currentYear, - }); - }, [week.currentWeek, week.currentYear]); + const setWeek = useCallback(() => { + week.setFilters({ + currentWeek: dayjs().isoWeek(), + currentYear: dayjs().year(), + currentMonth: 0, + display: 'week', + }); + }, [week]); - const previousWeek = useCallback(() => { - week.setFilters({ - currentWeek: week.currentWeek === 1 ? 52 : week.currentWeek - 1, - currentYear: week.currentWeek === 1 ? week.currentYear - 1 : week.currentYear, - }); - }, [week.currentWeek, week.currentYear]); + const setMonth = useCallback(() => { + week.setFilters({ + currentMonth: dayjs().month(), + currentWeek: 0, + currentYear: dayjs().year(), + display: 'month', + }); + }, [week]); + + const next = useCallback(() => { + week.setFilters({ + currentWeek: + week.display === 'week' + ? week.currentWeek === 52 + ? 1 + : week.currentWeek + 1 + : 0, + currentYear: + week.display === 'week' + ? week.currentWeek === 52 + ? week.currentYear + 1 + : week.currentYear + : week.currentMonth === 11 + ? week.currentYear + 1 + : week.currentYear, + display: week.display as any, + currentMonth: + week.display === 'week' + ? 0 + : week.currentMonth === 11 + ? 0 + : week.currentMonth + 1, + }); + }, [week.display, week.currentMonth, week.currentWeek, week.currentYear]); + + const previous = useCallback(() => { + week.setFilters({ + currentWeek: + week.display === 'week' + ? week.currentWeek === 1 + ? 52 + : week.currentWeek - 1 + : 0, + currentYear: + week.display === 'week' + ? week.currentWeek === 1 + ? week.currentYear - 1 + : week.currentYear + : week.currentMonth === 0 + ? week.currentYear - 1 + : week.currentYear, + display: week.display as any, + currentMonth: + week.display === 'week' + ? 0 + : week.currentMonth === 0 + ? 11 + : week.currentMonth - 1, + }); + }, [week.display, week.currentMonth, week.currentWeek, week.currentYear]); return ( -
-
+
+
{ />
-
Week {week.currentWeek}
-
+
+ {week.display === 'week' + ? `Week ${week.currentWeek}` + : `${dayjs().month(week.currentMonth).format('MMMM')}`} +
+
{ />
-
{betweenDates}
+
{betweenDates}
+
+ Week +
+
+ Month +
); }; diff --git a/apps/frontend/src/components/launches/launches.component.tsx b/apps/frontend/src/components/launches/launches.component.tsx index 8c7a47e0..a9edc5d2 100644 --- a/apps/frontend/src/components/launches/launches.component.tsx +++ b/apps/frontend/src/components/launches/launches.component.tsx @@ -13,13 +13,12 @@ import { LoadingComponent } from '@gitroom/frontend/components/layout/loading'; import clsx from 'clsx'; import { useUser } from '../layout/user.context'; import { Menu } from '@gitroom/frontend/components/launches/menu/menu'; -import { GeneratorComponent } from '@gitroom/frontend/components/launches/generator/generator'; import { useRouter, useSearchParams } from 'next/navigation'; import { Integration } from '@prisma/client'; import ImageWithFallback from '@gitroom/react/helpers/image.with.fallback'; import { useToaster } from '@gitroom/react/toaster/toaster'; import { useFireEvents } from '@gitroom/helpers/utils/use.fire.events'; -import { NewCalendarComponent } from '@gitroom/frontend/components/launches/new.calendar.component'; +import { Calendar } from './calendar'; export const LaunchesComponent = () => { const fetch = useFetch(); @@ -117,7 +116,7 @@ export const LaunchesComponent = () => {
-
+

Channels

@@ -213,8 +212,7 @@ export const LaunchesComponent = () => {
- - {/**/} +
diff --git a/apps/frontend/src/components/launches/new.calendar.component.tsx b/apps/frontend/src/components/launches/new.calendar.component.tsx deleted file mode 100644 index 720443d6..00000000 --- a/apps/frontend/src/components/launches/new.calendar.component.tsx +++ /dev/null @@ -1,54 +0,0 @@ -'use client'; -import { Fragment } from 'react'; -import { CalendarColumn } from '@gitroom/frontend/components/launches/calendar'; -import { DNDProvider } from '@gitroom/frontend/components/launches/helpers/dnd.provider'; - -export const days = [ - 'Monday', - 'Tuesday', - 'Wednesday', - 'Thursday', - 'Friday', - 'Saturday', - 'Sunday', -]; -export const hours = Array.from({ length: 24 }, (_, i) => i); - -export const NewCalendarComponent = () => { - return ( - -
-
-
-
- {days.map((day, index) => ( -
-
{day}
-
- ))} - {hours.map((hour) => ( - -
- {hour.toString().padStart(2, '0')}:00 -
- {days.map((day, indexDay) => ( - -
- -
- - ))} - - ))} -
-
-
- - ); -}; diff --git a/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts b/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts index e5931498..b4704b29 100644 --- a/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts +++ b/libraries/nestjs-libraries/src/database/prisma/posts/posts.repository.ts @@ -64,10 +64,10 @@ export class PostsRepository { getPosts(orgId: string, query: GetPostsDto) { const dateYear = dayjs().year(query.year); - const date = dateYear.isoWeek(query.week); + const date = query.week ? dateYear.isoWeek(query.week) : dateYear.month(query.month-1); - const startDate = date.startOf('isoWeek').subtract(2, 'days').toDate(); - const endDate = date.endOf('isoWeek').add(2, 'days').toDate(); + const startDate = (query.week ? date.startOf('isoWeek') : date.startOf('month')).subtract(2, 'days').toDate(); + const endDate = (query.week ? date.endOf('isoWeek') : date.endOf('month')).add(2, 'days').toDate(); return this._post.model.post.findMany({ where: { diff --git a/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts b/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts index 4872a787..1a89560f 100644 --- a/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts +++ b/libraries/nestjs-libraries/src/dtos/posts/get.posts.dto.ts @@ -1,14 +1,22 @@ import { Type } from 'class-transformer'; -import { IsIn, IsNumber, IsString, Max, Min } from 'class-validator'; +import { IsIn, IsNumber, IsString, Max, Min, ValidateIf } from 'class-validator'; import dayjs from 'dayjs'; export class GetPostsDto { + @ValidateIf((o) => !o.month) @Type(() => Number) @IsNumber() @Max(52) @Min(1) week: number; + @ValidateIf((o) => !o.week) + @Type(() => Number) + @IsNumber() + @Max(52) + @Min(1) + month: number; + @Type(() => Number) @IsNumber() @Max(dayjs().add(10, 'year').year()) From 471bce7f15dfa2216966fa813309a3bcb79109c8 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Sun, 8 Sep 2024 20:42:10 +0700 Subject: [PATCH 03/21] feat: calendar change --- apps/frontend/src/components/launches/calendar.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/apps/frontend/src/components/launches/calendar.tsx b/apps/frontend/src/components/launches/calendar.tsx index 5a048898..28b00763 100644 --- a/apps/frontend/src/components/launches/calendar.tsx +++ b/apps/frontend/src/components/launches/calendar.tsx @@ -169,6 +169,7 @@ export const CalendarColumn: FC<{ }); }, [posts, display, getDate]); + const canBeTrending = useMemo(() => { return !!trendings.find((trend) => { return dayjs From e165122a551c2509bdda20b06e865a95e52c3fd4 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Sun, 8 Sep 2024 23:38:48 +0700 Subject: [PATCH 04/21] feat: schedule fixing --- .../src/components/launches/calendar.tsx | 22 ++++++++++++------- 1 file changed, 14 insertions(+), 8 deletions(-) diff --git a/apps/frontend/src/components/launches/calendar.tsx b/apps/frontend/src/components/launches/calendar.tsx index 28b00763..f1a79dd6 100644 --- a/apps/frontend/src/components/launches/calendar.tsx +++ b/apps/frontend/src/components/launches/calendar.tsx @@ -21,6 +21,10 @@ import { useToaster } from '@gitroom/react/toaster/toaster'; import { useUser } from '@gitroom/frontend/components/layout/user.context'; import { IntegrationContext } from '@gitroom/frontend/components/launches/helpers/use.integration'; import { PreviewPopup } from '@gitroom/frontend/components/marketplace/special.message'; +import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'; +import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'; +dayjs.extend(isSameOrAfter); +dayjs.extend(isSameOrBefore); export const days = [ 'Monday', @@ -163,9 +167,12 @@ export const CalendarColumn: FC<{ const postList = useMemo(() => { return posts.filter((post) => { const pList = dayjs.utc(post.publishDate).local(); - return display === 'week' - ? pList.isBetween(getDate.startOf('hour'), getDate.endOf('hour')) + const check = display === 'week' + ? pList.isSameOrAfter(getDate.startOf('hour')) && pList.isBefore(getDate.endOf('hour')) : pList.format('DD/MM/YYYY') === getDate.format('DD/MM/YYYY'); + + console.log('check', check); + return check; }); }, [posts, display, getDate]); @@ -180,7 +187,7 @@ export const CalendarColumn: FC<{ }, [trendings]); const isBeforeNow = useMemo(() => { - return getDate.isBefore(dayjs()); + return getDate.startOf('hour').isBefore(dayjs().startOf('hour')); }, [getDate]); const [{ canDrop }, drop] = useDrop(() => ({ @@ -310,12 +317,12 @@ export const CalendarColumn: FC<{ size: '80%', // title: `Adding posts for ${getDate.format('DD/MM/YYYY HH:mm')}`, }); - }, [integrations]); + }, [integrations, getDate]); const addProvider = useAddProvider(); return ( -
+
{display === 'month' && (
{getDate.date()} @@ -326,7 +333,6 @@ export const CalendarColumn: FC<{ 'relative flex flex-col flex-1', canDrop && 'bg-white/80' )} - ref={drop} >
From b82803501980d9d584d2b1b332a9b5faef5ba639 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 00:57:18 +0700 Subject: [PATCH 05/21] feat: calendar context --- apps/frontend/src/components/launches/calendar.context.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index 5cb333b1..bc3e91d3 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -142,7 +142,7 @@ export const CalendarWeekProvider: FC<{ const data = (await fetch(`${url}?${params}`)).json(); return data; }, - [filters] + [filters, params] ); const swr = useSWR(`/posts`, loadData, { From 59923fa4100359e30d5e99c18108bc10470f5b7b Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 01:00:56 +0700 Subject: [PATCH 06/21] feat: fix extend --- apps/frontend/src/components/launches/calendar.context.tsx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index bc3e91d3..37644028 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -17,6 +17,11 @@ import { useFetch } from '@gitroom/helpers/utils/custom.fetch'; import { Post, Integration } from '@prisma/client'; import { useRouter, useSearchParams } from 'next/navigation'; import { isGeneral } from '@gitroom/react/helpers/is.general'; +import isoWeek from 'dayjs/plugin/isoWeek'; +import weekOfYear from 'dayjs/plugin/weekOfYear'; + +dayjs.extend(isoWeek); +dayjs.extend(weekOfYear); const CalendarContext = createContext({ currentWeek: dayjs().week(), From c6d68c8fffb17167afeb6ea94380edaf71a153a6 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 01:07:51 +0700 Subject: [PATCH 07/21] feat: posts --- apps/frontend/src/components/launches/calendar.context.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index 37644028..16274952 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -113,7 +113,9 @@ export const CalendarWeekProvider: FC<{ display: 'week' | 'month'; }) => { setFilters(filters); - router.replace( + window.history.replaceState( + null, + '', `/launches?${ filters.currentWeek ? `week=${filters.currentWeek}` @@ -122,7 +124,7 @@ export const CalendarWeekProvider: FC<{ ); setTimeout(() => { mutate('/posts'); - }); + }, 10); }, [filters] ); From f1dece41717482589c47c381c0f591b951c7b0d7 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 01:12:39 +0700 Subject: [PATCH 08/21] feat: internal data --- apps/frontend/src/components/launches/calendar.context.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index 16274952..01bb5609 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -113,6 +113,7 @@ export const CalendarWeekProvider: FC<{ display: 'week' | 'month'; }) => { setFilters(filters); + setInternalData([]); window.history.replaceState( null, '', @@ -145,7 +146,6 @@ export const CalendarWeekProvider: FC<{ const loadData = useCallback( async (url: string) => { - setInternalData([]); const data = (await fetch(`${url}?${params}`)).json(); return data; }, From c52faabb50213e883594a31128824a669cce91aa Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 01:29:29 +0700 Subject: [PATCH 09/21] feat: reload --- apps/frontend/src/components/launches/calendar.tsx | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/apps/frontend/src/components/launches/calendar.tsx b/apps/frontend/src/components/launches/calendar.tsx index f1a79dd6..354e2666 100644 --- a/apps/frontend/src/components/launches/calendar.tsx +++ b/apps/frontend/src/components/launches/calendar.tsx @@ -1,6 +1,6 @@ 'use client'; -import React, { FC, Fragment, useCallback, useMemo } from 'react'; +import React, { FC, Fragment, useCallback, useEffect, useMemo, useState } from 'react'; import { Integrations, useCalendar, @@ -145,6 +145,17 @@ export const MonthView = () => { export const Calendar = () => { const { display } = useCalendar(); + const [firstDisplay, setFirstDisplay] = useState(display); + + useEffect(() => { + setTimeout(() => { + setFirstDisplay(display); + }, 10); + }, [display]); + + if (display !== firstDisplay) { + return <>; + } return ( {display === 'week' ? : } @@ -171,7 +182,6 @@ export const CalendarColumn: FC<{ ? pList.isSameOrAfter(getDate.startOf('hour')) && pList.isBefore(getDate.endOf('hour')) : pList.format('DD/MM/YYYY') === getDate.format('DD/MM/YYYY'); - console.log('check', check); return check; }); }, [posts, display, getDate]); From 0c4d745569ccb3d746e0275b991ae56480c284b8 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 01:32:32 +0700 Subject: [PATCH 10/21] feat: 1000ms --- apps/frontend/src/components/launches/calendar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/frontend/src/components/launches/calendar.tsx b/apps/frontend/src/components/launches/calendar.tsx index 354e2666..bc087c50 100644 --- a/apps/frontend/src/components/launches/calendar.tsx +++ b/apps/frontend/src/components/launches/calendar.tsx @@ -150,7 +150,7 @@ export const Calendar = () => { useEffect(() => { setTimeout(() => { setFirstDisplay(display); - }, 10); + }, 1000); }, [display]); if (display !== firstDisplay) { From 20217f6bef28531ff14e3b1a5cf5f30daea00e11 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 01:39:14 +0700 Subject: [PATCH 11/21] feat: mutate --- .../components/launches/calendar.context.tsx | 51 ++++++++++--------- .../src/components/launches/calendar.tsx | 10 ---- 2 files changed, 26 insertions(+), 35 deletions(-) diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index 01bb5609..d37b2ce1 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -105,31 +105,6 @@ export const CalendarWeekProvider: FC<{ display, }); - const setFiltersWrapper = useCallback( - (filters: { - currentWeek: number; - currentYear: number; - currentMonth: number; - display: 'week' | 'month'; - }) => { - setFilters(filters); - setInternalData([]); - window.history.replaceState( - null, - '', - `/launches?${ - filters.currentWeek - ? `week=${filters.currentWeek}` - : `month=${filters.currentMonth}` - }&year=${filters.currentYear}` - ); - setTimeout(() => { - mutate('/posts'); - }, 10); - }, - [filters] - ); - const params = useMemo(() => { return new URLSearchParams( filters.currentWeek @@ -158,6 +133,32 @@ export const CalendarWeekProvider: FC<{ refreshWhenHidden: false, revalidateOnFocus: false, }); + + const setFiltersWrapper = useCallback( + (filters: { + currentWeek: number; + currentYear: number; + currentMonth: number; + display: 'week' | 'month'; + }) => { + setFilters(filters); + setInternalData([]); + window.history.replaceState( + null, + '', + `/launches?${ + filters.currentWeek + ? `week=${filters.currentWeek}` + : `month=${filters.currentMonth}` + }&year=${filters.currentYear}` + ); + setTimeout(() => { + swr.mutate(); + }, 10); + }, + [filters, swr.mutate] + ); + const { isLoading } = swr; const { posts, comments } = swr?.data || { posts: [], comments: [] }; diff --git a/apps/frontend/src/components/launches/calendar.tsx b/apps/frontend/src/components/launches/calendar.tsx index bc087c50..b7c944f2 100644 --- a/apps/frontend/src/components/launches/calendar.tsx +++ b/apps/frontend/src/components/launches/calendar.tsx @@ -145,17 +145,7 @@ export const MonthView = () => { export const Calendar = () => { const { display } = useCalendar(); - const [firstDisplay, setFirstDisplay] = useState(display); - useEffect(() => { - setTimeout(() => { - setFirstDisplay(display); - }, 1000); - }, [display]); - - if (display !== firstDisplay) { - return <>; - } return ( {display === 'week' ? : } From 19b838a84bfc7216052a08af85edb705772695f4 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 11:51:03 +0700 Subject: [PATCH 12/21] feat: change name of swr --- .../src/components/launches/calendar.context.tsx | 15 ++------------- 1 file changed, 2 insertions(+), 13 deletions(-) diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index d37b2ce1..2eb28c62 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -79,19 +79,8 @@ export const CalendarWeekProvider: FC<{ }> = ({ children, integrations }) => { const fetch = useFetch(); const [internalData, setInternalData] = useState([] as any[]); - const [trendings, setTrendings] = useState([]); - const { mutate } = useSWRConfig(); + const [trendings] = useState([]); const searchParams = useSearchParams(); - const router = useRouter(); - - useEffect(() => { - (async () => { - if (isGeneral()) { - return []; - } - setTrendings(await (await fetch('/posts/predict-trending')).json()); - })(); - }, []); const display = searchParams.get('month') ? 'month' : 'week'; const [filters, setFilters] = useState({ @@ -127,7 +116,7 @@ export const CalendarWeekProvider: FC<{ [filters, params] ); - const swr = useSWR(`/posts`, loadData, { + const swr = useSWR(`/posts-${params}`, loadData, { refreshInterval: 3600000, refreshWhenOffline: false, refreshWhenHidden: false, From 9974e71859ae080fa22a8b0ca658f3aba0ff4f69 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 12:01:14 +0700 Subject: [PATCH 13/21] feat: fix fetch --- apps/frontend/src/components/launches/calendar.context.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index 2eb28c62..1d4990b7 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -110,7 +110,7 @@ export const CalendarWeekProvider: FC<{ const loadData = useCallback( async (url: string) => { - const data = (await fetch(`${url}?${params}`)).json(); + const data = (await fetch(`/posts${url}?${params}`)).json(); return data; }, [filters, params] From 048df4fb4426156bee9c43f77d6c83769d8c345d Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 12:09:41 +0700 Subject: [PATCH 14/21] feat: it will auto load the new filters --- apps/frontend/src/components/launches/calendar.context.tsx | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index 1d4990b7..81dde56c 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -109,8 +109,8 @@ export const CalendarWeekProvider: FC<{ }, [filters]); const loadData = useCallback( - async (url: string) => { - const data = (await fetch(`/posts${url}?${params}`)).json(); + async () => { + const data = (await fetch(`/posts?${params}`)).json(); return data; }, [filters, params] @@ -141,9 +141,6 @@ export const CalendarWeekProvider: FC<{ : `month=${filters.currentMonth}` }&year=${filters.currentYear}` ); - setTimeout(() => { - swr.mutate(); - }, 10); }, [filters, swr.mutate] ); From a5cecc9d3337d4b72e590df2f775837c75eca933 Mon Sep 17 00:00:00 2001 From: Nevo David Date: Mon, 9 Sep 2024 12:20:08 +0700 Subject: [PATCH 15/21] feat: reload calendar modal --- .../components/launches/add.edit.model.tsx | 10 ++--- .../components/launches/calendar.context.tsx | 2 + .../src/components/launches/calendar.tsx | 39 ++++++++++++++----- 3 files changed, 37 insertions(+), 14 deletions(-) diff --git a/apps/frontend/src/components/launches/add.edit.model.tsx b/apps/frontend/src/components/launches/add.edit.model.tsx index 5bc20e65..b4de0725 100644 --- a/apps/frontend/src/components/launches/add.edit.model.tsx +++ b/apps/frontend/src/components/launches/add.edit.model.tsx @@ -32,7 +32,7 @@ import { TopTitle } from '@gitroom/frontend/components/launches/helpers/top.titl import { PickPlatforms } from '@gitroom/frontend/components/launches/helpers/pick.platform.component'; import { ProvidersOptions } from '@gitroom/frontend/components/launches/providers.options'; import { v4 as uuidv4 } from 'uuid'; -import useSWR, { useSWRConfig } from 'swr'; +import useSWR from 'swr'; import { useToaster } from '@gitroom/react/toaster/toaster'; import { UpDownArrow } from '@gitroom/frontend/components/launches/up.down.arrow'; import { DatePicker } from '@gitroom/frontend/components/launches/helpers/date.picker'; @@ -53,10 +53,10 @@ export const AddEditModal: FC<{ date: dayjs.Dayjs; integrations: Integrations[]; reopenModal: () => void; + mutate: () => void; }> = (props) => { - const { date, integrations, reopenModal } = props; + const { date, integrations, reopenModal, mutate } = props; const [dateState, setDateState] = useState(date); - const { mutate } = useSWRConfig(); // hook to open a new modal const modal = useModals(); @@ -243,7 +243,7 @@ export const AddEditModal: FC<{ await fetch(`/posts/${existingData.group}`, { method: 'DELETE', }); - mutate('/posts'); + mutate(); modal.closeAll(); return; } @@ -321,7 +321,7 @@ export const AddEditModal: FC<{ existingData.group = uuidv4(); - mutate('/posts'); + mutate(); toaster.show( !existingData.integration ? 'Added successfully' diff --git a/apps/frontend/src/components/launches/calendar.context.tsx b/apps/frontend/src/components/launches/calendar.context.tsx index 81dde56c..ae63d017 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -31,6 +31,7 @@ const CalendarContext = createContext({ integrations: [] as Integrations[], trendings: [] as string[], posts: [] as Array, + reloadCalendarView: () => {/** empty **/}, display: 'week', setFilters: (filters: { currentWeek: number; @@ -175,6 +176,7 @@ export const CalendarWeekProvider: FC<{ = (props) => { const { getDate, randomHour } = props; const user = useUser(); - const { integrations, posts, trendings, changeDate, display } = useCalendar(); + const { + integrations, + posts, + trendings, + changeDate, + display, + reloadCalendarView, + } = useCalendar(); const toaster = useToaster(); const modal = useModals(); @@ -168,15 +182,16 @@ export const CalendarColumn: FC<{ const postList = useMemo(() => { return posts.filter((post) => { const pList = dayjs.utc(post.publishDate).local(); - const check = display === 'week' - ? pList.isSameOrAfter(getDate.startOf('hour')) && pList.isBefore(getDate.endOf('hour')) - : pList.format('DD/MM/YYYY') === getDate.format('DD/MM/YYYY'); + const check = + display === 'week' + ? pList.isSameOrAfter(getDate.startOf('hour')) && + pList.isBefore(getDate.endOf('hour')) + : pList.format('DD/MM/YYYY') === getDate.format('DD/MM/YYYY'); return check; }); }, [posts, display, getDate]); - const canBeTrending = useMemo(() => { return !!trendings.find((trend) => { return dayjs @@ -282,6 +297,7 @@ export const CalendarColumn: FC<{ f.id === data.integration) @@ -308,6 +324,7 @@ export const CalendarColumn: FC<{ children: ( ({ ...p }))} + mutate={reloadCalendarView} date={ randomHour ? getDate.hour(Math.floor(Math.random() * 24)) : getDate } @@ -368,11 +385,15 @@ export const CalendarColumn: FC<{ ))}
{!isBeforeNow && ( -
+
Date: Mon, 9 Sep 2024 10:40:47 +0100 Subject: [PATCH 16/21] feat: eslint GitHub Action --- .github/workflows/eslint.yaml | 41 +++++++++++++++++++++++++++++++++++ 1 file changed, 41 insertions(+) create mode 100644 .github/workflows/eslint.yaml diff --git a/.github/workflows/eslint.yaml b/.github/workflows/eslint.yaml new file mode 100644 index 00000000..1e1f88f5 --- /dev/null +++ b/.github/workflows/eslint.yaml @@ -0,0 +1,41 @@ +--- +name: ESLint + +on: + push: + branches: [ "main" ] + pull_request: + branches: [ "main" ] + +jobs: + eslint: + name: Run eslint scanning + runs-on: ubuntu-latest + permissions: + contents: read + security-events: write + actions: read # only required for a private repository by github/codeql-action/upload-sarif to get the Action run status + strategy: + matrix: + service: ["backend", "frontend"] + steps: + - name: Checkout code + uses: actions/checkout@v4 + + - name: Install ESLint + run: | + npm install eslint@8.10.0 + npm install @microsoft/eslint-formatter-sarif@2.1.7 + + - name: Run ESLint + run: npx eslint apps/${{ matrix.service }}/ + --config .eslintrc.json + --format @microsoft/eslint-formatter-sarif + --output-file eslint-results.sarif + continue-on-error: true + + - name: Upload analysis results to GitHub + uses: github/codeql-action/upload-sarif@v3 + with: + sarif_file: eslint-results.sarif + wait-for-processing: true From c3510897238c30e6f3a7737564884acc659fbefd Mon Sep 17 00:00:00 2001 From: jamesread Date: Mon, 9 Sep 2024 10:42:28 +0100 Subject: [PATCH 17/21] feat: eslint GitHub Action --- .github/workflows/eslint.yaml | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/.github/workflows/eslint.yaml b/.github/workflows/eslint.yaml index 1e1f88f5..90fe1d67 100644 --- a/.github/workflows/eslint.yaml +++ b/.github/workflows/eslint.yaml @@ -3,9 +3,7 @@ name: ESLint on: push: - branches: [ "main" ] pull_request: - branches: [ "main" ] jobs: eslint: @@ -24,7 +22,7 @@ jobs: - name: Install ESLint run: | - npm install eslint@8.10.0 + npm install eslint npm install @microsoft/eslint-formatter-sarif@2.1.7 - name: Run ESLint From a656e6b567ea6474c059df94c102ba22ff58c453 Mon Sep 17 00:00:00 2001 From: jamesread Date: Mon, 9 Sep 2024 11:14:25 +0100 Subject: [PATCH 18/21] feat: eslint GitHub Action --- .github/workflows/eslint.yaml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/eslint.yaml b/.github/workflows/eslint.yaml index 90fe1d67..0d344447 100644 --- a/.github/workflows/eslint.yaml +++ b/.github/workflows/eslint.yaml @@ -29,11 +29,11 @@ jobs: run: npx eslint apps/${{ matrix.service }}/ --config .eslintrc.json --format @microsoft/eslint-formatter-sarif - --output-file eslint-results.sarif + --output-file apps/${{ matrix.service }}/eslint-results.sarif continue-on-error: true - name: Upload analysis results to GitHub uses: github/codeql-action/upload-sarif@v3 with: - sarif_file: eslint-results.sarif + sarif_file: apps/${{ matrix.service }}/eslint-results.sarif wait-for-processing: true From 149b52f76fddbeaab22dd3b0226b4e51d22d11de Mon Sep 17 00:00:00 2001 From: jamesread Date: Mon, 9 Sep 2024 13:16:26 +0100 Subject: [PATCH 19/21] feat: eslint GitHub Action --- .github/workflows/eslint.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/eslint.yaml b/.github/workflows/eslint.yaml index 0d344447..13523039 100644 --- a/.github/workflows/eslint.yaml +++ b/.github/workflows/eslint.yaml @@ -27,7 +27,7 @@ jobs: - name: Run ESLint run: npx eslint apps/${{ matrix.service }}/ - --config .eslintrc.json + --config apps/${{ matrix.service }}/.eslintrc.json --format @microsoft/eslint-formatter-sarif --output-file apps/${{ matrix.service }}/eslint-results.sarif continue-on-error: true From 1909d2f2cf28339a15ec68b4fb45c949d3341977 Mon Sep 17 00:00:00 2001 From: jamesread Date: Mon, 9 Sep 2024 13:20:43 +0100 Subject: [PATCH 20/21] npm cache --- .github/workflows/eslint.yaml | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/.github/workflows/eslint.yaml b/.github/workflows/eslint.yaml index 13523039..5eefe228 100644 --- a/.github/workflows/eslint.yaml +++ b/.github/workflows/eslint.yaml @@ -20,6 +20,14 @@ jobs: - name: Checkout code uses: actions/checkout@v4 + - name: Setup node + uses: actions/setup-node@v4 + with: + node-version: '20' + cache: 'npm' + cache-dependency-path: | + **/package-lock.json + - name: Install ESLint run: | npm install eslint From 461023ba349f66f3110c12f985d69fc6ee88462a Mon Sep 17 00:00:00 2001 From: jamesread Date: Mon, 9 Sep 2024 13:30:31 +0100 Subject: [PATCH 21/21] feat: GitHub action codeql --- .github/workflows/codeql.yml | 36 ++++++++++++++++++++++++++++++++++++ 1 file changed, 36 insertions(+) create mode 100644 .github/workflows/codeql.yml diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml new file mode 100644 index 00000000..d752c763 --- /dev/null +++ b/.github/workflows/codeql.yml @@ -0,0 +1,36 @@ +--- +name: "Code Quality Analysis" + +on: + push: + pull_request: + +jobs: + analyze: + name: Analyze (${{ matrix.language }}) + + runs-on: 'ubuntu-latest' + permissions: + security-events: write + + strategy: + fail-fast: false + matrix: + include: + - language: javascript-typescript + build-mode: none + + steps: + - name: Checkout repository + uses: actions/checkout@v4 + + - name: Initialize CodeQL + uses: github/codeql-action/init@v3 + with: + languages: ${{ matrix.language }} + build-mode: ${{ matrix.build-mode }} + + - name: Perform CodeQL Analysis + uses: github/codeql-action/analyze@v3 + with: + category: "/language:${{matrix.language}}"