Skip to content

feat: 컴포넌트 내 알러지 처리 업데이트 및 관리 편의를 위한 AllergyType enum 추가 #67

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
choihooo wants to merge 1 commit into
base: main
Choose a base branch
from
Open

feat: 컴포넌트 내 알러지 처리 업데이트 및 관리 편의를 위한 AllergyType enum 추가 #67

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/background/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@
// FOOD API
if (message.type === "FETCH_FOOD_DATA") {
const payload = message.payload;
console.log("[voim][background] FETCH_FOOD_DATA 요청 수신됨:", payload);

Check warning on line 59 in src/background/index.ts

View workflow job for this annotation

GitHub Actions / lint-and-test 

Unexpected console statement. Only these console methods are allowed: error, warn

fetch("https://voim.store/api/v1/products/foods", {
method: "POST",
Expand Down Expand Up @@ -255,7 +255,7 @@
const { productId, title, html, birthYear, gender, allergies } =
message.payload;

console.log("[health api] Request payload:", {

Check warning on line 258 in src/background/index.ts

View workflow job for this annotation

GitHub Actions / lint-and-test 

Unexpected console statement. Only these console methods are allowed: error, warn
productId,
title,
html,
Expand All @@ -273,15 +273,15 @@
html,
birthYear,
gender,
allergies,
allergies: allergies || [],
}),
})
.then((res) => {
console.log("[health api] Response status:", res.status);

Check warning on line 280 in src/background/index.ts

View workflow job for this annotation

GitHub Actions / lint-and-test 

Unexpected console statement. Only these console methods are allowed: error, warn
return res.json();
})
.then((data) => {
console.log("[health api] Response data:", data);

Check warning on line 284 in src/background/index.ts

View workflow job for this annotation

GitHub Actions / lint-and-test 

Unexpected console statement. Only these console methods are allowed: error, warn
if (sender.tab?.id) {
chrome.tabs.sendMessage(sender.tab.id, {
type: "HEALTH_DATA_RESPONSE",
Expand All @@ -305,7 +305,7 @@
}
});

chrome.action.onClicked.addListener(async (tab) => {

Check warning on line 308 in src/background/index.ts

View workflow job for this annotation

GitHub Actions / lint-and-test 

'tab' is defined but never used. Allowed unused args must match /^_/u
try {
logger.debug("툴바 아이콘 클릭됨");
await handleModalToggle();
Expand Down
14 changes: 9 additions & 5 deletions src/components/productComponents/foodComponent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,10 +42,12 @@ export const FoodComponent = () => {
useEffect(() => {
const fetchData = async (vendorEl: Element) => {
try {
const { birthYear, gender } = await chrome.storage.local.get([
"birthYear",
"gender",
]);
const { birthYear, gender, Allergies } =
await chrome.storage.local.get([
"birthYear",
"gender",
"Allergies",
]);

const productId =
window.location.href.match(/products\/(\d+)/)?.[1];
Expand All @@ -62,9 +64,11 @@ export const FoodComponent = () => {
html: rawHtml,
birthYear: Number(birthYear),
gender: gender.toUpperCase(),
allergies: [],
allergies: Allergies || [],
};

console.log("[voim] FOOD API 요청 payload:", payload);

const res = await sendFoodDataRequest(payload);
if (!res) throw new Error("응답 없음");

Expand Down
18 changes: 12 additions & 6 deletions src/components/productComponents/healthComponent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,17 @@ export const HealthComponent = () => {
return;
}

const { birthYear, gender } = await chrome.storage.local.get([
"birthYear",
"gender",
]);
console.log("[health api] 사용자 정보:", { birthYear, gender });
const { birthYear, gender, Allergies } =
await chrome.storage.local.get([
"birthYear",
"gender",
"Allergies",
]);
console.log("[health api] 사용자 정보:", {
birthYear,
gender,
Allergies,
});

const rawHtml = targetEl.outerHTML
.replace(/\sonerror=\"[^\"]*\"/g, "")
Expand All @@ -46,7 +52,7 @@ export const HealthComponent = () => {
html: rawHtml,
birthYear: Number(birthYear),
gender: gender?.toUpperCase() || "UNKNOWN",
allergies: [],
allergies: Allergies || [],
},
},
(res) => {
Expand Down
54 changes: 50 additions & 4 deletions src/tabs/myInfo/components/AllergySelectForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,31 @@ import { BaseFillButton } from "@src/components/baseFillButton/component";
import { LeftArrowIcon } from "@src/components/icons/LeftArrowIcon";
import { RightArrowIcon } from "@src/components/icons/RightArrowIcon";
import { IconButton } from "@src/components/IconButton";
import { useTheme } from "@src/contexts/ThemeContext";
import { ContentBox } from "@src/components/contentBox";
import { CloseIcon } from "@src/components/icons/CloseIcon";

export enum AllergyType {
EGG = "EGG", // 계란
MILK = "MILK", // 우유
BUCKWHEAT = "BUCKWHEAT", // 메밀
PEANUT = "PEANUT", // 땅콩
SOYBEAN = "SOYBEAN", // 대두
WHEAT = "WHEAT", // 밀
PINE_NUT = "PINE_NUT", // 잣
WALNUT = "WALNUT", // 호두
CRAB = "CRAB", // 게
SHRIMP = "SHRIMP", // 새우
SQUID = "SQUID", // 오징어
MACKEREL = "MACKEREL", // 고등어
SHELLFISH = "SHELLFISH", // 조개류
PEACH = "PEACH", // 복숭아
TOMATO = "TOMATO", // 토마토
CHICKEN = "CHICKEN", // 닭고기
PORK = "PORK", // 돼지고기
BEEF = "BEEF", // 쇠고기
SULFITE = "SULFITE", // 아황산류
}

const allergyData = {
식물성: ["메밀", "대두", "밀", "땅콩", "잣", "호두", "토마토", "복숭아"],
동물성: ["계란", "우유", "닭고기", "돼지고기", "쇠고기"],
Expand All @@ -19,6 +40,28 @@ type AllergyCategory = keyof typeof allergyData;

const ALL_CATEGORY = Object.keys(allergyData) as AllergyCategory[];

const allergyNameToEnumMap: Record<string, AllergyType> = {
계란: AllergyType.EGG,
우유: AllergyType.MILK,
메밀: AllergyType.BUCKWHEAT,
땅콩: AllergyType.PEANUT,
대두: AllergyType.SOYBEAN,
밀: AllergyType.WHEAT,
잣: AllergyType.PINE_NUT,
호두: AllergyType.WALNUT,
게: AllergyType.CRAB,
새우: AllergyType.SHRIMP,
오징어: AllergyType.SQUID,
고등어: AllergyType.MACKEREL,
조개류: AllergyType.SHELLFISH,
복숭아: AllergyType.PEACH,
토마토: AllergyType.TOMATO,
닭고기: AllergyType.CHICKEN,
돼지고기: AllergyType.PORK,
쇠고기: AllergyType.BEEF,
아황산류: AllergyType.SULFITE,
};

export function AllergySelectForm({ onComplete }: { onComplete?: () => void }) {
const [selectedCategory, setSelectedCategory] = useState<AllergyCategory>(
ALL_CATEGORY[0],
Expand Down Expand Up @@ -98,9 +141,8 @@ export function AllergySelectForm({ onComplete }: { onComplete?: () => void }) {
)
}
>
<div className="flex gap-5 items-center">
<div className="flex items-center gap-5">
{item}

<CloseIcon />
</div>
</BaseButton>
Expand All @@ -109,6 +151,10 @@ export function AllergySelectForm({ onComplete }: { onComplete?: () => void }) {

<BaseFillButton
onClick={() => {
const allergyEnumArray = selectedAllergies
.map((name) => allergyNameToEnumMap[name])
.filter(Boolean) as AllergyType[];

const menuButtons = document.querySelectorAll(
'[data-testid="menubar-content"] button',
);
Expand All @@ -124,7 +170,7 @@ export function AllergySelectForm({ onComplete }: { onComplete?: () => void }) {

chrome.storage.local.set(
{
Allergies: selectedAllergies,
Allergies: allergyEnumArray,
},
() => {
onComplete?.();
Expand Down
Loading