ballistic-builder/app/components/Info/About/index.tsx

import React, { Component } from 'react'
import PropTypes from 'prop-types' //ES6
import styles from './styles.module.css'
import { useQuery, useMutation, gql } from "@apollo/client";

export default function About(props) {

    const GET_SITE_CONTENT = gql`
    query Get_Site_Content {
      site_contents(where: {content_id: {_eq: "ABOUTUS"}}, order_by: {content: asc}) {
        id
        content_id
        content
      }
     }
   `;

    const { loading, error, data } = useQuery(GET_SITE_CONTENT);
    if (loading) return "Loading ...";
    if (error) return `Error! ${error.message}`;

    return (
        <div >
            <h1>About</h1>
            {data.site_contents.map((site_content: { content: any; }) => (
                <span dangerouslySetInnerHTML={{ __html: site_content.content }} />
            ))}
        </div>
    )
}


About.propTypes = {

};