Make RelinkDialog supersede the NetworkDialog

ts/components/LeftPane.tsx

@@ -393,9 +393,9 @@ export class LeftPane extends React.Component<PropsType> {
           {showArchived ? this.renderArchivedHeader() : renderMainHeader()}
         </div>
         {renderExpiredBuildDialog()}
+        {renderRelinkDialog()}
         {renderNetworkStatus()}
         {renderUpdateDialog()}
-        {renderRelinkDialog()}
         {showArchived && (
           <div className="module-left-pane__archive-helper-text" key={0}>
             {i18n('archiveHelperText')}

ts/components/RelinkDialog.stories.tsx

@@ -13,7 +13,6 @@ import { action } from '@storybook/addon-actions';
 const i18n = setupI18n('en', enMessages);
 
 const defaultProps = {
-  hasNetworkDialog: false,
   i18n,
   isRegistrationDone: true,
   relinkDevice: action('relink-device'),
@@ -21,31 +20,19 @@ const defaultProps = {
 
 const permutations = [
   {
-    title: 'Unlinked (online)',
+    title: 'Unlinked',
     props: {
       isRegistrationDone: false,
     },
   },
-  {
-    title: 'Unlinked (offline)',
-    props: {
-      hasNetworkDialog: true,
-      isRegistrationDone: false,
-    },
-  },
 ];
 
 storiesOf('Components/RelinkDialog', module)
   .add('Knobs Playground', () => {
-    const hasNetworkDialog = boolean('hasNetworkDialog', false);
     const isRegistrationDone = boolean('isRegistrationDone', false);
 
     return (
-      <RelinkDialog
+      <RelinkDialog {...defaultProps} isRegistrationDone={isRegistrationDone} />
-        {...defaultProps}
-        hasNetworkDialog={hasNetworkDialog}
-        isRegistrationDone={isRegistrationDone}
-      />
     );
   })
   .add('Iterations', () => {

ts/components/RelinkDialog.tsx

@@ -3,19 +3,17 @@ import React from 'react';
 import { LocalizerType } from '../types/Util';
 
 export interface PropsType {
-  hasNetworkDialog: boolean;
   i18n: LocalizerType;
   isRegistrationDone: boolean;
   relinkDevice: () => void;
 }
 
 export const RelinkDialog = ({
-  hasNetworkDialog,
   i18n,
   isRegistrationDone,
   relinkDevice,
 }: PropsType): JSX.Element | null => {
-  if (hasNetworkDialog || isRegistrationDone) {
+  if (isRegistrationDone) {
     return null;
   }
 

ts/state/selectors/network.ts

@@ -13,9 +13,9 @@ export const hasNetworkDialog = createSelector(
     { isOnline, socketStatus, withinConnectingGracePeriod }: NetworkStateType,
     isRegistrationDone: boolean
   ): boolean =>
-    !isOnline ||
+    isRegistrationDone &&
-    !isRegistrationDone ||
+    (!isOnline ||
-    (socketStatus === WebSocket.CONNECTING && !withinConnectingGracePeriod) ||
+      (socketStatus === WebSocket.CONNECTING && !withinConnectingGracePeriod) ||
-    socketStatus === WebSocket.CLOSED ||
+      socketStatus === WebSocket.CLOSED ||
-    socketStatus === WebSocket.CLOSING
+      socketStatus === WebSocket.CLOSING)
 );

ts/state/smart/RelinkDialog.tsx

@@ -3,12 +3,10 @@ import { mapDispatchToProps } from '../actions';
 import { RelinkDialog } from '../../components/RelinkDialog';
 import { StateType } from '../reducer';
 import { getIntl } from '../selectors/user';
-import { hasNetworkDialog } from '../selectors/network';
 import { isDone } from '../../util/registration';
 
 const mapStateToProps = (state: StateType) => {
   return {
-    hasNetworkDialog: hasNetworkDialog(state),
     i18n: getIntl(state),
     isRegistrationDone: isDone(),
   };