зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1621110 - Enable message editing for CFRs and Snippets on the general tab r=pdahiya
Differential Revision: https://phabricator.services.mozilla.com/D79916
This commit is contained in:
Родитель
2ba9319525
Коммит
aaf096ab28
|
@ -508,6 +508,7 @@ export class ASRouterAdminInner extends React.PureComponent {
|
|||
messageFilter: "all",
|
||||
WNMessages: [],
|
||||
collapsedMessages: [],
|
||||
modifiedMessages: [],
|
||||
evaluationStatus: {},
|
||||
trailhead: {},
|
||||
stringTargetingParameters: null,
|
||||
|
@ -580,6 +581,23 @@ export class ASRouterAdminInner extends React.PureComponent {
|
|||
return () => ASRouterUtils.unblockById(msg.id);
|
||||
}
|
||||
|
||||
resetJSON(msg) {
|
||||
// reset the displayed JSON for the given message
|
||||
document.getElementById(`${msg.id}-textarea`).value = JSON.stringify(
|
||||
msg,
|
||||
null,
|
||||
2
|
||||
);
|
||||
// remove the message from the list of modified IDs
|
||||
let index = this.state.modifiedMessages.indexOf(msg.id);
|
||||
this.setState(prevState => ({
|
||||
modifiedMessages: [
|
||||
...prevState.modifiedMessages.slice(0, index),
|
||||
...prevState.modifiedMessages.slice(index + 1),
|
||||
],
|
||||
}));
|
||||
}
|
||||
|
||||
handleOverride(id) {
|
||||
return () => ASRouterUtils.overrideMessage(id);
|
||||
}
|
||||
|
@ -788,6 +806,20 @@ export class ASRouterAdminInner extends React.PureComponent {
|
|||
}
|
||||
}
|
||||
|
||||
modifyJson(msg) {
|
||||
ASRouterUtils.modifyMessageJson(
|
||||
JSON.parse(document.getElementById(`${msg.id}-textarea`).value)
|
||||
);
|
||||
}
|
||||
|
||||
handleChange(msgId) {
|
||||
if (!this.state.modifiedMessages.includes(msgId)) {
|
||||
this.setState(prevState => ({
|
||||
modifiedMessages: prevState.modifiedMessages.concat(msgId),
|
||||
}));
|
||||
}
|
||||
}
|
||||
|
||||
renderMessageItem(msg) {
|
||||
const isBlockedByGroup = this.state.groups
|
||||
.filter(group => msg.groups.includes(group.id))
|
||||
|
@ -805,6 +837,7 @@ export class ASRouterAdminInner extends React.PureComponent {
|
|||
? this.state.messageImpressions[msg.id].length
|
||||
: 0;
|
||||
const isCollapsed = this.state.collapsedMessages.includes(msg.id);
|
||||
const isModified = this.state.modifiedMessages.includes(msg.id);
|
||||
|
||||
let itemClassName = "message-item";
|
||||
if (isBlocked) {
|
||||
|
@ -834,11 +867,32 @@ export class ASRouterAdminInner extends React.PureComponent {
|
|||
>
|
||||
{isBlocked ? "Unblock" : "Block"}
|
||||
</button>
|
||||
{isBlocked ? null : (
|
||||
<button className="button" onClick={this.handleOverride(msg.id)}>
|
||||
{// eslint-disable-next-line no-nested-ternary
|
||||
isBlocked ? null : isModified ? (
|
||||
<button
|
||||
className="button restore"
|
||||
// eslint-disable-next-line react/jsx-no-bind
|
||||
onClick={e => this.resetJSON(msg)}
|
||||
>
|
||||
Reset
|
||||
</button>
|
||||
) : (
|
||||
<button
|
||||
className="button show"
|
||||
onClick={this.handleOverride(msg.id)}
|
||||
>
|
||||
Show
|
||||
</button>
|
||||
)}
|
||||
{isBlocked ? null : (
|
||||
<button
|
||||
className="button modify"
|
||||
// eslint-disable-next-line react/jsx-no-bind
|
||||
onClick={e => this.modifyJson(msg)}
|
||||
>
|
||||
Modify
|
||||
</button>
|
||||
)}
|
||||
<br />({impressions} impressions)
|
||||
</td>
|
||||
<td className="message-summary">
|
||||
|
@ -852,7 +906,16 @@ export class ASRouterAdminInner extends React.PureComponent {
|
|||
)}
|
||||
<tr>
|
||||
<pre className={isCollapsed ? "collapsed" : "expanded"}>
|
||||
{JSON.stringify(msg, null, 2)}
|
||||
<textarea
|
||||
id={`${msg.id}-textarea`}
|
||||
name={msg.id}
|
||||
className="general-textarea"
|
||||
disabled={isBlocked}
|
||||
// eslint-disable-next-line react/jsx-no-bind
|
||||
onChange={e => this.handleChange(msg.id)}
|
||||
>
|
||||
{JSON.stringify(msg, null, 2)}
|
||||
</textarea>
|
||||
</pre>
|
||||
</tr>
|
||||
</td>
|
||||
|
@ -959,12 +1022,19 @@ export class ASRouterAdminInner extends React.PureComponent {
|
|||
return (
|
||||
<div>
|
||||
<button
|
||||
className="ASRouterButton slim button"
|
||||
className="ASRouterButton slim"
|
||||
// eslint-disable-next-line react/jsx-no-bind
|
||||
onClick={e => this.toggleAllMessages(messagesToShow)}
|
||||
>
|
||||
Collapse/Expand All
|
||||
</button>
|
||||
<p className="helpLink">
|
||||
<span className="icon icon-small-spacer icon-info" />{" "}
|
||||
<span>
|
||||
To modify a message, change the JSON and click 'Modify' to see your
|
||||
changes. Click 'Reset' to restore the JSON to the original.
|
||||
</span>
|
||||
</p>
|
||||
<table>
|
||||
<tbody>
|
||||
{messagesToShow.map(msg => this.renderMessageItem(msg))}
|
||||
|
|
|
@ -78,6 +78,15 @@
|
|||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.general-textarea {
|
||||
width: 740px;
|
||||
height: 500px;
|
||||
overflow: auto;
|
||||
resize: none;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.wnp-textarea {
|
||||
width: 740px;
|
||||
height: 500px;
|
||||
|
|
|
@ -1727,6 +1727,13 @@ main {
|
|||
padding: 6px 12px;
|
||||
margin-inline-start: 5px;
|
||||
margin-bottom: 0; }
|
||||
.asrouter-admin .general-textarea {
|
||||
width: 740px;
|
||||
height: 500px;
|
||||
overflow: auto;
|
||||
resize: none;
|
||||
border-radius: 4px;
|
||||
display: flex; }
|
||||
.asrouter-admin .wnp-textarea {
|
||||
width: 740px;
|
||||
height: 500px;
|
||||
|
|
|
@ -1730,6 +1730,13 @@ main {
|
|||
padding: 6px 12px;
|
||||
margin-inline-start: 5px;
|
||||
margin-bottom: 0; }
|
||||
.asrouter-admin .general-textarea {
|
||||
width: 740px;
|
||||
height: 500px;
|
||||
overflow: auto;
|
||||
resize: none;
|
||||
border-radius: 4px;
|
||||
display: flex; }
|
||||
.asrouter-admin .wnp-textarea {
|
||||
width: 740px;
|
||||
height: 500px;
|
||||
|
|
|
@ -1727,6 +1727,13 @@ main {
|
|||
padding: 6px 12px;
|
||||
margin-inline-start: 5px;
|
||||
margin-bottom: 0; }
|
||||
.asrouter-admin .general-textarea {
|
||||
width: 740px;
|
||||
height: 500px;
|
||||
overflow: auto;
|
||||
resize: none;
|
||||
border-radius: 4px;
|
||||
display: flex; }
|
||||
.asrouter-admin .wnp-textarea {
|
||||
width: 740px;
|
||||
height: 500px;
|
||||
|
|
|
@ -1189,6 +1189,7 @@ class ASRouterAdminInner extends react__WEBPACK_IMPORTED_MODULE_4___default.a.Pu
|
|||
messageFilter: "all",
|
||||
WNMessages: [],
|
||||
collapsedMessages: [],
|
||||
modifiedMessages: [],
|
||||
evaluationStatus: {},
|
||||
trailhead: {},
|
||||
stringTargetingParameters: null,
|
||||
|
@ -1266,6 +1267,16 @@ class ASRouterAdminInner extends react__WEBPACK_IMPORTED_MODULE_4___default.a.Pu
|
|||
return () => _asrouter_asrouter_content__WEBPACK_IMPORTED_MODULE_1__["ASRouterUtils"].unblockById(msg.id);
|
||||
}
|
||||
|
||||
resetJSON(msg) {
|
||||
// reset the displayed JSON for the given message
|
||||
document.getElementById(`${msg.id}-textarea`).value = JSON.stringify(msg, null, 2); // remove the message from the list of modified IDs
|
||||
|
||||
let index = this.state.modifiedMessages.indexOf(msg.id);
|
||||
this.setState(prevState => ({
|
||||
modifiedMessages: [...prevState.modifiedMessages.slice(0, index), ...prevState.modifiedMessages.slice(index + 1)]
|
||||
}));
|
||||
}
|
||||
|
||||
handleOverride(id) {
|
||||
return () => _asrouter_asrouter_content__WEBPACK_IMPORTED_MODULE_1__["ASRouterUtils"].overrideMessage(id);
|
||||
}
|
||||
|
@ -1510,6 +1521,18 @@ class ASRouterAdminInner extends react__WEBPACK_IMPORTED_MODULE_4___default.a.Pu
|
|||
}
|
||||
}
|
||||
|
||||
modifyJson(msg) {
|
||||
_asrouter_asrouter_content__WEBPACK_IMPORTED_MODULE_1__["ASRouterUtils"].modifyMessageJson(JSON.parse(document.getElementById(`${msg.id}-textarea`).value));
|
||||
}
|
||||
|
||||
handleChange(msgId) {
|
||||
if (!this.state.modifiedMessages.includes(msgId)) {
|
||||
this.setState(prevState => ({
|
||||
modifiedMessages: prevState.modifiedMessages.concat(msgId)
|
||||
}));
|
||||
}
|
||||
}
|
||||
|
||||
renderMessageItem(msg) {
|
||||
const isBlockedByGroup = this.state.groups.filter(group => msg.groups.includes(group.id)).some(group => !group.enabled);
|
||||
const msgProvider = this.state.providers.find(provider => provider.id === msg.provider) || {};
|
||||
|
@ -1518,6 +1541,7 @@ class ASRouterAdminInner extends react__WEBPACK_IMPORTED_MODULE_4___default.a.Pu
|
|||
const isBlocked = isMessageBlocked || isBlockedByGroup || isProviderExcluded;
|
||||
const impressions = this.state.messageImpressions[msg.id] ? this.state.messageImpressions[msg.id].length : 0;
|
||||
const isCollapsed = this.state.collapsedMessages.includes(msg.id);
|
||||
const isModified = this.state.modifiedMessages.includes(msg.id);
|
||||
let itemClassName = "message-item";
|
||||
|
||||
if (isBlocked) {
|
||||
|
@ -1538,14 +1562,30 @@ class ASRouterAdminInner extends react__WEBPACK_IMPORTED_MODULE_4___default.a.Pu
|
|||
}, react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("button", {
|
||||
className: `button ${isBlocked ? "" : " primary"}`,
|
||||
onClick: isBlocked ? this.handleUnblock(msg) : this.handleBlock(msg)
|
||||
}, isBlocked ? "Unblock" : "Block"), isBlocked ? null : react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("button", {
|
||||
className: "button",
|
||||
}, isBlocked ? "Unblock" : "Block"), // eslint-disable-next-line no-nested-ternary
|
||||
isBlocked ? null : isModified ? react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("button", {
|
||||
className: "button restore" // eslint-disable-next-line react/jsx-no-bind
|
||||
,
|
||||
onClick: e => this.resetJSON(msg)
|
||||
}, "Reset") : react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("button", {
|
||||
className: "button show",
|
||||
onClick: this.handleOverride(msg.id)
|
||||
}, "Show"), react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("br", null), "(", impressions, " impressions)"), react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("td", {
|
||||
}, "Show"), isBlocked ? null : react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("button", {
|
||||
className: "button modify" // eslint-disable-next-line react/jsx-no-bind
|
||||
,
|
||||
onClick: e => this.modifyJson(msg)
|
||||
}, "Modify"), react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("br", null), "(", impressions, " impressions)"), react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("td", {
|
||||
className: "message-summary"
|
||||
}, isBlocked && react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("tr", null, "Block reason:", isBlockedByGroup && " Blocked by group", isProviderExcluded && " Excluded by provider", isMessageBlocked && " Message blocked"), react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("tr", null, react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("pre", {
|
||||
className: isCollapsed ? "collapsed" : "expanded"
|
||||
}, JSON.stringify(msg, null, 2)))));
|
||||
}, react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("textarea", {
|
||||
id: `${msg.id}-textarea`,
|
||||
name: msg.id,
|
||||
className: "general-textarea",
|
||||
disabled: isBlocked // eslint-disable-next-line react/jsx-no-bind
|
||||
,
|
||||
onChange: e => this.handleChange(msg.id)
|
||||
}, JSON.stringify(msg, null, 2))))));
|
||||
}
|
||||
|
||||
restoreWNMessageState() {
|
||||
|
@ -1622,10 +1662,14 @@ class ASRouterAdminInner extends react__WEBPACK_IMPORTED_MODULE_4___default.a.Pu
|
|||
|
||||
const messagesToShow = this.state.messageFilter === "all" ? this.state.messages : this.state.messages.filter(message => message.provider === this.state.messageFilter);
|
||||
return react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("div", null, react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("button", {
|
||||
className: "ASRouterButton slim button" // eslint-disable-next-line react/jsx-no-bind
|
||||
className: "ASRouterButton slim" // eslint-disable-next-line react/jsx-no-bind
|
||||
,
|
||||
onClick: e => this.toggleAllMessages(messagesToShow)
|
||||
}, "Collapse/Expand All"), react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("table", null, react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("tbody", null, messagesToShow.map(msg => this.renderMessageItem(msg)))));
|
||||
}, "Collapse/Expand All"), react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("p", {
|
||||
className: "helpLink"
|
||||
}, react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("span", {
|
||||
className: "icon icon-small-spacer icon-info"
|
||||
}), " ", react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("span", null, "To modify a message, change the JSON and click 'Modify' to see your changes. Click 'Reset' to restore the JSON to the original.")), react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("table", null, react__WEBPACK_IMPORTED_MODULE_4___default.a.createElement("tbody", null, messagesToShow.map(msg => this.renderMessageItem(msg)))));
|
||||
}
|
||||
|
||||
renderWNMessages() {
|
||||
|
|
|
@ -266,7 +266,7 @@ describe("ASRouterAdmin", () => {
|
|||
});
|
||||
|
||||
assert.lengthOf(wrapper.find(".message-id"), 1);
|
||||
wrapper.find(".message-item button:not(.primary)").simulate("click");
|
||||
wrapper.find(".message-item button.show").simulate("click");
|
||||
// first call is ADMIN_CONNECT_STATE
|
||||
assert.propertyVal(
|
||||
sendMessageStub.secondCall.args[1],
|
||||
|
|
Загрузка…
Ссылка в новой задаче