yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-10-25 23:23:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

wip

Browse Source
This commit is contained in:
ronronscelestes 2021-09-02 13:45:44 +02:00
parent 052eebe6b1
commit b6ab5e58e4
2 changed files with 172 additions and 153 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

315
packages/core/admin/admin/src/pages/HomePage/index.js
View File

@ -5,10 +5,8 @@
*/ */
/* eslint-disable */ /* eslint-disable */
import React, { memo, useMemo } from 'react'; import React, { memo, useMemo } from 'react';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage, useIntl } from 'react-intl';
import { get, upperFirst } from 'lodash'; import { get, upperFirst } from 'lodash';
import { auth, LoadingIndicatorPage } from '@strapi/helper-plugin';
import PageTitle from '../../components/PageTitle';
import { useModels } from '../../hooks'; import { useModels } from '../../hooks';
import useFetch from './hooks'; import useFetch from './hooks';
@ -16,6 +14,11 @@ import { ALink, Block, Container, LinkWrapper, P, Wave, Separator } from './comp
import BlogPost from './BlogPost'; import BlogPost from './BlogPost';
import SocialLink from './SocialLink'; import SocialLink from './SocialLink';
import PageTitle from '../../components/PageTitle';
import { auth, LoadingIndicatorPage, SettingsPageTitle } from '@strapi/helper-plugin';
import { HeaderLayout, Layout, ContentLayout, ActionLayout } from '@strapi/parts/Layout';
import { Main } from '@strapi/parts/Main';
const FIRST_BLOCK_LINKS = [ const FIRST_BLOCK_LINKS = [
{ {
link: link:
@ -62,17 +65,18 @@ const SOCIAL_LINKS = [
]; ];
const HomePage = ({ history: { push } }) => { const HomePage = ({ history: { push } }) => {
const { error, isLoading, posts } = useFetch(); const { formatMessage } = useIntl();
// Temporary until we develop the menu API // const { error, isLoading, posts } = useFetch();
// // Temporary until we develop the menu API
const { collectionTypes, singleTypes, isLoading: isLoadingForModels } = useModels(); const { collectionTypes, singleTypes, isLoading: isLoadingForModels } = useModels();
const handleClick = e => { // const handleClick = e => {
e.preventDefault(); // e.preventDefault();
push( // push(
'/plugins/content-type-builder/content-types/plugins::users-permissions.user?modalType=contentType&kind=collectionType&actionType=create&settingType=base&forTarget=contentType&headerId=content-type-builder.modalForm.contentType.header-create&header_icon_isCustom_1=false&header_icon_name_1=contentType&header_label_1=null' // '/plugins/content-type-builder/content-types/plugins::users-permissions.user?modalType=contentType&kind=collectionType&actionType=create&settingType=base&forTarget=contentType&headerId=content-type-builder.modalForm.contentType.header-create&header_icon_isCustom_1=false&header_icon_name_1=contentType&header_label_1=null'
); // );
}; // };
const hasAlreadyCreatedContentTypes = useMemo(() => { const hasAlreadyCreatedContentTypes = useMemo(() => {
const filterContentTypes = contentTypes => contentTypes.filter(c => c.isDisplayed); const filterContentTypes = contentTypes => contentTypes.filter(c => c.isDisplayed);
@ -86,153 +90,168 @@ const HomePage = ({ history: { push } }) => {
return <LoadingIndicatorPage />; return <LoadingIndicatorPage />;
} }
const headerId = hasAlreadyCreatedContentTypes // const headerId = hasAlreadyCreatedContentTypes
? 'HomePage.greetings' // ? 'HomePage.greetings'
: 'app.components.HomePage.welcome'; // : 'app.components.HomePage.welcome';
const username = get(auth.getUserInfo(), 'firstname', ''); // const username = get(auth.getUserInfo(), 'firstname', '');
const linkProps = hasAlreadyCreatedContentTypes // const linkProps = hasAlreadyCreatedContentTypes
? { // ? {
id: 'app.components.HomePage.button.blog', // id: 'app.components.HomePage.button.blog',
href: 'https://strapi.io/blog/', // href: 'https://strapi.io/blog/',
onClick: () => {}, // onClick: () => {},
type: 'blog', // type: 'blog',
target: '_blank', // target: '_blank',
} // }
: { // : {
id: 'app.components.HomePage.create', // id: 'app.components.HomePage.create',
href: '', // href: '',
onClick: handleClick, // onClick: handleClick,
type: 'documentation', // type: 'documentation',
}; // };
return ( return (
<> <Layout>
<FormattedMessage id="HomePage.helmet.title"> <FormattedMessage id="HomePage.helmet.title">
{title => <PageTitle title={title[0]} />} {title => <PageTitle title={title[0]} />}
</FormattedMessage> </FormattedMessage>
<Container className="container-fluid"> <Main labelledBy="homepage">
<div className="row"> <HeaderLayout
<div className="col-lg-8 col-md-12"> as="h1"
<Block> id="homepage"
<Wave /> title={hasAlreadyCreatedContentTypes ? (
<FormattedMessage formatMessage({
id={headerId} id: 'app.components.HomePage.welcome.again',
values={{ defaultMessage: 'Welcome 👋',
name: upperFirst(username), })
}}
>
{msg => <h2 id="mainHeader">{msg}</h2>}
</FormattedMessage>
{hasAlreadyCreatedContentTypes ? (
<FormattedMessage id="app.components.HomePage.welcomeBlock.content.again">
{msg => <P>{msg}</P>}
</FormattedMessage>
) : ( ) : (
<FormattedMessage id="HomePage.welcome.congrats"> formatMessage({
{congrats => { id: 'app.components.HomePage.welcome',
return ( defaultMessage: 'Welcome on board!',
<FormattedMessage id="HomePage.welcome.congrats.content"> }))}
{content => { subtitle={!hasAlreadyCreatedContentTypes ? (
return ( formatMessage({
<FormattedMessage id="HomePage.welcome.congrats.content.bold"> id: 'app.components.HomePage.welcomeBlock.content.again',
{boldContent => { defaultMessage: 'Get POST changes notifications.',
return ( })
<P> ) : (formatMessage({
<b>{congrats}</b>&nbsp; id: 'app.components.HomePage.welcomeBlock.content',
{content}&nbsp; defaultMessage: 'Get POST changes notifications.',
<b>{boldContent}</b> }))}
</P> // primaryAction={}
);
}}
</FormattedMessage>
);
}}
</FormattedMessage>
);
}}
</FormattedMessage>
)}
{hasAlreadyCreatedContentTypes && (
<div style={{ marginTop: isLoading ? 60 : 50 }}>
{posts.map((post, index) => (
<BlogPost
{...post}
key={post.link}
isFirst={index === 0}
isLoading={isLoading}
error={error}
/> />
))} </Main>
</div> </Layout>
)}
<FormattedMessage id={linkProps.id}>
{msg => (
<ALink
rel="noopener noreferrer"
{...linkProps}
style={{ verticalAlign: ' bottom', marginBottom: 5 }}
>
{msg}
</ALink>
)}
</FormattedMessage>
<Separator style={{ marginTop: 37, marginBottom: 36 }} />
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
{FIRST_BLOCK_LINKS.map((data, index) => {
const type = index === 0 ? 'doc' : 'code';
return ( // {hasAlreadyCreatedContentTypes ? (
<LinkWrapper href={data.link} target="_blank" key={data.link} type={type}> // <FormattedMessage id="app.components.HomePage.welcomeBlock.content.again">
<FormattedMessage id={data.titleId}> // {msg => <P>{msg}</P>}
{title => <p className="bold">{title}</p>} // </FormattedMessage>
</FormattedMessage> // ) : (
<FormattedMessage id={data.contentId}> // <FormattedMessage id="HomePage.welcome.congrats">
{content => <p>{content}</p>} // {congrats => {
</FormattedMessage> // return (
</LinkWrapper> // <FormattedMessage id="HomePage.welcome.congrats.content">
); // {content => {
})} // return (
</div> // <FormattedMessage id="HomePage.welcome.congrats.content.bold">
</Block> // {boldContent => {
</div> // return (
// <P>
// <b>{congrats}</b>&nbsp;
// {content}&nbsp;
// <b>{boldContent}</b>
// </P>
// );
// }}
// </FormattedMessage>
// );
// }}
// </FormattedMessage>
// );
// }}
// </FormattedMessage>
// )}
// {hasAlreadyCreatedContentTypes && (
// <div style={{ marginTop: isLoading ? 60 : 50 }}>
// {posts.map((post, index) => (
// <BlogPost
// {...post}
// key={post.link}
// isFirst={index === 0}
// isLoading={isLoading}
// error={error}
// />
// ))}
// </div>
// )}
// <FormattedMessage id={linkProps.id}>
// {msg => (
// <ALink
// rel="noopener noreferrer"
// {...linkProps}
// style={{ verticalAlign: ' bottom', marginBottom: 5 }}
// >
// {msg}
// </ALink>
// )}
// </FormattedMessage>
// <Separator style={{ marginTop: 37, marginBottom: 36 }} />
// <div style={{ display: 'flex', justifyContent: 'space-between' }}>
// {FIRST_BLOCK_LINKS.map((data, index) => {
// const type = index === 0 ? 'doc' : 'code';
<div className="col-md-12 col-lg-4"> // return (
<Block style={{ paddingRight: 30, paddingBottom: 0 }}> // <LinkWrapper href={data.link} target="_blank" key={data.link} type={type}>
<FormattedMessage id="HomePage.community">{msg => <h2>{msg}</h2>}</FormattedMessage> // <FormattedMessage id={data.titleId}>
<FormattedMessage id="app.components.HomePage.community.content"> // {title => <p className="bold">{title}</p>}
{content => <P style={{ marginTop: 7, marginBottom: 0 }}>{content}</P>} // </FormattedMessage>
</FormattedMessage> // <FormattedMessage id={data.contentId}>
<FormattedMessage id="HomePage.roadmap"> // {content => <p>{content}</p>}
{msg => ( // </FormattedMessage>
<ALink // </LinkWrapper>
rel="noopener noreferrer" // );
href="https://portal.productboard.com/strapi/1-public-roadmap/tabs/2-under-consideration" // })}
target="_blank" // </div>
> // </Block>
{msg} // </div>
</ALink>
)}
</FormattedMessage>
<Separator style={{ marginTop: 18 }} /> // <div className="col-md-12 col-lg-4">
<div // <Block style={{ paddingRight: 30, paddingBottom: 0 }}>
className="row social-wrapper" // <FormattedMessage id="HomePage.community">{msg => <h2>{msg}</h2>}</FormattedMessage>
style={{ // <FormattedMessage id="app.components.HomePage.community.content">
display: 'flex', // {content => <P style={{ marginTop: 7, marginBottom: 0 }}>{content}</P>}
margin: 0, // </FormattedMessage>
marginTop: 36, // <FormattedMessage id="HomePage.roadmap">
marginLeft: -15, // {msg => (
}} // <ALink
> // rel="noopener noreferrer"
{SOCIAL_LINKS.map((value, key) => ( // href="https://portal.productboard.com/strapi/1-public-roadmap/tabs/2-under-consideration"
<SocialLink key={key} {...value} /> // target="_blank"
))} // >
</div> // {msg}
</Block> // </ALink>
</div> // )}
</div> // </FormattedMessage>
</Container>
</> // <Separator style={{ marginTop: 18 }} />
// <div
// className="row social-wrapper"
// style={{
// display: 'flex',
// margin: 0,
// marginTop: 36,
// marginLeft: -15,
// }}
// >
// {SOCIAL_LINKS.map((value, key) => (
// <SocialLink key={key} {...value} />
// ))}
// </div>
// </Block>
// </div>
// </div>
// </Container>
// </>
); );
}; };

6
packages/core/admin/admin/src/translations/en.json
View File

@ -220,10 +220,10 @@
"app.components.HomePage.community": "Find the community on the web", "app.components.HomePage.community": "Find the community on the web",
"app.components.HomePage.community.content": "Discuss with team members, contributors and developers on different channels.", "app.components.HomePage.community.content": "Discuss with team members, contributors and developers on different channels.",
"app.components.HomePage.create": "Create your first Content-Type", "app.components.HomePage.create": "Create your first Content-Type",
"app.components.HomePage.welcome": "Welcome on board!", "app.components.HomePage.welcome": "Welcome on board 👋",
"app.components.HomePage.welcome.again": "Welcome ", "app.components.HomePage.welcome.again": "Welcome 👋",
"app.components.HomePage.welcomeBlock.content": "We are happy to have you as part of the community. We are constantly looking for feedback so feel free to send us DM on ", "app.components.HomePage.welcomeBlock.content": "We are happy to have you as part of the community. We are constantly looking for feedback so feel free to send us DM on ",
"app.components.HomePage.welcomeBlock.content.again": "We hope you are making progress on your project... Feel free to read the latest news about Strapi. We are giving our best to improve the product based on your feedback.", "app.components.HomePage.welcomeBlock.content.again": "We hope you are making progress on your project! Feel free to read the latest news about Strapi. We are giving our best to improve the product based on your feedback.",
"app.components.HomePage.welcomeBlock.content.issues": "issues.", "app.components.HomePage.welcomeBlock.content.issues": "issues.",
"app.components.HomePage.welcomeBlock.content.raise": " or raise ", "app.components.HomePage.welcomeBlock.content.raise": " or raise ",
"app.components.ImgPreview.hint": "Drag & drop your file into this area or {browse} for a file to upload", "app.components.ImgPreview.hint": "Drag & drop your file into this area or {browse} for a file to upload",