[#26] Add initial Survey and SurveyList component with data from API

src/adapters/surveyAdapter.ts

@@ -0,0 +1,21 @@
+import { getItem } from 'helpers/localStorage';
+
+import BaseAdapter from './baseAdapter.';
+
+/* eslint-disable camelcase */
+export const commonParams = {
+  access_token: getItem('UserProfile')?.auth?.access_token,
+};
+/* eslint-enable camelcase */
+
+class SurveyAdapter extends BaseAdapter {
+  static list() {
+    const requestParams = {
+      ...commonParams,
+    };
+
+    return this.prototype.getRequest('surveys', { data: requestParams });
+  }
+}
+
+export default SurveyAdapter;

src/components/Survey/index.tsx

@@ -0,0 +1,17 @@
+type SurveyProps = {
+  title: string;
+  description: string;
+  coverImageUrl: string;
+};
+
+function Survey({ title, description, coverImageUrl }: SurveyProps) {
+  return (
+    <>
+      <img src={coverImageUrl} alt="cover" />
+      <p> {title}</p>
+      <p> {description}</p>
+    </>
+  );
+}
+
+export default Survey;

src/components/SurveyList/index.tsx

@@ -0,0 +1,20 @@
+import SurveyComponent from 'components/Survey';
+import { Survey } from 'types/Survey';
+
+type SurveyListProps = { surveys: Survey[] };
+
+function SurveyList({ surveys }: SurveyListProps) {
+  return (
+    <div>
+      {surveys.map((survey) => {
+        return (
+          <li key={survey.id}>
+            <SurveyComponent {...survey} />
+          </li>
+        );
+      })}
+    </div>
+  );
+}
+
+export default SurveyList;

src/screens/Home/index.tsx

@@ -1,9 +1,51 @@
+import { useState, useEffect } from 'react';
+
+import SurveyAdapter from 'adapters/surveyAdapter';
+import { Survey } from 'types/Survey';
+import { SurveyResponse } from 'types/SurveyResponse';
+
+import SurveyList from '../../components/SurveyList';
+
 const HomeScreen = (): JSX.Element => {
+  const [loaded, setLoaded] = useState(false);
+  const [surveys, setSurveys] = useState<Survey[]>([]);
+
+  useEffect(() => {
+    const fetchSurveys = async () => {
+      const surveyResponse = await SurveyAdapter.list();
+
+      const surveyData: SurveyResponse = await surveyResponse.data;
+
+      const parsedSurveys: Survey[] = [];
+
+      surveyData.forEach((survey) => {
+        parsedSurveys.push({
+          id: survey.id,
+          title: survey.attributes.title,
+          description: survey.attributes.description,
+          coverImageUrl: survey.attributes.cover_image_url,
+          type: survey.attributes.survey_type,
+        });
+      });
+
+      setSurveys(parsedSurveys);
+
+      setLoaded(true);
+    };
+    fetchSurveys();
+  }, []);
+
+  if (!loaded) {
+    return <h3>Loading Surveys</h3>;
+  }
+
   return (
     <>
       <div className="my-8 text-white opacity-50" data-test-id="app-main-heading">
-        Home Screen
+        Today - Monday, June 15
       </div>
+
+      {surveys.length > 0 && <SurveyList surveys={surveys} />}
     </>
   );
 };

src/screens/ResetPassword/index.tsx

@@ -23,9 +23,7 @@ function ResetPasswordScreen() {
 
   const performPasswordReset = async () => {
     try {
-      const resetPasswordResponse = await AuthAdapter.resetPassword(email);
-
-      console.log(resetPasswordResponse);
+      await AuthAdapter.resetPassword(email);
     } catch (error) {
       let errorMessage = t('login.generic-server-error');
 

src/types/Survey.ts

@@ -0,0 +1,7 @@
+export type Survey = {
+  id: string;
+  title: string;
+  description: string;
+  type: string;
+  coverImageUrl: string;
+};

src/types/SurveyResponse.ts

@@ -0,0 +1,10 @@
+export type SurveyResponse = {
+  id: string;
+  type: string;
+  attributes: {
+    title: string;
+    description: string;
+    survey_type: string;
+    cover_image_url: string;
+  };
+}[];