diff --git a/components/core/Profile.js b/components/core/Profile.js
index fe7d6e32..92bf316e 100644
--- a/components/core/Profile.js
+++ b/components/core/Profile.js
@@ -3,25 +3,16 @@ import * as Constants from "~/common/constants";
import * as Strings from "~/common/strings";
import * as SVG from "~/common/svg";
import * as Actions from "~/common/actions";
-import * as Utilities from "~/common/utilities";
import * as Events from "~/common/custom-events";
-import * as Window from "~/common/window";
import * as Styles from "~/common/styles";
-import { useState } from "react";
import { Link } from "~/components/core/Link";
-import { GlobalCarousel } from "~/components/system/components/GlobalCarousel";
import { css } from "@emotion/react";
import { ButtonPrimary, ButtonSecondary } from "~/components/system/components/Buttons";
-import { TabGroup, SecondaryTabGroup } from "~/components/core/TabGroup";
-import { Boundary } from "~/components/system/components/fragments/Boundary";
-import { PopoverNavigation } from "~/components/system/components/PopoverNavigation";
-import { FileTypeGroup } from "~/components/core/FileTypeIcon";
+import { SecondaryTabGroup } from "~/components/core/TabGroup";
import { LoaderSpinner } from "~/components/system/components/Loaders";
import ProcessedText from "~/components/core/ProcessedText";
-import SlatePreviewBlocks from "~/components/core/SlatePreviewBlock";
-import DataView from "~/components/core/DataView";
import EmptyState from "~/components/core/EmptyState";
import ProfilePhoto from "~/components/core/ProfilePhoto";
import CollectionPreviewBlock from "~/components/core/CollectionPreviewBlock";
@@ -139,16 +130,6 @@ const STYLES_STAT = css`
flex-shrink: 0;
`;
-const STYLES_EXPLORE = css`
- font-size: ${Constants.typescale.lvl1};
- font-family: ${Constants.font.text};
- font-weight: 400;
- margin: 64px auto 64px auto;
- width: 120px;
- padding-top: 16px;
- border-top: 1px solid ${Constants.system.black};
-`;
-
const STYLES_BUTTON = css`
margin-bottom: 32px;
@@ -157,164 +138,12 @@ const STYLES_BUTTON = css`
}
`;
-const STYLES_ITEM_BOX = css`
- position: relative;
- justify-self: end;
- display: flex;
- align-items: center;
- justify-content: center;
- padding: 8px;
- margin-right: 16px;
- color: ${Constants.system.grayLight2};
-
- @media (max-width: ${Constants.sizes.mobile}px) {
- margin-right: 8px;
- }
-`;
-
-const STYLES_USER_ENTRY = css`
- display: grid;
- grid-template-columns: auto 1fr;
- align-items: center;
- font-size: ${Constants.typescale.lvl1};
- cursor: pointer;
- border: 1px solid ${Constants.semantic.borderGrayLight};
- border-radius: 4px;
- margin-bottom: 8px;
- background-color: ${Constants.system.white};
-`;
-
-const STYLES_USER = css`
- display: grid;
- grid-template-columns: auto 1fr;
- align-items: center;
- margin: 16px;
- color: ${Constants.system.blue};
- font-family: ${Constants.font.medium};
- font-size: ${Constants.typescale.lvl1};
-
- @media (max-width: ${Constants.sizes.mobile}px) {
- margin: 12px 16px;
- }
-`;
-
-const STYLES_DIRECTORY_PROFILE_IMAGE = css`
- background-color: ${Constants.semantic.bgLight};
- background-size: cover;
- background-position: 50% 50%;
- height: 24px;
- width: 24px;
- margin-right: 16px;
- border-radius: 4px;
- position: relative;
-`;
-
-const STYLES_DIRECTORY_STATUS_INDICATOR = css`
- position: absolute;
- bottom: 0;
- right: 0;
- width: 7px;
- height: 7px;
- border-radius: 50%;
- border: 1.2px solid ${Constants.system.green};
- background-color: ${Constants.system.green};
-`;
-
-const STYLES_MESSAGE = css`
- color: ${Constants.system.black};
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
-
- @media (max-width: 1000px) {
- display: none;
- }
-`;
-
-const STYLES_DIRECTORY_NAME = css`
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
-`;
-
// const STYLES_COPY_INPUT = css`
// pointer-events: none;
// position: absolute;
// opacity: 0;
// `;
-function UserEntry({ user, button, onClick, message, checkStatus }) {
- const isOnline = checkStatus({ id: user.id });
-
- return (
-
-
-
-
- {user.data.name || `@${user.username}`}
- {message ? {message} : null}
-
-
- {button}
-
- );
-}
-
-function FilesPage({
- library,
- user,
- isOwner,
- isMobile,
- viewer,
- onAction,
- resources,
- page,
- tab = "grid",
-}) {
- return (
-
- {isMobile ? null : (
-
,
- value: { tab: "grid", subtab: "files" },
- },
- {
- title:
,
- value: { tab: "table", subtab: "files" },
- },
- ]}
- value={tab}
- onAction={onAction}
- style={{ margin: "0 0 24px 0" }}
- />
- )}
- {library.length ? (
-
- ) : (
-
-
- This user does not have any public files yet
-
- )}
-
- );
-}
-
function CollectionsPage({
user,
viewer,
@@ -339,8 +168,8 @@ function CollectionsPage({
{
- e.stopPropagation();
- e.preventDefault();
- if (!id || selectedUser === id) {
- setSelectedUser(null);
- } else {
- setSelectedUser(id);
- }
- };
- const followUser = async (e, id) => {
- e.stopPropagation();
- e.preventDefault();
- selectUser(e, null);
- if (!viewer) {
- onLoginModal();
- return;
- }
- await Actions.createSubscription({
- userId: id,
- });
- };
-
- let peers = tab === "following" ? following : followers;
- peers = peers.map((relation) => {
- const following = !!(
- viewer &&
- viewer.following.some((subscription) => {
- return subscription.id === relation.id;
- }).length
- );
- let button =
- !viewer || relation.id !== viewer?.id ? (
- selectUser(e, relation.id)}>
-
- {selectedUser === relation.id ? (
-
selectUser(e)}
- >
- followUser(e, relation.id),
- },
- ],
- ]}
- />
-
- ) : null}
-
- ) : null;
-
- return (
-
-
-
- );
- });
-
- return (
-
-
-
- {peers?.length ? (
- peers
- ) : (
-
- {fetched ? (
-
-
- {tab === "following"
- ? `This user is not following anyone yet`
- : `This user does not have any followers yet`}
-
- ) : (
-
- )}
-
- )}
-
-
- );
-}
-
export default class Profile extends React.Component {
_ref = null;
state = {
contextMenu: null,
subscriptions: [],
- followers: [],
- following: [],
isFollowing:
this.props.external || this.props.user.id === this.props.viewer?.id
? false
@@ -506,10 +222,6 @@ export default class Profile extends React.Component {
index: -1,
};
- componentDidMount = () => {
- this.fetchSocial();
- };
-
componentDidUpdate = (prevProps) => {
if (!this.state.fetched && this.props.page.params !== prevProps.page.params) {
this.fetchSocial();
@@ -518,12 +230,9 @@ export default class Profile extends React.Component {
fetchSocial = async () => {
if (this.state.fetched) return;
- if (this.props.page.params?.subtab !== "peers" && this.props.page.params?.tab !== "subscribed")
- return;
- let following, followers, subscriptions;
+ if (this.props.page.params?.tab !== "subscribed") return;
+ let subscriptions;
if (this.props.user.id === this.props.viewer?.id) {
- following = this.props.viewer?.following;
- followers = this.props.viewer?.followers;
subscriptions = this.props.viewer?.subscriptions;
} else {
const query = { id: this.props.user.id };
@@ -531,19 +240,15 @@ export default class Profile extends React.Component {
if (Events.hasError(response)) {
return;
}
- following = response.following;
- followers = response.followers;
subscriptions = response.subscriptions;
}
this.setState({
- following: following,
- followers: followers,
subscriptions: subscriptions,
fetched: true,
});
};
- _handleHide = (e) => {
+ _handleHide = () => {
this.setState({ contextMenu: null });
};
@@ -582,33 +287,14 @@ export default class Profile extends React.Component {
};
render() {
- let subtab = this.props.page.params?.subtab
- ? this.props.page.params?.subtab
- : this.props.page.params?.cid
- ? "files"
- : "collections";
let tab = this.props.page.params?.tab;
- let library = this.props.user.library;
- let isOwner = this.props.isOwner;
- let user = this.props.user;
+ let { user, isOwner } = this.props;
+ let { fileCount } = user;
const showStatusIndicator = this.props.isAuthenticated;
return (
-
this.setState({ index })}
- />
@@ -650,7 +336,7 @@ export default class Profile extends React.Component {
- {library.length}{" "}
+ {fileCount}{" "}
Files
@@ -665,39 +351,12 @@ export default class Profile extends React.Component {
-
- {subtab === "files" ? (
-
- ) : null}
- {subtab === "collections" ? (
-
- ) : null}
- {subtab === "peers" ? (
-
- ) : null}
);