mirror of
https://github.com/filecoin-project/slate.git
synced 2024-08-17 17:50:50 +03:00
fixed scrolling of pages that are empty and removed filter from 404 and signin pages
This commit is contained in:
parent
42eda96cdb
commit
c18d49f365
@ -279,3 +279,12 @@ export const PROFILE_PREVIEW_GRID = (theme) => css`
|
||||
grid-template-columns: repeat(auto-fill, minmax(${theme.grids.profile.mobile.width}px, 1fr));
|
||||
}
|
||||
`;
|
||||
|
||||
export const PAGE_CONTENT_WRAPPER = (theme) => css`
|
||||
width: 100%;
|
||||
min-height: calc(100vh - ${theme.sizes.filterNavbar}px) - ${theme.sizes.header}px;
|
||||
padding: 20px 20px 44px;
|
||||
@media (max-width: ${theme.sizes.mobile}px) {
|
||||
padding: 16px 16px 44px;
|
||||
}
|
||||
`;
|
||||
|
@ -520,7 +520,7 @@ export default class ApplicationPage extends React.Component {
|
||||
>
|
||||
<Filter
|
||||
isProfilePage={isProfilePage}
|
||||
isActive={true}
|
||||
isActive={page.id !== "NAV_SIGN_IN" && page.id !== "NAV_ERROR"}
|
||||
viewer={this.state.viewer}
|
||||
page={page}
|
||||
data={this.state.data}
|
||||
|
@ -5,7 +5,8 @@ import { css } from "@emotion/react";
|
||||
|
||||
const STYLES_EMPTY_STATE = css`
|
||||
width: 100%;
|
||||
height: 50vh;
|
||||
height: 100%;
|
||||
min-height: 50vh;
|
||||
color: ${Constants.semantic.textGray};
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
@ -153,7 +153,7 @@ function Profile({ viewer, data, page, onAction, ...props }) {
|
||||
const isOwner = viewer?.id === data.id;
|
||||
|
||||
const [isFollowing, setIsFollowing] = React.useState(() =>
|
||||
isOwner
|
||||
isOwner || !viewer
|
||||
? false
|
||||
: !!viewer?.following.some((entry) => {
|
||||
return entry.id === data.id;
|
||||
@ -161,11 +161,12 @@ function Profile({ viewer, data, page, onAction, ...props }) {
|
||||
);
|
||||
|
||||
React.useEffect(() => {
|
||||
let updatedIsFollowing = isOwner
|
||||
? false
|
||||
: !!viewer?.following.some((entry) => {
|
||||
return entry.id === data.id;
|
||||
});
|
||||
let updatedIsFollowing =
|
||||
isOwner || !viewer
|
||||
? false
|
||||
: !!viewer?.following.some((entry) => {
|
||||
return entry.id === data.id;
|
||||
});
|
||||
setIsFollowing(updatedIsFollowing);
|
||||
}, [viewer?.following, data?.id]);
|
||||
|
||||
|
@ -173,22 +173,13 @@ function Dismiss({ css, ...props }) {
|
||||
* Content
|
||||
* -----------------------------------------------------------------------------------------------*/
|
||||
|
||||
const STYLES_SEARCH_CONTENT = (theme) => css`
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
padding: calc(20px + ${theme.sizes.filterNavbar}px) 24px 44px;
|
||||
@media (max-width: ${theme.sizes.mobile}px) {
|
||||
padding: calc(31px + ${theme.sizes.filterNavbar}px) 16px 44px;
|
||||
}
|
||||
`;
|
||||
|
||||
function Content({ onAction, viewer, page }) {
|
||||
const { results } = useSearchStore();
|
||||
const { files, slates } = results;
|
||||
|
||||
if (results.files.length === 0 && results.slates.length === 0) {
|
||||
return (
|
||||
<div css={STYLES_SEARCH_CONTENT}>
|
||||
<div css={Styles.PAGE_CONTENT_WRAPPER}>
|
||||
<EmptyState>
|
||||
<FileTypeGroup />
|
||||
<div style={{ marginTop: 24 }}>Sorry we couldn't find any results.</div>
|
||||
@ -198,7 +189,7 @@ function Content({ onAction, viewer, page }) {
|
||||
}
|
||||
|
||||
return (
|
||||
<div css={STYLES_SEARCH_CONTENT}>
|
||||
<div css={Styles.PAGE_CONTENT_WRAPPER}>
|
||||
<DataView
|
||||
key="scene-files-folder"
|
||||
isOwner={true}
|
||||
|
@ -18,15 +18,6 @@ const STYLES_SCENE_PAGE = css`
|
||||
}
|
||||
`;
|
||||
|
||||
const STYLES_DATAVIEW_WRAPPER = (theme) => css`
|
||||
width: 100%;
|
||||
min-height: calc(100vh - ${theme.sizes.filterNavbar}px) - ${theme.sizes.header}px;
|
||||
padding: 20px 20px 44px;
|
||||
@media (max-width: ${theme.sizes.mobile}px) {
|
||||
padding: 16px 16px 44px;
|
||||
}
|
||||
`;
|
||||
|
||||
export default function SceneFilesFolder({ viewer, page, onAction, isMobile }) {
|
||||
const [index, setIndex] = React.useState(-1);
|
||||
|
||||
@ -49,7 +40,7 @@ export default function SceneFilesFolder({ viewer, page, onAction, isMobile }) {
|
||||
index={index}
|
||||
onChange={(index) => setIndex(index)}
|
||||
/>
|
||||
<div css={STYLES_DATAVIEW_WRAPPER}>
|
||||
<div css={Styles.PAGE_CONTENT_WRAPPER}>
|
||||
{objects.length ? (
|
||||
<DataView
|
||||
key="scene-files-folder"
|
||||
|
@ -23,15 +23,6 @@ const STYLES_LOADER = css`
|
||||
width: 100%;
|
||||
`;
|
||||
|
||||
const STYLES_DATAVIEW_WRAPPER = (theme) => css`
|
||||
width: 100%;
|
||||
min-height: calc(100vh - ${theme.sizes.filterNavbar}px) - ${theme.sizes.header}px;
|
||||
padding: 20px 20px 44px;
|
||||
@media (max-width: ${theme.sizes.mobile}px) {
|
||||
padding: 16px 16px 44px;
|
||||
}
|
||||
`;
|
||||
|
||||
export default class SceneProfile extends React.Component {
|
||||
state = {
|
||||
notFound: false,
|
||||
@ -169,10 +160,12 @@ export default class SceneProfile extends React.Component {
|
||||
url={`${Constants.hostname}${this.props.page.pathname}`}
|
||||
>
|
||||
<ScenePage>
|
||||
<EmptyState>
|
||||
<SVG.Users height="24px" style={{ marginBottom: 24 }} />
|
||||
<div>This user doesn't have any public content</div>
|
||||
</EmptyState>
|
||||
<div css={Styles.PAGE_CONTENT_WRAPPER}>
|
||||
<EmptyState>
|
||||
<SVG.Users height="24px" style={{ marginBottom: 24 }} />
|
||||
<div>This user doesn't have any public content</div>
|
||||
</EmptyState>
|
||||
</div>
|
||||
</ScenePage>
|
||||
</WebsitePrototypeWrapper>
|
||||
);
|
||||
@ -199,7 +192,7 @@ export default class SceneProfile extends React.Component {
|
||||
url={`${Constants.hostname}${this.props.page.pathname}`}
|
||||
image={image}
|
||||
>
|
||||
<div css={STYLES_DATAVIEW_WRAPPER}>
|
||||
<div css={Styles.PAGE_CONTENT_WRAPPER}>
|
||||
{user.library?.length ? (
|
||||
<DataView
|
||||
key="scene-files-folder"
|
||||
|
@ -204,10 +204,12 @@ export default class SceneSlate extends React.Component {
|
||||
url={`${Constants.hostname}${this.props.page.pathname}`}
|
||||
>
|
||||
<ScenePage>
|
||||
<EmptyState>
|
||||
<SVG.Layers height="24px" style={{ marginBottom: 24 }} />
|
||||
<div>We were unable to locate that collection</div>
|
||||
</EmptyState>
|
||||
<div css={Styles.PAGE_CONTENT_WRAPPER}>
|
||||
<EmptyState>
|
||||
<SVG.Layers height="24px" style={{ marginBottom: 24 }} />
|
||||
<div>We were unable to locate that collection</div>
|
||||
</EmptyState>
|
||||
</div>
|
||||
</ScenePage>
|
||||
</WebsitePrototypeWrapper>
|
||||
);
|
||||
@ -268,15 +270,6 @@ const STYLES_RESET_SCENE_PAGE_PADDING = css`
|
||||
}
|
||||
`;
|
||||
|
||||
const STYLES_DATAVIEW_WRAPPER = (theme) => css`
|
||||
width: 100%;
|
||||
min-height: calc(100vh - ${theme.sizes.filterNavbar}px) - ${theme.sizes.header}px;
|
||||
padding: 20px 20px 44px;
|
||||
@media (max-width: ${theme.sizes.mobile}px) {
|
||||
padding: 16px 16px 44px;
|
||||
}
|
||||
`;
|
||||
|
||||
class SlatePage extends React.Component {
|
||||
_copy = null;
|
||||
_timeout = null;
|
||||
@ -452,7 +445,7 @@ class SlatePage extends React.Component {
|
||||
index={this.state.index}
|
||||
onChange={(index) => this.setState({ index })}
|
||||
/>
|
||||
<div css={STYLES_DATAVIEW_WRAPPER}>
|
||||
<div css={Styles.PAGE_CONTENT_WRAPPER}>
|
||||
<DataView
|
||||
key="scene-files-folder"
|
||||
type="collection"
|
||||
@ -467,7 +460,7 @@ class SlatePage extends React.Component {
|
||||
</div>
|
||||
</>
|
||||
) : isOwner ? (
|
||||
<div>
|
||||
<div css={Styles.PAGE_CONTENT_WRAPPER}>
|
||||
<EmptyState>
|
||||
<FileTypeGroup />
|
||||
<div style={{ marginTop: 24 }}>
|
||||
@ -476,7 +469,7 @@ class SlatePage extends React.Component {
|
||||
</EmptyState>
|
||||
</div>
|
||||
) : (
|
||||
<div>
|
||||
<div css={Styles.PAGE_CONTENT_WRAPPER}>
|
||||
<EmptyState>There's nothing here :)</EmptyState>
|
||||
</div>
|
||||
)}
|
||||
|
Loading…
Reference in New Issue
Block a user