From a653050fead5607067040e5d5c10a36027f182db Mon Sep 17 00:00:00 2001 From: Amaury Zarzelli Date: Mon, 30 Dec 2024 18:19:24 +0100 Subject: [PATCH] feat(myaccount): use capacitor preference API instead of localStorage for saved items (#136) --- android/app/capacitor.build.gradle | 1 + android/capacitor.settings.gradle | 3 ++ ios/App/Podfile | 1 + ios/App/PrivacyInfo.xcprivacy | 27 ++++++++++++ package-lock.json | 9 ++++ package.json | 1 + src/js/index.js | 30 +++++++++++++ src/js/my-account/my-account.js | 71 ++++++++++++++++++++---------- 8 files changed, 119 insertions(+), 24 deletions(-) create mode 100644 ios/App/PrivacyInfo.xcprivacy diff --git a/android/app/capacitor.build.gradle b/android/app/capacitor.build.gradle index c00f4b87..70580cda 100644 --- a/android/app/capacitor.build.gradle +++ b/android/app/capacitor.build.gradle @@ -18,6 +18,7 @@ dependencies { implementation project(':capacitor-geolocation') implementation project(':capacitor-keyboard') implementation project(':capacitor-network') + implementation project(':capacitor-preferences') implementation project(':capacitor-screen-orientation') implementation project(':capacitor-share') implementation project(':capacitor-splash-screen') diff --git a/android/capacitor.settings.gradle b/android/capacitor.settings.gradle index a3d99d6e..f68133b8 100644 --- a/android/capacitor.settings.gradle +++ b/android/capacitor.settings.gradle @@ -29,6 +29,9 @@ project(':capacitor-keyboard').projectDir = new File('../node_modules/@capacitor include ':capacitor-network' project(':capacitor-network').projectDir = new File('../node_modules/@capacitor/network/android') +include ':capacitor-preferences' +project(':capacitor-preferences').projectDir = new File('../node_modules/@capacitor/preferences/android') + include ':capacitor-screen-orientation' project(':capacitor-screen-orientation').projectDir = new File('../node_modules/@capacitor/screen-orientation/android') diff --git a/ios/App/Podfile b/ios/App/Podfile index 04021e88..0c0a1fd6 100644 --- a/ios/App/Podfile +++ b/ios/App/Podfile @@ -20,6 +20,7 @@ def capacitor_pods pod 'CapacitorGeolocation', :path => '../../node_modules/@capacitor/geolocation' pod 'CapacitorKeyboard', :path => '../../node_modules/@capacitor/keyboard' pod 'CapacitorNetwork', :path => '../../node_modules/@capacitor/network' + pod 'CapacitorPreferences', :path => '../../node_modules/@capacitor/preferences' pod 'CapacitorScreenOrientation', :path => '../../node_modules/@capacitor/screen-orientation' pod 'CapacitorShare', :path => '../../node_modules/@capacitor/share' pod 'CapacitorSplashScreen', :path => '../../node_modules/@capacitor/splash-screen' diff --git a/ios/App/PrivacyInfo.xcprivacy b/ios/App/PrivacyInfo.xcprivacy new file mode 100644 index 00000000..9edca4a3 --- /dev/null +++ b/ios/App/PrivacyInfo.xcprivacy @@ -0,0 +1,27 @@ + + + + + NSPrivacyAccessedAPITypes + + + + NSPrivacyAccessedAPIType + NSPrivacyAccessedAPICategoryFileTimestamp + NSPrivacyAccessedAPITypeReasons + + C617.1 + + + + + NSPrivacyAccessedAPIType + NSPrivacyAccessedAPICategoryUserDefaults + NSPrivacyAccessedAPITypeReasons + + CA92.1 + + + + + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 6104dfeb..730a9fda 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,6 +21,7 @@ "@capacitor/ios": "^6.0.0", "@capacitor/keyboard": "^6.0.0", "@capacitor/network": "^6.0.0", + "@capacitor/preferences": "^6.0.3", "@capacitor/screen-orientation": "^6.0.0", "@capacitor/share": "^6.0.0", "@capacitor/splash-screen": "^6.0.0", @@ -2130,6 +2131,14 @@ "@capacitor/core": "^6.0.0" } }, + "node_modules/@capacitor/preferences": { + "version": "6.0.3", + "resolved": "https://registry.npmjs.org/@capacitor/preferences/-/preferences-6.0.3.tgz", + "integrity": "sha512-3I1BbhhCBTMBziVvr0fU7RCRXqGvhUW/apHLRJSaJAWonASya5rp6AWsHv1lW1tkF0avUOMwp6e7iNA4UUGu8g==", + "peerDependencies": { + "@capacitor/core": "^6.0.0" + } + }, "node_modules/@capacitor/screen-orientation": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/@capacitor/screen-orientation/-/screen-orientation-6.0.0.tgz", diff --git a/package.json b/package.json index 59a6d7f8..ee1fcc88 100644 --- a/package.json +++ b/package.json @@ -41,6 +41,7 @@ "@capacitor/ios": "^6.0.0", "@capacitor/keyboard": "^6.0.0", "@capacitor/network": "^6.0.0", + "@capacitor/preferences": "^6.0.3", "@capacitor/screen-orientation": "^6.0.0", "@capacitor/share": "^6.0.0", "@capacitor/splash-screen": "^6.0.0", diff --git a/src/js/index.js b/src/js/index.js index cf375669..493d006a 100644 --- a/src/js/index.js +++ b/src/js/index.js @@ -28,6 +28,7 @@ import { SafeArea, SafeAreaController } from "@aashu-dubey/capacitor-statusbar-s import { TextZoom } from "@capacitor/text-zoom"; import { Device } from "@capacitor/device"; import { App } from "@capacitor/app"; +import { Preferences } from "@capacitor/preferences"; // import CSS import "@maplibre/maplibre-gl-compare/dist/maplibre-gl-compare.css"; @@ -42,6 +43,35 @@ defineCustomElements(window); * Fonction définissant l'application */ function app() { + // REMOVEME : rétrocompatibilité des itinéraires / PR / PR comparer : migration du localStorage vers Preferences + if (localStorage.getItem("savedRoutes")) { + Preferences.set({ + key: "savedRoutes", + value: localStorage.getItem("savedRoutes"), + }).then( () => { + localStorage.removeItem("savedRoutes"); + }); + } + + if (localStorage.getItem("savedLandmarks")) { + Preferences.set({ + key: "savedLandmarks", + value: localStorage.getItem("savedLandmarks"), + }).then( () => { + localStorage.removeItem("savedLandmarks"); + }); + } + + if (localStorage.getItem("savedCompareLandmarks")) { + Preferences.set({ + key: "savedCompareLandmarks", + value: localStorage.getItem("savedCompareLandmarks"), + }).then( () => { + localStorage.removeItem("savedCompareLandmarks"); + }); + } + // END REMOVEME + // Ecouteur sur le chargement total des contrôles window.addEventListener("controlsloaded", async () => { SplashScreen.hide(); diff --git a/src/js/my-account/my-account.js b/src/js/my-account/my-account.js index 3bcdf811..186fc2a2 100644 --- a/src/js/my-account/my-account.js +++ b/src/js/my-account/my-account.js @@ -18,6 +18,7 @@ import { Toast } from "@capacitor/toast"; import { Filesystem, Directory, Encoding } from "@capacitor/filesystem"; import { FilePicker } from "@capawesome/capacitor-file-picker"; import { App } from "@capacitor/app"; +import { Preferences } from "@capacitor/preferences"; import maplibregl from "maplibre-gl"; import Sortable from "sortablejs"; import { kml, gpx } from "@tmcw/togeojson"; @@ -87,28 +88,32 @@ class MyAccount { this.lastCompareLandmarkId = 0; // récupération des itinéraires enregistrés en local - if (!localStorage.getItem("savedRoutes")) { - localStorage.setItem("savedRoutes", "[]"); - } else { - var localRoutes = JSON.parse(localStorage.getItem("savedRoutes")); - this.routes = this.routes.concat(localRoutes.filter( route => !route.type)); - } + Preferences.get( { key: "savedRoutes"} ).then( (resp) => { + if (resp.value) { + var localRoutes = JSON.parse(resp.value); + console.log(localRoutes); + this.routes = this.routes.concat(localRoutes.filter( route => !route.type)); + this.#updateSources(); + } + }); // récupération des points de repère enregistrés en local - if (!localStorage.getItem("savedLandmarks")) { - localStorage.setItem("savedLandmarks", "[]"); - } else { - var localLandmarks = JSON.parse(localStorage.getItem("savedLandmarks")); - this.landmarks = this.landmarks.concat(localLandmarks); - } + Preferences.get( { key: "savedLandmarks"} ).then( (resp) => { + if (resp.value) { + var localLandmarks = JSON.parse(resp.value); + this.landmarks = this.landmarks.concat(localLandmarks); + this.#updateSources(); + } + }); // récupération des points de repère comparer enregistrés en local - if (!localStorage.getItem("savedCompareLandmarks")) { - localStorage.setItem("savedCompareLandmarks", "[]"); - } else { - var localCompareLandmarks = JSON.parse(localStorage.getItem("savedCompareLandmarks")); - this.compareLandmarks = this.compareLandmarks.concat(localCompareLandmarks); - } + Preferences.get( { key: "savedCompareLandmarks"} ).then( (resp) => { + if (resp.value) { + var localCompareLandmarks = JSON.parse(resp.value); + this.compareLandmarks = this.compareLandmarks.concat(localCompareLandmarks); + this.#updateSources(); + } + }); this.map.loadImage(LandmarkIconSaved).then((image) => { this.map.addImage("landmark-icon-saved", image.data); @@ -485,7 +490,10 @@ class MyAccount { this.routes.unshift(drawRouteSaveOptions); } this.__updateAccountRoutesContainerDOMElement(this.routes); - localStorage.setItem("savedRoutes", JSON.stringify(this.routes)); + Preferences.set({ + key: "savedRoutes", + value: JSON.stringify(this.routes), + }); this.#updateSources(); let coordinates = []; drawRouteSaveOptions.data.steps.forEach((step) => { @@ -528,7 +536,10 @@ class MyAccount { this.landmarks.unshift(newlandmark); } this.__updateAccountLandmarksContainerDOMElement(this.landmarks); - localStorage.setItem("savedLandmarks", JSON.stringify(this.landmarks)); + Preferences.set({ + key: "savedLandmarks", + value: JSON.stringify(this.landmarks), + }); this.#updateSources(); } @@ -551,7 +562,10 @@ class MyAccount { this.compareLandmarks.unshift(newlandmark); } this.__updateAccountCompareLandmarksContainerDOMElement(this.compareLandmarks); - localStorage.setItem("savedCompareLandmarks", JSON.stringify(this.compareLandmarks)); + Preferences.set({ + key: "savedCompareLandmarks", + value: JSON.stringify(this.compareLandmarks), + }); this.#updateSources(); } @@ -566,7 +580,10 @@ class MyAccount { } this.routes.splice(i, 1); this.__updateAccountRoutesContainerDOMElement(this.routes); - localStorage.setItem("savedRoutes", JSON.stringify(this.routes)); + Preferences.set({ + key: "savedRoutes", + value: JSON.stringify(this.routes), + }); this.#updateSources(); break; } @@ -583,7 +600,10 @@ class MyAccount { } this.landmarks.splice(i, 1); this.__updateAccountLandmarksContainerDOMElement(this.landmarks); - localStorage.setItem("savedLandmarks", JSON.stringify(this.landmarks)); + Preferences.set({ + key: "savedLandmarks", + value: JSON.stringify(this.landmarks), + }); this.#updateSources(); break; } @@ -600,7 +620,10 @@ class MyAccount { } this.compareLandmarks.splice(i, 1); this.__updateAccountCompareLandmarksContainerDOMElement(this.compareLandmarks); - localStorage.setItem("savedCompareLandmarks", JSON.stringify(this.compareLandmarks)); + Preferences.set({ + key: "savedCompareLandmarks", + value: JSON.stringify(this.compareLandmarks), + }); this.#updateSources(); break; }