- {
- articles.map(article => {
- return
+ {articles.map((article) => {
+ return
- )
-}
\ No newline at end of file
+ );
+}
diff --git a/src/components/ArticleRow.tsx b/src/components/ArticleRow.tsx
index 7b6eae1..3a0e328 100644
--- a/src/components/ArticleRow.tsx
+++ b/src/components/ArticleRow.tsx
@@ -1,9 +1,13 @@
-import React from 'react'
-import imageUrl from '../imageUrl'
-import BlockContent from '@sanity/block-content-to-react'
+import React from 'react';
+import imageUrl from '../imageUrl';
+import BlockContent from '@sanity/block-content-to-react';
import { Link } from 'react-router-dom';
-export default function ArticleRow({ article }: {article: SGA.ArticleDocument}) {
+export default function ArticleRow({
+ article,
+}: {
+ article: SGA.ArticleDocument;
+}) {
let thumbUrl: string | null = null;
if (article.thumbnail) {
thumbUrl = imageUrl(article.thumbnail).url();
@@ -11,26 +15,23 @@ export default function ArticleRow({ article }: {article: SGA.ArticleDocument})
const slug = (s: string) => {
return s.toLowerCase().replaceAll(' ', '-');
- }
-
+ };
+
return (
-
-
- { thumbUrl ?
- 
- : null
- }
+
+
- 
-
-}
\ No newline at end of file
+ return (
+
+
+
+ );
+}
diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx
index 2dd7576..05bc93e 100644
--- a/src/components/Hero.tsx
+++ b/src/components/Hero.tsx
@@ -1,28 +1,41 @@
-import React from 'react'
+import React from 'react';
type HeroProps = {
- imageURL?: string,
- heading?: string
-}
+ imageURL?: string;
+ heading?: string;
+};
-export default function Hero({ imageURL = "/images/hero.png", heading = "TJHSST SGA"}: HeroProps) {
- return ('*[_type == "initiative"]');
-
+ let initiatives = useQuery(
+ '*[_type == "initiative"]'
+ );
+
if (!initiatives) {
return null;
}
- return
- { initiatives.map(initiative => {
- return
-}
\ No newline at end of file
+ return (
+
+ {initiatives.map((initiative) => {
+ return
+ );
+}
diff --git a/src/components/InitiativeRow.tsx b/src/components/InitiativeRow.tsx
index 1d6ba3e..0bb21f0 100644
--- a/src/components/InitiativeRow.tsx
+++ b/src/components/InitiativeRow.tsx
@@ -1,27 +1,28 @@
-import React from 'react'
+import React from 'react';
import imageUrl from '../imageUrl';
import BlockContent from '@sanity/block-content-to-react';
-export default function InitiativeRow({ initiative }: { initiative: SGA.InitiativeDocument }) {
+export default function InitiativeRow({
+ initiative,
+}: {
+ initiative: SGA.InitiativeDocument;
+}) {
let thumbUrl: string | null = null;
if (initiative.thumbnail) {
thumbUrl = imageUrl(initiative.thumbnail).url();
}
-
+
return (
-
+ {thumbUrl ? (
+
+ ) : null}
-
+
);
-}
\ No newline at end of file
+}
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index 69934d7..e4a5e69 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -1,5 +1,5 @@
-import React from 'react'
-import '../css/footer.css'
+import React from 'react';
+import '../css/footer.css';
import BlockContent from '@sanity/block-content-to-react';
import useFooter from '../hooks/useFooter';
@@ -9,14 +9,22 @@ export default function Footer() {
return null;
}
- return
-
+ {article.publish_date} +
- { article.title } -
+{article.title}
- { article.publish_date } -+ {article.publish_date} +
-
- { footer.columns.map(col => {
- return
-
-
- }) }
-
+
+ {footer.columns.map((col) => {
+ return (
+
+
+
+ );
+ })}
+
- { heading }
- 
-
-}
\ No newline at end of file
+export default function Hero({
+ imageURL = '/images/hero.png',
+ heading = 'TJHSST SGA',
+}: HeroProps) {
+ return (
+
+
+ {heading}
+
+
+
+ );
+}
diff --git a/src/components/InitiativeColumn.tsx b/src/components/InitiativeColumn.tsx
index 1b2b388..9993bf5 100644
--- a/src/components/InitiativeColumn.tsx
+++ b/src/components/InitiativeColumn.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React from 'react';
import BlockContent from '@sanity/block-content-to-react';
import imageUrl from '../imageUrl';
@@ -8,14 +8,13 @@ export default function InitiativeColumn({ name, thumbnail, content }) {
thumbUrl = imageUrl(thumbnail).url();
}
- return
-
- : null
- }
-
+ return (
+ - { name } -
- { thumbUrl ? -
+ : null}
+
+ );
}
diff --git a/src/components/InitiativeList.tsx b/src/components/InitiativeList.tsx
index e5fb394..90af11a 100644
--- a/src/components/InitiativeList.tsx
+++ b/src/components/InitiativeList.tsx
@@ -1,17 +1,21 @@
-import React from 'react'
+import React from 'react';
import useQuery from '../hooks/useInitiatives';
import InitiativeColumn from './InitiativeColumn';
export default function InitiativeList() {
- let initiatives = useQuery+ {name} +
+ {thumbUrl ?
-
- { thumbUrl ?
-
- : null
- }
+
+
-
-}
\ No newline at end of file
+ return (
+
+
+ );
+}
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index 23f47c5..949aa73 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -1,35 +1,43 @@
-import React from 'react'
-import "../css/navbar.css"
+import React from 'react';
+import '../css/navbar.css';
import { Link } from 'react-router-dom';
let pages = [
{
- url: "/",
- title: "Home"
+ url: '/',
+ title: 'Home',
},
{
- url: "/news",
- title: "News"
+ url: '/news',
+ title: 'News',
},
{
- url: "/initiatives",
- title: "Initiatives"
- }
-]
+ url: '/initiatives',
+ title: 'Initiatives',
+ },
+];
export default function Navbar() {
- return | undefined>();
+ let [footer, setFooter] = React.useState<
+ SanityDocument | undefined
+ >();
React.useEffect(() => {
- sanity.getDocument('footer').then(setFooter)
- }, [])
+ sanity.getDocument('footer').then(setFooter);
+ }, []);
return footer;
}
diff --git a/src/hooks/useInitiatives.tsx b/src/hooks/useInitiatives.tsx
index d32b299..423e778 100644
--- a/src/hooks/useInitiatives.tsx
+++ b/src/hooks/useInitiatives.tsx
@@ -1,12 +1,12 @@
-import React from 'react'
+import React from 'react';
import sanity from '../sanity';
export default function useQuery(query: string, params?: any) {
let [result, setResult] = React.useState();
- React.useEffect(() => {
- sanity.fetch(query, params).then(setResult);
- }, [])
-
+ React.useEffect(() => {
+ sanity.fetch(query, params).then(setResult);
+ }, [query, params]);
+
return result;
-}
\ No newline at end of file
+}
diff --git a/src/hooks/useMission.tsx b/src/hooks/useMission.tsx
index 5a34968..6db9f98 100644
--- a/src/hooks/useMission.tsx
+++ b/src/hooks/useMission.tsx
@@ -1,22 +1,24 @@
-import React from 'react'
+import React from 'react';
import sanity from '../sanity';
import { SanityDocument } from '@sanity/client/sanityClient';
interface MissionDocument {
- mission: string
- vision: string
- quote_text: string
- quote_author: string
+ mission: string;
+ vision: string;
+ quote_text: string;
+ quote_author: string;
}
function useMission() {
- let [mission, setMission] = React.useState | undefined>();
+ let [mission, setMission] = React.useState<
+ SanityDocument | undefined
+ >();
React.useEffect(() => {
- sanity.getDocument('mission').then(setMission)
- }, [])
+ sanity.getDocument('mission').then(setMission);
+ }, []);
return mission;
}
-export default useMission;
\ No newline at end of file
+export default useMission;
diff --git a/src/index.d.ts b/src/index.d.ts
index b03abd8..63c392d 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -1,16 +1,16 @@
declare namespace SGA {
interface InitiativeDocument {
- name: string,
- thumbnail: {},
- content: any[],
- _id: string
+ name: string;
+ thumbnail: {};
+ content: any[];
+ _id: string;
}
interface ArticleDocument {
- title: string,
- thumbnail: {},
- content: any[],
- publish_date: string,
- _id: string
+ title: string;
+ thumbnail: {};
+ content: any[];
+ publish_date: string;
+ _id: string;
}
-}
\ No newline at end of file
+}
diff --git a/src/index.tsx b/src/index.tsx
index ef2edf8..8af2ed7 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -5,10 +5,10 @@ import App from './App';
import reportWebVitals from './reportWebVitals';
ReactDOM.render(
-
- ,
- document.getElementById('root')
+
+ ,
+ document.getElementById('root')
);
// If you want to start measuring performance in your app, pass a function
diff --git a/src/pages/404.tsx b/src/pages/404.tsx
index 2baa4af..87ea131 100644
--- a/src/pages/404.tsx
+++ b/src/pages/404.tsx
@@ -1,10 +1,10 @@
-import React from "react"
+import React from 'react';
const NotFoundPage = () => (
-
-
-
-
-}
+ {/* News articles section */}
+
+
+ );
+};
-export default IndexPage
+export default IndexPage;
diff --git a/src/pages/initiatives.tsx b/src/pages/initiatives.tsx
index 0286a2f..f4bfb63 100644
--- a/src/pages/initiatives.tsx
+++ b/src/pages/initiatives.tsx
@@ -1,25 +1,25 @@
-import React from 'react'
+import React from 'react';
import Hero from '../components/Hero';
import InitiativeRow from '../components/InitiativeRow';
-import useQuery from '../hooks/useInitiatives'
+import useQuery from '../hooks/useInitiatives';
export default function Initiatives() {
- let initiatives = useQuery('*[_type == "initiative"]');
-
+ let initiatives = useQuery(
+ '*[_type == "initiative"]'
+ );
+
if (!initiatives) {
return null;
}
return (
<>
-
+ {thumbUrl ? (
+
+ ) : null}
-
-
);
-}
\ No newline at end of file
+}
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index 362cb17..fe8255d 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -5,25 +5,22 @@
* See: https://www.gatsbyjs.com/docs/use-static-query/
*/
-import React from "react"
+import React from 'react';
import Navbar from './Navbar';
import Footer from './Footer';
export default function Layout({ children }: { children: React.ReactNode }) {
- return (
- <>
- - { initiative.name } -
+
+
{initiative.name}
-
+
+ );
}
-
diff --git a/src/components/Mission.tsx b/src/components/Mission.tsx
index cd9f30c..376a1d2 100644
--- a/src/components/Mission.tsx
+++ b/src/components/Mission.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React from 'react';
import useMission from '../hooks/useMission';
export default function Mission() {
@@ -7,23 +7,19 @@ export default function Mission() {
return null;
}
- return
+
- { children }
-
-
+{children}
+
- -
-
- )
+
+ +
- -
-
- - Mission -
-- { mission.mission } -
-- Vision -
-- { mission.vision } -
-- { mission.quote_text } --
+
+ + Mission +
+{mission.mission}
++ Vision +
+{mission.vision}
+{mission.quote_text}+
-
- 
-
- { pages.map(page => {
- return
- { page.title }
+ return (
+
+ );
+}
diff --git a/src/hooks/useFooter.tsx b/src/hooks/useFooter.tsx
index 383fae8..9068261 100644
--- a/src/hooks/useFooter.tsx
+++ b/src/hooks/useFooter.tsx
@@ -1,20 +1,22 @@
-import React from 'react'
+import React from 'react';
import sanity from '../sanity';
import { SanityDocument } from '@sanity/client/sanityClient';
interface FooterDocument {
columns: {
- _id: string
- content: any[]
- }[]
+ _id: string;
+ content: any[];
+ }[];
}
export default function useFooter() {
- let [footer, setFooter] = React.useState
-
- { pages.map(page => {
- return
- { page.title }
+ return (
+
+
+
- }) }
-
-}
\ No newline at end of file
+ {pages.map((page) => {
+ return (
+
+ {page.title}
+
+ );
+ })}
+
- }) }
-
-
-)
+ 404: Not Found
-This page wasn't found...
-
+
+);
-export default NotFoundPage
+export default NotFoundPage;
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index df00166..e81cec1 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,25 +1,25 @@
-import React from "react"
-import Hero from "../components/Hero"
+import React from 'react';
+import Hero from '../components/Hero';
-import InitiativeList from "../components/InitiativeList"
-import Mission from "../components/Mission"
+import InitiativeList from '../components/InitiativeList';
+import Mission from '../components/Mission';
const IndexPage = () => {
- return <>
- {/* Hero image */}
- 404: Not Found
+This page wasn't found...
+
- {
- initiatives.map(initiative => {
- return ('*[_id == $articleId] [0]', {articleId});
+ let { articleId } = useParams<{ articleId: string }>();
+ let article = useQuery('*[_id == $articleId] [0]', {
+ articleId,
+ });
if (!article) {
return null;
}
-
+
let thumbUrl: string | undefined = undefined;
if (article.thumbnail) {
thumbUrl = imageUrl(article.thumbnail).url() || undefined;
@@ -22,14 +24,14 @@ export default function NewsArticle() {
return (
<>
+ {initiatives.map((initiative) => {
+ return
- )
-}
\ No newline at end of file
+ );
+}
diff --git a/src/pages/news.tsx b/src/pages/news.tsx
index e6c00fb..5a09e7f 100644
--- a/src/pages/news.tsx
+++ b/src/pages/news.tsx
@@ -1,10 +1,12 @@
-import React from 'react'
-import ArticleList from '../components/ArticleList'
-import Hero from '../components/Hero'
+import React from 'react';
+import ArticleList from '../components/ArticleList';
+import Hero from '../components/Hero';
export default function News() {
- return (<>
-
- Published: {article.publish_date}
-
- Go to all news articles -
+
- Go to all news articles -
+
+ Published: {article.publish_date}
+
+ Go to all news articles +
+
- )
-}
\ No newline at end of file
+ );
+}
diff --git a/src/sanity.js b/src/sanity.js
index 53d9d83..e6be9bf 100644
--- a/src/sanity.js
+++ b/src/sanity.js
@@ -1,9 +1,9 @@
-import sanityClient from '@sanity/client'
+import sanityClient from '@sanity/client';
const sanity = sanityClient({
- projectId: "yi263kzm",
- dataset: "production",
- useCdn: true
+ projectId: 'yi263kzm',
+ dataset: 'production',
+ useCdn: true,
});
-export default sanity;
\ No newline at end of file
+export default sanity;
diff --git a/tsconfig.json b/tsconfig.json
index 8433911..c9ed257 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -18,7 +18,7 @@
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
- "jsx": "react",
+ "jsx": "react-jsx",
"noImplicitAny": false
},
"include": [
+ Go to all news articles +
+