mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-21 20:47:08 -05:00
Merge pull request #16358 from overleaf/rd-tear-down-welcome-page
[web] Tear down welcome-page-redesign split test GitOrigin-RevId: 769aeae75eac6ac0b5880dca4ec1d36fbc39cea2
This commit is contained in:
parent
ff2def024e
commit
34debffd20
10 changed files with 42 additions and 154 deletions
|
@ -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 => ({
|
||||
|
|
|
@ -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)
|
||||
|
|
|
@ -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": "",
|
||||
|
|
|
@ -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 />
|
||||
)}
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
|
|
|
@ -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)}
|
||||
/>
|
||||
</>
|
||||
)
|
||||
}
|
|
@ -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,
|
||||
|
|
|
@ -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="card welcome-new-wrapper">
|
||||
<div className="welcome text-centered">
|
||||
<h2>{t('welcome_to_sl')}</h2>
|
||||
<p>
|
||||
{t('new_to_latex_look_at')}
|
||||
<a href="/templates" onClick={handleTemplatesClick}>
|
||||
{t('templates').toLowerCase()}
|
||||
</a>
|
||||
{t('or')}
|
||||
<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"
|
||||
<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>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
</div>
|
||||
<NewProjectButtonModal
|
||||
modal={activeModal}
|
||||
onHide={() => setActiveModal(null)}
|
||||
/>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -565,13 +565,3 @@ i.tablesort {
|
|||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.minimal-create-proj-dropdown {
|
||||
text-align: center;
|
||||
|
||||
&-menu {
|
||||
width: 200px;
|
||||
left: 50%;
|
||||
margin-left: -100px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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).",
|
||||
|
|
|
@ -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',
|
Loading…
Reference in a new issue