Add admin block/unblock listing controls to view listing page #317

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.

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

Open

Copilot wants to merge 85 commits into main from copilot/add-block-unblock-listing-buttons-again

...nt/admin-dashboard/components/admin-listings-table/admin-listings-table.container.graphql

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -1,12 +1,12 @@
  
    # Inline fragment (previously in admin-listings-table.fragment.graphql)

    fragment AdminListingFields on ListingAll {

        id

        title

        state

        images

        createdAt

        sharingPeriodStart

        sharingPeriodEnd

      id

      title

      state

      images

      createdAt

      sharingPeriodStart

      sharingPeriodEnd

    }

    query AdminListingsTableContainerAdminListings(

    @@ -42,5 +42,19 @@ mutation AdminListingsTableContainerDeleteListing($id: ObjectID!) {
  
    }

    mutation AdminListingsTableContainerUnblockListing($id: ObjectID!) {

      unblockListing(id: $id)

      unblockListing(id: $id) {

        status {

          success

          errorMessage

        }

        listing {

          id

          title

          state

          images

          createdAt

          sharingPeriodStart

          sharingPeriodEnd

        }

      }

    }

...dmin-dashboard/components/admin-listings-table/admin-listings-table.container.stories.tsx

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -8,7 +8,7 @@ import {
  
    import {

    	AdminListingsTableContainerAdminListingsDocument,

    	AdminListingsTableContainerDeleteListingDocument,

    	AdminListingsTableContainerUnblockListingDocument,

        AdminListingsTableContainerUnblockListingDocument

    } from '../../../../../../../generated.tsx';

    const meta: Meta<typeof AdminListings> = {

    @@ -56,10 +56,11 @@ const meta: Meta<typeof AdminListings> = {
  
    					},

    					result: {

    						data: {

    							unblockItemListing: {

    								__typename: 'MutationStatus',

    							unblockListing: {

    								__typename: 'BlockListingResult',

    								id: 'listing-1',

    								state: 'Published',

    								success: true,

    								errorMessage: null,

    							},

    						},

    					},

...n-dashboard/components/admin-listings-table/admin-listings-table.view-listing.stories.tsx

-Original file line number
+Diff line change
@@ Expand Up @@
     import {
     	AdminListingsTableContainerAdminListingsDocument,
     	AdminListingsTableContainerDeleteListingDocument,
-    	AdminListingsTableContainerUnblockListingDocument,
+    	BlockListingContainerUnblockListingDocument,
+        AdminListingsTableContainerUnblockListingDocument
     } from '../../../../../../../generated.tsx';
     const meta = {
@@ Expand Down Expand Up / @@ -49,14 +50,15 @@ const meta = { @@
     				},
     				{
     					request: {
-    						query: AdminListingsTableContainerUnblockListingDocument,
+    						query: BlockListingContainerUnblockListingDocument,
     					},
     					result: {
     						data: {
-    							unblockItemListing: {
-    								__typename: 'MutationStatus',
+    							unblockListing: {
+    								__typename: 'BlockListingResult',
+    								id: 'listing-123',
+    								state: 'Published',
     								success: true,
-    								errorMessage: null,
     							},
     						},
     					},
@@ Expand Down @@

...unt/admin-dashboard/components/admin-listings-table/admin-listings-table.view-listing.tsx

            
                      Original file line number
                      Diff line number
                      Diff line change
                  
    @@ -16,7 +16,7 @@ import { useNavigate, useParams } from 'react-router-dom';
  
    import {

    	AdminListingsTableContainerAdminListingsDocument,

    	AdminListingsTableContainerDeleteListingDocument,

    	AdminListingsTableContainerUnblockListingDocument,

    	BlockListingContainerUnblockListingDocument,

    } from '../../../../../../../generated.tsx';

    export function AdminViewListing(): ReactElement {

    @@ -37,7 +37,7 @@ export function AdminViewListing(): ReactElement {
  
    	);

    	const [unblockListingMutation] = useMutation(

    		AdminListingsTableContainerUnblockListingDocument,

    		BlockListingContainerUnblockListingDocument,

    	);

    	const [deleteListingMutation] = useMutation(

...hrift/src/components/layouts/home/components/view-listing/block-listing-modal.stories.tsx

-Original file line number
+Diff line change
@@ -0,0 +1,44 @@
+    import type { Meta, StoryObj } from '@storybook/react';
+    import { BlockListingModal } from './block-listing-modal';
+    const meta: Meta<typeof BlockListingModal> = {
+    	title: 'Layouts/Home/View Listing/Block Listing Modal',
+    	component: BlockListingModal,
+    	parameters: {
+    		layout: 'centered',
+    	},
+    	tags: ['autodocs'],
+    	argTypes: {
+    		visible: { control: 'boolean' },
+    		loading: { control: 'boolean' },
+    		onConfirm: { action: 'confirmed' },
+    		onCancel: { action: 'cancelled' },
+    	},
+    };
+    export default meta;
+    type Story = StoryObj<typeof meta>;
+    export const Default: Story = {
+    	args: {
+    		visible: true,
+    		listingTitle: 'City Bike',
+    		loading: false,
+    	},
+    };
+    export const Loading: Story = {
+    	args: {
+    		visible: true,
+    		listingTitle: 'City Bike',
+    		loading: true,
+    	},
+    };
+    export const Closed: Story = {
+    	args: {
+    		visible: false,
+    		listingTitle: 'City Bike',
+    		loading: false,
+    	},
+    };

...i-sharethrift/src/components/layouts/home/components/view-listing/block-listing-modal.tsx

-Original file line number
+Diff line change
@@ -0,0 +1,55 @@
+    import { Button, Modal } from 'antd';
+    interface BlockListingModalProps {
+    	visible: boolean;
+    	listingTitle: string;
+    	onConfirm: () => void;
+    	onCancel: () => void;
+    	loading?: boolean;
+    }
+    export const BlockListingModal: React.FC<BlockListingModalProps> = ({
+    	visible,
+    	listingTitle,
+    	onConfirm,
+    	onCancel,
+    	loading = false,
+    }) => {
+    	const handleOk = () => {
+    		onConfirm();
+    	};
+    	const handleCancel = () => {
+    		onCancel();
+    	};
+    	return (
+    		<Modal
+    			title="Block Listing"
+    			open={visible}
+    			onCancel={handleCancel}
+    			footer={[
+    				<Button key="cancel" onClick={handleCancel}>
+    					Cancel
+    				</Button>,
+    				<Button
+    					key="block"
+    					type="primary"
+    					danger
+    					onClick={handleOk}
+    					loading={loading}
+    				>
+    					Block
+    				</Button>,
+    			]}
+    		>
+    			<p style={{ marginBottom: 16 }}>
+    				You are about to block the listing: <strong>{listingTitle}</strong>
+    			</p>
+    			<p>
+    				Are you sure you want to block this listing? This will make it
+    				unavailable to all users except administrators.
+    			</p>
+    		</Modal>
+    	);
+    };

...hrift/src/components/layouts/home/components/view-listing/block-listing.container.graphql

-Original file line number
+Diff line change
@@ -0,0 +1,25 @@
+    mutation BlockListingContainerBlockListing($id: ObjectID!) {
+      blockListing(id: $id) {
+        status {
+          success
+          errorMessage
+        }
+        listing {
+          id
+          state
+        }
+      }
+    }
+    mutation BlockListingContainerUnblockListing($id: ObjectID!) {
+      unblockListing(id: $id) {
+        status {
+          success
+          errorMessage
+        }
+        listing {
+          id
+          state
+        }
+      }
+    }

...t/src/components/layouts/home/components/view-listing/block-listing.container.stories.tsx

-Original file line number
+Diff line change
@@ -0,0 +1,144 @@
+    import type { Meta, StoryObj } from '@storybook/react';
+    import {
+    	BlockListingContainerBlockListingDocument,
+    	BlockListingContainerUnblockListingDocument,
+    	ViewListingDocument,
+    } from '../../../../../generated.tsx';
+    import { withMockApolloClient } from '../../../../../test-utils/storybook-decorators.tsx';
+    import { BlockListingButton } from './block-listing.container.tsx';
+    const meta: Meta<typeof BlockListingButton> = {
+    	title: 'Containers/BlockListingButton',
+    	component: BlockListingButton,
+    	parameters: {
+    		layout: 'centered',
+    		apolloClient: {
+    			mocks: [
+    				{
+    					request: {
+    						query: BlockListingContainerBlockListingDocument,
+    						variables: { id: 'listing-1' },
+    					},
+    					result: {
+    						data: {
+    							blockListing: {
+    								__typename: 'ItemListing',
+    								id: 'listing-1',
+    								isBlocked: true,
+    							},
+    						},
+    					},
+    				},
+    				{
+    					request: {
+    						query: BlockListingContainerUnblockListingDocument,
+    						variables: { id: 'listing-1' },
+    					},
+    					result: {
+    						data: {
+    							unblockListing: {
+    								__typename: 'ItemListing',
+    								id: 'listing-1',
+    								isBlocked: false,
+    							},
+    						},
+    					},
+    				},
+    				{
+    					request: {
+    						query: ViewListingDocument,
+    						variables: { id: 'listing-1' },
+    					},
+    					result: {
+    						data: {
+    							itemListing: {
+    								__typename: 'ItemListing',
+    								id: 'listing-1',
+    								title: 'City Bike',
+    								description: 'A great city bike',
+    								category: 'Sports & Outdoors',
+    								location: 'Toronto, ON',
+    								state: 'Published',
+    								images: [],
+    								sharingPeriodStart: '2025-01-01',
+    								sharingPeriodEnd: '2025-12-31',
+    								createdAt: '2025-01-01T00:00:00Z',
+    								updatedAt: '2025-01-01T00:00:00Z',
+    								isBlocked: false,
+    								sharer: {
+    									__typename: 'PersonalUser',
+    									id: 'user-1',
+    									profile: {
+    										firstName: 'John',
+    										lastName: 'Doe',
+    									},
+    								},
+    							},
+    						},
+    					},
+    				},
+    			],
+    		},
+    	},
+    	decorators: [withMockApolloClient],
+    	tags: ['autodocs'],
+    	argTypes: {
+    		listingId: { control: 'text' },
+    		listingTitle: { control: 'text' },
+    		isBlocked: { control: 'boolean' },
+    		sharerName: { control: 'text' },
+    		renderModals: { control: 'boolean' },
+    	},
+    };
+    export default meta;
+    type Story = StoryObj<typeof meta>;
+    export const BlockButton: Story = {
+    	args: {
+    		listingId: 'listing-1',
+    		listingTitle: 'City Bike',
+    		isBlocked: false,
+    		sharerName: 'user-1',
+    		renderModals: true,
+    	},
+    };
+    export const UnblockButton: Story = {
+    	args: {
+    		listingId: 'listing-1',
+    		listingTitle: 'City Bike',
+    		isBlocked: true,
+    		sharerName: 'user-1',
+    		renderModals: true,
+    	},
+    };
+    export const BlockButtonWithoutModals: Story = {
+    	args: {
+    		listingId: 'listing-1',
+    		listingTitle: 'City Bike',
+    		isBlocked: false,
+    		sharerName: 'user-1',
+    		renderModals: false,
+    	},
+    };
+    export const UnblockButtonWithoutModals: Story = {
+    	args: {
+    		listingId: 'listing-1',
+    		listingTitle: 'City Bike',
+    		isBlocked: true,
+    		sharerName: 'user-1',
+    		renderModals: false,
+    	},
+    };
+    export const WithDefaultSharer: Story = {
+    	args: {
+    		listingId: 'listing-1',
+    		listingTitle: 'Professional Camera',
+    		isBlocked: false,
+    		renderModals: true,
+    	},
+    };

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add admin block/unblock listing controls to view listing page #317

Uh oh!

Diff view

Diff view

There are no files selected for viewing

Uh oh!

Uh oh!

Uh oh!

Add admin block/unblock listing controls to view listing page #317

Are you sure you want to change the base?

Uh oh!

Add admin block/unblock listing controls to view listing page #317

Uh oh!

Uh oh!

Diff view

Diff view

There are no files selected for viewing

Uh oh!

Uh oh!

Uh oh!