import { IonButton, IonButtons, IonContent, IonIcon, IonItem, IonList, IonModal, IonTitle, IonToolbar, } from '@ionic/react'; import { trash } from 'ionicons/icons'; import React, { Fragment, useRef } from 'react'; import { useFind, useDB } from 'react-pouchdb'; import { deleteGps } from '../../db/gpx'; import { enterAnimation, leaveAnimation } from '../../lib/animation'; import phoneRoute from '../../theme/icons/font-gis/svg/routing/uEB08-phone-route-nons.svg'; import GpxImport from './gpx-import'; import GpxExport from './GpxExport'; const TrackBrowser: React.FC<{}> = () => { const gpxes = useFind({ selector: { type: 'gpx', }, }); const db = useDB(); const modal = useRef(null); const dismiss = () => { modal.current?.dismiss(); }; return ( GPS tracks Tracks dismiss()}>Close {gpxes.map((gpx: any) => { return ( {gpx.gpx.metadata.time} { deleteGps(db, { _id: gpx._id, _rev: gpx._rev }); }} color='danger' > ); })} ); }; export default TrackBrowser;