openreplay/frontend/app/components/Client/ProfileSettings/ProfileSettings.js
Shekar Siri 8d1bf1a401
change(ui): module settings and nav changes (#1443)
* change(ui): route refactor

* change(ui): new navigation

* change(ui): new navigation - icons and other fixes

* change(ui): modules

* change(ui): moduels and nav fixes
2023-08-09 12:07:57 +05:30

112 lines
4.6 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import React from 'react';
import withPageTitle from 'HOCs/withPageTitle';
import Settings from './Settings';
import ChangePassword from './ChangePassword';
import styles from './profileSettings.module.css';
import Api from './Api';
import TenantKey from './TenantKey';
import OptOut from './OptOut';
import Licenses from './Licenses';
import { connect } from 'react-redux';
import { PageTitle } from 'UI';
@withPageTitle('Account - OpenReplay Preferences')
@connect((state) => ({
account: state.getIn(['user', 'account']),
isEnterprise: state.getIn(['user', 'account', 'edition']) === 'ee',
}))
export default class ProfileSettings extends React.PureComponent {
render() {
const { account, isEnterprise } = this.props;
return (
<div className="bg-white rounded-lg p-5">
<PageTitle title={<div>Account</div>} />
<div className="flex items-center">
<div className={styles.left}>
<h4 className="text-lg mb-4">{'Profile'}</h4>
<div className={styles.info}>{'Your email address is your identity on OpenReplay and is used to login.'}</div>
</div>
<div>
<Settings />
</div>
</div>
<div className="border-b my-10" />
{account.hasPassword && (
<>
<div className="flex items-center">
<div className={styles.left}>
<h4 className="text-lg mb-4">{'Change Password'}</h4>
<div className={styles.info}>{'Updating your password from time to time enhances your accounts security.'}</div>
</div>
<div>
<ChangePassword />
</div>
</div>
<div className="border-b my-10" />
</>
)}
<div className="flex items-center">
<div className={styles.left}>
<h4 className="text-lg mb-4">{'Organization API Key'}</h4>
<div className={styles.info}>{'Your API key gives you access to an extra set of services.'}</div>
</div>
<div>
<Api />
</div>
</div>
{isEnterprise && (account.admin || account.superAdmin) && (
<>
<div className="border-b my-10" />
<div className="flex items-center">
<div className={styles.left}>
<h4 className="text-lg mb-4">{'Tenant Key'}</h4>
<div className={styles.info}>{'For SSO (SAML) authentication.'}</div>
</div>
<div>
<TenantKey />
</div>
</div>
</>
)}
{!isEnterprise && (
<>
<div className="border-b my-10" />
<div className="flex items-center">
<div className={styles.left}>
<h4 className="text-lg mb-4">{'Data Collection'}</h4>
<div className={styles.info}>
{'Enables you to control how OpenReplay captures data on your organizations usage to improve our product.'}
</div>
</div>
<div>
<OptOut />
</div>
</div>
</>
)}
{account.license && (
<>
<div className="border-b my-10" />
<div className="flex items-center">
<div className={styles.left}>
<h4 className="text-lg mb-4">{'License'}</h4>
<div className={styles.info}>{'License key and expiration date.'}</div>
</div>
<div>
<Licenses />
</div>
</div>
</>
)}
</div>
);
}
}