Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: APP-194 add prev/next post functionality #2398

Merged
merged 4 commits into from
Aug 8, 2024
Merged

feat: APP-194 add prev/next post functionality #2398

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
9cf34d3
feat: add prev/next post functionality
blushi Jun 24, 2024
c950940
fix: created at format
blushi Jul 18, 2024
7f32c12
chore: files parse check
blushi Jul 30, 2024
9392e80
fix: prev/next button display
blushi Jul 31, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion web-components/src/components/organisms/PostFiles/PostFiles.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ const PostFiles = ({

useEffect(() => {
async function parseFiles() {
files.map(async file => {
files?.map(async file => {
const fileUrl = file.url;
if (fileUrl) {
const preview = await parseFile({
Expand Down
2 changes: 2 additions & 0 deletions ...arketplace/src/lib/queries/react-query/registry-server/getPostQuery/getPostQuery.types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,8 @@ export type Post = {
}
| undefined;
error?: string;
prevIri?: string;
nextIri?: string;
};

export type ReactQueryGetPostQueryResponse = QueryObserverOptions<Post | null>;
Expand Down
42 changes: 31 additions & 11 deletions web-marketplace/src/pages/Post/Post.Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,21 +1,41 @@
import { useNavigate } from 'react-router-dom';

import OutlinedButton from 'web-components/src/components/buttons/OutlinedButton';
import ArrowDownIcon from 'web-components/src/components/icons/ArrowDownIcon';
import Section from 'web-components/src/components/section';

import { NEXT, PREV } from './Post.constants';

export const PostFooter = () => {
// TODO add button features (APP-23)
type Props = {
prevIri?: string;
nextIri?: string;
};
export const PostFooter = ({ prevIri, nextIri }: Props) => {
const navigate = useNavigate();
return (
<Section className="flex justify-between sm:px-0 pb-[100px] py-0 max-w-[750px] m-auto">
<OutlinedButton className="text-sm">
<ArrowDownIcon className="w-[24px] h-[24px] mr-10" direction="prev" />
{PREV}
</OutlinedButton>
<OutlinedButton className="text-sm">
{NEXT}
<ArrowDownIcon className="w-[24px] h-[24px] ml-10" direction="next" />
</OutlinedButton>
<Section
className={`flex ${
prevIri ? 'justify-between' : 'justify-end'
} sm:px-0 pb-[100px] py-0 max-w-[750px] m-auto`}
>
{prevIri && (
<OutlinedButton
className="text-sm"
onClick={() => navigate(`/post/${prevIri}`)}
>
<ArrowDownIcon className="w-[24px] h-[24px] mr-10" direction="prev" />
{PREV}
</OutlinedButton>
)}
{nextIri && (
<OutlinedButton
className="text-sm"
onClick={() => navigate(`/post/${nextIri}`)}
>
{NEXT}
<ArrowDownIcon className="w-[24px] h-[24px] ml-10" direction="next" />
</OutlinedButton>
)}
</Section>
);
};
4 changes: 2 additions & 2 deletions web-marketplace/src/pages/Post/Post.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,7 @@ function Post(): JSX.Element {
creatorAccount={creatorAccount}
adminAccountId={adminAccountId}
creatorIsAdmin={creatorIsAdmin}
createdAt={createdAt}
createdAt={data?.createdAt}
privatePost={privatePost}
publicPost={publicPost}
privateFiles={privateFiles}
Expand Down Expand Up @@ -171,7 +171,7 @@ function Post(): JSX.Element {
}
/>

<PostFooter />
<PostFooter prevIri={data?.prevIri} nextIri={data?.nextIri} />
</>
)}
</>
Expand Down