Refactor: Removed unnecessary SVGs and imports, and sorted imports by…

… file type (#127)
open-sauced · May 21, 2023 · 353af20 · 353af20
1 parent 9524fa0
commit 353af20
Show file tree

Hide file tree

Showing 76 changed files with 158 additions and 1,968 deletions.
diff --git a/components/common/Button.tsx b/components/common/Button.tsx
@@ -1,5 +1,7 @@
 import Link from 'next/link'
 import React, { FC, ReactElement } from 'react'
+
+// Icons
 import { AiFillGithub } from 'react-icons/ai'
 
 interface ButtonProps {

diff --git a/components/common/SocialLinks.tsx b/components/common/SocialLinks.tsx
@@ -1,12 +1,14 @@
 import React, { FC, ReactElement } from 'react'
 import Image from 'next/image'
+import { SanityAboutPage } from '../../types/schema'
+
+// Static assets
 import InstagramLogoW from '../../public/logos/instagramLogoW.svg'
 import TwitterLogoW from '../../public/logos/twitterLogoW.svg'
 import GithubLogoW from '../../public/logos/githubLogoW.svg'
 import DiscordLogoW from '../../public/logos/discordLogoW.svg'
 import DevLogoW from '../../public/logos/devLogoW.svg'
 import YoutubeLogoW from '../../public/logos/youtubeLogoW.svg'
-import { SanityAboutPage } from '../../types/schema'
 
 const data = [
  {

diff --git a/components/common/SocialShare.tsx b/components/common/SocialShare.tsx
@@ -1,4 +1,6 @@
 import React, { FC } from 'react'
+
+// Icons
 import { BsTwitter, BsLinkedin, BsFacebook } from 'react-icons/bs'
 import { FaHackerNewsSquare } from 'react-icons/fa'
 

diff --git a/components/common/layout/PageLayout.tsx b/components/common/layout/PageLayout.tsx
@@ -1,6 +1,7 @@
-import Head from 'next/head'
 import React, { FC, ReactElement } from 'react'
 import { SanityNavigation, SanitySeo } from '../../../types/schema'
+
+// Components
 import Header from '../../sections/navigation/Header'
 import Footer from '../../sections/Footer'
 import Subscribe from '../../sections/Subscribe'

diff --git a/components/common/text/Heading.tsx b/components/common/text/Heading.tsx
@@ -1,5 +1,7 @@
 import React, { FC, ReactElement } from 'react'
 import useMediaQuery from '../../hooks/useMediaQuery'
+
+// Components
 import DecoratedText from './utils/DecoratedText'
 
 interface HeadingProps {

diff --git a/components/sections/Footer.tsx b/components/sections/Footer.tsx
@@ -1,11 +1,15 @@
-import Image from 'next/image'
-import Link from 'next/link'
 import React, { FC } from 'react'
-import OpenSaucedLogo from '../../public/logos/brandLogo.svg'
+import Link from 'next/link'
+import Image from 'next/image'
+
+// Components
 import SectionWrapper from '../common/layout/SectionWrapper'
 import SocialLinks from '../common/SocialLinks'
 import { navigationLinks } from './navigation/Header'
 
+import OpenSaucedLogo from '../../public/logos/brandLogo.svg'
+
+
 const footerContext = {
  pages: [
  {
@@ -45,7 +49,7 @@ const Footer: FC<FooterProps> = ({ pressPage }) => {
  <SectionWrapper pbs={0}>
  <div className="w-full pt-10 pb-16 largeTablet:pt-12">
  <div className="w-[140px] h-6 relative">
- <Image layout="fill" alt="Brand logo" src={OpenSaucedLogo} />
+ <Image alt="Brand logo" src={OpenSaucedLogo} />
  </div>
  </div>
  <div className="w-full flex flex-col largeTablet:flex-row">

diff --git a/components/sections/Subscribe.tsx b/components/sections/Subscribe.tsx
@@ -1,8 +1,12 @@
 import React, { FC, ReactElement, useRef, useState, useEffect } from 'react'
+import Image from 'next/image'
+
+// Components
 import GradientBorderWrapper from '../common/GradientBorderWrapper'
 import SectionWrapper from '../common/layout/SectionWrapper'
 import { Heading, Typography } from '../common/text'
-import Image from 'next/image'
+
+// Static Assets
 import StrokeR3 from '../../public/background-strokes/stroke_r_3.svg'
 import StrokeL3 from '../../public/background-strokes/stroke_l_3.svg'
 import StrokeMobile2 from '../../public/background-strokes/stroke_mobile_2.svg'

diff --git a/components/sections/about/Background.tsx b/components/sections/about/Background.tsx
@@ -1,5 +1,7 @@
-import Image from 'next/image'
 import React, { FC } from 'react'
+import Image from 'next/image'
+
+// Static Assets
 import StrokeL4 from '../../../public/background-strokes/stroke_l_4.svg'
 import StrokeR3 from '../../../public/background-strokes/stroke_r_3.svg'
 import StrokeMobile1 from '../../../public/background-strokes/stroke_mobile_1.svg'

diff --git a/components/sections/about/FollowUs.tsx b/components/sections/about/FollowUs.tsx
@@ -1,8 +1,10 @@
 import React, { FC, ReactElement } from 'react'
+import { SanityAboutPage } from '../../../types/schema'
+
+// Components
 import SectionWrapper from '../../common/layout/SectionWrapper'
 import GradientBorderWrapper from '../../common/GradientBorderWrapper'
 import SocialLinks from '../../common/SocialLinks'
-import { SanityAboutPage } from '../../../types/schema'
 
 interface FollowUsProps {
  social: SanityAboutPage['socialLinks']

diff --git a/components/sections/about/Links.tsx b/components/sections/about/Links.tsx
@@ -1,13 +1,16 @@
 import React, { FC, ReactElement } from 'react'
+import Image from 'next/image'
+import { SanityAboutPage } from '../../../types/schema'
+
+// Components
 import GradientBorderWrapper from '../../common/GradientBorderWrapper'
 import SectionWrapper from '../../common/layout/SectionWrapper'
 import { Typography } from '../../common/text'
-import Image from 'next/image'
 import OrangeRightArrow from '../../../public/orange_right_arrow.png'
 import OrangeRightArrowSmall from '../../../public/orange_right_arrow_small.png'
 import useMediaQuery from '../../hooks/useMediaQuery'
 import Link from 'next/link'
-import { SanityAboutPage } from '../../../types/schema'
+
 interface LinksProps {
  services: SanityAboutPage['services']
 }

diff --git a/components/sections/about/about/About.tsx b/components/sections/about/about/About.tsx
@@ -1,6 +1,8 @@
 import React, { FC, ReactElement } from 'react'
 import { SanityAboutPage } from '../../../../types/schema'
 import { getPartialString, getPartialStringFromEnd } from '../../../../utils/stringUtils'
+
+// Components
 import SectionWrapper from '../../../common/layout/SectionWrapper'
 import { Heading, Typography } from '../../../common/text'
 import MetricCard from './MetricCard'

diff --git a/components/sections/about/about/MetricCard.tsx b/components/sections/about/about/MetricCard.tsx
@@ -1,5 +1,6 @@
 import React, { FC, ReactElement } from 'react'
-import { SanityAboutPage } from '../../../../types/schema'
+
+// Components
 import { Typography } from '../../../common/text'
 import DecoratedText from '../../../common/text/utils/DecoratedText'
 

diff --git a/components/sections/blog/Background.tsx b/components/sections/blog/Background.tsx
@@ -1,5 +1,7 @@
-import Image from 'next/image'
 import React, { FC } from 'react'
+import Image from 'next/image'
+
+// Static Assets
 import StrokeL5 from '../../../public/background-strokes/stroke_l_5.svg'
 import StrokeR4 from '../../../public/background-strokes/stroke_r_4.svg'
 import StrokeMobile1 from '../../../public/background-strokes/stroke_mobile_1.svg'

diff --git a/components/sections/blog/Blogs.tsx b/components/sections/blog/Blogs.tsx
@@ -1,6 +1,8 @@
 
 import React, { FC, ReactElement } from 'react'
 import { SanityBlog } from '../../../types/schema'
+
+// Components
 import SectionWrapper from '../../common/layout/SectionWrapper'
 import { Heading, Typography } from '../../common/text'
 import Post from './components/Post'

diff --git a/components/sections/blog/FeaturedPost.tsx b/components/sections/blog/FeaturedPost.tsx
@@ -1,6 +1,8 @@
 import Image from 'next/image'
 import React, { FC, ReactElement } from 'react'
 import { SanityBlog } from '../../../types/schema'
+
+// Components
 import GradientBorderWrapper from '../../common/GradientBorderWrapper'
 import Blog from './components/Post'
 

diff --git a/components/sections/blog/[slug]/PageContent.tsx b/components/sections/blog/[slug]/PageContent.tsx
@@ -1,5 +1,8 @@
 import React, { FC, ReactElement } from 'react'
 import { SanityBlog } from '../../../../types/schema'
+import getReadTime from '../../../../utils/getReadTime'
+
+// Components
 import SectionWrapper from '../../../common/layout/SectionWrapper'
 import { Heading, Typography } from '../../../common/text'
 import OrangeClock from '../../../../public/orange_clock.png'
@@ -13,7 +16,6 @@ import Blog from '../components/Post'
 import ReactPlayer from 'react-player'
 import DecoratedText from '../../../common/text/utils/DecoratedText'
 import OgData from '../../../common/OgData'
-import getReadTime from '../../../../utils/getReadTime'
 import SocialShare from '../../../common/SocialShare'
 
 interface PageContentProps {
@@ -57,12 +59,12 @@ const PageContent: FC<PageContentProps> = ({
  </div>
  <div className="w-full flex justify-start pb-4 largeTablet:pb-6 largeTablet:justify-center">
  <div className="flex-shrink-0 mr-2">
- <Image src={OrangeAuthor} alt="Author" />
+ <Image width={16} height={16} src={OrangeAuthor} alt="Author" />
  </div>
 
  <LocalTypography>{author}</LocalTypography>
  <div className="flex-shrink-0 mr-2 ml-4">
- <Image src={OrangeClock} alt="Clock" />
+ <Image width={16} height={16} src={OrangeClock} alt="Clock" />
  </div>
 
  <LocalTypography>{`${getReadTime(blogContent || "")} ${
@@ -76,9 +78,9 @@ const PageContent: FC<PageContentProps> = ({
  <GradientBorderWrapper style={{ width: '100%', borderRadius: '8px' }}>
  <div className="w-full h-[304px] relative rounded-[5px] overflow-hidden largeTablet:h-[496px] ">
  <Image
+ width={1206}
+ height={496}
  src={src as string}
- layout="fill"
- objectFit="cover"
  alt="Cover"
  />
  </div>

diff --git a/components/sections/blog/components/Post.tsx b/components/sections/blog/components/Post.tsx
@@ -1,13 +1,15 @@
 import Image from 'next/image'
 import React, { FC, ReactElement } from 'react'
 import { SanityBlog } from '../../../../types/schema'
+import getReadTime from '../../../../utils/getReadTime'
+
+// Components
 import GradientBorderWrapper from '../../../common/GradientBorderWrapper'
 import { Typography } from '../../../common/text'
 import OrangeClock from '../../../../public/orange_clock.png'
 import OrangeAuthor from '../../../../public/orange_author.png'
 import { Button } from '../../../common'
 import LocalTypography from './LocalTypography'
-import getReadTime from '../../../../utils/getReadTime'
 
 interface PostProps {
  data: SanityBlog
@@ -44,7 +46,7 @@ const Post: FC<PostProps> = ({ data, featured }): ReactElement => {
  <div className={`${featured && 'largeTablet:hidden'}`}>
  <GradientBorderWrapper style={{ width: '100%', borderRadius: '5px' }}>
  <div className="w-full h-[304px] relative rounded-[5px] overflow-hidden ">
- <Image src={src as string} layout="fill" objectFit="cover" alt="Cover"/>
+ <Image width="580" height={304} src={src as string} alt="Cover"/>
  </div>
  </GradientBorderWrapper>
  </div>

diff --git a/components/sections/home-page/Background.tsx b/components/sections/home-page/Background.tsx
@@ -1,11 +1,11 @@
-import Image from 'next/image'
 import React, { FC } from 'react'
-import upperStroke from '../../../public/upperStroke.svg'
+import Image from 'next/image'
+
+// Static assets
+import upperStroke from '../../../public/background-strokes/upperStroke.svg'
 import left_2_stroke from '../../../public/background-strokes/left_2_stroke.svg'
 import right_2_stroke from '../../../public/background-strokes/right_2_stroke.svg'
 import right_3_stroke from '../../../public/background-strokes/right_3_stroke.svg'
-import StrokeMobile2 from '../../../public/background-strokes/stroke_mobile_2.svg'
-import StrokeMobile3 from '../../../public/background-strokes/stroke_mobile_3.svg'
 
 const Background: FC = ({ children }) => {
  return (

diff --git a/components/sections/home-page/CTA.tsx b/components/sections/home-page/CTA.tsx
@@ -1,6 +1,8 @@
 import React, { FC } from 'react'
+import { SanityHomePage } from '../../../types/schema'
+
+// Components
 import SectionWrapper from '../../common/layout/SectionWrapper'
-import { SanityCalender, SanityHomePage } from '../../../types/schema'
 import { Heading, Typography } from '../../common/text'
 import { Button } from '../../common'
 

diff --git a/components/sections/home-page/GitHubMock.tsx b/components/sections/home-page/GitHubMock.tsx
@@ -1,14 +1,19 @@
-import Image from 'next/image'
 import React, { FC } from 'react'
-import { SanityGithubMock, SanityHomePage } from '../../../types/schema'
+import Image from 'next/image'
+import { SanityHomePage } from '../../../types/schema'
+import useMediaQuery from '../../hooks/useMediaQuery'
+
+// Static assets
 import GreenSquares from '../../../public/greenSquares.svg'
 import GreenSquaresSmall from '../../../public/greenSquares_small.svg'
 import TrueImpactIMG from '../../../public/trueImpact.png'
+
+// Components
 import SectionWrapper from '../../common/layout/SectionWrapper'
 import { Heading, Typography } from '../../common/text'
-import useMediaQuery from '../../hooks/useMediaQuery'
 import DecoratedText from '../../common/text/utils/DecoratedText'
-import BackgroundStroke from '../../../public/middleRight.svg'
+import BackgroundStroke from '../../../public/background-strokes/middleRight.svg'
+
 
 interface GitHubMockProps {
  moreHeading: string[]

diff --git a/components/sections/home-page/Hero.tsx b/components/sections/home-page/Hero.tsx
@@ -1,11 +1,13 @@
 import React from 'react'
+import Link from 'next/link'
 import { SanityHomePage } from '../../../types/schema'
+
+// Components
 import SectionWrapper from '../../common/layout/SectionWrapper'
 import ContainerWithLine from '../../common/ContainerWithLine'
 import { Heading, Typography } from '../../common/text'
 import { Button } from '../../common'
 import DecoratedText from '../../common/text/utils/DecoratedText'
-import Link from 'next/link'
 interface HeroProps {
  data: SanityHomePage['hero']
 }

diff --git a/components/sections/home-page/Insights.tsx b/components/sections/home-page/Insights.tsx
@@ -1,5 +1,7 @@
 import React, { FC, ReactElement } from 'react'
 import { SanityHomePage } from '../../../types/schema'
+
+// Components
 import { Button } from '../../common'
 import SectionWrapper from '../../common/layout/SectionWrapper'
 import { Heading, Typography } from '../../common/text'

diff --git a/components/sections/home-page/Logos.tsx b/components/sections/home-page/Logos.tsx
@@ -1,6 +1,8 @@
 import React from 'react'
-import SectionWrapper from '../../common/layout/SectionWrapper'
 import { SanityUser } from '../../../types/schema'
+
+// Components
+import SectionWrapper from '../../common/layout/SectionWrapper'
 import ContainerWithLine from '../../common/ContainerWithLine'
 import { Typography } from '../../common/text'
 

diff --git a/components/sections/home-page/Newsletter.tsx b/components/sections/home-page/Newsletter.tsx
@@ -1,11 +1,14 @@
 import React from 'react'
+import Image from 'next/image'
+
+// Components
 import SectionWrapper from '../../common/layout/SectionWrapper'
 import { Heading, Typography } from '../../common/text'
 import GradientBorderWrapper from '../../common/GradientBorderWrapper'
-import Image from 'next/image'
 
-import StrokeR3 from '../../../public/_3_rightStroke.svg'
-import StrokeL3 from '../../../public/_3_leftStroke.svg'
+// Static assets
+import StrokeR3 from '../../../public/background-strokes/_3_rightStroke.svg'
+import StrokeL3 from '../../../public/background-strokes/_3_leftStroke.svg'
 
 const Newsletter = () => {
  return (

diff --git a/components/sections/home-page/blogs/Blog.tsx b/components/sections/home-page/blogs/Blog.tsx
@@ -2,6 +2,8 @@ import Image from 'next/image'
 import Link from 'next/link'
 import React, { FC, ReactElement } from 'react'
 import { SanityBlog } from '../../../../types/schema'
+
+// Components
 import GradientBorderWrapper from '../../../common/GradientBorderWrapper'
 
 interface BlogProps {

diff --git a/components/sections/home-page/blogs/Blogs.tsx b/components/sections/home-page/blogs/Blogs.tsx
@@ -1,12 +1,14 @@
 import React, { FC, ReactElement } from 'react'
 import { SanityBlog, SanityHomePage } from '../../../../types/schema'
+import { useInView } from 'react-intersection-observer'
+import { motion } from 'framer-motion'
+
+// Components
 import { Button } from '../../../common'
 import SectionWrapper from '../../../common/layout/SectionWrapper'
 import { Heading, Typography } from '../../../common/text'
 import Blog from './Blog'
-import { useInView } from 'react-intersection-observer'
 
-import { motion } from 'framer-motion'
 
 interface BlogsProps {
  blogs: SanityBlog[]

diff --git a/components/sections/home-page/features/Features.tsx b/components/sections/home-page/features/Features.tsx
@@ -1,5 +1,7 @@
 import React, { FC } from 'react'
 import { SanityHomePage } from '../../../../types/schema'
+
+// Components
 import Feature from './Feature'
 import SectionWrapper from '../../../common/layout/SectionWrapper'
 import EndingLine from '../../../common/EndingLine'

diff --git a/components/sections/home-page/testimonials/Testimonial.tsx b/components/sections/home-page/testimonials/Testimonial.tsx
@@ -1,10 +1,12 @@
-import Image from 'next/image'
 import React, { FC } from 'react'
+import Image from 'next/image'
+import { motion } from 'framer-motion'
+import { useInView } from 'react-intersection-observer'
 import { SanityTestimonial } from '../../../../types/schema'
+
+// Components
 import GradientBorderWrapper from '../../../common/GradientBorderWrapper'
 
-import { motion } from 'framer-motion'
-import { useInView } from 'react-intersection-observer'
 
 interface TestimonialProps {
  testimonial: SanityTestimonial