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

[CORL-504] Configure reaction language (#2490)

Browse Source 
* add reaction config to settings

* fix reaction preview styles

* update snaps and fixtures

* add i18n strings

* update spec

* ensure dynamic value shows in reaction config preview
This commit is contained in:
Tessa Thornton
2019-08-20 13:03:25 -04:00
committed by GitHub
parent 8dae0feb52
commit add5224338
10 changed files with 511 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/core/client/admin/test/configure/__snapshots__/general.spec.tsx.snap
+213
View File
@@ -737,6 +737,219 @@ moderation panel.
/>
</div>
</div>
<fieldset
className="FieldSet-root Box-root HorizontalGutter-root HorizontalGutter-oneAndAHalf"
>
<legend
className="Box-root Typography-root Typography-heading1 Typography-colorTextPrimary Header-root"
>
Reactions
</legend>
<p
className="Box-root Typography-root Typography-detail Typography-colorTextPrimary"
>
Allow your community to engage with one another and express themselves
with one-click reactions. By default, Coral allows commenters to
"Respect" each other's comments, but you may customize reaction text
based on the needs of your community.
</p>
<div
className="Box-root HorizontalGutter-root HorizontalGutter-double"
>
<div
className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
>
<div
className="Box-root Flex-root Flex-flex Flex-doubleItemGutter gutter"
>
<div
className="Box-root HorizontalGutter-root HorizontalGutter-full"
>
<label
className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
>
Reaction label
</label>
<div
className="TextField-root TextField-fullWidth ReactionConfig-textInput"
>
<input
className="TextField-input TextField-colorRegular"
disabled={false}
id="reaction.label"
name="reaction.label"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
placeholder="E.g. Respect"
type="text"
value="Reaction"
/>
</div>
</div>
<div
className="Box-root HorizontalGutter-root HorizontalGutter-full"
>
<h1
className="Box-root Typography-root Typography-heading3 Typography-colorTextPrimary"
>
Preview
</h1>
<button
className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost Button-disabled ReactionButton-readOnly ReactionConfig-reactionButton"
disabled={true}
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
onTouchEnd={[Function]}
type="button"
>
<span>
Reaction
</span>
</button>
</div>
</div>
</div>
<div
className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
>
<div
className="Box-root Flex-root Flex-flex Flex-doubleItemGutter gutter"
>
<div
className="Box-root HorizontalGutter-root HorizontalGutter-full"
>
<label
className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
>
Active reaction label
</label>
<div
className="TextField-root TextField-fullWidth ReactionConfig-textInput"
>
<input
className="TextField-input TextField-colorRegular"
disabled={false}
id="reaction.labelActive"
name="reaction.labelActive"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
placeholder="E.g. Respected"
type="text"
value="reacted"
/>
</div>
</div>
<div
className="Box-root HorizontalGutter-root HorizontalGutter-full"
>
<h1
className="Box-root Typography-root Typography-heading3 Typography-colorTextPrimary"
>
Preview
</h1>
<button
className="BaseButton-root Button-root Button-sizeSmall Button-colorRegular Button-variantGhost Button-disabled ReactionButton-readOnly ReactionConfig-reactionButton"
disabled={true}
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
onTouchEnd={[Function]}
type="button"
>
<span>
reacted
</span>
</button>
</div>
</div>
</div>
<div
className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
>
<div
className="Box-root Flex-root Flex-flex Flex-doubleItemGutter gutter"
>
<div
className="Box-root HorizontalGutter-root HorizontalGutter-full"
>
<label
className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
>
Sort label
</label>
<div
className="TextField-root TextField-fullWidth ReactionConfig-textInput"
>
<input
className="TextField-input TextField-colorRegular"
disabled={false}
id="reaction.sortLabel"
name="reaction.sortLabel"
onBlur={[Function]}
onChange={[Function]}
onFocus={[Function]}
placeholder="E.g. Most respected"
type="text"
value="Reactions"
/>
</div>
</div>
<div
className="Box-root HorizontalGutter-root HorizontalGutter-full"
>
<h1
className="Box-root Typography-root Typography-heading3 Typography-colorTextPrimary"
>
Preview
</h1>
<div
className="Box-root Flex-root Flex-flex Flex-itemGutter Flex-justifyCenter gutter"
>
<p
className="Box-root Typography-root Typography-bodyCopyBold Typography-colorTextPrimary"
>
Sort by
</p>
<span
className="SelectField-root"
>
<select
className="SelectField-select"
onBlur={[Function]}
onFocus={[Function]}
>
<option
value="Reactions"
>
Reactions
</option>
</select>
<span
aria-hidden={true}
className="SelectField-afterWrapper"
>
<span
aria-hidden="true"
className="Icon-root Icon-sm"
>
expand_more
</span>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</fieldset>
</div>
</div>
</div>
src/core/client/admin/test/fixtures.ts
+6
View File
@@ -46,6 +46,12 @@ export const settings = createFixture<GQLSettings>({
timeout: 604800,
message: "Comments are closed on this story.",
},
reaction: {
label: "Reaction",
labelActive: "reacted",
sortLabel: "Reactions",
icon: "icon",
},
email: {
enabled: true,
},