From 9bfdd2f9cacc14134a794f900b647250fc3876ad Mon Sep 17 00:00:00 2001
From: Adam <24621027+adoyle0@users.noreply.github.com>
Date: Sat, 4 Feb 2023 21:34:15 -0500
Subject: [PATCH] make it right

---
 doordesk/src/components/Blog.tsx     | 16 +++++++++++-----
 doordesk/src/components/BlogPost.tsx | 28 +++++++++++++++++++---------
 2 files changed, 30 insertions(+), 14 deletions(-)

diff --git a/doordesk/src/components/Blog.tsx b/doordesk/src/components/Blog.tsx
index f72d92e..dfc3934 100644
--- a/doordesk/src/components/Blog.tsx
+++ b/doordesk/src/components/Blog.tsx
@@ -1,15 +1,21 @@
 import { Component }  from 'react'
-import BlogPost from './BlogPost.tsx'
+import BlogPost from './BlogPost.js'
 
-class Blog extends Component {
-    constructor(props) {
+interface IBlogProps {
+}
+
+interface IBlogState {
+}
+
+class Blog extends Component<IBlogProps, IBlogState> {
+    constructor(props: IBlogProps) {
         super(props)
     }
     render() {
         return (
             <>
-                <BlogPost post='blog/20220506-change.html' />
-                <BlogPost post='blog/000000000-swim.html' />
+                <BlogPost postURL='blog/20220506-change.html' />
+                <BlogPost postURL='blog/000000000-swim.html' />
             </>
         )
     }
diff --git a/doordesk/src/components/BlogPost.tsx b/doordesk/src/components/BlogPost.tsx
index 7c2d459..ae09842 100644
--- a/doordesk/src/components/BlogPost.tsx
+++ b/doordesk/src/components/BlogPost.tsx
@@ -1,28 +1,38 @@
-import { Component }  from 'react'
+import { Component } from 'react'
 import ReactMarkdown from 'react-markdown'
 import rehypeRaw from 'rehype-raw'
 
-class BlogPost extends Component {
-    constructor(props) {
+interface IBlogPostProps {
+    postURL: string;
+}
+
+interface IBlogPostState {
+    postHTML: string;
+}
+
+class BlogPost extends Component<IBlogPostProps, IBlogPostState> {
+    constructor(props: IBlogPostProps) {
         super(props)
         this.state = {
-            'post': ''
+            'postHTML': ''
         }
     }
-    async getPost(post) {
+    async getPost(post: string) {
         return fetch(post)
             .then((res) => res.text())
     }
-    componentDidMount(props) {
-        this.getPost(this.props.post)
-            .then((text) => this.setState({ post: text }))
+    componentDidMount() {
+        this.getPost(this.props.postURL)
+            .then((text) => this.setState({ postHTML: text }))
 
     }
     render() {
         return (
             <div className="content-container">
                 <div className="content">
-                    <ReactMarkdown rehypePlugins={[rehypeRaw]} children={this.state.post} />
+                    <ReactMarkdown
+                        rehypePlugins={[rehypeRaw]}
+                        children={this.state.postHTML} />
                 </div>
             </div>
         )