mirror of
https://github.com/sakaljurgis/best-choice.git
synced 2026-07-08 21:47:40 +00:00
update price in list on price update
This commit is contained in:
@@ -5,10 +5,16 @@ import { ItemPricesPanel } from './item-prices-panel';
|
||||
interface ItemPricesModalProps {
|
||||
isOpen: boolean;
|
||||
item: Item | null;
|
||||
projectId: string | undefined;
|
||||
onClose: () => void;
|
||||
}
|
||||
|
||||
export function ItemPricesModal({ isOpen, item, onClose }: ItemPricesModalProps) {
|
||||
export function ItemPricesModal({
|
||||
isOpen,
|
||||
item,
|
||||
projectId,
|
||||
onClose
|
||||
}: ItemPricesModalProps) {
|
||||
useEffect(() => {
|
||||
if (!isOpen) {
|
||||
return;
|
||||
@@ -53,7 +59,7 @@ export function ItemPricesModal({ isOpen, item, onClose }: ItemPricesModalProps)
|
||||
<h2 className="text-xl font-semibold text-slate-900">Edit Item Prices</h2>
|
||||
<p className="text-sm text-slate-500">{itemTitle}</p>
|
||||
</header>
|
||||
<ItemPricesPanel itemId={item.id} />
|
||||
<ItemPricesPanel itemId={item.id} projectId={projectId} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -6,9 +6,10 @@ const priceConditionOptions: PriceCondition[] = ['new', 'used'];
|
||||
|
||||
interface ItemPricesPanelProps {
|
||||
itemId: string;
|
||||
projectId: string | undefined;
|
||||
}
|
||||
|
||||
export function ItemPricesPanel({ itemId }: ItemPricesPanelProps) {
|
||||
export function ItemPricesPanel({ itemId, projectId }: ItemPricesPanelProps) {
|
||||
const [condition, setCondition] = useState<PriceCondition>('new');
|
||||
const [amount, setAmount] = useState('');
|
||||
const [currency, setCurrency] = useState('USD');
|
||||
@@ -17,7 +18,7 @@ export function ItemPricesPanel({ itemId }: ItemPricesPanelProps) {
|
||||
const [formError, setFormError] = useState<string | null>(null);
|
||||
|
||||
const pricesQuery = useItemPricesQuery(itemId, true);
|
||||
const createPriceMutation = useCreateItemPriceMutation(itemId);
|
||||
const createPriceMutation = useCreateItemPriceMutation(itemId, projectId);
|
||||
|
||||
const prices = pricesQuery.data?.data ?? [];
|
||||
const creationError = useMemo(
|
||||
|
||||
@@ -314,6 +314,7 @@ export function ProjectDetailPage() {
|
||||
<ItemPricesModal
|
||||
isOpen={Boolean(priceModalItem)}
|
||||
item={priceModalItem}
|
||||
projectId={projectId}
|
||||
onClose={handlePricesModalClose}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -1,10 +1,11 @@
|
||||
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
|
||||
import {
|
||||
createItemPrice,
|
||||
fetchItemPrices,
|
||||
type CreateItemPricePayload,
|
||||
type ItemPricesResponse
|
||||
} from '../api/item-prices';
|
||||
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
|
||||
import { projectsKeys } from './projects';
|
||||
|
||||
const DEFAULT_LIMIT = 50;
|
||||
|
||||
@@ -23,7 +24,10 @@ export const useItemPricesQuery = (
|
||||
queryFn: ({ signal }) => fetchItemPrices(itemId!, { limit: DEFAULT_LIMIT, offset: 0, signal })
|
||||
});
|
||||
|
||||
export const useCreateItemPriceMutation = (itemId: string | undefined) => {
|
||||
export const useCreateItemPriceMutation = (
|
||||
itemId: string | undefined,
|
||||
projectId: string | undefined
|
||||
) => {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
return useMutation({
|
||||
@@ -39,6 +43,10 @@ export const useCreateItemPriceMutation = (itemId: string | undefined) => {
|
||||
return;
|
||||
}
|
||||
queryClient.invalidateQueries({ queryKey: itemPricesKeys.list(itemId) });
|
||||
if (projectId) {
|
||||
queryClient.invalidateQueries({ queryKey: projectsKeys.items(projectId) });
|
||||
queryClient.invalidateQueries({ queryKey: projectsKeys.detail(projectId) });
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user