type lint fix

move isso script component
add archive option
2023-02-19 19:39:06 +07:00 · 2023-02-19 19:38:43 +07:00 · 2023-02-19 19:38:15 +07:00
10 changed files with 106 additions and 31 deletions
--- a/contents/2020-08-13-First-Post.mdx
+++ b/contents/2020-08-13-First-Post.mdx
@ -3,6 +3,7 @@ title: "First Post"
 date: "2020.08.13"
 last_update: "2023.02.19"
 slug: "posts/first-post"
+archive: false
 ---

 New blog
--- a/contents/2021-09-30-Daily-Website.mdx
+++ b/contents/2021-09-30-Daily-Website.mdx
@ -4,6 +4,7 @@ date: "2021.09.30"
 last_update: "2021.09.30"
 slug: "posts/web-surfing"
 updated: "2022.04.26"
+archive: false
 ---

 ![bruh](https://images-ext-2.discordapp.net/external/CERF0sfLsukLc3_2vpmYcd85m9TJFfCWTaU_6qspJE0/http/www.animated-gifs.fr/category_sports/surfing-2/0008.gif)
--- a/contents/2022-05-13-Snail_sort.mdx
+++ b/contents/2022-05-13-Snail_sort.mdx
@ -3,6 +3,7 @@ title: "Snail sort"
 date: "2022.05.13"
 last_update: "2022.05.13"
 slug: "posts/refactor"
+archive: false
 ---

 I was looking for some file/s on my computer, but instead i found this:
--- a/contents/2023-02-11-Scuffed_server.mdx
+++ b/contents/2023-02-11-Scuffed_server.mdx
@ -3,6 +3,7 @@ title: "Scuffed Home Server I"
 date: "2023.02.11"
 last_update: "2023.02.18"
 slug: "posts/scuffed-home-server-i"
+archive: false
 ---

 so after new year i went back to my home, then i found an old laptop that my old brother used 
--- a/src/components/Comment/index.tsx
+++ b/src/components/Comment/index.tsx
@ -0,0 +1,25 @@
+import React from "react";
+import { Script } from "gatsby";
+import './isso.css'
+
+type postId = {
+    post_id: string
+}
+
+const Comment = ({ post_id }: postId) => {
+    return (
+        <>
+            <Script data-isso="//comments.nochill.in/"
+                src="//comments.nochill.in/js/embed.min.js"
+                data-isso-css="false"
+                id={post_id}
+            />
+
+            <section id="isso-thread">
+                <noscript>Javascript needs to be activated to view comments.</noscript>
+            </section>
+        </>
+    )
+}
+
+export default Comment;
--- a/src/components/Comment/isso.css
+++ b/src/components/Comment/isso.css
--- a/src/components/Seo/index.tsx
+++ b/src/components/Seo/index.tsx
@ -1,8 +1,14 @@
-import React from "react"
+import React, { FC } from "react"
 import PropTypes from "prop-types"
 import { useStaticQuery, graphql } from "gatsby"

-const SEO = ({ description, meta, title }) => {
+interface seoType {
+    description: string,
+    title   : string,
+    children: React.ReactNode;
+}
+
+const SEO: FC<seoType> = (props) => {
  const { site } = useStaticQuery(
    graphql`
      query {
@ -17,18 +23,19 @@ const SEO = ({ description, meta, title }) => {
    `
  )

-  const metaDescription = description || site.siteMetadata.description
+  const metaDescription = props.description || site.siteMetadata.description

  return (
    <>
      <html lang="en" />
-      <title>{title}</title>
+      <title>{props.title}</title>
      <meta name="description" content={metaDescription} />
-      <meta property="og:title" content={title} />
+      <meta property="og:title" content={props.title} />
      <meta property="og:description" content={metaDescription} />
      <meta property="og:type" content="website" />
      <meta name="twitter:creator" content={site.siteMetadata.author} /> 
      <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"/>
+      {props.children}
    </>
  )
 }
--- a/src/pages/Layout/index.tsx
+++ b/src/pages/Layout/index.tsx
@ -1,36 +1,31 @@
 import React from "react";
-import { graphql, Script } from "gatsby";
+import { graphql, HeadProps, PageProps, Script } from "gatsby";
 import config from '../../../data/site-config';
 import Base from "../../components/Base";
-import SEO from "../../components/seo";
+import SEO from "../../components/Seo";
+import Comment from "../../components/Comment"
 import { MDXProvider } from '@mdx-js/react';
 import './styles.scss';
-import './isso.css';

-const Comment = ({post_id}) => {
-  return (
-    <>
-      <Script data-isso="//comments.nochill.in/"
-        src="//comments.nochill.in/js/embed.min.js" 
-        data-isso-css="false"
-        id={post_id}
-        />
-
-      <section id="isso-thread">
-        <noscript>Javascript needs to be activated to view comments.</noscript>
-      </section>
-    </>
-  ) 
+type queryLayoutProps = {
+    mdx: {
+      frontmatter: {
+        title: string,
+        date: string,
+        last_update: string
+      }
+    }
+  children: any
 }

-const Layout = ({ data, children }) => {
-  
+const Layout = ({ data, children }: PageProps<queryLayoutProps>) => {
+
+
  const post = data.mdx.frontmatter;

  return (
    <Base>
      <div className="post template">
-        <SEO title={`${post.title} | ${config.siteTitle}`} />
        <div className="post page">
          <div className="article figure">
            <div className="HeaderContainer">
@ -70,3 +65,13 @@ query($id: String) {
 `;

 export default Layout;
+
+export const Head = (props: HeadProps<queryLayoutProps>) => {
+  return (
+    <SEO 
+      title={`${props.data.mdx.frontmatter.title} | ${config.siteTitle}`} 
+      description=""
+      children=""
+    />
+  )
+}
--- a/src/pages/about/index.tsx
+++ b/src/pages/about/index.tsx
@ -3,13 +3,12 @@ import { GatsbyImage, getImage } from "gatsby-plugin-image";
 import { useStaticQuery, graphql } from "gatsby"

 import Base from "../../components/Base"
-import SEO from "../../components/seo"
+import SEO from "../../components/Seo";

 import "./styles.scss";

 const AboutPage = () => (
  <Base>
-    <SEO title="About" />
    <div style={{ color: '#eeeeee'}}>
      <h4>Who are you ?</h4>
      <p>nc</p>
@ -31,6 +30,15 @@ const AboutPage = () => (
  </Base>
 )

+export const Head = () => {
+  return (
+    <SEO title="About" 
+      children="" 
+      description=""
+    />
+  )
+}
+
 const Image = () => {
    const data = useStaticQuery(graphql`
    query {
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@ -2,11 +2,31 @@ import React, { useEffect } from "react"
 import { graphql } from "gatsby"

 import Base from '../components/Base'
-import SEO from "../components/seo"
+import SEO from "../components/Seo"
 import PostList from "../components/PostList"
 import init, { greet } from "snake_game"

-const IndexPage = (props) => {
+type articleListType = {
+  data: {
+    allMdx: {
+      edges: [articleType]
+    }
+  }
+}
+
+type articleType = {
+  node: {
+    excerpt: string,
+    frontmatter: {
+      archive: boolean,
+      date: string,
+      slug: string,
+      title: string
+    }
+  }
+}
+
+const IndexPage = (props: articleListType) => {
  const postEdges = props.data.allMdx.edges;

  const initWasm = () => {
@ -22,13 +42,19 @@ const IndexPage = (props) => {

  return (
    <Base>
-      <SEO title="Home" />
      <PostList postEdges={postEdges}/>
    </Base>
  )
 }

-export default IndexPage
+export default IndexPage;
+
+export const Head = () => {
+  <SEO title="Home" 
+    children="" 
+    description=""
+  />
+}

 export const pageQuery = graphql`
  query IndexQuery {
Author	SHA1	Message	Date
nc	e58b955496	type lint fix	2023-02-19 19:39:06 +07:00
nc	59721edcd4	move isso script component	2023-02-19 19:38:43 +07:00
nc	4b02000b0e	add archive option	2023-02-19 19:38:15 +07:00