{post.content}
+ +Explore UI Components
+🎉
+{ label }
+{ label }
++ In Ionic React 5.6, the team packaged up a new set of hooks for controlling overlay + components that they thought we might like. What is an overlay you ask? It’s the + term that Ionic give components that display over your current content, such as + alerts, modals, toasts, etc. +
++ All of the code is taken from the Ionic Framework docs. You can find the blog post + outlining these new overlay hooks{' '} + + here. + +
+Check out the samples by navigating to a respective one in the side menu.
+There are currenty no answers added for this poll.
+{poll.totalVotes} votes already
+{poll.voted ? 'You have voted on this poll' : "You haven't voted on this poll"}
+{ poll.totalVotes } votes already
+ +{ answer.answer } ({ answerPercentage })%
+ { showVotes &&{ answer.votes } of { poll.totalVotes } total votes
} +Option { index + 1 }
+Explore UI Components
+{ contact.name }
+{ option.title }
+{ contact.name }
+{ date }
+ +{ preview }
+Tap and hold on any message to star it, so you can easily find it later.
+No recent updates to show right now.
+
+ {read && received &&
0 && 'chat-unread'}`}>{date}
+ + {notificationCount > 0 &&{repliedMessage.preview}
+; + } else { + return ''; + } +}; diff --git a/03_source/mobile/src/pages/DemoReactWhatsAppClone/components/ContactModal.js b/03_source/mobile/src/pages/DemoReactWhatsAppClone/components/ContactModal.js new file mode 100644 index 0000000..3bbfa4e --- /dev/null +++ b/03_source/mobile/src/pages/DemoReactWhatsAppClone/components/ContactModal.js @@ -0,0 +1,42 @@ +import { IonButton, IonButtons, IonContent, IonHeader, IonItem, IonLabel, IonList, IonTitle, IonToolbar } from '@ionic/react'; +import { ContactStore } from '../store'; +import { getContacts } from '../store/Selectors'; + +import './ContactModal.scss'; + +const ContactModal = ({ close }) => { + const contacts = ContactStore.useState(getContacts); + + return ( +
Available
+{ contact.name }
+{ option.title }
+{ contact.name }
+{ date }
+ +{ preview }
+Tap and hold on any message to star it, so you can easily find it later.
+No recent updates to show right now.
+
+
{review.text}
+Explore UI Components
+
+
+
+
{person.location}
+{profile.location}
+ +Explore UI Components
+