scommons / scommons-react-native Goto Github PK

View Code? Open in Web Editor NEW

11.0 2.0 2.0 20.99 MB

Scala.js facades for react-native and expo APIs and components

Home Page: https://scommons.github.io/scommons-react-native/

License: Apache License 2.0

Scala 97.86% JavaScript 2.06% Shell 0.08%

scala scalajs scalajs-reactjs react-native scala-facade reactnative mobile facades expo scala-facades

scommons-react-native's Introduction

Scala Commons Client

Common Scala.js, React.js web-client utilities and components.

Showcase/Demo UI

To see the showcase/demo UI with all the components live use the following link:

https://scommons.github.io/scommons-client/showcase/

How to add it to your project

val scommonsApiVer = "1.0.0-SNAPSHOT"
val scommonsReactVer = "1.0.0-SNAPSHOT"
val scommonsClientVer = "1.0.0-SNAPSHOT"
val scommonsServiceVer = "1.0.0-SNAPSHOT"

libraryDependencies ++= Seq(
  // shared
  "org.scommons.api" %%% "scommons-api-core" % scommonsApiVer,
  "org.scommons.api" %%% "scommons-api-joda-time" % scommonsApiVer,

  // client/js only
  "org.scommons.api" %%% "scommons-api-xhr" % scommonsApiVer,
  "org.scommons.client" %%% "scommons-client-ui" % scommonsClientVer,
  "org.scommons.react" %%% "scommons-react-test-dom" % scommonsReactVer % "test",

  // server/jvm only
  "org.scommons.service" %% "scommons-service-play" % scommonsServiceVer,
  "org.scommons.api" %% "scommons-api-play-ws" % scommonsApiVer % "test"
)

Latest SNAPSHOT version is published to Sonatype Repo, just make sure you added the proper dependency resolver to your build.sbt settings:

resolvers += "Sonatype Snapshots" at "https://oss.sonatype.org/content/repositories/snapshots/"

How to use it

TablePanelDemo => tests
- SimpleTablePanel => tests
- CustomTablePanel => tests

How to Build

To build and run all the tests use the following command:

sbt clean test

How to Run Showcase/Demo locally

Please, see the README.md in showcase sub-project page.

Documentation

You can find more documentation here

scommons-react-native's People

Contributors

Stargazers

Watchers

Forkers

myyk capesepias

scommons-react-native's Issues

Rename scommons-expo-av to scommons-expo

barest bones hello world example required

newcomers would be confused if they are just to understand how everything is wired. a barest bone hello world example, will be helpful in getting to understand the just the wiring.

Document setup for Managed Workflow

Facade for new react-navigation Group component

https://reactnavigation.org/docs/group/

Add facade for AsyncStorage

https://github.com/react-native-community/async-storage

Use extracted Picker component facade

https://github.com/react-native-picker/picker

Add facade for react-native-htmlview

https://github.com/jsdf/react-native-htmlview

Add options for bottom-tab navigator

https://reactnavigation.org/docs/bottom-tab-navigator

Add facade for react-native-safe-area-context

https://reactnavigation.org/docs/handling-safe-area

Upgrade to Expo SDK 43

https://blog.expo.dev/expo-sdk-43-aa9b3c7d5541

https://github.com/expo/expo/blob/master/CHANGELOG.md

Alert does not show up right after Modal was hidden

In the scommons.reactnative.app.AppTaskManagerUi component's render method we display react-native's Modal (via LoadingPopup) first and then if there is any error we hide it and show ErrorPopup which uses react-native's Alert API to show native alert popup:

    <.>()(
      <(TaskLogger())(^.wrapped := TaskLoggerProps(statusMessage))(),
      
      if (props.showLoading) Some(
        <(LoadingPopup())(^.wrapped := loadingProps)()
      ) else if (showError) Some(
        <(ErrorPopup())(^.wrapped := ErrorPopupProps(
          error = errorMessage,
          onClose = props.onCloseErrorPopup,
          details = props.errorDetails
        ))()
      ) else None
    )

Current issue is that Alert is not always shows up. When Modal is not used the Alert is always shows up. So, the issue is clearly related to the previously shown Modal.

As a quick fix for now we may consider inserting small delay, ~100ms should be enough (we should test it!) before Alert is shown to let Modal completely disappear:

    useEffect({ () =>
      if (!showDetails) {
        // fix Alert is not showing just after loading modal is closed
        setTimeout({ () =>
          showAlert()
        }, 100)
      }
      else {
        showAlert()
      }
      ()
    }, List(showDetails))