From 9244f713681408d1acd23ce3acd6df6eec852ed2 Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Tue, 29 Mar 2022 19:25:45 +0530 Subject: [PATCH 01/11] Add announcement schema --- app/components/announcement.js | 0 cms/api/announcement/config/routes.json | 52 +++++++++++++++++++ .../announcement/controllers/announcement.js | 8 +++ cms/api/announcement/models/announcement.js | 8 +++ .../models/announcement.settings.json | 31 +++++++++++ cms/api/announcement/services/announcement.js | 8 +++ 6 files changed, 107 insertions(+) create mode 100644 app/components/announcement.js create mode 100644 cms/api/announcement/config/routes.json create mode 100644 cms/api/announcement/controllers/announcement.js create mode 100644 cms/api/announcement/models/announcement.js create mode 100644 cms/api/announcement/models/announcement.settings.json create mode 100644 cms/api/announcement/services/announcement.js diff --git a/app/components/announcement.js b/app/components/announcement.js new file mode 100644 index 00000000..e69de29b diff --git a/cms/api/announcement/config/routes.json b/cms/api/announcement/config/routes.json new file mode 100644 index 00000000..35a60e24 --- /dev/null +++ b/cms/api/announcement/config/routes.json @@ -0,0 +1,52 @@ +{ + "routes": [ + { + "method": "GET", + "path": "/announcements", + "handler": "announcement.find", + "config": { + "policies": [] + } + }, + { + "method": "GET", + "path": "/announcements/count", + "handler": "announcement.count", + "config": { + "policies": [] + } + }, + { + "method": "GET", + "path": "/announcements/:id", + "handler": "announcement.findOne", + "config": { + "policies": [] + } + }, + { + "method": "POST", + "path": "/announcements", + "handler": "announcement.create", + "config": { + "policies": [] + } + }, + { + "method": "PUT", + "path": "/announcements/:id", + "handler": "announcement.update", + "config": { + "policies": [] + } + }, + { + "method": "DELETE", + "path": "/announcements/:id", + "handler": "announcement.delete", + "config": { + "policies": [] + } + } + ] +} diff --git a/cms/api/announcement/controllers/announcement.js b/cms/api/announcement/controllers/announcement.js new file mode 100644 index 00000000..e8608953 --- /dev/null +++ b/cms/api/announcement/controllers/announcement.js @@ -0,0 +1,8 @@ +'use strict'; + +/** + * Read the documentation (https://strapi.io/documentation/developer-docs/latest/development/backend-customization.html#core-controllers) + * to customize this controller + */ + +module.exports = {}; diff --git a/cms/api/announcement/models/announcement.js b/cms/api/announcement/models/announcement.js new file mode 100644 index 00000000..0054d33c --- /dev/null +++ b/cms/api/announcement/models/announcement.js @@ -0,0 +1,8 @@ +'use strict'; + +/** + * Read the documentation (https://strapi.io/documentation/developer-docs/latest/development/backend-customization.html#lifecycle-hooks) + * to customize this model + */ + +module.exports = {}; diff --git a/cms/api/announcement/models/announcement.settings.json b/cms/api/announcement/models/announcement.settings.json new file mode 100644 index 00000000..abbec13a --- /dev/null +++ b/cms/api/announcement/models/announcement.settings.json @@ -0,0 +1,31 @@ +{ + "kind": "collectionType", + "collectionName": "announcements", + "info": { + "name": "Announcement", + "description": "" + }, + "options": { + "increments": true, + "timestamps": true, + "draftAndPublish": true + }, + "pluginOptions": {}, + "attributes": { + "announcement_text": { + "type": "string" + }, + "publish_date": { + "type": "datetime" + }, + "redirect_url": { + "type": "string" + }, + "unpublish_date": { + "type": "datetime" + }, + "announcement_code": { + "type": "string" + } + } +} diff --git a/cms/api/announcement/services/announcement.js b/cms/api/announcement/services/announcement.js new file mode 100644 index 00000000..6538a8c8 --- /dev/null +++ b/cms/api/announcement/services/announcement.js @@ -0,0 +1,8 @@ +'use strict'; + +/** + * Read the documentation (https://strapi.io/documentation/developer-docs/latest/development/backend-customization.html#core-services) + * to customize this service + */ + +module.exports = {}; From 1613afcf4fabfb5ba445800fd0bbd7235d642f25 Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Wed, 30 Mar 2022 13:11:48 +0530 Subject: [PATCH 02/11] Add front end Announcement component --- app/components/announcement.js | 18 +++++++++++++++++ app/components/layout.js | 20 ++++++++++--------- app/lib/announcement.js | 16 +++++++++++++++ app/pages/index.js | 4 +++- app/styles/Announcement.module.css | 31 ++++++++++++++++++++++++++++++ 5 files changed, 79 insertions(+), 10 deletions(-) create mode 100644 app/lib/announcement.js create mode 100644 app/styles/Announcement.module.css diff --git a/app/components/announcement.js b/app/components/announcement.js index e69de29b..1f0f77df 100644 --- a/app/components/announcement.js +++ b/app/components/announcement.js @@ -0,0 +1,18 @@ +import styles from "../styles/Announcement.module.css"; + +export default function Announcement(props) { + if ( + typeof props.announcement === "undefined" || + typeof props.announcement.announcement_text === "undefined" + ) { + return <>; + } + return ( + +
{props.announcement.announcement_text}
+ + ); +} diff --git a/app/components/layout.js b/app/components/layout.js index 03bb2d5d..039a930f 100644 --- a/app/components/layout.js +++ b/app/components/layout.js @@ -1,23 +1,25 @@ -import '../styles/Layout.module.css'; -import Footer from './footer'; -import Menubar from './menubar'; -import BookmarkSVG from '/public/svg/bookmark.js'; -import styles from '../styles/Mainstage.module.css'; -import { useRouter } from 'next/router'; +import "../styles/Layout.module.css"; +import Footer from "./footer"; +import Menubar from "./menubar"; +import Announcement from "./announcement"; +import BookmarkSVG from "/public/svg/bookmark.js"; +import styles from "../styles/Mainstage.module.css"; +import { useRouter } from "next/router"; function Layout(props) { const { pathname } = useRouter(); return ( <> + {props.children}
- {pathname === '/virtualconf/mainstage' && ( + {pathname === "/virtualconf/mainstage" && (

- {' '} - Bookmark this page and come back on{' '} + {" "} + Bookmark this page and come back on{" "} April 6 for the LIVE conference

diff --git a/app/lib/announcement.js b/app/lib/announcement.js new file mode 100644 index 00000000..1e2fc479 --- /dev/null +++ b/app/lib/announcement.js @@ -0,0 +1,16 @@ +import { fetchAPI } from "./api"; + +export const getAnnouncementData = async (announcement_code) => { + try { + const res = await fetchAPI("/announcements"); + let neededAnnouncement = new Object(); + res.forEach((announcement) => { + if (announcement.announcement_code === announcement_code) { + neededAnnouncement = announcement; + } + }); + return neededAnnouncement; + } catch (error) { + console.log(error); + } +}; diff --git a/app/pages/index.js b/app/pages/index.js index 95cc2a98..6a33546f 100644 --- a/app/pages/index.js +++ b/app/pages/index.js @@ -10,6 +10,7 @@ import { Container, Col } from 'react-bootstrap'; import { fetchAPI } from '../lib/api'; import { withFirebaseAuthUser } from '../components/auth/firebase'; import { INFOTILES_DATA } from '../lib/const/infotiles'; +import { getAnnouncementData } from '../lib/announcement'; function Home(props) { return ( @@ -83,9 +84,10 @@ export async function getStaticProps({ params }) { const releaseNotes = await fetchAPI('/release-notes'); const topNavItems = await fetchAPI('/top-nav-item'); const topPosts = await fetchAPI('/discourses'); + const announcement = await getAnnouncementData('rc_alumini_conf'); return { - props: { carousels, personas, guides, releaseNotes, topNavItems, topPosts }, + props: { carousels, personas, guides, releaseNotes, topNavItems, topPosts, announcement}, // Next.js will attempt to re-generate the page: // - When a request comes in // - At most once every 1 second diff --git a/app/styles/Announcement.module.css b/app/styles/Announcement.module.css new file mode 100644 index 00000000..138b5720 --- /dev/null +++ b/app/styles/Announcement.module.css @@ -0,0 +1,31 @@ + +.announcement { + background: rgb(255,255,255); + background: linear-gradient(45deg, rgb(255, 132, 132) 0%, rgba(255,0,0,1) 100%); +} + +.announcement:hover{ + background: rgb(255,61,61); + background: linear-gradient(45deg, rgb(252, 24, 24) 0%, rgb(226, 18, 18) 100%); +} + +.announcement_link{ + width: inherit; + height: inherit; + text-decoration: none; + color: white; +} + +.announcement_link:hover{ + text-decoration: none; + color: white; +} + +.announcement_text { + font-size: clamp(16px, 2.4vw, 20px);; +} + + + + + \ No newline at end of file From 5c90acccc56cca3ab4cb7d7e006a41f9614fdd59 Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Wed, 30 Mar 2022 13:24:03 +0530 Subject: [PATCH 03/11] Update Announcement logic to show relevant published annoucements --- app/components/announcement.js | 9 ++++++++- app/pages/index.js | 2 +- 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/app/components/announcement.js b/app/components/announcement.js index 1f0f77df..e5046824 100644 --- a/app/components/announcement.js +++ b/app/components/announcement.js @@ -1,9 +1,16 @@ import styles from "../styles/Announcement.module.css"; export default function Announcement(props) { + + const announcementPublishDateTime = new Date(props.announcement.publish_date); + const announcementUnpublishDateTime = new Date(props.announcement.unpublish_date); + const currentDateTime = new Date(); + if ( typeof props.announcement === "undefined" || - typeof props.announcement.announcement_text === "undefined" + typeof props.announcement.announcement_text === "undefined" || + currentDateTime < announcementPublishDateTime || + currentDateTime > announcementUnpublishDateTime ) { return <>; } diff --git a/app/pages/index.js b/app/pages/index.js index 6a33546f..c54474fb 100644 --- a/app/pages/index.js +++ b/app/pages/index.js @@ -84,7 +84,7 @@ export async function getStaticProps({ params }) { const releaseNotes = await fetchAPI('/release-notes'); const topNavItems = await fetchAPI('/top-nav-item'); const topPosts = await fetchAPI('/discourses'); - const announcement = await getAnnouncementData('rc_alumini_conf'); + const announcement = await getAnnouncementData('rc_open_conf'); return { props: { carousels, personas, guides, releaseNotes, topNavItems, topPosts, announcement}, From fda390fe493104ea07a53a78b0881b65440e4e07 Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Wed, 30 Mar 2022 15:45:59 +0530 Subject: [PATCH 04/11] Add fucntion to delete old events --- cms/config/functions/announcement.js | 21 +++++++++++++++++++++ cms/config/functions/cron.js | 6 +++++- 2 files changed, 26 insertions(+), 1 deletion(-) create mode 100644 cms/config/functions/announcement.js diff --git a/cms/config/functions/announcement.js b/cms/config/functions/announcement.js new file mode 100644 index 00000000..4b413acb --- /dev/null +++ b/cms/config/functions/announcement.js @@ -0,0 +1,21 @@ +module.exports.deleteOldAnnouncemts = async function () { + try { + let announcements = await strapi.query("announcement").find({}); + announcements.forEach(async (announcement) => { + const announcementUnpublishDateTime = new Date( + announcement.unpublish_date + ); + const currentDateTime = new Date(); + if ( + (currentDateTime - announcementUnpublishDateTime) / (1000 * 60 * 60) > + 2 + ) { + await strapi.query("announcement").delete({ + id: announcement.id, + }); + } + }); + } catch (error) { + console.log(error); + } +}; diff --git a/cms/config/functions/cron.js b/cms/config/functions/cron.js index 7cc9c418..6d22bc72 100644 --- a/cms/config/functions/cron.js +++ b/cms/config/functions/cron.js @@ -3,6 +3,7 @@ const { getLatestCommunityActivity } = require("./fetchTopPosts"); const { getCommunityContributors } = require("./fetchContributors") const { githubKit } = require("./github"); const { updateSpeakerData } = require('./speaker') +const { deleteOldAnnouncemts } = require("./announcement") /** * Cron config that gives you an opportunity * to run scheduled jobs. @@ -28,7 +29,10 @@ module.exports = { getCommunityContributors('https://gsoc.rocket.chat/api/data','rocketChat','Rocket.Chat'); updateSpeakerData(); }, - '*/* 10 * * * *': () => { + '* */10 * * * *': () => { githubKit('RocketChat','RC4Community',['issues','contributors','pulls']); + }, + '* * * */1 * *': () => { + deleteOldAnnouncemts(); } }; \ No newline at end of file From eb3647d6db51dc4ea5192121053549fee87ee38d Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Wed, 30 Mar 2022 21:59:18 +0530 Subject: [PATCH 05/11] Setup initial data fetch --- app/components/announcement.js | 10 ++++++++-- app/pages/index.js | 2 +- cms/config/functions/fetchData.js | 13 +++++++++++-- cms/config/initialData/announcements.json | 9 +++++++++ cms/config/initialData/index.js | 5 ++++- 5 files changed, 33 insertions(+), 6 deletions(-) create mode 100644 cms/config/initialData/announcements.json diff --git a/app/components/announcement.js b/app/components/announcement.js index e5046824..be30ba15 100644 --- a/app/components/announcement.js +++ b/app/components/announcement.js @@ -2,18 +2,24 @@ import styles from "../styles/Announcement.module.css"; export default function Announcement(props) { + if ( + typeof props.announcement === "undefined" || + typeof props.announcement.announcement_text === "undefined" + ) { + return <>; + } + const announcementPublishDateTime = new Date(props.announcement.publish_date); const announcementUnpublishDateTime = new Date(props.announcement.unpublish_date); const currentDateTime = new Date(); if ( - typeof props.announcement === "undefined" || - typeof props.announcement.announcement_text === "undefined" || currentDateTime < announcementPublishDateTime || currentDateTime > announcementUnpublishDateTime ) { return <>; } + return ( { @@ -22,7 +23,8 @@ module.exports = async () => { var formCount = await strapi.query("form").count(); var ghrepos = await strapi.query("github-repositories").count({}); var speakersCount = await strapi.query("speaker").count({}); - + var announcementsCount = await strapi.query("announcement").count({}); + // initial fetch speakers.map(async (speaker, index) => { if (index <= speakersCount - 1) { @@ -245,6 +247,13 @@ module.exports = async () => { }), }); } + + if (announcementsCount === 0) { + announcements.forEach(async (announcement) => { + await strapi.query("announcement").create(announcement); + }); + } + } catch (error) { console.log("Error:= ", error); } diff --git a/cms/config/initialData/announcements.json b/cms/config/initialData/announcements.json new file mode 100644 index 00000000..c15dd126 --- /dev/null +++ b/cms/config/initialData/announcements.json @@ -0,0 +1,9 @@ +[ + { + "announcement_text": "Attend RocketChat's GSoC Alumni Virtual Conference on 6th April !", + "publish_date": "2022-03-28T06:30:00.000Z", + "redirect_url": "/virtualconf/mainstage", + "unpublish_date": "2022-04-07T06:30:00.000Z", + "announcement_code": "rc_alumini_conf" + } +] \ No newline at end of file diff --git a/cms/config/initialData/index.js b/cms/config/initialData/index.js index 5512a755..99f52daf 100644 --- a/cms/config/initialData/index.js +++ b/cms/config/initialData/index.js @@ -7,6 +7,8 @@ const subMenus = require("./sub-menus.json"); const topNavItem = require("./top-nav-item.json"); const forms = require("./forms.json") const speakers = require("./speakers.json") +const announcements = require("./announcements.json") + module.exports = { carousels, @@ -17,5 +19,6 @@ module.exports = { subMenus, topNavItem, forms, - speakers + speakers, + announcements }; \ No newline at end of file From 1610a94527feec7c0ba45276b20a272c11823e2c Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Wed, 30 Mar 2022 22:02:18 +0530 Subject: [PATCH 06/11] Update Documentation --- docs/components/README.md | 2 + docs/components/announcement.js/README.md | 79 +++++++++++++++++++++++ 2 files changed, 81 insertions(+) create mode 100644 docs/components/announcement.js/README.md diff --git a/docs/components/README.md b/docs/components/README.md index 8a780586..fe4eda68 100644 --- a/docs/components/README.md +++ b/docs/components/README.md @@ -13,6 +13,8 @@ We at Rocket.Chat believe in building susatinable online communities which can 4. InAppChat Component +5. Announcement Component + --- diff --git a/docs/components/announcement.js/README.md b/docs/components/announcement.js/README.md new file mode 100644 index 00000000..1809af90 --- /dev/null +++ b/docs/components/announcement.js/README.md @@ -0,0 +1,79 @@ +# Announcemnet Component + +The Announcemnt allows community builders to add an announcemnt at the top of any page. + +![image](https://user-images.githubusercontent.com/70485812/160879805-4facf945-1219-4f9f-a192-b83965956596.png) + + +## Announcement Component Props + +We use our helper function `getAnnouncementData(announcement_code);` to fetch the data for the component inorder for it to be visible and pass it as `announcement` object in the props passed to the page.The announcement prop will be automtically then passed to the component in the layout. + +| Prop Name | Description | Type | +| ------------- |------------------------- | -----| +| announcement | This will contain the details of the announcement | JSON | + +# Usage + +### Setting up component data in CMS + +1. Add the Announcement details in the backend under the announcemnts collection. + +![image](https://user-images.githubusercontent.com/70485812/160881585-b66378fb-c144-45e1-9bb0-f5a2d4985460.png) + +2. The publish_date is the date when we want the announcemnt to be displayed on the. +3. Announcement Code should be unqiue as it will be used to fetch the announcemnt details on the page where we wish to display the announcement. +4. The `deleteOldAnnouncemts()` runs once a day to delete the announcements which have crossed the unpublish_date, this helps us avoid cluttering of old announcemnts form the database. + +NOTE : If you want any initial announcement to be added to the database during initialization when we run , `INITIALIZE_DATA=true npm run develop` , add that announcemnt in json format in `cms/config/initialdata/annoucements.json`. This will populate the DB with the announcemnt at the time data is initialised. + +### Using the component + +``` +import Head from "next/head"; +import { Github } from '../components/github'; +import { githubKitData } from '../lib/github'; +import { getAnnouncementData } from '../lib/announcement'; + +export default function Leaderboardpage(props){ + return ( +
+ + GSOC2022 LeaderBoard + +
+

+ Repository Overview +

+ +
+
+ ); +} + +export async function getStaticProps(){ + + const githubData = await githubKitData('RocketChat','RC4Community',['issues','pulls','contributors']); + const topNavItems = await fetchAPI("/top-nav-item"); + + //the helper function will fetch the relevant anouncement data linked to announcemnt with code 'rc_alumini_conf' + //Now we will have to pass announcements to page props it and this will display the annoucement on the page + const announcement = await getAnnouncementData('rc_alumini_conf'); + + return { + props: { + leaderboardProps, + githubData, + announcement + }, + revalidate: 30, + }; +} +``` + + + + + + +### :arrow_left: Explore More Components \ No newline at end of file From 967f26fcb518c84d0153675a719aa73efd586539 Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Wed, 30 Mar 2022 22:03:48 +0530 Subject: [PATCH 07/11] fix typo --- docs/components/{announcement.js => announcement}/README.md | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename docs/components/{announcement.js => announcement}/README.md (100%) diff --git a/docs/components/announcement.js/README.md b/docs/components/announcement/README.md similarity index 100% rename from docs/components/announcement.js/README.md rename to docs/components/announcement/README.md From c390f8c4789f357e41038a2766f9417d99e3b0ca Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Sat, 2 Apr 2022 01:23:57 +0530 Subject: [PATCH 08/11] Update lock file --- app/package-lock.json | 3 +++ 1 file changed, 3 insertions(+) diff --git a/app/package-lock.json b/app/package-lock.json index bfd0eff0..c0cd1d46 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -879,6 +879,7 @@ "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", "dev": true }, +<<<<<<< HEAD "node_modules/@jitsi/react-sdk": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/@jitsi/react-sdk/-/react-sdk-1.0.0.tgz", @@ -888,6 +889,8 @@ "react-dom": "16 || 17" } }, +======= +>>>>>>> Update lock file "node_modules/@jitsi/web-sdk": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/@jitsi/web-sdk/-/web-sdk-0.2.0.tgz", From dc493f992245d363a03edafaab3043b0eb1c1e6c Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Sat, 2 Apr 2022 10:44:21 +0530 Subject: [PATCH 09/11] Fix Lock File --- app/package-lock.json | 3 --- 1 file changed, 3 deletions(-) diff --git a/app/package-lock.json b/app/package-lock.json index c0cd1d46..bfd0eff0 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -879,7 +879,6 @@ "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", "dev": true }, -<<<<<<< HEAD "node_modules/@jitsi/react-sdk": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/@jitsi/react-sdk/-/react-sdk-1.0.0.tgz", @@ -889,8 +888,6 @@ "react-dom": "16 || 17" } }, -======= ->>>>>>> Update lock file "node_modules/@jitsi/web-sdk": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/@jitsi/web-sdk/-/web-sdk-0.2.0.tgz", From 17654a7ccae961b6d782f6a60bbe58a29c6b38ff Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Sat, 2 Apr 2022 10:57:14 +0530 Subject: [PATCH 10/11] Fix Announcement Permissions --- app/lib/announcement.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/app/lib/announcement.js b/app/lib/announcement.js index 1e2fc479..e81cc14e 100644 --- a/app/lib/announcement.js +++ b/app/lib/announcement.js @@ -1,8 +1,10 @@ import { fetchAPI } from "./api"; + export const getAnnouncementData = async (announcement_code) => { try { const res = await fetchAPI("/announcements"); + console.log(res); let neededAnnouncement = new Object(); res.forEach((announcement) => { if (announcement.announcement_code === announcement_code) { From 1435a0f55c71e80470eac1b1a416ad3060b68cc7 Mon Sep 17 00:00:00 2001 From: samad-yar-khan Date: Sat, 2 Apr 2022 13:10:33 +0530 Subject: [PATCH 11/11] Remove console statemtt --- app/lib/announcement.js | 1 - 1 file changed, 1 deletion(-) diff --git a/app/lib/announcement.js b/app/lib/announcement.js index e81cc14e..85340913 100644 --- a/app/lib/announcement.js +++ b/app/lib/announcement.js @@ -4,7 +4,6 @@ import { fetchAPI } from "./api"; export const getAnnouncementData = async (announcement_code) => { try { const res = await fetchAPI("/announcements"); - console.log(res); let neededAnnouncement = new Object(); res.forEach((announcement) => { if (announcement.announcement_code === announcement_code) {