Change landing page
This commit is contained in:
parent
189d91170e
commit
f0baefb66f
|
@ -42,9 +42,7 @@ export const fetchInstance = createAsyncThunk<void, void, { state: RootState }>(
|
|||
async(_arg, { dispatch, getState, rejectWithValue }) => {
|
||||
try {
|
||||
const { data: instance } = await api(getState).get('/api/v1/instance');
|
||||
if (needsNodeinfo(instance)) {
|
||||
dispatch(fetchNodeinfo());
|
||||
}
|
||||
dispatch(fetchNodeinfo());
|
||||
return instance;
|
||||
} catch (e) {
|
||||
return rejectWithValue(e);
|
||||
|
|
|
@ -1,12 +1,16 @@
|
|||
import Immutable from 'immutable';
|
||||
import * as React from 'react';
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
|
||||
import { fetchAccount } from 'soapbox/actions/accounts';
|
||||
import { prepareRequest } from 'soapbox/actions/consumer-auth';
|
||||
import { Button, Card, CardBody, Stack, Text } from 'soapbox/components/ui';
|
||||
import Account from 'soapbox/components/account';
|
||||
import VerificationBadge from 'soapbox/components/verification_badge';
|
||||
import RegistrationForm from 'soapbox/features/auth_login/components/registration_form';
|
||||
import { useAppDispatch, useAppSelector, useFeatures, useSoapboxConfig } from 'soapbox/hooks';
|
||||
import { capitalize } from 'soapbox/utils/strings';
|
||||
import { List as ImmutableList } from 'immutable';
|
||||
|
||||
const LandingPage = () => {
|
||||
const dispatch = useAppDispatch();
|
||||
|
@ -15,8 +19,28 @@ const LandingPage = () => {
|
|||
const pepeEnabled = soapboxConfig.getIn(['extensions', 'pepe', 'enabled']) === true;
|
||||
|
||||
const instance = useAppSelector((state) => state.instance);
|
||||
const accounts = useAppSelector((state) => state.accounts);
|
||||
const pepeOpen = useAppSelector(state => state.verification.instance.get('registrations') === true);
|
||||
|
||||
React.useEffect(() => {
|
||||
const staff = (instance.pleroma.getIn(["metadata", "staff_accounts"]) as ImmutableList<string>).map((s) => s.split('/').pop());
|
||||
staff.forEach((s) => dispatch(fetchAccount(s)));
|
||||
}, [instance, dispatch]);
|
||||
|
||||
const staffAccounts = React.useMemo(() => {
|
||||
if(accounts == null) return [];
|
||||
const a = Object.values(accounts?.toJSON()).filter((a) => a.admin || a.moderator);
|
||||
console.log(a);
|
||||
return a;
|
||||
}, [accounts]);
|
||||
|
||||
const userCount = instance.stats.get('user_count');
|
||||
|
||||
const homeDescription = React.useMemo(() => {
|
||||
const format = new Intl.NumberFormat().format(userCount);
|
||||
return soapboxConfig.homeDescription.replace('[users]', format);
|
||||
}, [userCount, soapboxConfig]);
|
||||
|
||||
/** Registrations are closed */
|
||||
const renderClosed = () => {
|
||||
return (
|
||||
|
@ -107,14 +131,30 @@ const LandingPage = () => {
|
|||
<div className='grid grid-cols-1 lg:grid-cols-12 gap-8 py-12'>
|
||||
<div className='px-4 sm:px-6 sm:text-center md:max-w-2xl md:mx-auto lg:col-span-6 lg:text-left lg:flex'>
|
||||
<div className='w-full'>
|
||||
<Stack space={3}>
|
||||
<Stack space={5}>
|
||||
<h1 className='text-5xl font-extrabold text-transparent text-ellipsis overflow-hidden bg-clip-text bg-gradient-to-br from-accent-500 via-primary-500 to-gradient-end sm:mt-5 sm:leading-none lg:mt-6 lg:text-6xl xl:text-7xl'>
|
||||
{instance.title}
|
||||
</h1>
|
||||
|
||||
<Text size='lg'>
|
||||
{instance.description}
|
||||
{
|
||||
homeDescription ? <span dangerouslySetInnerHTML={{ __html: homeDescription }} /> : instance.description
|
||||
}
|
||||
</Text>
|
||||
<div>
|
||||
<div className='flex justify-between'>
|
||||
<h2 className="text-xl text-gray-800">
|
||||
<FormattedMessage id='landingPage.admins' defaultMessage='Moderators' />
|
||||
</h2>
|
||||
</div>
|
||||
<a href={`mailto:${instance.email}`}>
|
||||
{instance.email}
|
||||
</a>
|
||||
<Stack space={3} className="mt-4">
|
||||
{
|
||||
staffAccounts.map((s) => <Account key={s.id} hideActions={true} account={s} />)
|
||||
}
|
||||
</Stack>
|
||||
</div>
|
||||
</Stack>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -76,17 +76,6 @@ const Header = () => {
|
|||
<nav className='max-w-7xl mx-auto px-4 sm:px-6 lg:px-8' aria-label='Header'>
|
||||
<div className='w-full py-6 flex items-center justify-between border-b border-indigo-500 lg:border-none'>
|
||||
<div className='flex items-center sm:justify-center relative w-36'>
|
||||
<div className='hidden md:block absolute z-0 -top-24 -left-6'>
|
||||
<Sonar />
|
||||
</div>
|
||||
|
||||
<IconButton
|
||||
title='Open Menu'
|
||||
src={require('@tabler/icons/menu-2.svg')}
|
||||
onClick={open}
|
||||
className='md:hidden mr-4 bg-transparent text-gray-700 dark:text-gray-600 hover:text-gray-600'
|
||||
/>
|
||||
|
||||
<Link to='/' className='z-10'>
|
||||
<SiteLogo alt='Logo' className='h-6 w-auto cursor-pointer' />
|
||||
<span className='hidden'>{intl.formatMessage(messages.home)}</span>
|
||||
|
|
|
@ -51,6 +51,7 @@ const messages = defineMessages({
|
|||
singleUserModeHint: { id: 'soapbox_config.single_user_mode_hint', defaultMessage: 'Front page will redirect to a given user profile.' },
|
||||
singleUserModeProfileLabel: { id: 'soapbox_config.single_user_mode_profile_label', defaultMessage: 'Main user handle' },
|
||||
singleUserModeProfileHint: { id: 'soapbox_config.single_user_mode_profile_hint', defaultMessage: '@handle' },
|
||||
homeDescription: { id: 'soapbox_config.home_description', defaultMessage: 'Instance\'s description shown in Home page. Supports HTML. Use [users] to insert the number of current users on the instance.' }
|
||||
});
|
||||
|
||||
type ValueGetter<T = Element> = (e: React.ChangeEvent<T>) => any;
|
||||
|
@ -292,6 +293,19 @@ const SoapboxConfig: React.FC = () => {
|
|||
)}
|
||||
</List>
|
||||
|
||||
<CardHeader>
|
||||
<CardTitle title={<FormattedMessage id='soapbox_config.headings.home' defaultMessage='Home' />} />
|
||||
</CardHeader>
|
||||
|
||||
<FormGroup labelText={intl.formatMessage(messages.homeDescription)}>
|
||||
<Textarea
|
||||
placeholder={intl.formatMessage(messages.homeDescription)}
|
||||
isCodeEditor
|
||||
value={soapbox.homeDescription}
|
||||
onChange={handleChange(['homeDescription'], (e) => e.target.value)}
|
||||
/>
|
||||
</FormGroup>
|
||||
|
||||
<CardHeader>
|
||||
<CardTitle title={<FormattedMessage id='soapbox_config.headings.navigation' defaultMessage='Navigation' />} />
|
||||
</CardHeader>
|
||||
|
|
|
@ -1052,11 +1052,14 @@
|
|||
"soapbox_config.raw_json_label": "Avancé: Editer le fichier JSON",
|
||||
"soapbox_config.save": "Enregistrer",
|
||||
"soapbox_config.saved": "Configuration sauvegardée !",
|
||||
"soapbox_config.headings.home": "Page d'accueil",
|
||||
"soapbox_config.home_description": "Description de l'instance affichée sur la page d'accueil. Supporte le HTML. Vous pouvez utiliser [users] pour insérer le nombre d'utilisateurs courant dans la description.",
|
||||
"soapbox_config.single_user_mode_hint": "L'index affichera le profil d'un utilisateur donné.",
|
||||
"soapbox_config.single_user_mode_label": "Mode utilisateur unique",
|
||||
"soapbox_config.single_user_mode_profile_hint": "@handle",
|
||||
"soapbox_config.single_user_mode_profile_label": "Main user handle",
|
||||
"soapbox_config.verified_can_edit_name_label": "Autoriser les utilisateurs vérifiés à modifier leur propre nom d'utilisateur",
|
||||
"landingPage.admins": "Modérateurs",
|
||||
"sponsored.info.message": "{siteTitle} displays ads to help fund our service.",
|
||||
"sponsored.info.title": "Why am I seeing this ad?",
|
||||
"sponsored.subtitle": "Sponsored post",
|
||||
|
|
|
@ -50,6 +50,7 @@ export const InstanceRecord = ImmutableRecord({
|
|||
enabled: true,
|
||||
exclusions: false,
|
||||
}),
|
||||
staff_accounts: [],
|
||||
}),
|
||||
stats: ImmutableMap(),
|
||||
}),
|
||||
|
|
|
@ -123,6 +123,7 @@ export const SoapboxConfigRecord = ImmutableRecord({
|
|||
singleUserModeProfile: '',
|
||||
linkFooterMessage: '',
|
||||
links: ImmutableMap<string, string>(),
|
||||
homeDescription: '',
|
||||
}, 'SoapboxConfig');
|
||||
|
||||
type SoapboxConfigMap = ImmutableMap<string, any>;
|
||||
|
|
|
@ -17,15 +17,17 @@ import type { AnyAction } from 'redux';
|
|||
const initialState = normalizeInstance(ImmutableMap());
|
||||
|
||||
const nodeinfoToInstance = (nodeinfo: ImmutableMap<string, any>) => {
|
||||
const data = nodeinfo.get("data");
|
||||
// Match Pleroma's develop branch
|
||||
return normalizeInstance(ImmutableMap({
|
||||
pleroma: ImmutableMap({
|
||||
metadata: ImmutableMap({
|
||||
account_activation_required: nodeinfo.getIn(['metadata', 'accountActivationRequired']),
|
||||
features: nodeinfo.getIn(['metadata', 'features']),
|
||||
federation: nodeinfo.getIn(['metadata', 'federation']),
|
||||
account_activation_required: data.getIn(['metadata', 'accountActivationRequired']),
|
||||
features: data.getIn(['metadata', 'features']),
|
||||
staff_accounts: data.getIn(['metadata', 'staffAccounts']),
|
||||
federation: data.getIn(['metadata', 'federation']),
|
||||
fields_limits: ImmutableMap({
|
||||
max_fields: nodeinfo.getIn(['metadata', 'fieldsLimits', 'maxFields']),
|
||||
max_fields: data.getIn(['metadata', 'fieldsLimits', 'maxFields']),
|
||||
}),
|
||||
}),
|
||||
}),
|
||||
|
|
Loading…
Reference in a new issue