Completely restructure project

Rikthepixel · Rikthepixel · commit 2fb36ac09351 · 2023-04-14T11:58:00.000+02:00
diff --git a/src/assets/state/missions.tsx b/src/assets/state/missions.tsx
@@ -4,7 +4,7 @@ import { StaticImageData } from "next/image";
 import ModernPicture from "@/assets/images/content/missions/modern.webp";
 import FastAndFeaturePackedPicture from "@/assets/images/content/missions/fast-and-feature-packed.webp";
 import CrossPlatformPicture from "@/assets/images/content/missions/cross-platform.webp";
-import Link from "@/components/navigation/Link";
+import Link from "@/components/controls/Link";
 
 export interface IMission {
   title: string;
@@ -24,7 +24,7 @@ const missions: IMission[] = [
         Many Git clients have a similar look and feel, and the interface can be intimidating for new users.
       </p>
       <p>
-         With Commit Rocket we plan to {/*<Link href="/blog/3/designs" color="primary" underline>innovate and modernize the design of Git clients</Link>*/} innovate and modernize the design of Git clients to 
+        With Commit Rocket we plan to {/*<Link href="/blog/3/designs" color="primary" underline>innovate and modernize the design of Git clients</Link>*/} innovate and modernize the design of Git clients to
         create an attractive and user-friendly interface that will appeal to both beginners and experienced users alike.
       </p>
     </>
diff --git a/src/assets/state/roadmap.tsx b/src/assets/state/roadmap.tsx
@@ -1,5 +1,5 @@
-import Heading from "@/components/layout/Heading";
-import Link from "@/components/navigation/Link";
+import Heading from "@/components/content/Heading";
+import Link from "@/components/controls/Link";
 import { ReactNode } from "react";
 
 export interface IRoadmapItem {
diff --git a/src/components/content/Heading.tsx b/src/components/content/Heading.tsx
diff --git a/src/components/controls/Link.tsx b/src/components/controls/Link.tsx
diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx
@@ -1,4 +1,4 @@
-import Link from "./Link";
+import Link from "../controls/Link";
 
 import Logo from "@/assets/images/brand/logo-200x200.webp";
 
diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx
@@ -4,7 +4,7 @@ import Bars3Icon from "@heroicons/react/24/solid/Bars3Icon";
 
 import Logo from "@/assets/images/brand/logo-200x200.webp";
 
-import Link from "./Link";
+import Link from "../controls/Link";
 import Button from "../controls/Button";
 import NavLink from "./NavLink";
 import useOutsideClick from "@/hooks/useOutsideClick";
diff --git a/src/components/layout/NavDropdown.tsx b/src/components/layout/NavDropdown.tsx
@@ -3,7 +3,7 @@ import { twMerge } from "tailwind-merge";
 import ChevronDownIcon from "@heroicons/react/24/solid/ChevronDownIcon";
 
 import { style as navlinkStyle } from "./NavLink";
-import { style as linkStyle } from "./Link";
+import { style as linkStyle } from "../controls/Link";
 import useOutsideClick from "@/hooks/useOutsideClick";
 import useHover from "@/hooks/useHover";
 
diff --git a/src/components/layout/NavLink.tsx b/src/components/layout/NavLink.tsx
@@ -1,6 +1,6 @@
 import { cva } from "class-variance-authority";
 import { ReactNode } from "react";
-import Link from "./Link";
+import Link from "../controls/Link";
 
 export interface NavLinkProps {
   href: string,
diff --git a/src/components/pages/about/Project.tsx b/src/components/pages/about/Project.tsx
@@ -10,7 +10,7 @@ export interface ProjectProps extends IProject {
 const Project = ({ title, description, thumbnail, thumbnailAlt, href, linkText, linkRel }: ProjectProps) => {
 
   const onImageClick = useCallback(async () => {
-    const { modal } = await import("@/utils/swal");
+    const { default: modal } = await import("@/utils/alerts/modal");
 
     modal.fire({
       title: thumbnailAlt,
diff --git a/src/components/pages/blog/ArticleBrief.tsx b/src/components/pages/blog/ArticleBrief.tsx
@@ -4,7 +4,7 @@ import BookIcon from "@heroicons/react/24/outline/BookOpenIcon";
 import { motion, Variants } from "framer-motion";
 
 import LinkButton from "@/components/controls/LinkButton";
-import Link from "@/components/navigation/Link";
+import Link from "@/components/controls/Link";
 
 import useSSGSafe from "@/hooks/useSSGSafe";
 
diff --git a/src/components/pages/blog/post/ArticleComponents.tsx b/src/components/pages/blog/post/ArticleComponents.tsx
@@ -1,6 +1,6 @@
 import List from "@/components/content/List";
-import Heading, { makeHeading } from "@/components/layout/Heading";
-import Link from "@/components/navigation/Link";
+import Heading, { makeHeading } from "@/components/content/Heading";
+import Link from "@/components/controls/Link";
 
 import ArticleTableOfContent from "./ArticleTableOfContent";
 import React, { useMemo } from "react";
diff --git a/src/components/pages/blog/post/ArticleMeta.tsx b/src/components/pages/blog/post/ArticleMeta.tsx
@@ -6,7 +6,7 @@ import { IMember } from "@/assets/state/team";
 
 import useSSGSafe from "@/hooks/useSSGSafe";
 
-import Link from "@/components/navigation/Link";
+import Link from "@/components/controls/Link";
 import { readtimeFormatter } from "@/utils/readtime";
 
 export interface ArticleMetaProps {
diff --git a/src/components/pages/blog/post/ArticleTableOfContent.tsx b/src/components/pages/blog/post/ArticleTableOfContent.tsx
@@ -1,7 +1,7 @@
 import React, { ReactNode } from "react";
 import PlayIcon from "@heroicons/react/24/solid/PlayIcon";
 
-import Link from "@/components/navigation/Link";
+import Link from "@/components/controls/Link";
 import { Heading, useArticle } from "./ArticleContext";
 
 
diff --git a/src/components/pages/contribute/FeedbackSection.tsx b/src/components/pages/contribute/FeedbackSection.tsx
@@ -6,14 +6,13 @@ import { z } from "zod";
 import { BackendResponse } from "@/api/models/Response";
 import Button from "@/components/controls/Button";
 import Error from "@/components/controls/Error";
-import Link from "@/components/navigation/Link";
-import { backend } from "@/utils/wretch";
+import Link from "@/components/controls/Link";
+import backend from "@/lib/fetch/backend";
 import TextArea from "@/components/controls/TextArea";
 import Form from "@/components/controls/Form";
-import Heading from "@/components/layout/Heading";
+import Heading from "@/components/content/Heading";
 import Label from "@/components/controls/Label";
 import useFormMutation from "@/hooks/useMutation";
-import { event } from "nextjs-google-analytics";
 import { sendFeedbackEvent } from "@/api/analytics";
 
 const feedbackSchema = z.object({
diff --git a/src/components/pages/front/Mission.tsx b/src/components/pages/front/Mission.tsx
@@ -1,5 +1,5 @@
 import { IMission } from "@/assets/state/missions";
-import Heading from "@/components/layout/Heading";
+import Heading from "@/components/content/Heading";
 
 export interface MissionProps extends IMission {
 
diff --git a/src/components/pages/front/RoadmapItem.tsx b/src/components/pages/front/RoadmapItem.tsx
@@ -1,5 +1,5 @@
 import { IRoadmapItem } from "@/assets/state/roadmap";
-import Heading from "@/components/layout/Heading";
+import Heading from "@/components/content/Heading";
 
 export interface RoadmapItemProps extends IRoadmapItem {
 
diff --git a/src/components/pages/front/SignupSection.tsx b/src/components/pages/front/SignupSection.tsx
@@ -7,12 +7,12 @@ import { BackendResponse } from "@/api/models/Response";
 import perks from "@/assets/state/perks";
 import Button from "@/components/controls/Button";
 import Error from "@/components/controls/Error";
-import Link from "@/components/navigation/Link";
+import Link from "@/components/controls/Link";
 import Input from "@/components/controls/Input";
 import Form from "@/components/controls/Form";
-import Heading from "@/components/layout/Heading";
+import Heading from "@/components/content/Heading";
 
-import { backend } from "@/utils/wretch";
+import backend from "@/lib/fetch/backend";
 import useFormMutation from "@/hooks/useMutation";
 import { sendSubscribeEvent } from "@/api/analytics";
 import Label from "@/components/controls/Label";
diff --git a/src/lib/fetch/backend.tsx b/src/lib/fetch/backend.tsx
@@ -1,30 +1,32 @@
 import wretch from "wretch";
 
-export const backend = wretch(process.env.NEXT_PUBLIC_BACKEND_URL!)
+const backend = wretch(process.env.NEXT_PUBLIC_BACKEND_URL!)
   .options({
     mode: "cors"
   })
   .catcher(404, async () => {
-    const { toast } = await import("./swal");
+    const { default: toast } = await import("../../utils/alerts/toast");
     toast.fire({
       title: "Error",
       icon: "error",
       text: "Resource was not found."
     });
   })
   .catcher(500, async () => {
-    const { toast } = await import("./swal");
+    const { default: toast } = await import("../../utils/alerts/toast");
     toast.fire({
       title: "Error",
       icon: "error",
       text: "Internal Server Error, try again later."
     });
   })
   .catcher(400, async () => {
-    const { toast } = await import("./swal");
+    const { default: toast } = await import("../../utils/alerts/toast");
     toast.fire({
       title: "Error",
       icon: "error",
       text: "Bad request."
     });
-  });
+  });
+
+export default backend;
diff --git a/src/lib/meta/opengraph/article.ts b/src/lib/meta/opengraph/article.ts
diff --git a/src/lib/meta/opengraph/base.tsx b/src/lib/meta/opengraph/base.tsx
diff --git a/src/lib/meta/opengraph/image.ts b/src/lib/meta/opengraph/image.ts
diff --git a/src/lib/meta/opengraph/index.tsx b/src/lib/meta/opengraph/index.tsx
diff --git a/src/lib/meta/opengraph/profile.ts b/src/lib/meta/opengraph/profile.ts
diff --git a/src/lib/meta/opengraph/toOpenGraph.tsx b/src/lib/meta/opengraph/toOpenGraph.tsx
diff --git a/src/lib/meta/sitemap.tsx b/src/lib/meta/sitemap.tsx
@@ -60,4 +60,6 @@ export const makeSitemapMeta = ({ changeFreq, lastMod, priority = 0.5 }: Options
       content={String(priority)}
     />
   ];
-};
+};
+
+export default makeSitemapMeta;
diff --git a/src/pages/404.tsx b/src/pages/404.tsx
@@ -6,10 +6,10 @@ import HomeModernIcon from "@heroicons/react/24/solid/HomeModernIcon";
 import { Page } from "@/types/page";
 import LinkButton from "@/components/controls/LinkButton";
 import Button from "@/components/controls/Button";
-import Heading from "@/components/layout/Heading";
+import Heading from "@/components/content/Heading";
 
-import { makeOgMeta } from "@/utils/meta/opengraph";
-import { makeSitemapMeta } from "@/utils/meta/sitemap";
+import { makeOgMeta } from "@/lib/meta/opengraph";
+import makeSitemapMeta from "@/lib/meta/sitemap";
 import KeywordsMeta from "@/components/head/KeywordsMeta";
 
 const NotFound: Page = ({ pathname }) => {
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
@@ -5,15 +5,15 @@ import { motion, useReducedMotion, MotionConfig, AnimatePresence } from "framer-
 import type { AppProps } from 'next/app';
 import Head from "next/head";
 
-import Header from "@/components/navigation/Header";
-import Footer from "@/components/navigation/Footer";
+import Header from "@/components/layout/Header";
+import Footer from "@/components/layout/Footer";
 import GoogleAnalytics from "@/components/analytics/GoogleAnalytics";
 import KeywordsMeta from "@/components/head/KeywordsMeta";
 
 import BannerImage from "@/assets/images/brand/commit-rocket-logo.webp";
 
-import { makeOgMeta } from "@/utils/meta/opengraph";
-import { makeSitemapMeta } from "@/utils/meta/sitemap";
+import { makeOgMeta } from "@/lib/meta/opengraph";
+import makeSitemapMeta from "@/lib/meta/sitemap";
 
 
 const pageTransition = {
diff --git a/src/pages/about.tsx b/src/pages/about.tsx
@@ -5,11 +5,11 @@ import Member from "@/components/pages/about/Member";
 import { Page } from "@/types/page";
 import projects from "@/assets/state/projects";
 
-import Heading from "@/components/layout/Heading";
+import Heading from "@/components/content/Heading";
 import Project from "@/components/pages/about/Project";
 import KeywordsMeta from "@/components/head/KeywordsMeta";
 
-import { makeOgMeta } from "@/utils/meta/opengraph";
+import { makeOgMeta } from "@/lib/meta/opengraph";
 
 const AboutPage: Page = ({ pathname }) => {
   return (
diff --git a/src/pages/blog/[pid]/[slug].tsx b/src/pages/blog/[pid]/[slug].tsx
@@ -4,11 +4,11 @@ import { GetStaticPaths, GetStaticProps } from "next";
 import { Page } from "@/types/page";
 import IArticle from "@/assets/state/articles/article";
 
-import { makeSitemapMeta } from "@/utils/meta/sitemap";
-import { makeArticleOgMeta, makeOgMeta } from "@/utils/meta/opengraph";
+import makeSitemapMeta from "@/lib/meta/sitemap";
+import { makeArticleOgMeta, makeOgMeta } from "@/lib/meta/opengraph";
 import { calculateReadtime } from "@/utils/readtime";
 
-import Heading from "@/components/layout/Heading";
+import Heading from "@/components/content/Heading";
 import KeywordsMeta from "@/components/head/KeywordsMeta";
 import LinkButton from "@/components/controls/LinkButton";
 import makeTagUrl from "@/components/pages/blog/utils/makeTagUrl";
diff --git a/src/pages/blog/index.tsx b/src/pages/blog/index.tsx
@@ -17,10 +17,10 @@ import { ControlledSelect } from "@/components/controls/Select";
 
 import { calculateReadtime } from "@/utils/readtime";
 import fadeAnim from "@/animations/fade";
-import Heading from "@/components/layout/Heading";
-import { makeOgMeta } from "@/utils/meta/opengraph";
+import Heading from "@/components/content/Heading";
+import { makeOgMeta } from "@/lib/meta/opengraph";
 import Label from "@/components/controls/Label";
-import { makeSitemapMeta } from "@/utils/meta/sitemap";
+import makeSitemapMeta from "@/lib/meta/sitemap";
 import KeywordsMeta from "@/components/head/KeywordsMeta";
 
 interface BlogPageProps {
diff --git a/src/pages/contact.tsx b/src/pages/contact.tsx
@@ -2,9 +2,9 @@ import Head from "next/head";
 
 import { Page } from "@/types/page";
 import contactMethods from "@/assets/state/contactMethods";
-import Link, { style } from "@/components/navigation/Link";
-import Heading from "@/components/layout/Heading";
-import { makeOgMeta } from "@/utils/meta/opengraph";
+import Link, { style } from "@/components/controls/Link";
+import Heading from "@/components/content/Heading";
+import { makeOgMeta } from "@/lib/meta/opengraph";
 import KeywordsMeta from "@/components/head/KeywordsMeta";
 
 
diff --git a/src/pages/contribute.tsx b/src/pages/contribute.tsx
@@ -1,11 +1,11 @@
 import Head from "next/head";
 
-import Heading from "@/components/layout/Heading";
+import Heading from "@/components/content/Heading";
 import FeedbackSection from "@/components/pages/contribute/FeedbackSection";
 
 import { Page } from "@/types/page";
-import { makeOgMeta } from "@/utils/meta/opengraph";
-import { makeSitemapMeta } from "@/utils/meta/sitemap";
+import { makeOgMeta } from "@/lib/meta/opengraph";
+import makeSitemapMeta from "@/lib/meta/sitemap";
 import KeywordsMeta from "@/components/head/KeywordsMeta";
 
 
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -13,12 +13,12 @@ import Mission from "@/components/pages/front/Mission";
 import { Page } from "@/types/page";
 import roadmap from "@/assets/state/roadmap";
 import RoadmapItem from "@/components/pages/front/RoadmapItem";
-import Heading from "@/components/layout/Heading";
+import Heading from "@/components/content/Heading";
 import KeywordsMeta from "@/components/head/KeywordsMeta";
 
 import { sendCTAEvent } from "@/api/analytics";
-import { makeSitemapMeta } from "@/utils/meta/sitemap";
-import { makeOgMeta } from "@/utils/meta/opengraph";
+import makeSitemapMeta from "@/lib/meta/sitemap";
+import { makeOgMeta } from "@/lib/meta/opengraph";
 
 const logoAnim = {
   initial: {
diff --git a/src/pages/mail/unsubscribe.tsx b/src/pages/mail/unsubscribe.tsx
@@ -5,17 +5,17 @@ import { useForm } from "react-hook-form";
 import ArrowPathIcon from "@heroicons/react/24/solid/ArrowPathIcon";
 
 import { Page } from "@/types/page";
-import { backend } from "@/utils/wretch";
-import { makeOgMeta } from "@/utils/meta/opengraph";
-import { makeSitemapMeta } from "@/utils/meta/sitemap";
+import backend from "@/lib/fetch/backend";
+import { makeOgMeta } from "@/lib/meta/opengraph";
+import makeSitemapMeta from "@/lib/meta/sitemap";
 import useFormMutation from "@/hooks/useMutation";
 
 import { BackendResponse } from "@/api/models/Response";
 import { sendUnsubscribeEvent } from "@/api/analytics";
 
 import Input from "@/components/controls/Input";
 import Form from "@/components/controls/Form";
-import Heading from "@/components/layout/Heading";
+import Heading from "@/components/content/Heading";
 import Button from "@/components/controls/Button";
 import Label from "@/components/controls/Label";
 import KeywordsMeta from "@/components/head/KeywordsMeta";
diff --git a/src/utils/alerts/base.tsx b/src/utils/alerts/base.tsx
@@ -0,0 +1,16 @@
+import Swal from "sweetalert2";
+import withReactContent from "sweetalert2-react-content";
+import CloseIcon from "@heroicons/react/24/solid/XMarkIcon";
+
+const base = withReactContent(Swal).mixin({
+  closeButtonHtml: <CloseIcon
+    className="w-6 h-6"
+    width="1em"
+    height="1em"
+  />,
+  customClass: {
+    icon: "mr-4"
+  }
+});
+
+export default base;
diff --git a/src/utils/alerts/modal.ts b/src/utils/alerts/modal.ts
@@ -0,0 +1,9 @@
+import base from "./base";
+
+const modal = base.mixin({
+  position: "center",
+  showConfirmButton: false,
+  showCloseButton: true
+});
+
+export default modal;
diff --git a/src/utils/alerts/toast.ts b/src/utils/alerts/toast.ts
@@ -0,0 +1,16 @@
+import Swal from "sweetalert2";
+import swal from "./base";
+
+const toast = swal.mixin({
+  timer: 5000,
+  timerProgressBar: true,
+  position: "top",
+  showConfirmButton: false,
+  toast: true,
+  didOpen: (toast) => {
+    toast.addEventListener('mouseenter', Swal.stopTimer);
+    toast.addEventListener('mouseleave', Swal.resumeTimer);
+  }
+});
+
+export default toast;
diff --git a/src/utils/swal.tsx b/src/utils/swal.tsx

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import Link from "./Link";`
	`1`	`+import Link from "../controls/Link";`
`2`	`2`
`3`	`3`	`import Logo from "@/assets/images/brand/logo-200x200.webp";`
`4`	`4`