refactor and fix github actions

.github/workflows/packages.yml

@@ -5,7 +5,7 @@ on:
     - cron: "0 0 * * *"
 
 jobs:
-  fetch-news:
+  npm-packages:
     runs-on: ubuntu-latest
     defaults:
       run:
@@ -33,8 +33,8 @@ jobs:
 
       - name: Move packages.json
         run: |-
-          git add news.json
-          git mv -f news.json ../../api/packages.json
+          git add npm-packages.json
+          git mv -f npm-packages.json ../../api/packages.json
 
       - name: Commit and push if changed
         run: |-

ui/index.html

@@ -42,21 +42,7 @@
 			content="https://www.binarytree.dev/bt.jpg"
 		/>
 
-		<!-- Google tag (gtag.js) -->
-		<!-- <script
-			async
-			src="https://www.googletagmanager.com/gtag/js?id=G-9K8N22TZZS"
-		></script> -->
 		<script src="https://static.airtable.com/js/embed/embed_snippet_v1.js"></script>
-		<!-- <script>
-			window.dataLayer = window.dataLayer || [];
-			function gtag() {
-				dataLayer.push(arguments);
-			}
-			gtag("js", new Date());
-
-			gtag("config", "G-9K8N22TZZS");
-		</script> -->
 
 		<meta charset="UTF-8" />
 		<link rel="icon" type="image/svg+xml" href="/logo.svg" />

ui/src/pages/Footer/CookieConsent/components/CookieConsentText/index.tsx

@@ -0,0 +1,14 @@
+import { Link } from "react-router-dom";
+
+const CookieConsentText = () => (
+	<>
+		This website uses cookies to enhance the user experience. If you are
+		interested to know about our cookie policy then{" "}
+		<Link to="/cookie-policy" style={{ color: "white" }}>
+			check out
+		</Link>{" "}
+		here
+	</>
+);
+
+export default CookieConsentText;

ui/src/pages/Footer/CookieConsent/index.tsx

@@ -3,29 +3,31 @@ import CookiConsent, {
 	Cookies,
 	getCookieConsentValue,
 } from "react-cookie-consent";
-import { Link } from "react-router-dom";
 import ReactGA from "react-ga4";
 import usePageTitle from "components/Hoc/withPageTitle/utils/hooks";
+import {
+	BUTTON_STYLES,
+	COOKIE_CONSENT_STYLES,
+	GOOGLE_ANALYTICS_COOKIES,
+	GOOGLE_ANALYTICS_ID,
+	HIT_TYPE,
+} from "./utils/constants";
+import CookieConsentText from "./components/CookieConsentText";
 
 const CookieConsent: React.FC = () => {
 	const { title, url } = usePageTitle();
 
 	const handleAcceptCookie = () => {
-		const GOOGLE_ANALYTICS_ID = "G-9K8N22TZZS";
-		if (GOOGLE_ANALYTICS_ID) {
-			ReactGA.initialize(GOOGLE_ANALYTICS_ID);
-			ReactGA.send({
-				hitType: "pageview",
-				page: url,
-				title,
-			});
-		}
+		ReactGA.initialize(GOOGLE_ANALYTICS_ID);
+		ReactGA.send({
+			hitType: HIT_TYPE,
+			page: url,
+			title,
+		});
 	};
 
 	const handleDeclineCookie = () => {
-		Cookies.remove("_ga");
-		Cookies.remove("_gat");
-		Cookies.remove("_gid");
+		GOOGLE_ANALYTICS_COOKIES.forEach((cookie) => Cookies.remove(cookie));
 	};
 
 	useEffect(() => {
@@ -34,40 +36,21 @@ const CookieConsent: React.FC = () => {
 			handleAcceptCookie();
 		}
 	}, []);
+
 	return (
 		<CookiConsent
 			onAccept={handleAcceptCookie}
 			onDecline={handleDeclineCookie}
 			enableDeclineButton
 			flipButtons={true}
-			style={{
-				maxWidth: "350px",
-				margin: "20px",
-				borderRadius: "10px",
-				fontSize: "17px",
-			}}
-			buttonStyle={{
-				padding: "8px 20px",
-				fontSize: "17px",
-				borderRadius: "2px",
-			}}
-			declineButtonStyle={{
-				padding: "8px 20px",
-				fontSize: "17px",
-				borderRadius: "2px",
-			}}
+			style={COOKIE_CONSENT_STYLES}
+			buttonStyle={BUTTON_STYLES}
+			declineButtonStyle={BUTTON_STYLES}
 			declineButtonClasses=""
 			declineButtonText="Decline"
 			buttonText="Accept"
 		>
-			<div>
-				This website uses cookies to enhance the user experience. if you
-				are interested to know about our cookie policy then{" "}
-				<Link to={"/cookie-policy"} style={{ color: "white" }}>
-					check out
-				</Link>{" "}
-				here
-			</div>
+			<CookieConsentText />
 		</CookiConsent>
 	);
 };

ui/src/pages/Footer/CookieConsent/utils/constants.ts

@@ -0,0 +1,24 @@
+const GOOGLE_ANALYTICS_ID = "G-9K8N22TZZS";
+const GOOGLE_ANALYTICS_COOKIES = ["_ga", "_gat", "_gid"];
+const HIT_TYPE = "pageview";
+
+const COOKIE_CONSENT_STYLES = {
+	maxWidth: "350px",
+	margin: "20px",
+	borderRadius: "10px",
+	fontSize: "17px",
+};
+
+const BUTTON_STYLES = {
+	padding: "8px 20px",
+	fontSize: "17px",
+	borderRadius: "2px",
+};
+
+export {
+	GOOGLE_ANALYTICS_ID,
+	GOOGLE_ANALYTICS_COOKIES,
+	HIT_TYPE,
+	COOKIE_CONSENT_STYLES,
+	BUTTON_STYLES,
+};

ui/src/pages/Routes/utils/constant.tsx

@@ -29,6 +29,7 @@ import {
 	Pixel,
 	Platform,
 	Plugin,
+	PrivacyPolicy,
 	QRcode,
 	ShadesAndTints,
 	Sorting,
@@ -42,7 +43,6 @@ import {
 	UiUx,
 	YouTube,
 } from "pages/pages";
-import PrivacyPolicy from "pages/PrivacyPolicy";
 
 export const routes: Route[] = [
 	{
@@ -314,34 +314,39 @@ export const routes: Route[] = [
 		title: "About",
 		description: "All the juicy details about us.",
 		component: About,
+		isFeature: false,
 	},
 	{
 		id: "feedback",
 		path: "/feedback",
 		title: "Feedback",
 		description: "We're all ears for your cheers or jeers.",
 		component: Feedback,
+		isFeature: false,
 	},
 	{
 		id: "terms",
 		path: "/terms",
 		title: "",
 		description: "",
 		component: Terms,
+		isFeature: false,
 	},
 	{
 		id: "privacypolicy",
 		path: "/privacy-policy",
 		title: "",
 		description: "",
 		component: PrivacyPolicy,
+		isFeature: false,
 	},
 	{
 		id: "pagenotfound",
 		path: "*",
 		title: "Page Not Found",
 		description: "",
 		component: PageNotFound,
+		isFeature: false,
 	},
 ];
 

ui/src/pages/pages.ts

@@ -5,8 +5,8 @@ const News = lazy(() => import("pages/Newsfeed"));
 const About = lazy(() => import("pages/About"));
 const Feedback = lazy(() => import("pages/Feedback"));
 const PageNotFound = lazy(() => import("pages/PageNotFound"));
-const Terms = lazy(() => import("pages/Terms"));
-const PrivacyPolicy = lazy(() => import("pages/PrivacyPolicy"));
+const Terms = lazy(() => import("pages/Footer/Terms"));
+const PrivacyPolicy = lazy(() => import("pages/Footer/PrivacyPolicy"));
 
 const ColorPicker = lazy(() => import("pages/Colors/ColorPicker"));
 const ShadesAndTints = lazy(() => import("pages/Colors/ShadesAndTints"));