{session.name}
@@ -101,10 +84,7 @@ const SessionListItem: React.FC{session.name}
{/* Instead of loading an image each time the select changes, use opacity to transition them */}
-
-
-
-
+
+
+
+
About
- The Ionic Conference is a one-day event happening on{' '} - {displayDate(conferenceDate, 'MMM dd, yyyy')}, featuring talks from - the Ionic team. The conference focuses on building applications with - Ionic Framework, including topics such as app migration to the - latest version, React best practices, Webpack, Sass, and other - technologies commonly used in the Ionic ecosystem. Tickets are - completely sold out, and we're expecting over 1,000 developers — - making this the largest Ionic conference to date! + The Ionic Conference is a one-day event happening on {displayDate(conferenceDate, 'MMM dd, yyyy')}, + featuring talks from the Ionic team. The conference focuses on building applications with Ionic Framework, + including topics such as app migration to the latest version, React best practices, Webpack, Sass, and other + technologies commonly used in the Ionic ecosystem. Tickets are completely sold out, and we're expecting over + 1,000 developers — making this the largest Ionic conference to date!
Details
@@ -118,9 +96,7 @@ const About: React.FC
- 
+
- clicked('Update Picture')}>
- Update Picture
-
- setShowAlert(true)}>
- Change Username
-
- clicked('Change Password')}>
- Change Password
-
+ clicked('Update Picture')}>Update Picture
+ setShowAlert(true)}>Change Username
+ clicked('Change Password')}>Change Password
Support
diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx
index 9ef8e794..37aa9ea6 100644
--- a/src/pages/Login.tsx
+++ b/src/pages/Login.tsx
@@ -1,4 +1,3 @@
-import React, { useState } from 'react';
import {
IonHeader,
IonToolbar,
@@ -13,19 +12,18 @@ import {
IonInput,
useIonRouter,
} from '@ionic/react';
+import React, { useState } from 'react';
+
import './Login.scss';
-import { setIsLoggedIn, setUsername } from '../data/user/user.actions';
import { connect } from '../data/connect';
+import { setIsLoggedIn, setUsername } from '../data/user/user.actions';
interface LoginProps {
setIsLoggedIn: typeof setIsLoggedIn;
setUsername: typeof setUsername;
}
-const Login: React.FC = ({
- setIsLoggedIn,
- setUsername: setUsernameAction,
-}) => {
+const Login: React.FC = ({ setIsLoggedIn, setUsername: setUsernameAction }) => {
const router = useIonRouter();
const [login, setLogin] = useState({ username: '', password: '' });
const [submitted, setSubmitted] = useState(false);
@@ -71,12 +69,8 @@ const Login: React.FC = ({
type="text"
spellCheck={false}
autocapitalize="off"
- errorText={
- submitted && !login.username ? 'Username is required' : ''
- }
- onIonInput={(e) =>
- setLogin({ ...login, username: e.detail.value! })
- }
+ errorText={submitted && !login.username ? 'Username is required' : ''}
+ onIonInput={(e) => setLogin({ ...login, username: e.detail.value! })}
required
/>
@@ -87,12 +81,8 @@ const Login: React.FC = ({
value={login.password}
name="password"
type="password"
- errorText={
- submitted && !login.password ? 'Password is required' : ''
- }
- onIonInput={(e) =>
- setLogin({ ...login, password: e.detail.value! })
- }
+ errorText={submitted && !login.password ? 'Password is required' : ''}
+ onIonInput={(e) => setLogin({ ...login, password: e.detail.value! })}
required
/>
diff --git a/src/pages/MainTabs.tsx b/src/pages/MainTabs.tsx
index e6fd79d5..ed9846c4 100644
--- a/src/pages/MainTabs.tsx
+++ b/src/pages/MainTabs.tsx
@@ -1,12 +1,6 @@
+/* eslint-disable import-x/order -- stylesheet imports must keep their original order */
import React from 'react';
-import {
- IonTabs,
- IonRouterOutlet,
- IonTabBar,
- IonTabButton,
- IonIcon,
- IonLabel,
-} from '@ionic/react';
+import { IonTabs, IonRouterOutlet, IonTabBar, IonTabButton, IonIcon, IonLabel } from '@ionic/react';
import { Route, Navigate } from 'react-router-dom';
import { calendar, location, informationCircle, people } from 'ionicons/icons';
import SchedulePage from './SchedulePage';
diff --git a/src/pages/MapView.tsx b/src/pages/MapView.tsx
index 693b1563..f0c2c906 100644
--- a/src/pages/MapView.tsx
+++ b/src/pages/MapView.tsx
@@ -1,13 +1,7 @@
+/* eslint-disable import-x/order -- stylesheet imports must keep their original order */
import React, { useEffect, useRef } from 'react';
-import {
- IonContent,
- IonHeader,
- IonPage,
- IonTitle,
- IonToolbar,
- useIonViewDidEnter,
-} from '@ionic/react';
-import { Location } from '../models/Location';
+import { IonContent, IonHeader, IonPage, IonTitle, IonToolbar, useIonViewDidEnter } from '@ionic/react';
+import type { Location } from '../models/Location';
import { connect } from '../data/connect';
import { loadLocations } from '../data/locations/locations.actions';
import L from 'leaflet';
@@ -31,10 +25,7 @@ interface DispatchProps {
loadLocations: typeof loadLocations;
}
-const MapView: React.FC = ({
- locations,
- loadLocations,
-}) => {
+const MapView: React.FC = ({ locations, loadLocations }) => {
const mapCanvas = useRef(null);
const map = useRef(null);
const markers = useRef([]);
@@ -63,9 +54,7 @@ const MapView: React.FC = ({
// Add markers for all locations
locations.forEach((location: Location) => {
- const marker = L.marker([location.lat, location.lng])
- .addTo(map.current!)
- .bindPopup(`${location.name}`);
+ const marker = L.marker([location.lat, location.lng]).addTo(map.current!).bindPopup(`${location.name}`);
markers.current.push(marker);
});
diff --git a/src/pages/SchedulePage.tsx b/src/pages/SchedulePage.tsx
index 25751c64..168aec23 100644
--- a/src/pages/SchedulePage.tsx
+++ b/src/pages/SchedulePage.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable import-x/order -- stylesheet imports must keep their original order */
import React, { useState, useRef } from 'react';
import {
@@ -30,7 +31,7 @@ import ShareSocialFab from '../components/ShareSocialFab';
import * as selectors from '../data/selectors';
import { connect } from '../data/connect';
import { setSearchText } from '../data/sessions/sessions.actions';
-import { Schedule } from '../models/Schedule';
+import type { Schedule } from '../models/Schedule';
interface OwnProps {}
@@ -46,19 +47,14 @@ interface DispatchProps {
type SchedulePageProps = OwnProps & StateProps & DispatchProps;
-const SchedulePage: React.FC = ({
- favoritesSchedule,
- schedule,
- setSearchText,
- mode,
-}) => {
+const SchedulePage: React.FC = ({ favoritesSchedule, schedule, setSearchText, mode }) => {
const [segment, setSegment] = useState<'all' | 'favorites'>('all');
const [showSearchbar, setShowSearchbar] = useState(false);
const [showFilterModal, setShowFilterModal] = useState(false);
const ionRefresherRef = useRef(null);
const [showCompleteToast, setShowCompleteToast] = useState(false);
- const pageRef = useRef(null);
+ const [pageElement, setPageElement] = useState(null);
const ios = mode === 'ios';
@@ -70,7 +66,7 @@ const SchedulePage: React.FC = ({
};
return (
-
+
{!showSearchbar && (
@@ -79,10 +75,7 @@ const SchedulePage: React.FC = ({
)}
{ios && (
- setSegment(e.detail.value as any)}
- >
+ setSegment(e.detail.value as any)}>
All
Favorites
@@ -105,11 +98,7 @@ const SchedulePage: React.FC = ({
)}
{!showSearchbar && (
setShowFilterModal(true)}>
- {mode === 'ios' ? (
- 'Filter'
- ) : (
-
)}
@@ -117,10 +106,7 @@ const SchedulePage: React.FC = ({
{!ios && (
- setSegment(e.detail.value as any)}
- >
+ setSegment(e.detail.value as any)}>
All
Favorites
@@ -141,11 +127,7 @@ const SchedulePage: React.FC = ({
-
+
@@ -156,22 +138,14 @@ const SchedulePage: React.FC = ({
onDidDismiss={() => setShowCompleteToast(false)}
/>
- setShowFilterModal(false)}
- presentingElement={pageRef.current!}
+ presentingElement={pageElement ?? undefined}
>
setShowFilterModal(false)} />
diff --git a/src/pages/SessionDetail.tsx b/src/pages/SessionDetail.tsx
index 1ae596c1..60442e4d 100644
--- a/src/pages/SessionDetail.tsx
+++ b/src/pages/SessionDetail.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable import-x/order -- stylesheet imports must keep their original order */
import React from 'react';
import {
IonHeader,
@@ -19,7 +20,7 @@ import * as selectors from '../data/selectors';
import { starOutline, star, share, cloudDownload } from 'ionicons/icons';
import './SessionDetail.scss';
import { addFavorite, removeFavorite } from '../data/sessions/sessions.actions';
-import { Session } from '../models/Schedule';
+import type { Session } from '../models/Schedule';
interface OwnProps {
id?: string;
@@ -37,12 +38,7 @@ interface DispatchProps {
type SessionDetailProps = OwnProps & StateProps & DispatchProps;
-const SessionDetail: React.FC = ({
- session,
- addFavorite,
- removeFavorite,
- favoriteSessions,
-}) => {
+const SessionDetail: React.FC = ({ session, addFavorite, removeFavorite, favoriteSessions }) => {
if (!session) {
return = ({
= ({
sessionClick('download video')} button>
Download Video
-
sessionClick('leave feedback')} button>
Leave Feedback
diff --git a/src/pages/Signup.tsx b/src/pages/Signup.tsx
index 23370afa..0932b9ad 100644
--- a/src/pages/Signup.tsx
+++ b/src/pages/Signup.tsx
@@ -1,4 +1,3 @@
-import React, { useState } from 'react';
import {
IonHeader,
IonToolbar,
@@ -13,19 +12,18 @@ import {
IonInput,
useIonRouter,
} from '@ionic/react';
+import React, { useState } from 'react';
+
import './Signup.scss';
-import { setIsLoggedIn, setUsername } from '../data/user/user.actions';
import { connect } from '../data/connect';
+import { setIsLoggedIn, setUsername } from '../data/user/user.actions';
interface SignupProps {
setIsLoggedIn: typeof setIsLoggedIn;
setUsername: typeof setUsername;
}
-const Signup: React.FC = ({
- setIsLoggedIn,
- setUsername: setUsernameAction,
-}) => {
+const Signup: React.FC = ({ setIsLoggedIn, setUsername: setUsernameAction }) => {
const router = useIonRouter();
const [signup, setSignup] = useState({ username: '', password: '' });
const [submitted, setSubmitted] = useState(false);
@@ -65,12 +63,8 @@ const Signup: React.FC = ({
value={signup.username}
name="username"
type="text"
- errorText={
- submitted && !signup.username ? 'Username is required' : ''
- }
- onIonInput={(e) =>
- setSignup({ ...signup, username: e.detail.value! })
- }
+ errorText={submitted && !signup.username ? 'Username is required' : ''}
+ onIonInput={(e) => setSignup({ ...signup, username: e.detail.value! })}
required
/>
@@ -81,12 +75,8 @@ const Signup: React.FC = ({
value={signup.password}
name="password"
type="password"
- errorText={
- submitted && !signup.password ? 'Password is required' : ''
- }
- onIonInput={(e) =>
- setSignup({ ...signup, password: e.detail.value! })
- }
+ errorText={submitted && !signup.password ? 'Password is required' : ''}
+ onIonInput={(e) => setSignup({ ...signup, password: e.detail.value! })}
required
/>
diff --git a/src/pages/SpeakerDetail.tsx b/src/pages/SpeakerDetail.tsx
index 82ef54a6..497be2b0 100644
--- a/src/pages/SpeakerDetail.tsx
+++ b/src/pages/SpeakerDetail.tsx
@@ -1,9 +1,10 @@
+/* eslint-disable import-x/order -- stylesheet imports must keep their original order */
import React, { useState } from 'react';
import { useParams } from 'react-router-dom';
import './SpeakerDetail.scss';
-import { ActionSheetButton } from '@ionic/core';
+import type { ActionSheetButton } from '@ionic/core';
import {
IonActionSheet,
IonChip,
@@ -30,7 +31,7 @@ import {
import { connect } from '../data/connect';
import * as selectors from '../data/selectors';
-import { Speaker } from '../models/Speaker';
+import type { Speaker } from '../models/Speaker';
interface OwnProps {
id?: string;
@@ -46,9 +47,7 @@ interface SpeakerDetailProps extends OwnProps, StateProps, DispatchProps {}
const SpeakerDetail: React.FC = ({ speaker }) => {
const [showActionSheet, setShowActionSheet] = useState(false);
- const [actionSheetButtons, setActionSheetButtons] = useState<
- ActionSheetButton[]
- >([]);
+ const [actionSheetButtons, setActionSheetButtons] = useState([]);
const [actionSheetHeader, setActionSheetHeader] = useState('');
function openSpeakerShare(speaker: Speaker) {
@@ -114,18 +113,10 @@ const SpeakerDetail: React.FC = ({ speaker }) => {
openContact(speaker)}>
-
openSpeakerShare(speaker)}>
-
@@ -141,32 +132,17 @@ const SpeakerDetail: React.FC = ({ speaker }) => {
-
- openExternalUrl(`https://twitter.com/${speaker.twitter}`)
- }
- >
+ openExternalUrl(`https://twitter.com/${speaker.twitter}`)}>
Twitter
-
- openExternalUrl('https://github.com/ionic-team/ionic-framework')
- }
- >
+ openExternalUrl('https://github.com/ionic-team/ionic-framework')}>
GitHub
-
- openExternalUrl('https://instagram.com/ionicframework')
- }
- >
+ openExternalUrl('https://instagram.com/ionicframework')}>
Instagram
diff --git a/src/pages/SpeakerList.tsx b/src/pages/SpeakerList.tsx
index 9e6f3bc9..28676829 100644
--- a/src/pages/SpeakerList.tsx
+++ b/src/pages/SpeakerList.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
import {
IonHeader,
IonToolbar,
@@ -11,11 +10,13 @@ import {
IonRow,
IonCol,
} from '@ionic/react';
+import React from '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 type { Session } from '../models/Schedule';
+import type { Speaker } from '../models/Speaker';
import './SpeakerList.scss';
interface OwnProps {}
@@ -29,10 +30,7 @@ interface DispatchProps {}
interface SpeakerListProps extends OwnProps, StateProps, DispatchProps {}
-const SpeakerList: React.FC = ({
- speakers,
- speakerSessions,
-}) => {
+const SpeakerList: React.FC = ({ speakers, speakerSessions }) => {
return (
@@ -55,11 +53,7 @@ const SpeakerList: React.FC = ({
{speakers.map((speaker) => (
-
))}
diff --git a/src/pages/Support.tsx b/src/pages/Support.tsx
index ac71d6bd..623e4a04 100644
--- a/src/pages/Support.tsx
+++ b/src/pages/Support.tsx
@@ -1,4 +1,3 @@
-import React, { useState } from 'react';
import {
IonHeader,
IonToolbar,
@@ -14,6 +13,7 @@ import {
useIonToast,
useIonViewWillEnter,
} from '@ionic/react';
+import React, { useState } from 'react';
import './Support.scss';
const Support: React.FC = () => {
@@ -67,11 +67,7 @@ const Support: React.FC = () => {
value={supportMessage}
name="supportQuestion"
rows={6}
- errorText={
- submitted && !supportMessage
- ? 'Support message is required'
- : ''
- }
+ errorText={submitted && !supportMessage ? 'Support message is required' : ''}
onIonInput={(e) => setSupportMessage(e.detail.value!)}
required
/>
diff --git a/src/pages/Tutorial.tsx b/src/pages/Tutorial.tsx
index 87278120..73dfe135 100644
--- a/src/pages/Tutorial.tsx
+++ b/src/pages/Tutorial.tsx
@@ -1,4 +1,5 @@
-import React, { useRef, useEffect } from 'react';
+/* eslint-disable import-x/order -- stylesheet imports must keep their original order */
+import React, { useRef } from 'react';
import {
IonContent,
IonPage,
@@ -24,10 +25,7 @@ interface DispatchProps {
interface TutorialProps extends OwnProps, DispatchProps {}
-const Tutorial: React.FC = ({
- setHasSeenTutorial,
- setMenuEnabled,
-}) => {
+const Tutorial: React.FC = ({ setHasSeenTutorial, setMenuEnabled }) => {
const router = useIonRouter();
const sliderRef = useRef(null);
@@ -63,55 +61,36 @@ const Tutorial: React.FC = ({
- 
+
- 
+
Continue
diff --git a/src/serviceWorker.ts b/src/serviceWorker.ts
index bdab413f..515519a3 100644
--- a/src/serviceWorker.ts
+++ b/src/serviceWorker.ts
@@ -12,12 +12,10 @@
const isLocalhost = Boolean(
window.location.hostname === 'localhost' ||
- // [::1] is the IPv6 localhost address.
- window.location.hostname === '[::1]' ||
- // 127.0.0.1/8 is considered localhost for IPv4.
- window.location.hostname.match(
- /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
- )
+ // [::1] is the IPv6 localhost address.
+ window.location.hostname === '[::1]' ||
+ // 127.0.0.1/8 is considered localhost for IPv4.
+ window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/),
);
type Config = {
@@ -28,10 +26,7 @@ type Config = {
export function register(config?: Config) {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
// The URL constructor is available in all browsers that support SW.
- const publicUrl = new URL(
- (process as { env: { [key: string]: string } }).env.PUBLIC_URL,
- window.location.href
- );
+ const publicUrl = new URL((process as { env: { [key: string]: string } }).env.PUBLIC_URL, window.location.href);
if (publicUrl.origin !== window.location.origin) {
// Our service worker won't work if PUBLIC_URL is on a different origin
// from what our page is served on. This might happen if a CDN is used to
@@ -51,7 +46,7 @@ export function register(config?: Config) {
navigator.serviceWorker.ready.then(() => {
console.log(
'This web app is being served cache-first by a service ' +
- 'worker. To learn more, visit https://bit.ly/CRA-PWA'
+ 'worker. To learn more, visit https://bit.ly/CRA-PWA',
);
});
} else {
@@ -79,7 +74,7 @@ function registerValidSW(swUrl: string, config?: Config) {
// content until all client tabs are closed.
console.log(
'New content is available and will be used when all ' +
- 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
+ 'tabs for this page are closed. See https://bit.ly/CRA-PWA.',
);
// Execute callback
@@ -112,10 +107,7 @@ function checkValidServiceWorker(swUrl: string, config?: Config) {
.then((response) => {
// Ensure service worker exists, and that we really are getting a JS file.
const contentType = response.headers.get('content-type');
- if (
- response.status === 404 ||
- (contentType != null && contentType.indexOf('javascript') === -1)
- ) {
+ if (response.status === 404 || (contentType != null && contentType.indexOf('javascript') === -1)) {
// No service worker found. Probably a different app. Reload the page.
navigator.serviceWorker.ready.then((registration) => {
registration.unregister().then(() => {
@@ -128,9 +120,7 @@ function checkValidServiceWorker(swUrl: string, config?: Config) {
}
})
.catch(() => {
- console.log(
- 'No internet connection found. App is running in offline mode.'
- );
+ console.log('No internet connection found. App is running in offline mode.');
});
}
diff --git a/src/util/types.ts b/src/util/types.ts
index 592d86cb..2e2af957 100644
--- a/src/util/types.ts
+++ b/src/util/types.ts
@@ -5,8 +5,6 @@ export interface DispatchObject {
type PromiseResolveValue = T extends Promise ? R : T;
type EffectType any> = ReturnType>;
-type EffectReturnValue any> = PromiseResolveValue<
- EffectType
->;
+type EffectReturnValue any> = PromiseResolveValue>;
export type ActionType any> =
ReturnType extends DispatchObject ? ReturnType : EffectReturnValue;
diff --git a/vite.config.ts b/vite.config.ts
index 68a89113..b847c572 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,15 +1,15 @@
-import react from '@vitejs/plugin-react'
-import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react';
+import { defineConfig } from 'vite';
// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
server: {
- port: 3000
+ port: 3000,
},
define: {
'process.env': process.env,
- __HMR_CONFIG_NAME__: JSON.stringify('vite')
+ __HMR_CONFIG_NAME__: JSON.stringify('vite'),
},
css: {
preprocessorOptions: {
@@ -17,5 +17,5 @@ export default defineConfig({
api: 'modern',
},
},
- }
-})
+ },
+});
+
{username}
Session not found
;
}
@@ -82,10 +78,7 @@ const SessionDetail: React.FC{session.name}
{session.tracks.map((track) => ( - + {track} ))} @@ -108,12 +101,7 @@ const SessionDetail: React.FC-
- 
+
+
Welcome to ICA
- The ionic conference app is a practical preview of the - ionic framework in action, and a demonstration of proper code - use. + The ionic conference app is a practical preview of the ionic framework in action, and a + demonstration of proper code use.
- 
+
+
What is Ionic?
- Ionic Framework is an open source SDK that enables - developers to build high quality mobile apps with web - technologies like HTML, CSS, and JavaScript. + Ionic Framework is an open source SDK that enables developers to build high quality mobile apps + with web technologies like HTML, CSS, and JavaScript.
+
What is Ionic Appflow?
- Ionic Appflow is a powerful set of services and features - built on top of Ionic Framework that brings a totally new level of - app development agility to mobile dev teams. + Ionic Appflow is a powerful set of services and features built on top of Ionic Framework that + brings a totally new level of app development agility to mobile dev teams.
+