feat: the standalone mode supports promotion

czabaj · Jul 31, 2023 · 1c622a1 · 1c622a1
1 parent 8ac97a2
commit 1c622a1
Show file tree

Hide file tree

Showing 7 changed files with 28 additions and 11 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "dependencies": {
-    "@nobleai/rescript-rxjs": "https://github.com/czabaj/rescript-rxjs#73a625653408bd262ac481847108ede30a99442e",
+    "@nobleai/rescript-rxjs": "https://github.com/czabaj/rescript-rxjs#e9e24c22406f40dcaa70f3c0fd8deb07237d3dca",
     "@oddbird/popover-polyfill": "^0.2.2",
     "@rescript/core": "^0.4.0",
     "@rescript/react": "^0.11.0",

diff --git a/src/components/FirebaseFirestoreProvider/FirebaseFirestoreProvider.res b/src/components/FirebaseFirestoreProvider/FirebaseFirestoreProvider.res
@@ -5,13 +5,15 @@ let make = (~children) => {
   open Reactfire
   open Firebase
 
+  let isStandaloneModeStatus = DomUtils.useIsStandaloneMode()
   let {status, data: firestore} = useInitFirestore(async app => {
     switch initializedFirestore.contents {
     | Some(firestore) => firestore
     | None => {
+        let isStandaloneMode = isStandaloneModeStatus.data->Option.getWithDefault(false)
         let firestore = initializeFirestore(
           app,
-          !DomUtils.isStandaloneMode && AppStorage.getThrustDevice() === None
+          !isStandaloneMode && AppStorage.getThrustDevice() === None
             ? {}
             : {
                 localCache: FirestoreLocalCache.persistentLocalCache({

diff --git a/src/pages/MyPlaces/EditUser.res b/src/pages/MyPlaces/EditUser.res
@@ -5,6 +5,7 @@ module Validators = Validators.CustomValidators(FormFields)
 
 @react.component
 let make = (~initialName, ~onDismiss, ~onSubmit) => {
+  let isStandaloneModeStatus = DomUtils.useIsStandaloneMode()
   React.useEffect0(() => {
     let initialThrustDevide = AppStorage.getThrustDevice() !== None
     Some(
@@ -61,7 +62,10 @@ let make = (~initialName, ~onDismiss, ~onSubmit) => {
               />
             }}
           />
-          {DomUtils.isStandaloneMode ? React.null : <InputThrustDevice />}
+          {switch isStandaloneModeStatus.data {
+          | Some(true) => React.null
+          | _ => <InputThrustDevice />
+          }}
         </fieldset>
       </form>
     </Form.Provider>

diff --git a/src/pages/Unauthenticated/Unauthenticated.res b/src/pages/Unauthenticated/Unauthenticated.res
@@ -10,6 +10,7 @@ module Validators = Validators.CustomValidators(FormFields)
 module Pure = {
   @genType @react.component
   let make = (~initialEmail, ~onBackToForm, ~onGoogleAuth, ~onPasswordAuth, ~signInEmailSent=?) => {
+    let isStandaloneModeStatus = DomUtils.useIsStandaloneMode()
     let form = Form.use(
       ~initialState={email: initialEmail},
       ~onSubmit=({state, raiseSubmitFailed}) => {
@@ -56,7 +57,10 @@ module Pure = {
           <Form.Provider value=Some(form)>
             <form onSubmit={ReForm.Helpers.handleSubmit(form.submit)}>
               <fieldset className={`reset ${Styles.fieldset.grid}`}>
-                {DomUtils.isStandaloneMode ? React.null : <InputThrustDevice />}
+                {switch isStandaloneModeStatus.data {
+                | Some(true) => React.null
+                | _ => <InputThrustDevice />
+                }}
                 <Form.Field
                   field=Email
                   render={field => {

diff --git a/src/styles/elements.css b/src/styles/elements.css
@@ -38,9 +38,6 @@ h3,
 h4 {
   /* Help prevent overflow of long words/names/URL */
   overflow-wrap: break-word;
-
-  /* Optional, not supported for all languages */
-  hyphens: auto;
 }
 
 button:disabled,

diff --git a/src/utils/DomUtils.res b/src/utils/DomUtils.res
@@ -20,5 +20,15 @@ let share = (data: shareData) => {
 
 @get external matches: Webapi.Dom.Window.mediaQueryList => bool = "matches"
 
-let isStandaloneMode =
-  Webapi.Dom.window->Webapi.Dom.Window.matchMedia("(display-mode: standalone)")->matches
+let mediaRx = query => {
+  open Rxjs
+  open! Webapi.Dom
+  let mediaQuery = window->Window.matchMedia(query)
+  fromEvent(. mediaQuery, "change")->pipe2(startWith(mediaQuery), map((list, _) => list->matches))
+}
+
+let standaloneModeRx = mediaRx("(display-mode: standalone)")
+
+let useIsStandaloneMode = () => {
+  Reactfire.useObservable(~observableId="isStandaloneMode", ~source=standaloneModeRx)
+}
diff --git a/yarn.lock b/yarn.lock
@@ -2375,9 +2375,9 @@
   resolved "https://registry.yarnpkg.com/@nicolo-ribaudo/semver-v6/-/semver-v6-6.3.3.tgz#ea6d23ade78a325f7a52750aab1526b02b628c29"
   integrity sha512-3Yc1fUTs69MG/uZbJlLSI3JISMn2UV2rg+1D/vROUqZyh3l6iYHCs7GMp+M40ZD7yOdDbYjJcU1oTJhrc+dGKg==
 
-"@nobleai/rescript-rxjs@https://github.com/czabaj/rescript-rxjs#73a625653408bd262ac481847108ede30a99442e":
+"@nobleai/rescript-rxjs@https://github.com/czabaj/rescript-rxjs#e9e24c22406f40dcaa70f3c0fd8deb07237d3dca":
   version "7.5.9"
-  resolved "https://github.com/czabaj/rescript-rxjs#73a625653408bd262ac481847108ede30a99442e"
+  resolved "https://github.com/czabaj/rescript-rxjs#e9e24c22406f40dcaa70f3c0fd8deb07237d3dca"
 
 "@nodelib/fs.scandir@2.1.5":
   version "2.1.5"