wassname/talk
1
0
Fork 0
mirror of https://github.com/wassname/talk.git synced 2026-08-14 12:50:17 +08:00
Code Issues Packages Projects Releases Wiki Activity

[CORl-278] Perspective Model (#2337)

Browse Source 
* feat: support switching the perspective model

* feat: support changing the model on admin

* fix: linting

* fix: removed defaulted value
This commit is contained in:
Wyatt Johnson
2019-06-28 22:10:32 +00:00
committed by GitHub
parent e72b15c505
commit 76033118e5
12 changed files with 154 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/core/client/admin/routes/Configure/sections/Moderation/PerspectiveConfig.tsx
+56 -8
View File
@@ -5,6 +5,10 @@ import { Field } from "react-final-form";
import { formatPercentage, parsePercentage } from "coral-framework/lib/form";
import {
TOXICITY_MODEL_DEFAULT,
TOXICITY_THRESHOLD_DEFAULT,
} from "coral-common/constants";
import { ExternalLink } from "coral-framework/lib/i18n/components";
import {
composeValidators,
@@ -32,9 +36,6 @@ import APIKeyField from "./APIKeyField";
import styles from "./PerspectiveConfig.css";
/* TODO: use a common constants for both client and server. */
const TOXICITY_DEFAULT = 80;
interface Props {
disabled: boolean;
}
@@ -69,7 +70,7 @@ const PerspectiveConfig: FunctionComponent<Props> = ({ disabled }) => {
<FormField container={<FieldSet />}>
<Localized id="configure-moderation-perspective-filter">
<InputLabel container="legend">Spam Detection Filter</InputLabel>
<InputLabel container="legend">Toxic Comment Filter</InputLabel>
</Localized>
<OnOffField
name="integrations.perspective.enabled"
@@ -85,12 +86,12 @@ const PerspectiveConfig: FunctionComponent<Props> = ({ disabled }) => {
</Localized>
<Localized
id="configure-moderation-perspective-toxicityThresholdDescription"
$default={TOXICITY_DEFAULT}
$default={TOXICITY_THRESHOLD_DEFAULT + "%"}
>
<InputDescription>
This value can be set a percentage between 0 and 100. This number
represents the likelihood that a comment is toxic, according to
Perspective API. Defaults to $default.
Perspective API. By default the threshold is set to $default.
</InputDescription>
</Localized>
<Field
@@ -113,7 +114,7 @@ const PerspectiveConfig: FunctionComponent<Props> = ({ disabled }) => {
autoCapitalize="off"
spellCheck={false}
adornment={<Typography variant="bodyCopy">%</Typography>}
placeholder={TOXICITY_DEFAULT.toString()}
placeholder={TOXICITY_THRESHOLD_DEFAULT.toString()}
textAlignCenter
/>
{meta.touched && (meta.error || meta.submitError) && (
@@ -126,6 +127,53 @@ const PerspectiveConfig: FunctionComponent<Props> = ({ disabled }) => {
</Field>
</FormField>
<FormField>
<Localized id="configure-moderation-perspective-toxicityModel">
<InputLabel htmlFor="configure-moderation-perspective-model">
Toxicity Model
</InputLabel>
</Localized>
<Localized
id="configure-moderation-perspective-toxicityModelDescription"
externalLink={
<ExternalLink
href={
"https://github.com/conversationai/perspectiveapi/blob/master/api_reference.md#models"
}
/>
}
$default={TOXICITY_MODEL_DEFAULT}
>
<InputDescription>
Choose your Perspective Model. The default is $default. You can find
out more about model choices here.
</InputDescription>
</Localized>
<Field name="integrations.perspective.model">
{({ input, meta }) => (
<>
<TextField
id="configure-moderation-perspective-model"
name={input.name}
onChange={input.onChange}
value={input.value}
disabled={disabled}
autoComplete="off"
autoCorrect="off"
autoCapitalize="off"
placeholder={TOXICITY_MODEL_DEFAULT}
spellCheck={false}
/>
{meta.touched && (meta.error || meta.submitError) && (
<ValidationMessage>
{meta.error || meta.submitError}
</ValidationMessage>
)}
</>
)}
</Field>
</FormField>
<FormField container={<FieldSet />}>
<Localized id="configure-moderation-perspective-allowStoreCommentData">
<InputLabel container="legend">
@@ -135,7 +183,7 @@ const PerspectiveConfig: FunctionComponent<Props> = ({ disabled }) => {
<Localized id="configure-moderation-perspective-allowStoreCommentDataDescription">
<InputDescription>
Stored comments will be used for future research and community model
building purposes to improve the API over time
building purposes to improve the API over time.
</InputDescription>
</Localized>
<div>
src/core/client/admin/routes/Configure/sections/Moderation/PerspectiveConfigContainer.tsx
+1
View File
@@ -32,6 +32,7 @@ const enhanced = withFragmentContainer<Props>({
enabled
endpoint
key
model
threshold
doNotStore
}
src/core/client/admin/test/configure/__snapshots__/general.spec.tsx.snap
+1
View File
@@ -294,6 +294,7 @@ Markdown can be found
<a
className="ExternalLink-root"
href="#"
rel="noopener noreferrer"
target="_blank"
>
here
src/core/client/admin/test/configure/__snapshots__/moderation.spec.tsx.snap
+46 -2
View File
@@ -202,7 +202,7 @@ the
className="Box-root Typography-root Typography-detail Typography-colorTextSecondary"
>
This value can be set a percentage between 0 and 100. This number represents the likelihood that a
comment is toxic, according to Perspective API. By default the treshold is set to 80.
comment is toxic, according to Perspective API. By default the threshold is set to 80%.
</p>
<div
className="TextField-root PerspectiveConfig-thresholdTextField"
@@ -232,6 +232,48 @@ comment is toxic, according to Perspective API. By default the treshold is set t
</div>
</div>
</div>
<div
className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
>
<label
className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
htmlFor="configure-moderation-perspective-model"
>
Toxicity Model
</label>
<p
className="Box-root Typography-root Typography-detail Typography-colorTextSecondary"
>
Choose your Perspective Model. The default is TOXICITY. You can find out more about model choices
<a
className="ExternalLink-root"
href="https://github.com/conversationai/perspectiveapi/blob/master/api_reference.md#models"
rel="noopener noreferrer"
target="_blank"
>
here
</a>
.
</p>
<div
className="TextField-root"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="TextField-input TextField-colorRegular"
disabled={false}
id="configure-moderation-perspective-model"
name="integrations.perspective.model"
onChange={[Function]}
placeholder="TOXICITY"
spellCheck={false}
type="text"
value=""
/>
</div>
</div>
<fieldset
className="FieldSet-root Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
>
@@ -244,7 +286,7 @@ comment is toxic, according to Perspective API. By default the treshold is set t
className="Box-root Typography-root Typography-detail Typography-colorTextSecondary"
>
Stored comments will be used for future research and community model building purposes to
improve the API over time
improve the API over time.
</p>
<div>
<div>
@@ -309,6 +351,7 @@ improve the API over time
<a
className="ExternalLink-root"
href="https://github.com/conversationai/perspectiveapi/blob/master/quickstart.md"
rel="noopener noreferrer"
target="_blank"
>
https://github.com/conversationai/perspectiveapi/blob/master/quickstart.md
@@ -477,6 +520,7 @@ in your Akismet account:
<a
className="ExternalLink-root"
href="https://akismet.com/account/"
rel="noopener noreferrer"
target="_blank"
>
https://akismet.com/account/
src/core/client/admin/test/configure/__snapshots__/wordList.spec.tsx.snap
+2
View File
@@ -141,6 +141,7 @@ and paste a comma separated list?
<a
className="ExternalLink-root"
href="#"
rel="noopener noreferrer"
target="_blank"
>
Learn how to convert your list
@@ -198,6 +199,7 @@ and paste a comma separated list?
<a
className="ExternalLink-root"
href="#"
rel="noopener noreferrer"
target="_blank"
>
Learn how to convert your list
src/core/client/admin/test/configure/moderation.spec.tsx
+1
View File
@@ -150,6 +150,7 @@ it("change perspective settings", async () => {
enabled: true,
endpoint: "https://custom-endpoint.net",
key: "my api key",
model: null,
threshold: 0.1,
}
);