77 lines
2.7 KiB
TypeScript
77 lines
2.7 KiB
TypeScript
import { useAppDispatch, useAppSelector } from "@/app/store"
|
|
import { addAttribute, changeKey, deleteAttribute, deleteProduct, selectProductIds, selectProducts, updateAttribute, updateDimensions, updatePrice, updateProduct } from "@/features/product/productSlice"
|
|
import { Id, Product, dimensions_t } from "@/lib/product";
|
|
import { FlatList, SafeAreaView, StyleSheet, Text } from "react-native";
|
|
import { ProductEditorItem } from "./ProductEditorItem";
|
|
|
|
export const ProductEditor = ({}) => {
|
|
const products = useAppSelector(selectProducts) as Product [];
|
|
|
|
const dispatch = useAppDispatch();
|
|
|
|
function onProductDeleted(product_id: string) {
|
|
dispatch(deleteProduct(product_id));
|
|
}
|
|
|
|
function onAttributeDelete(product_id: string, attribute: string) {
|
|
dispatch(deleteAttribute({product_id: product_id, attribute}));
|
|
}
|
|
|
|
function onAttributeUpdated(product_id: string, attribute: string, value: string) {
|
|
dispatch(updateAttribute({product_id, attributeKey: attribute, attributeValue: value}));
|
|
}
|
|
|
|
function onAttributeAdded(product_id: Id) {
|
|
console.log("Adding attribute to %s", product_id);
|
|
dispatch(addAttribute(product_id));
|
|
}
|
|
|
|
function onPriceUpdated(product_id: string, pricePerUnit: number) {
|
|
dispatch(updatePrice({product_id, pricePerUnit}));
|
|
}
|
|
|
|
function onAttributeKeyChanged(product_id : string, oldKey : string, newKey : string) {
|
|
dispatch(changeKey({product_id, oldKey, newKey}))
|
|
}
|
|
|
|
function onDimensionUpdated(product_id: string, dimensions: dimensions_t) {
|
|
dispatch(updateDimensions({product_id, dimensions}));
|
|
}
|
|
|
|
return (
|
|
<SafeAreaView>
|
|
<h1 style={styles.h1}>Edit Products</h1>
|
|
<FlatList
|
|
data={products}
|
|
keyExtractor={(p, i) => `product-${p.id}`}
|
|
renderItem={
|
|
({item}) => {
|
|
|
|
return (
|
|
<ProductEditorItem
|
|
product={item}
|
|
onProductDeleted={onProductDeleted}
|
|
onAttributeDeleted={onAttributeDelete}
|
|
onAttributeKeyChanged={onAttributeKeyChanged}
|
|
onAttributeUpdated={onAttributeUpdated}
|
|
onAttributeAdded={onAttributeAdded}
|
|
onPriceUpdated={onPriceUpdated}
|
|
onDimensionsUpdated={onDimensionUpdated}
|
|
/>
|
|
)
|
|
}
|
|
}
|
|
/>
|
|
</SafeAreaView>
|
|
)
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
h1: {
|
|
textAlign: "center",
|
|
fontFamily: "sans-serif"
|
|
},
|
|
product: {
|
|
|
|
}
|
|
}) |