Bump braces from 3.0.2 to 3.0.3

Bumps [braces](https://github.com/micromatch/braces) from 3.0.2 to 3.0.3.
- [Changelog](https://github.com/micromatch/braces/blob/master/CHANGELOG.md)
- [Commits](https://github.com/micromatch/braces/compare/3.0.2...3.0.3)

---
updated-dependencies:
- dependency-name: braces
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>

.github/workflows/codeql-analysis.yml

@@ -13,12 +13,12 @@ name: "CodeQL"
 
 on:
   push:
-    branches: [ main ]
+    branches: [main, stable]
   pull_request:
     # The branches below must be a subset of the branches above
-    branches: [ main ]
+    branches: [main, stable]
   schedule:
-    - cron: '21 19 * * 4'
+    - cron: "21 19 * * 4"
 
 jobs:
   analyze:
@@ -32,7 +32,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        language: [ 'javascript' ]
+        language: ["javascript"]
         # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby' ]
         # Learn more about CodeQL language support at https://git.io/codeql-language-support
 
@@ -42,7 +42,7 @@ jobs:
 
       # Initializes the CodeQL tools for scanning.
       - name: Initialize CodeQL
-      uses: github/codeql-action/init@v1
+        uses: github/codeql-action/init@v2
         with:
           languages: ${{ matrix.language }}
           # If you wish to specify custom queries, you can do so here or in a config file.
@@ -53,7 +53,7 @@ jobs:
       # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
       # If this step fails, then you should remove it and run the build manually (see below)
       - name: Autobuild
-      uses: github/codeql-action/autobuild@v1
+        uses: github/codeql-action/autobuild@v2
 
       # ℹ️ Command-line programs to run using the OS shell.
       # 📚 https://git.io/JvXDl
@@ -67,4 +67,4 @@ jobs:
       #   make release
 
       - name: Perform CodeQL Analysis
-      uses: github/codeql-action/analyze@v1
+        uses: github/codeql-action/analyze@v2

.github/workflows/main.yml

@@ -6,24 +6,35 @@ name: Node.js CI
 on:
   # Trigger the workflow on push or pull request,
   push:
-    branches:
+    branches: [main, stable]
-      # All branches
-      - 'main'
   pull_request:
     # These types of PRs
     types: [opened, synchronize, reopened]
 
 jobs:
   build:
-
     runs-on: ubuntu-latest
 
     strategy:
       matrix:
-        node-version: [14.x, 16.x, 18.x]
+        node-version: [14.x, 16.x, 18.x, 20.x]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
     steps:
       - uses: actions/checkout@v2
+
+      # NPM
+      # - name: Use Node.js ${{ matrix.node-version }}
+      #   uses: actions/setup-node@v2
+      #   with:
+      #     node-version: ${{ matrix.node-version }}
+      #     cache: 'npm'
+      # - run: npm i
+      # - run: npm run lint
+      # - run: npm run build
+      # # - run: npm run start
+      # - run: npm run test
+
+      # YARN
       - uses: borales/actions-yarn@v3.0.0
         with:
           cmd: install # will run `yarn install` command

.github/workflows/njsscan-analysis.yml

@@ -10,12 +10,12 @@ name: njsscan sarif
 
 on:
   push:
-    branches: [ main ]
+    branches: [main, stable]
   pull_request:
     # The branches below must be a subset of the branches above
-    branches: [ main ]
+    branches: [main, stable]
   schedule:
-    - cron: '15 15 * * 5'
+    - cron: "15 15 * * 5"
 
 jobs:
   njsscan:
@@ -28,8 +28,8 @@ jobs:
         id: njsscan
         uses: ajinabraham/njsscan-action@7237412fdd36af517e2745077cedbf9d6900d711
         with:
-        args: '. --sarif --output results.sarif || true'
+          args: ". --sarif --output results.sarif || true"
       - name: Upload njsscan report
-      uses: github/codeql-action/upload-sarif@v1
+        uses: github/codeql-action/upload-sarif@v2
         with:
           sarif_file: results.sarif

.prettierignore

@@ -14,4 +14,5 @@ next-env.d
 package*
 tsconfig.json
 yarn.lock
+package.lock
 next.config.js

.yarnrc.yml

@@ -1,7 +1,7 @@
+compressionLevel: mixed
+
+enableGlobalCache: false
+
 nodeLinker: node-modules
 
-plugins:
+yarnPath: .yarn/releases/yarn-4.1.0.cjs
-  - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
-    spec: "@yarnpkg/plugin-interactive-tools"
-
-yarnPath: .yarn/releases/yarn-3.2.1.cjs

package.json

@@ -2,7 +2,7 @@
   "private": true,
   "name": "lucid-creations-media-potty-chart",
   "homepage": "https://lucidcreations.media/introducing-code-name-potty-chart/",
-  "version": "0.1.1",
+  "version": "0.1.26",
   "author": {
     "name": "Lucid Creations Media",
     "url": "https://lucidcreations.media",
@@ -16,36 +16,34 @@
     "pretty": "prettier --write ."
   },
   "dependencies": {
-    "@chakra-ui/react": "^2.2.1",
+    "@chakra-ui/react": "^2.8.2",
-    "@emotion/react": "^11.9.3",
+    "@emotion/react": "^11.11.4",
-    "@emotion/styled": "^11.9.3",
+    "@emotion/styled": "^11.11.0",
-    "@iconify/react": "^3.2.2",
+    "@iconify/react": "^4.1.1",
-    "@reduxjs/toolkit": "^1.8.2",
+    "@reduxjs/toolkit": "^2.2.2",
-    "date-fns": "^2.28.0",
+    "date-fns": "^3.6.0",
-    "formik": "^2.2.9",
+    "formik": "^2.4.5",
-    "framer-motion": "^6.3.15",
+    "framer-motion": "^11.0.20",
-    "next": "12.1.6",
+    "next": "14.1.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-redux": "^8.0.2",
+    "react-redux": "^9.1.0",
-    "sharp": "^0.30.7"
+    "sharp": "^0.33.3"
   },
   "devDependencies": {
-    "@types/node": "^18.0.0",
+    "@types/node": "^20.11.30",
-    "@types/react": "^18.0.14",
+    "@types/react": "^18.2.70",
-    "@types/react-redux": "^7.1.24",
+    "@types/react-redux": "^7.1.33",
-    "@typescript-eslint/eslint-plugin": "^5.29.0",
+    "@typescript-eslint/eslint-plugin": "^7.4.0",
-    "eslint": "^8.18.0",
+    "@typescript-eslint/parser": "^7.4.0",
-    "eslint-config-next": "^12.1.6",
+    "eslint": "^8.57.0",
-    "eslint-config-prettier": "^8.5.0",
+    "eslint-config-next": "<13.4.9",
-    "eslint-plugin-jsx-a11y": "^6.6.0",
+    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-react": "^7.30.1",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
-    "eslint-plugin-react-hooks": "<4.6.0",
+    "eslint-plugin-react": "^7.34.1",
-    "prettier": "^2.7.1",
+    "eslint-plugin-react-hooks": "^4.6.0",
-    "typescript": "^4.7.4"
+    "prettier": "^3.2.5",
+    "typescript": "^5.4.3"
   },
-  "resolutions": {
+  "packageManager": "yarn@4.1.0"
-    "@types/react": "^17.0.38"
-  },
-  "packageManager": "yarn@3.2.1"
 }

public/robots.txt

@@ -0,0 +1,23 @@
+# Used for many other (non-commercial) purposes as well
+User-agent: CCBot
+Disallow: /
+
+# For new training only
+User-agent: GPTBot
+Disallow: /
+
+# Not for training, only for user requests
+User-agent: ChatGPT-User
+Disallow: /
+
+# Marker for disabling Bard and Vertex AI
+User-agent: Google-Extended
+Disallow: /
+
+# Speech synthesis only?
+User-agent: FacebookBot
+Disallow: /
+
+# Multi-purpose, commercial uses; including LLMs
+User-agent: Omgilibot
+Disallow: /

src/components/buttons/KoFi.tsx

@@ -5,15 +5,15 @@ import { motion } from "framer-motion";
 
 const MotionBox = motion<BoxProps>(Box);
 
-const Patreon = (): JSX.Element => {
+const KoFi = (): JSX.Element => {
   return (
     <MotionBox whileHover={{ scale: 1.1 }} whileTap={{ scale: 0.9 }}>
       <Link
-        href="https://www.patreon.com/bePatron?u=15380906"
+        href="https://ko-fi.com/lucidcreationsmedia"
         target="_blank"
         rel="noopener"
       >
-        <Button variant="patreon" leftIcon={<Icon icon="ri:patreon-fill" />}>
+        <Button variant="kofi" leftIcon={<Icon icon="cib:ko-fi" />}>
           {"Fund The App"}
         </Button>
       </Link>
@@ -21,4 +21,4 @@ const Patreon = (): JSX.Element => {
   );
 };
 
-export default Patreon;
+export default KoFi;

src/components/buttons/Twitter.tsx

@@ -1,27 +0,0 @@
-import React from "react";
-import { Box, Link, Button, BoxProps } from "@chakra-ui/react";
-import { Icon } from "@iconify/react";
-import { motion } from "framer-motion";
-
-const MotionBox = motion<BoxProps>(Box);
-
-const Twitter = (): JSX.Element => {
-  return (
-    <MotionBox whileHover={{ scale: 1.1 }} whileTap={{ scale: 0.9 }}>
-      <Link
-        href="https://www.patreon.com/bePatron?u=15380906"
-        target="_blank"
-        rel="noopener"
-      >
-        <Button
-          variant="twitter"
-          leftIcon={<Icon icon="akar-icons:twitter-fill" />}
-        >
-          {"Dev Updates"}
-        </Button>
-      </Link>
-    </MotionBox>
-  );
-};
-
-export default Twitter;

src/components/buttons/data/links.ts

@@ -1,7 +1,7 @@
 export interface LinkObj {
   href?: string;
   name?: string;
-  type: "primary" | "secondary" | "twitter" | "patreon";
+  type: "primary" | "secondary" | "updates" | "ko-fi";
 }
 
 type Links = LinkObj[];
@@ -13,15 +13,17 @@ const links: Links = [
     type: "secondary"
   },
   {
-    href: "https://lucidcreations.media/introducing-code-name-potty-chart/",
+    href: "https://lucidcreations.media/lcm-potty-chart/",
-    name: "Original Announcement",
+    name: "Official Announcement",
     type: "secondary"
   },
+  // {
+  //   type: "ko-fi"
+  // },
   {
-    type: "patreon"
+    href: "https://t.me/LucidCreationsMedia",
-  },
+    name: "Dev Updates",
-  {
+    type: "secondary"
-    type: "twitter"
   }
 ];
 

src/components/buttons/index.tsx

@@ -2,8 +2,7 @@ import React from "react";
 import { Box, HStack, VStack } from "@chakra-ui/react";
 import CustomButton from "./Custom";
 import links, { LinkObj } from "./data/links";
-import Patreon from "./Patreon";
+import KoFi from "./KoFi";
-import Twitter from "./Twitter";
 
 const Buttons = (): JSX.Element => {
   return (
@@ -30,12 +29,8 @@ const Buttons = (): JSX.Element => {
             );
           }
 
-          if (type === "patreon") {
+          if (type === "ko-fi") {
-            return <Patreon key={type} />;
+            return <KoFi key={type} />;
-          }
-
-          if (type === "twitter") {
-            return <Twitter key={type} />;
           }
         })}
       </HStack>
@@ -61,12 +56,8 @@ const Buttons = (): JSX.Element => {
             );
           }
 
-          if (type === "patreon") {
+          if (type === "ko-fi") {
-            return <Patreon key={type} />;
+            return <KoFi key={type} />;
-          }
-
-          if (type === "twitter") {
-            return <Twitter key={type} />;
           }
         })}
       </VStack>

src/components/calender/CalenderNav.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { useAppSelector } from "../../app/hooks";
+import { useAppSelector } from "../../redux/hooks";
 import { useRouter } from "next/router";
 import { HStack, IconButton } from "@chakra-ui/react";
 import { Icon } from "@iconify/react";

src/components/calender/DatePicker.tsx

@@ -256,7 +256,8 @@ const DatePicker = ({ title, isLoading }: DatePickerProps): JSX.Element => {
                             )}
                           </HStack>
                           <FormErrorMessage>
-                            {form.errors.date}
+                            {typeof form.errors.date === "string" &&
+                              form.errors.date}
                           </FormErrorMessage>
                         </VStack>
                       </FormControl>

src/components/calender/Day.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from "react";
 import { Provider } from "react-redux";
-import { store } from "../../app/store";
+import { store } from "../../redux/store";
 import { Box, Skeleton, VStack } from "@chakra-ui/react";
 import {
   add,

src/components/calender/index.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { useAppDispatch, useAppSelector } from "../../app/hooks";
+import { useAppDispatch, useAppSelector } from "../../redux/hooks";
 import { updateCurrDate, updateMonth } from "../../features/calender";
 import { Box, HStack, SimpleGrid, Text, VStack } from "@chakra-ui/react";
 import { isSameDay, format } from "date-fns";

src/components/calender/modals/AddUpdateSticker.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef } from "react";
-import { useAppDispatch } from "../../../app/hooks";
+import { useAppDispatch } from "../../../redux/hooks";
 import { addEditSticker } from "../../../features/calender/stickers";
 import {
   Button,

src/components/tutorial/CalenderExample.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { useAppDispatch, useAppSelector } from "../../app/hooks";
+import { useAppDispatch, useAppSelector } from "../../redux/hooks";
 import { updateMonth } from "../../features/calender";
 import { Box, HStack, SimpleGrid, Text, VStack } from "@chakra-ui/react";
 import { format, isSameDay, isToday } from "date-fns";

src/components/tutorial/sections/TutorialSubmitButtons.tsx

@@ -1,6 +1,6 @@
 import { HStack, Button, VStack, Checkbox } from "@chakra-ui/react";
 import React from "react";
-import { useAppDispatch, useAppSelector } from "../../../app/hooks";
+import { useAppDispatch, useAppSelector } from "../../../redux/hooks";
 import {
   setTutorialCompleted,
   setTempTutorialComplete,

src/pages/_app.tsx

@@ -3,7 +3,7 @@ import React from "react";
 import { ChakraProvider } from "@chakra-ui/react";
 import AppTheme from "../theme/AppTheme";
 import { Provider } from "react-redux";
-import { store } from "../app/store";
+import { store } from "../redux/store";
 import Layout from "../theme/layout/Layout";
 import Head from "next/head";
 

src/pages/calendar/[...date].tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from "react";
 import { Provider } from "react-redux";
-import { store } from "../../app/store";
+import { store } from "../../redux/store";
 import { Box } from "@chakra-ui/react";
 import { useRouter } from "next/router";
 import {

src/pages/index.tsx

@@ -1,7 +1,7 @@
 import React, { Fragment, useEffect, useRef } from "react";
 import { Provider } from "react-redux";
-import { store } from "../app/store";
+import { store } from "../redux/store";
-import { useAppDispatch, useAppSelector } from "../app/hooks";
+import { useAppDispatch, useAppSelector } from "../redux/hooks";
 import { updateLoading } from "../features/calender";
 import {
   clearTutorialCompleted,

src/theme/AppTheme.ts

@@ -29,7 +29,7 @@ const AppTheme = extendTheme({
       footer: "#0097a7",
       footerText: "black",
       content: "#2d3748",
-      patreon: "#FF424D",
+      kofi: "#FF5E5B",
       twitter: "#1da1f2"
     },
     loading: {

src/theme/components/buttonStyles.ts

@@ -1,10 +1,5 @@
 /* eslint-disable @typescript-eslint/explicit-module-boundary-types */
-import {
+import { darken, mode, whiten } from "@chakra-ui/theme-tools";
-  darken,
-  mode,
-  StyleFunctionProps,
-  whiten
-} from "@chakra-ui/theme-tools";
 import { Dict } from "@chakra-ui/utils";
 
 const buttonStyles = {
@@ -14,7 +9,7 @@ const buttonStyles = {
   sizes: {},
   // styles for different visual variants ("outline", "solid")
   variants: {
-    primary: (props: Dict<never> | StyleFunctionProps) => ({
+    primary: (props: Dict<never>) => ({
       bg: "brand.primary",
       fontSize: "xl",
       py: 3,
@@ -27,7 +22,7 @@ const buttonStyles = {
         )(props)
       }
     }),
-    secondary: (props: Dict<never> | StyleFunctionProps) => ({
+    secondary: (props: Dict<never>) => ({
       bg: "brand.secondary",
       fontSize: "xl",
       py: 3,
@@ -40,7 +35,7 @@ const buttonStyles = {
         )(props)
       }
     }),
-    skip: (props: Dict<never> | StyleFunctionProps) => ({
+    skip: (props: Dict<never>) => ({
       bg: "transparent",
       fontSize: "xl",
       py: 3,
@@ -51,7 +46,7 @@ const buttonStyles = {
         color: "whiteAlpha.900"
       }
     }),
-    stickerButton: (props: Dict<never> | StyleFunctionProps) => ({
+    stickerButton: (props: Dict<never>) => ({
       bg: "transparent",
       fontSize: "4rem",
       px: 2,
@@ -63,7 +58,7 @@ const buttonStyles = {
         )(props)
       }
     }),
-    nav: (props: Dict<never> | StyleFunctionProps) => ({
+    nav: (props: Dict<never>) => ({
       bg: "transparent",
       fontSize: "md",
       px: 2,
@@ -82,7 +77,7 @@ const buttonStyles = {
         textDecoration: "underline"
       }
     }),
-    footer: (props: Dict<never> | StyleFunctionProps) => ({
+    footer: (props: Dict<never>) => ({
       bg: "brand.main",
       fontSize: "lg",
       py: 3,
@@ -92,7 +87,7 @@ const buttonStyles = {
         bg: mode(whiten("brand.main", 20), darken("brand.main", 20))(props)
       }
     }),
-    backToTop: (props: Dict<never> | StyleFunctionProps) => ({
+    backToTop: (props: Dict<never>) => ({
       bg: "rgba(23, 25, 35, 0.5)",
       fontSize: "lg",
       py: 2,
@@ -112,7 +107,7 @@ const buttonStyles = {
         border: "1px solid rgba(0, 134, 255, 1)"
       }
     }),
-    submit: (props: Dict<never> | StyleFunctionProps) => ({
+    submit: (props: Dict<never>) => ({
       fontSize: "lg",
       py: 2,
       px: 4,
@@ -131,7 +126,7 @@ const buttonStyles = {
         }
       }
     }),
-    mobileNav: (props: Dict<never> | StyleFunctionProps) => ({
+    mobileNav: (props: Dict<never>) => ({
       // bg: "transparent",
       fontSize: "md",
       px: 2,
@@ -152,19 +147,16 @@ const buttonStyles = {
         border: "1px solid #0068ff"
       }
     }),
-    patreon: (props: Dict<never> | StyleFunctionProps) => ({
+    kofi: (props: Dict<never>) => ({
-      bg: "brand.patreon",
+      bg: "brand.kofi",
       fontSize: "lg",
       p: 3,
       color: "whiteAlpha",
       _hover: {
-        bg: mode(
+        bg: mode(whiten("brand.kofi", 20), darken("brand.kofi", 20))(props)
-          whiten("brand.patreon", 20),
-          darken("brand.patreon", 20)
-        )(props)
       }
     }),
-    twitter: (props: Dict<never> | StyleFunctionProps) => ({
+    twitter: (props: Dict<never>) => ({
       bg: "brand.twitter",
       fontSize: "lg",
       py: 3,

src/theme/layout/Footer.tsx

@@ -1,48 +1,9 @@
 import React /*, { useEffect, useRef, useState }*/ from "react";
-import {
+import { Box, Text, VStack, Link } from "@chakra-ui/react";
-  Box,
-  Text,
-  VStack,
-  Link,
-  // Image,
-  Button,
-  BoxProps
-} from "@chakra-ui/react";
 // import BackToTopButton from "./BackToTopButton";
-import { motion } from "framer-motion";
-import Patreon from "../../components/buttons/Patreon";
-import CustomButton from "../../components/buttons/Custom";
-import Twitter from "../../components/buttons/Twitter";
 import Buttons from "../../components/buttons";
 
-const MotionBox = motion<BoxProps>(Box);
-
 const Footer = (): JSX.Element => {
-  // const [showBackToTop, setShowBackToTop] = useState<boolean>(false);
-  // const lastScroll = useRef<number>(0);
-
-  // const handleScroll = (): void => {
-  //   if (window.scrollY >= 500) {
-  //     setShowBackToTop(true);
-  //   } else {
-  //     setShowBackToTop(false);
-  //   }
-
-  //   const currentScroll =
-  //     window.pageYOffset || document.documentElement.scrollTop;
-
-  //   lastScroll.current = currentScroll <= 0 ? 0 : currentScroll;
-  // };
-
-  // useEffect(() => {
-  //   if (!window) {
-  //     console.log("waiting for mount");
-  //   } else if (window) {
-  //     window.addEventListener("scroll", handleScroll);
-  //   }
-
-  //   return () => window.removeEventListener("scroll", handleScroll);
-  // }, []);
   return (
     <Box bg="brand.footer" as="footer" w="100%" h="auto">
       {/* <BackToTopButton show={showBackToTop} /> */}
@@ -55,21 +16,6 @@ const Footer = (): JSX.Element => {
         justifyContent="center"
       >
         <VStack spacing={4}>
-          {/* <MotionBox whileHover={{ scale: 1.1 }} whileTap={{ scale: 0.9 }}>
-            <Link
-              href="https://github.com/LucidCreationsMedia"
-              target="_blank"
-              rel="noopener"
-            >
-              <Button
-                color="whiteAlpha"
-                variant="credits"
-                leftIcon={<Icon icon="akar-icons:github-fill" />}
-              >
-                View Codebase
-              </Button>
-            </Link>
-          </MotionBox> */}
           <Buttons />
           <Text color="brand.footerText" fontSize="xs">
             &copy;

src/theme/layout/Header.tsx

@@ -115,7 +115,7 @@ const Header = (): JSX.Element => {
           cursor: "default"
         }}
       >
-        <Image height="30px" width="30px" src={appLogo} alt="App Logo" />
+        <Image height="30" width="30" src={appLogo} alt="App Logo" />
 
         <Heading as="h1" size="md">
           {appName}
@@ -150,7 +150,7 @@ const Header = (): JSX.Element => {
                 cursor: "default"
               }}
             >
-              <Image height="30px" width="30px" src={appLogo} alt="App Logo" />
+              <Image height="30" width="30" src={appLogo} alt="App Logo" />
               <Heading as="h1" size="md">
                 {appName}
               </Heading>