* feat ui: dashboards redesign start * more cards * fix ui: more different cards... * feat ui: finish cards, all trigger, all icons * change(ui): added missin const * feature(ui): new dashboard modal * feature(ui): new dashboard modal * change(ui): new cards * change(ui): dashboard redesign * change(ui): dashboard redesign * change(ui): dashboard redesign * change(ui): modal context and alert form * change(ui): table card show more with modal * change(ui): examples * change(ui): example categorize and other improvements * change(ui): example categorize and other improvements * change(ui): performance cards * change(ui): insights card * Various style updates in dashboards and other pages. (#2308) * Various minor style updates * Various style improvements * Update ExampleCards.tsx * change(ui): fixed an issue with card create * change(ui): fixed an issue with card create * change(ui): default filters and events order * change(ui): random data * Dashboards redesign - improvments (#2313) * Various minor style updates * Various style improvements * Update ExampleCards.tsx * various minor improvements in dashbaords. * revised dashboard widget header * change(ui): sessions by user * change(ui): funnel example * change(ui): modal height and scroll * change(ui): example cards with data * change(ui): example cards with data * change(ui): funnel bar text color * change(ui): example cards overlay click * change(ui): path analysis filter card --------- Co-authored-by: Shekar Siri <sshekarsiri@gmail.com> Co-authored-by: Sudheer Salavadi <connect.uxmaster@gmail.com>
112 lines
4.6 KiB
JavaScript
112 lines
4.6 KiB
JavaScript
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 border shadow-sm 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 account’s 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 organization’s 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>
|
||
);
|
||
}
|
||
}
|