-
diff --git a/app/javascript/mastodon/features/directory/components/account_card.js b/app/javascript/mastodon/features/directory/components/account_card.js
index 50ad74450..828527d03 100644
--- a/app/javascript/mastodon/features/directory/components/account_card.js
+++ b/app/javascript/mastodon/features/directory/components/account_card.js
@@ -9,10 +9,10 @@ import DisplayName from 'mastodon/components/display_name';
import Permalink from 'mastodon/components/permalink';
import RelativeTimestamp from 'mastodon/components/relative_timestamp';
import IconButton from 'mastodon/components/icon_button';
-import { FormattedMessage, injectIntl, defineMessages } from 'react-intl';
+import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
import { autoPlayGif, me, unfollowModal } from 'mastodon/initial_state';
import { shortNumberFormat } from 'mastodon/utils/numbers';
-import { followAccount, unfollowAccount, blockAccount, unblockAccount, unmuteAccount } from 'mastodon/actions/accounts';
+import { blockAccount, followAccount, unblockAccount, unfollowAccount, unmuteAccount } from 'mastodon/actions/accounts';
import { openModal } from 'mastodon/actions/modal';
import { initMuteModal } from 'mastodon/actions/mutes';
@@ -113,27 +113,27 @@ class AccountCard extends ImmutablePureComponent {
handleEmojiMouseEnter = ({ target }) => {
target.src = target.getAttribute('data-original');
- }
+ };
handleEmojiMouseLeave = ({ target }) => {
target.src = target.getAttribute('data-static');
- }
+ };
handleFollow = () => {
this.props.onFollow(this.props.account);
- }
+ };
handleBlock = () => {
this.props.onBlock(this.props.account);
- }
+ };
handleMute = () => {
this.props.onMute(this.props.account);
- }
+ };
setRef = (c) => {
this.node = c;
- }
+ };
render () {
const { account, intl } = this.props;
@@ -165,7 +165,10 @@ class AccountCard extends ImmutablePureComponent {
-
+
-
-
+
+
+
+
-
+
-
-
-
+
-
-
+
+
-
+
+
-
+
+
-
+
-
-
+ {/*ancestors:
*/} {ancestors} - + {/*common:
*/}Descendants:
*/} {descendants}
-
-
- {text}
- {meta}
-
+
+
+
);
- }
+ };
render () {
const status = this.props.status && (
@@ -49,7 +62,10 @@ export default class ActionsModal extends ImmutablePureComponent {
{text}
+ {meta}
+
-
-
@@ -233,8 +238,12 @@ class ColumnsArea extends ImmutablePureComponent {
+
+
);
}
@@ -255,17 +264,20 @@ class ColumnsArea extends ImmutablePureComponent {
loading={this.renderLoading(column.get('id'))}
error={this.renderError}
>
- {SpecificComponent =>
-
);
}
diff --git a/app/javascript/mastodon/features/ui/index.js b/app/javascript/mastodon/features/ui/index.js
index 957e80737..8fab1ee7d 100644
--- a/app/javascript/mastodon/features/ui/index.js
+++ b/app/javascript/mastodon/features/ui/index.js
@@ -10,112 +10,118 @@ import LoadingBarContainer from './containers/loading_bar_container';
import ModalContainer from './containers/modal_container';
import { isMobile } from '../../is_mobile';
import { debounce } from 'lodash';
-import { uploadCompose, resetCompose } from '../../actions/compose';
+import { resetCompose, uploadCompose } from '../../actions/compose';
import { expandHomeTimeline } from '../../actions/timelines';
import { expandNotifications } from '../../actions/notifications';
import { fetchFilters } from '../../actions/filters';
import { clearHeight } from '../../actions/height_cache';
import { focusApp, unfocusApp } from 'mastodon/actions/app';
import { submitMarkers } from 'mastodon/actions/markers';
-import { WrappedSwitch, WrappedRoute } from './util/react_router_helpers';
+import { WrappedRoute, WrappedSwitch } from './util/react_router_helpers';
import UploadArea from './components/upload_area';
import ColumnsAreaContainer from './containers/columns_area_container';
import DocumentTitle from './components/document_title';
import {
- Compose,
- Status,
- GettingStarted,
- KeyboardShortcuts,
- PublicTimeline,
- CommunityTimeline,
- AccountTimeline,
AccountGallery,
- HomeTimeline,
+ AccountTimeline,
+ Blocks,
+ BookmarkedStatuses,
+ CommunityTimeline,
+ Compose,
+ Directory,
+ DirectTimeline,
+ DomainBlocks,
+ FavouritedStatuses,
+ Favourites,
Followers,
Following,
- Reblogs,
- Favourites,
- DirectTimeline,
- HashtagTimeline,
- Notifications,
FollowRequests,
GenericNotFound,
- FavouritedStatuses,
- BookmarkedStatuses,
- ListTimeline,
- Blocks,
- DomainBlocks,
- Mutes,
- PinnedStatuses,
+ GettingStarted,
+ HashtagTimeline,
+ HomeTimeline,
+ KeyboardShortcuts,
Lists,
+ ListTimeline,
+ Mutes,
+ Notifications,
+ PinnedStatuses,
+ PublicTimeline,
+ Reblogs,
Search,
- Directory,
+ Status,
} from './util/async-components';
-import { me, forceSingleColumn } from '../../initial_state';
+import { forceSingleColumn, me } from '../../initial_state';
import { previewState as previewMediaState } from './components/media_modal';
import { previewState as previewVideoState } from './components/video_modal';
-
// Dummy import, to make sure that -
-
- - Supportez Cipherbliss - -
-
+
+ + +- ); - // const contactlist = this.props.following.foreEach(elem => ( - //+ + {/**/} + + {this.state.enableChristmasSnow && ( ++++ )} + {isStaff && ( + ++ ++Joyeuses fêtes!+ +
+ example link + + + + Trending hashtags + + + + Comptes + + + )} +
+ +- contactez nous - -+- + contactez nous + + Supportez + Cipherbliss - - - Trending hashtags + Videos + FramaDate + Pad + Source
- {invitesEnabled &&
-· - ++-
+ {navToTags}
+
-
+ {invitesEnabled && (
+
-
+
+
· +
+ )}
{withHotkeys && -
- messagerie todo -
- + contactez nous + + Supportez + Cipherbliss - - - Trending hashtags + Videos + FramaDate + Pad + Source
-
- // - // Machin - //- //3 min- //
- // ));
- // return (
- //
-
- // - // - // Un Gens - // - // (3) - // - //- //- //- //- //- //
oh hello there! 😋
- // - //- //- //General Emoji
- // - //- //- //we just achieved comedy
- // - //- // - //- //
- // -
+
+
+ );
+ });
+ }
+
+ const showListClass = (this.state.showList ? 'active' : 'inactive');
+ const classList = 'btn btn-primary toggle-list ' + showListClass;
+ return (
+ -
+ + + + {this.props.recipient.username} + + {/*+
*/} + {this.props.newMessages > 0 && ( + + ({this.props.newMessages}) + + )} + + + + ++
+ );
+ return (
+ -
+
{message.text}
+ +
+ );
+ });
+
+ }
+ return (
+ -
+
+
+ );
+
+ },
+ )
+ ;
+ return (
+
- //
- // );
- }
-
-};
diff --git a/app/javascript/mastodon/features/ui/components/messaging/Contact.js b/app/javascript/mastodon/features/ui/components/messaging/Contact.js
new file mode 100644
index 000000000..c04b765d8
--- /dev/null
+++ b/app/javascript/mastodon/features/ui/components/messaging/Contact.js
@@ -0,0 +1,65 @@
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import PropTypes from 'prop-types';
+import React from 'react';
+import Permalink from '../../../../components/permalink';
+
+export default class Contact extends ImmutablePureComponent {
+
+ static propTypes = {
+ account: PropTypes.object,
+ };
+ static defaultProps = {};
+
+ constructor(props) {
+ super(props);
+ this.state = {
+ account: this.props.account,
+ };
+ }
+
+ openConversationWithAccount = (accountId) => {
+ dispatchEvent({ type: 'openConversation', target: accountId });
+ };
+
+ render() {
+ const account = this.props.account;
+ return (
+
- //
- //
- //
- // Messaging box
- //
- //
- //
- //
- // User list
- //-
- // {contactlist}
- //
- //
- // -
- //
+
+ );
+ }
+
+}
diff --git a/app/javascript/mastodon/features/ui/components/messaging/contacts-list.js b/app/javascript/mastodon/features/ui/components/messaging/contacts-list.js
new file mode 100644
index 000000000..3ccaf4394
--- /dev/null
+++ b/app/javascript/mastodon/features/ui/components/messaging/contacts-list.js
@@ -0,0 +1,142 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import accounts, { me } from '../../../../initial_state';
+import api from '../../../../api';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { mockContactList } from './mocks/mockContactList';
+import Contact from './Contact';
+import classNames from 'classnames';
+
+export default class ContactsList extends ImmutablePureComponent {
+
+ static propTypes = {
+ myAccount : PropTypes.array,
+ showList : PropTypes.bool,
+ contactList : PropTypes.array,
+ conversationList: PropTypes.array,
+ following_count : PropTypes.number,
+ };
+ static defaultProps = {
+ showList : true,
+ myAccount : null,
+ userID : me,
+ following_count : 0,
+ contactList : mockContactList,
+ conversationList: mockContactList,
+ };
+
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ following_count : accounts.accounts[me].following_count,
+ showList : props.showList,
+ myAccount : accounts.accounts[me],
+ contactList : mockContactList,
+ conversationList: mockContactList,
+ };
+ // this.fetchContacts(1);
+ }
+
+ submitCompose() {
+ console.log('submit message');
+ }
+
+ toggleList = () => {
+ this.setState((state) => {
+ return {
+ showList: !state.showList,
+ };
+ });
+ };
+
+ /**
+ * find followed accounts
+ * @param AccountID
+ * @returns {Promise
+
+
+
+
+
+
+ 
+
+
+
+
+ {this.props.account.username}
+
+
+
+
+
+
+
+
+
+ {/**/}
+ {/**/}
+
+ );
+ };
+
+}
diff --git a/app/javascript/mastodon/features/ui/components/messaging/conversation-item.js b/app/javascript/mastodon/features/ui/components/messaging/conversation-item.js
new file mode 100644
index 000000000..61ff47545
--- /dev/null
+++ b/app/javascript/mastodon/features/ui/components/messaging/conversation-item.js
@@ -0,0 +1,116 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import ConversationStream from './conversation-stream';
+
+/**
+ * a conversation between the current logged in user and one recipient
+ */
+export default class ConversationItem extends React.PureComponent {
+
+ static propTypes = {
+ messages : PropTypes.array, // our and their message sorted chronologically
+ recipient : PropTypes.any, // account of the person we talk to, not current logged in account
+ newMessages: PropTypes.number,
+ displayed : PropTypes.bool,
+ };
+ static defaultProps = {
+ newMessages: 0,
+ displayed : true,
+ };
+ following = [];
+
+ constructor(props) {
+ super(props);
+ console.log('props', props);
+ this.state = {
+ composeMessage: '',
+ displayed : this.props.displayed,
+ newMessages : this.props.newMessages,
+ isFocused : false,
+ };
+ }
+
+ submitCompose = (e) => {
+ e.preventDefault();
+
+ console.log('submit');
+ };
+
+ toggleVisibility = () => {
+ this.setState({ 'displayed': !this.state.displayed });
+ };
+ toggleFocused = () => {
+ this.setState({ 'isFocused': !this.state.isFocused });
+ };
+
+ handleChange = (e) => {
+ e.preventDefault();
+ console.log('e', e);
+ };
+
+ render() {
+ const hasNewClass = this.state.newMessages ? 'has-new-message' : 'nothing-new';
+ const isVisible = this.state.displayed ? 'displayed' : 'hidden';
+ const isFocused = this.state.isFocused ? 'isFocused' : 'not-focused';
+ const list = (
+
+
+
+
+ {this.state.following_count} contacts
+
+
+
+
+ {this.state.showList && (
+
+
+
+
+ )}
+ -
+ {renderedList}
+
-
+ {list}
+
+ no messages
+
+ );
+
+ if (this.props.messages) {
+
+ messagesLists = this.props.messages.map(message => {
+ return (
+
+
+ );
+ }
+
+}
diff --git a/app/javascript/mastodon/features/ui/components/messaging/conversationStack.js b/app/javascript/mastodon/features/ui/components/messaging/conversationStack.js
new file mode 100644
index 000000000..e8f9f53a5
--- /dev/null
+++ b/app/javascript/mastodon/features/ui/components/messaging/conversationStack.js
@@ -0,0 +1,51 @@
+import React from 'react';
+
+import PropTypes from 'prop-types';
+import ConversationItem from './conversation-item';
+import { mockRecipient, mockRecipient2 } from './mocks/mockConversation';
+
+export default class ConversationStack extends React.Component {
+
+ static propTypes = {
+ conversations: PropTypes.array,
+ };
+
+ static defaultProps = {
+ conversations: [mockRecipient, mockRecipient2],
+ };
+
+ openConversationWith(account) {
+ console.log('openConversationWith name', account.username);
+ }
+
+ render() {
+ let list = this.props.conversations.map(recipient => {
+
+ console.log('recipient', recipient);
+ recipient = recipient[0];
+ return (
+
+ {messagesLists}
+
+ -
+ {list}
+
+
+
+ );
+ }
+
+};
diff --git a/app/javascript/mastodon/features/ui/components/messaging/mocks/mockContactList.js b/app/javascript/mastodon/features/ui/components/messaging/mocks/mockContactList.js
new file mode 100644
index 000000000..d2606e07c
--- /dev/null
+++ b/app/javascript/mastodon/features/ui/components/messaging/mocks/mockContactList.js
@@ -0,0 +1,69 @@
+export const mockContactList = [{
+ 'key' : '2',
+ 'id' : '2',
+ 'username' : 'demoguy',
+ 'acct' : 'demoguy',
+ 'display_name' : '',
+ 'locked' : false,
+ 'bot' : false,
+ 'discoverable' : null,
+ 'group' : false,
+ 'created_at' : '2019-12-18T11:02:26.494Z',
+ 'note' : '',
+ 'url' : 'http://localhost:3000/@demoguy',
+ 'avatar' : 'http://localhost:3000/avatars/original/missing.png',
+ 'avatar_static' : 'http://localhost:3000/avatars/original/missing.png',
+ 'header' : 'http://localhost:3000/headers/original/missing.png',
+ 'header_static' : 'http://localhost:3000/headers/original/missing.png',
+ 'followers_count' : 1,
+ 'following_count' : 1,
+ 'statuses_count' : 8,
+ 'last_status_at' : '2019-12-23T15:20:31.575Z',
+ 'emojis' : [],
+ 'fields' : [],
+ 'display_name_html': 'demoguy',
+ 'note_emojified' : '',
+}, {
+ 'key' : '1',
+ 'id' : '1',
+ 'username' : 'admin',
+ 'acct' : 'admin',
+ 'display_name' : '',
+ 'locked' : true,
+ 'bot' : false,
+ 'discoverable' : true,
+ 'group' : false,
+ 'created_at' : '2019-12-10T13:19:44.106Z',
+ 'note' : '',
+ 'url' : 'http://localhost:3000/@admin',
+ 'avatar' : 'http://localhost:3000/system/accounts/avatars/000/000/001/original/a1497a4af5fd8616.png?1576254102',
+ 'avatar_static' : 'http://localhost:3000/system/accounts/avatars/000/000/001/original/a1497a4af5fd8616.png?1576254102',
+ 'header' : 'http://localhost:3000/system/accounts/headers/000/000/001/original/f13ebf964b09ed26.png?1576254102',
+ 'header_static' : 'http://localhost:3000/system/accounts/headers/000/000/001/original/f13ebf964b09ed26.png?1576254102',
+ 'followers_count' : 4,
+ 'following_count' : 3,
+ 'statuses_count' : 31,
+ 'last_status_at' : '2020-01-04T15:13:32.824Z',
+ 'emojis' : [],
+ 'fields' : [
+ {
+ 'name' : 'sssss',
+ 'value' : 'muuuuu',
+ 'verified_at' : null,
+ 'name_emojified' : 'sssss',
+ 'value_emojified': 'muuuuu',
+ 'value_plain' : 'muuuuu',
+ },
+ ],
+ 'display_name_html': 'admin',
+ 'note_emojified' : '',
+}];
+export const mockContactListShort = [{
+ 'key' : '2',
+ 'id' : '2',
+ 'username': 'demoguy',
+}, {
+ 'key' : '1',
+ 'id' : '1',
+ 'username': 'admin',
+}];
diff --git a/app/javascript/mastodon/features/ui/components/messaging/mocks/mockConversation.js b/app/javascript/mastodon/features/ui/components/messaging/mocks/mockConversation.js
new file mode 100644
index 000000000..b8ceb709f
--- /dev/null
+++ b/app/javascript/mastodon/features/ui/components/messaging/mocks/mockConversation.js
@@ -0,0 +1,33 @@
+export const mockMessages = [
+ { id: 0, text: 'oh hello there! 😋 ', who: 'theirs' },
+ { id: 1, text: 'General Emoji', who: 'ours' },
+ { id: 2, text: 'we just achieved comedy', who: 'theirs' },
+ ]
+;
+export const mockMessages2 = [
+ { id: 0, text: 'oh oh oh ', who: 'theirs' },
+ { id: 1, text: 'General Emoji', who: 'ours' },
+ { id: 2, text: 'DANGER!!', who: 'theirs' },
+ { id: 3, text: 'JUST KIDDING WILL ROBINSON.', who: 'theirs' },
+ ]
+;
+
+export const mockRecipient = [
+ {
+ id : 3,
+ username : 'chuck norris',
+ newMessages: 5,
+ messages : mockMessages,
+ },
+ ]
+;
+
+export const mockRecipient2 = [
+ {
+ id : 4,
+ username : 'the Bo Botte',
+ newMessages: 0,
+ messages : mockMessages2,
+ },
+ ]
+;
diff --git a/app/javascript/mastodon/features/ui/components/navigation_panel.js b/app/javascript/mastodon/features/ui/components/navigation_panel.js
index 7d78a1736..4775e9aa7 100644
--- a/app/javascript/mastodon/features/ui/components/navigation_panel.js
+++ b/app/javascript/mastodon/features/ui/components/navigation_panel.js
@@ -8,24 +8,53 @@ import FollowRequestsNavLink from './follow_requests_nav_link';
import ListPanel from './list_panel';
import TrendsContainer from 'mastodon/features/getting_started/containers/trends_container';
-const showMessaging = true;
-
const NavigationPanel = () => (
+ (
id='tabs_bar.notifications'
defaultMessage='Notifications'
/>
- (
id='navigation_bar.direct'
defaultMessage='Direct messages'
/>
+ (
{showTrends && }
{showTrends &&
);
diff --git a/app/javascript/mastodon/features/ui/components/tabs_bar.js b/app/javascript/mastodon/features/ui/components/tabs_bar.js
index 1911da8ba..480812fed 100644
--- a/app/javascript/mastodon/features/ui/components/tabs_bar.js
+++ b/app/javascript/mastodon/features/ui/components/tabs_bar.js
@@ -8,19 +8,81 @@ import Icon from 'mastodon/components/icon';
import NotificationsCounterIcon from './notifications_counter_icon';
export const links = [
-
+
+
-
+
+
-
+
+
-
+
+
+
+
+
{children}
-
+
-