mirror of https://github.com/mastodon/mastodon
WIP: Add starter packs
Eugen Rochko
4 months ago
parent
58c40caeb4
commit
eae6b98ace
@ -0,0 +1,18 @@
|
||||
# frozen_string_literal: true
|
||||
|
||||
class Api::V1::Lists::FollowsController < Api::BaseController
|
||||
before_action -> { doorkeeper_authorize! :follow, :write, :'write:follows' }
|
||||
before_action :require_user!
|
||||
before_action :set_list
|
||||
|
||||
def create
|
||||
FollowFromPublicListWorker.perform_async(current_account.id, @list.id)
|
||||
render json: {}, status: 202
|
||||
end
|
||||
|
||||
private
|
||||
|
||||
def set_list
|
||||
@list = List.where(type: :public_list).find(params[:list_id])
|
||||
end
|
||||
end
|
||||
@ -0,0 +1,15 @@
|
||||
# frozen_string_literal: true
|
||||
|
||||
class ListsController < ApplicationController
|
||||
include WebAppControllerConcern
|
||||
|
||||
before_action :set_list
|
||||
|
||||
def show; end
|
||||
|
||||
private
|
||||
|
||||
def set_list
|
||||
@list = List.where(type: :public_list).find(params[:id])
|
||||
end
|
||||
end
|
||||
@ -1,10 +1,21 @@
|
||||
// See app/serializers/rest/list_serializer.rb
|
||||
|
||||
import type { ApiAccountJSON } from 'mastodon/api_types/accounts';
|
||||
|
||||
export type RepliesPolicyType = 'list' | 'followed' | 'none';
|
||||
|
||||
export type ListType = 'private_list' | 'public_list';
|
||||
|
||||
export interface ApiListJSON {
|
||||
id: string;
|
||||
url?: string;
|
||||
title: string;
|
||||
slug?: string;
|
||||
type: ListType;
|
||||
description: string;
|
||||
created_at: string;
|
||||
updated_at: string;
|
||||
exclusive: boolean;
|
||||
replies_policy: RepliesPolicyType;
|
||||
account?: ApiAccountJSON;
|
||||
}
|
||||
|
||||
@ -1,25 +0,0 @@
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
import { Avatar } from 'mastodon/components/avatar';
|
||||
import { useAppSelector } from 'mastodon/store';
|
||||
|
||||
export const AuthorLink = ({ accountId }) => {
|
||||
const account = useAppSelector(state => state.getIn(['accounts', accountId]));
|
||||
|
||||
if (!account) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<Link to={`/@${account.get('acct')}`} className='story__details__shared__author-link' data-hover-card-account={accountId}>
|
||||
<Avatar account={account} size={16} />
|
||||
<bdi dangerouslySetInnerHTML={{ __html: account.get('display_name_html') }} />
|
||||
</Link>
|
||||
);
|
||||
};
|
||||
|
||||
AuthorLink.propTypes = {
|
||||
accountId: PropTypes.string.isRequired,
|
||||
};
|
||||
@ -0,0 +1,25 @@
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
import { Avatar } from 'mastodon/components/avatar';
|
||||
import { useAppSelector } from 'mastodon/store';
|
||||
|
||||
export const AuthorLink: React.FC<{
|
||||
accountId: string;
|
||||
}> = ({ accountId }) => {
|
||||
const account = useAppSelector((state) => state.accounts.get(accountId));
|
||||
|
||||
if (!account) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<Link
|
||||
to={`/@${account.acct}`}
|
||||
className='story__details__shared__author-link'
|
||||
data-hover-card-account={accountId}
|
||||
>
|
||||
<Avatar account={account} size={16} />
|
||||
<bdi dangerouslySetInnerHTML={{ __html: account.display_name_html }} />
|
||||
</Link>
|
||||
);
|
||||
};
|
||||
@ -0,0 +1,120 @@
|
||||
import { useCallback } from 'react';
|
||||
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
import { openModal } from 'mastodon/actions/modal';
|
||||
import { apiFollowList } from 'mastodon/api/lists';
|
||||
import { Button } from 'mastodon/components/button';
|
||||
import { RelativeTimestamp } from 'mastodon/components/relative_timestamp';
|
||||
import { AuthorLink } from 'mastodon/features/explore/components/author_link';
|
||||
import { useIdentity } from 'mastodon/identity_context';
|
||||
import { registrationsOpen, sso_redirect, me } from 'mastodon/initial_state';
|
||||
import type { List } from 'mastodon/models/list';
|
||||
import { useAppSelector, useAppDispatch } from 'mastodon/store';
|
||||
|
||||
export const Hero: React.FC<{
|
||||
list: List;
|
||||
}> = ({ list }) => {
|
||||
const { signedIn } = useIdentity();
|
||||
const dispatch = useAppDispatch();
|
||||
const signupUrl = useAppSelector(
|
||||
(state) =>
|
||||
state.server.getIn(['server', 'registrations', 'url'], null) ??
|
||||
'/auth/sign_up',
|
||||
) as string;
|
||||
|
||||
const handleClosedRegistrationsClick = useCallback(() => {
|
||||
dispatch(openModal({ modalType: 'CLOSED_REGISTRATIONS', modalProps: {} }));
|
||||
}, [dispatch]);
|
||||
|
||||
const handleFollowAll = useCallback(() => {
|
||||
apiFollowList(list.id)
|
||||
.then(() => {
|
||||
// TODO
|
||||
return '';
|
||||
})
|
||||
.catch(() => {
|
||||
// TODO
|
||||
});
|
||||
}, [list]);
|
||||
|
||||
let signUpButton;
|
||||
|
||||
if (sso_redirect) {
|
||||
signUpButton = (
|
||||
<a href={sso_redirect} data-method='post' className='button'>
|
||||
<FormattedMessage id='' defaultMessage='Create account' />
|
||||
</a>
|
||||
);
|
||||
} else if (registrationsOpen) {
|
||||
signUpButton = (
|
||||
<a href={`${signupUrl}?list_id=${list.id}`} className='button'>
|
||||
<FormattedMessage id='' defaultMessage='Create account' />
|
||||
</a>
|
||||
);
|
||||
} else {
|
||||
signUpButton = (
|
||||
<Button onClick={handleClosedRegistrationsClick}>
|
||||
<FormattedMessage id='' defaultMessage='Create account' />
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='lists__hero'>
|
||||
<div className='lists__hero__title'>
|
||||
<h1>{list.title}</h1>
|
||||
<p>
|
||||
{list.description.length > 0 ? (
|
||||
list.description
|
||||
) : (
|
||||
<FormattedMessage id='' defaultMessage='No description given.' />
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className='lists__hero__meta'>
|
||||
<FormattedMessage
|
||||
id=''
|
||||
defaultMessage='Public list by {name}'
|
||||
values={{
|
||||
name: list.account_id && <AuthorLink accountId={list.account_id} />,
|
||||
}}
|
||||
>
|
||||
{(chunks) => (
|
||||
// eslint-disable-next-line react/jsx-no-useless-fragment
|
||||
<>{chunks}</>
|
||||
)}
|
||||
</FormattedMessage>
|
||||
|
||||
<span aria-hidden>{' · '}</span>
|
||||
|
||||
<FormattedMessage
|
||||
id=''
|
||||
defaultMessage='Created {timeAgo}'
|
||||
values={{
|
||||
timeAgo: (
|
||||
<RelativeTimestamp timestamp={list.created_at} short={false} />
|
||||
),
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='lists__hero__actions'>
|
||||
{!signedIn && signUpButton}
|
||||
{me !== list.account_id && (
|
||||
<Button onClick={handleFollowAll} secondary={!signedIn}>
|
||||
<FormattedMessage id='' defaultMessage='Follow all' />
|
||||
</Button>
|
||||
)}
|
||||
{me === list.account_id && (
|
||||
<Link className='button' to={`/lists/${list.id}/edit`}>
|
||||
<FormattedMessage id='' defaultMessage='Edit list' />
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
@ -0,0 +1,136 @@
|
||||
import { useEffect, useCallback } from 'react';
|
||||
|
||||
import { FormattedMessage, useIntl, defineMessages } from 'react-intl';
|
||||
|
||||
import { Helmet } from 'react-helmet';
|
||||
import { NavLink, useParams, Route, Switch } from 'react-router-dom';
|
||||
|
||||
import PackageIcon from '@/material-icons/400-24px/package_2.svg?react';
|
||||
import ShareIcon from '@/material-icons/400-24px/share.svg?react';
|
||||
import { fetchList } from 'mastodon/actions/lists';
|
||||
import Column from 'mastodon/components/column';
|
||||
import { ColumnHeader } from 'mastodon/components/column_header';
|
||||
import { CopyIconButton } from 'mastodon/components/copy_icon_button';
|
||||
import { Icon } from 'mastodon/components/icon';
|
||||
import { LoadingIndicator } from 'mastodon/components/loading_indicator';
|
||||
import BundleColumnError from 'mastodon/features/ui/components/bundle_column_error';
|
||||
import type { List } from 'mastodon/models/list';
|
||||
import { useAppDispatch, useAppSelector } from 'mastodon/store';
|
||||
|
||||
import { Hero } from './components/hero';
|
||||
import { Members } from './members';
|
||||
import { Statuses } from './statuses';
|
||||
|
||||
interface PublicListParams {
|
||||
id: string;
|
||||
slug?: string;
|
||||
}
|
||||
|
||||
const messages = defineMessages({
|
||||
copyLink: { id: '', defaultMessage: 'Copy link' },
|
||||
shareLink: { id: '', defaultMessage: 'Share link' },
|
||||
});
|
||||
|
||||
const CopyLinkButton: React.FC<{
|
||||
list: List;
|
||||
}> = ({ list }) => {
|
||||
const intl = useIntl();
|
||||
|
||||
const handleClick = useCallback(() => {
|
||||
void navigator.share({
|
||||
url: list.url,
|
||||
});
|
||||
}, [list]);
|
||||
|
||||
if ('share' in navigator) {
|
||||
return (
|
||||
<button
|
||||
className='column-header__button'
|
||||
onClick={handleClick}
|
||||
title={intl.formatMessage(messages.shareLink)}
|
||||
aria-label={intl.formatMessage(messages.shareLink)}
|
||||
>
|
||||
<Icon id='' icon={ShareIcon} />
|
||||
</button>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<CopyIconButton
|
||||
className='column-header__button'
|
||||
title={intl.formatMessage(messages.copyLink)}
|
||||
value={list.url}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
const PublicList: React.FC<{
|
||||
multiColumn: boolean;
|
||||
}> = ({ multiColumn }) => {
|
||||
const { id } = useParams<PublicListParams>();
|
||||
const dispatch = useAppDispatch();
|
||||
const list = useAppSelector((state) => state.lists.get(id));
|
||||
const accountId = list?.account_id;
|
||||
const slug = list?.slug ? `${list.id}-${list.slug}` : list?.id;
|
||||
|
||||
useEffect(() => {
|
||||
dispatch(fetchList(id));
|
||||
}, [dispatch, id]);
|
||||
|
||||
if (typeof list === 'undefined') {
|
||||
return (
|
||||
<Column>
|
||||
<LoadingIndicator />
|
||||
</Column>
|
||||
);
|
||||
} else if (list === null || !accountId) {
|
||||
return <BundleColumnError multiColumn={multiColumn} errorType='routing' />;
|
||||
}
|
||||
|
||||
return (
|
||||
<Column>
|
||||
<ColumnHeader
|
||||
icon='package'
|
||||
iconComponent={PackageIcon}
|
||||
title={list.title}
|
||||
multiColumn={multiColumn}
|
||||
extraButton={<CopyLinkButton list={list} />}
|
||||
/>
|
||||
|
||||
<Hero list={list} />
|
||||
|
||||
<div className='account__section-headline'>
|
||||
<NavLink exact to={`/starter-pack/${slug}`}>
|
||||
<FormattedMessage tagName='div' id='' defaultMessage='Members' />
|
||||
</NavLink>
|
||||
|
||||
<NavLink exact to={`/starter-pack/${slug}/posts`}>
|
||||
<FormattedMessage tagName='div' id='' defaultMessage='Posts' />
|
||||
</NavLink>
|
||||
</div>
|
||||
|
||||
<Switch>
|
||||
<Route
|
||||
path={['/starter-pack/:id(\\d+)', '/starter-pack/:id(\\d+)-:slug']}
|
||||
exact
|
||||
component={Members}
|
||||
/>
|
||||
<Route
|
||||
path={[
|
||||
'/starter-pack/:id(\\d+)/posts',
|
||||
'/starter-pack/:id(\\d+)-:slug/posts',
|
||||
]}
|
||||
component={Statuses}
|
||||
/>
|
||||
</Switch>
|
||||
|
||||
<Helmet>
|
||||
<title>{list.title}</title>
|
||||
<meta name='robots' content='all' />
|
||||
</Helmet>
|
||||
</Column>
|
||||
);
|
||||
};
|
||||
|
||||
// eslint-disable-next-line import/no-default-export
|
||||
export default PublicList;
|
||||
@ -0,0 +1,48 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
|
||||
import { useParams } from 'react-router-dom';
|
||||
|
||||
import { importFetchedAccounts } from 'mastodon/actions/importer';
|
||||
import { apiGetAccounts } from 'mastodon/api/lists';
|
||||
import { Account } from 'mastodon/components/account';
|
||||
import ScrollableList from 'mastodon/components/scrollable_list';
|
||||
import { useAppDispatch } from 'mastodon/store';
|
||||
|
||||
export const Members: React.FC<{
|
||||
multiColumn?: boolean;
|
||||
}> = ({ multiColumn }) => {
|
||||
const { id }: { id: string } = useParams();
|
||||
const [accountIds, setAccountIds] = useState<string[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
useEffect(() => {
|
||||
setLoading(true);
|
||||
|
||||
apiGetAccounts(id)
|
||||
.then((data) => {
|
||||
dispatch(importFetchedAccounts(data));
|
||||
setAccountIds(data.map((a) => a.id));
|
||||
setLoading(false);
|
||||
return '';
|
||||
})
|
||||
.catch(() => {
|
||||
setLoading(false);
|
||||
});
|
||||
}, [dispatch, id]);
|
||||
|
||||
return (
|
||||
<ScrollableList
|
||||
scrollKey={`public_list/${id}/members`}
|
||||
trackScroll={!multiColumn}
|
||||
bindToDocument={!multiColumn}
|
||||
isLoading={loading}
|
||||
showLoading={loading && accountIds.length === 0}
|
||||
hasMore={false}
|
||||
>
|
||||
{accountIds.map((accountId) => (
|
||||
<Account key={accountId} id={accountId} withBio={false} />
|
||||
))}
|
||||
</ScrollableList>
|
||||
);
|
||||
};
|
||||
@ -0,0 +1,35 @@
|
||||
import { useCallback, useEffect } from 'react';
|
||||
|
||||
import { useParams } from 'react-router-dom';
|
||||
|
||||
import { expandListTimeline } from 'mastodon/actions/timelines';
|
||||
import StatusList from 'mastodon/features/ui/containers/status_list_container';
|
||||
import { useAppDispatch } from 'mastodon/store';
|
||||
|
||||
export const Statuses: React.FC<{
|
||||
multiColumn?: boolean;
|
||||
}> = ({ multiColumn }) => {
|
||||
const { id }: { id: string } = useParams();
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
const handleLoadMore = useCallback(
|
||||
(maxId: string) => {
|
||||
void dispatch(expandListTimeline(id, { maxId }));
|
||||
},
|
||||
[dispatch, id],
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
void dispatch(expandListTimeline(id));
|
||||
}, [dispatch, id]);
|
||||
|
||||
return (
|
||||
<StatusList
|
||||
scrollKey={`public_list/${id}/statuses`}
|
||||
trackScroll={!multiColumn}
|
||||
bindToDocument={!multiColumn}
|
||||
timelineId={`list:${id}`}
|
||||
onLoadMore={handleLoadMore}
|
||||
/>
|
||||
);
|
||||
};
|
||||
@ -0,0 +1,8 @@
|
||||
interface MenuItem {
|
||||
text: string;
|
||||
action?: () => void;
|
||||
to?: string;
|
||||
dangerous?: boolean;
|
||||
}
|
||||
|
||||
export type MenuItems = (MenuItem | null)[];
|
||||
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path d="M440-91v-366L120-642v321q0 22 10.5 40t29.5 29L440-91Zm80 0 280-161q19-11 29.5-29t10.5-40v-321L520-457v366Zm159-550 118-69-277-159q-19-11-40-11t-40 11l-79 45 318 183ZM480-526l119-68-317-184-120 69 318 183Z"/></svg>
|
||||
|
After Width: | Height: | Size: 310 B |
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path d="M440-183v-274L200-596v274l240 139Zm80 0 240-139v-274L520-457v274Zm-80 92L160-252q-19-11-29.5-29T120-321v-318q0-22 10.5-40t29.5-29l280-161q19-11 40-11t40 11l280 161q19 11 29.5 29t10.5 40v318q0 22-10.5 40T800-252L520-91q-19 11-40 11t-40-11Zm200-528 77-44-237-137-78 45 238 136Zm-160 93 78-45-237-137-78 45 237 137Z"/></svg>
|
||||
|
After Width: | Height: | Size: 418 B |
@ -0,0 +1,21 @@
|
||||
# frozen_string_literal: true
|
||||
|
||||
class ListPolicy < ApplicationPolicy
|
||||
def show?
|
||||
record.public_list? || owned?
|
||||
end
|
||||
|
||||
def update?
|
||||
owned?
|
||||
end
|
||||
|
||||
def destroy?
|
||||
owned?
|
||||
end
|
||||
|
||||
private
|
||||
|
||||
def owned?
|
||||
user_signed_in? && record.account_id == current_account.id
|
||||
end
|
||||
end
|
||||
@ -1,9 +1,20 @@
|
||||
# frozen_string_literal: true
|
||||
|
||||
class REST::ListSerializer < ActiveModel::Serializer
|
||||
attributes :id, :title, :replies_policy, :exclusive
|
||||
include RoutingHelper
|
||||
|
||||
attributes :id, :title, :description, :type, :replies_policy,
|
||||
:exclusive, :created_at, :updated_at
|
||||
|
||||
attribute :slug, if: -> { object.public_list? }
|
||||
attribute :url, if: -> { object.public_list? }
|
||||
has_one :account, serializer: REST::AccountSerializer, if: -> { object.public_list? }
|
||||
|
||||
def id
|
||||
object.id.to_s
|
||||
end
|
||||
|
||||
def url
|
||||
public_list_url(object.to_url_param)
|
||||
end
|
||||
end
|
||||
|
||||
@ -0,0 +1,7 @@
|
||||
%meta{ name: 'description', content: list.description }/
|
||||
|
||||
= opengraph 'og:url', public_list_url(list.to_url_param)
|
||||
= opengraph 'og:site_name', site_title
|
||||
= opengraph 'og:title', yield(:page_title).strip
|
||||
= opengraph 'og:description', list.description
|
||||
= opengraph 'twitter:card', 'summary'
|
||||
@ -0,0 +1,6 @@
|
||||
- content_for :page_title, @list.title
|
||||
|
||||
- content_for :header_tags do
|
||||
= render 'og', list: @list
|
||||
|
||||
= render partial: 'shared/web_app'
|
||||
@ -0,0 +1,18 @@
|
||||
# frozen_string_literal: true
|
||||
|
||||
class FollowFromPublicListWorker
|
||||
include Sidekiq::Worker
|
||||
|
||||
def perform(into_account_id, list_id)
|
||||
list = List.where(type: :public_list).find(list_id)
|
||||
into_account = Account.find(into_account_id)
|
||||
|
||||
list.accounts.find_each do |target_account|
|
||||
FollowService.new.call(into_account, target_account)
|
||||
rescue
|
||||
# Skip past disallowed follows
|
||||
end
|
||||
rescue ActiveRecord::RecordNotFound
|
||||
true
|
||||
end
|
||||
end
|
||||
@ -0,0 +1,8 @@
|
||||
# frozen_string_literal: true
|
||||
|
||||
class AddTypeToLists < ActiveRecord::Migration[7.2]
|
||||
def change
|
||||
add_column :lists, :type, :integer, default: 0, null: false
|
||||
add_column :lists, :description, :text, default: '', null: false
|
||||
end
|
||||
end
|
||||
Loading…
Reference in New Issue