Work in progress on port to Bootstrap 4
This commit is contained in:
Tomas Bures
parent
3425e2c16a
commit
41d74e3cc7
40 changed files with 144 additions and 365 deletions
|
|
@ -108,7 +108,7 @@ export default class List extends Component {
|
|||
tableAddRestActionButton(
|
||||
actions, this,
|
||||
{ method: HTTPMethod.DELETE, url: `rest/blacklist/${email}`},
|
||||
{ icon: 'remove', label: t('removeFromBlacklist') },
|
||||
{ icon: 'trash-alt', label: t('removeFromBlacklist') },
|
||||
t('confirmRemovalFromBlacklist'),
|
||||
t('areYouSureYouWantToRemoveEmailFromThe', {email}),
|
||||
t('removingEmailFromTheBlacklist', {email}),
|
||||
|
|
|
|||
|
|
@ -508,7 +508,7 @@ export default class CUD extends Component {
|
|||
{lsts.length > 1 &&
|
||||
<Button
|
||||
className="btn-secondary"
|
||||
icon="remove"
|
||||
icon="trash-alt"
|
||||
title={t('remove')}
|
||||
onClickAsync={() => this.onRemoveListEntry(lstUid)}
|
||||
/>
|
||||
|
|
@ -738,7 +738,7 @@ export default class CUD extends Component {
|
|||
|
||||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={saveButtonLabel}/>
|
||||
{canDelete && <NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/campaigns/${this.props.entity.id}/delete`}/> }
|
||||
{canDelete && <NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/campaigns/${this.props.entity.id}/delete`}/> }
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,11 +3,12 @@
|
|||
import React, {Component} from 'react';
|
||||
import {withTranslation} from '../lib/i18n';
|
||||
import {
|
||||
DropdownMenu,
|
||||
ButtonDropdown,
|
||||
Icon
|
||||
} from '../lib/bootstrap-components';
|
||||
import {
|
||||
MenuLink,
|
||||
ButtonDropdownLink,
|
||||
NavDropdown,
|
||||
requiresAuthenticatedUser,
|
||||
Title,
|
||||
Toolbar,
|
||||
|
|
@ -109,7 +110,7 @@ export default class List extends Component {
|
|||
|
||||
if (perms.includes('viewStats')) {
|
||||
actions.push({
|
||||
label: <Icon icon="send" title={t('status')}/>,
|
||||
label: <Icon icon="envelope" title={t('status')}/>,
|
||||
link: `/campaigns/${data[0]}/status`
|
||||
});
|
||||
|
||||
|
|
@ -149,14 +150,14 @@ export default class List extends Component {
|
|||
|
||||
if (campaignType === CampaignType.TRIGGERED && perms.includes('viewTriggers')) {
|
||||
actions.push({
|
||||
label: <Icon icon="flash" title={t('triggers')}/>,
|
||||
label: <Icon icon="bell" title={t('triggers')}/>,
|
||||
link: `/campaigns/${data[0]}/triggers`
|
||||
});
|
||||
}
|
||||
|
||||
if (perms.includes('share')) {
|
||||
actions.push({
|
||||
label: <Icon icon="share-alt" title={t('share')}/>,
|
||||
label: <Icon icon="share" title={t('share')}/>,
|
||||
link: `/campaigns/${data[0]}/share`
|
||||
});
|
||||
}
|
||||
|
|
@ -173,11 +174,11 @@ export default class List extends Component {
|
|||
{tableRestActionDialogRender(this)}
|
||||
<Toolbar>
|
||||
{this.state.createPermitted &&
|
||||
<DropdownMenu className="btn-primary" label={t('createCampaign')}>
|
||||
<MenuLink to="/campaigns/create-regular">{t('regular')}</MenuLink>
|
||||
<MenuLink to="/campaigns/create-rss">{t('rss')}</MenuLink>
|
||||
<MenuLink to="/campaigns/create-triggered">{t('triggered')}</MenuLink>
|
||||
</DropdownMenu>
|
||||
<ButtonDropdown buttonClassName="btn-primary" menuClassName="dropdown-menu-right" label={t('createCampaign')}>
|
||||
<ButtonDropdownLink to="/campaigns/create-regular">{t('regular')}</ButtonDropdownLink>
|
||||
<ButtonDropdownLink to="/campaigns/create-rss">{t('rss')}</ButtonDropdownLink>
|
||||
<ButtonDropdownLink to="/campaigns/create-triggered">{t('triggered')}</ButtonDropdownLink>
|
||||
</ButtonDropdown>
|
||||
}
|
||||
</Toolbar>
|
||||
|
||||
|
|
|
|||
|
|
@ -236,7 +236,7 @@ export default class CUD extends Component {
|
|||
|
||||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('save')}/>
|
||||
{isEdit && <NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/campaigns/${this.props.campaign.id}/triggers/${this.props.entity.id}/delete`}/>}
|
||||
{isEdit && <NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/campaigns/${this.props.campaign.id}/triggers/${this.props.entity.id}/delete`}/>}
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
</div>
|
||||
|
|
|
|||
69
client/src/lib/bootstrap-components.js
vendored
69
client/src/lib/bootstrap-components.js
vendored
|
|
@ -112,35 +112,28 @@ class Button extends Component {
|
|||
}
|
||||
}
|
||||
|
||||
//TODO
|
||||
class DropdownMenu extends Component {
|
||||
class ButtonDropdown extends Component {
|
||||
static propTypes = {
|
||||
label: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
|
||||
noCaret: PropTypes.bool,
|
||||
className: PropTypes.string
|
||||
className: PropTypes.string,
|
||||
buttonClassName: PropTypes.string,
|
||||
menuClassName: PropTypes.string
|
||||
}
|
||||
|
||||
render() {
|
||||
const props = this.props;
|
||||
|
||||
let className = 'btn dropdown-toggle';
|
||||
if (props.className) {
|
||||
className = className + ' ' + props.className;
|
||||
}
|
||||
|
||||
let label;
|
||||
if (this.props.noCaret) {
|
||||
label = props.label;
|
||||
} else {
|
||||
label = <span>{props.label}{' '}<span className="caret"></span></span>;
|
||||
}
|
||||
const className = 'dropdown' + (props.className ? ' ' + props.className : '');
|
||||
const buttonClassName = 'btn dropdown-toggle' + (props.buttonClassName ? ' ' + props.buttonClassName : '');
|
||||
const menuClassName = 'dropdown-menu' + (props.menuClassName ? ' ' + props.menuClassName : '');
|
||||
|
||||
return (
|
||||
<div className="btn-group">
|
||||
<button type="button" className={className} data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
{label}
|
||||
<div className="dropdown" className={className}>
|
||||
<button type="button" className={buttonClassName} data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
{props.label}
|
||||
</button>
|
||||
<ul className="dropdown-menu">
|
||||
<ul className={menuClassName}>
|
||||
{props.children}
|
||||
</ul>
|
||||
|
||||
|
|
@ -149,41 +142,6 @@ class DropdownMenu extends Component {
|
|||
}
|
||||
}
|
||||
|
||||
//TODO
|
||||
class DropdownMenuItem extends Component {
|
||||
static propTypes = {
|
||||
label: PropTypes.string,
|
||||
icon: PropTypes.string,
|
||||
className: PropTypes.string
|
||||
}
|
||||
|
||||
render() {
|
||||
const props = this.props;
|
||||
|
||||
let className = 'nav-item dropdown';
|
||||
if (props.className) {
|
||||
className = className + ' ' + props.className;
|
||||
}
|
||||
|
||||
return (
|
||||
<li className={className}>
|
||||
{props.icon ?
|
||||
<a href="#" className="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
|
||||
<Icon icon={props.icon}/>{' '}{props.label}
|
||||
</a>
|
||||
:
|
||||
<a href="#" className="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
|
||||
{props.label}
|
||||
</a>
|
||||
}
|
||||
<ul className="dropdown-menu">
|
||||
{props.children}
|
||||
</ul>
|
||||
</li>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@withComponentMixins([
|
||||
withErrorHandling
|
||||
])
|
||||
|
|
@ -217,7 +175,6 @@ class ActionLink extends Component {
|
|||
withTranslation,
|
||||
withErrorHandling
|
||||
])
|
||||
//TODO
|
||||
class ModalDialog extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
|
@ -314,8 +271,8 @@ class ModalDialog extends Component {
|
|||
<div className="modal-dialog" role="document">
|
||||
<div className="modal-content">
|
||||
<div className="modal-header">
|
||||
<button type="button" className="close" aria-label={t('close')} onClick={::this.onClose}><span aria-hidden="true">×</span></button>
|
||||
<h4 className="modal-title">{this.props.title}</h4>
|
||||
<button type="button" className="close" aria-label={t('close')} onClick={::this.onClose}><span aria-hidden="true">×</span></button>
|
||||
</div>
|
||||
<div className="modal-body">{this.props.children}</div>
|
||||
<div className="modal-footer">
|
||||
|
|
@ -332,7 +289,7 @@ class ModalDialog extends Component {
|
|||
|
||||
export {
|
||||
Button,
|
||||
DropdownMenu,
|
||||
ButtonDropdown,
|
||||
DropdownMenuItem,
|
||||
ActionLink,
|
||||
DismissibleAlert,
|
||||
|
|
|
|||
|
|
@ -144,7 +144,7 @@ export default class Files extends Component {
|
|||
|
||||
if (this.props.entity.permissions.includes(this.props.managePermission)) {
|
||||
actions.push({
|
||||
label: <Icon icon="remove" title={t('delete')}/>,
|
||||
label: <Icon icon="trash-alt" title={t('delete')}/>,
|
||||
action: () => this.deleteFile(data[0], data[1])
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -194,9 +194,9 @@ function wrapInput(id, htmlId, owner, format, rightContainerClass, label, help,
|
|||
// wrapInput may be used also outside forms to make a kind of fake read-only forms
|
||||
let className;
|
||||
if (owner) {
|
||||
className = 'form-group row';
|
||||
className = 'form-group';
|
||||
} else {
|
||||
className = 'row ' + styles.staticFormGroup;
|
||||
className = styles.staticFormGroup;
|
||||
}
|
||||
|
||||
let colLeft = '';
|
||||
|
|
@ -207,15 +207,17 @@ function wrapInput(id, htmlId, owner, format, rightContainerClass, label, help,
|
|||
colLeft = '';
|
||||
colRight = '';
|
||||
break;
|
||||
case 'inline':
|
||||
colLeft = 'mr-3';
|
||||
colRight = '';
|
||||
break;
|
||||
default:
|
||||
className = className + ' row';
|
||||
colLeft = 'col-sm-2 col-form-label';
|
||||
colRight = 'col-sm-10';
|
||||
break;
|
||||
}
|
||||
|
||||
if (format === 'inline') {
|
||||
}
|
||||
|
||||
let helpBlock = null;
|
||||
if (help) {
|
||||
helpBlock = <small className={`form-text text-muted`} id={htmlId + '_help'}>{help}</small>;
|
||||
|
|
@ -239,7 +241,7 @@ function wrapInput(id, htmlId, owner, format, rightContainerClass, label, help,
|
|||
if (format === 'inline') {
|
||||
return (
|
||||
<div className={className} >
|
||||
{labelBlock} {input}
|
||||
{labelBlock}{input}
|
||||
{helpBlock}
|
||||
{validationBlock}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -224,7 +224,7 @@ export function tableAddDeleteButton(actions, owner, perms, deleteUrl, name, del
|
|||
if (!perms || perms.includes('delete')) {
|
||||
if (owner.tableRestActionDialogData.shown) {
|
||||
actions.push({
|
||||
label: <Icon className={styles.iconDisabled} icon="remove" title={t('delete')}/>
|
||||
label: <Icon className={styles.iconDisabled} icon="trash-alt" title={t('delete')}/>
|
||||
});
|
||||
} else {
|
||||
actions.push({
|
||||
|
|
|
|||
|
|
@ -98,7 +98,6 @@ class Breadcrumb extends Component {
|
|||
}
|
||||
}
|
||||
|
||||
//TODO
|
||||
class SecondaryNavBar extends Component {
|
||||
static propTypes = {
|
||||
route: PropTypes.object.isRequired,
|
||||
|
|
@ -116,9 +115,10 @@ class SecondaryNavBar extends Component {
|
|||
title = entry.title;
|
||||
}
|
||||
|
||||
let className = '';
|
||||
let liClassName = 'nav-item';
|
||||
let linkClassName = 'nav-link';
|
||||
if (entry.active) {
|
||||
className += ' active';
|
||||
linkClassName += ' active';
|
||||
}
|
||||
|
||||
if (entry.link) {
|
||||
|
|
@ -130,7 +130,7 @@ class SecondaryNavBar extends Component {
|
|||
link = entry.link;
|
||||
}
|
||||
|
||||
return <li key={key} role="presentation" className={className}><Link to={link}>{title}</Link></li>;
|
||||
return <li key={key} role="presentation" className={liClassName}><Link className={linkClassName} to={link}>{title}</Link></li>;
|
||||
|
||||
} else if (entry.externalLink) {
|
||||
let externalLink;
|
||||
|
|
@ -140,10 +140,10 @@ class SecondaryNavBar extends Component {
|
|||
externalLink = entry.externalLink;
|
||||
}
|
||||
|
||||
return <li key={key} role="presentation" className={className}><a href={externalLink}>{title}</a></li>;
|
||||
return <li key={key} role="presentation" className={liClassName}><a className={linkClassName} href={externalLink}>{title}</a></li>;
|
||||
|
||||
} else {
|
||||
return <li key={key} role="presentation" className={className}>{title}</li>;
|
||||
return <li key={key} role="presentation" className={liClassName}>{title}</li>;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -153,7 +153,7 @@ class SecondaryNavBar extends Component {
|
|||
const keys = Object.keys(route.navs);
|
||||
const renderedElems = [];
|
||||
|
||||
for (const key in keys) {
|
||||
for (const key of keys) {
|
||||
const entry = route.navs[key];
|
||||
|
||||
let visible = true;
|
||||
|
|
@ -280,10 +280,9 @@ class RouteContent extends Component {
|
|||
<div>
|
||||
{primaryMenuComponent}
|
||||
|
||||
<div>
|
||||
<SecondaryNavBar className="hidden-xs pull-right" route={route} params={params} resolved={resolved}/>
|
||||
<div className={styles.breadcrumbAndSecondaryNavbar}>
|
||||
<Breadcrumb route={route} params={params} resolved={resolved}/>
|
||||
<SecondaryNavBar className="visible-xs" route={route} params={params} resolved={resolved}/>
|
||||
<SecondaryNavBar route={route} params={params} resolved={resolved}/>
|
||||
</div>
|
||||
|
||||
<div className="container-fluid">
|
||||
|
|
@ -473,8 +472,7 @@ export class NavButton extends Component {
|
|||
}
|
||||
}
|
||||
|
||||
// TODO
|
||||
export class MenuLink extends Component {
|
||||
export class ButtonDropdownLink extends Component {
|
||||
static propTypes = {
|
||||
to: PropTypes.string,
|
||||
className: PropTypes.string
|
||||
|
|
@ -483,9 +481,9 @@ export class MenuLink extends Component {
|
|||
render() {
|
||||
const props = this.props;
|
||||
|
||||
const clsName = "nav-item" + (props.className ? " " + props.className : "")
|
||||
const clsName = "dropdown-item" + (props.className ? " " + props.className : "")
|
||||
return (
|
||||
<li className={clsName}><Link to={props.to} className="nav-link">{props.children}</Link></li>
|
||||
<Link to={props.to} className={clsName}>{props.children}</Link>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -84,28 +84,32 @@
|
|||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.secondaryNav {
|
||||
margin-top: 5px;
|
||||
margin-right: 5px;
|
||||
text-align: right;
|
||||
}
|
||||
.breadcrumbAndSecondaryNavbar {
|
||||
/*
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
*/
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.secondaryNav {
|
||||
margin: 0px;
|
||||
background-color: #f5f5f5;
|
||||
padding: 5px 5px;
|
||||
border-radius: 4px;
|
||||
:global .breadcrumb {
|
||||
margin-bottom: 0px;
|
||||
padding-top: 0.5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.secondaryNav > li {
|
||||
display: inline-block;
|
||||
float: none;
|
||||
}
|
||||
margin-bottom: 1.5rem;
|
||||
|
||||
.secondaryNav > li > a {
|
||||
padding: 3px 10px;
|
||||
.secondaryNav {
|
||||
justify-content: flex-end;
|
||||
|
||||
margin-top: 0.5rem;
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
|
||||
:global .nav-item .nav-link {
|
||||
padding: 3px 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropZone {
|
||||
|
|
|
|||
|
|
@ -240,7 +240,7 @@ export default class CUD extends Component {
|
|||
|
||||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('save')}/>
|
||||
{canDelete && <NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/lists/${this.props.entity.id}/delete`}/>}
|
||||
{canDelete && <NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/lists/${this.props.entity.id}/delete`}/>}
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -122,7 +122,7 @@ export default class List extends Component {
|
|||
|
||||
if (triggersCount > 0) {
|
||||
actions.push({
|
||||
label: <Icon icon="flash" title={t('triggers')}/>,
|
||||
label: <Icon icon="bell" title={t('triggers')}/>,
|
||||
link: `/lists/${data[0]}/triggers`
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -481,7 +481,7 @@ export default class CUD extends Component {
|
|||
|
||||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('save')}/>
|
||||
{isEdit && <NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/lists/${this.props.list.id}/fields/${this.props.entity.id}/delete`}/>}
|
||||
{isEdit && <NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/lists/${this.props.list.id}/fields/${this.props.entity.id}/delete`}/>}
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -525,7 +525,7 @@ export default class CUD extends Component {
|
|||
|
||||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('save')}/>
|
||||
{canDelete && <NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/lists/forms/${this.props.entity.id}/delete`}/>}
|
||||
{canDelete && <NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/lists/forms/${this.props.entity.id}/delete`}/>}
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -76,7 +76,7 @@ export default class List extends Component {
|
|||
}
|
||||
if (perms.includes('share')) {
|
||||
actions.push({
|
||||
label: <Icon icon="share-alt" title={t('share')}/>,
|
||||
label: <Icon icon="share" title={t('share')}/>,
|
||||
link: `/lists/forms/${data[0]}/share`
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ import {
|
|||
withPageHelpers
|
||||
} from '../../lib/page';
|
||||
import {
|
||||
AlignedRow,
|
||||
Button,
|
||||
ButtonRow,
|
||||
CheckBox,
|
||||
|
|
@ -336,7 +337,7 @@ export default class CUD extends Component {
|
|||
} else {
|
||||
settingsEdit =
|
||||
<div>
|
||||
<StaticField withValidation id="csvFileName" label={t('file')}><input ref={node => this.csvFile = node} type="file" onChange={::this.onFileSelected}/></StaticField>
|
||||
<AlignedRow label={t('file')}><input ref={node => this.csvFile = node} type="file" className="form-control-file" onChange={::this.onFileSelected}/></AlignedRow>
|
||||
<InputField id="csvDelimiter" label={t('delimiter')}/>
|
||||
</div>;
|
||||
}
|
||||
|
|
@ -451,7 +452,7 @@ export default class CUD extends Component {
|
|||
|
||||
<ButtonRow>
|
||||
{saveButtons}
|
||||
{isEdit && <NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/lists/${this.props.list.id}/imports/${this.props.entity.id}/delete`}/>}
|
||||
{isEdit && <NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/lists/${this.props.list.id}/imports/${this.props.entity.id}/delete`}/>}
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@ export default class List extends Component {
|
|||
}
|
||||
|
||||
actions.push({
|
||||
label: <Icon icon="eye-open" title={t('detailedStatus')}/>,
|
||||
label: <Icon icon="eye" title={t('detailedStatus')}/>,
|
||||
link: `/lists/${this.props.list.id}/imports/${data[0]}/status`
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -357,7 +357,7 @@ export default class CUD extends Component {
|
|||
<FormButton type="submit" className="btn-primary" icon="check" label={t('saveAndStay')} onClickAsync={::this.submitAndStay}/>
|
||||
<FormButton type="submit" className="btn-primary" icon="check" label={t('saveAndLeave')}/>
|
||||
|
||||
<NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/lists/${this.props.list.id}/segments/${this.props.entity.id}/delete`}/>
|
||||
<NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/lists/${this.props.list.id}/segments/${this.props.entity.id}/delete`}/>
|
||||
</ButtonRow>
|
||||
:
|
||||
<ButtonRow format="wide" className={`col-xs-12 ${styles.toolbar}`}>
|
||||
|
|
@ -394,7 +394,7 @@ export default class CUD extends Component {
|
|||
generateNodeProps={data => ({
|
||||
buttons: [
|
||||
<ActionLink onClickAsync={async () => !this.state.ruleOptionsVisible && this.showRuleOptions(data.node.rule)} className={styles.ruleActionLink}><Icon icon="edit" title={t('edit')}/></ActionLink>,
|
||||
<ActionLink onClickAsync={async () => !this.state.ruleOptionsVisible && this.deleteRule(data.node.rule)} className={styles.ruleActionLink}><Icon icon="remove" title={t('delete')}/></ActionLink>
|
||||
<ActionLink onClickAsync={async () => !this.state.ruleOptionsVisible && this.deleteRule(data.node.rule)} className={styles.ruleActionLink}><Icon icon="trash-alt" title={t('delete')}/></ActionLink>
|
||||
]
|
||||
})}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -238,7 +238,7 @@ export default class CUD extends Component {
|
|||
|
||||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="chevron-left" label={t('ok')}/>
|
||||
<Button className="btn-primary" icon="remove" label={t('delete')} onClickAsync={::this.deleteRule}/>
|
||||
<Button className="btn-primary" icon="trash-alt" label={t('delete')} onClickAsync={::this.deleteRule}/>
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
|
||||
|
|
|
|||
|
|
@ -223,7 +223,7 @@ export default class CUD extends Component {
|
|||
}
|
||||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('save')}/>
|
||||
{isEdit && <NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/lists/${this.props.list.id}/subscriptions/${this.props.entity.id}/delete`}/>}
|
||||
{isEdit && <NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/lists/${this.props.list.id}/subscriptions/${this.props.entity.id}/delete`}/>}
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -137,7 +137,7 @@ export default class List extends Component {
|
|||
tableAddRestActionButton(
|
||||
actions, this,
|
||||
{ method: HTTPMethod.POST, url: `rest/subscriptions-unsubscribe/${this.props.list.id}/${id}`},
|
||||
{ icon: 'off', label: t('unsubscribe') },
|
||||
{ icon: 'power-off', label: t('unsubscribe') },
|
||||
t('confirmUnsubscription'),
|
||||
t('areYouSureYouWantToUnsubscribeEmail?', {email}),
|
||||
t('unsubscribingEmail', {email}),
|
||||
|
|
@ -150,7 +150,7 @@ export default class List extends Component {
|
|||
tableAddRestActionButton(
|
||||
actions, this,
|
||||
{ method: HTTPMethod.POST, url: `rest/blacklist`, data: {email} },
|
||||
{ icon: 'ban-circle', label: t('blacklist') },
|
||||
{ icon: 'ban', label: t('blacklist') },
|
||||
t('confirmEmailBlacklisting'),
|
||||
t('areYouSureYouWantToBlacklistEmail?', {email}),
|
||||
t('blacklistingEmail', {email}),
|
||||
|
|
@ -194,13 +194,14 @@ export default class List extends Component {
|
|||
<div className="well well-sm">{list.description}</div>
|
||||
}
|
||||
|
||||
<div className="well well-sm">
|
||||
<Form format="inline" stateOwner={this}>
|
||||
<Dropdown format="inline" className="input-sm" id="segment" label={t('segment')} options={segmentOptions}/>
|
||||
</Form>
|
||||
<div className="card bg-light">
|
||||
<div className="card-body p-2">
|
||||
<Form format="inline" stateOwner={this}>
|
||||
<Dropdown format="inline" className="input-sm" id="segment" label={t('segment')} options={segmentOptions}/>
|
||||
</Form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<Table ref={node => this.table = node} withHeader dataUrl={dataUrl} columns={columns} />
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -206,7 +206,7 @@ export default class CUD extends Component {
|
|||
|
||||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('save')}/>
|
||||
{canDelete && <NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/namespaces/${this.props.entity.id}/delete`}/>}
|
||||
{canDelete && <NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/namespaces/${this.props.entity.id}/delete`}/>}
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -72,7 +72,7 @@ export default class List extends Component {
|
|||
|
||||
if (node.data.permissions.includes('share')) {
|
||||
actions.push({
|
||||
label: <Icon icon="share-alt" title={t('share')}/>,
|
||||
label: <Icon icon="share" title={t('share')}/>,
|
||||
link: `/namespaces/${node.key}/share`
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -276,7 +276,7 @@ export default class CUD extends Component {
|
|||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('save')}/>
|
||||
{canDelete &&
|
||||
<NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/reports/${this.props.entity.id}/delete`}/>
|
||||
<NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/reports/${this.props.entity.id}/delete`}/>
|
||||
}
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
|
|
|
|||
|
|
@ -122,18 +122,18 @@ export default class List extends Component {
|
|||
} else if (state === ReportState.FINISHED) {
|
||||
if (mimeType === 'text/html') {
|
||||
viewContent = {
|
||||
label: <Icon icon="eye-open" title={t('view')}/>,
|
||||
label: <Icon icon="eye" title={t('view')}/>,
|
||||
link: `/reports/${id}/view`
|
||||
};
|
||||
} else if (mimeType === 'text/csv') {
|
||||
viewContent = {
|
||||
label: <Icon icon="download-alt" title={t('download')}/>,
|
||||
label: <Icon icon="file-download" title={t('download')}/>,
|
||||
href: getUrl(`rpts/${id}/download`)
|
||||
};
|
||||
}
|
||||
|
||||
startStop = {
|
||||
label: <Icon icon="repeat" title={t('refreshReport')}/>,
|
||||
label: <Icon icon="redo" title={t('refreshReport')}/>,
|
||||
action: (table) => this.start(table, id)
|
||||
};
|
||||
|
||||
|
|
@ -143,7 +143,7 @@ export default class List extends Component {
|
|||
};
|
||||
|
||||
startStop = {
|
||||
label: <Icon icon="repeat" title={t('regenerateReport')}/>,
|
||||
label: <Icon icon="redo" title={t('regenerateReport')}/>,
|
||||
action: (table) => this.start(table, id)
|
||||
};
|
||||
}
|
||||
|
|
@ -155,7 +155,7 @@ export default class List extends Component {
|
|||
if (perms.includes('viewOutput')) {
|
||||
actions.push(
|
||||
{
|
||||
label: <Icon icon="modal-window" title={t('viewConsoleOutput')}/>,
|
||||
label: <Icon icon="tv" title={t('viewConsoleOutput')}/>,
|
||||
link: `/reports/${id}/output`
|
||||
}
|
||||
);
|
||||
|
|
@ -174,7 +174,7 @@ export default class List extends Component {
|
|||
|
||||
if (perms.includes('share')) {
|
||||
actions.push({
|
||||
label: <Icon icon="share-alt" title={t('share')}/>,
|
||||
label: <Icon icon="share" title={t('share')}/>,
|
||||
link: `/reports/${id}/share`
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -335,7 +335,7 @@ export default class CUD extends Component {
|
|||
<Button type="submit" className="btn-primary" icon="check" label={t('saveAndStay')} onClickAsync={::this.submitAndStay}/>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('saveAndLeave')}/>
|
||||
{canDelete &&
|
||||
<NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/reports/templates/${this.props.entity.id}/delete`}/>
|
||||
<NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/reports/templates/${this.props.entity.id}/delete`}/>
|
||||
}
|
||||
</ButtonRow>
|
||||
:
|
||||
|
|
|
|||
|
|
@ -3,11 +3,12 @@
|
|||
import React, {Component} from 'react';
|
||||
import {withTranslation} from '../../lib/i18n';
|
||||
import {
|
||||
DropdownMenu,
|
||||
ButtonDropdown,
|
||||
Icon
|
||||
} from '../../lib/bootstrap-components';
|
||||
import {
|
||||
MenuLink,
|
||||
ButtonDropdownLink,
|
||||
NavDropdown,
|
||||
requiresAuthenticatedUser,
|
||||
Title,
|
||||
Toolbar,
|
||||
|
|
@ -85,7 +86,7 @@ export default class List extends Component {
|
|||
|
||||
if (perms.includes('share')) {
|
||||
actions.push({
|
||||
label: <Icon icon="share-alt" title={t('share')}/>,
|
||||
label: <Icon icon="share" title={t('share')}/>,
|
||||
link: `/reports/templates/${data[0]}/share`
|
||||
});
|
||||
}
|
||||
|
|
@ -102,12 +103,12 @@ export default class List extends Component {
|
|||
{tableRestActionDialogRender(this)}
|
||||
{this.state.createPermitted &&
|
||||
<Toolbar>
|
||||
<DropdownMenu className="btn-primary" label={t('createReportTemplate')}>
|
||||
<MenuLink to="/reports/templates/create">{t('blank')}</MenuLink>
|
||||
<MenuLink to="/reports/templates/create/open-counts">{t('openCounts')}</MenuLink>
|
||||
<MenuLink to="/reports/templates/create/open-counts-csv">{t('openCountsAsCsv')}</MenuLink>
|
||||
<MenuLink to="/reports/templates/create/aggregated-open-counts">{t('aggregatedOpenCounts')}</MenuLink>
|
||||
</DropdownMenu>
|
||||
<ButtonDropdown buttonClassName="btn-primary" menuClassName="dropdown-menu-right" label={t('createReportTemplate')}>
|
||||
<ButtonDropdownLink to="/reports/templates/create">{t('blank')}</ButtonDropdownLink>
|
||||
<ButtonDropdownLink to="/reports/templates/create/open-counts">{t('openCounts')}</ButtonDropdownLink>
|
||||
<ButtonDropdownLink to="/reports/templates/create/open-counts-csv">{t('openCountsAsCsv')}</ButtonDropdownLink>
|
||||
<ButtonDropdownLink to="/reports/templates/create/aggregated-open-counts">{t('aggregatedOpenCounts')}</ButtonDropdownLink>
|
||||
</ButtonDropdown>
|
||||
</Toolbar>
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -249,7 +249,7 @@ export default class CUD extends Component {
|
|||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('save')}/>
|
||||
{canDelete &&
|
||||
<NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/send-configurations/${this.props.entity.id}/delete`}/>
|
||||
<NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/send-configurations/${this.props.entity.id}/delete`}/>
|
||||
}
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ export default class List extends Component {
|
|||
|
||||
if (perms.includes('share')) {
|
||||
actions.push({
|
||||
label: <Icon icon="share-alt" title={t('share')}/>,
|
||||
label: <Icon icon="share" title={t('share')}/>,
|
||||
link: `/send-configurations/${data[0]}/share`
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -69,7 +69,7 @@ export default class UserShares extends Component {
|
|||
|
||||
if (!autoGenerated && perms.includes('share')) {
|
||||
actions.push({
|
||||
label: <Icon icon="remove" title={t('remove')}/>,
|
||||
label: <Icon icon="trash-alt" title={t('remove')}/>,
|
||||
action: () => this.deleteShare(entityTypeId, data[2])
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -295,7 +295,7 @@ export default class CUD extends Component {
|
|||
|
||||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={isEdit ? t('save') : t('saveAndEditTemplate')}/>
|
||||
{canDelete && <NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/templates/${this.props.entity.id}/delete`}/> }
|
||||
{canDelete && <NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/templates/${this.props.entity.id}/delete`}/> }
|
||||
{isEdit && <Button className="btn-danger" icon="send" label={t('testSend')} onClickAsync={async () => this.setState({showTestSendModal: true})}/> }
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
|
|
|
|||
|
|
@ -100,7 +100,7 @@ export default class List extends Component {
|
|||
|
||||
if (perms.includes('share')) {
|
||||
actions.push({
|
||||
label: <Icon icon="share-alt" title={t('share')}/>,
|
||||
label: <Icon icon="share" title={t('share')}/>,
|
||||
link: `/templates/${data[0]}/share`
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -196,7 +196,7 @@ export default class CUD extends Component {
|
|||
<Button type="submit" className="btn-primary" icon="check" label={t('saveAndStay')} onClickAsync={::this.submitAndStay}/>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('saveAndLeave')}/>
|
||||
{canDelete &&
|
||||
<NavButton className="btn-danger" icon="remove" label={t('delete')} linkTo={`/templates/mosaico/${this.props.entity.id}/delete`}/>
|
||||
<NavButton className="btn-danger" icon="trash-alt" label={t('delete')} linkTo={`/templates/mosaico/${this.props.entity.id}/delete`}/>
|
||||
}
|
||||
</ButtonRow>
|
||||
:
|
||||
|
|
|
|||
|
|
@ -3,11 +3,12 @@
|
|||
import React, {Component} from 'react';
|
||||
import {withTranslation} from '../../lib/i18n';
|
||||
import {
|
||||
DropdownMenu,
|
||||
ButtonDropdown,
|
||||
Icon
|
||||
} from '../../lib/bootstrap-components';
|
||||
import {
|
||||
MenuLink,
|
||||
ButtonDropdownLink,
|
||||
NavDropdown,
|
||||
requiresAuthenticatedUser,
|
||||
Title,
|
||||
Toolbar,
|
||||
|
|
@ -102,7 +103,7 @@ export default class List extends Component {
|
|||
|
||||
if (perms.includes('share')) {
|
||||
actions.push({
|
||||
label: <Icon icon="share-alt" title={t('share')}/>,
|
||||
label: <Icon icon="share" title={t('share')}/>,
|
||||
link: `/templates/mosaico/${data[0]}/share`
|
||||
});
|
||||
}
|
||||
|
|
@ -119,10 +120,10 @@ export default class List extends Component {
|
|||
{tableRestActionDialogRender(this)}
|
||||
{this.state.createPermitted &&
|
||||
<Toolbar>
|
||||
<DropdownMenu className="btn-primary" label={t('createMosaicoTemplate')}>
|
||||
<MenuLink to="/templates/mosaico/create">{t('blank')}</MenuLink>
|
||||
<MenuLink to="/templates/mosaico/create/versafix">{t('versafixOne')}</MenuLink>
|
||||
</DropdownMenu>
|
||||
<ButtonDropdown buttonClassName="btn-primary" menuClassName="dropdown-menu-right" label={t('createMosaicoTemplate')}>
|
||||
<ButtonDropdownLink to="/templates/mosaico/create">{t('blank')}</ButtonDropdownLink>
|
||||
<ButtonDropdownLink to="/templates/mosaico/create/versafix">{t('versafixOne')}</ButtonDropdownLink>
|
||||
</ButtonDropdown>
|
||||
</Toolbar>
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -249,7 +249,7 @@ export default class CUD extends Component {
|
|||
|
||||
<ButtonRow>
|
||||
<Button type="submit" className="btn-primary" icon="check" label={t('save')}/>
|
||||
{canDelete && <NavButton className="btn-danger" icon="remove" label={t('deleteUser')} linkTo={`/users/${this.props.entity.id}/delete`}/>}
|
||||
{canDelete && <NavButton className="btn-danger" icon="trash-alt" label={t('deleteUser')} linkTo={`/users/${this.props.entity.id}/delete`}/>}
|
||||
</ButtonRow>
|
||||
</Form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@ export default class List extends Component {
|
|||
});
|
||||
|
||||
actions.push({
|
||||
label: <Icon icon="share" title={t('share')}/>,
|
||||
label: <Icon icon="share-square" title={t('share')}/>,
|
||||
link: `/users/${data[0]}/shares`
|
||||
});
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue