ippo
ippo
Explore posts from servers
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
is something like this possible? because what you have above is something what I have in a way
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
// PSEUDO API
import { useCentralizedStore } from './store';

const AddItemModal = () => {
// importing centralized state and handler
const {isAddItemModalOpen, handleAddItem} = useCentralizedStore();

return (
<>
<Modal isOpen={isAddItemModalOpen}>
<div className="modal">
{/* Modal UI */}
<button onClick={handleAddItem}>
Add Item
</button>
</div>
</Modal>
</>
);
};

export default AddItemModal;
// PSEUDO API
import { useCentralizedStore } from './store';

const AddItemModal = () => {
// importing centralized state and handler
const {isAddItemModalOpen, handleAddItem} = useCentralizedStore();

return (
<>
<Modal isOpen={isAddItemModalOpen}>
<div className="modal">
{/* Modal UI */}
<button onClick={handleAddItem}>
Add Item
</button>
</div>
</Modal>
</>
);
};

export default AddItemModal;
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
what I expected is something like this:
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
this is not centralized
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
how does zustand communicates with RHF and uses its getters and setters for the state?
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
let me think...
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
nice rap!
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
WHY? to have one centralized area to look into
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
please correct my if I am wrong when ever you can, I realy want to hear your opinion 🙂 so I would have for each form a monster store, that contains all the UI state AND handlers
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
🤔
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
WHY? to put all the UI state that is UI specific AND to put there all handler
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
why not create a useInvoiceUIStore ?
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
you created a useModalStore
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
okay, now there is one thing that I do not like
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
thanks for this confidence boost 😄
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
let me know if you want to go to sleep or something we can do it when you have the time 🙂
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
did you read my questions 🙂 ?
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
for code highlighting 🙂
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
use tsx after ```
108 replies
TTCTheo's Typesafe Cult
Created by ippo on 1/1/2025 in #questions
Passing Handlers or Centralize them?
In my "Add new Invoice Position" Modal-Component, I have something like this:
const { control, watch, setValue, getValues, setFocus } =
useFormContext<SalesInvoiceFormValues>()


const { fields, append } = useFieldArray({
keyName: "rhf_id",
name: "pickedPositions",
control,
});


const createInvoiceIte, = () => {
// close the modal
setIsOpenModal(false);

// put data in form-state
setValue(
"positions",
combinedPositions.map((position) => {
position.quantity = 1;
position.price = String(position.price).replace(".", ",");
position.discountAmount = 0;

return position;
}),
);

// reset pickedPositions of modal, that you see before it
// is added in the form-state
setValue("pickedPositions", []);
};



// render logic, something like
{fields.map((item, index) => (
<div
className="border border-gray-400 p-1"
key={item.productDetailId}
>
<div className="font-bold">{item.name}</div>
<div>{item.serialNo}</div>
</div>
))}
const { control, watch, setValue, getValues, setFocus } =
useFormContext<SalesInvoiceFormValues>()


const { fields, append } = useFieldArray({
keyName: "rhf_id",
name: "pickedPositions",
control,
});


const createInvoiceIte, = () => {
// close the modal
setIsOpenModal(false);

// put data in form-state
setValue(
"positions",
combinedPositions.map((position) => {
position.quantity = 1;
position.price = String(position.price).replace(".", ",");
position.discountAmount = 0;

return position;
}),
);

// reset pickedPositions of modal, that you see before it
// is added in the form-state
setValue("pickedPositions", []);
};



// render logic, something like
{fields.map((item, index) => (
<div
className="border border-gray-400 p-1"
key={item.productDetailId}
>
<div className="font-bold">{item.name}</div>
<div>{item.serialNo}</div>
</div>
))}
108 replies