Skip to content

feat: チャージボタンコンポーネントを追加#12

Open
sana-sagegami wants to merge 2 commits into
mainfrom
front/change/home-scan-behavior
Open

feat: チャージボタンコンポーネントを追加#12
sana-sagegami wants to merge 2 commits into
mainfrom
front/change/home-scan-behavior

Conversation

@sana-sagegami

Copy link
Copy Markdown
Member
スクリーンショット 2026-06-10 12 17 28

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

ホーム画面の「チャージ」導線を独立したボタンコンポーネントに分離しつつ、ホーム画面から商品バーコードをスキャンして購入フロー(カート一覧)へ進めるようにしたPRです。

Changes:

  • Home(/) に商品用 BarcodeReader とエラー表示を追加し、スキャン成功時にカートへ追加して /buy/list へ遷移
  • チャージボタンを ChargeButton コンポーネントとして新規追加し、HomeButtons を削除
  • Home のエラー表示用スタイル(固定表示+フェードイン)を追加

Reviewed changes

Copilot reviewed 6 out of 6 changed files in this pull request and generated 3 comments.

Show a summary per file
File Description
sysken-pay-front/src/pages/index.tsx ホームでの商品スキャン→カート追加→購入リスト遷移、チャージボタン配置に変更
sysken-pay-front/src/pages/index.module.scss ホームのエラー表示スタイルを追加(fixed表示+アニメーション)
sysken-pay-front/src/components/features/home/HomeButtons/index.tsx HomeButtons を削除
sysken-pay-front/src/components/features/home/HomeButtons/HomeButtons.module.scss HomeButtons のスタイルを削除
sysken-pay-front/src/components/features/home/ChargeButton/index.tsx チャージ用ボタンコンポーネントを新規追加
sysken-pay-front/src/components/features/home/ChargeButton/ChargeButton.module.scss ChargeButton のスタイルを新規追加

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines +12 to +16
const navigate = useNavigate();
const addItem = useCartStore((state) => state.addItem);
const [error, setError] = useState<string | null>(null);

useEffect(() => {
Comment on lines +22 to +31
const handleScan = async (barcode: string) => {
try {
const data = await ItemRepositoryImpl.getItemByJanCode(barcode);
if (!data?.item_id) throw new Error("商品が見つかりませんでした。ご不明の際は担当者にご連絡ください。");
addItem(data);
navigate("/buy/list");
} catch (e) {
setError(e instanceof Error ? e.message : "商品の取得に失敗しました");
}
};
Comment on lines +22 to +27
const handleScan = async (barcode: string) => {
try {
const data = await ItemRepositoryImpl.getItemByJanCode(barcode);
if (!data?.item_id) throw new Error("商品が見つかりませんでした。ご不明の際は担当者にご連絡ください。");
addItem(data);
navigate("/buy/list");
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants