Skip to content
This repository has been archived by the owner on Jun 15, 2022. It is now read-only.

Commit

Permalink
Merge branch 'develop' of github.com:standardnotes/mobile
Browse files Browse the repository at this point in the history
  • Loading branch information
moughxyz committed Dec 9, 2021
2 parents 0237821 + 7153a76 commit 0e3a799
Show file tree
Hide file tree
Showing 8 changed files with 174 additions and 15 deletions.
1 change: 1 addition & 0 deletions android/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ buildscript {
minSdkVersion = 21
compileSdkVersion = 30
targetSdkVersion = 30
androidXCore = "1.6.0"
}
repositories {
google()
Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@
"@expo/react-native-action-sheet": "^3.8.0",
"@react-native-community/async-storage": "1.12.1",
"@react-native-community/masked-view": "^0.1.10",
"@react-native-community/netinfo": "^6.0.6",
"@react-native-community/segmented-control": "^2.2.2",
"@react-navigation/native": "^5.9.3",
"@react-navigation/stack": "^5.14.3",
Expand Down
17 changes: 12 additions & 5 deletions src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { ActionSheetProvider } from '@expo/react-native-action-sheet';
import { MobileApplication } from '@Lib/application';
import { ApplicationGroup } from '@Lib/application_group';
import { navigationRef } from '@Lib/navigation_service';
import { NetworkService, NetworkServiceContext } from '@Lib/network_service';
import { DefaultTheme, NavigationContainer } from '@react-navigation/native';
import { DeinitSource } from '@standardnotes/snjs';
import { MobileThemeVariables } from '@Style/Themes/styled-components';
Expand Down Expand Up @@ -126,6 +127,9 @@ const AppComponent: React.FC<{
const AppGroupInstance = new ApplicationGroup();
AppGroupInstance.initialize();

const networkServiceInstance = new NetworkService();
networkServiceInstance.registerObservers();

export const App = (props: { env: 'prod' | 'dev'; bugsnagOptOut: boolean }) => {
const applicationGroupRef = useRef(AppGroupInstance);
const [application, setApplication] = useState<
Expand All @@ -152,14 +156,17 @@ export const App = (props: { env: 'prod' | 'dev'; bugsnagOptOut: boolean }) => {
);
return removeAppChangeObserver;
}, [applicationGroupRef.current.primaryApplication]);

return (
<ApplicationContext.Provider value={application}>
{application && (
<AppComponent
env={props.env}
key={application.Uuid}
application={application}
/>
<NetworkServiceContext.Provider value={networkServiceInstance}>
<AppComponent
env={props.env}
key={application.Uuid}
application={application}
/>
</NetworkServiceContext.Provider>
)}
</ApplicationContext.Provider>
);
Expand Down
102 changes: 102 additions & 0 deletions src/lib/network_service.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,102 @@
import NetInfo, { NetInfoConfiguration } from '@react-native-community/netinfo';
import { removeFromArray } from '@standardnotes/snjs';
import React, { useEffect, useState } from 'react';

export const useIsOffline = () => {
const networkService = React.useContext(NetworkServiceContext);
const [isOffline, setIsOffline] = useState(false);

useEffect(() => {
const removeOfflineObserver = networkService!.addNetworkChangeObserver(
networkState =>
setIsOffline(
!networkState.isConnected || !networkState.isInternetReachable
)
);

return () => {
removeOfflineObserver && removeOfflineObserver();
};
}, [networkService]);

return [isOffline];
};

export const NetworkServiceContext = React.createContext<
NetworkService | undefined
>(undefined);

type NetworkState = {
/**
* If there is an active network connection. If unknown defaults to null.
*/
isConnected: boolean | null;
/**
* If the internet is reachable with the currently active network connection.
* If unknown defaults to null.
*/
isInternetReachable: boolean | null;
};

type NetworkChangeObserver = (
networkState: NetworkState
) => Promise<void> | void;

export class NetworkService {
private observers: NetworkChangeObserver[] = [];
private removeNetworkChangeListener?: () => void;

constructor(configuration?: NetInfoConfiguration) {
if (configuration) {
NetInfo.configure({
...configuration,
});
}
}

deinit() {
if (this.removeNetworkChangeListener) {
this.removeNetworkChangeListener();
this.removeNetworkChangeListener = undefined;
}
this.observers.length = 0;
}

async registerObservers() {
this.removeNetworkChangeListener = NetInfo.addEventListener(
({ isConnected, isInternetReachable }) => {
this.notifyObserversOfNetworkChange({
isConnected,
isInternetReachable,
});
}
);
}

/**
* Registers an observer for network change
* @returns function that unregisters this observer
*/
public addNetworkChangeObserver(callback: NetworkChangeObserver) {
// Sets initial values.
NetInfo.fetch().then(({ isConnected, isInternetReachable }) => {
callback({
isConnected,
isInternetReachable,
});
});

// Execute callback on subsequent network state changes.
this.observers.push(callback);

return () => {
removeFromArray(this.observers, callback);
};
}

private notifyObserversOfNetworkChange(networkState: NetworkState) {
for (const observer of this.observers) {
observer(networkState);
}
}
}
44 changes: 35 additions & 9 deletions src/screens/Compose/ComponentView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -85,32 +85,58 @@ export const ComponentView = ({
}, [application, liveComponent?.item.uuid, componentUuid]);

useEffect(() => {
const warnUnsupportedEditors = async () => {
const warnIfUnsupportedEditors = async () => {
let platformVersionRequirements;

switch (Platform.OS) {
case 'ios':
if (parseInt(Platform.Version.toString(), 10) < 11) {
// WKWebView has issues on iOS < 11
platformVersionRequirements = 'iOS 11 or greater';
}
break;
case 'android':
if (Platform.Version <= 23) {
/**
* postMessage doesn't work on Android <= 6 (API version 23)
* https://github.com/facebook/react-native/issues/11594
*/
platformVersionRequirements = 'Android 7.0 or greater';
}
break;
}

if (!platformVersionRequirements) {
return;
}

const doNotShowAgainUnsupportedEditors = application
?.getLocalPreferences()
.getValue(PrefKey.DoNotShowAgainUnsupportedEditors, false);

if (!doNotShowAgainUnsupportedEditors) {
const alertText =
`Web editors require ${platformVersionRequirements}. ` +
'Your version does not support web editors. ' +
'Changes you make may not be properly saved. Please switch to the Plain Editor for the best experience.';

const confirmed = await application?.alertService?.confirm(
'Web editors require Android 7.0 or greater. Your version does not support web editors. Changes you make may not be properly saved. Please switch to the Plain Editor for the best experience.',
alertText,
'Editors Not Supported',
"Don't show again",
ButtonType.Info,
'OK'
);

if (confirmed) {
application
?.getLocalPreferences()
.setUserPrefValue(PrefKey.DoNotShowAgainUnsupportedEditors, true);
}
}
};
if (Platform.OS === 'android' && Platform.Version <= 23) {
/**
* postMessage doesn't work on Android <= 6 (API version 23)
* https://github.com/facebook/react-native/issues/11594
*/
warnUnsupportedEditors();
}

warnIfUnsupportedEditors();
}, [application]);

useEffect(() => {
Expand Down
12 changes: 12 additions & 0 deletions src/screens/ManageSessions/ManageSessions.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { useIsOffline } from '@Lib/network_service';
import { ApplicationContext } from '@Root/ApplicationContext';
import { LoadingContainer, LoadingText } from '@Screens/Notes/NoteList.styled';
import {
Expand Down Expand Up @@ -89,6 +90,7 @@ export const ManageSessions: React.FC = () => {
const { showActionSheet } = useCustomActionSheet();
const theme = useContext(ThemeContext);
const insets = useSafeAreaInsets();
const [isOffline] = useIsOffline();

const [
sessions,
Expand Down Expand Up @@ -144,6 +146,16 @@ export const ManageSessions: React.FC = () => {
);
};

if (isOffline) {
return (
<LoadingContainer>
<LoadingText textAlign="center">
{'You are offline.\nPlease check your network connection.'}
</LoadingText>
</LoadingContainer>
);
}

if (errorMessage) {
return (
<LoadingContainer>
Expand Down
7 changes: 6 additions & 1 deletion src/screens/Notes/NoteList.styled.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,10 +25,15 @@ export const LoadingContainer = styled.View`
justify-content: center;
`;

export const LoadingText = styled.Text`
interface LoadingTextProps {
textAlign?: 'left' | 'center' | 'right' | 'justify';
}

export const LoadingText = styled.Text<LoadingTextProps>`
position: absolute;
opacity: 0.5;
color: ${props => props.theme.stylekitForegroundColor};
text-align: ${props => props.textAlign ?? 'left'};
`;

export const HeaderContainer = styled.View`
Expand Down
5 changes: 5 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1534,6 +1534,11 @@
resolved "https://registry.yarnpkg.com/@react-native-community/masked-view/-/masked-view-0.1.10.tgz#5dda643e19e587793bc2034dd9bf7398ad43d401"
integrity sha512-rk4sWFsmtOw8oyx8SD3KSvawwaK7gRBSEIy2TAwURyGt+3TizssXP1r8nx3zY+R7v2vYYHXZ+k2/GULAT/bcaQ==

"@react-native-community/netinfo@^6.0.6":
version "6.0.6"
resolved "https://registry.yarnpkg.com/@react-native-community/netinfo/-/netinfo-6.0.6.tgz#41a81786aed010926ab63d5f576025c9688a2ed0"
integrity sha512-Lyshmg15NfKLPp3evXkg8yrhBpJlzb4b7M9z5/yDqot7P2WNmBmOYfsYjhlTCLmBV/N/U+MnA5V5NGmUKUS49A==

"@react-native-community/segmented-control@^2.2.2":
version "2.2.2"
resolved "https://registry.yarnpkg.com/@react-native-community/segmented-control/-/segmented-control-2.2.2.tgz#4014256819ab8f40f6bc3a3929ff14a9d149cf04"
Expand Down

0 comments on commit 0e3a799

Please sign in to comment.