From 0fd9ea7d4aae0af112f376a4f8d73b8d8fd0a51d Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Tue, 30 May 2023 06:34:21 +0800 Subject: [PATCH 01/11] fix: npm script args for deleting a firebase user --- server/src/scripts/user/delete.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/server/src/scripts/user/delete.js b/server/src/scripts/user/delete.js index c0593f2..95cb2cf 100644 --- a/server/src/scripts/user/delete.js +++ b/server/src/scripts/user/delete.js @@ -4,7 +4,9 @@ const getargs = require('../../utils/getargs') const deleteExistingUser = async () => { try { // Get the nodejs args - const args = getargs(['email']) + const args = getargs({ + params: ['email'] + }) // Get the user data const user = await getuser({ From fd7c9350a8482d4f72e7c7a995906dbe5d0c428a Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Tue, 30 May 2023 06:53:53 +0800 Subject: [PATCH 02/11] chore: Update README, #113 --- README.md | 57 ++++++++++++++++++++++++++++++++++++++++++------------- 1 file changed, 44 insertions(+), 13 deletions(-) diff --git a/README.md b/README.md index 0b13b44..d983576 100644 --- a/README.md +++ b/README.md @@ -1,19 +1,8 @@ ## climate-profile-full -Dynaimc widgets/apps for external website embedding on Google Sites. +This project creates rich CSS styled blog-like **Posts** or **Card-like** thumbnails web pages for embedding in Google Sites as external websites. -## Requirements - -1. Windows, Linux or Mac OS -2. NodeJS LTS v16.14.2 - -### Core Libraries/Frameworks - -1. NextJS v13.0.4 -2. React 18.2.0 -3. @reduxjs/toolkit v1.9.3 -4. firebase v9.18.0 -5. firebase-admin v11.5.0 +It also features a light-weight Content Management System (CMS) for creating and managing the Google Sites embeddable blog-like **Posts** and **Cards** content. ### Online Demo @@ -29,6 +18,48 @@ email: user@gmail.com password: useruser ``` +### Using with Google Sites + +Google Sites Sample Web page:
+https://sites.google.com/view/gsites-embed-app/home + +![gsites-embed-03-ez-optimized](https://github.com/weaponsforge/climate-profile-full/assets/56998001/21c07402-904d-4e41-9988-9108c8c683cc) + +## Requirements + +1. Windows, Linux or Mac OS +2. NodeJS LTS v16.14.2 +3. Firebase Project + +### Core Libraries/Frameworks + +1. **NextJS v13.0.4** (client-side SSG) + - NextJS is one of the @latest React frameworks officially endorsed on the react.dev website + - NextJS's Static Side Generation (SSG) feature, combined with Incremental Static Generation (ISG) creates SEO-optimized websites fit for uploading on static hosting services such as GitHub Pages. + - NextJS offers code automatic code-splitting, enabling a smaller download footprint per page route +2. **React 18.2.0** + - React version 18's is the latest react version as of this writing +3. **@reduxjs/toolkit v1.9.3** + - Redux offers a structured, organized, and centralized global "state management" system as a single source of truth that occasionally syncs with the database. + - Redux states are available across all components using intuitively-named hooks. + - Redux states are more predictable, consistent and less prone to errors by + - promoting data normalization (which is optional), and + - use of reducers which ensures data immutability + - Its async data fetching mechanisms and middleware sync well with complex store states and of informing the client app of the loading state. + - Redux states are easy to debug using the Redux Dev tools. + - People can easily follow where the centralized data stores and async data fetching methods are located in the code base when working in teams, especially for large, complex enterprise apps. + - Redux state management will scale well with this app's incoming feature updates containing more complex data models and states. + - Redux has excellent documentation and a thriving community, and it has proven to be one of the most mature react state management libraries of all times. +4. **firebase v9.18.0** + - Firebase, being a Backend-as-a-Service (Baas) makes it possible to create apps without creating a separate backend server app. + - Firebase offers a Web (JavaScript) SDK for working on frontend (websites), and the Firebase Admin SDK for client-side scripting. + - Firebase offers ready to use Authentication systems + - Firestore database provides a light-weight document database useful for storing and querying simple data. Security Rules are enforced thru Firebase Security Rules. + - Firebase Storage provides an easy to use and access container for rich-data content. Security Rules are enforced thru Firebase Storage Security Rules. + - Firebase offers generous limits for testing and playing around with it's Spark (standard) plan after which users can opt to upgrade to the Blaze (paid) Plan as needed. +5. **firebase-admin v11.5.0** + - The Firebase Admin SDK allows elevated scripting access to various Firebase services which are not available in the Firebase (JavaScript) SDK. + ## Installation 1. Clone this repository.
From f94baf847e8198ebbd0128f3d9345b2ab88551ce Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Tue, 30 May 2023 06:58:34 +0800 Subject: [PATCH 03/11] chore: Update README --- README.md | 19 ++++++++++++------- 1 file changed, 12 insertions(+), 7 deletions(-) diff --git a/README.md b/README.md index d983576..2e21381 100644 --- a/README.md +++ b/README.md @@ -4,6 +4,18 @@ This project creates rich CSS styled blog-like **Posts** or **Card-like** thumbn It also features a light-weight Content Management System (CMS) for creating and managing the Google Sites embeddable blog-like **Posts** and **Cards** content. +### Using with Google Sites + +Steps: + +1. Copy a File Card's `IFrame Embed URL`. +2. Paste the `IFrame Embed URL` in Google Site's **Embed from the web** - By URL input prompt. + +Google Sites Sample Web page:
+https://sites.google.com/view/gsites-embed-app/home + +![gsites-embed-03-ez-optimized](https://github.com/weaponsforge/climate-profile-full/assets/56998001/21c07402-904d-4e41-9988-9108c8c683cc) + ### Online Demo #### Production App @@ -18,13 +30,6 @@ email: user@gmail.com password: useruser ``` -### Using with Google Sites - -Google Sites Sample Web page:
-https://sites.google.com/view/gsites-embed-app/home - -![gsites-embed-03-ez-optimized](https://github.com/weaponsforge/climate-profile-full/assets/56998001/21c07402-904d-4e41-9988-9108c8c683cc) - ## Requirements 1. Windows, Linux or Mac OS From 7bcfdd43e311a48e81be305000f1179d395578f4 Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Tue, 30 May 2023 07:00:55 +0800 Subject: [PATCH 04/11] chore: Update README --- README.md | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 2e21381..7e50abd 100644 --- a/README.md +++ b/README.md @@ -1,13 +1,11 @@ ## climate-profile-full -This project creates rich CSS styled blog-like **Posts** or **Card-like** thumbnails web pages for embedding in Google Sites as external websites. +This project creates rich CSS-styled blog-like **Posts** or **Card-like** thumbnail web pages for embedding in Google Sites as external websites. -It also features a light-weight Content Management System (CMS) for creating and managing the Google Sites embeddable blog-like **Posts** and **Cards** content. +It also features a lightweight Content Management System (CMS) for creating and managing Google Site embeddable blog-like **Posts** and **Card** content. ### Using with Google Sites -Steps: - 1. Copy a File Card's `IFrame Embed URL`. 2. Paste the `IFrame Embed URL` in Google Site's **Embed from the web** - By URL input prompt. From 1e35700143a555561e891ba94796ff0ef526ce38 Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Tue, 30 May 2023 07:02:06 +0800 Subject: [PATCH 05/11] chore: Update README --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 7e50abd..11280f1 100644 --- a/README.md +++ b/README.md @@ -8,6 +8,7 @@ It also features a lightweight Content Management System (CMS) for creating and 1. Copy a File Card's `IFrame Embed URL`. 2. Paste the `IFrame Embed URL` in Google Site's **Embed from the web** - By URL input prompt. +3. Preview or Publish the Google Site draft page. Google Sites Sample Web page:
https://sites.google.com/view/gsites-embed-app/home From 7da9fc87cc230d781e2362063806645dcd03fc0c Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Tue, 30 May 2023 07:06:48 +0800 Subject: [PATCH 06/11] chore: Update README --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 11280f1..89528c9 100644 --- a/README.md +++ b/README.md @@ -53,7 +53,7 @@ password: useruser - Redux states are easy to debug using the Redux Dev tools. - People can easily follow where the centralized data stores and async data fetching methods are located in the code base when working in teams, especially for large, complex enterprise apps. - Redux state management will scale well with this app's incoming feature updates containing more complex data models and states. - - Redux has excellent documentation and a thriving community, and it has proven to be one of the most mature react state management libraries of all times. + - Redux has excellent documentation and a thriving community, and it has proven to be one of the most mature, albeit boilerplates and complex react state management libraries of all time. 4. **firebase v9.18.0** - Firebase, being a Backend-as-a-Service (Baas) makes it possible to create apps without creating a separate backend server app. - Firebase offers a Web (JavaScript) SDK for working on frontend (websites), and the Firebase Admin SDK for client-side scripting. From 4c3f8de3973976396fb498a2305203946a0b53ef Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Tue, 30 May 2023 07:15:12 +0800 Subject: [PATCH 07/11] chore: Update README --- README.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 89528c9..f3804f5 100644 --- a/README.md +++ b/README.md @@ -55,14 +55,14 @@ password: useruser - Redux state management will scale well with this app's incoming feature updates containing more complex data models and states. - Redux has excellent documentation and a thriving community, and it has proven to be one of the most mature, albeit boilerplates and complex react state management libraries of all time. 4. **firebase v9.18.0** - - Firebase, being a Backend-as-a-Service (Baas) makes it possible to create apps without creating a separate backend server app. - - Firebase offers a Web (JavaScript) SDK for working on frontend (websites), and the Firebase Admin SDK for client-side scripting. + - Firebase, being a Backend-as-a-Service (Baas), makes it possible to create apps without creating a separate backend server app. + - Firebase offers a Web (JavaScript) SDK for working on the frontend (websites) and the Firebase Admin SDK for client-side scripting. - Firebase offers ready to use Authentication systems - - Firestore database provides a light-weight document database useful for storing and querying simple data. Security Rules are enforced thru Firebase Security Rules. - - Firebase Storage provides an easy to use and access container for rich-data content. Security Rules are enforced thru Firebase Storage Security Rules. - - Firebase offers generous limits for testing and playing around with it's Spark (standard) plan after which users can opt to upgrade to the Blaze (paid) Plan as needed. + - Firestore database provides a lightweight document database for storing and querying simple data. Security is enforced using the Firebase Security Rules. + - Firebase Storage provides an easy-to-use and access container for rich-data content. Security is enforced using the Firebase Storage Security Rules. + - Firebase offers generous limits for testing and playing around with its Spark (standard) plan, after which users can upgrade to the Blaze (paid) Plan as needed. 5. **firebase-admin v11.5.0** - - The Firebase Admin SDK allows elevated scripting access to various Firebase services which are not available in the Firebase (JavaScript) SDK. + - The Firebase Admin SDK allows elevated scripting access to various Firebase services, that are not available when using the Firebase (JavaScript) SDK. ## Installation From df540f9d86c36c985172168966c018683afbdf14 Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Tue, 30 May 2023 09:36:10 +0800 Subject: [PATCH 08/11] feat: Copy a file card's category url to clipboard --- .../common/ui/smartnotification/index.js | 2 +- .../components/formitemsview/index.js | 39 +++++++++++++++---- 2 files changed, 32 insertions(+), 9 deletions(-) diff --git a/client/components/common/ui/smartnotification/index.js b/client/components/common/ui/smartnotification/index.js index 0f53724..4fd4c3e 100644 --- a/client/components/common/ui/smartnotification/index.js +++ b/client/components/common/ui/smartnotification/index.js @@ -27,7 +27,7 @@ function SmartNotification () { {(open && notification !== '') && dispatch(resetMessage())} sx={{ maxWidth: '600px', diff --git a/client/features/filecards/components/formitemsview/index.js b/client/features/filecards/components/formitemsview/index.js index a7a0cd5..ee281c3 100644 --- a/client/features/filecards/components/formitemsview/index.js +++ b/client/features/filecards/components/formitemsview/index.js @@ -1,5 +1,5 @@ import { useState, useCallback, useEffect, useMemo } from 'react' -import { useDispatch } from 'react-redux' +import { useDispatch, useSelector } from 'react-redux' import Link from 'next/link' import PropTypes from 'prop-types' @@ -20,17 +20,20 @@ import { MESSAGE_SEVERITY } from '@/store/app/appSlice' function FormItemsView ({ card }) { const [embedUrl, setEmbedUrl] = useState('') const dispatch = useDispatch() + const notification = useSelector(state => state.app.notification) const collapse = useMediaQuery('(max-width:1100px)') const subDirectory = (process.env.NEXT_PUBLIC_BASE_PATH !== '') ? process.env.NEXT_PUBLIC_BASE_PATH : '' - const incrementTimestamp = useCallback(() => { + const incrementTimestamp = useCallback((isCard = true) => { const timestamp = Math.floor((new Date()).getTime() / 1000) return (card !== null) - ? `${window.location.origin}${subDirectory}/cards/embed?id=${card.id}&ts=${timestamp}` + ? (isCard) + ? `${window.location.origin}${subDirectory}/cards/embed?id=${card.id}&ts=${timestamp}` + : `${window.location.origin}${subDirectory}/cards/gallery?category=${card.category}&ts=${timestamp}` : window.location.origin }, [card, subDirectory]) @@ -41,12 +44,12 @@ function FormItemsView ({ card }) { }, [card, subDirectory]) useEffect(() => { - const embed = incrementTimestamp() + const embed = incrementTimestamp(true) setEmbedUrl(embed) }, [incrementTimestamp]) - const copyToClipboard = () => { - const embed = incrementTimestamp() + const copyToClipboard = (isCard = true) => { + const embed = incrementTimestamp(isCard) setEmbedUrl(embed) navigator.clipboard.writeText(embed) @@ -122,13 +125,19 @@ function FormItemsView ({ card }) { - - Press the Copy Button to copy the IFrame embed URL to clipboard + Press the Copy Button to copy this card's IFrame embed URL to clipboard {/** Cards Gallery URL */} @@ -143,7 +152,21 @@ function FormItemsView ({ card }) { {cardGalleryURL} + + + + + Press the Copy Button to copy the {card.category} cards gallery embed URL to clipboard + From 1709e0ee9a9c0c00edccd81decd9371a4a006f04 Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Tue, 30 May 2023 10:07:24 +0800 Subject: [PATCH 09/11] chore: Add a full page embed file cards group example, #113 --- README.md | 35 +++++++++++++++++++++++++---------- 1 file changed, 25 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index f3804f5..1920a6a 100644 --- a/README.md +++ b/README.md @@ -4,8 +4,24 @@ This project creates rich CSS-styled blog-like **Posts** or **Card-like** thumbn It also features a lightweight Content Management System (CMS) for creating and managing Google Site embeddable blog-like **Posts** and **Card** content. +### Online App Demo + +#### Production App +https://weaponsforge.github.io/climate-profile-full/ + +#### Development (Playground) App +https://climate-profile-dev.web.app/ + +``` +EXAMPLE USER (Development App Only) +email: user@gmail.com +password: useruser +``` + ### Using with Google Sites +### A. Embed a File Card + 1. Copy a File Card's `IFrame Embed URL`. 2. Paste the `IFrame Embed URL` in Google Site's **Embed from the web** - By URL input prompt. 3. Preview or Publish the Google Site draft page. @@ -15,19 +31,18 @@ https://sites.google.com/view/gsites-embed-app/home ![gsites-embed-03-ez-optimized](https://github.com/weaponsforge/climate-profile-full/assets/56998001/21c07402-904d-4e41-9988-9108c8c683cc) -### Online Demo +### B. Embed a Full Page Containing a Group of File Cards -#### Production App -https://weaponsforge.github.io/climate-profile-full/ +1. Copy a File Card's `Cards Gallery URL`. +2. Create a **Full page embed** Google Site draft page. +3. Press the **Add embed** button in the resulting blank page and paste the `Cards Gallery URL` in the **Embed from the web** - By URL input prompt. + - This page will display all File Cards with similar `"category"` field value like the current Card. +4. Preview or Publish the Google Site draft page. -#### Development App -https://climate-profile-dev.web.app/ +Google Sites Sample Web page:
+https://sites.google.com/view/gsites-embed-app/full-page -``` -EXAMPLE USER (Development App Only) -email: user@gmail.com -password: useruser -``` +![gsites-full-embed-ez](https://github.com/weaponsforge/climate-profile-full/assets/56998001/dce2c297-3e3d-4073-a9f2-5f51a2590a91) ## Requirements From ed6b15e4cad3921115ec47f1817987ca0c2e830f Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Sun, 9 Jul 2023 02:30:39 +0800 Subject: [PATCH 10/11] feat: Include compressed zip archive mime type in the allowed files whitelist, #126 --- client/features/filecards/constants/mimetypes.json | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/client/features/filecards/constants/mimetypes.json b/client/features/filecards/constants/mimetypes.json index 48284e3..14b8846 100644 --- a/client/features/filecards/constants/mimetypes.json +++ b/client/features/filecards/constants/mimetypes.json @@ -152,5 +152,12 @@ "EXT": ".zip", "LABEL": "ZIP archive (.zip)", "CODE": "ARCHIVE_ZIP" + }, + { + "id": 22, + "MIME_TYPE": "application/x-zip-compressed", + "EXT": ".zip", + "LABEL": "ZIP archive compressed (.zip)", + "CODE": "ARCHIVE_ZIP_COMPRESSED" } ] From d89cb7eebfb0e7ef1b7590b835de3ceb0dca3971 Mon Sep 17 00:00:00 2001 From: weaponsforge Date: Sun, 9 Jul 2023 02:31:03 +0800 Subject: [PATCH 11/11] chore: Update README --- README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/README.md b/README.md index 1920a6a..47af781 100644 --- a/README.md +++ b/README.md @@ -97,5 +97,9 @@ https://sites.google.com/view/gsites-embed-app/full-page 2. Follow the instructions in the README files inside the **/client** and **/server** directories for more information on configuring and using the client and server apps. +3. Create an account after setting up the **/server** `.env` using the instructions in it's README file.
+ - Navigate to the /server directory from the commandline and run:
+`npm run user:create --email=randomemail@gmail.com --password=anypasasword --displayname="Game Tester" --emailverified=true` + @weaponsforge
20230326