Replace use cookies for local storage

This commit is contained in:
Reckless_Satoshi 2022-11-09 14:10:32 -08:00
parent 741fba11d5
commit 160c24ca4d
No known key found for this signature in database
GPG Key ID: 9C4585B561315571
13 changed files with 55 additions and 36 deletions

View File

@ -115,12 +115,9 @@ class UserGenPage extends Component {
encPrivKey: data.encrypted_private_key, encPrivKey: data.encrypted_private_key,
copiedToken: data.found ? true : this.props.robot.copiedToken, copiedToken: data.found ? true : this.props.robot.copiedToken,
}) & }) &
systemClient.setCookie('robot_token', token) & systemClient.setItem('robot_token', token) &
systemClient.setCookie('pub_key', data.public_key.split('\n').join('\\')) & systemClient.setItem('pub_key', data.public_key.split('\n').join('\\')) &
systemClient.setCookie( systemClient.setItem('enc_priv_key', data.encrypted_private_key.split('\n').join('\\'));
'enc_priv_key',
data.encrypted_private_key.split('\n').join('\\'),
);
}), }),
); );
}; };
@ -298,7 +295,7 @@ class UserGenPage extends Component {
color='primary' color='primary'
disabled={ disabled={
!this.props.robot.avatarLoaded || !this.props.robot.avatarLoaded ||
!(systemClient.getCookie('robot_token') == this.state.inputToken) !(systemClient.getItem('robot_token') == this.state.inputToken)
} }
onClick={() => onClick={() =>
saveAsJson( saveAsJson(
@ -320,10 +317,10 @@ class UserGenPage extends Component {
color={this.props.robot.copiedToken ? 'inherit' : 'primary'} color={this.props.robot.copiedToken ? 'inherit' : 'primary'}
disabled={ disabled={
!this.props.robot.avatarLoaded || !this.props.robot.avatarLoaded ||
!(systemClient.getCookie('robot_token') === this.state.inputToken) !(systemClient.getItem('robot_token') === this.state.inputToken)
} }
onClick={() => onClick={() =>
systemClient.copyToClipboard(systemClient.getCookie('robot_token')) & systemClient.copyToClipboard(systemClient.getItem('robot_token')) &
this.props.setRobot({ ...this.props.robot, copiedToken: true }) this.props.setRobot({ ...this.props.robot, copiedToken: true })
} }
> >

View File

@ -83,7 +83,7 @@ const ProfileDialog = ({
}, [showRewards]); }, [showRewards]);
const copyTokenHandler = () => { const copyTokenHandler = () => {
const robotToken = systemClient.getCookie('robot_token'); const robotToken = systemClient.getItem('robot_token');
if (robotToken) { if (robotToken) {
systemClient.copyToClipboard(robotToken); systemClient.copyToClipboard(robotToken);
@ -244,12 +244,12 @@ const ProfileDialog = ({
</ListItemIcon> </ListItemIcon>
<ListItemText secondary={t('Your token (will not remain here)')}> <ListItemText secondary={t('Your token (will not remain here)')}>
{systemClient.getCookie('robot_token') ? ( {systemClient.getItem('robot_token') ? (
<TextField <TextField
disabled disabled
sx={{ width: '100%', maxWidth: '450px' }} sx={{ width: '100%', maxWidth: '450px' }}
label={t('Back it up!')} label={t('Back it up!')}
value={systemClient.getCookie('robot_token')} value={systemClient.getItem('robot_token')}
variant='filled' variant='filled'
size='small' size='small'
InputProps={{ InputProps={{

View File

@ -41,7 +41,7 @@ const StoreTokenDialog = ({ open, onClose, onClickBack, onClickDone }: Props): J
sx={{ width: '100%', maxWidth: '550px' }} sx={{ width: '100%', maxWidth: '550px' }}
disabled disabled
label={t('Back it up!')} label={t('Back it up!')}
value={systemClient.getCookie('robot_token')} value={systemClient.getItem('robot_token')}
variant='filled' variant='filled'
size='small' size='small'
InputProps={{ InputProps={{
@ -49,7 +49,7 @@ const StoreTokenDialog = ({ open, onClose, onClickBack, onClickDone }: Props): J
<Tooltip disableHoverListener enterTouchDelay={0} title={t('Copied!')}> <Tooltip disableHoverListener enterTouchDelay={0} title={t('Copied!')}>
<IconButton <IconButton
onClick={() => onClick={() =>
systemClient.copyToClipboard(systemClient.getCookie('robot_token')) systemClient.copyToClipboard(systemClient.getItem('robot_token'))
} }
> >
<ContentCopy color='primary' /> <ContentCopy color='primary' />

View File

@ -61,7 +61,7 @@ const SettingsForm = ({
language={settings.language} language={settings.language}
setLanguage={(language) => { setLanguage={(language) => {
setSettings({ ...settings, language }); setSettings({ ...settings, language });
systemClient.setCookie('settings_language', language); systemClient.setItem('settings_language', language);
}} }}
/> />
</ListItem> </ListItem>
@ -110,7 +110,7 @@ const SettingsForm = ({
onChange={(e) => { onChange={(e) => {
const mode = e.target.checked ? 'dark' : 'light'; const mode = e.target.checked ? 'dark' : 'light';
setSettings({ ...settings, mode }); setSettings({ ...settings, mode });
systemClient.setCookie('settings_mode', mode); systemClient.setItem('settings_mode', mode);
}} }}
/> />
} }
@ -129,10 +129,7 @@ const SettingsForm = ({
onChange={(e) => { onChange={(e) => {
const fontSize = e.target.value; const fontSize = e.target.value;
setSettings({ ...settings, fontSize }); setSettings({ ...settings, fontSize });
systemClient.setCookie( systemClient.setItem(`settings_fontsize_${settings.frontend}`, fontSize.toString());
`settings_fontsize_${settings.frontend}`,
fontSize.toString(),
);
}} }}
valueLabelDisplay='off' valueLabelDisplay='off'
marks={fontSizes.map(({ label, value }) => ({ marks={fontSizes.map(({ label, value }) => ({
@ -152,7 +149,7 @@ const SettingsForm = ({
value={settings.network} value={settings.network}
onChange={(e, network) => { onChange={(e, network) => {
setSettings({ ...settings, network }); setSettings({ ...settings, network });
systemClient.setCookie('settings_network', network); systemClient.setItem('settings_network', network);
}} }}
> >
<ToggleButton value='mainnet' color='primary'> <ToggleButton value='mainnet' color='primary'>

View File

@ -44,13 +44,13 @@ const EncryptedChat: React.FC<Props> = ({ orderId, userNick, baseUrl }: Props):
const [connected, setConnected] = useState<boolean>(false); const [connected, setConnected] = useState<boolean>(false);
const [peerConnected, setPeerConnected] = useState<boolean>(false); const [peerConnected, setPeerConnected] = useState<boolean>(false);
const [ownPubKey] = useState<string>( const [ownPubKey] = useState<string>(
(systemClient.getCookie('pub_key') ?? '').split('\\').join('\n'), (systemClient.getItem('pub_key') ?? '').split('\\').join('\n'),
); );
const [ownEncPrivKey] = useState<string>( const [ownEncPrivKey] = useState<string>(
(systemClient.getCookie('enc_priv_key') ?? '').split('\\').join('\n'), (systemClient.getItem('enc_priv_key') ?? '').split('\\').join('\n'),
); );
const [peerPubKey, setPeerPubKey] = useState<string>(); const [peerPubKey, setPeerPubKey] = useState<string>();
const [token] = useState<string>(systemClient.getCookie('robot_token') || ''); const [token] = useState<string>(systemClient.getItem('robot_token') || '');
const [messages, setMessages] = useState<WebSocketsChatMessage[]>([]); const [messages, setMessages] = useState<WebSocketsChatMessage[]>([]);
const [serverMessages, setServerMessages] = useState<any[]>([]); const [serverMessages, setServerMessages] = useState<any[]>([]);
const [value, setValue] = useState<string>(''); const [value, setValue] = useState<string>('');

View File

@ -2,9 +2,9 @@ import { systemClient } from '../services/System';
class Robot { class Robot {
constructor() { constructor() {
this.token = systemClient.getCookie('robot_token') ?? undefined; this.token = systemClient.getItem('robot_token') ?? undefined;
this.pubKey = systemClient.getCookie('pub_key') ?? undefined; this.pubKey = systemClient.getItem('pub_key') ?? undefined;
this.encPrivKey = systemClient.getCookie('enc_priv_key') ?? undefined; this.encPrivKey = systemClient.getItem('enc_priv_key') ?? undefined;
} }
public nickname?: string; public nickname?: string;

View File

@ -4,7 +4,7 @@ import BaseSettings from './Settings.model';
class Settings extends BaseSettings { class Settings extends BaseSettings {
constructor() { constructor() {
super(); super();
const fontSizeCookie = systemClient.getCookie('settings_fontsize_basic'); const fontSizeCookie = systemClient.getItem('settings_fontsize_basic');
this.fontSize = fontSizeCookie !== '' ? Number(fontSizeCookie) : 14; this.fontSize = fontSizeCookie !== '' ? Number(fontSizeCookie) : 14;
} }
public frontend: 'basic' | 'pro' = 'basic'; public frontend: 'basic' | 'pro' = 'basic';

View File

@ -4,7 +4,7 @@ import BaseSettings from './Settings.model';
class Settings extends BaseSettings { class Settings extends BaseSettings {
constructor() { constructor() {
super(); super();
const fontSizeCookie = systemClient.getCookie('settings_fontsize_pro'); const fontSizeCookie = systemClient.getItem('settings_fontsize_pro');
this.fontSize = fontSizeCookie !== '' ? Number(fontSizeCookie) : 12; this.fontSize = fontSizeCookie !== '' ? Number(fontSizeCookie) : 12;
} }
public frontend: 'basic' | 'pro' = 'pro'; public frontend: 'basic' | 'pro' = 'pro';

View File

@ -22,7 +22,7 @@ export type Language =
class BaseSettings { class BaseSettings {
constructor() { constructor() {
const modeCookie: 'light' | 'dark' | '' = systemClient.getCookie('settings_mode'); const modeCookie: 'light' | 'dark' | '' = systemClient.getItem('settings_mode');
this.mode = this.mode =
modeCookie !== '' modeCookie !== ''
? modeCookie ? modeCookie
@ -30,7 +30,7 @@ class BaseSettings {
? 'dark' ? 'dark'
: 'light'; : 'light';
const languageCookie = systemClient.getCookie('settings_language'); const languageCookie = systemClient.getItem('settings_language');
this.language = this.language =
languageCookie !== '' languageCookie !== ''
? languageCookie ? languageCookie
@ -38,7 +38,7 @@ class BaseSettings {
? 'en' ? 'en'
: i18n.resolvedLanguage.substring(0, 2); : i18n.resolvedLanguage.substring(0, 2);
const networkCookie = systemClient.getCookie('settings_network'); const networkCookie = systemClient.getItem('settings_network');
this.network = networkCookie !== '' ? networkCookie : 'mainnet'; this.network = networkCookie !== '' ? networkCookie : 'mainnet';
} }

View File

@ -46,6 +46,17 @@ class SystemNativeClient implements SystemClient {
key, key,
}); });
}; };
// Emulate storage as emulated cookies (....to improve)
public getItem: (key: string) => string = (key) => {
return this.getCookie(key);
};
public setItem: (key: string, value: string) => void = (key, value) => {
this.setCookie(key, value);
};
public deleteItem: (key: string) => void = (key) => {
this.deleteCookie(key);
};
} }
export default SystemNativeClient; export default SystemNativeClient;

View File

@ -27,6 +27,7 @@ class SystemWebClient implements SystemClient {
} }
}; };
//Cookies
public getCookie: (key: string) => string = (key) => { public getCookie: (key: string) => string = (key) => {
let cookieValue = null; let cookieValue = null;
if (document.cookie && document.cookie !== '') { if (document.cookie && document.cookie !== '') {
@ -43,14 +44,24 @@ class SystemWebClient implements SystemClient {
return cookieValue || ''; return cookieValue || '';
}; };
public setCookie: (key: string, value: string) => void = (key, value) => { public setCookie: (key: string, value: string) => void = (key, value) => {
document.cookie = `${key}=${value};path=/;SameSite=Strict`; document.cookie = `${key}=${value};path=/;SameSite=Strict`;
}; };
public deleteCookie: (key: string) => void = (key) => { public deleteCookie: (key: string) => void = (key) => {
document.cookie = `${name}= ; expires = Thu, 01 Jan 1970 00:00:00 GMT`; document.cookie = `${name}= ; expires = Thu, 01 Jan 1970 00:00:00 GMT`;
}; };
// Local storage
public getItem: (key: string) => string = (key) => {
const value = window.localStorage.getItem(key);
return value || '';
};
public setItem: (key: string, value: string) => void = (key, value) => {
window.localStorage.setItem(key, value);
};
public deleteItem: (key: string) => void = (key) => {
window.localStorage.removeItem(key);
};
} }
export default SystemWebClient; export default SystemWebClient;

View File

@ -7,6 +7,9 @@ export interface SystemClient {
getCookie: (key: string) => string | undefined; getCookie: (key: string) => string | undefined;
setCookie: (key: string, value: string) => void; setCookie: (key: string, value: string) => void;
deleteCookie: (key: string) => void; deleteCookie: (key: string) => void;
getItem: (key: string) => string | undefined;
setItem: (key: string, value: string) => void;
deleteItem: (key: string) => void;
} }
export const systemClient: SystemClient = export const systemClient: SystemClient =

View File

@ -10,11 +10,11 @@ class ApiNativeClient implements ApiClient {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
}; };
const robotToken = systemClient.getCookie('robot_token'); const robotToken = systemClient.getItem('robot_token');
if (robotToken) { if (robotToken) {
const sessionid = systemClient.getCookie('sessionid'); const sessionid = systemClient.getCookie('sessionid');
const csrftoken = systemClient.getCookie('csrftoken'); const csrftoken = systemClient.getCookie('csrftoken');
const pubKey = systemClient.getCookie('pub_key'); const pubKey = systemClient.getItem('pub_key');
headers = { headers = {
...headers, ...headers,