Merge pull request #18256 from overleaf/rd-a11y-form

[web] Create accessibility survey link on the project dashboard

GitOrigin-RevId: 49503da67347c9e0e15a10f041252f25f0effc15
This commit is contained in:
Rebeka Dekany 2024-05-14 17:47:39 +02:00 committed by Copybot
parent 5c44fb8e9d
commit 3ef06d57c6
7 changed files with 89 additions and 27 deletions

View file

@ -510,6 +510,7 @@
"headers": "",
"help": "",
"help_improve_overleaf_fill_out_this_survey": "",
"help_improve_screen_reader_fill_out_this_survey": "",
"hide_configuration": "",
"hide_deleted_user": "",
"hide_document_preamble": "",
@ -1290,6 +1291,7 @@
"tag_name_is_already_used": "",
"tags": "",
"take_short_survey": "",
"take_survey": "",
"tc_everyone": "",
"tc_guests": "",
"tc_switch_everyone_tip": "",

View file

@ -0,0 +1,47 @@
import { memo, useEffect, useState } from 'react'
import Notification from './notification'
import customLocalStorage from '@/infrastructure/local-storage'
import { useTranslation } from 'react-i18next'
function AccessibilitySurveyBanner() {
const { t } = useTranslation()
const [show, setShow] = useState(false)
useEffect(() => {
const isDismissed = customLocalStorage.getItem(
'has_dismissed_accessibility_survey_banner'
)
if (!isDismissed) setShow(true)
}, [])
const handleClose = () => {
customLocalStorage.setItem(
'has_dismissed_accessibility_survey_banner',
'true'
)
setShow(false)
}
if (!show) return null
return (
<Notification
className="sr-only"
bsStyle="info"
onDismiss={handleClose}
body={<p>{t('help_improve_screen_reader_fill_out_this_survey')}</p>}
action={
<a
className="btn btn-secondary btn-sm pull-right btn-info"
href="https://docs.google.com/forms/d/e/1FAIpQLSdxKP_biRXvrkmJzlBjMwI_qPSuv4NbBvYUzSOc3OOTIOTmnQ/viewform"
target="_blank"
rel="noreferrer"
>
{t('take_survey')}
</a>
}
/>
)
}
export default memo(AccessibilitySurveyBanner)

View file

@ -12,6 +12,7 @@ import customLocalStorage from '../../../../infrastructure/local-storage'
import { sendMB } from '../../../../infrastructure/event-tracking'
import classNames from 'classnames'
import GeoBanners from './geo-banners'
import AccessibilitySurveyBanner from './accessibility-survey-banner'
type Subscription = {
groupId: string
@ -85,6 +86,8 @@ function UserNotifications() {
<GeoBanners />
{!showWritefull && !dismissedWritefull && <GroupsAndEnterpriseBanner />}
<AccessibilitySurveyBanner />
<WritefullPremiumPromoBanner
show={showWritefull}
setShow={setShowWritefull}

View file

@ -31,32 +31,34 @@ function WritefullPremiumPromoBanner({
}
return (
<Notification
bsStyle="info"
newNotificationStyle
onDismiss={handleClose}
body={
<>
Enjoying Writefull? Get <strong>10% off Writefull Premium</strong>,
giving you access to TeXGPTAI assistance to generate LaTeX code. Use{' '}
<strong>OVERLEAF10</strong> at the checkout.
</>
}
action={
<a
className="btn btn-secondary btn-sm"
href="https://my.writefull.com/overleaf-invite?code=OVERLEAF10&redirect=plans"
target="_blank"
rel="noreferrer"
onClick={() => {
sendMB('promo-click', eventSegmentation)
}}
>
<WritefullLogo width="16" height="16" />{' '}
<span>Get Writefull Premium</span>
</a>
}
/>
<div data-testid="writefull-premium-promo-banner">
<Notification
bsStyle="info"
newNotificationStyle
onDismiss={handleClose}
body={
<>
Enjoying Writefull? Get <strong>10% off Writefull Premium</strong>,
giving you access to TeXGPTAI assistance to generate LaTeX code.
Use <strong>OVERLEAF10</strong> at the checkout.
</>
}
action={
<a
className="btn btn-secondary btn-sm"
href="https://my.writefull.com/overleaf-invite?code=OVERLEAF10&redirect=plans"
target="_blank"
rel="noreferrer"
onClick={() => {
sendMB('promo-click', eventSegmentation)
}}
>
<WritefullLogo width="16" height="16" />{' '}
<span>Get Writefull Premium</span>
</a>
}
/>
</div>
)
}

View file

@ -78,6 +78,7 @@ function ProjectListPageContent() {
) : (
<>
<SystemMessages />
<div className="project-list-wrapper clearfix container mx-0 px-0">
{totalProjectsCount > 0 ? (
<>

View file

@ -756,6 +756,7 @@
"help": "Help",
"help_articles_matching": "Help articles matching your subject",
"help_improve_overleaf_fill_out_this_survey": "If you would like to help us improve Overleaf, please take a moment to fill out <0>this survey</0>.",
"help_improve_screen_reader_fill_out_this_survey": "Help us improve your experience using a screen reader with __appName__ by filling out this quick survey.",
"hide_configuration": "Hide configuration",
"hide_deleted_user": "Hide deleted users",
"hide_document_preamble": "Hide document preamble",
@ -1833,6 +1834,7 @@
"tags": "Tags",
"take_me_home": "Take me home!",
"take_short_survey": "Take a short survey",
"take_survey": "Take survey",
"tc_everyone": "Everyone",
"tc_guests": "Guests",
"tc_switch_everyone_tip": "Toggle track-changes for everyone",

View file

@ -998,7 +998,12 @@ describe('<UserNotifications />', function () {
it('dismisses the banner when the close button is clicked', function () {
renderWithinProjectListProvider(UserNotifications)
screen.getByRole('link', { name: /Writefull/ })
const closeButton = screen.getByRole('button', { name: 'Close' })
const WritefullPromoBanner = screen.getByTestId(
'writefull-premium-promo-banner'
)
const closeButton = within(WritefullPromoBanner).getByRole('button', {
name: 'Close',
})
fireEvent.click(closeButton)
expect(screen.queryByRole('link', { name: /Writefull/ })).to.be.null
expect(localStorage.getItem('has_dismissed_writefull_promo_banner')).to