feat: add ReactMarkdown; wip strapi GraphQL response tests

apollo/apollo-client.ts

@@ -3,6 +3,16 @@ import { ApolloClient, InMemoryCache } from '@apollo/client';
 const apolloClient = new ApolloClient({
   uri: 'https://martacodes-it-strapi.up.railway.app/graphql',
   cache: new InMemoryCache(),
+  defaultOptions: {
+    watchQuery: {
+      fetchPolicy: 'network-only',
+      errorPolicy: 'ignore',
+    },
+    query: {
+      fetchPolicy: 'network-only',
+      errorPolicy: 'all',
+    },
+  },
 });
 
 export default apolloClient;

package.json

@@ -51,6 +51,7 @@
     "react-dom": "^18.2.0",
     "react-headroom": "^3.2.1",
     "react-icons": "^4.10.1",
+    "react-markdown": "^8.0.7",
     "react-syntax-highlighter": "^15.5.0",
     "react-tippy": "^1.4.0",
     "sanity": "^3.0.0",

src/app/(public)/about/work/page.tsx

@@ -2,7 +2,11 @@ import { gql } from '@apollo/client';
 import { PortableText } from '@portabletext/react';
 import Image from 'next/image';
 import * as React from 'react';
-import { flattenEntityResponseCollection } from 'strapi-flatten-graphql';
+import {
+  FlattenArray,
+  flattenEntityResponseCollection,
+  StrapiEntityResponseCollection,
+} from 'strapi-flatten-graphql';
 
 import Education from '@/components/organisms/about-work/Education';
 import Languages from '@/components/organisms/about-work/Languages';
@@ -21,6 +25,7 @@ import { sanityClient } from '../../../../../sanity/lib/client';
 
 import { Icon } from '@/types/Icon';
 import { Job } from '@/types/Job';
+import { Job2 } from '@/types/Job2';
 import { Language } from '@/types/Language';
 import { Publication } from '@/types/Publication';
 import { School } from '@/types/School';
@@ -89,16 +94,19 @@ const queryData = async () => {
     `,
   });
 
+  const jobs: FlattenArray<StrapiEntityResponseCollection<Job2>> =
+    flattenEntityResponseCollection(data.jobs);
+  // const jobs = flattenEntityResponseCollection(data.jobs);
   return {
-    jobs: flattenEntityResponseCollection(data.jobs),
+    jobs,
   };
 };
 
 const AboutPage = async () => {
   const { jobs, languages, publications, schools, shortTexts, skills } =
     await getData();
 
-  const js = await queryData();
+  const js: Job2[] = (await queryData()).jobs;
 
   const softwareDevelopment: ShortText | undefined = shortTexts.find(
     (item) => item.name === 'software-development'
@@ -110,7 +118,7 @@ const AboutPage = async () => {
   const titleIconDimension = 42;
 
   // eslint-disable-next-line no-console
-  console.log(js);
+  console.log(js[0].Description);
 
   return (
     <main className='min-h-main'>

src/lib/graphqlUtils.ts

@@ -0,0 +1,9 @@
+import { flattenEntityResponseCollection } from 'strapi-flatten-graphql';
+
+// type StrapiEntityResponseCollection<T> = {
+//   data: T[];
+// };
+
+function _toCollection<T>(entityResponse: object): T[] {
+  return flattenEntityResponseCollection(entityResponse);
+}

src/types/Job2.ts

@@ -0,0 +1,14 @@
+export interface Job2 {
+  id: string;
+  title: string;
+  companyName: string;
+  icon: object;
+  location: string;
+  startDate: string;
+  endDate: string;
+  isCurrentJob: boolean;
+  description: string;
+  mainColor: string;
+  darkColor: string;
+  technologies: string[];
+}