sforkowany z mirror/soapbox
Remove beta page
Justin
rodzic
b4c81f2b94
commit
c879f82b48
|
|
@ -1,19 +0,0 @@
|
|||
import { staticClient } from '../api';
|
||||
|
||||
export const FETCH_BETA_PAGE_REQUEST = 'FETCH_BETA_PAGE_REQUEST';
|
||||
export const FETCH_BETA_PAGE_SUCCESS = 'FETCH_BETA_PAGE_SUCCESS';
|
||||
export const FETCH_BETA_PAGE_FAIL = 'FETCH_BETA_PAGE_FAIL';
|
||||
|
||||
export function fetchBetaPage(slug = 'index', locale) {
|
||||
return (dispatch, getState) => {
|
||||
dispatch({ type: FETCH_BETA_PAGE_REQUEST, slug, locale });
|
||||
const filename = `${slug}${locale ? `.${locale}` : ''}.html`;
|
||||
return staticClient.get(`/instance/beta/${filename}`).then(({ data: html }) => {
|
||||
dispatch({ type: FETCH_BETA_PAGE_SUCCESS, slug, locale, html });
|
||||
return html;
|
||||
}).catch(error => {
|
||||
dispatch({ type: FETCH_BETA_PAGE_FAIL, slug, locale, error });
|
||||
throw error;
|
||||
});
|
||||
};
|
||||
}
|
||||
|
|
@ -183,7 +183,6 @@ const SoapboxMount = () => {
|
|||
|
||||
{!me && <Route exact path='/' component={PublicLayout} />}
|
||||
<Route exact path='/about/:slug?' component={PublicLayout} />
|
||||
<Route exact path='/beta/:slug?' component={PublicLayout} />
|
||||
<Route exact path='/mobile/:slug?' component={PublicLayout} />
|
||||
<Route path='/login' component={AuthLayout} />
|
||||
{(features.accountCreation && instance.registrations) && (
|
||||
|
|
|
|||
|
|
@ -1,108 +0,0 @@
|
|||
import React from 'react';
|
||||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||
import { injectIntl, FormattedMessage } from 'react-intl';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
import { fetchBetaPage } from 'soapbox/actions/beta';
|
||||
import { getSettings } from 'soapbox/actions/settings';
|
||||
import { getSoapboxConfig } from 'soapbox/actions/soapbox';
|
||||
|
||||
import { languages } from '../preferences';
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
locale: getSettings(state).get('locale'),
|
||||
betaPages: getSoapboxConfig(state).get('betaPages'),
|
||||
});
|
||||
|
||||
@connect(mapStateToProps)
|
||||
@injectIntl
|
||||
class BetaPage extends ImmutablePureComponent {
|
||||
|
||||
state = {
|
||||
pageHtml: '',
|
||||
locale: this.props.locale,
|
||||
}
|
||||
|
||||
loadPageHtml = () => {
|
||||
const { dispatch, match, betaPages } = this.props;
|
||||
const { locale } = this.state;
|
||||
const { slug } = match.params;
|
||||
const page = betaPages.get(slug || 'beta');
|
||||
const fetchLocale = page && locale !== page.get('default') && page.get('locales').includes(locale);
|
||||
dispatch(fetchBetaPage(slug, fetchLocale && locale)).then(html => {
|
||||
this.setState({ pageHtml: html });
|
||||
}).catch(error => {
|
||||
// TODO: Better error handling. 404 page?
|
||||
this.setState({ pageHtml: '<h1>Page not found</h1>' });
|
||||
});
|
||||
}
|
||||
|
||||
setLocale = (locale) => () => {
|
||||
this.setState({ locale });
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
this.loadPageHtml();
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps, prevState) {
|
||||
const { locale, match, betaPages } = this.props;
|
||||
const { locale: prevLocale, betaPages: prevBetaPages } = prevProps;
|
||||
const { locale: stateLocale } = this.state;
|
||||
const { locale: prevStateLocale } = prevState;
|
||||
|
||||
const { slug } = match.params;
|
||||
const { slug: prevSlug } = prevProps.match.params;
|
||||
|
||||
if (locale !== prevLocale) this.setState({ locale });
|
||||
|
||||
if (
|
||||
slug !== prevSlug ||
|
||||
stateLocale !== prevStateLocale ||
|
||||
(!prevBetaPages.get(slug || 'beta') && betaPages.get(slug || 'beta'))
|
||||
)
|
||||
this.loadPageHtml();
|
||||
}
|
||||
|
||||
render() {
|
||||
const { match, betaPages } = this.props;
|
||||
const { slug } = match.params;
|
||||
|
||||
const page = betaPages.get(slug || 'beta');
|
||||
const defaultLocale = page && page.get('default');
|
||||
const alsoAvailable = page && (
|
||||
<div className='rich-formatting also-available'>
|
||||
<FormattedMessage id='beta.also_available' defaultMessage='Available in:' />
|
||||
{' '}
|
||||
<ul>
|
||||
<li>
|
||||
<a href='#' onClick={this.setLocale(defaultLocale)}>
|
||||
{languages[defaultLocale] || defaultLocale}
|
||||
</a>
|
||||
</li>
|
||||
{
|
||||
page.get('locales').map(locale => (
|
||||
<li key={locale}>
|
||||
<a href='#' onClick={this.setLocale(locale)}>
|
||||
{languages[locale] || locale}
|
||||
</a>
|
||||
</li>
|
||||
))
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div
|
||||
dangerouslySetInnerHTML={{ __html: this.state.pageHtml }}
|
||||
/>
|
||||
{alsoAvailable}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default BetaPage;
|
||||
|
|
@ -13,7 +13,6 @@ import {
|
|||
import { isStandalone } from 'soapbox/utils/state';
|
||||
|
||||
import AboutPage from '../about';
|
||||
import BetaPage from '../beta';
|
||||
import LandingPage from '../landing_page';
|
||||
import MobilePage from '../mobile';
|
||||
|
||||
|
|
@ -47,7 +46,6 @@ class PublicLayout extends ImmutablePureComponent {
|
|||
<Switch>
|
||||
<Route exact path='/' component={LandingPage} />
|
||||
<Route exact path='/about/:slug?' component={AboutPage} />
|
||||
<Route exact path='/beta/:slug?' component={BetaPage} />
|
||||
<Route exact path='/mobile/:slug?' component={MobilePage} />
|
||||
</Switch>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -110,7 +110,6 @@ export const SoapboxConfigRecord = ImmutableRecord({
|
|||
limit: 1,
|
||||
}),
|
||||
aboutPages: ImmutableMap(),
|
||||
betaPages: ImmutableMap(),
|
||||
mobilePages: ImmutableMap(),
|
||||
authenticatedProfile: true,
|
||||
singleUserMode: false,
|
||||
|
|
|
|||
|
|
@ -234,158 +234,6 @@ $fluid-breakpoint: $maximum-width + 20px;
|
|||
}
|
||||
}
|
||||
|
||||
.beta-page {
|
||||
.app-cta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 40px auto;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.copy {
|
||||
flex: 2;
|
||||
background: white;
|
||||
border: 1px solid #eee;
|
||||
padding: 80px;
|
||||
border-radius: 10px;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
padding: 60px 20px 20px 20px;
|
||||
order: 1;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.icon {
|
||||
border-radius: 10px;
|
||||
transform: scale(1.25);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
padding: 40px;
|
||||
background: linear-gradient(to bottom, $color-4-light, $color-4);
|
||||
box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.1);
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
order: 0;
|
||||
transform: scale(0.75);
|
||||
margin-bottom: -60px;
|
||||
}
|
||||
|
||||
img {
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0 0 20px 0;
|
||||
font-size: 80px;
|
||||
line-height: 90px;
|
||||
font-weight: 600;
|
||||
background: -webkit-linear-gradient(135deg, $color-9, $color-4-light, $color-2-light);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
margin-bottom: 30px;
|
||||
text-align: center;
|
||||
font-size: 50px;
|
||||
line-height: 55px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.beta-header {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.hand-wave {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background: white;
|
||||
border-radius: 50%;
|
||||
margin-bottom: 20px;
|
||||
|
||||
@media screen and (max-width: $fluid-breakpoint) {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
img {
|
||||
animation: 1s ease-in wave;
|
||||
max-width: 140px;
|
||||
|
||||
@media screen and (max-width: $fluid-breakpoint) {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.message {
|
||||
margin: 40px 0;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
background: lighten($color-4-light, 30%);
|
||||
border-radius: 10px;
|
||||
|
||||
p {
|
||||
color: $color-4;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
span {
|
||||
font-style: italic;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.group {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@media screen and (max-width: $fluid-breakpoint) {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.logo {
|
||||
padding: 0 40px;
|
||||
border-right: 10px solid transparentize($color-3, 0.9);
|
||||
|
||||
@media screen and (max-width: $fluid-breakpoint) {
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
padding: 0 40px;
|
||||
font-weight: 600;
|
||||
font-size: 80px;
|
||||
font-style: italic;
|
||||
color: $color-4-dark;
|
||||
|
||||
@media screen and (max-width: $fluid-breakpoint) {
|
||||
padding: 0;
|
||||
font-weight: 600;
|
||||
font-size: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.faq {
|
||||
margin-bottom: 80px;
|
||||
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue