diff --git a/README.md b/README.md index f44ae250..5fb40138 100644 --- a/README.md +++ b/README.md @@ -31,6 +31,10 @@ yarn add react-native-notificated ``` +## 🔥 New Architecture + +React-native-notificated is fully compatible with React new architecture on both Android and iOS. + ## 📖 Documentation Check the docs here [Click](https://thewidlarzgroup.github.io/react-native-notificated/) diff --git a/docs/docs/intro/intro.md b/docs/docs/intro/intro.md index 6fb931cb..a1c82d1e 100644 --- a/docs/docs/intro/intro.md +++ b/docs/docs/intro/intro.md @@ -19,13 +19,11 @@ id: intro yarn add react-native-notificated ``` -:::info -Starting from the latest beta version, you are expected to manually tell the library whether a device has notch or not. Use the `isNotch` prop in the config for it (you can use the `react-native-device-info` for instance). +## 🔥 New Architecture -We are currently working on improving this part of our API 💪 -::: +React-native-notificated is fully compatible with React new architecture on both Android and iOS. -### 🛸 Dependencies +## 🛸 Dependencies This library requires these dependencies to be installed in your project: @@ -41,7 +39,7 @@ yarn add react-native-reanimated react-native-gesture-handler **react-native-gesture-handler** requires additional installation steps: [guide here](https://docs.swmansion.com/react-native-gesture-handler/docs/) 👈 ::: -## ❤️ Built With[](https://gorhom.github.io/react-native-bottom-sheet/#built-with-%EF%B8%8F) +## ❤️ Built With - [react-native-reanimated](https://github.com/software-mansion/react-native-reanimated) - [react-native-gesture-handler](https://github.com/software-mansion/react-native-gesture-handler) diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js index e80ba81c..974e440d 100644 --- a/docs/docusaurus.config.js +++ b/docs/docusaurus.config.js @@ -24,15 +24,9 @@ const config = { docs: { sidebarCollapsible: false, sidebarPath: require.resolve('./sidebars.js'), - // Please change this to your repo. - editUrl: - 'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/', }, blog: { showReadingTime: true, - // Please change this to your repo. - editUrl: - 'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/', }, theme: { customCss: require.resolve('./src/css/custom.css'), @@ -63,7 +57,6 @@ const config = { position: 'left', label: 'API Reference', }, - // {to: '/blog', label: 'Blog', position: 'left'}, { href: 'https://github.com/TheWidlarzGroup/react-native-notificated', label: 'GitHub', @@ -71,51 +64,6 @@ const config = { }, ], }, - // footer: { - // style: 'dark', - // links: [ - // { - // title: 'Docs', - // items: [ - // { - // label: 'Tutorial', - // to: '/docs/intro', - // }, - // ], - // }, - // { - // title: 'Community', - // items: [ - // { - // label: 'Stack Overflow', - // href: 'https://stackoverflow.com/questions/tagged/docusaurus', - // }, - // { - // label: 'Discord', - // href: 'https://discordapp.com/invite/docusaurus', - // }, - // { - // label: 'Twitter', - // href: 'https://twitter.com/docusaurus', - // }, - // ], - // }, - // { - // title: 'More', - // items: [ - // { - // label: 'Blog', - // to: '/blog', - // }, - // { - // label: 'GitHub', - // href: 'https://github.com/facebook/docusaurus', - // }, - // ], - // }, - // ], - // copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`, - // }, prism: { theme: lightCodeTheme, darkTheme: darkCodeTheme, diff --git a/docs/src/pages/index.tsx b/docs/src/pages/index.tsx index 9eb90510..9eb92eb2 100644 --- a/docs/src/pages/index.tsx +++ b/docs/src/pages/index.tsx @@ -1,12 +1,15 @@ -import React from 'react'; -import Layout from '@theme/Layout'; -import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; -import styles from './index.module.css'; -import githubBlackIcon from '../../static/img/githubBlack.png'; -import githubWhiteIcon from '../../static/img/githubWhite.png'; -import isDarkTheme from '@docusaurus/theme-common'; +import React from 'react' +import Layout from '@theme/Layout' +import useDocusaurusContext from '@docusaurus/useDocusaurusContext' +import styles from './index.module.css' +import githubBlackIcon from '../../static/img/githubBlack.png' +import githubWhiteIcon from '../../static/img/githubWhite.png' +import { useColorMode } from '@docusaurus/theme-common' function HomepageHero() { + const themeData = useColorMode() + const isDarkTheme = themeData.colorMode === 'dark' + const buttonStyle = isDarkTheme ? styles.heroButtonWhite : styles.heroButtonBlack const iconColor = isDarkTheme ? githubWhiteIcon : githubBlackIcon const leftLightningColor = isDarkTheme ? styles.whiteLightningLeft : styles.blackLightningLeft @@ -20,35 +23,39 @@ function HomepageHero() {

Blazingly super fast RN notification library

Better than your delivery man!

-
+
- OK, let's go - - github icon + + OK, let's go + + + github icon Github
-
-
-
-
-
-
+
+
+
+
+
+
- ); + ) } export default function Home(): JSX.Element { - const {siteConfig} = useDocusaurusContext(); + const { siteConfig } = useDocusaurusContext() return ( - ); + ) } diff --git a/package.json b/package.json index 5ae165aa..6368360d 100644 --- a/package.json +++ b/package.json @@ -55,7 +55,7 @@ "@twgdev/prettier-config": "^1.0.2", "@types/jest": "^26.0.0", "@types/react": "^16.9.19", - "@types/react-native": "0.66.9", + "@types/react-native": "0.68.4", "babel-plugin-module-resolver": "^4.1.0", "commitlint": "^11.0.0", "eslint": "^7.32.0", diff --git a/src/core/hooks/useStatusBarHeightDetector.ts b/src/core/hooks/useStatusBarHeightDetector.ts index 017424a5..f3a5dcd0 100644 --- a/src/core/hooks/useStatusBarHeightDetector.ts +++ b/src/core/hooks/useStatusBarHeightDetector.ts @@ -5,6 +5,8 @@ type Props = { isPortraitMode: boolean } +const NativeStatusBarManager = require('react-native/Libraries/Components/StatusBar/NativeStatusBarManagerIOS') + export const useStatusBarHeightDetector = ({ isPortraitMode }: Props) => { const { StatusBarManager } = NativeModules const [barHeight, setBarHeight] = useState(0) @@ -12,7 +14,9 @@ export const useStatusBarHeightDetector = ({ isPortraitMode }: Props) => { useEffect(() => { if (Platform.OS !== 'ios') return setBarHeight(StatusBar.currentHeight ?? 0) // handling edge case when app is opened in landscape mode and barHeight = 0 - StatusBarManager.getHeight(({ height }: { height: number }) => + const StatusBarManagerModule = NativeStatusBarManager || StatusBarManager + + StatusBarManagerModule.getHeight(({ height }: { height: number }) => setBarHeight(isPortraitMode && height !== 0 ? height : 50) ) }, [StatusBarManager, isPortraitMode]) diff --git a/yarn.lock b/yarn.lock index 2b117468..3ab9afd4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2482,26 +2482,26 @@ resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.4.tgz#fcf7205c25dff795ee79af1e30da2c9790808f11" integrity sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ== -"@types/react-native@0.66.9": - version "0.66.9" - resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.66.9.tgz#a051d1f1f3cd03df4b4870e91e416b71377a8b7a" - integrity sha512-lve1rgQadbOM82ZRiw6CvvManUeidDhlFtiXA+dErI7a7/NNxLM7kZVYDNKd/QQc5FgLlQ0Uof2QInup7OwsBg== +"@types/react-native@0.68.4": + version "0.68.4" + resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.68.4.tgz#2495a94ae5949511e85beb64792ebeb722c56ce6" + integrity sha512-rPz7HRMNhwPMrzaMtG5QtFpKuIH4XlBkrVSZICqCtHTbaixdtStSyAp9GxkBJAQmmK2McO28mmqDiyqKOoOL5Q== dependencies: - "@types/react" "*" + "@types/react" "^17" -"@types/react@*": - version "17.0.38" - resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.38.tgz#f24249fefd89357d5fa71f739a686b8d7c7202bd" - integrity sha512-SI92X1IA+FMnP3qM5m4QReluXzhcmovhZnLNm3pyeQlooi02qI7sLiepEYqT678uNiyc25XfCqxREFpy3W7YhQ== +"@types/react@^16.9.19": + version "16.14.21" + resolved "https://registry.yarnpkg.com/@types/react/-/react-16.14.21.tgz#35199b21a278355ec7a3c40003bd6a334bd4ae4a" + integrity sha512-rY4DzPKK/4aohyWiDRHS2fotN5rhBSK6/rz1X37KzNna9HJyqtaGAbq9fVttrEPWF5ywpfIP1ITL8Xi2QZn6Eg== dependencies: "@types/prop-types" "*" "@types/scheduler" "*" csstype "^3.0.2" -"@types/react@^16.9.19": - version "16.14.21" - resolved "https://registry.yarnpkg.com/@types/react/-/react-16.14.21.tgz#35199b21a278355ec7a3c40003bd6a334bd4ae4a" - integrity sha512-rY4DzPKK/4aohyWiDRHS2fotN5rhBSK6/rz1X37KzNna9HJyqtaGAbq9fVttrEPWF5ywpfIP1ITL8Xi2QZn6Eg== +"@types/react@^17": + version "17.0.53" + resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.53.tgz#10d4d5999b8af3d6bc6a9369d7eb953da82442ab" + integrity sha512-1yIpQR2zdYu1Z/dc1OxC+MA6GR240u3gcnP4l6mvj/PJiVaqHsQPmWttsvHsfnhfPbU2FuGmo0wSITPygjBmsw== dependencies: "@types/prop-types" "*" "@types/scheduler" "*" @@ -4568,7 +4568,7 @@ eslint-visitor-keys@^2.0.0: resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303" integrity sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw== -eslint@^7.2.0: +eslint@^7.32.0: version "7.32.0" resolved "https://registry.yarnpkg.com/eslint/-/eslint-7.32.0.tgz#c6d328a14be3fb08c8d1d21e12c02fdb7a2a812d" integrity sha512-VHZ8gX+EDfz+97jGcgyGCyRia/dPOd6Xh9yPv8Bl1+SoaIwD+a/vlrOmGRUyOYu7MwUhc7CxqeaDZU13S4+EpA== @@ -9974,9 +9974,9 @@ typedarray@^0.0.6: integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c= typescript@^4.1.3: - version "4.5.4" - resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.5.4.tgz#a17d3a0263bf5c8723b9c52f43c5084edf13c2e8" - integrity sha512-VgYs2A2QIRuGphtzFV7aQJduJ2gyfTljngLzjpfW9FoYZF6xuw1W0vW9ghCKLfcWrCFxK81CSGRAvS1pn4fIUg== + version "4.9.5" + resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.9.5.tgz#095979f9bcc0d09da324d58d03ce8f8374cbe65a" + integrity sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g== ua-parser-js@^0.7.30: version "0.7.31"