====Background
To ensure that wikistories remain relevant and up-to date, story creators are **alerted** on recent changes to an article and **shown the specific changes** that have taken place.
|Scenario 3. Selected //story text// is no longer part of the article...| - | high priority |
|Scenario 4a. Select //story text// is partially edited....| - | high priority |
|Scenario 4b. Specific //properties// have changed but the rest of the text is still valid | https://id.wikipedia.org/wiki/Story:Sejarah_Ratu_Elizabeth_II (facts in the story differ from the article: “Her reign of 70 years…” vs “Her reign of 71 years…” | high priority|
For these scenarios, it would require:
- Setting up a notification > UX copy
- Adding a CTA for editors to action on notifications > UX copy
- Design the flow on the story builder
====Description/User story
As a wiki story creator,
I want to be shown of the changes made to an article that has a wikistory I //created//,
so that I can updated the wikistory accordingly.
As a wiki story creator,
I want to be shown of the changes made to an article that has a wikistory I //edited//,
so that I can updated the wikistory accordingly.
====Design
=======01. Discovery of problematic text inside story builder.
|{F36875038 width=260}|
- Show a clear label indicating that the text is outdated and needs to be reviewed.
- Label message "Outdated story text, review".
- Place warning icon next to label message.
- Place label message below the story text.
- Divide the label message and story text using a separator.
- Separator is 1 px border and has #C8CCD1 color.
- Tap on "review" take users to Review changes screen.
=======02. Review Outdated story text.
|Word removed||Word removed and added||Changing to small caps|
|{F36875072 width=260}||{F36875071 width=260}||{F36875073 width=260}|
|Statement partially edited||Selected text is no longer available|
|{F36875074 width=260}||{F36875075 width=260}|
- Screen title: "**Review changes**"
- Show previously selected story text in an underlined format.
- Underline has 1 px border and use #000 color.
- Use the color #e07076 to indicate the removed information.
- Use the color #75C877 to indicate the newly added information.
- Present two buttons at the bottom "No change required", "Update".
- "No change required" button take users back to the story page.
- Remove outdated story text label if users tap on "No change required" button.
- "Update" button take users to update story text.
- Device back key should take users back to the story builder.
- Back arrow on top should take users back to the story builder.
- On scroll, show all other changes to the text while they're on review changes screen.
=======03. Update outdated information.
|Article selection screen||Updated text box
|{F36875554 width=260}||{F36875555 width=260}|
- Show updated story text highlighted.
- Tap on "Clear" button removes the highlight and let editors choose any other text.
- Tap on "Add to story" text updates the text box on story page.
- Remove warning message from text box on story page.
|Previously selected text is no longer available||Allow selecting any other text||Update story page with new text|
|{F36875561 width=260}||{F36875560 width=260}||{F36875562 width=260}|
- Allow editors to choose new fact when previously selected text is no longer part of the article.
- Present story text without any highlights.
=======04. Notification in story change
|{F36877210 width=260}|
- Show following notification message when text has changed in article. "(article_name) article has been edited, check Story:(story_name) for accuracy."
- Show following notification message when image has changed in article. "(image_file_name) has been deleted, replace with a new image on Story:(story_name) for accuracy"
- Make entire notification serve as primary link which opens problematic story page on story builder.
[[ https://www.figma.com/file/tIwOFtsTKwaihiSymdXsLn/Article-Wikistory-Synch-T328419?node-id=120%3A6952&t=HOxSQWh4nP6MZkJt-1 | Design file ]]
====Acceptance Criteria
**Alerting:**
- Showing alert of outdated text on builder with right UX copy
- Showing alert on notices / alerts with right UX copy
- After selecting clear button, alert disappears from story
- After selecting add to story, alert disappears from story
**Displaying changes:**
- Highlighting removed information in red and added information in green:
- When word is removed
- When word is added
- When sentence is removed
- When sentence is added
- When a letter is changed
- When a number is changed
- Highlighting previously selected text as underlined
**CTA on builder:**
- Clear button removes selection and allows user to select afresh/ a different text block.
- Add to story button replaces the original text
**Navigation:**
- Back arrow takes user to story builder
- Device back key takes user to story builder
====Test Scenarios
====Open questions