refactor(ofHome): port remaining modules to ts

Author: louh

lib/ui/templates/ofHome/Section.js renamed to lib/ui/templates/ofHome/Section.tsx

@@ -1,4 +1,3 @@
-import { array, string } from "prop-types";
 import React from "react";
 import styled from "styled-components";
 
@@ -41,8 +40,18 @@ const ItemTitle = styled.h3`
   font-weight: 800;
 `;
 
-function Services(props) {
+interface ServicesProps {
+  services: {
+    title: string;
+    text: string;
+  }[];
+  subtitle?: string;
+  title?: string;
+}
+
+function Services(props: ServicesProps) {
   const { services, title, subtitle } = props;
+
   return (
     <Element as="section">
       <div className="el">
@@ -65,10 +74,4 @@ function Services(props) {
   );
 }
 
-Services.propTypes = {
-  services: array.isRequired,
-  subtitle: string.isRequired,
-  title: string.isRequired
-};
-
 export default Services;

lib/ui/templates/ofHome/Services.js renamed to lib/ui/templates/ofHome/Services.tsx

@@ -1,4 +1,3 @@
-import { array, string } from "prop-types";
 import React from "react";
 import styled from "styled-components";
 
@@ -25,7 +24,12 @@ const Items = styled.ul`
     }
   }
 `;
-const Item = styled.li`
+
+interface ItemProp {
+  readonly $span: boolean
+}
+
+const Item = styled.li<ItemProp>`
   height: 100%;
   .quote {
     ${setSpace("mbs")};
@@ -67,8 +71,19 @@ const Item = styled.li`
       : ``};
 `;
 
-function Testimonials(props) {
+interface TestimonialsProps {
+  testimonials: {
+    source: string;
+    text: string;
+    span: boolean;
+  }[];
+  subtitle?: string;
+  title?: string;
+}
+
+function Testimonials(props: TestimonialsProps) {
   const { testimonials, title, subtitle } = props;
+
   return (
     <Element as="section">
       <div className="el">
@@ -93,10 +108,4 @@ function Testimonials(props) {
   );
 }
 
-Testimonials.propTypes = {
-  testimonials: array.isRequired,
-  subtitle: string.isRequired,
-  title: string.isRequired
-};
-
 export default Testimonials;