diff --git a/.github/workflows/build.yaml b/.github/workflows/build.yaml new file mode 100644 index 00000000..9c421bbf --- /dev/null +++ b/.github/workflows/build.yaml @@ -0,0 +1,38 @@ +--- +name: Build + +on: + push: + pull_request: + +jobs: + build: + runs-on: ubuntu-latest + + strategy: + matrix: + node-version: ['20.17.0'] + # See supported Node.js release schedule at https://nodejs.org/en/about/releases/ + + steps: + - uses: actions/checkout@v4 + - name: Use Node.js ${{ matrix.node-version }} + uses: actions/setup-node@v4 + with: + node-version: ${{ matrix.node-version }} + cache: 'npm' + + # https://nextjs.org/docs/pages/building-your-application/deploying/ci-build-caching#github-actions + - uses: actions/cache@v4 + with: + path: | + ~/.npm + ${{ github.workspace }}/.next/cache + + key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-${{ hashFiles('**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx') }} + restore-keys: | + ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}- + + + - run: npm ci + - run: npm run build 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}}" diff --git a/.github/workflows/eslint.yaml b/.github/workflows/eslint.yaml new file mode 100644 index 00000000..5eefe228 --- /dev/null +++ b/.github/workflows/eslint.yaml @@ -0,0 +1,47 @@ +--- +name: ESLint + +on: + push: + pull_request: + +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: 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 + npm install @microsoft/eslint-formatter-sarif@2.1.7 + + - name: Run ESLint + run: npx eslint apps/${{ matrix.service }}/ + --config apps/${{ matrix.service }}/.eslintrc.json + --format @microsoft/eslint-formatter-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: apps/${{ matrix.service }}/eslint-results.sarif + wait-for-processing: true diff --git a/Dockerfile b/Dockerfile index 34b19b4e..45498003 100644 --- a/Dockerfile +++ b/Dockerfile @@ -7,7 +7,9 @@ ENV NEXT_TELEMETRY_DISABLED=1 RUN apk add --no-cache \ bash=5.2.21-r0 \ - supervisor=4.2.5-r4 + supervisor=4.2.5-r4 \ + make \ + build-base WORKDIR /app diff --git a/apps/backend/src/api/routes/posts.controller.ts b/apps/backend/src/api/routes/posts.controller.ts index c13c614a..dccdd28c 100644 --- a/apps/backend/src/api/routes/posts.controller.ts +++ b/apps/backend/src/api/routes/posts.controller.ts @@ -48,19 +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, - query.isIsoWeek === 'true' - ), + // this._commentsService.getAllCommentsByWeekYear( + // org.id, + // query.year, + // query.week + // ), ]); return { posts, - comments, + // comments, }; } diff --git a/apps/docs/emails.mdx b/apps/docs/emails.mdx index 1e45b704..e7c7ea45 100644 --- a/apps/docs/emails.mdx +++ b/apps/docs/emails.mdx @@ -3,14 +3,16 @@ title: Email Notifications description: How to send notifications to users --- -At the moment we are using Resend to send email notifications to users, and might be changed the Novu later. +Postiz uses Resend to send email notifications to users. Emails are currently +required as part of the new-user creation process, which sends an activation +email. -Register to [Resend](https://resend.com) connect your domain. -Copy your API Key. -Head over to .env file and add the following line. +* Register to [Resend](https://resend.com), and connect your domain. +* Copy your API Key from the Resend control panel. +* Open the .env file and edit the following line. ```env -RESEND_API_KEY="" +RESEND_API_KEY="" ``` -Feel free to contribute other providers to send email notifications. \ No newline at end of file +Feel free to contribute other providers to send email notifications. diff --git a/apps/docs/howitworks.mdx b/apps/docs/howitworks.mdx index 8232d9d8..aa1fa7dc 100644 --- a/apps/docs/howitworks.mdx +++ b/apps/docs/howitworks.mdx @@ -8,13 +8,13 @@ Unlike other NX project, this project has one `.env` file that is shared between It makes it easier to develop and deploy the project.

When deploying to websites like [Railway](https://railway.app) or [Heroku](https://heroku.com), you can use a shared environment variables for all the apps.

-**At the moment it has 6 project:** +**At the moment it has 6 projects:** -- **Backend** - NestJS based system -- **Workers** - NestJS based workers connected to a Redis Queue. -- **Cron** - NestJS scheduler to run cron jobs. -- **Frontend** - NextJS based control panel. -- **Docs** - Mintlify based documentation website. +- [Frontend](#frontend) - Provides the Web user interface, talks to the Backend. +- [Backend](#backend) - Does all the real work, provides an API for the frontend, and posts work to the redis queue. +- [Workers](#worker) - Consumes work from the Redis Queue. +- [Cron](#cron) - Run jobs at scheduled times. +- [Docs](#docs) - This documentation site! -If you don't, you can install [Docker](https://www.docker.com/products/docker-desktop) and run: +Make sure you have PostgreSQL installed on your machine. -```bash +#### Option A) Postgres and Redis as Single containers + +You can install [Docker](https://www.docker.com/products/docker-desktop) and run: + +```bash Terminal docker run -e POSTGRES_USER=root -e POSTGRES_PASSWORD=your_password --name postgres -p 5432:5432 -d postgres -``` - -### Redis - -Make sure you have Redis installed on your machine.
-If you don't, you can install [Docker](https://www.docker.com/products/docker-desktop) and run: - -```bash docker run --name redis -p 6379:6379 -d redis ``` -## Installation +#### Option B) Postgres and Redis as docker-compose + +Download the [docker-compose.yaml file here](https://raw.githubusercontent.com/gitroomhq/postiz-app/main/docker-compose.dev.yaml), +or grab it from the repository in the next step. + +```bash Terminal +docker compose -f "docker-compose.dev.yaml" up +``` + +## Build Postiz @@ -44,11 +52,11 @@ git clone https://github.com/gitroomhq/gitroom ``` - + Copy the `.env.example` file to `.env` and fill in the values ```bash .env -DATABASE_URL="postgres database URL" +DATABASE_URL="postgres database URL i.g. postgresql://postiz-local:postiz-local-pwd@0.0.0.0:5432/postiz-db-local" REDIS_URL="redis database URL" JWT_SECRET="random string for your JWT secret, make it long" FRONTEND_URL="By default: http://localhost:4200" @@ -73,21 +81,15 @@ CLOUDFLARE_BUCKET_URL="Cloudflare R2 Backet URL" NX_ADD_PLUGINS=false IS_GENERAL="true" # required for now ``` + - ```bash Terminal npm install ``` - -```bash Terminal -docker compose -f "docker-compose.dev.yaml" up -``` - - ```bash Terminal npm run prisma-db-push 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/app/layout.tsx b/apps/frontend/src/app/layout.tsx index 6a77d17e..7b4912c4 100644 --- a/apps/frontend/src/app/layout.tsx +++ b/apps/frontend/src/app/layout.tsx @@ -1,18 +1,14 @@ import interClass from '@gitroom/react/helpers/inter.font'; - export const dynamic = 'force-dynamic'; import './global.scss'; import 'react-tooltip/dist/react-tooltip.css'; import '@copilotkit/react-ui/styles.css'; - import LayoutContext from '@gitroom/frontend/components/layout/layout.context'; import { ReactNode } from 'react'; -import { Chakra_Petch } from 'next/font/google'; import { isGeneral } from '@gitroom/react/helpers/is.general'; import PlausibleProvider from 'next-plausible'; import clsx from 'clsx'; - -const chakra = Chakra_Petch({ weight: '400', subsets: ['latin'] }); +import "@fontsource/chakra-petch"; export default async function AppLayout({ children }: { children: ReactNode }) { return ( @@ -24,7 +20,7 @@ export default async function AppLayout({ children }: { children: ReactNode }) { sizes="any" /> - + {children} diff --git a/apps/frontend/src/components/launches/add.edit.model.tsx b/apps/frontend/src/components/launches/add.edit.model.tsx index f54a97c5..b4de0725 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,16 +26,14 @@ 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'; 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 { 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'; @@ -56,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(); @@ -246,7 +243,7 @@ export const AddEditModal: FC<{ await fetch(`/posts/${existingData.group}`, { method: 'DELETE', }); - mutate('/posts'); + mutate(); modal.closeAll(); return; } @@ -324,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 0105bda9..ae63d017 100644 --- a/apps/frontend/src/components/launches/calendar.context.tsx +++ b/apps/frontend/src/components/launches/calendar.context.tsx @@ -17,16 +17,33 @@ 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(), 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) => {}, + reloadCalendarView: () => {/** empty **/}, + 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 +57,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<{ @@ -70,64 +80,72 @@ 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({ - 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 }) => { - setFilters(filters); - router.replace( - `/launches?week=${filters.currentWeek}&year=${filters.currentYear}` - ); - setTimeout(() => { - mutate('/posts'); - }); - }, - [filters] - ); - const params = useMemo(() => { - return new URLSearchParams({ - week: filters.currentWeek.toString(), - year: filters.currentYear.toString(), - isIsoWeek: isIsoWeek.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) => { - const data = (await fetch(`${url}?${params}`)).json(); + async () => { + const data = (await fetch(`/posts?${params}`)).json(); return data; }, - [filters] + [filters, params] ); - const swr = useSWR(`/posts`, loadData, { + const swr = useSWR(`/posts-${params}`, loadData, { refreshInterval: 3600000, refreshWhenOffline: false, 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}` + ); + }, + [filters, swr.mutate] + ); + const { isLoading } = swr; const { posts, comments } = swr?.data || { posts: [], comments: [] }; @@ -158,6 +176,7 @@ export const CalendarWeekProvider: FC<{ i); + +export const WeekView = () => { + const { currentYear, currentWeek } = useCalendar(); + + return ( +
+
+
+
+ {days.map((day, index) => ( +
+
{day}
+
+ ))} + {hours.map((hour) => ( + +
+ {hour.toString().padStart(2, '0')}:00 +
+ {days.map((day, indexDay) => ( + +
+ +
+ + ))} + + ))} +
+
+
+ ); +}; + +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 { currentWeek, currentYear, comments } = useCalendar(); - - const firstDay = useMemo(() => { - return dayjs().year(currentYear).isoWeek(currentWeek).isoWeekday(1); - }, [currentYear, currentWeek]); + const { display } = useCalendar(); return ( -
-
- {days.map((day, index) => ( -
-
{day}
-
- {day && `(${firstDay.add(index - 1, 'day').format('DD/MM')})`} -
-
- ))} - {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)} - /> - {['00', '10', '20', '30', '40', '50'].map((num) => ( - - ))} -
- )} - - )) - )} -
-
+ {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 ? ( -
- ) : ( - - )} -
- ); -}; -const CalendarColumnRender: 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, + display, + reloadCalendarView, } = useCalendar(); const toaster = useToaster(); const modal = useModals(); const fetch = useFetch(); - const getDate = useMemo(() => { - const date = - dayjs() - .year(currentYear) - .isoWeek(currentWeek) - .isoWeekday(day) - .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(); + 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]); + }, [posts, display, getDate]); const canBeTrending = useMemo(() => { return !!trendings.find((trend) => { @@ -229,7 +202,7 @@ const CalendarColumnRender: FC<{ day: number; hour: string }> = (props) => { }, [trendings]); const isBeforeNow = useMemo(() => { - return getDate.isBefore(dayjs()); + return getDate.startOf('hour').isBefore(dayjs().startOf('hour')); }, [getDate]); const [{ canDrop }, drop] = useDrop(() => ({ @@ -311,6 +284,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, @@ -323,11 +297,12 @@ const CalendarColumnRender: FC<{ day: number; hour: string }> = (props) => { f.id === data.integration) .map((p) => ({ ...p, picture: data.integrationPicture }))} - date={getDate} + date={publishDate} /> ), @@ -349,84 +324,103 @@ const CalendarColumnRender: FC<{ day: number; hour: string }> = (props) => { children: ( ({ ...p }))} - date={getDate} + mutate={reloadCalendarView} + date={ + randomHour ? getDate.hour(Math.floor(Math.random() * 24)) : getDate + } reopenModal={() => ({})} /> ), size: '80%', // title: `Adding posts for ${getDate.format('DD/MM/YYYY HH:mm')}`, }); - }, [integrations]); + }, [integrations, getDate]); 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 +438,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 +452,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 63dae17f..00000000 --- a/apps/frontend/src/components/launches/new.calendar.component.tsx +++ /dev/null @@ -1,56 +0,0 @@ -'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'; - -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/docker-compose.dev.yaml b/docker-compose.dev.yaml index 5948c53f..55641b1b 100644 --- a/docker-compose.dev.yaml +++ b/docker-compose.dev.yaml @@ -1,26 +1,40 @@ -version: '3.9' - services: - gitroom-postgres: + postiz-postgres: image: postgres:14.5 - container_name: gitroom-postgres + container_name: postiz-postgres restart: always environment: - POSTGRES_PASSWORD: gitroom-local-pwd - POSTGRES_USER: gitroom-local - POSTGRES_DB: gitroom-db-local + POSTGRES_PASSWORD: postiz-local-pwd + POSTGRES_USER: postiz-local + POSTGRES_DB: postiz-db-local volumes: - postgres-volume:/var/lib/postgresql/data ports: - 5432:5432 - gitroom-redis: + networks: + - postiz-network + postiz-pg-admin: + image: dpage/pgadmin4 + container_name: postiz-pg-admin + restart: always + ports: + - 8081:80 + environment: + PGADMIN_DEFAULT_EMAIL: admin@admin.com + PGADMIN_DEFAULT_PASSWORD: admin + networks: + - postiz-network + postiz-redis: image: redis:7.2 - container_name: gitroom-redis + container_name: postiz-redis restart: always ports: - 6379:6379 - volumes: postgres-volume: external: false + +networks: + postiz-network: + external: false 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..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 = query.isIsoWeek === 'true' ? dateYear.isoWeek(query.week) : dateYear.week(query.week); + const date = query.week ? dateYear.isoWeek(query.week) : dateYear.month(query.month-1); - const startDate = date.startOf('week').subtract(2, 'days').toDate(); - const endDate = date.endOf('week').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 557f551d..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,21 +1,25 @@ 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()) @Min(2022) year: number; - - @IsIn(['true', 'false']) - @IsString() - isIsoWeek: 'true' | 'false'; } diff --git a/package-lock.json b/package-lock.json index 37a0b0c6..398ea7b8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -20,6 +20,7 @@ "@copilotkit/react-textarea": "1.1.0", "@copilotkit/react-ui": "1.1.0", "@copilotkit/runtime": "1.1.0", + "@fontsource/chakra-petch": "^5.0.22", "@hookform/resolvers": "^3.3.4", "@mantine/core": "^5.10.5", "@mantine/dates": "^5.10.5", @@ -6242,6 +6243,12 @@ "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.4.tgz", "integrity": "sha512-dWO2pw8hhi+WrXq1YJy2yCuWoL20PddgGaqTgVe4cOS9Q6qklXCiA1tJEqX6BEwRNSCP84/afac9hd4MS+zEUA==" }, + "node_modules/@fontsource/chakra-petch": { + "version": "5.0.22", + "resolved": "https://registry.npmjs.org/@fontsource/chakra-petch/-/chakra-petch-5.0.22.tgz", + "integrity": "sha512-dYhrz0As8T7H7NGeMbcwAf84xzlxzdfcXBqcgO5lWAGezud8zrrJKGHB/9To5fNQ1ZoqDVplXy3Hu+Ye7tFbvw==", + "license": "OFL-1.1" + }, "node_modules/@google/generative-ai": { "version": "0.11.5", "resolved": "https://registry.npmjs.org/@google/generative-ai/-/generative-ai-0.11.5.tgz", diff --git a/package.json b/package.json index bda70c5e..2a9ba71b 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,7 @@ "scripts": { "dev": "npx nx run-many --target=serve --projects=frontend,backend,workers --parallel=4", "dev:stripe": "npx concurrently \"stripe listen --forward-to localhost:3000/stripe\" \"npm run dev\"", - "build": "npx nx run-many --target=build --projects=frontend,backend,workers", + "build": "npx nx run-many --target=build --projects=frontend,backend,workers,cron", "start:prod": "node dist/apps/backend/main.js", "start:prod:frontend": "nx run frontend:serve:production", "start:prod:workers": "node dist/apps/workers/main.js", @@ -33,6 +33,7 @@ "@copilotkit/react-textarea": "1.1.0", "@copilotkit/react-ui": "1.1.0", "@copilotkit/runtime": "1.1.0", + "@fontsource/chakra-petch": "^5.0.22", "@hookform/resolvers": "^3.3.4", "@mantine/core": "^5.10.5", "@mantine/dates": "^5.10.5",