mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-11-30 10:58:23 -05:00
use formatted messages for each activity notification
This commit is contained in:
parent
1232f98195
commit
de85a25db1
2 changed files with 135 additions and 6 deletions
7
src/views/studio/l10n.json
Normal file
7
src/views/studio/l10n.json
Normal file
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"studio.activityAddProjectToStudio": "{profileLink} added the project {projectLink}",
|
||||
"studio.activityRemoveProjectStudio": "{profileLink} removed the project {projectLink}",
|
||||
"studio.activityUpdateStudio": "{profileLink} made edits to the title, thumbnail, or description",
|
||||
"studio.activityBecomeCurator": "{promotedProfileLink} accepted an invitation from {promotorProfileLink} to curate this studio",
|
||||
"studio.activityBecomeOwner": "{promotedProfileLink} was promoted to manager by {promotorProfileLink}"
|
||||
}
|
|
@ -1,5 +1,6 @@
|
|||
import React, {useEffect} from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
const FormattedMessage = require('react-intl').FormattedMessage;
|
||||
|
||||
import {connect} from 'react-redux';
|
||||
import {useParams} from 'react-router';
|
||||
|
@ -12,6 +13,132 @@ import SocialMessage from '../../components/social-message/social-message.jsx';
|
|||
|
||||
import './studio.scss';
|
||||
|
||||
const getComponentForItem = (item) => {
|
||||
switch(item.type) {
|
||||
case 'addprojecttostudio':
|
||||
return (
|
||||
<SocialMessage
|
||||
datetime={item.datetime_created}
|
||||
iconSrc="/svgs/messages/love.svg"
|
||||
key={item.id}
|
||||
>
|
||||
<FormattedMessage
|
||||
id="studio.activityAddProjectToStudio"
|
||||
values={{
|
||||
profileLink: (
|
||||
<a href={`/users/${item.actor_id}`}>
|
||||
username
|
||||
</a>
|
||||
),
|
||||
projectLink: (
|
||||
<a href={`/projects/${item.project_id}`}>
|
||||
{item.project_title}
|
||||
</a>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</SocialMessage>
|
||||
);
|
||||
case 'removeprojectstudio':
|
||||
return (
|
||||
<SocialMessage
|
||||
datetime={item.datetime_created}
|
||||
iconSrc="/svgs/messages/love.svg"
|
||||
key={item.id}
|
||||
>
|
||||
<FormattedMessage
|
||||
id="studio.activityRemoveProjectStudio"
|
||||
values={{
|
||||
profileLink: (
|
||||
<a href={`/users/${item.actor_id}`}>
|
||||
username
|
||||
</a>
|
||||
),
|
||||
projectLink: (
|
||||
<a href={`/projects/${item.project_id}`}>
|
||||
{item.project_title}
|
||||
</a>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</SocialMessage>
|
||||
);
|
||||
case 'updatestudio':
|
||||
return (
|
||||
<SocialMessage
|
||||
datetime={item.datetime_created}
|
||||
iconSrc="/svgs/messages/love.svg"
|
||||
key={item.id}
|
||||
>
|
||||
<FormattedMessage
|
||||
id="studio.activityUpdateStudio"
|
||||
values={{
|
||||
profileLink: (
|
||||
<a href={`/users/${item.actor_id}`}>
|
||||
username
|
||||
</a>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</SocialMessage>
|
||||
);
|
||||
case 'becomecurator':
|
||||
return (
|
||||
<SocialMessage
|
||||
datetime={item.datetime_created}
|
||||
iconSrc="/svgs/messages/love.svg"
|
||||
key={item.id}
|
||||
>
|
||||
<FormattedMessage
|
||||
id="studio.activityBecomeCurator"
|
||||
values={{
|
||||
promotedProfileLink: (
|
||||
<a href={`/users/${item.actor_id}`}>
|
||||
username
|
||||
</a>
|
||||
),
|
||||
promotorProfileLink: (
|
||||
<a href={`/users/${item.actor_id}`}>
|
||||
username
|
||||
</a>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</SocialMessage>
|
||||
);
|
||||
case 'becomeownerstudio':
|
||||
return (
|
||||
<SocialMessage
|
||||
datetime={item.datetime_created}
|
||||
iconSrc="/svgs/messages/love.svg"
|
||||
key={item.id}
|
||||
>
|
||||
<FormattedMessage
|
||||
id="studio.activityBecomeOwner"
|
||||
values={{
|
||||
promotedProfileLink: (
|
||||
<a href={`/users/${item.actor_id}`}>
|
||||
username
|
||||
</a>
|
||||
),
|
||||
promotorProfileLink: (
|
||||
<a href={`/users/${item.actor_id}`}>
|
||||
username
|
||||
</a>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
</SocialMessage>
|
||||
);
|
||||
default:
|
||||
return (
|
||||
<SocialMessage>
|
||||
{item.type}
|
||||
</SocialMessage>
|
||||
)
|
||||
}
|
||||
};
|
||||
|
||||
const StudioActivity = ({items, loading, error, onInitialLoad}) => {
|
||||
const {studioId} = useParams();
|
||||
// Fetch the data if none has been loaded yet. This would run only once,
|
||||
|
@ -33,12 +160,7 @@ const StudioActivity = ({items, loading, error, onInitialLoad}) => {
|
|||
className="studio-messages-list"
|
||||
>
|
||||
{items.map((item, index) =>
|
||||
(<SocialMessage
|
||||
datetime={item.datetime_created}
|
||||
iconSrc="/svgs/messages/love.svg"
|
||||
>
|
||||
{item.type}
|
||||
</SocialMessage>)
|
||||
getComponentForItem(item)
|
||||
)}
|
||||
</ul>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue