"feat: rename 'createdDate' to 'createDate' across frontend, backend, and mobile codebases"

03_source/mobile/src/pages/MyProfile/NotLoggedIn/index.tsx

@@ -0,0 +1,155 @@
+// REQ0053/profile-page
+//
+// PURPOSE:
+// - Provides functionality view user profile
+//
+// RULES:
+// - T.B.A.
+//
+import React, { useEffect, useRef, useState } from 'react';
+import {
+  IonHeader,
+  IonToolbar,
+  IonTitle,
+  IonContent,
+  IonPage,
+  IonButtons,
+  IonMenuButton,
+  IonGrid,
+  IonRow,
+  IonCol,
+  useIonRouter,
+  IonButton,
+  IonIcon,
+  IonPopover,
+  IonAvatar,
+  IonImg,
+  IonItem,
+  IonLabel,
+  IonList,
+  IonModal,
+  IonSearchbar,
+  useIonModal,
+  IonInput,
+  RefresherEventDetail,
+  IonRefresher,
+  IonRefresherContent,
+} from '@ionic/react';
+import SpeakerItem from '../../../components/SpeakerItem';
+import { Speaker } from '../../../models/Speaker';
+import { Session } from '../../../models/Schedule';
+import { connect } from '../../../data/connect';
+import * as selectors from '../../../data/selectors';
+import '../../SpeakerList.scss';
+import { getEvents } from '../../../api/getEvents';
+import { format } from 'date-fns';
+import { Event } from '../types';
+import { alertOutline, chevronDownCircleOutline, createOutline, heart, menuOutline, settingsOutline } from 'ionicons/icons';
+import AboutPopover from '../../../components/AboutPopover';
+import paths from '../../../paths';
+import { getProfileById } from '../../../api/getProfileById';
+import { defaultMember, Member } from '../../MemberProfile/type';
+
+interface OwnProps {}
+
+interface StateProps {
+  speakers: Speaker[];
+  speakerSessions: { [key: string]: Session[] };
+}
+
+interface DispatchProps {}
+
+interface SpeakerListProps extends OwnProps, StateProps, DispatchProps {}
+
+const MyProfile: React.FC<SpeakerListProps> = ({ speakers, speakerSessions }) => {
+  const [profile, setProfile] = useState<Member>(defaultMember);
+
+  const [showPopover, setShowPopover] = useState(false);
+  const [popoverEvent, setPopoverEvent] = useState<MouseEvent>();
+  const modal = useRef<HTMLIonModalElement>(null);
+
+  const router = useIonRouter();
+
+  function handleShowSettingButtonClick() {
+    router.push(paths.SETTINGS);
+  }
+
+  function handleNotImplementedClick() {
+    router.push(paths.NOT_IMPLEMENTED);
+  }
+
+  function handleRefresh(event: CustomEvent<RefresherEventDetail>) {
+    setTimeout(() => {
+      // Any calls to load data go here
+      event.detail.complete();
+    }, 2000);
+  }
+
+  const [disableForwardLoginButton, setDisableForwardLoginButton] = useState(false);
+  function handleForwardLoginPage() {
+    try {
+      setDisableForwardLoginButton(true);
+      router.push(paths.login);
+      setDisableForwardLoginButton(false);
+    } catch (error) {
+      console.error(error);
+    }
+  }
+
+  useEffect(() => {
+    getProfileById('2').then(({ data }) => {
+      console.log({ data });
+      setProfile(data);
+    });
+  }, []);
+
+  if (!profile) return <>loading</>;
+
+  return (
+    <IonPage id="speaker-list">
+      <IonHeader translucent={true} className="ion-no-border">
+        <IonToolbar>
+          <IonButtons slot="end">
+            {/* <IonMenuButton /> */}
+            <IonButton shape="round" onClick={() => handleShowSettingButtonClick()}>
+              <IonIcon slot="icon-only" icon={settingsOutline}></IonIcon>
+            </IonButton>
+          </IonButtons>
+          <IonTitle>My profile</IonTitle>
+        </IonToolbar>
+      </IonHeader>
+
+      <IonContent fullscreen={true}>
+        <IonRefresher slot="fixed" onIonRefresh={handleRefresh}>
+          <IonRefresherContent pullingIcon={chevronDownCircleOutline} pullingText="Pull to refresh" refreshingSpinner="circles" refreshingText="Refreshing..."></IonRefresherContent>
+        </IonRefresher>
+
+        <IonHeader collapse="condense" className="ion-no-border">
+          <IonToolbar>
+            <IonTitle size="large">My profile</IonTitle>
+          </IonToolbar>
+        </IonHeader>
+
+        <div style={{ height: '50vh', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center' }}>
+          <div>
+            not login yet, <br />
+            please login or sign up
+          </div>
+          <div style={{ height: '50vh', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center' }}>
+            <IonButton disabled={disableForwardLoginButton} onClick={handleForwardLoginPage}>
+              Login
+            </IonButton>
+          </div>
+        </div>
+      </IonContent>
+    </IonPage>
+  );
+};
+
+export default connect<OwnProps, StateProps, DispatchProps>({
+  mapStateToProps: (state) => ({
+    speakers: selectors.getSpeakers(state),
+    speakerSessions: selectors.getSpeakerSessions(state),
+  }),
+  component: React.memo(MyProfile),
+});

03_source/mobile/src/pages/MyProfile/index.tsx

@@ -49,6 +49,7 @@ import AboutPopover from '../../components/AboutPopover';
 import paths from '../../paths';
 import { getProfileById } from '../../api/getProfileById';
 import { defaultMember, Member } from '../MemberProfile/type';
+import NotLoggedIn from './NotLoggedIn';
 
 interface OwnProps {}
 
@@ -63,6 +64,7 @@ interface SpeakerListProps extends OwnProps, StateProps, DispatchProps {}
 
 const MyProfile: React.FC<SpeakerListProps> = ({ speakers, speakerSessions }) => {
   const [profile, setProfile] = useState<Member>(defaultMember);
+
   const [showPopover, setShowPopover] = useState(false);
   const [popoverEvent, setPopoverEvent] = useState<MouseEvent>();
   const modal = useRef<HTMLIonModalElement>(null);
@@ -92,6 +94,7 @@ const MyProfile: React.FC<SpeakerListProps> = ({ speakers, speakerSessions }) =>
   }, []);
 
   if (!profile) return <>loading</>;
+  if (profile.id == -1) return <NotLoggedIn />;
 
   return (
     <IonPage id="speaker-list">