diff --git a/services/mobile/app/routes/welcome._index.tsx b/services/mobile/app/routes/welcome._index.tsx index 35d51c3..869db55 100644 --- a/services/mobile/app/routes/welcome._index.tsx +++ b/services/mobile/app/routes/welcome._index.tsx @@ -26,6 +26,10 @@ export default function Welcome() { documentSub({ converter: orderConverter }), ); + /** + * 注文が完了した際に音を鳴らす + * OK + */ useEffect(() => { if (!order?.readyAt) { return; diff --git a/services/pos/app/components/functional/useCurrentTime.ts b/services/pos/app/components/functional/useCurrentTime.ts index 4d8f3ff..32716d0 100644 --- a/services/pos/app/components/functional/useCurrentTime.ts +++ b/services/pos/app/components/functional/useCurrentTime.ts @@ -8,6 +8,9 @@ import { useEffect, useState } from "react"; export const useCurrentTime = (interval: number) => { const [currentTime, setCurrentTime] = useState(new Date()); + /** + * OK + */ useEffect(() => { const intervalId = setInterval(() => { setCurrentTime(new Date()); diff --git a/services/pos/app/components/functional/useFocusRef.ts b/services/pos/app/components/functional/useFocusRef.ts index ccc4f26..11f849e 100644 --- a/services/pos/app/components/functional/useFocusRef.ts +++ b/services/pos/app/components/functional/useFocusRef.ts @@ -8,6 +8,9 @@ import { useEffect, useRef } from "react"; const useFocusRef = (focus: boolean) => { const DOMRef = useRef(null); + /** + * OK + */ useEffect(() => { if (focus) { DOMRef.current?.focus(); diff --git a/services/pos/app/components/functional/usePreventNumberKeyUpDown.tsx b/services/pos/app/components/functional/usePreventNumberKeyUpDown.tsx index d894116..34833d9 100644 --- a/services/pos/app/components/functional/usePreventNumberKeyUpDown.tsx +++ b/services/pos/app/components/functional/usePreventNumberKeyUpDown.tsx @@ -4,6 +4,9 @@ import { useEffect } from "react"; * 上下キーで数値を増減させないEffect */ const usePreventNumberKeyUpDown = () => { + /** + * OK + */ useEffect(() => { const handler = (event: KeyboardEvent) => { if (event.key === "ArrowUp" || event.key === "ArrowDown") { diff --git a/services/pos/app/components/functional/useSyncCahiserOrder.ts b/services/pos/app/components/functional/useSyncCahiserOrder.ts index aae8305..25bb831 100644 --- a/services/pos/app/components/functional/useSyncCahiserOrder.ts +++ b/services/pos/app/components/functional/useSyncCahiserOrder.ts @@ -5,6 +5,10 @@ export const useSyncCahiserOrder = ( order: OrderEntity, syncOrder: (order: OrderEntity) => void, ) => { + /** + * FIXME #412 stateの更新にはuseEffectを使わない + * https://ja.react.dev/learn/you-might-not-need-an-effect#notifying-parent-components-about-state-changes + */ useEffect(() => { syncOrder(order); }, [order, syncOrder]); diff --git a/services/pos/app/components/molecules/AttractiveInput.tsx b/services/pos/app/components/molecules/AttractiveInput.tsx index 69b103b..c70fd08 100644 --- a/services/pos/app/components/molecules/AttractiveInput.tsx +++ b/services/pos/app/components/molecules/AttractiveInput.tsx @@ -24,6 +24,10 @@ const AttractiveInput = ({ focus, onTextSet, ...props }: props) => { [], ); + /** + * FIXME #412 stateの更新にはuseEffectを使わない + * https://ja.react.dev/learn/you-might-not-need-an-effect#notifying-parent-components-about-state-changes + */ useEffect(() => { onTextSet(text); }, [text, onTextSet]); diff --git a/services/pos/app/components/molecules/AttractiveTextArea.tsx b/services/pos/app/components/molecules/AttractiveTextArea.tsx index 97d3f0c..667c565 100644 --- a/services/pos/app/components/molecules/AttractiveTextArea.tsx +++ b/services/pos/app/components/molecules/AttractiveTextArea.tsx @@ -24,6 +24,10 @@ const AttractiveTextArea = ({ focus, onTextSet, ...props }: props) => { [], ); + /** + * FIXME #412 stateの更新にはuseEffectを使わない + * https://ja.react.dev/learn/you-might-not-need-an-effect#notifying-parent-components-about-state-changes + */ useEffect(() => { onTextSet(text); }, [text, onTextSet]); diff --git a/services/pos/app/components/organisms/ConfirmDrawer.tsx b/services/pos/app/components/organisms/ConfirmDrawer.tsx index 8af996d..b9a21f0 100644 --- a/services/pos/app/components/organisms/ConfirmDrawer.tsx +++ b/services/pos/app/components/organisms/ConfirmDrawer.tsx @@ -21,6 +21,9 @@ type props = ComponentProps & { const ConfirmDrawer = ({ children, focus, onConfirm, ...props }: props) => { const buttonRef = useRef(null); + /** + * OK + */ useEffect(() => { console.log("use eefect"); const wait = async () => { diff --git a/services/pos/app/components/organisms/DiscountInput.tsx b/services/pos/app/components/organisms/DiscountInput.tsx index 1d3aecf..8c9d698 100644 --- a/services/pos/app/components/organisms/DiscountInput.tsx +++ b/services/pos/app/components/organisms/DiscountInput.tsx @@ -55,6 +55,10 @@ const DiscountInput = memo( [discountOrder], ); + /** + * FIXME #412 useEffect内でstateを更新している + * https://ja.react.dev/learn/you-might-not-need-an-effect#notifying-parent-components-about-state-changes + */ useEffect(() => { if (isComplete && discountOrder) { onDiscountOrderFind(discountOrder); diff --git a/services/pos/app/components/organisms/ItemAssign.tsx b/services/pos/app/components/organisms/ItemAssign.tsx index ed6ad3c..f822c1d 100644 --- a/services/pos/app/components/organisms/ItemAssign.tsx +++ b/services/pos/app/components/organisms/ItemAssign.tsx @@ -36,6 +36,10 @@ const ItemAssign = memo( }, [assignee, idx, mutateItem]); // アサイン入力欄を閉じるときに保存 + /** + * FIXME #412 useEffect内でstateを更新している + * https://ja.react.dev/learn/you-might-not-need-an-effect#notifying-parent-components-about-state-changes + */ useEffect(() => { if (!focus) { saveAssignInput(); diff --git a/services/pos/app/components/organisms/OrderItemEdit.tsx b/services/pos/app/components/organisms/OrderItemEdit.tsx index 24ee16b..68cbfea 100644 --- a/services/pos/app/components/organisms/OrderItemEdit.tsx +++ b/services/pos/app/components/organisms/OrderItemEdit.tsx @@ -68,6 +68,9 @@ const OrderItemEdit = memo( }, [itemFocus, onRemoveItem]); // ↑・↓ が押されたときに itemFocus を移動 + /** + * OK + */ useEffect(() => { const handler = (event: KeyboardEvent) => { switch (event.key) { @@ -90,6 +93,9 @@ const OrderItemEdit = memo( }, [focus, moveItemFocus]); // Enter が押されたときに assign 入力欄を開く + /** + * OK + */ useEffect(() => { const handler = (event: KeyboardEvent) => { if (event.key === "Enter") { @@ -106,6 +112,9 @@ const OrderItemEdit = memo( // キー操作でアイテムを追加 // Backspace でアイテムを削除 + /** + * OK + */ useEffect(() => { const handler = (event: KeyboardEvent) => { if (!focus) return; @@ -122,6 +131,9 @@ const OrderItemEdit = memo( }, [focus, onAddItem, removeItem, editable]); // focus が外れたときに itemFocus をリセット + /** + * OK + */ useEffect(() => { if (!focus) { setItemFocus(-1); @@ -132,6 +144,10 @@ const OrderItemEdit = memo( }, [focus]); // itemFocus が range 外に出ないように調整 + /** + * FIXME #412 useEffect内でstateを更新している + * https://ja.react.dev/learn/you-might-not-need-an-effect#notifying-parent-components-about-state-changes + */ useEffect(() => { setItemFocus((prev) => Math.min(order.items.length - 1, Math.max(-1, prev)), diff --git a/services/pos/app/components/organisms/SubmitSection.tsx b/services/pos/app/components/organisms/SubmitSection.tsx index 9aeaf58..a19c555 100644 --- a/services/pos/app/components/organisms/SubmitSection.tsx +++ b/services/pos/app/components/organisms/SubmitSection.tsx @@ -15,6 +15,9 @@ export const SubmitSection = ({ submitOrder, order, focus }: props) => { [order], ); + /** + * OK + */ useEffect(() => { if (focus) { buttonRef.current?.focus(); diff --git a/services/pos/app/components/pages/CashierV2.tsx b/services/pos/app/components/pages/CashierV2.tsx index 4801ed5..6f8a01f 100644 --- a/services/pos/app/components/pages/CashierV2.tsx +++ b/services/pos/app/components/pages/CashierV2.tsx @@ -57,6 +57,10 @@ const CashierV2 = ({ items, orders, submitPayload, syncOrder }: props) => { usePreventNumberKeyUpDown(); + /** + * FIXME #412 useEffect内でstateを更新している + * https://ja.react.dev/learn/you-might-not-need-an-effect#notifying-parent-components-about-state-changes + */ useEffect(() => { newOrderDispatch({ type: "updateOrderId", orderId: nextOrderId }); }, [nextOrderId, newOrderDispatch]); @@ -95,6 +99,9 @@ const CashierV2 = ({ items, orders, submitPayload, syncOrder }: props) => { }; }, [proceedStatus, previousStatus, resetAll]); + /** + * OK + */ useEffect(() => { const handler = (event: KeyboardEvent) => { const key = event.key; diff --git a/services/pos/app/label/printer.js b/services/pos/app/label/printer.js index 5e695ef..81fdfe6 100644 --- a/services/pos/app/label/printer.js +++ b/services/pos/app/label/printer.js @@ -9,6 +9,10 @@ export const useRawPrinter = () => { const ePosDeviceRef = useRef(); const printerRef = useRef(); + /** + * BAD + * https://ja.react.dev/learn/you-might-not-need-an-effect#initializing-the-application + */ useEffect(() => { if (status === "init") { connect(); diff --git a/services/pos/app/routes/_header.tsx b/services/pos/app/routes/_header.tsx index 272eb6f..3e7f58d 100644 --- a/services/pos/app/routes/_header.tsx +++ b/services/pos/app/routes/_header.tsx @@ -12,6 +12,10 @@ export default function BaseHeader() { const isOnline = useOnlineStatus(); const isOperational = useOrderStat(); + /** + * BAD + * https://ja.react.dev/learn/you-might-not-need-an-effect#initializing-the-application + */ useEffect(() => { onAuthStateChanged(auth, (user) => { if (user?.emailVerified) { diff --git a/services/pos/app/routes/cashier-mini.tsx b/services/pos/app/routes/cashier-mini.tsx index f742787..bf3e62c 100644 --- a/services/pos/app/routes/cashier-mini.tsx +++ b/services/pos/app/routes/cashier-mini.tsx @@ -39,10 +39,17 @@ export default function CasherMini() { return order?.orderId; }, [order, logoShown, preOrder]); + /** + * FIXME #412 useEffect内でstateを更新している + * https://ja.react.dev/learn/you-might-not-need-an-effect#notifying-parent-components-about-state-changes + */ useEffect(() => { setLogoShown(submittedOrderId != null || !isOperational); }, [submittedOrderId, isOperational]); + /** + * OK + */ useEffect(() => { if (!logoShown) { return; @@ -50,6 +57,9 @@ export default function CasherMini() { videoRef.current?.play(); }, [logoShown]); + /** + * OK + */ useEffect(() => { if (submittedOrderId === null) { return;