review-list.tsx 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. import { graphql } from '@/graphql/graphql';
  2. import { Trans } from '@lingui/react/macro';
  3. import { DashboardRouteDefinition, DetailPageButton, ListPage } from '@vendure/dashboard';
  4. const getReviewList = graphql(`
  5. query GetProductReviews($options: ProductReviewListOptions) {
  6. productReviews(options: $options) {
  7. items {
  8. id
  9. createdAt
  10. updatedAt
  11. product {
  12. id
  13. name
  14. }
  15. productVariant {
  16. id
  17. name
  18. sku
  19. }
  20. summary
  21. body
  22. rating
  23. authorName
  24. authorLocation
  25. upvotes
  26. downvotes
  27. state
  28. response
  29. responseCreatedAt
  30. }
  31. }
  32. }
  33. `);
  34. export const reviewList: DashboardRouteDefinition = {
  35. navMenuItem: {
  36. sectionId: 'catalog',
  37. id: 'reviews',
  38. url: '/reviews',
  39. title: 'Product Reviews',
  40. requiresPermission: ['ReadCatalog'],
  41. },
  42. path: '/reviews',
  43. loader: () => ({
  44. breadcrumb: 'Reviews',
  45. }),
  46. component: route => (
  47. <ListPage
  48. pageId="review-list"
  49. title={<Trans>Product Reviews</Trans>}
  50. listQuery={getReviewList}
  51. route={route}
  52. defaultVisibility={{
  53. productVariant: false,
  54. product: false,
  55. summary: false,
  56. rating: false,
  57. authorName: false,
  58. reviewerName: false,
  59. responseCreatedAt: false,
  60. response: false,
  61. upvotes: false,
  62. downvotes: false,
  63. }}
  64. customizeColumns={{
  65. id: {
  66. header: 'ID',
  67. cell: ({ row }) => {
  68. return <DetailPageButton id={row.original.id} label={row.original.id} />;
  69. },
  70. },
  71. product: {
  72. header: 'Product',
  73. cell: ({ row }) => {
  74. return <DetailPageButton id={row.original.id} label={row.original.product.name} />;
  75. },
  76. },
  77. reviewerName: {
  78. header: 'Reviewer Name',
  79. cell: ({ row }) => {
  80. return <div className="text-red-500">{row.original.customFields?.reviewerName}</div>;
  81. },
  82. },
  83. }}
  84. />
  85. ),
  86. };