github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-09-16 02:52:31 -04:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #16358 from overleaf/rd-tear-down-welcome-page

Browse source 
[web] Tear down welcome-page-redesign split test

GitOrigin-RevId: 769aeae75eac6ac0b5880dca4ec1d36fbc39cea2
This commit is contained in:
Rebeka Dekany 2024-01-04 16:20:39 +01:00 committed by Copybot
parent ff2def024e
commit 34debffd20
10 changed files with 42 additions and 154 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
services/web/app/src/Features/Project/ProjectListController.js
View file

@ -325,22 +325,6 @@ async function projectListPage(req, res, next) {
)
}
}
let welcomePageRedesignAssignment = { variant: 'default' }
try {
welcomePageRedesignAssignment =
await SplitTestHandler.promises.getAssignment(
req,
res,
'welcome-page-redesign'
)
} catch (error) {
logger.error(
{ err: error },
'failed to get "welcome-page-redesign" split test assignment'
)
}
try {
// The assignment will be picked up via 'ol-splitTestVariants' in react.
await SplitTestHandler.promises.getAssignment(
@ -518,7 +502,6 @@ async function projectListPage(req, res, next) {
inrGeoBannerVariant,
inrGeoBannerSplitTestName,
projectDashboardReact: true, // used in navbar
welcomePageRedesignVariant: welcomePageRedesignAssignment.variant,
groupSsoSetupSuccess,
groupSubscriptionsPendingEnrollment:
groupSubscriptionsPendingEnrollment.map(subscription => ({

1
services/web/app/views/project/list-react.pug
View file

@ -33,7 +33,6 @@ block append meta
meta(name="ol-inrGeoBannerSplitTestName" data-type="string" content=inrGeoBannerSplitTestName)
meta(name="ol-showLATAMBanner" data-type="boolean" content=showLATAMBanner)
meta(name="ol-recommendedCurrency" data-type="string" content=recommendedCurrency)
meta(name="ol-welcomePageRedesignVariant" data-type="string" content=welcomePageRedesignVariant)
meta(name="ol-groupSubscriptionsPendingEnrollment" data-type="json" content=groupSubscriptionsPendingEnrollment)
meta(name="ol-hasIndividualRecurlySubscription" data-type="boolean" content=hasIndividualRecurlySubscription)
meta(name="ol-newNotificationStyle" data-type="boolean" content=newNotificationStyle)

3
services/web/frontend/extracted-translations.json
View file

@ -213,7 +213,6 @@
"coupons_not_included": "",
"create": "",
"create_a_new_project": "",
"create_first_project": "",
"create_new_subscription": "",
"create_new_tag": "",
"create_project_in_github": "",
@ -618,7 +617,6 @@
"last_updated_date_by_x": "",
"last_used": "",
"latam_discount_offer": "",
"latex_help_guide": "",
"latex_places_figures_according_to_a_special_algorithm": "",
"latex_places_tables_according_to_a_special_algorithm": "",
"layout": "",
@ -755,7 +753,6 @@
"new_subscription_will_be_billed_immediately": "",
"new_tag": "",
"new_tag_name": "",
"new_to_latex_look_at": "",
"newsletter": "",
"newsletter_onboarding_accept": "",
"next": "",

11
services/web/frontend/js/features/project-list/components/project-list-root.tsx
View file

@ -23,8 +23,6 @@ import ProjectListTitle from './title/project-list-title'
import Sidebar from './sidebar/sidebar'
import LoadMore from './load-more'
import { useEffect } from 'react'
import getMeta from '../../../utils/meta'
import WelcomeMessageNew from './welcome-message-new'
import withErrorBoundary from '../../../infrastructure/error-boundary'
import { GenericErrorBoundaryFallback } from '../../../shared/components/generic-error-boundary-fallback'
@ -63,9 +61,6 @@ function ProjectListPageContent() {
} = useProjectListContext()
const selectedTag = tags.find(tag => tag._id === selectedTagId)
const welcomePageRedesignVariant = getMeta(
'ol-welcomePageRedesignVariant'
) as 'enabled' | 'default'
useEffect(() => {
eventTracking.sendMB('loads_v2_dash', {})
@ -176,11 +171,7 @@ function ProjectListPageContent() {
<UserNotifications />
</Col>
</Row>
{welcomePageRedesignVariant === 'enabled' ? (
<WelcomeMessageNew />
) : (
<WelcomeMessage />
)}
<WelcomeMessage />
</Col>
</Row>
</div>

57
services/web/frontend/js/features/project-list/components/welcome-message-new.tsx
View file

@ -1,57 +0,0 @@
import { useState, useCallback } from 'react'
import { useTranslation } from 'react-i18next'
import { sendMB } from '../../../infrastructure/event-tracking'
import NewProjectButtonModal from './new-project-button/new-project-button-modal'
import type { NewProjectButtonModalVariant } from './new-project-button/new-project-button-modal'
import type { Nullable } from '../../../../../types/utils'
import WelcomeMessageLink from './welcome-message-new/welcome-message-link'
import WelcomeMessageCreateNewProjectDropdown from './welcome-message-new/welcome-message-create-new-project-dropdown'
export default function WelcomeMessageNew() {
const { t } = useTranslation()
const [activeModal, setActiveModal] =
useState<Nullable<NewProjectButtonModalVariant>>(null)
const handleTemplatesClick = useCallback(() => {
sendMB('welcome-page-templates-click', {
'welcome-page-redesign': 'enabled',
})
}, [])
const handleLatexHelpClick = useCallback(() => {
sendMB('welcome-page-latex-help-click', {
'welcome-page-redesign': 'enabled',
})
}, [])
return (
<>
<div className="card welcome-new-wrapper">
<div className="welcome text-centered">
<h2 className="welcome-title">{t('welcome_to_sl')}</h2>
<div className="welcome-message-cards-wrapper">
<WelcomeMessageCreateNewProjectDropdown
setActiveModal={modal => setActiveModal(modal)}
/>
<WelcomeMessageLink
imgSrc="/img/welcome-page/learn-latex.svg"
title="Learn LaTeX with a tutorial"
href="/learn/latex/Learn_LaTeX_in_30_minutes"
onClick={handleLatexHelpClick}
/>
<WelcomeMessageLink
imgSrc="/img/welcome-page/browse-templates.svg"
title="Browse templates"
href="/templates"
onClick={handleTemplatesClick}
/>
</div>
</div>
</div>
<NewProjectButtonModal
modal={activeModal}
onHide={() => setActiveModal(null)}
/>
</>
)
}

3
services/web/frontend/js/features/project-list/components/welcome-message-new/welcome-message-create-new-project-dropdown.tsx
View file

@ -20,7 +20,6 @@ function WelcomeMessageCreateNewProjectDropdown({
const handleClick = useCallback(() => {
sendMB('welcome-page-create-first-project-click', {
'welcome-page-redesign': 'enabled',
dropdownMenu: 'main-button',
dropdownOpen: showDropdown,
})
@ -55,7 +54,6 @@ function WelcomeMessageCreateNewProjectDropdown({
setShowDropdown(false)
sendMB('welcome-page-create-first-project-click', {
'welcome-page-redesign': 'enabled',
dropdownOpen: true,
dropdownMenu: dropdownMenuEvent,
})
@ -75,7 +73,6 @@ function WelcomeMessageCreateNewProjectDropdown({
setShowDropdown(false)
sendMB('welcome-page-create-first-project-click', {
'welcome-page-redesign': 'enabled',
dropdownMenu: 'institution-template',
dropdownOpen: true,
institutionTemplateName,

75
services/web/frontend/js/features/project-list/components/welcome-message.tsx
View file

@ -1,51 +1,42 @@
import { useCallback } from 'react'
import { Col, Row } from 'react-bootstrap'
import { useState } from 'react'
import { useTranslation } from 'react-i18next'
import { sendMB } from '../../../infrastructure/event-tracking'
import NewProjectButton from './new-project-button'
import NewProjectButtonModal from './new-project-button/new-project-button-modal'
import type { NewProjectButtonModalVariant } from './new-project-button/new-project-button-modal'
import type { Nullable } from '../../../../../types/utils'
import WelcomeMessageLink from './welcome-message-new/welcome-message-link'
import WelcomeMessageCreateNewProjectDropdown from './welcome-message-new/welcome-message-create-new-project-dropdown'
export default function WelcomeMessage() {
const { t } = useTranslation()
const handleTemplatesClick = useCallback(() => {
sendMB('welcome-page-templates-click', {
'welcome-page-redesign': 'default',
})
}, [])
const handleLatexHelpClick = useCallback(() => {
sendMB('welcome-page-latex-help-click', {
'welcome-page-redesign': 'default',
})
}, [])
const [activeModal, setActiveModal] =
useState<Nullable<NewProjectButtonModalVariant>>(null)
return (
<div className="card card-thin">
<div className="welcome text-centered">
<h2>{t('welcome_to_sl')}</h2>
<p>
{t('new_to_latex_look_at')}&nbsp;
<a href="/templates" onClick={handleTemplatesClick}>
{t('templates').toLowerCase()}
</a>
&nbsp;{t('or')}&nbsp;
<a href="/learn" onClick={handleLatexHelpClick}>
{t('latex_help_guide')}
</a>
</p>
<Row>
<Col md={4} mdOffset={4}>
<div className="dropdown minimal-create-proj-dropdown">
<NewProjectButton
id="new-project-button-welcome"
menuClassName="minimal-create-proj-dropdown-menu"
buttonText={t('create_first_project')}
trackingKey="welcome-page-create-first-project-click"
/>
</div>
</Col>
</Row>
<>
<div className="card welcome-new-wrapper">
<div className="welcome text-centered">
<h2 className="welcome-title">{t('welcome_to_sl')}</h2>
<div className="welcome-message-cards-wrapper">
<WelcomeMessageCreateNewProjectDropdown
setActiveModal={modal => setActiveModal(modal)}
/>
<WelcomeMessageLink
imgSrc="/img/welcome-page/learn-latex.svg"
title="Learn LaTeX with a tutorial"
href="/learn/latex/Learn_LaTeX_in_30_minutes"
/>
<WelcomeMessageLink
imgSrc="/img/welcome-page/browse-templates.svg"
title="Browse templates"
href="/templates"
/>
</div>
</div>
</div>
</div>
<NewProjectButtonModal
modal={activeModal}
onHide={() => setActiveModal(null)}
/>
</>
)
}

10
services/web/frontend/stylesheets/app/project-list.less
View file

@ -565,13 +565,3 @@ i.tablesort {
font-weight: 700;
}
}
.minimal-create-proj-dropdown {
text-align: center;
&-menu {
width: 200px;
left: 50%;
margin-left: -100px;
}
}

3
services/web/locales/en.json
View file

@ -330,7 +330,6 @@
"create_a_new_password_for_your_account": "Create a new password for your account",
"create_a_new_project": "Create a new project",
"create_first_admin_account": "Create the first Admin account",
"create_first_project": "Create First Project",
"create_new_account": "Create new account",
"create_new_subscription": "Create New Subscription",
"create_new_tag": "Create new tag",
@ -946,7 +945,6 @@
"latex_examples_page_summary": "Examples of powerful LaTeX packages and techniques in use — a great way to learn LaTeX by example. Search or browse below.",
"latex_examples_page_title": "Examples - Equations, Formatting, TikZ, Packages and More",
"latex_guides": "LaTeX guides",
"latex_help_guide": "LaTeX help guide",
"latex_in_thirty_minutes": "LaTeX in 30 minutes",
"latex_places_figures_according_to_a_special_algorithm": "LaTeX places figures according to a special algorithm. You can use something called ‘placement parameters’ to influence the positioning of the figure. <0>Find out how</>",
"latex_places_tables_according_to_a_special_algorithm": "LaTeX places tables according to a special algorithm. You can use “placement parameters” to influence the position of the table. <0>This article</0> explains how to do this.",
@ -1144,7 +1142,6 @@
"new_subscription_will_be_billed_immediately": "Your new subscription will be billed immediately to your current payment method.",
"new_tag": "New Tag",
"new_tag_name": "New tag name",
"new_to_latex_look_at": "New to LaTeX? Start by having a look at our",
"newsletter": "Newsletter",
"newsletter-accept": "I’d like emails about product offers and company news and events.",
"newsletter_info_note": "Please note: you will still receive important emails, such as project invites and security notifications (password resets, account linking, etc).",

16
services/web/test/frontend/features/project-list/components/welcome-message-new.test.tsx → services/web/test/frontend/features/project-list/components/welcome-message.test.tsx
View file

@ -1,14 +1,14 @@
import { fireEvent, render, screen } from '@testing-library/react'
import WelcomeMessageNew from '../../../../../frontend/js/features/project-list/components/welcome-message-new'
import WelcomeMessage from '../../../../../frontend/js/features/project-list/components/welcome-message'
import { expect } from 'chai'
describe('<WelcomeMessageNew />', function () {
describe('<WelcomeMessage />', function () {
afterEach(function () {
window.metaAttributesCache = new Map()
})
it('renders welcome page correctly', function () {
render(<WelcomeMessageNew />)
render(<WelcomeMessage />)
screen.getByText('Welcome to Overleaf')
screen.getByText('Create a new project')
@ -17,7 +17,7 @@ describe('<WelcomeMessageNew />', function () {
})
it('shows correct dropdown when clicking create a new project', function () {
render(<WelcomeMessageNew />)
render(<WelcomeMessage />)
const button = screen.getByRole('button', {
name: 'Create a new project',
@ -39,7 +39,7 @@ describe('<WelcomeMessageNew />', function () {
},
])
render(<WelcomeMessageNew />)
render(<WelcomeMessage />)
const button = screen.getByRole('button', {
name: 'Create a new project',
@ -66,7 +66,7 @@ describe('<WelcomeMessageNew />', function () {
})
it('shows correct dropdown when clicking create a new project with a portal template', function () {
render(<WelcomeMessageNew />)
render(<WelcomeMessage />)
const button = screen.getByRole('button', {
name: 'Create a new project',
@ -81,7 +81,7 @@ describe('<WelcomeMessageNew />', function () {
})
it('shows correct link for latex tutorial menu', function () {
render(<WelcomeMessageNew />)
render(<WelcomeMessage />)
const link = screen.getByRole('link', {
name: 'Learn LaTeX with a tutorial',
@ -93,7 +93,7 @@ describe('<WelcomeMessageNew />', function () {
})
it('shows correct link for browse templates menu', function () {
render(<WelcomeMessageNew />)
render(<WelcomeMessage />)
const link = screen.getByRole('link', {
name: 'Browse templates',