\r\n \r\n
\r\n )\r\n}\r\n\r\nfunction Tag(props: { tag_title: string }): JSX.Element {\r\n return (\r\n {label_text}
\r\n \r\n {'#' + props.tag_title}\r\n
\r\n )\r\n}\r\n\r\nfunction Tags_container(props: { tags: string[] }): JSX.Element {\r\n const tags_in_dom: JSX.Element[] = props.tags.map((title) => \r\n {tags_in_dom}\r\n
\r\n )\r\n}\r\n\r\nfunction Menu(props: any): JSX.Element {\r\n let menu_img: JSX.Element = ;\r\n let style_hide: object;\r\n props.img_path ? menu_img =\r\n \r\n
\r\n : ;\r\n props.note ? style_hide = { \"display\": \"none\" } : style_hide = {};\r\n\r\n let title_to_pass_upward:string|null;\r\n props.img_path ? title_to_pass_upward = props.title: title_to_pass_upward = null;\r\n return (\r\n \r\n 
\r\n
\r\n { props.callback(props.note, title_to_pass_upward) }}>\r\n {menu_img}\r\n
\r\n );\r\n}\r\n\r\nexport default Menu;","import React, {useState, useEffect} from 'react';\r\nimport Menu from '../component/Menu';\r\nimport notes from '../assets/notes.json';\r\n// import { useMediaQuery } from 'react-responsive'\r\nimport $ from 'jquery';\r\n\r\n\r\nfunction Notes(props: { note: string, callback: any }): JSX.Element {\r\n const note_json: { name: string, label: number, tags: string[], note: string }[] = notes.filter(target_note => target_note.note == props.note);\r\n const note_elements: JSX.Element[] = note_json.map((note_json): JSX.Element => )\r\n return (\r\n \r\n
\r\n {props.title}
\r\n \r\n
);\r\n}\r\n\r\nfunction is_everynotes_selected(top:string|null, middle:string|null, base:string|null){\r\n return top!=null&&middle!=null&&base!=null;\r\n}\r\n\r\n\r\nfunction Right(props: any): JSX.Element {\r\n // const isDesktopOrMobile = useMediaQuery({query: '(max-width:500px)'});\r\n\r\n const buttons = {\r\n true: ,\r\n false:,\r\n mobile:\r\n }\r\n let button_to_show:JSX.Element;\r\n \r\n const [innerWidth, setInnerWidth] = useState(window.innerWidth);\r\n\r\n useEffect(() => {\r\n const resizeListener = () => {\r\n setInnerWidth(window.innerWidth);\r\n };\r\n window.addEventListener(\"resize\", resizeListener);\r\n });\r\n\r\n is_everynotes_selected(props.top, props.middle, props.base)?\r\n button_to_show = buttons.true:button_to_show = buttons.false;\r\n\r\n if(innerWidth<=500){\r\n button_to_show = buttons.mobile;\r\n }\r\n\r\n \r\n\r\n return (\r\n \r\n
\r\n {props.note.charAt(0).toUpperCase() + props.note.slice(1)} Note
\r\n\r\n 
\r\n
\r\n \r\n \r\n {note_elements}\r\n
\r\n \r\n \r\n\r\n
\r\n );\r\n}\r\n\r\nexport default Right;\r\n","import React, { useState, useEffect } from 'react';\r\nimport Menu from '../component/Menu';\r\nimport notes from '../assets/notes.json';\r\n\r\n\r\nfunction search_note(name: string) {\r\n const target_note = notes.filter(note => note.name == name);\r\n\r\n if (target_note.length == 0) return null;\r\n return target_note[0];\r\n}\r\n\r\nfunction Menu_left(props: { name: string, callback: any, note: string }) {\r\n let target = search_note(props.name);\r\n if (target == null)\r\n return ()\r\n else {\r\n return (\r\n\r\n
\r\n \r\n \r\n
\r\n 나만의 향수
레시피를 선택하세요.
\r\n 레시피를 선택하세요.
아래에서 취향에 맞는 향수 재료를 선택할 수 있어요.
나만의 조합으로 개성을 표현해 보세요.
\r\n 나만의 조합으로 개성을 표현해 보세요.
\r\n {button_to_show}\r\n
\r\n\r\n \r\n 
\r\n \r\n
);\r\n }\r\n}\r\n\r\n\r\nfunction Left(props: any): JSX.Element {\r\n return (\r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nexport default Left;\r\n","import React, { useState } from 'react';\r\nimport Right from './Right';\r\nimport Left from './Left'\r\nimport '../CSS/main.scss';\r\n\r\ninterface selected_notes { \"base\": string | null, \"middle\": string | null, \"top\": string | null };\r\n\r\nfunction Main(): JSX.Element {\r\n\r\n const [selected, setSelected] = useState\r\n
\r\n \r\n 
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default Main;\r\n","function Nav_right(right_elements:any) {\r\n right_elements = [{text:\"About US\", link:\"/about\"}, {text:\"Order\", link:\"/order\"}];\r\n return (right_elements.map((element:any) => ( { window.location.href = element.link }}>{element.text}
)));\r\n}\r\n\r\nfunction Nav(props: { left: { \"text\": string | null, \"link\": string | null, \"img\": { \"src\": string, \"width\": string } | null }, right: { text: string, link: string }[] | null }): JSX.Element {\r\n return (\r\n \r\n \r\n\r\n
\r\n )\r\n}\r\n\r\nexport default Nav;","import React from 'react';\r\nimport { saveAs } from 'file-saver';\r\nimport notes from '../assets/notes.json'\r\n\r\n\r\nfunction Admin(): JSX.Element {\r\n // const saveJsonToFile = () => {\r\n // const jsonData = {\r\n // key1: 'value1',\r\n // key2: 'value2',\r\n // key3: 'value3',\r\n // };\r\n\r\n // const jsonString = JSON.stringify(jsonData, null, 2);\r\n // const blob = new Blob([jsonString], { type: 'application/json' });\r\n\r\n // saveAs(blob, 'data.json');\r\n // };\r\n\r\n\r\n return (\r\n \r\n
\r\n { window.location.href = '/' }} className=\"logo_container logo\">\r\n 
\r\n
\r\n \r\n
\r\n {notes[0].name}\r\n
\r\n );\r\n}\r\n\r\nexport default Admin;","////////////////////////////////////////////////////////////////////////////////\n//#region Types and Constants\n////////////////////////////////////////////////////////////////////////////////\n\n/**\n * Actions represent the type of change to a location value.\n */\nexport enum Action {\n /**\n * A POP indicates a change to an arbitrary index in the history stack, such\n * as a back or forward navigation. It does not describe the direction of the\n * navigation, only that the current index changed.\n *\n * Note: This is the default action for newly created history objects.\n */\n Pop = \"POP\",\n\n /**\n * A PUSH indicates a new entry being added to the history stack, such as when\n * a link is clicked and a new page loads. When this happens, all subsequent\n * entries in the stack are lost.\n */\n Push = \"PUSH\",\n\n /**\n * A REPLACE indicates the entry at the current index in the history stack\n * being replaced by a new one.\n */\n Replace = \"REPLACE\",\n}\n\n/**\n * The pathname, search, and hash values of a URL.\n */\nexport interface Path {\n /**\n * A URL pathname, beginning with a /.\n */\n pathname: string;\n\n /**\n * A URL search string, beginning with a ?.\n */\n search: string;\n\n /**\n * A URL fragment identifier, beginning with a #.\n */\n hash: string;\n}\n\n// TODO: (v7) Change the Location generic default from `any` to `unknown` and\n// remove Remix `useLocation` wrapper.\n\n/**\n * An entry in a history stack. A location contains information about the\n * URL path, as well as possibly some arbitrary state and a key.\n */\nexport interface Location