@ -1,8 +1,9 @@
import autoBind from 'auto-bind' ;
import { shell } from 'electron' ;
import React from 'react' ;
import React , { useState } from 'react' ;
import styled from 'styled-components' ;
import { useDispatch } from 'react-redux' ;
import useMount from 'react-use/lib/useMount' ;
import { SettingsHeader } from './SessionSettingsHeader' ;
import { SessionIconButton } from '../icon' ;
@ -12,12 +13,12 @@ import { SessionNotificationGroupSettings } from './SessionNotificationGroupSett
import { Data } from '../../data/data' ;
import { sessionPassword } from '../../state/ducks/modalDialog' ;
import { SectionType , showLeftPaneSection } from '../../state/ducks/section' ;
import { PasswordAction } from '../dialog/SessionPasswordDialog' ;
import { SettingsCategoryAppearance } from './section/CategoryAppearance' ;
import { CategoryConversations } from './section/CategoryConversations' ;
import { SettingsCategoryHelp } from './section/CategoryHelp' ;
import { SettingsCategoryPermissions } from './section/CategoryPermissions' ;
import { SettingsCategoryPrivacy } from './section/CategoryPrivacy' ;
import type { SessionSettingCategory , PasswordAction } from '../../types/ReduxTypes' ;
export function displayPasswordModal (
passwordAction : PasswordAction ,
@ -41,26 +42,10 @@ export function getCallMediaPermissionsSettings() {
return window . getSettingValue ( 'call-media-permissions' ) ;
}
export type SessionSettingCategory =
| 'privacy'
| 'notifications'
| 'conversations'
| 'messageRequests'
| 'appearance'
| 'permissions'
| 'help'
| 'recoveryPhrase'
| 'ClearData' ;
export interface SettingsViewProps {
category : SessionSettingCategory ;
}
interface State {
hasPassword : boolean | null ;
shouldLockSettings : boolean | null ;
}
const StyledVersionInfo = styled . div `
display : flex ;
justify - content : space - between ;
@ -109,33 +94,30 @@ const SessionInfo = () => {
const SettingInCategory = ( props : {
category : SessionSettingCategory ;
hasPassword : boolean ;
onPasswordUpdated : ( action : string ) = > void ;
hasPassword : boolean ;
} ) = > {
const { category , hasPassword, onPasswordUpdate d } = props ;
const { category , onPasswordUpdated, hasPasswor d } = props ;
if ( hasPassword === null ) {
return null ;
}
switch ( category ) {
// special case for blocked user
case 'conversations' :
return < CategoryConversations / > ;
case 'appearance' :
return < SettingsCategoryAppearance hasPassword = { hasPassword } / > ;
return < SettingsCategoryAppearance / > ;
case 'notifications' :
return < SessionNotificationGroupSettings hasPassword = { hasPassword } / > ;
return < SessionNotificationGroupSettings / > ;
case 'privacy' :
return (
< SettingsCategoryPrivacy onPasswordUpdated = { onPasswordUpdated } hasPassword = { hasPassword } / >
) ;
case 'help' :
return < SettingsCategoryHelp hasPassword = { hasPassword } / > ;
return < SettingsCategoryHelp / > ;
case 'permissions' :
return < SettingsCategoryPermissions hasPassword = { hasPassword } / > ;
return < SettingsCategoryPermissions / > ;
// these three down there have no options, they are just a button
case ' C learData':
case ' c learData':
case 'messageRequests' :
case 'recoveryPhrase' :
default :
@ -158,87 +140,48 @@ const StyledSettingsList = styled.div`
flex - direction : column ;
` ;
export class SessionSettingsView extends React . Component < SettingsViewProps , State > {
public settingsViewRef : React.RefObject < HTMLDivElement > ;
public constructor ( props : any ) {
super ( props ) ;
this . state = {
hasPassword : null ,
shouldLockSettings : true ,
} ;
this . settingsViewRef = React . createRef ( ) ;
autoBind ( this ) ;
export const SessionSettingsView = ( props : SettingsViewProps ) = > {
const { category } = props ;
const dispatch = useDispatch ( ) ;
const [ hasPassword , setHasPassword ] = useState ( true ) ;
useMount ( ( ) = > {
let isMounted = true ;
// eslint-disable-next-line more/no-then
void Data . getPasswordHash ( ) . then ( hash = > {
this . setState ( {
hasPassword: ! ! hash ,
} ) ;
if ( isMounted ) {
setHasPassword ( ! ! hash ) ;
}
} ) ;
}
public componentDidUpdate ( _ : SettingsViewProps , _prevState : State ) {
const oldShouldRenderPasswordLock = _prevState . shouldLockSettings && _prevState . hasPassword ;
const newShouldRenderPasswordLock = this . state . shouldLockSettings && this . state . hasPassword ;
if (
newShouldRenderPasswordLock &&
newShouldRenderPasswordLock !== oldShouldRenderPasswordLock
) {
displayPasswordModal ( 'enter' , action = > {
if ( action === 'enter' ) {
// Unlocked settings
this . setState ( {
shouldLockSettings : false ,
} ) ;
}
} ) ;
}
}
public render() {
const { category } = this . props ;
const shouldRenderPasswordLock = this . state . shouldLockSettings && this . state . hasPassword ;
return (
< div className = "session-settings" >
{ shouldRenderPasswordLock ? (
< > < / >
) : (
< >
< SettingsHeader category = { category } / >
< StyledSettingsView >
< StyledSettingsList ref = { this . settingsViewRef } >
< SettingInCategory
category = { category }
onPasswordUpdated = { this . onPasswordUpdated }
hasPassword = { Boolean ( this . state . hasPassword ) }
/ >
< / StyledSettingsList >
< SessionInfo / >
< / StyledSettingsView >
< / >
) }
< / div >
) ;
}
return ( ) = > {
isMounted = false ;
} ;
} ) ;
public onPasswordUpdated ( action : string ) {
function onPasswordUpdated ( action : string ) {
if ( action === 'set' || action === 'change' ) {
this . setState ( {
hasPassword : true ,
shouldLockSettings : true ,
} ) ;
window . inboxStore ? . dispatch ( showLeftPaneSection ( SectionType . Message ) ) ;
setHasPassword ( true ) ;
dispatch ( showLeftPaneSection ( SectionType . Message ) ) ;
}
if ( action === 'remove' ) {
this . setState ( {
hasPassword : false ,
} ) ;
setHasPassword ( false ) ;
}
}
}
return (
< div className = "session-settings" >
< SettingsHeader category = { category } / >
< StyledSettingsView >
< StyledSettingsList >
< SettingInCategory
category = { category }
onPasswordUpdated = { onPasswordUpdated }
hasPassword = { hasPassword }
/ >
< / StyledSettingsList >
< SessionInfo / >
< / StyledSettingsView >
< / div >
) ;
} ;
Audric Ackermann
11 months ago