Add Arabic and English RTL experiment study configs, assets, and UI t…#1
Open
abdelrahman1234567 wants to merge 2 commits intomainfrom
Open
Add Arabic and English RTL experiment study configs, assets, and UI t…#1abdelrahman1234567 wants to merge 2 commits intomainfrom
abdelrahman1234567 wants to merge 2 commits intomainfrom
Conversation
There was a problem hiding this comment.
Pull request overview
This PR adds new RTL experiment study materials (English + Arabic) including trial templates and instruction/break/outro content, plus a small UI localization tweak so the study browser sidebar can display Arabic labels when running the Arabic study config.
Changes:
- Added English and Arabic trial HTML templates (numeric + dropdown) that hide the chart after a fixed time and post answers via reVISit iframe messaging.
- Added study content assets (instruction markdown, break/outro pages) and a set of bar-chart stimulus SVGs for both languages.
- Updated the app’s Study Browser sidebar to render Arabic labels when
studyId === 'rtl-exp-ar'.
Reviewed changes
Copilot reviewed 15 out of 79 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| src/components/interface/AppAside.tsx | Adds Arabic label mapping for the Study Browser sidebar when running the Arabic study. |
| public/rtl-exp-en/assets/trial-numerical.html | English numeric-input trial template with timed stimulus hiding and reactive answer posting. |
| public/rtl-exp-en/assets/trial-dropdown.html | English dropdown trial template with timed stimulus hiding and reactive answer posting. |
| public/rtl-exp-en/assets/outro.md | English completion/thank-you page content. |
| public/rtl-exp-en/assets/line/intro-line.md | English line-chart block instruction page content. |
| public/rtl-exp-en/assets/line/intro-line-ex.svg | English line-chart example illustration asset. |
| public/rtl-exp-en/assets/break.md | English inter-block break page content. |
| public/rtl-exp-en/assets/bar/intro-bar.md | English bar-chart block instruction page content. |
| public/rtl-exp-en/assets/bar/intro-bar-ex.svg | English bar-chart example illustration asset. |
| public/rtl-exp-en/assets/bar/img-trials/intro-radial.svg | English bar block: intro icon/illustration asset. |
| public/rtl-exp-en/assets/bar/img-trials/intro-line.svg | English bar block: intro icon/illustration asset. |
| public/rtl-exp-en/assets/bar/img-trials/intro-bar.svg | English bar block: intro icon/illustration asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-8-u.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-7-u.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-7-sts.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-7-sst.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-6-u.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-5-u-2.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-5-u-1.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-4-sts.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-4-sst.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-3-u.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-2-sts.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-2-sst.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-en/assets/bar/img-trials/bar-1-u.svg | English bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/trial-numerical.html | Arabic numeric-input trial template with RTL styling and reactive answer posting. |
| public/rtl-exp-ar/assets/trial-dropdown.html | Arabic dropdown trial template with RTL styling and reactive answer posting. |
| public/rtl-exp-ar/assets/outro.md | Arabic completion/thank-you page content (RTL wrapper). |
| public/rtl-exp-ar/assets/line/intro-line.md | Arabic line-chart block instruction page content (RTL wrapper). |
| public/rtl-exp-ar/assets/break.md | Arabic inter-block break page content (RTL wrapper). |
| public/rtl-exp-ar/assets/bar/intro-bar.md | Arabic bar-chart block instruction page content (RTL wrapper). |
| public/rtl-exp-ar/assets/bar/img-trials/bar-7-u.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-7-sts.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-7-sst.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-6-u.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-5-u-2.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-5-u-1.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-4-sts.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-4-sst.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-3-u.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-2-sts.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-2-sst.svg | Arabic bar block: trial stimulus SVG asset. |
| public/rtl-exp-ar/assets/bar/img-trials/bar-1-u.svg | Arabic bar block: trial stimulus SVG asset. |
Comments suppressed due to low confidence (1)
src/components/interface/AppAside.tsx:140
- The UI strings are translated for Arabic, but the
aria-labelfor this settings icon remains English ("Edit Study Modes"). For accessibility/screen readers, please localizearia-label(and any other ARIA text) using the sameLmapping whenisArabicis true.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+124
to
+126
| let responseId = 'trial-ans'; | ||
| let currentValue = null; | ||
|
|
There was a problem hiding this comment.
currentValue is declared but never read. Please remove it to avoid dead code and keep the trial template minimal.
Comment on lines
+129
to
+131
| let responseId = 'trial-ans'; | ||
| let currentValue = null; | ||
|
|
There was a problem hiding this comment.
currentValue is declared but never read. Please remove it to avoid dead code and keep the trial template minimal.
Comment on lines
+146
to
+152
| function postCurrentAnswer() { | ||
| const val = document.getElementById('dropdown-select').value; | ||
| if (val === '') return; // don't post placeholder selection | ||
| const answers = {}; | ||
| answers[responseId] = val; | ||
| Revisit.postAnswers(answers); | ||
| } |
There was a problem hiding this comment.
When the user re-selects the placeholder (empty value), postCurrentAnswer returns early and the previously posted answer remains set. Consider posting null/empty for responseId on empty selection so answers can be cleared reliably.
Comment on lines
+151
to
+157
| function postCurrentAnswer() { | ||
| const val = document.getElementById('dropdown-select').value; | ||
| if (val === '') return; | ||
| const answers = {}; | ||
| answers[responseId] = val; | ||
| Revisit.postAnswers(answers); | ||
| } |
There was a problem hiding this comment.
When the user re-selects the placeholder (empty value), postCurrentAnswer returns early and the previously posted answer remains set. Consider posting null/empty for responseId on empty selection so answers can be cleared reliably.
|
A preview of 2e12981 is uploaded and can be seen here: ✨ https://revisit.dev/study/PR1 ✨ Changes may take a few minutes to propagate. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Replicating the demo version but with one block of questions for barcharts and another block for line charts. For each new user opening the study, the block of questions coming first, before the break, is random.
Concretely the flow that a participant sees would be:
Consent form --> then either the block for Barcharts or block for Linechart, --> Last page
Each block will start with an introduction page w/ the instructions --> then the trial questions.
There should be a break page between Block1 and Block2