-
{username}
- {emailAddress ?
{emailAddress}
: null}
+const Profile = ({
+ username,
+ emailAddress,
+ data,
+ root,
+ activeTab,
+ setActiveTab,
+}) => (
+
+
+
{username}
+ {emailAddress ?
{emailAddress}
: null}
+
-
-
{t('framework.my_comments')}
-
+
+ {t('framework.my_comments')}
+ ,
+ ]}
+ tabPanes={[
+
+
+ ,
+ ]}
+ sub
+ />
);
@@ -21,6 +50,8 @@ Profile.propTypes = {
emailAddress: PropTypes.string,
data: PropTypes.object,
root: PropTypes.object,
+ activeTab: PropTypes.string.isRequired,
+ setActiveTab: PropTypes.func.isRequired,
};
export default Profile;
diff --git a/client/coral-embed-stream/src/tabs/profile/containers/Comment.js b/client/coral-embed-stream/src/tabs/profile/containers/Comment.js
index 7406d4c5e..b8fb7fad8 100644
--- a/client/coral-embed-stream/src/tabs/profile/containers/Comment.js
+++ b/client/coral-embed-stream/src/tabs/profile/containers/Comment.js
@@ -7,7 +7,7 @@ const slots = ['commentContent', 'historyCommentTimestamp'];
const withCommentFragments = withFragments({
comment: gql`
- fragment TalkEmbedStream_Comment_Fragment on Comment {
+ fragment TalkEmbedStream_ProfileComment_comment on Comment {
id
body
replyCount
diff --git a/client/coral-embed-stream/src/tabs/profile/containers/Profile.js b/client/coral-embed-stream/src/tabs/profile/containers/Profile.js
index 2fc768535..82a0a49eb 100644
--- a/client/coral-embed-stream/src/tabs/profile/containers/Profile.js
+++ b/client/coral-embed-stream/src/tabs/profile/containers/Profile.js
@@ -11,6 +11,7 @@ import CommentHistory from './CommentHistory';
import { getDefinitionName } from 'coral-framework/utils';
import { showSignInDialog } from 'coral-embed-stream/src/actions/login';
+import { setActiveTab } from '../../../actions/profile';
import { getSlotFragmentSpreads } from 'coral-framework/utils';
class ProfileContainer extends Component {
@@ -47,6 +48,8 @@ class ProfileContainer extends Component {
emailAddress={emailAddress}
data={data}
root={root}
+ activeTab={this.props.activeTab}
+ setActiveTab={this.props.setActiveTab}
/>
);
}
@@ -57,9 +60,16 @@ ProfileContainer.propTypes = {
root: PropTypes.object,
currentUser: PropTypes.object,
showSignInDialog: PropTypes.func,
+ activeTab: PropTypes.string.isRequired,
+ setActiveTab: PropTypes.func.isRequired,
};
-const slots = ['profileSections'];
+const slots = [
+ 'profileSections',
+ 'profileTabs',
+ 'profileTabsPrepend',
+ 'profileTabPanes',
+];
const withProfileQuery = withQuery(
gql`
@@ -82,10 +92,11 @@ const withProfileQuery = withQuery(
const mapStateToProps = state => ({
currentUser: state.auth.user,
+ activeTab: state.profile.activeTab,
});
const mapDispatchToProps = dispatch =>
- bindActionCreators({ showSignInDialog }, dispatch);
+ bindActionCreators({ showSignInDialog, setActiveTab }, dispatch);
export default compose(
connect(mapStateToProps, mapDispatchToProps),
diff --git a/plugins.default.json b/plugins.default.json
index 066c94478..b54c6a54c 100644
--- a/plugins.default.json
+++ b/plugins.default.json
@@ -21,6 +21,7 @@
"talk-plugin-sort-most-respected",
"talk-plugin-sort-newest",
"talk-plugin-sort-oldest",
- "talk-plugin-viewing-options"
+ "talk-plugin-viewing-options",
+ "talk-plugin-profile-settings"
]
}
diff --git a/plugins/talk-plugin-ignore-user/client/index.js b/plugins/talk-plugin-ignore-user/client/index.js
index 3284915db..a7cb6c886 100644
--- a/plugins/talk-plugin-ignore-user/client/index.js
+++ b/plugins/talk-plugin-ignore-user/client/index.js
@@ -8,7 +8,7 @@ export default {
slots: {
authorMenuActions: [IgnoreUserAction],
ignoreUserConfirmation: [IgnoreUserConfirmation],
- profileSections: [IgnoredUserSection],
+ profileSettings: [IgnoredUserSection],
},
translations,
mutations: {
diff --git a/plugins/talk-plugin-profile-settings/.eslintrc.json b/plugins/talk-plugin-profile-settings/.eslintrc.json
new file mode 100644
index 000000000..78f7c2397
--- /dev/null
+++ b/plugins/talk-plugin-profile-settings/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+ "extends": "@coralproject/eslint-config-talk"
+}
diff --git a/plugins/talk-plugin-profile-settings/client/.eslintrc.json b/plugins/talk-plugin-profile-settings/client/.eslintrc.json
new file mode 100644
index 000000000..c8a6db18a
--- /dev/null
+++ b/plugins/talk-plugin-profile-settings/client/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+ "extends": "@coralproject/eslint-config-talk/client"
+}
diff --git a/plugins/talk-plugin-profile-settings/client/components/Tab.js b/plugins/talk-plugin-profile-settings/client/components/Tab.js
new file mode 100644
index 000000000..86df0e8d1
--- /dev/null
+++ b/plugins/talk-plugin-profile-settings/client/components/Tab.js
@@ -0,0 +1,8 @@
+import React from 'react';
+import { t } from 'plugin-api/beta/client/services';
+
+const Tab = () => {
+ return
{t('talk-plugin-profile-settings.tab')};
+};
+
+export default Tab;
diff --git a/plugins/talk-plugin-profile-settings/client/components/TabPane.js b/plugins/talk-plugin-profile-settings/client/components/TabPane.js
new file mode 100644
index 000000000..c0347a95c
--- /dev/null
+++ b/plugins/talk-plugin-profile-settings/client/components/TabPane.js
@@ -0,0 +1,21 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Slot } from 'plugin-api/beta/client/components';
+
+class TabPane extends React.Component {
+ render() {
+ const { data, root } = this.props;
+ return (
+
+
+
+ );
+ }
+}
+
+TabPane.propTypes = {
+ data: PropTypes.object,
+ root: PropTypes.object,
+};
+
+export default TabPane;
diff --git a/plugins/talk-plugin-profile-settings/client/containers/TabPane.js b/plugins/talk-plugin-profile-settings/client/containers/TabPane.js
new file mode 100644
index 000000000..6384c7160
--- /dev/null
+++ b/plugins/talk-plugin-profile-settings/client/containers/TabPane.js
@@ -0,0 +1,26 @@
+import React from 'react';
+import { compose, gql } from 'react-apollo';
+import TabPane from '../components/TabPane';
+import { withFragments } from 'plugin-api/beta/client/hocs';
+import { getSlotFragmentSpreads } from 'plugin-api/beta/client/utils';
+
+const slots = ['profileSettings'];
+
+class TabPaneContainer extends React.Component {
+ render() {
+ return
;
+ }
+}
+
+const enhance = compose(
+ withFragments({
+ root: gql`
+ fragment TalkProfileSettings_TabPane_root on RootQuery {
+ __typename
+ ${getSlotFragmentSpreads(slots, 'root')}
+ }
+ `,
+ })
+);
+
+export default enhance(TabPaneContainer);
diff --git a/plugins/talk-plugin-profile-settings/client/index.js b/plugins/talk-plugin-profile-settings/client/index.js
new file mode 100644
index 000000000..00e37a0f1
--- /dev/null
+++ b/plugins/talk-plugin-profile-settings/client/index.js
@@ -0,0 +1,11 @@
+import Tab from './components/Tab';
+import TabPane from './containers/TabPane';
+import translations from './translations.yml';
+
+export default {
+ slots: {
+ profileTabs: [Tab],
+ profileTabPanes: [TabPane],
+ },
+ translations,
+};
diff --git a/plugins/talk-plugin-profile-settings/client/translations.yml b/plugins/talk-plugin-profile-settings/client/translations.yml
new file mode 100644
index 000000000..cd8edb415
--- /dev/null
+++ b/plugins/talk-plugin-profile-settings/client/translations.yml
@@ -0,0 +1,27 @@
+en:
+ talk-plugin-profile-settings:
+ tab: Settings
+de:
+ talk-plugin-profile-settings:
+ tab: Einstellungen
+es:
+ talk-plugin-profile-settings:
+ tab: Configuración
+fr:
+ talk-plugin-profile-settings:
+ tab: Paramètres
+nl_NL:
+ talk-plugin-profile-settings:
+ tab: Instellingen
+da:
+ talk-plugin-profile-settings:
+ tab: Indstillinger
+pt_PR:
+ talk-plugin-profile-settings:
+ tab: Configurações
+zh_TW:
+ talk-plugin-profile-settings:
+ tab: 設置
+zh_CN:
+ talk-plugin-profile-settings:
+ tab: 设置
diff --git a/plugins/talk-plugin-profile-settings/index.js b/plugins/talk-plugin-profile-settings/index.js
new file mode 100644
index 000000000..f053ebf79
--- /dev/null
+++ b/plugins/talk-plugin-profile-settings/index.js
@@ -0,0 +1 @@
+module.exports = {};