diff --git a/frontend/src/components/common/TripItemMarker/TripItemMarker.style.ts b/frontend/src/components/common/TripItemMarker/TripItemMarker.style.ts
index ebd3ccab7..23eb65ac0 100644
--- a/frontend/src/components/common/TripItemMarker/TripItemMarker.style.ts
+++ b/frontend/src/components/common/TripItemMarker/TripItemMarker.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const getMarkerContainerStyling = (isZoomedOut: boolean) => {
diff --git a/frontend/src/components/common/TripItemMarker/TripItemMarker.tsx b/frontend/src/components/common/TripItemMarker/TripItemMarker.tsx
index 7dc555769..462a4f2ca 100644
--- a/frontend/src/components/common/TripItemMarker/TripItemMarker.tsx
+++ b/frontend/src/components/common/TripItemMarker/TripItemMarker.tsx
@@ -1,17 +1,21 @@
-import PinIcon from '@assets/svg/pin-icon.svg';
-import SelectedPinIcon from '@assets/svg/selected-pin-icon.svg';
-import { clickedMarkerIdState } from '@store/scrollFocus';
-import { Flex, Text } from 'hang-log-design-system';
import { useEffect, useRef } from 'react';
import type { Root } from 'react-dom/client';
import { createRoot } from 'react-dom/client';
+
import { useSetRecoilState } from 'recoil';
+import { Flex, Text } from 'hang-log-design-system';
+
import {
getLabelStyling,
getMarkerContainerStyling,
} from '@components/common/TripItemMarker/TripItemMarker.style';
+import { clickedMarkerIdState } from '@store/scrollFocus';
+
+import PinIcon from '@assets/svg/pin-icon.svg';
+import SelectedPinIcon from '@assets/svg/selected-pin-icon.svg';
+
interface TripItemMarkerProps {
map: google.maps.Map;
id: number;
diff --git a/frontend/src/components/common/TripItemMarkerContainer/TripItemMarkerContainer.tsx b/frontend/src/components/common/TripItemMarkerContainer/TripItemMarkerContainer.tsx
index 71b9d6e52..57cc5b704 100644
--- a/frontend/src/components/common/TripItemMarkerContainer/TripItemMarkerContainer.tsx
+++ b/frontend/src/components/common/TripItemMarkerContainer/TripItemMarkerContainer.tsx
@@ -1,11 +1,15 @@
-import { MAP_ZOOM_OUT_LABEL_LIMIT } from '@constants/map';
-import { focusedIdState } from '@store/scrollFocus';
-import type { TripPlaceType } from '@type/trip';
import { useEffect, useState } from 'react';
+
import { useRecoilValue } from 'recoil';
import TripItemMarker from '@components/common/TripItemMarker/TripItemMarker';
+import { focusedIdState } from '@store/scrollFocus';
+
+import type { TripPlaceType } from '@type/trip';
+
+import { MAP_ZOOM_OUT_LABEL_LIMIT } from '@constants/map';
+
interface TripItemMarkerContainerProps {
map: google.maps.Map;
places: TripPlaceType[];
diff --git a/frontend/src/components/common/TripMap/TripMap.tsx b/frontend/src/components/common/TripMap/TripMap.tsx
index ad77a9486..47b51d089 100644
--- a/frontend/src/components/common/TripMap/TripMap.tsx
+++ b/frontend/src/components/common/TripMap/TripMap.tsx
@@ -1,10 +1,12 @@
-import { MAP_INITIAL_ZOOM_SIZE, MAP_MAX_ZOOM_SIZE, MAP_MIN_ZOOM_SIZE } from '@constants/map';
-import type { TripPlaceType } from '@type/trip';
import { useEffect, useRef, useState } from 'react';
import MapDashedLine from '@components/common/MapDashedLine/MapDashedLine';
import TripItemMarkerContainer from '@components/common/TripItemMarkerContainer/TripItemMarkerContainer';
+import type { TripPlaceType } from '@type/trip';
+
+import { MAP_INITIAL_ZOOM_SIZE, MAP_MAX_ZOOM_SIZE, MAP_MIN_ZOOM_SIZE } from '@constants/map';
+
interface TripMapProps {
centerLat: number;
centerLng: number;
diff --git a/frontend/src/components/expense/ExpenseCategories/ExpenseCategories.style.ts b/frontend/src/components/expense/ExpenseCategories/ExpenseCategories.style.ts
index d90510adc..09a0a72f5 100644
--- a/frontend/src/components/expense/ExpenseCategories/ExpenseCategories.style.ts
+++ b/frontend/src/components/expense/ExpenseCategories/ExpenseCategories.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const totalAmountContainerStyling = css({
diff --git a/frontend/src/components/expense/ExpenseCategories/ExpenseCategories.tsx b/frontend/src/components/expense/ExpenseCategories/ExpenseCategories.tsx
index da83bafad..d519a7472 100644
--- a/frontend/src/components/expense/ExpenseCategories/ExpenseCategories.tsx
+++ b/frontend/src/components/expense/ExpenseCategories/ExpenseCategories.tsx
@@ -1,12 +1,13 @@
-import { CURRENCY_ICON, DEFAULT_CURRENCY } from '@constants/trip';
import { Flex, Heading, Tab, Tabs, Text, Theme, useSelect } from 'hang-log-design-system';
-import { formatDate, formatNumberToMoney } from '@utils/formatter';
+import { totalAmountContainerStyling } from '@components/expense/ExpenseCategories/ExpenseCategories.style';
+import ExpenseList from '@components/expense/ExpenseList/ExpenseList';
import { useExpense } from '@hooks/expense/useExpense';
-import { totalAmountContainerStyling } from '@components/expense/ExpenseCategories/ExpenseCategories.style';
-import ExpenseList from '@components/expense/ExpenseList/ExpenseList';
+import { formatDate, formatNumberToMoney } from '@utils/formatter';
+
+import { CURRENCY_ICON, DEFAULT_CURRENCY } from '@constants/trip';
interface ExpenseCategoriesProps {
tripId: number;
diff --git a/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformation.style.ts b/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformation.style.ts
index c693c8c62..999adc51c 100644
--- a/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformation.style.ts
+++ b/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformation.style.ts
@@ -1,8 +1,11 @@
-import { EXPENSE_CHART_COLORS } from '@constants/expense';
import { css } from '@emotion/react';
-import type { ExpenseCategoryNameType } from '@type/expense';
+
import { Theme } from 'hang-log-design-system';
+import type { ExpenseCategoryNameType } from '@type/expense';
+
+import { EXPENSE_CHART_COLORS } from '@constants/expense';
+
export const containerStyling = css({
display: 'flex',
flexDirection: 'column',
diff --git a/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformation.tsx b/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformation.tsx
index 0c4b80740..5ac1519ed 100644
--- a/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformation.tsx
+++ b/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformation.tsx
@@ -1,10 +1,5 @@
-import { CURRENCY_ICON, DEFAULT_CURRENCY } from '@constants/trip';
import { Flex, Text, Theme } from 'hang-log-design-system';
-import { formatNumberToMoney } from '@utils/formatter';
-
-import { useExpense } from '@hooks/expense/useExpense';
-
import {
categoryNameStyling,
containerStyling,
@@ -12,6 +7,12 @@ import {
wrapperStyling,
} from '@components/expense/ExpenseCategoryInformation/ExpenseCategoryInformation.style';
+import { useExpense } from '@hooks/expense/useExpense';
+
+import { formatNumberToMoney } from '@utils/formatter';
+
+import { CURRENCY_ICON, DEFAULT_CURRENCY } from '@constants/trip';
+
interface ExpenseCategoryInformationProps {
tripId: number;
}
diff --git a/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformationSkeleton.tsx b/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformationSkeleton.tsx
index 93e7ee1a6..1378793bf 100644
--- a/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformationSkeleton.tsx
+++ b/frontend/src/components/expense/ExpenseCategoryInformation/ExpenseCategoryInformationSkeleton.tsx
@@ -1,8 +1,9 @@
-import { EXPENSE_CATEGORY_INFORMATION_SKELETON_LENGTH } from '@constants/ui';
import { Skeleton } from 'hang-log-design-system';
import { containerStyling } from '@components/expense/ExpenseCategoryInformation/ExpenseCategoryInformation.style';
+import { EXPENSE_CATEGORY_INFORMATION_SKELETON_LENGTH } from '@constants/ui';
+
const ExpenseCategoryInformationSkeleton = () => {
return (
diff --git a/frontend/src/components/expense/ExpenseDates/ExpenseDates.style.ts b/frontend/src/components/expense/ExpenseDates/ExpenseDates.style.ts
index d90510adc..09a0a72f5 100644
--- a/frontend/src/components/expense/ExpenseDates/ExpenseDates.style.ts
+++ b/frontend/src/components/expense/ExpenseDates/ExpenseDates.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const totalAmountContainerStyling = css({
diff --git a/frontend/src/components/expense/ExpenseDates/ExpenseDates.tsx b/frontend/src/components/expense/ExpenseDates/ExpenseDates.tsx
index 3e0cf9e65..8ca6e7ed4 100644
--- a/frontend/src/components/expense/ExpenseDates/ExpenseDates.tsx
+++ b/frontend/src/components/expense/ExpenseDates/ExpenseDates.tsx
@@ -1,13 +1,14 @@
-import { CURRENCY_ICON, DEFAULT_CURRENCY } from '@constants/trip';
import { Flex, Heading, Tab, Tabs, Text, Theme, useSelect } from 'hang-log-design-system';
-import { formatDate, formatMonthDate, formatNumberToMoney } from '@utils/formatter';
-import { sortByOrdinal } from '@utils/sort';
+import { totalAmountContainerStyling } from '@components/expense/ExpenseDates/ExpenseDates.style';
+import ExpenseList from '@components/expense/ExpenseList/ExpenseList';
import { useExpense } from '@hooks/expense/useExpense';
-import { totalAmountContainerStyling } from '@components/expense/ExpenseDates/ExpenseDates.style';
-import ExpenseList from '@components/expense/ExpenseList/ExpenseList';
+import { formatDate, formatMonthDate, formatNumberToMoney } from '@utils/formatter';
+import { sortByOrdinal } from '@utils/sort';
+
+import { CURRENCY_ICON, DEFAULT_CURRENCY } from '@constants/trip';
interface ExpenseDatesProps {
tripId: number;
diff --git a/frontend/src/components/expense/ExpenseInformation/ExpenseInformation.style.ts b/frontend/src/components/expense/ExpenseInformation/ExpenseInformation.style.ts
index 9bdc9c573..1b424c2b8 100644
--- a/frontend/src/components/expense/ExpenseInformation/ExpenseInformation.style.ts
+++ b/frontend/src/components/expense/ExpenseInformation/ExpenseInformation.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const sectionStyling = css({
diff --git a/frontend/src/components/expense/ExpenseInformation/ExpenseInformation.tsx b/frontend/src/components/expense/ExpenseInformation/ExpenseInformation.tsx
index 35bb361dc..23ca43da5 100644
--- a/frontend/src/components/expense/ExpenseInformation/ExpenseInformation.tsx
+++ b/frontend/src/components/expense/ExpenseInformation/ExpenseInformation.tsx
@@ -1,9 +1,6 @@
-import { mediaQueryMobileState } from '@store/mediaQuery';
-import type { ExpenseData } from '@type/expense';
-import { Badge, Box, Heading, Text } from 'hang-log-design-system';
import { useRecoilValue } from 'recoil';
-import { formatDate } from '@utils/formatter';
+import { Badge, Box, Heading, Text } from 'hang-log-design-system';
import {
badgeWrapperStyling,
@@ -11,6 +8,12 @@ import {
titleStyling,
} from '@components/expense/ExpenseInformation/ExpenseInformation.style';
+import { mediaQueryMobileState } from '@store/mediaQuery';
+
+import { formatDate } from '@utils/formatter';
+
+import type { ExpenseData } from '@type/expense';
+
interface ExpenseInformationProps
extends Pick {
tripId: number;
diff --git a/frontend/src/components/expense/ExpenseItem/ExpenseItem.style.ts b/frontend/src/components/expense/ExpenseItem/ExpenseItem.style.ts
index 3e234ff10..d20b25de1 100644
--- a/frontend/src/components/expense/ExpenseItem/ExpenseItem.style.ts
+++ b/frontend/src/components/expense/ExpenseItem/ExpenseItem.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const containerStyling = css({
diff --git a/frontend/src/components/expense/ExpenseItem/ExpenseItem.tsx b/frontend/src/components/expense/ExpenseItem/ExpenseItem.tsx
index 02fde7c19..ad945b495 100644
--- a/frontend/src/components/expense/ExpenseItem/ExpenseItem.tsx
+++ b/frontend/src/components/expense/ExpenseItem/ExpenseItem.tsx
@@ -1,10 +1,12 @@
-import { CURRENCY_ICON } from '@constants/trip';
-import type { ExpenseItemData } from '@type/expense';
import { Flex, Heading, Text, Theme } from 'hang-log-design-system';
+import { amountStyling, containerStyling } from '@components/expense/ExpenseItem/ExpenseItem.style';
+
import { formatNumberToMoney } from '@utils/formatter';
-import { amountStyling, containerStyling } from '@components/expense/ExpenseItem/ExpenseItem.style';
+import type { ExpenseItemData } from '@type/expense';
+
+import { CURRENCY_ICON } from '@constants/trip';
type ExpenseItemProps = ExpenseItemData;
diff --git a/frontend/src/components/expense/ExpenseList/ExpenseList.style.ts b/frontend/src/components/expense/ExpenseList/ExpenseList.style.ts
index c33285e3e..c8bb9a6d6 100644
--- a/frontend/src/components/expense/ExpenseList/ExpenseList.style.ts
+++ b/frontend/src/components/expense/ExpenseList/ExpenseList.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const containerStyling = css({
diff --git a/frontend/src/components/expense/ExpenseList/ExpenseList.tsx b/frontend/src/components/expense/ExpenseList/ExpenseList.tsx
index 1ee250b19..84a84cc7e 100644
--- a/frontend/src/components/expense/ExpenseList/ExpenseList.tsx
+++ b/frontend/src/components/expense/ExpenseList/ExpenseList.tsx
@@ -1,9 +1,8 @@
-import { PATH } from '@constants/path';
-import type { ExpenseItemData } from '@type/expense';
-import { Box, Button, Divider, Flex, Heading, Text, Theme } from 'hang-log-design-system';
import { Fragment } from 'react';
import { useNavigate } from 'react-router-dom';
+import { Box, Button, Divider, Flex, Heading, Text, Theme } from 'hang-log-design-system';
+
import ExpenseItem from '@components/expense/ExpenseItem/ExpenseItem';
import {
addItemButtonStyling,
@@ -11,6 +10,10 @@ import {
emptyTextStyling,
} from '@components/expense/ExpenseList/ExpenseList.style';
+import type { ExpenseItemData } from '@type/expense';
+
+import { PATH } from '@constants/path';
+
interface ExpenseListProps {
items: ExpenseItemData[];
}
diff --git a/frontend/src/components/expense/ExpenseList/ExpenseListSkeleton.tsx b/frontend/src/components/expense/ExpenseList/ExpenseListSkeleton.tsx
index d7397e4eb..8916f785e 100644
--- a/frontend/src/components/expense/ExpenseList/ExpenseListSkeleton.tsx
+++ b/frontend/src/components/expense/ExpenseList/ExpenseListSkeleton.tsx
@@ -1,10 +1,12 @@
-import { EXPENSE_LIST_SKELETON_LENGTH } from '@constants/ui';
-import { Divider, Flex, Theme } from 'hang-log-design-system';
import { Fragment } from 'react';
+import { Divider, Flex, Theme } from 'hang-log-design-system';
+
import ExpenseItemSkeleton from '@components/expense/ExpenseItem/ExpenseItemSkeleton';
import { containerStyling } from '@components/expense/ExpenseList/ExpenseList.style';
+import { EXPENSE_LIST_SKELETON_LENGTH } from '@constants/ui';
+
const ExpenseListSkeleton = () => {
return (
{
const isMobile = useRecoilValue(mediaQueryMobileState);
diff --git a/frontend/src/components/expense/TotalExpenseSection/TotalExpenseSection.style.ts b/frontend/src/components/expense/TotalExpenseSection/TotalExpenseSection.style.ts
index 736ba39e8..225993970 100644
--- a/frontend/src/components/expense/TotalExpenseSection/TotalExpenseSection.style.ts
+++ b/frontend/src/components/expense/TotalExpenseSection/TotalExpenseSection.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const containerStyling = css({
diff --git a/frontend/src/components/expense/TotalExpenseSection/TotalExpenseSection.tsx b/frontend/src/components/expense/TotalExpenseSection/TotalExpenseSection.tsx
index 1d73f874a..d45e831a2 100644
--- a/frontend/src/components/expense/TotalExpenseSection/TotalExpenseSection.tsx
+++ b/frontend/src/components/expense/TotalExpenseSection/TotalExpenseSection.tsx
@@ -1,12 +1,6 @@
-import { EXPENSE_CHART_COLORS } from '@constants/expense';
-import { CURRENCY_ICON, DEFAULT_CURRENCY } from '@constants/trip';
-import { mediaQueryMobileState } from '@store/mediaQuery';
-import { Box, Heading } from 'hang-log-design-system';
import { useRecoilValue } from 'recoil';
-import { formatNumberToMoney } from '@utils/formatter';
-
-import { useExpense } from '@hooks/expense/useExpense';
+import { Box, Heading } from 'hang-log-design-system';
import type { Segment } from '@components/common/DonutChart/DonutChart';
import DonutChart from '@components/common/DonutChart/DonutChart';
@@ -17,6 +11,15 @@ import {
totalAmountStyling,
} from '@components/expense/TotalExpenseSection/TotalExpenseSection.style';
+import { useExpense } from '@hooks/expense/useExpense';
+
+import { mediaQueryMobileState } from '@store/mediaQuery';
+
+import { formatNumberToMoney } from '@utils/formatter';
+
+import { EXPENSE_CHART_COLORS } from '@constants/expense';
+import { CURRENCY_ICON, DEFAULT_CURRENCY } from '@constants/trip';
+
interface TotalExpenseSectionProps {
tripId: number;
}
diff --git a/frontend/src/components/layout/Footer/Footer.style.ts b/frontend/src/components/layout/Footer/Footer.style.ts
index 5ad321131..47b8b5edc 100644
--- a/frontend/src/components/layout/Footer/Footer.style.ts
+++ b/frontend/src/components/layout/Footer/Footer.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const containerStyling = css({
diff --git a/frontend/src/components/layout/Header/Header.style.ts b/frontend/src/components/layout/Header/Header.style.ts
index 3ac642ebe..8fd3635a2 100644
--- a/frontend/src/components/layout/Header/Header.style.ts
+++ b/frontend/src/components/layout/Header/Header.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const headerStyling = css({
diff --git a/frontend/src/components/layout/Header/Header.tsx b/frontend/src/components/layout/Header/Header.tsx
index 437646719..d9a4636b7 100644
--- a/frontend/src/components/layout/Header/Header.tsx
+++ b/frontend/src/components/layout/Header/Header.tsx
@@ -1,15 +1,20 @@
-import LogoHorizontal from '@assets/svg/logo-horizontal.svg';
-import { PATH } from '@constants/path';
-import { isLoggedInState } from '@store/auth';
-import { Flex } from 'hang-log-design-system';
import { Suspense } from 'react';
import { useNavigate } from 'react-router-dom';
+
import { useRecoilValue } from 'recoil';
+import { Flex } from 'hang-log-design-system';
+
import { getItemStyling, headerStyling } from '@components/layout/Header/Header.style';
import LoggedInOption from '@components/layout/Header/LoggedInMenu/LoggedInMenu';
import LoggedOutOption from '@components/layout/Header/LoggedOutMenu/LoggedOutMenu';
+import { isLoggedInState } from '@store/auth';
+
+import { PATH } from '@constants/path';
+
+import LogoHorizontal from '@assets/svg/logo-horizontal.svg';
+
const Header = () => {
const navigate = useNavigate();
diff --git a/frontend/src/components/layout/Header/LoggedInMenu/LoggedInMenu.style.ts b/frontend/src/components/layout/Header/LoggedInMenu/LoggedInMenu.style.ts
index 5f2289122..9c3fe6229 100644
--- a/frontend/src/components/layout/Header/LoggedInMenu/LoggedInMenu.style.ts
+++ b/frontend/src/components/layout/Header/LoggedInMenu/LoggedInMenu.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const imageStyling = css({
diff --git a/frontend/src/components/layout/Header/LoggedInMenu/LoggedInMenu.tsx b/frontend/src/components/layout/Header/LoggedInMenu/LoggedInMenu.tsx
index 0a02be722..c86600af8 100644
--- a/frontend/src/components/layout/Header/LoggedInMenu/LoggedInMenu.tsx
+++ b/frontend/src/components/layout/Header/LoggedInMenu/LoggedInMenu.tsx
@@ -1,18 +1,20 @@
/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
-import { ACCESS_TOKEN_KEY } from '@constants/api';
-import { PATH } from '@constants/path';
-import { Menu, MenuItem, MenuList, useOverlay } from 'hang-log-design-system';
import type { KeyboardEvent } from 'react';
import { useNavigate } from 'react-router-dom';
-import { useLogOutMutation } from '@hooks/api/useLogOutMutation';
-import { useUserInfoQuery } from '@hooks/api/useUserInfoQuery';
+import { Menu, MenuItem, MenuList, useOverlay } from 'hang-log-design-system';
import {
imageStyling,
menuListStyling,
} from '@components/layout/Header/LoggedInMenu/LoggedInMenu.style';
+import { useLogOutMutation } from '@hooks/api/useLogOutMutation';
+import { useUserInfoQuery } from '@hooks/api/useUserInfoQuery';
+
+import { ACCESS_TOKEN_KEY } from '@constants/api';
+import { PATH } from '@constants/path';
+
const LoggedInMenu = () => {
const navigate = useNavigate();
diff --git a/frontend/src/components/layout/Header/LoggedOutMenu/LoggedOutMenu.tsx b/frontend/src/components/layout/Header/LoggedOutMenu/LoggedOutMenu.tsx
index c9bd4a1f3..5169c8e3d 100644
--- a/frontend/src/components/layout/Header/LoggedOutMenu/LoggedOutMenu.tsx
+++ b/frontend/src/components/layout/Header/LoggedOutMenu/LoggedOutMenu.tsx
@@ -1,9 +1,11 @@
-import { PATH } from '@constants/path';
-import { Button, Flex, Theme } from 'hang-log-design-system';
import { useNavigate } from 'react-router-dom';
+import { Button, Flex, Theme } from 'hang-log-design-system';
+
import { getItemStyling } from '@components/layout/Header/Header.style';
+import { PATH } from '@constants/path';
+
const LoggedOutMenu = () => {
const navigate = useNavigate();
diff --git a/frontend/src/components/myPage/EditUserProfileForm/EditUserProfileForm.style.ts b/frontend/src/components/myPage/EditUserProfileForm/EditUserProfileForm.style.ts
index fa23954d8..6d67f1352 100644
--- a/frontend/src/components/myPage/EditUserProfileForm/EditUserProfileForm.style.ts
+++ b/frontend/src/components/myPage/EditUserProfileForm/EditUserProfileForm.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const formStyling = css({
diff --git a/frontend/src/components/myPage/EditUserProfileForm/EditUserProfileForm.tsx b/frontend/src/components/myPage/EditUserProfileForm/EditUserProfileForm.tsx
index 911150994..41162e8b0 100644
--- a/frontend/src/components/myPage/EditUserProfileForm/EditUserProfileForm.tsx
+++ b/frontend/src/components/myPage/EditUserProfileForm/EditUserProfileForm.tsx
@@ -1,8 +1,6 @@
-import type { UserData } from '@type/member';
-import { Button } from 'hang-log-design-system';
import { Link } from 'react-router-dom';
-import { useEditUserProfileForm } from '@hooks/member/useEditUserProfileForm';
+import { Button } from 'hang-log-design-system';
import {
buttonStyling,
@@ -13,6 +11,10 @@ import {
import NicknameInput from '@components/myPage/EditUserProfileForm/NicknameInput/NicknameInput';
import ProfileImageInput from '@components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput';
+import { useEditUserProfileForm } from '@hooks/member/useEditUserProfileForm';
+
+import type { UserData } from '@type/member';
+
interface EditUserProfileForm {
initialData: UserData;
}
diff --git a/frontend/src/components/myPage/EditUserProfileForm/NicknameInput/NicknameInput.style.ts b/frontend/src/components/myPage/EditUserProfileForm/NicknameInput/NicknameInput.style.ts
index d8cb3de50..0a0edf9c0 100644
--- a/frontend/src/components/myPage/EditUserProfileForm/NicknameInput/NicknameInput.style.ts
+++ b/frontend/src/components/myPage/EditUserProfileForm/NicknameInput/NicknameInput.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const inputStyling = css({
diff --git a/frontend/src/components/myPage/EditUserProfileForm/NicknameInput/NicknameInput.tsx b/frontend/src/components/myPage/EditUserProfileForm/NicknameInput/NicknameInput.tsx
index f420c8aca..77fc75113 100644
--- a/frontend/src/components/myPage/EditUserProfileForm/NicknameInput/NicknameInput.tsx
+++ b/frontend/src/components/myPage/EditUserProfileForm/NicknameInput/NicknameInput.tsx
@@ -1,10 +1,13 @@
-import { NICKNAME_MAX_LENGTH } from '@constants/ui';
-import type { UserData } from '@type/member';
-import { Input } from 'hang-log-design-system';
import { type ChangeEvent, useCallback } from 'react';
+import { Input } from 'hang-log-design-system';
+
import { inputStyling } from '@components/myPage/EditUserProfileForm/NicknameInput/NicknameInput.style';
+import type { UserData } from '@type/member';
+
+import { NICKNAME_MAX_LENGTH } from '@constants/ui';
+
interface NicknameInputProps {
value: string;
isError: boolean;
diff --git a/frontend/src/components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput.style.ts b/frontend/src/components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput.style.ts
index 6051649d0..295eea483 100644
--- a/frontend/src/components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput.style.ts
+++ b/frontend/src/components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const wrapperStyling = css({
diff --git a/frontend/src/components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput.tsx b/frontend/src/components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput.tsx
index 3e09fe353..39f7b3d41 100644
--- a/frontend/src/components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput.tsx
+++ b/frontend/src/components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput.tsx
@@ -1,9 +1,7 @@
-import type { UserData } from '@type/member';
-import { Box, Button } from 'hang-log-design-system';
import type { ComponentPropsWithoutRef } from 'react';
import { memo, useCallback, useRef } from 'react';
-import { useImageUpload } from '@hooks/common/useImageUpload';
+import { Box, Button } from 'hang-log-design-system';
import {
imageStyling,
@@ -12,6 +10,10 @@ import {
wrapperStyling,
} from '@components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput.style';
+import { useImageUpload } from '@hooks/common/useImageUpload';
+
+import type { UserData } from '@type/member';
+
interface ProfileImageInputProps extends ComponentPropsWithoutRef<'div'> {
initialImageUrl: string;
updateInputValue: (key: K, value: UserData[K]) => void;
diff --git a/frontend/src/components/trip/TripCreateForm/TripCreateForm.style.ts b/frontend/src/components/trip/TripCreateForm/TripCreateForm.style.ts
index c712f4bd3..1cab8c612 100644
--- a/frontend/src/components/trip/TripCreateForm/TripCreateForm.style.ts
+++ b/frontend/src/components/trip/TripCreateForm/TripCreateForm.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const formStyling = css({
diff --git a/frontend/src/components/trip/TripCreateForm/TripCreateForm.tsx b/frontend/src/components/trip/TripCreateForm/TripCreateForm.tsx
index 54cfe026b..3d5a7719c 100644
--- a/frontend/src/components/trip/TripCreateForm/TripCreateForm.tsx
+++ b/frontend/src/components/trip/TripCreateForm/TripCreateForm.tsx
@@ -1,15 +1,17 @@
-import { PATH } from '@constants/path';
-import { Button } from 'hang-log-design-system';
import type { FormEvent } from 'react';
import { useNavigate } from 'react-router-dom';
-import { useCreateTripMutation } from '@hooks/api/useCreateTripMutation';
-import { useCityDateForm } from '@hooks/common/useCityDateForm';
+import { Button } from 'hang-log-design-system';
import CitySearchBar from '@components/common/CitySearchBar/CitySearchBar';
import DateInput from '@components/common/DateInput/DateInput';
import { formStyling } from '@components/trip/TripCreateForm/TripCreateForm.style';
+import { useCreateTripMutation } from '@hooks/api/useCreateTripMutation';
+import { useCityDateForm } from '@hooks/common/useCityDateForm';
+
+import { PATH } from '@constants/path';
+
const TripCreateForm = () => {
const { cityDateInfo, updateCityInfo, updateDateInfo, isCityDateValid } = useCityDateForm();
const createTripMutation = useCreateTripMutation();
diff --git a/frontend/src/components/trip/TripInfoEditModal/ImageInput/ImageInput.tsx b/frontend/src/components/trip/TripInfoEditModal/ImageInput/ImageInput.tsx
index 30e079964..ac8695d07 100644
--- a/frontend/src/components/trip/TripInfoEditModal/ImageInput/ImageInput.tsx
+++ b/frontend/src/components/trip/TripInfoEditModal/ImageInput/ImageInput.tsx
@@ -1,6 +1,7 @@
-import { ImageUploadInput } from 'hang-log-design-system';
import { useCallback } from 'react';
+import { ImageUploadInput } from 'hang-log-design-system';
+
import { useImageUpload } from '@hooks/common/useImageUpload';
interface ImageInputProps {
diff --git a/frontend/src/components/trip/TripInfoEditModal/TripInfoEditModal.style.ts b/frontend/src/components/trip/TripInfoEditModal/TripInfoEditModal.style.ts
index 1776649de..a2bca61af 100644
--- a/frontend/src/components/trip/TripInfoEditModal/TripInfoEditModal.style.ts
+++ b/frontend/src/components/trip/TripInfoEditModal/TripInfoEditModal.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const wrapperStyling = css({
diff --git a/frontend/src/components/trip/TripInfoEditModal/TripInfoEditModal.tsx b/frontend/src/components/trip/TripInfoEditModal/TripInfoEditModal.tsx
index 7c5d98c55..303d7890f 100644
--- a/frontend/src/components/trip/TripInfoEditModal/TripInfoEditModal.tsx
+++ b/frontend/src/components/trip/TripInfoEditModal/TripInfoEditModal.tsx
@@ -1,10 +1,5 @@
-import WarningIcon from '@assets/svg/warning-icon.svg';
-import { TRIP_DESCRIPTION_MAX_LENGTH, TRIP_TITLE_MAX_LENGTH } from '@constants/ui';
-import type { TripData } from '@type/trip';
import { Button, Flex, Input, Modal, SupportingText, Textarea } from 'hang-log-design-system';
-import { useTripEditForm } from '@hooks/trip/useTripEditForm';
-
import CitySearchBar from '@components/common/CitySearchBar/CitySearchBar';
import DateInput from '@components/common/DateInput/DateInput';
import ImageInput from '@components/trip/TripInfoEditModal/ImageInput/ImageInput';
@@ -15,6 +10,14 @@ import {
wrapperStyling,
} from '@components/trip/TripInfoEditModal/TripInfoEditModal.style';
+import { useTripEditForm } from '@hooks/trip/useTripEditForm';
+
+import type { TripData } from '@type/trip';
+
+import { TRIP_DESCRIPTION_MAX_LENGTH, TRIP_TITLE_MAX_LENGTH } from '@constants/ui';
+
+import WarningIcon from '@assets/svg/warning-icon.svg';
+
interface TripInfoEditModalProps extends Omit {
isOpen: boolean;
onClose: () => void;
diff --git a/frontend/src/components/trip/TripItemAddModal/CategoryInput/CategoryInput.tsx b/frontend/src/components/trip/TripItemAddModal/CategoryInput/CategoryInput.tsx
index 5447bff76..0b61fe0c5 100644
--- a/frontend/src/components/trip/TripItemAddModal/CategoryInput/CategoryInput.tsx
+++ b/frontend/src/components/trip/TripItemAddModal/CategoryInput/CategoryInput.tsx
@@ -1,9 +1,12 @@
-import { TRIP_ITEM_ADD_CATEGORIES } from '@constants/trip';
-import type { TripItemFormData } from '@type/tripItem';
-import { RadioButton } from 'hang-log-design-system';
import type { ChangeEvent } from 'react';
import { memo } from 'react';
+import { RadioButton } from 'hang-log-design-system';
+
+import type { TripItemFormData } from '@type/tripItem';
+
+import { TRIP_ITEM_ADD_CATEGORIES } from '@constants/trip';
+
interface CategoryInputProps {
itemType: TripItemFormData['itemType'];
updateInputValue: (key: K, value: TripItemFormData[K]) => void;
diff --git a/frontend/src/components/trip/TripItemAddModal/DateInput/DateInput.tsx b/frontend/src/components/trip/TripItemAddModal/DateInput/DateInput.tsx
index c912b4ca6..cc49bfad0 100644
--- a/frontend/src/components/trip/TripItemAddModal/DateInput/DateInput.tsx
+++ b/frontend/src/components/trip/TripItemAddModal/DateInput/DateInput.tsx
@@ -1,14 +1,16 @@
/* eslint-disable react/jsx-no-useless-fragment */
-import type { TripItemFormData } from '@type/tripItem';
-import { Select } from 'hang-log-design-system';
import type { ChangeEvent } from 'react';
import { memo } from 'react';
-import { formatMonthDate } from '@utils/formatter';
+import { Select } from 'hang-log-design-system';
+
+import { selectStyling } from '@components/trip/TripItemAddModal/DateInput/DateInput.style';
import { useTripDates } from '@hooks/trip/useTripDates';
-import { selectStyling } from '@components/trip/TripItemAddModal/DateInput/DateInput.style';
+import { formatMonthDate } from '@utils/formatter';
+
+import type { TripItemFormData } from '@type/tripItem';
interface DateInputProps {
currentCategory: TripItemFormData['itemType'];
diff --git a/frontend/src/components/trip/TripItemAddModal/ExpenseInput/ExpenseInput.style.ts b/frontend/src/components/trip/TripItemAddModal/ExpenseInput/ExpenseInput.style.ts
index d047fa4b0..dfaf992a2 100644
--- a/frontend/src/components/trip/TripItemAddModal/ExpenseInput/ExpenseInput.style.ts
+++ b/frontend/src/components/trip/TripItemAddModal/ExpenseInput/ExpenseInput.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const leftContainerStyling = css({
diff --git a/frontend/src/components/trip/TripItemAddModal/ExpenseInput/ExpenseInput.tsx b/frontend/src/components/trip/TripItemAddModal/ExpenseInput/ExpenseInput.tsx
index 77342ec68..ffb31e18e 100644
--- a/frontend/src/components/trip/TripItemAddModal/ExpenseInput/ExpenseInput.tsx
+++ b/frontend/src/components/trip/TripItemAddModal/ExpenseInput/ExpenseInput.tsx
@@ -1,9 +1,6 @@
-import { CURRENCY_ICON } from '@constants/trip';
-import type { TripItemFormData } from '@type/tripItem';
-import { Flex, Input, Label, Select, Theme } from 'hang-log-design-system';
import { memo } from 'react';
-import { useTripItemExpenseInput } from '@hooks/trip/useTripItemExpenseInput';
+import { Flex, Input, Label, Select, Theme } from 'hang-log-design-system';
import {
categorySelectStyling,
@@ -11,6 +8,13 @@ import {
leftContainerStyling,
} from '@components/trip/TripItemAddModal/ExpenseInput/ExpenseInput.style';
+import { useTripItemExpenseInput } from '@hooks/trip/useTripItemExpenseInput';
+
+import type { TripItemFormData } from '@type/tripItem';
+
+import { CURRENCY_ICON } from '@constants/trip';
+import { AMOUNT_MAX_LIMIT } from '@constants/ui';
+
interface ExpenseInputProps {
initialExpenseValue: TripItemFormData['expense'];
updateInputValue: (key: K, value: TripItemFormData[K]) => void;
@@ -54,6 +58,8 @@ const ExpenseInput = ({ initialExpenseValue, updateInputValue }: ExpenseInputPro
type="number"
placeholder="0"
aria-label="비용"
+ min={0}
+ max={AMOUNT_MAX_LIMIT}
value={initialExpenseValue?.amount}
onChange={handleAmountChange}
/>
diff --git a/frontend/src/components/trip/TripItemAddModal/ImageInput/ImageInput.tsx b/frontend/src/components/trip/TripItemAddModal/ImageInput/ImageInput.tsx
index dfaecad97..e04cc1007 100644
--- a/frontend/src/components/trip/TripItemAddModal/ImageInput/ImageInput.tsx
+++ b/frontend/src/components/trip/TripItemAddModal/ImageInput/ImageInput.tsx
@@ -1,14 +1,19 @@
-import { TRIP_ITEM_ADD_MAX_IMAGE_UPLOAD_COUNT } from '@constants/ui';
-import { toastListState } from '@store/toast';
-import type { TripItemFormData } from '@type/tripItem';
-import { ImageUploadInput } from 'hang-log-design-system';
import { useCallback } from 'react';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { ImageUploadInput } from 'hang-log-design-system';
import { useImageUpload } from '@hooks/common/useImageUpload';
+import { toastListState } from '@store/toast';
+
+import { generateUniqueId } from '@utils/uniqueId';
+
+import type { TripItemFormData } from '@type/tripItem';
+
+import { TRIP_ITEM_ADD_MAX_IMAGE_UPLOAD_COUNT } from '@constants/ui';
+
interface ImageInputProps {
initialImageUrls: string[];
updateInputValue: (key: K, value: TripItemFormData[K]) => void;
diff --git a/frontend/src/components/trip/TripItemAddModal/MemoInput/MemoInput.tsx b/frontend/src/components/trip/TripItemAddModal/MemoInput/MemoInput.tsx
index 89d82ee24..47f49f4f0 100644
--- a/frontend/src/components/trip/TripItemAddModal/MemoInput/MemoInput.tsx
+++ b/frontend/src/components/trip/TripItemAddModal/MemoInput/MemoInput.tsx
@@ -1,11 +1,14 @@
-import { TRIP_ITEM_MEMO_MAX_LENGTH } from '@constants/ui';
-import type { TripItemFormData } from '@type/tripItem';
-import { Textarea } from 'hang-log-design-system';
import type { ChangeEvent } from 'react';
import { memo } from 'react';
+import { Textarea } from 'hang-log-design-system';
+
import { textareaStyling } from '@components/trip/TripItemAddModal/MemoInput/MemoInput.style';
+import type { TripItemFormData } from '@type/tripItem';
+
+import { TRIP_ITEM_MEMO_MAX_LENGTH } from '@constants/ui';
+
interface MemoInputProps {
value: TripItemFormData['memo'];
updateInputValue: (key: K, value: TripItemFormData[K]) => void;
diff --git a/frontend/src/components/trip/TripItemAddModal/PlaceInput/PlaceInput.style.ts b/frontend/src/components/trip/TripItemAddModal/PlaceInput/PlaceInput.style.ts
index 216629a7a..2eeacad28 100644
--- a/frontend/src/components/trip/TripItemAddModal/PlaceInput/PlaceInput.style.ts
+++ b/frontend/src/components/trip/TripItemAddModal/PlaceInput/PlaceInput.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const wrapperStyling = css({
diff --git a/frontend/src/components/trip/TripItemAddModal/PlaceInput/PlaceInput.tsx b/frontend/src/components/trip/TripItemAddModal/PlaceInput/PlaceInput.tsx
index c332c9828..6a412bfee 100644
--- a/frontend/src/components/trip/TripItemAddModal/PlaceInput/PlaceInput.tsx
+++ b/frontend/src/components/trip/TripItemAddModal/PlaceInput/PlaceInput.tsx
@@ -1,11 +1,13 @@
-import type { TripItemFormData } from '@type/tripItem';
-import { Box, Input } from 'hang-log-design-system';
import { memo } from 'react';
-import { useTripItemPlaceInput } from '@hooks/trip/useTripItemPlaceInput';
+import { Box, Input } from 'hang-log-design-system';
import { wrapperStyling } from '@components/trip/TripItemAddModal/PlaceInput/PlaceInput.style';
+import { useTripItemPlaceInput } from '@hooks/trip/useTripItemPlaceInput';
+
+import type { TripItemFormData } from '@type/tripItem';
+
interface PlaceInputProps {
value: string;
isError: boolean;
diff --git a/frontend/src/components/trip/TripItemAddModal/StarRatingInput/StarRatingInput.tsx b/frontend/src/components/trip/TripItemAddModal/StarRatingInput/StarRatingInput.tsx
index 1088ff5d6..e1f44f3aa 100644
--- a/frontend/src/components/trip/TripItemAddModal/StarRatingInput/StarRatingInput.tsx
+++ b/frontend/src/components/trip/TripItemAddModal/StarRatingInput/StarRatingInput.tsx
@@ -1,7 +1,9 @@
-import type { StarRatingData, TripItemFormData } from '@type/tripItem';
-import { StarRatingInput as StarRating, useStarRatingInput } from 'hang-log-design-system';
import { memo } from 'react';
+import { StarRatingInput as StarRating, useStarRatingInput } from 'hang-log-design-system';
+
+import type { StarRatingData, TripItemFormData } from '@type/tripItem';
+
interface StarRatingInputProps {
rating: StarRatingData | null;
updateInputValue: (key: K, value: TripItemFormData[K]) => void;
diff --git a/frontend/src/components/trip/TripItemAddModal/TitleInput/TitleInput.tsx b/frontend/src/components/trip/TripItemAddModal/TitleInput/TitleInput.tsx
index 5fd79831f..aca2f3270 100644
--- a/frontend/src/components/trip/TripItemAddModal/TitleInput/TitleInput.tsx
+++ b/frontend/src/components/trip/TripItemAddModal/TitleInput/TitleInput.tsx
@@ -1,9 +1,12 @@
-import { TRIP_ITEM_TITLE_MAX_LENGTH } from '@constants/ui';
-import type { TripItemFormData } from '@type/tripItem';
-import { Input } from 'hang-log-design-system';
import type { ChangeEvent } from 'react';
import { memo } from 'react';
+import { Input } from 'hang-log-design-system';
+
+import type { TripItemFormData } from '@type/tripItem';
+
+import { TRIP_ITEM_TITLE_MAX_LENGTH } from '@constants/ui';
+
interface TitleInputProps {
value: string;
isError: boolean;
diff --git a/frontend/src/components/trip/TripItemAddModal/TripItemAddModal.style.ts b/frontend/src/components/trip/TripItemAddModal/TripItemAddModal.style.ts
index 643508205..805e26353 100644
--- a/frontend/src/components/trip/TripItemAddModal/TripItemAddModal.style.ts
+++ b/frontend/src/components/trip/TripItemAddModal/TripItemAddModal.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const wrapperStyling = css({
diff --git a/frontend/src/components/trip/TripItemAddModal/TripItemAddModal.tsx b/frontend/src/components/trip/TripItemAddModal/TripItemAddModal.tsx
index 4b46518ba..85e3d3316 100644
--- a/frontend/src/components/trip/TripItemAddModal/TripItemAddModal.tsx
+++ b/frontend/src/components/trip/TripItemAddModal/TripItemAddModal.tsx
@@ -1,9 +1,6 @@
-import { mediaQueryMobileState } from '@store/mediaQuery';
-import type { TripItemFormData } from '@type/tripItem';
-import { Button, Flex, Modal, Theme } from 'hang-log-design-system';
import { useRecoilValue } from 'recoil';
-import { useAddTripItemForm } from '@hooks/trip/useAddTripItemForm';
+import { Button, Flex, Modal, Theme } from 'hang-log-design-system';
import GoogleMapWrapper from '@components/common/GoogleMapWrapper/GoogleMapWrapper';
import CategoryInput from '@components/trip/TripItemAddModal/CategoryInput/CategoryInput';
@@ -19,6 +16,12 @@ import {
wrapperStyling,
} from '@components/trip/TripItemAddModal/TripItemAddModal.style';
+import { useAddTripItemForm } from '@hooks/trip/useAddTripItemForm';
+
+import { mediaQueryMobileState } from '@store/mediaQuery';
+
+import type { TripItemFormData } from '@type/tripItem';
+
interface TripItemAddModalProps {
tripId: number;
dayLogId: number;
diff --git a/frontend/src/components/trips/TripsHeader/TripsHeader.style.ts b/frontend/src/components/trips/TripsHeader/TripsHeader.style.ts
index 3ad36750a..a010ef320 100644
--- a/frontend/src/components/trips/TripsHeader/TripsHeader.style.ts
+++ b/frontend/src/components/trips/TripsHeader/TripsHeader.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const imageStyling = css({
diff --git a/frontend/src/components/trips/TripsHeader/TripsHeader.tsx b/frontend/src/components/trips/TripsHeader/TripsHeader.tsx
index df3499319..6fb80c41c 100644
--- a/frontend/src/components/trips/TripsHeader/TripsHeader.tsx
+++ b/frontend/src/components/trips/TripsHeader/TripsHeader.tsx
@@ -1,9 +1,10 @@
-import TripsHeaderImage from '@assets/svg/TripsHeader.svg';
import { Flex, Heading, Theme } from 'hang-log-design-system';
+import { headingStyling, imageStyling } from '@components/trips/TripsHeader/TripsHeader.style';
+
import { useUserInfoQuery } from '@hooks/api/useUserInfoQuery';
-import { headingStyling, imageStyling } from '@components/trips/TripsHeader/TripsHeader.style';
+import TripsHeaderImage from '@assets/svg/TripsHeader.svg';
const TripsHeader = () => {
const { userInfoData } = useUserInfoQuery();
diff --git a/frontend/src/components/trips/TripsHeader/TripsHeaderSkeleton.tsx b/frontend/src/components/trips/TripsHeader/TripsHeaderSkeleton.tsx
index db1afbe6b..ac60843db 100644
--- a/frontend/src/components/trips/TripsHeader/TripsHeaderSkeleton.tsx
+++ b/frontend/src/components/trips/TripsHeader/TripsHeaderSkeleton.tsx
@@ -1,8 +1,9 @@
-import TripsHeaderImage from '@assets/svg/TripsHeader.svg';
import { Flex, Skeleton, Theme } from 'hang-log-design-system';
import { headingStyling, imageStyling } from '@components/trips/TripsHeader/TripsHeader.style';
+import TripsHeaderImage from '@assets/svg/TripsHeader.svg';
+
const TripsHeaderSkeleton = () => {
return (
{
return (
<>
diff --git a/frontend/src/components/trips/TutorialModal/TutorialModal.style.ts b/frontend/src/components/trips/TutorialModal/TutorialModal.style.ts
index c9c64636e..3bfe13949 100644
--- a/frontend/src/components/trips/TutorialModal/TutorialModal.style.ts
+++ b/frontend/src/components/trips/TutorialModal/TutorialModal.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const boxStyling = css({
diff --git a/frontend/src/components/trips/TutorialModal/TutorialModal.tsx b/frontend/src/components/trips/TutorialModal/TutorialModal.tsx
index 267fbc447..f17bbadf5 100644
--- a/frontend/src/components/trips/TutorialModal/TutorialModal.tsx
+++ b/frontend/src/components/trips/TutorialModal/TutorialModal.tsx
@@ -1,18 +1,22 @@
-import Tutorial1SVG from '@assets/svg/tutorial1.svg';
-import Tutorial2SVG from '@assets/svg/tutorial2.svg';
-import Tutorial3SVG from '@assets/svg/tutorial3.svg';
-import Tutorial4SVG from '@assets/svg/tutorial4.svg';
-import { mediaQueryMobileState } from '@store/mediaQuery';
-import { Button, Flex, Modal, SVGCarousel, useOverlay } from 'hang-log-design-system';
import { useEffect } from 'react';
+
import { useRecoilValue } from 'recoil';
+import { Button, Flex, Modal, SVGCarousel, useOverlay } from 'hang-log-design-system';
+
import {
boxStyling,
buttonStyling,
modalStyling,
} from '@components/trips/TutorialModal/TutorialModal.style';
+import { mediaQueryMobileState } from '@store/mediaQuery';
+
+import Tutorial1SVG from '@assets/svg/tutorial1.svg';
+import Tutorial2SVG from '@assets/svg/tutorial2.svg';
+import Tutorial3SVG from '@assets/svg/tutorial3.svg';
+import Tutorial4SVG from '@assets/svg/tutorial4.svg';
+
const TutorialModal = () => {
const { isOpen: isTutorialOpen, open: openTutorial, close: closeTutorial } = useOverlay();
const isMobile = useRecoilValue(mediaQueryMobileState);
diff --git a/frontend/src/constants/api.ts b/frontend/src/constants/api.ts
index ebbca5214..306f23931 100644
--- a/frontend/src/constants/api.ts
+++ b/frontend/src/constants/api.ts
@@ -4,6 +4,10 @@ export const BASE_URL = PROD
? `${window.location.protocol}//${process.env.PROD_BASE_URL}/api`
: 'http://localhost:3000';
+export const AXIOS_BASE_URL = PROD
+ ? `${window.location.protocol}//${process.env.PROD_BASE_URL}/api`
+ : '/';
+
export const END_POINTS = {
TRIPS: '/trips',
TRIP: (tripId: number) => `/trips/${tripId}`,
diff --git a/frontend/src/constants/regex.ts b/frontend/src/constants/regex.ts
index ddd7fddd5..e42b6dbae 100644
--- a/frontend/src/constants/regex.ts
+++ b/frontend/src/constants/regex.ts
@@ -1,3 +1,4 @@
export const REGEX = {
- ONLY_LETTER: '^[A-Za-z가-힣ㄱ-ㅎ]+$',
+ ONLY_LETTER: /^[A-Za-z가-힣ㄱ-ㅎ]+$/g,
+ ALPHABET_AND_KOREAN_CHARACTERS: /^[a-zA-Zㄱ-ㅎㅏ-ㅣ가-힣]*$/,
};
diff --git a/frontend/src/constants/ui.ts b/frontend/src/constants/ui.ts
index 2c21c571d..6a7231f77 100644
--- a/frontend/src/constants/ui.ts
+++ b/frontend/src/constants/ui.ts
@@ -23,3 +23,5 @@ export const TRIP_ITEM_MEMO_MAX_LENGTH = 255;
export const NICKNAME_MAX_LENGTH = 15;
export const MOBILE_MEDIA_QUERY_SIZE = '(max-width: 600px)';
+
+export const AMOUNT_MAX_LIMIT = 100_000_000;
diff --git a/frontend/src/hooks/api/useAddTripItemMutation.ts b/frontend/src/hooks/api/useAddTripItemMutation.ts
index 171e25907..b89b7e59d 100644
--- a/frontend/src/hooks/api/useAddTripItemMutation.ts
+++ b/frontend/src/hooks/api/useAddTripItemMutation.ts
@@ -1,14 +1,17 @@
-import { ERROR_CODE } from '@constants/api';
-import { toastListState } from '@store/toast';
import { useMutation, useQueryClient } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { useTokenError } from '@hooks/member/useTokenError';
+
+import { toastListState } from '@store/toast';
import type { ErrorResponseData } from '@api/interceptors';
import { postTripItem } from '@api/tripItem/postTripItem';
-import { useTokenError } from '@hooks/member/useTokenError';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ERROR_CODE } from '@constants/api';
export const useAddTripItemMutation = () => {
const queryClient = useQueryClient();
diff --git a/frontend/src/hooks/api/useCityQuery.ts b/frontend/src/hooks/api/useCityQuery.ts
index c77dc00ed..a3d29a631 100644
--- a/frontend/src/hooks/api/useCityQuery.ts
+++ b/frontend/src/hooks/api/useCityQuery.ts
@@ -1,10 +1,13 @@
-import { NETWORK } from '@constants/api';
import { useQuery } from '@tanstack/react-query';
-import type { CityData } from '@type/city';
+
import type { AxiosError } from 'axios';
import { getCity } from '@api/city/getCity';
+import type { CityData } from '@type/city';
+
+import { NETWORK } from '@constants/api';
+
export const useCityQuery = () => {
const { data } = useQuery(['city'], getCity, {
retry: NETWORK.RETRY_COUNT,
diff --git a/frontend/src/hooks/api/useCreateTripMutation.ts b/frontend/src/hooks/api/useCreateTripMutation.ts
index c1bcf3f62..6b3eb0901 100644
--- a/frontend/src/hooks/api/useCreateTripMutation.ts
+++ b/frontend/src/hooks/api/useCreateTripMutation.ts
@@ -1,14 +1,17 @@
-import { ERROR_CODE } from '@constants/api';
-import { toastListState } from '@store/toast';
import { useMutation } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { useTokenError } from '@hooks/member/useTokenError';
+
+import { toastListState } from '@store/toast';
import type { ErrorResponseData } from '@api/interceptors';
import { postTrip } from '@api/trip/postTrip';
-import { useTokenError } from '@hooks/member/useTokenError';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ERROR_CODE } from '@constants/api';
export const useCreateTripMutation = () => {
const setToastList = useSetRecoilState(toastListState);
diff --git a/frontend/src/hooks/api/useDayLogOrderMutation.ts b/frontend/src/hooks/api/useDayLogOrderMutation.ts
index 1e88ea850..a9a8f29b0 100644
--- a/frontend/src/hooks/api/useDayLogOrderMutation.ts
+++ b/frontend/src/hooks/api/useDayLogOrderMutation.ts
@@ -1,14 +1,17 @@
-import { ERROR_CODE } from '@constants/api';
-import { toastListState } from '@store/toast';
import { useMutation, useQueryClient } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { useTokenError } from '@hooks/member/useTokenError';
+
+import { toastListState } from '@store/toast';
import { patchDayLogItemOrder } from '@api/dayLog/patchDayLogItemOrder';
import type { ErrorResponseData } from '@api/interceptors';
-import { useTokenError } from '@hooks/member/useTokenError';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ERROR_CODE } from '@constants/api';
export const useDayLogOrderMutation = () => {
const queryClient = useQueryClient();
diff --git a/frontend/src/hooks/api/useDayLogTitleMutation.ts b/frontend/src/hooks/api/useDayLogTitleMutation.ts
index 8e58a696c..0aa500751 100644
--- a/frontend/src/hooks/api/useDayLogTitleMutation.ts
+++ b/frontend/src/hooks/api/useDayLogTitleMutation.ts
@@ -1,14 +1,17 @@
-import { ERROR_CODE } from '@constants/api';
-import { toastListState } from '@store/toast';
import { useMutation, useQueryClient } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { useTokenError } from '@hooks/member/useTokenError';
+
+import { toastListState } from '@store/toast';
import { patchDayLogTitle } from '@api/dayLog/patchDayLogTitle';
import type { ErrorResponseData } from '@api/interceptors';
-import { useTokenError } from '@hooks/member/useTokenError';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ERROR_CODE } from '@constants/api';
export const useDayLogTitleMutation = () => {
const queryClient = useQueryClient();
diff --git a/frontend/src/hooks/api/useDeleteTripItemMutation.ts b/frontend/src/hooks/api/useDeleteTripItemMutation.ts
index a4abd268b..73f102cbb 100644
--- a/frontend/src/hooks/api/useDeleteTripItemMutation.ts
+++ b/frontend/src/hooks/api/useDeleteTripItemMutation.ts
@@ -1,15 +1,19 @@
-import { ERROR_CODE } from '@constants/api';
-import { toastListState } from '@store/toast';
import { useMutation, useQueryClient } from '@tanstack/react-query';
-import type { TripData } from '@type/trip';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { useTokenError } from '@hooks/member/useTokenError';
+
+import { toastListState } from '@store/toast';
import type { ErrorResponseData } from '@api/interceptors';
import { deleteTripItem } from '@api/tripItem/deleteTripItem';
-import { useTokenError } from '@hooks/member/useTokenError';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import type { TripData } from '@type/trip';
+
+import { ERROR_CODE } from '@constants/api';
export const useDeleteTripItemMutation = () => {
const queryClient = useQueryClient();
diff --git a/frontend/src/hooks/api/useDeleteTripMutation.ts b/frontend/src/hooks/api/useDeleteTripMutation.ts
index 7788f8495..df12da2f7 100644
--- a/frontend/src/hooks/api/useDeleteTripMutation.ts
+++ b/frontend/src/hooks/api/useDeleteTripMutation.ts
@@ -1,14 +1,17 @@
-import { ERROR_CODE } from '@constants/api';
-import { toastListState } from '@store/toast';
import { useMutation, useQueryClient } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { useTokenError } from '@hooks/member/useTokenError';
+
+import { toastListState } from '@store/toast';
import type { ErrorResponseData } from '@api/interceptors';
import { deleteTrip } from '@api/trip/deleteTrip';
-import { useTokenError } from '@hooks/member/useTokenError';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ERROR_CODE } from '@constants/api';
export const useDeleteTripMutation = () => {
const queryClient = useQueryClient();
diff --git a/frontend/src/hooks/api/useExpenseCategoryQuery.ts b/frontend/src/hooks/api/useExpenseCategoryQuery.ts
index 5d0a44a34..3e3aecffb 100644
--- a/frontend/src/hooks/api/useExpenseCategoryQuery.ts
+++ b/frontend/src/hooks/api/useExpenseCategoryQuery.ts
@@ -1,10 +1,13 @@
-import { NETWORK } from '@constants/api';
import { useQuery } from '@tanstack/react-query';
-import type { ExpenseCategoryData } from '@type/expense';
+
import type { AxiosError } from 'axios';
import { getExpenseCategory } from '@api/expense/getExpenseCategory';
+import type { ExpenseCategoryData } from '@type/expense';
+
+import { NETWORK } from '@constants/api';
+
export const useExpenseCategoryQuery = () => {
const { data } = useQuery(
['expenseCategory'],
diff --git a/frontend/src/hooks/api/useExpenseQuery.ts b/frontend/src/hooks/api/useExpenseQuery.ts
index 84adfc5f6..c2e2d5e0d 100644
--- a/frontend/src/hooks/api/useExpenseQuery.ts
+++ b/frontend/src/hooks/api/useExpenseQuery.ts
@@ -1,10 +1,13 @@
-import { NETWORK } from '@constants/api';
import { useQuery } from '@tanstack/react-query';
-import type { ExpenseData } from '@type/expense';
+
import type { AxiosError } from 'axios';
import { getExpense } from '@api/expense/getExpense';
+import type { ExpenseData } from '@type/expense';
+
+import { NETWORK } from '@constants/api';
+
export const useExpenseQuery = (tripId: number) => {
const { data } = useQuery(
['expense', tripId],
diff --git a/frontend/src/hooks/api/useImageMutation.ts b/frontend/src/hooks/api/useImageMutation.ts
index cb2c1048a..002e25ff6 100644
--- a/frontend/src/hooks/api/useImageMutation.ts
+++ b/frontend/src/hooks/api/useImageMutation.ts
@@ -1,14 +1,17 @@
-import { ERROR_CODE } from '@constants/api';
-import { toastListState } from '@store/toast';
import { useMutation } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { useTokenError } from '@hooks/member/useTokenError';
+
+import { toastListState } from '@store/toast';
import { postImage } from '@api/image/postImage';
import type { ErrorResponseData } from '@api/interceptors';
-import { useTokenError } from '@hooks/member/useTokenError';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ERROR_CODE } from '@constants/api';
export const useImageMutation = () => {
const setToastList = useSetRecoilState(toastListState);
diff --git a/frontend/src/hooks/api/useLogInMutation.ts b/frontend/src/hooks/api/useLogInMutation.ts
index f58a3e7c1..cbc308de9 100644
--- a/frontend/src/hooks/api/useLogInMutation.ts
+++ b/frontend/src/hooks/api/useLogInMutation.ts
@@ -1,16 +1,20 @@
-import { ACCESS_TOKEN_KEY } from '@constants/api';
-import { PATH } from '@constants/path';
-import { isLoggedInState } from '@store/auth';
-import { toastListState } from '@store/toast';
-import { useMutation } from '@tanstack/react-query';
import { useNavigate } from 'react-router-dom';
+
+import { useMutation } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { isLoggedInState } from '@store/auth';
+import { toastListState } from '@store/toast';
import { axiosInstance } from '@api/axiosInstance';
import { postLogIn } from '@api/member/postLogIn';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ACCESS_TOKEN_KEY } from '@constants/api';
+import { PATH } from '@constants/path';
+
export const useLogInMutation = () => {
const navigate = useNavigate();
diff --git a/frontend/src/hooks/api/useLogOutMutation.ts b/frontend/src/hooks/api/useLogOutMutation.ts
index 3060930d3..b8aa20fc5 100644
--- a/frontend/src/hooks/api/useLogOutMutation.ts
+++ b/frontend/src/hooks/api/useLogOutMutation.ts
@@ -1,15 +1,19 @@
-import { ACCESS_TOKEN_KEY } from '@constants/api';
-import { PATH } from '@constants/path';
-import { isLoggedInState } from '@store/auth';
-import { toastListState } from '@store/toast';
-import { useMutation, useQueryClient } from '@tanstack/react-query';
import { useNavigate } from 'react-router-dom';
+
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { isLoggedInState } from '@store/auth';
+import { toastListState } from '@store/toast';
import { postLogout } from '@api/member/postLogOut';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ACCESS_TOKEN_KEY } from '@constants/api';
+import { PATH } from '@constants/path';
+
export const useLogOutMutation = () => {
const navigate = useNavigate();
diff --git a/frontend/src/hooks/api/useTripEditMutation.ts b/frontend/src/hooks/api/useTripEditMutation.ts
index 763726bf1..5d30158ec 100644
--- a/frontend/src/hooks/api/useTripEditMutation.ts
+++ b/frontend/src/hooks/api/useTripEditMutation.ts
@@ -1,14 +1,17 @@
-import { ERROR_CODE } from '@constants/api';
-import { toastListState } from '@store/toast';
import { useMutation, useQueryClient } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { useTokenError } from '@hooks/member/useTokenError';
+
+import { toastListState } from '@store/toast';
import type { ErrorResponseData } from '@api/interceptors';
import { putTrip } from '@api/trip/putTrip';
-import { useTokenError } from '@hooks/member/useTokenError';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ERROR_CODE } from '@constants/api';
export const useTripEditMutation = () => {
const queryClient = useQueryClient();
diff --git a/frontend/src/hooks/api/useTripQuery.ts b/frontend/src/hooks/api/useTripQuery.ts
index 9aa013526..3e629f037 100644
--- a/frontend/src/hooks/api/useTripQuery.ts
+++ b/frontend/src/hooks/api/useTripQuery.ts
@@ -1,10 +1,13 @@
-import { NETWORK } from '@constants/api';
import { useQuery } from '@tanstack/react-query';
-import type { TripData } from '@type/trip';
+
import type { AxiosError } from 'axios';
import { getTrip } from '@api/trip/getTrip';
+import type { TripData } from '@type/trip';
+
+import { NETWORK } from '@constants/api';
+
export const useTripQuery = (tripId: number) => {
const { data } = useQuery(['trip', tripId], () => getTrip(tripId), {
retry: NETWORK.RETRY_COUNT,
diff --git a/frontend/src/hooks/api/useTripsQuery.ts b/frontend/src/hooks/api/useTripsQuery.ts
index e353a0afb..ffcbaba91 100644
--- a/frontend/src/hooks/api/useTripsQuery.ts
+++ b/frontend/src/hooks/api/useTripsQuery.ts
@@ -1,10 +1,13 @@
-import { NETWORK } from '@constants/api';
import { useQuery } from '@tanstack/react-query';
-import type { TripsData } from '@type/trips';
+
import type { AxiosError } from 'axios';
import { getTrips } from '@api/trips/getTrips';
+import type { TripsData } from '@type/trips';
+
+import { NETWORK } from '@constants/api';
+
export const useTripsQuery = () => {
const { data } = useQuery(['trips'], getTrips, {
retry: NETWORK.RETRY_COUNT,
diff --git a/frontend/src/hooks/api/useUpdateTripItemMutation.ts b/frontend/src/hooks/api/useUpdateTripItemMutation.ts
index 284e1188e..2bcf95e0a 100644
--- a/frontend/src/hooks/api/useUpdateTripItemMutation.ts
+++ b/frontend/src/hooks/api/useUpdateTripItemMutation.ts
@@ -1,14 +1,17 @@
-import { ERROR_CODE } from '@constants/api';
-import { toastListState } from '@store/toast';
import { useMutation, useQueryClient } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { useTokenError } from '@hooks/member/useTokenError';
+
+import { toastListState } from '@store/toast';
import type { ErrorResponseData } from '@api/interceptors';
import { putTripItem } from '@api/tripItem/putTripItem';
-import { useTokenError } from '@hooks/member/useTokenError';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ERROR_CODE } from '@constants/api';
export const useUpdateTripItemMutation = () => {
const queryClient = useQueryClient();
diff --git a/frontend/src/hooks/api/useUserInfoMutation.ts b/frontend/src/hooks/api/useUserInfoMutation.ts
index 16324a163..80d699dad 100644
--- a/frontend/src/hooks/api/useUserInfoMutation.ts
+++ b/frontend/src/hooks/api/useUserInfoMutation.ts
@@ -1,14 +1,17 @@
-import { ERROR_CODE } from '@constants/api';
-import { toastListState } from '@store/toast';
import { useMutation, useQueryClient } from '@tanstack/react-query';
+
import { useSetRecoilState } from 'recoil';
-import { generateUniqueId } from '@utils/uniqueId';
+import { useTokenError } from '@hooks/member/useTokenError';
+
+import { toastListState } from '@store/toast';
import type { ErrorResponseData } from '@api/interceptors';
import { putUserInfo } from '@api/member/putUserInfo';
-import { useTokenError } from '@hooks/member/useTokenError';
+import { generateUniqueId } from '@utils/uniqueId';
+
+import { ERROR_CODE } from '@constants/api';
export const useUserInfoMutation = () => {
const queryClient = useQueryClient();
diff --git a/frontend/src/hooks/api/useUserInfoQuery.ts b/frontend/src/hooks/api/useUserInfoQuery.ts
index 1b1fd1ff8..ab3ac2c7a 100644
--- a/frontend/src/hooks/api/useUserInfoQuery.ts
+++ b/frontend/src/hooks/api/useUserInfoQuery.ts
@@ -1,10 +1,13 @@
-import { NETWORK } from '@constants/api';
import { useQuery } from '@tanstack/react-query';
-import type { UserData } from '@type/member';
+
import type { AxiosError } from 'axios';
import { getUserInfo } from '@api/member/getUserInfo';
+import type { UserData } from '@type/member';
+
+import { NETWORK } from '@constants/api';
+
export const useUserInfoQuery = () => {
const { data } = useQuery(['userInfo'], getUserInfo, {
retry: NETWORK.RETRY_COUNT,
diff --git a/frontend/src/hooks/common/useAutoScroll.ts b/frontend/src/hooks/common/useAutoScroll.ts
index 6d3874081..1022e0e26 100644
--- a/frontend/src/hooks/common/useAutoScroll.ts
+++ b/frontend/src/hooks/common/useAutoScroll.ts
@@ -1,5 +1,5 @@
-import { useCallback } from 'react';
import type { RefObject } from 'react';
+import { useCallback } from 'react';
export const useAutoScroll = (
listRef: RefObject,
diff --git a/frontend/src/hooks/common/useCityDateForm.ts b/frontend/src/hooks/common/useCityDateForm.ts
index 3c47cf804..9e0b112c0 100644
--- a/frontend/src/hooks/common/useCityDateForm.ts
+++ b/frontend/src/hooks/common/useCityDateForm.ts
@@ -1,6 +1,7 @@
+import { useCallback, useEffect, useState } from 'react';
+
import type { CityData } from '@type/city';
import type { DateRangeData, NewTripData } from '@type/trips';
-import { useCallback, useEffect, useState } from 'react';
const defaultTripData = {
startDate: null,
diff --git a/frontend/src/hooks/common/useCitySuggestion.ts b/frontend/src/hooks/common/useCitySuggestion.ts
index 5bccec133..4f326938d 100644
--- a/frontend/src/hooks/common/useCitySuggestion.ts
+++ b/frontend/src/hooks/common/useCitySuggestion.ts
@@ -1,10 +1,12 @@
-import { useQueryClient } from '@tanstack/react-query';
-import type { CityData } from '@type/city';
import { useCallback, useEffect, useState } from 'react';
+import { useQueryClient } from '@tanstack/react-query';
+
import { makeRegexByCho } from '@utils/cityFilter';
import { formatStringToLetter } from '@utils/formatter';
+import type { CityData } from '@type/city';
+
interface useCitySuggestionPrams {
onItemSelect: (city: CityData) => void;
}
diff --git a/frontend/src/hooks/common/useCityTags.ts b/frontend/src/hooks/common/useCityTags.ts
index a8e33b2e2..4591a6e25 100644
--- a/frontend/src/hooks/common/useCityTags.ts
+++ b/frontend/src/hooks/common/useCityTags.ts
@@ -1,7 +1,9 @@
-import { CITY_TAG_MAX_LENGTH } from '@constants/ui';
-import type { CityData } from '@type/city';
import { useState } from 'react';
+import type { CityData } from '@type/city';
+
+import { CITY_TAG_MAX_LENGTH } from '@constants/ui';
+
export const useCityTags = (initialCityTags: CityData[]) => {
const [cityTags, setCityTags] = useState(initialCityTags);
diff --git a/frontend/src/hooks/common/useImageUpload.ts b/frontend/src/hooks/common/useImageUpload.ts
index 5e8985a56..c390df3fe 100644
--- a/frontend/src/hooks/common/useImageUpload.ts
+++ b/frontend/src/hooks/common/useImageUpload.ts
@@ -1,9 +1,10 @@
-import { TRIP_ITEM_ADD_MAX_IMAGE_UPLOAD_COUNT } from '@constants/ui';
import type { ChangeEvent } from 'react';
import { useState } from 'react';
import { useImageMutation } from '@hooks/api/useImageMutation';
+import { TRIP_ITEM_ADD_MAX_IMAGE_UPLOAD_COUNT } from '@constants/ui';
+
interface UseImageUploadParams {
initialImageUrls: string[];
maxUploadCount?: number;
diff --git a/frontend/src/hooks/common/useMediaQuery.ts b/frontend/src/hooks/common/useMediaQuery.ts
index e3c6f53d4..efdd3e0ad 100644
--- a/frontend/src/hooks/common/useMediaQuery.ts
+++ b/frontend/src/hooks/common/useMediaQuery.ts
@@ -1,8 +1,11 @@
-import { MOBILE_MEDIA_QUERY_SIZE } from '@constants/ui';
-import { mediaQueryMobileState, viewportWidthState } from '@store/mediaQuery';
import { useCallback, useEffect, useRef } from 'react';
+
import { useSetRecoilState } from 'recoil';
+import { mediaQueryMobileState, viewportWidthState } from '@store/mediaQuery';
+
+import { MOBILE_MEDIA_QUERY_SIZE } from '@constants/ui';
+
export const useMediaQuery = () => {
const setViewportWidth = useSetRecoilState(viewportWidthState);
const setIsMobile = useSetRecoilState(mediaQueryMobileState);
diff --git a/frontend/src/hooks/common/useResetError.ts b/frontend/src/hooks/common/useResetError.ts
index 14b7b12b5..f05d56133 100644
--- a/frontend/src/hooks/common/useResetError.ts
+++ b/frontend/src/hooks/common/useResetError.ts
@@ -1,10 +1,11 @@
-import { HTTP_STATUS_CODE } from '@constants/api';
-import { PATH } from '@constants/path';
import { useCallback } from 'react';
import { useNavigate } from 'react-router-dom';
import { HTTPError } from '@api/HTTPError';
+import { HTTP_STATUS_CODE } from '@constants/api';
+import { PATH } from '@constants/path';
+
export const useResetError = () => {
const navigate = useNavigate();
diff --git a/frontend/src/hooks/common/useScrollFocus.ts b/frontend/src/hooks/common/useScrollFocus.ts
index 61f0f5ac5..926ba3a54 100644
--- a/frontend/src/hooks/common/useScrollFocus.ts
+++ b/frontend/src/hooks/common/useScrollFocus.ts
@@ -1,7 +1,9 @@
-import { focusedIdState } from '@store/scrollFocus';
import { useCallback, useEffect, useState } from 'react';
+
import { useSetRecoilState } from 'recoil';
+import { focusedIdState } from '@store/scrollFocus';
+
const initialOption = {
root: null,
rootMargin: '-56% 0px -44% 0px',
diff --git a/frontend/src/hooks/expense/useExpense.ts b/frontend/src/hooks/expense/useExpense.ts
index 259969ce2..6edf69498 100644
--- a/frontend/src/hooks/expense/useExpense.ts
+++ b/frontend/src/hooks/expense/useExpense.ts
@@ -1,6 +1,8 @@
+import { useCallback, useMemo } from 'react';
+
import { useQueryClient } from '@tanstack/react-query';
+
import type { ExpenseData, ExpenseItemData } from '@type/expense';
-import { useCallback, useMemo } from 'react';
export const useExpense = (tripId: number) => {
const queryClient = useQueryClient();
diff --git a/frontend/src/hooks/member/useEditUserProfileForm.ts b/frontend/src/hooks/member/useEditUserProfileForm.ts
index fca697061..3dcd8e8bc 100644
--- a/frontend/src/hooks/member/useEditUserProfileForm.ts
+++ b/frontend/src/hooks/member/useEditUserProfileForm.ts
@@ -1,10 +1,11 @@
-import type { UserData } from '@type/member';
import type { FormEvent } from 'react';
import { useCallback, useState } from 'react';
+import { useUserInfoMutation } from '@hooks/api/useUserInfoMutation';
+
import { isEmptyString } from '@utils/validator';
-import { useUserInfoMutation } from '@hooks/api/useUserInfoMutation';
+import type { UserData } from '@type/member';
export const useEditUserProfileForm = (initialData: UserData) => {
const userInfoMutation = useUserInfoMutation();
diff --git a/frontend/src/hooks/member/useTokenError.ts b/frontend/src/hooks/member/useTokenError.ts
index fdb47cb01..5b01b9786 100644
--- a/frontend/src/hooks/member/useTokenError.ts
+++ b/frontend/src/hooks/member/useTokenError.ts
@@ -1,12 +1,15 @@
-import { ACCESS_TOKEN_KEY } from '@constants/api';
-import { PATH } from '@constants/path';
-import { isLoggedInState } from '@store/auth';
-import { toastListState } from '@store/toast';
import { useNavigate } from 'react-router-dom';
+
import { useSetRecoilState } from 'recoil';
+import { isLoggedInState } from '@store/auth';
+import { toastListState } from '@store/toast';
+
import { generateUniqueId } from '@utils/uniqueId';
+import { ACCESS_TOKEN_KEY } from '@constants/api';
+import { PATH } from '@constants/path';
+
export const useTokenError = () => {
const navigate = useNavigate();
diff --git a/frontend/src/hooks/trip/useAddTripItemForm.ts b/frontend/src/hooks/trip/useAddTripItemForm.ts
index 65326561e..0fbf26f8a 100644
--- a/frontend/src/hooks/trip/useAddTripItemForm.ts
+++ b/frontend/src/hooks/trip/useAddTripItemForm.ts
@@ -1,12 +1,13 @@
-import type { TripItemFormData } from '@type/tripItem';
import type { FormEvent } from 'react';
import { useCallback, useState } from 'react';
-import { isEmptyString } from '@utils/validator';
-
import { useAddTripItemMutation } from '@hooks/api/useAddTripItemMutation';
import { useUpdateTripItemMutation } from '@hooks/api/useUpdateTripItemMutation';
+import { isEmptyString } from '@utils/validator';
+
+import type { TripItemFormData } from '@type/tripItem';
+
interface UseAddTripItemFormParams {
tripId: number;
initialDayLogId: number;
diff --git a/frontend/src/hooks/trip/useTripDates.ts b/frontend/src/hooks/trip/useTripDates.ts
index b56ae79e4..5a73d49ad 100644
--- a/frontend/src/hooks/trip/useTripDates.ts
+++ b/frontend/src/hooks/trip/useTripDates.ts
@@ -1,4 +1,5 @@
import { useQueryClient } from '@tanstack/react-query';
+
import type { TripData } from '@type/trip';
export const useTripDates = (tripId: number) => {
diff --git a/frontend/src/hooks/trip/useTripEditForm.ts b/frontend/src/hooks/trip/useTripEditForm.ts
index 78d781fe0..5f57bcb14 100644
--- a/frontend/src/hooks/trip/useTripEditForm.ts
+++ b/frontend/src/hooks/trip/useTripEditForm.ts
@@ -1,12 +1,13 @@
-import type { TripData } from '@type/trip';
import { useEffect, useState } from 'react';
import type { ChangeEvent, FormEvent } from 'react';
-import { isEmptyString } from '@utils/validator';
-
import { useTripEditMutation } from '@hooks/api/useTripEditMutation';
import { useCityDateForm } from '@hooks/common/useCityDateForm';
+import { isEmptyString } from '@utils/validator';
+
+import type { TripData } from '@type/trip';
+
export const useTripEditForm = (
{
id: tripId,
diff --git a/frontend/src/hooks/trip/useTripItemExpenseInput.ts b/frontend/src/hooks/trip/useTripItemExpenseInput.ts
index 0d088f9d9..b60f315ab 100644
--- a/frontend/src/hooks/trip/useTripItemExpenseInput.ts
+++ b/frontend/src/hooks/trip/useTripItemExpenseInput.ts
@@ -1,9 +1,14 @@
-import { DEFAULT_CURRENCY } from '@constants/trip';
+import type { ChangeEvent } from 'react';
+import { useState } from 'react';
+
import { useQueryClient } from '@tanstack/react-query';
+
import type { ExpenseCategoryData } from '@type/expense';
import type { TripItemFormData } from '@type/tripItem';
-import type { ChangeEvent } from 'react';
-import { useState } from 'react';
+
+import { REGEX } from '@constants/regex';
+import { DEFAULT_CURRENCY } from '@constants/trip';
+import { AMOUNT_MAX_LIMIT } from '@constants/ui';
export const useTripItemExpenseInput = (
updateInputValue: (key: K, value: TripItemFormData[K]) => void,
@@ -41,6 +46,18 @@ export const useTripItemExpenseInput = (
};
const handleAmountChange = (event: ChangeEvent) => {
+ if (REGEX.ALPHABET_AND_KOREAN_CHARACTERS.test(event.target.value)) return;
+
+ if (Number(event.target.value) < 0) {
+ // eslint-disable-next-line no-param-reassign
+ event.target.value = '0';
+ }
+
+ if (Number(event.target.value) > AMOUNT_MAX_LIMIT) {
+ // eslint-disable-next-line no-param-reassign
+ event.target.value = String(AMOUNT_MAX_LIMIT);
+ }
+
setExpenseValue((prevExpenseValue) => {
const newExpenseValue = {
...prevExpenseValue!,
@@ -52,5 +69,10 @@ export const useTripItemExpenseInput = (
});
};
- return { expenseCategoryData, handleCategoryChange, handleCurrencyChange, handleAmountChange };
+ return {
+ expenseCategoryData,
+ handleCategoryChange,
+ handleCurrencyChange,
+ handleAmountChange,
+ };
};
diff --git a/frontend/src/hooks/trip/useTripItemPlaceInput.ts b/frontend/src/hooks/trip/useTripItemPlaceInput.ts
index c0b8a0304..344907105 100644
--- a/frontend/src/hooks/trip/useTripItemPlaceInput.ts
+++ b/frontend/src/hooks/trip/useTripItemPlaceInput.ts
@@ -1,7 +1,8 @@
-import type { TripItemFormData } from '@type/tripItem';
import type { ChangeEvent, KeyboardEvent } from 'react';
import { useCallback, useEffect, useRef, useState } from 'react';
+import type { TripItemFormData } from '@type/tripItem';
+
export const useTripItemPlaceInput = (
updateInputValue: (key: K, value: TripItemFormData[K]) => void,
disableError: () => void,
diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx
index cc85909fd..e8704c84f 100644
--- a/frontend/src/index.tsx
+++ b/frontend/src/index.tsx
@@ -1,15 +1,21 @@
import { Global } from '@emotion/react';
-import { worker } from '@mocks/browser';
-import AppRouter from '@router/AppRouter';
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
-import { HangLogProvider } from 'hang-log-design-system';
+
import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
+
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
+
import { RecoilRoot } from 'recoil';
+import { HangLogProvider } from 'hang-log-design-system';
+
+import AppRouter from '@router/AppRouter';
+
import { GlobalStyle } from '@styles/index';
+import { worker } from '@mocks/browser';
+
const main = async () => {
if (process.env.NODE_ENV === 'development') {
await worker.start({
diff --git a/frontend/src/mocks/browser.ts b/frontend/src/mocks/browser.ts
index 3dbefcec5..6047020d0 100644
--- a/frontend/src/mocks/browser.ts
+++ b/frontend/src/mocks/browser.ts
@@ -1,4 +1,5 @@
-import { handlers } from '@mocks/handlers';
import { setupWorker } from 'msw';
+import { handlers } from '@mocks/handlers';
+
export const worker = setupWorker(...handlers);
diff --git a/frontend/src/mocks/handlers/city.ts b/frontend/src/mocks/handlers/city.ts
index 2e402832e..f57d57a94 100644
--- a/frontend/src/mocks/handlers/city.ts
+++ b/frontend/src/mocks/handlers/city.ts
@@ -1,6 +1,8 @@
+import { rest } from 'msw';
+
import { END_POINTS, HTTP_STATUS_CODE } from '@constants/api';
+
import { cities } from '@mocks/data/city';
-import { rest } from 'msw';
export const cityHandlers = [
rest.get(END_POINTS.CITY, (_, res, ctx) => {
diff --git a/frontend/src/mocks/handlers/dayLog.ts b/frontend/src/mocks/handlers/dayLog.ts
index 8c31f20fa..cab0b2160 100644
--- a/frontend/src/mocks/handlers/dayLog.ts
+++ b/frontend/src/mocks/handlers/dayLog.ts
@@ -1,9 +1,11 @@
-import { HTTP_STATUS_CODE } from '@constants/api';
-import { trip } from '@mocks/data/trip';
import { rest } from 'msw';
import type { PatchDayLogTitleRequestBody } from '@api/dayLog/patchDayLogTitle';
+import { HTTP_STATUS_CODE } from '@constants/api';
+
+import { trip } from '@mocks/data/trip';
+
export const dayLogHandlers = [
rest.patch('/trips/:tripId/daylogs/:dayLogId/order', async (req, res, ctx) => {
return res(ctx.status(HTTP_STATUS_CODE.NO_CONTENT));
diff --git a/frontend/src/mocks/handlers/expense.ts b/frontend/src/mocks/handlers/expense.ts
index 56f56a5c7..e47b8109e 100644
--- a/frontend/src/mocks/handlers/expense.ts
+++ b/frontend/src/mocks/handlers/expense.ts
@@ -1,6 +1,8 @@
+import { rest } from 'msw';
+
import { END_POINTS, HTTP_STATUS_CODE } from '@constants/api';
+
import { expense, expenseCategories } from '@mocks/data/expense';
-import { rest } from 'msw';
export const expenseHandlers = [
rest.get(END_POINTS.EXPENSE(':tripId'), (_, res, ctx) => {
diff --git a/frontend/src/mocks/handlers/image.ts b/frontend/src/mocks/handlers/image.ts
index 4c26b063c..d61c3a61b 100644
--- a/frontend/src/mocks/handlers/image.ts
+++ b/frontend/src/mocks/handlers/image.ts
@@ -1,6 +1,8 @@
+import { rest } from 'msw';
+
import { END_POINTS, HTTP_STATUS_CODE } from '@constants/api';
+
import { images } from '@mocks/data/image';
-import { rest } from 'msw';
export const imageHandlers = [
rest.post(END_POINTS.IMAGES, (_, res, ctx) => {
diff --git a/frontend/src/mocks/handlers/member.ts b/frontend/src/mocks/handlers/member.ts
index dc94fac65..cf0ec1548 100644
--- a/frontend/src/mocks/handlers/member.ts
+++ b/frontend/src/mocks/handlers/member.ts
@@ -1,7 +1,10 @@
+import { rest } from 'msw';
+
+import type { UserData } from '@type/member';
+
import { END_POINTS } from '@constants/api';
+
import { accessToken, refreshToken, userInfo } from '@mocks/data/member';
-import type { UserData } from '@type/member';
-import { rest } from 'msw';
export const memberHandlers = [
rest.post(END_POINTS.LOGIN(':provider'), (_, res, ctx) => {
diff --git a/frontend/src/mocks/handlers/tripItem.ts b/frontend/src/mocks/handlers/tripItem.ts
index 1ac2571d0..4ceda5c73 100644
--- a/frontend/src/mocks/handlers/tripItem.ts
+++ b/frontend/src/mocks/handlers/tripItem.ts
@@ -1,8 +1,11 @@
/* eslint-disable no-nested-ternary */
+import { rest } from 'msw';
+
+import type { CurrencyType, TripItemFormData } from '@type/tripItem';
+
import { HTTP_STATUS_CODE } from '@constants/api';
+
import { trip } from '@mocks/data/trip';
-import type { CurrencyType, TripItemFormData } from '@type/tripItem';
-import { rest } from 'msw';
export const tripItemHandlers = [
rest.post('/trips/:tripId/items', async (req, res, ctx) => {
diff --git a/frontend/src/mocks/handlers/trips.ts b/frontend/src/mocks/handlers/trips.ts
index a499404ce..7df744b82 100644
--- a/frontend/src/mocks/handlers/trips.ts
+++ b/frontend/src/mocks/handlers/trips.ts
@@ -1,8 +1,11 @@
+import { rest } from 'msw';
+
+import type { TripFormData } from '@type/trip';
+
import { END_POINTS, HTTP_STATUS_CODE } from '@constants/api';
+
import { trip } from '@mocks/data/trip';
import { trips } from '@mocks/data/trips';
-import type { TripFormData } from '@type/trip';
-import { rest } from 'msw';
export const tripsHandlers = [
rest.get(`${END_POINTS.TRIPS}`, (_, res, ctx) => {
diff --git a/frontend/src/pages/ExpensePage/ExpensePage.style.ts b/frontend/src/pages/ExpensePage/ExpensePage.style.ts
index 8ba1f603c..0f10fe9a5 100644
--- a/frontend/src/pages/ExpensePage/ExpensePage.style.ts
+++ b/frontend/src/pages/ExpensePage/ExpensePage.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const containerStyling = css({
diff --git a/frontend/src/pages/ExpensePage/ExpensePage.tsx b/frontend/src/pages/ExpensePage/ExpensePage.tsx
index 4d876916f..5b8066a63 100644
--- a/frontend/src/pages/ExpensePage/ExpensePage.tsx
+++ b/frontend/src/pages/ExpensePage/ExpensePage.tsx
@@ -1,15 +1,18 @@
-import { mediaQueryMobileState } from '@store/mediaQuery';
-import { Divider, Flex } from 'hang-log-design-system';
import { useParams } from 'react-router-dom';
+
import { useRecoilValue } from 'recoil';
-import { useExpenseQuery } from '@hooks/api/useExpenseQuery';
+import { Divider, Flex } from 'hang-log-design-system';
import { containerStyling, dividerStyling } from '@pages/ExpensePage/ExpensePage.style';
import ExpenseListSection from '@components/expense/ExpenseListSection/ExpenseListSection';
import TotalExpenseSection from '@components/expense/TotalExpenseSection/TotalExpenseSection';
+import { useExpenseQuery } from '@hooks/api/useExpenseQuery';
+
+import { mediaQueryMobileState } from '@store/mediaQuery';
+
const ExpensePage = () => {
const { tripId } = useParams();
diff --git a/frontend/src/pages/ExpensePage/ExpensePageSkeleton.tsx b/frontend/src/pages/ExpensePage/ExpensePageSkeleton.tsx
index 06f8ec426..83678068b 100644
--- a/frontend/src/pages/ExpensePage/ExpensePageSkeleton.tsx
+++ b/frontend/src/pages/ExpensePage/ExpensePageSkeleton.tsx
@@ -1,12 +1,14 @@
-import { mediaQueryMobileState } from '@store/mediaQuery';
-import { Divider, Flex } from 'hang-log-design-system';
import { useRecoilValue } from 'recoil';
+import { Divider, Flex } from 'hang-log-design-system';
+
import { containerStyling, dividerStyling } from '@pages/ExpensePage/ExpensePage.style';
import ExpenseListSectionSkeleton from '@components/expense/ExpenseListSection/ExpenseListSectionSkeleton';
import TotalExpenseSectionSkeleton from '@components/expense/TotalExpenseSection/TotalExpenseSectionSkeleton';
+import { mediaQueryMobileState } from '@store/mediaQuery';
+
const ExpensePageSkeleton = () => {
const isMobile = useRecoilValue(mediaQueryMobileState);
diff --git a/frontend/src/pages/IntroPage/IntroPage.style.ts b/frontend/src/pages/IntroPage/IntroPage.style.ts
index a6cf6a9fa..de6d1cf50 100644
--- a/frontend/src/pages/IntroPage/IntroPage.style.ts
+++ b/frontend/src/pages/IntroPage/IntroPage.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const containerStyling = css({
diff --git a/frontend/src/pages/IntroPage/IntroPage.tsx b/frontend/src/pages/IntroPage/IntroPage.tsx
index 7be865997..6e3ab94f6 100644
--- a/frontend/src/pages/IntroPage/IntroPage.tsx
+++ b/frontend/src/pages/IntroPage/IntroPage.tsx
@@ -1,11 +1,9 @@
-import SampleTripImage from '@assets/png/sample-trip-image.png';
-import SampleTripImageMobile from '@assets/png/sample-trip-image_mobile.png';
-import { PATH } from '@constants/path';
-import { mediaQueryMobileState } from '@store/mediaQuery';
-import { Button, Flex, Heading, Theme } from 'hang-log-design-system';
import { useNavigate } from 'react-router-dom';
+
import { useRecoilValue } from 'recoil';
+import { Button, Flex, Heading, Theme } from 'hang-log-design-system';
+
import {
containerStyling,
headingStyling,
@@ -13,6 +11,13 @@ import {
titleStyling,
} from '@pages/IntroPage/IntroPage.style';
+import { mediaQueryMobileState } from '@store/mediaQuery';
+
+import { PATH } from '@constants/path';
+
+import SampleTripImage from '@assets/png/sample-trip-image.png';
+import SampleTripImageMobile from '@assets/png/sample-trip-image_mobile.png';
+
const IntroPage = () => {
const navigate = useNavigate();
diff --git a/frontend/src/pages/LogInPage/LogInPage.tsx b/frontend/src/pages/LogInPage/LogInPage.tsx
index c5a2d9044..2aeeb3f5d 100644
--- a/frontend/src/pages/LogInPage/LogInPage.tsx
+++ b/frontend/src/pages/LogInPage/LogInPage.tsx
@@ -1,5 +1,3 @@
-import AuthImage from '@assets/svg/auth-image.svg';
-import LogoVertical from '@assets/svg/logo-vertical.svg';
import { Flex, Heading, Theme } from 'hang-log-design-system';
import {
@@ -12,6 +10,9 @@ import {
import GoogleButton from '@components/common/GoogleButton/GoogleButton';
import KakaoButton from '@components/common/KakaoButton/KakaoButton';
+import AuthImage from '@assets/svg/auth-image.svg';
+import LogoVertical from '@assets/svg/logo-vertical.svg';
+
const LogInPage = () => {
return (
{
const isMobile = useRecoilValue(mediaQueryMobileState);
diff --git a/frontend/src/pages/NotFoundPage/NotFoundPage.tsx b/frontend/src/pages/NotFoundPage/NotFoundPage.tsx
index 1d4c7703f..484f938f4 100644
--- a/frontend/src/pages/NotFoundPage/NotFoundPage.tsx
+++ b/frontend/src/pages/NotFoundPage/NotFoundPage.tsx
@@ -1,9 +1,10 @@
-import { PATH } from '@constants/path';
import { useNavigate } from 'react-router-dom';
+import Error from '@components/common/Error/Error';
+
import { useMediaQuery } from '@hooks/common/useMediaQuery';
-import Error from '@components/common/Error/Error';
+import { PATH } from '@constants/path';
const NotFoundPage = () => {
const navigate = useNavigate();
diff --git a/frontend/src/pages/RedirectPage/RedirectPage.tsx b/frontend/src/pages/RedirectPage/RedirectPage.tsx
index efccdc148..2ad0cb4a7 100644
--- a/frontend/src/pages/RedirectPage/RedirectPage.tsx
+++ b/frontend/src/pages/RedirectPage/RedirectPage.tsx
@@ -1,12 +1,13 @@
-import { Flex, Heading, Spinner, Theme } from 'hang-log-design-system';
import { useEffect } from 'react';
import { useParams, useSearchParams } from 'react-router-dom';
-import { isAuthProvider } from '@utils/auth';
+import { Flex, Heading, Spinner, Theme } from 'hang-log-design-system';
+
+import { containerStyling } from '@pages/RedirectPage/RedirectPage.style';
import { useLogInMutation } from '@hooks/api/useLogInMutation';
-import { containerStyling } from '@pages/RedirectPage/RedirectPage.style';
+import { isAuthProvider } from '@utils/auth';
const RedirectPage = () => {
const { provider } = useParams();
diff --git a/frontend/src/pages/SignUpPage/SignUpPage.style.ts b/frontend/src/pages/SignUpPage/SignUpPage.style.ts
index 5653bdd70..1a6ae42ec 100644
--- a/frontend/src/pages/SignUpPage/SignUpPage.style.ts
+++ b/frontend/src/pages/SignUpPage/SignUpPage.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const containerStyling = css({
diff --git a/frontend/src/pages/SignUpPage/SignUpPage.tsx b/frontend/src/pages/SignUpPage/SignUpPage.tsx
index 69d96ca60..a62c8a602 100644
--- a/frontend/src/pages/SignUpPage/SignUpPage.tsx
+++ b/frontend/src/pages/SignUpPage/SignUpPage.tsx
@@ -1,5 +1,3 @@
-import AuthImage from '@assets/svg/auth-image.svg';
-import LogoVertical from '@assets/svg/logo-vertical.svg';
import { Flex, Heading, Theme } from 'hang-log-design-system';
import {
@@ -12,6 +10,9 @@ import {
import GoogleButton from '@components/common/GoogleButton/GoogleButton';
import KakaoButton from '@components/common/KakaoButton/KakaoButton';
+import AuthImage from '@assets/svg/auth-image.svg';
+import LogoVertical from '@assets/svg/logo-vertical.svg';
+
const SignUpPage = () => {
return (
{
const isMobile = useRecoilValue(mediaQueryMobileState);
diff --git a/frontend/src/pages/TripEditPage/TripEditPage.style.ts b/frontend/src/pages/TripEditPage/TripEditPage.style.ts
index 345760fdd..f994f0f42 100644
--- a/frontend/src/pages/TripEditPage/TripEditPage.style.ts
+++ b/frontend/src/pages/TripEditPage/TripEditPage.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const containerStyling = css({
diff --git a/frontend/src/pages/TripEditPage/TripEditPage.tsx b/frontend/src/pages/TripEditPage/TripEditPage.tsx
index 5da5cdaaf..8dcc9aa5d 100644
--- a/frontend/src/pages/TripEditPage/TripEditPage.tsx
+++ b/frontend/src/pages/TripEditPage/TripEditPage.tsx
@@ -1,11 +1,9 @@
-import { mediaQueryMobileState } from '@store/mediaQuery';
-import { Flex, FloatingButton, useOverlay, useSelect } from 'hang-log-design-system';
import { useMemo } from 'react';
import { useParams } from 'react-router-dom';
+
import { useRecoilValue } from 'recoil';
-import { useExpenseCategoryQuery } from '@hooks/api/useExpenseCategoryQuery';
-import { useTripQuery } from '@hooks/api/useTripQuery';
+import { Flex, FloatingButton, useOverlay, useSelect } from 'hang-log-design-system';
import {
addButtonStyling,
@@ -19,6 +17,11 @@ import TripInformation from '@components/common/TripInformation/TripInformation'
import TripMap from '@components/common/TripMap/TripMap';
import TripItemAddModal from '@components/trip/TripItemAddModal/TripItemAddModal';
+import { useExpenseCategoryQuery } from '@hooks/api/useExpenseCategoryQuery';
+import { useTripQuery } from '@hooks/api/useTripQuery';
+
+import { mediaQueryMobileState } from '@store/mediaQuery';
+
const TripEditPage = () => {
const { tripId } = useParams();
diff --git a/frontend/src/pages/TripPage/TripPage.tsx b/frontend/src/pages/TripPage/TripPage.tsx
index a382162c9..afda548a3 100644
--- a/frontend/src/pages/TripPage/TripPage.tsx
+++ b/frontend/src/pages/TripPage/TripPage.tsx
@@ -1,10 +1,9 @@
-import { mediaQueryMobileState } from '@store/mediaQuery';
-import { Flex, useSelect } from 'hang-log-design-system';
import { useMemo } from 'react';
import { useParams } from 'react-router-dom';
+
import { useRecoilValue } from 'recoil';
-import { useTripQuery } from '@hooks/api/useTripQuery';
+import { Flex, useSelect } from 'hang-log-design-system';
import { containerStyling, mapContainerStyling } from '@pages/TripPage/TripPage.style';
@@ -13,6 +12,10 @@ import GoogleMapWrapper from '@components/common/GoogleMapWrapper/GoogleMapWrapp
import TripInformation from '@components/common/TripInformation/TripInformation';
import TripMap from '@components/common/TripMap/TripMap';
+import { useTripQuery } from '@hooks/api/useTripQuery';
+
+import { mediaQueryMobileState } from '@store/mediaQuery';
+
const TripPage = () => {
const { tripId } = useParams();
diff --git a/frontend/src/pages/TripsPage/TripsPage.style.ts b/frontend/src/pages/TripsPage/TripsPage.style.ts
index 77d52b7ab..3876bdda1 100644
--- a/frontend/src/pages/TripsPage/TripsPage.style.ts
+++ b/frontend/src/pages/TripsPage/TripsPage.style.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const addButtonStyling = css({
diff --git a/frontend/src/pages/TripsPage/TripsPage.tsx b/frontend/src/pages/TripsPage/TripsPage.tsx
index de30882e9..2682943f4 100644
--- a/frontend/src/pages/TripsPage/TripsPage.tsx
+++ b/frontend/src/pages/TripsPage/TripsPage.tsx
@@ -1,17 +1,19 @@
-import { ORDER_BY_DATE, ORDER_BY_REGISTRATION } from '@constants/order';
-import { PATH } from '@constants/path';
-import { FloatingButton, useSelect } from 'hang-log-design-system';
import { useNavigate } from 'react-router-dom';
-import { sortByStartDate } from '@utils/sort';
-
-import { useTripsQuery } from '@hooks/api/useTripsQuery';
+import { FloatingButton, useSelect } from 'hang-log-design-system';
import { addButtonStyling } from '@pages/TripsPage/TripsPage.style';
import TripsHeader from '@components/trips/TripsHeader/TripsHeader';
import TripsItemList from '@components/trips/TripsItemList/TripsItemList';
+import { useTripsQuery } from '@hooks/api/useTripsQuery';
+
+import { sortByStartDate } from '@utils/sort';
+
+import { ORDER_BY_DATE, ORDER_BY_REGISTRATION } from '@constants/order';
+import { PATH } from '@constants/path';
+
const TripsPage = () => {
const navigate = useNavigate();
const { tripsData } = useTripsQuery();
diff --git a/frontend/src/pages/TripsPage/TripsPageSkeleton.tsx b/frontend/src/pages/TripsPage/TripsPageSkeleton.tsx
index 118c40758..035818902 100644
--- a/frontend/src/pages/TripsPage/TripsPageSkeleton.tsx
+++ b/frontend/src/pages/TripsPage/TripsPageSkeleton.tsx
@@ -1,6 +1,7 @@
-import { FloatingButton } from 'hang-log-design-system';
import { Suspense } from 'react';
+import { FloatingButton } from 'hang-log-design-system';
+
import { addButtonStyling } from '@pages/TripsPage/TripsPage.style';
import TripsHeader from '@components/trips/TripsHeader/TripsHeader';
diff --git a/frontend/src/router/AppRouter.tsx b/frontend/src/router/AppRouter.tsx
index bc158a5fa..754bf661b 100644
--- a/frontend/src/router/AppRouter.tsx
+++ b/frontend/src/router/AppRouter.tsx
@@ -1,8 +1,8 @@
import App from '@/App';
-import { PATH } from '@constants/path';
-import { isLoggedInState } from '@store/auth';
+
import { Suspense } from 'react';
import { RouterProvider, createBrowserRouter } from 'react-router-dom';
+
import { useRecoilValue } from 'recoil';
import ExpensePage from '@pages/ExpensePage/ExpensePage';
@@ -20,6 +20,10 @@ import TripPageSkeleton from '@pages/TripPage/TripPageSkeleton';
import TripsPage from '@pages/TripsPage/TripsPage';
import TripsPageSkeleton from '@pages/TripsPage/TripsPageSkeleton';
+import { isLoggedInState } from '@store/auth';
+
+import { PATH } from '@constants/path';
+
const AppRouter = () => {
const isLoggedIn = useRecoilValue(isLoggedInState);
diff --git a/frontend/src/store/toast.ts b/frontend/src/store/toast.ts
index d3871ab82..4fb9727ca 100644
--- a/frontend/src/store/toast.ts
+++ b/frontend/src/store/toast.ts
@@ -1,6 +1,7 @@
-import type { ToastType } from '@type/toast';
import { atom } from 'recoil';
+import type { ToastType } from '@type/toast';
+
export const toastListState = atom({
key: 'toastList',
default: [],
diff --git a/frontend/src/stories/common/CitySearchBar.stories.tsx b/frontend/src/stories/common/CitySearchBar.stories.tsx
index a9cd78131..56cf4a82c 100644
--- a/frontend/src/stories/common/CitySearchBar.stories.tsx
+++ b/frontend/src/stories/common/CitySearchBar.stories.tsx
@@ -1,8 +1,9 @@
-import { cities } from '@mocks/data/city';
import type { Meta, StoryObj } from '@storybook/react';
import CitySearchBar from '@components/common/CitySearchBar/CitySearchBar';
+import { cities } from '@mocks/data/city';
+
const meta = {
title: 'common/CitySearchBar',
component: CitySearchBar,
diff --git a/frontend/src/stories/common/DayLogItem.stories.tsx b/frontend/src/stories/common/DayLogItem.stories.tsx
index 5f951119f..114a82bd4 100644
--- a/frontend/src/stories/common/DayLogItem.stories.tsx
+++ b/frontend/src/stories/common/DayLogItem.stories.tsx
@@ -1,8 +1,9 @@
-import { trip } from '@mocks/data/trip';
import type { Meta, StoryObj } from '@storybook/react';
import DayLogItem from '@components/common/DayLogItem/DayLogItem';
+import { trip } from '@mocks/data/trip';
+
const meta = {
title: 'common/DayLogItem',
component: DayLogItem,
diff --git a/frontend/src/stories/common/DayLogList.stories.tsx b/frontend/src/stories/common/DayLogList.stories.tsx
index cb197c150..fb8378ecd 100644
--- a/frontend/src/stories/common/DayLogList.stories.tsx
+++ b/frontend/src/stories/common/DayLogList.stories.tsx
@@ -1,10 +1,12 @@
-import { trip } from '@mocks/data/trip';
import type { Meta, StoryObj } from '@storybook/react';
+
import { useSelect } from 'hang-log-design-system';
+import DayLogList from '@components/common/DayLogList/DayLogList';
+
import { useTripQuery } from '@hooks/api/useTripQuery';
-import DayLogList from '@components/common/DayLogList/DayLogList';
+import { trip } from '@mocks/data/trip';
const meta = {
title: 'common/DayLogList',
diff --git a/frontend/src/stories/common/TripInformation.stories.tsx b/frontend/src/stories/common/TripInformation.stories.tsx
index de798baad..9e2b2e79c 100644
--- a/frontend/src/stories/common/TripInformation.stories.tsx
+++ b/frontend/src/stories/common/TripInformation.stories.tsx
@@ -1,8 +1,9 @@
-import { trip } from '@mocks/data/trip';
import type { Meta, StoryObj } from '@storybook/react';
import TripInformation from '@components/common/TripInformation/TripInformation';
+import { trip } from '@mocks/data/trip';
+
const meta = {
title: 'common/TripInformation',
component: TripInformation,
diff --git a/frontend/src/stories/common/TripItem.stories.tsx b/frontend/src/stories/common/TripItem.stories.tsx
index 949825780..be7633c4e 100644
--- a/frontend/src/stories/common/TripItem.stories.tsx
+++ b/frontend/src/stories/common/TripItem.stories.tsx
@@ -1,8 +1,9 @@
-import { trip } from '@mocks/data/trip';
import type { Meta, StoryObj } from '@storybook/react';
import TripItem from '@components/common/TripItem/TripItem';
+import { trip } from '@mocks/data/trip';
+
const meta = {
title: 'common/TripItem',
component: TripItem,
diff --git a/frontend/src/stories/common/TripItemList.stories.tsx b/frontend/src/stories/common/TripItemList.stories.tsx
index 30223141c..3b33aa7cb 100644
--- a/frontend/src/stories/common/TripItemList.stories.tsx
+++ b/frontend/src/stories/common/TripItemList.stories.tsx
@@ -1,8 +1,9 @@
-import { trip } from '@mocks/data/trip';
import type { Meta, StoryObj } from '@storybook/react';
import TripItemList from '@components/common/TripItemList/TripItemList';
+import { trip } from '@mocks/data/trip';
+
const meta = {
title: 'common/TripItemList',
component: TripItemList,
diff --git a/frontend/src/stories/common/TripMap.stories.tsx b/frontend/src/stories/common/TripMap.stories.tsx
index 5abe079ee..2670a9f05 100644
--- a/frontend/src/stories/common/TripMap.stories.tsx
+++ b/frontend/src/stories/common/TripMap.stories.tsx
@@ -1,9 +1,10 @@
-import { trip } from '@mocks/data/trip';
import type { Meta, StoryObj } from '@storybook/react';
import GoogleMapWrapper from '@components/common/GoogleMapWrapper/GoogleMapWrapper';
import TripMap from '@components/common/TripMap/TripMap';
+import { trip } from '@mocks/data/trip';
+
const places = trip.dayLogs[0].items
.filter((item) => item.itemType)
.map((item) => ({
diff --git a/frontend/src/stories/myPage/EditUserProfileForm.stories.tsx b/frontend/src/stories/myPage/EditUserProfileForm.stories.tsx
index 5686313f7..6cb3d4b0d 100644
--- a/frontend/src/stories/myPage/EditUserProfileForm.stories.tsx
+++ b/frontend/src/stories/myPage/EditUserProfileForm.stories.tsx
@@ -1,8 +1,9 @@
-import { userInfo } from '@mocks/data/member';
import type { Meta, StoryObj } from '@storybook/react';
import EditUserProfileForm from '@components/myPage/EditUserProfileForm/EditUserProfileForm';
+import { userInfo } from '@mocks/data/member';
+
const meta = {
title: 'myPage/EditUserProfileForm',
component: EditUserProfileForm,
diff --git a/frontend/src/stories/myPage/NicknameInput.stories.tsx b/frontend/src/stories/myPage/NicknameInput.stories.tsx
index a89bdb6ef..1a63a0b71 100644
--- a/frontend/src/stories/myPage/NicknameInput.stories.tsx
+++ b/frontend/src/stories/myPage/NicknameInput.stories.tsx
@@ -1,9 +1,11 @@
import type { Meta, StoryObj } from '@storybook/react';
-import type { UserData } from '@type/member';
+
import { useState } from 'react';
import NicknameInput from '@components/myPage/EditUserProfileForm/NicknameInput/NicknameInput';
+import type { UserData } from '@type/member';
+
const meta = {
title: 'myPage/NicknameInput',
component: NicknameInput,
diff --git a/frontend/src/stories/myPage/ProfileImageInput.stories.tsx b/frontend/src/stories/myPage/ProfileImageInput.stories.tsx
index acdd58c17..d97904e1d 100644
--- a/frontend/src/stories/myPage/ProfileImageInput.stories.tsx
+++ b/frontend/src/stories/myPage/ProfileImageInput.stories.tsx
@@ -1,8 +1,9 @@
-import { images } from '@mocks/data/image';
import type { Meta, StoryObj } from '@storybook/react';
import ProfileImageInput from '@components/myPage/EditUserProfileForm/ProfileImageInput/ProfileImageInput';
+import { images } from '@mocks/data/image';
+
const meta = {
title: 'myPage/ProfileImageInput',
component: ProfileImageInput,
diff --git a/frontend/src/stories/trip/CategoryInput.stories.tsx b/frontend/src/stories/trip/CategoryInput.stories.tsx
index ce39f2949..b88e05984 100644
--- a/frontend/src/stories/trip/CategoryInput.stories.tsx
+++ b/frontend/src/stories/trip/CategoryInput.stories.tsx
@@ -1,9 +1,11 @@
import type { Meta, StoryObj } from '@storybook/react';
-import type { TripItemFormData } from '@type/tripItem';
+
import { useState } from 'react';
import CategoryInput from '@components/trip/TripItemAddModal/CategoryInput/CategoryInput';
+import type { TripItemFormData } from '@type/tripItem';
+
const meta = {
title: 'trip/TripItemAddModal/CategoryInput',
component: CategoryInput,
diff --git a/frontend/src/stories/trip/DateInput.stories.tsx b/frontend/src/stories/trip/DateInput.stories.tsx
index 0e76d57a5..a6746e73c 100644
--- a/frontend/src/stories/trip/DateInput.stories.tsx
+++ b/frontend/src/stories/trip/DateInput.stories.tsx
@@ -1,9 +1,9 @@
import type { Meta, StoryObj } from '@storybook/react';
-import { useTripQuery } from '@hooks/api/useTripQuery';
-
import DateInput from '@components/trip/TripItemAddModal/DateInput/DateInput';
+import { useTripQuery } from '@hooks/api/useTripQuery';
+
const meta = {
title: 'trip/TripItemAddModal/DateInput',
component: DateInput,
diff --git a/frontend/src/stories/trip/ExpenseInput.stories.tsx b/frontend/src/stories/trip/ExpenseInput.stories.tsx
index 121adeb4c..d0d51a650 100644
--- a/frontend/src/stories/trip/ExpenseInput.stories.tsx
+++ b/frontend/src/stories/trip/ExpenseInput.stories.tsx
@@ -1,10 +1,12 @@
import type { Meta, StoryObj } from '@storybook/react';
-import type { TripItemFormData } from '@type/tripItem';
+
import { useState } from 'react';
+import ExpenseInput from '@components/trip/TripItemAddModal/ExpenseInput/ExpenseInput';
+
import { useExpenseCategoryQuery } from '@hooks/api/useExpenseCategoryQuery';
-import ExpenseInput from '@components/trip/TripItemAddModal/ExpenseInput/ExpenseInput';
+import type { TripItemFormData } from '@type/tripItem';
const meta = {
title: 'trip/TripItemAddModal/ExpenseInput',
diff --git a/frontend/src/stories/trip/MemoInput.stories.tsx b/frontend/src/stories/trip/MemoInput.stories.tsx
index a9622a1fe..29051b26a 100644
--- a/frontend/src/stories/trip/MemoInput.stories.tsx
+++ b/frontend/src/stories/trip/MemoInput.stories.tsx
@@ -1,9 +1,11 @@
import type { Meta, StoryObj } from '@storybook/react';
-import type { TripItemFormData } from '@type/tripItem';
+
import { useState } from 'react';
import MemoInput from '@components/trip/TripItemAddModal/MemoInput/MemoInput';
+import type { TripItemFormData } from '@type/tripItem';
+
const meta = {
title: 'trip/TripItemAddModal/MemoInput',
component: MemoInput,
diff --git a/frontend/src/stories/trip/PlaceInput.stories.tsx b/frontend/src/stories/trip/PlaceInput.stories.tsx
index a5b4cb410..4d0a9c9cf 100644
--- a/frontend/src/stories/trip/PlaceInput.stories.tsx
+++ b/frontend/src/stories/trip/PlaceInput.stories.tsx
@@ -1,10 +1,12 @@
import type { Meta, StoryObj } from '@storybook/react';
-import type { TripItemFormData } from '@type/tripItem';
+
import { useState } from 'react';
import GoogleMapWrapper from '@components/common/GoogleMapWrapper/GoogleMapWrapper';
import PlaceInput from '@components/trip/TripItemAddModal/PlaceInput/PlaceInput';
+import type { TripItemFormData } from '@type/tripItem';
+
const meta = {
title: 'trip/TripItemAddModal/PlaceInput',
component: PlaceInput,
diff --git a/frontend/src/stories/trip/StarRatingInput.stories.tsx b/frontend/src/stories/trip/StarRatingInput.stories.tsx
index 6189dd4cf..750ae01ec 100644
--- a/frontend/src/stories/trip/StarRatingInput.stories.tsx
+++ b/frontend/src/stories/trip/StarRatingInput.stories.tsx
@@ -1,9 +1,11 @@
import type { Meta, StoryObj } from '@storybook/react';
-import type { StarRatingData, TripItemFormData } from '@type/tripItem';
+
import { useState } from 'react';
import StarRatingInput from '@components/trip/TripItemAddModal/StarRatingInput/StarRatingInput';
+import type { StarRatingData, TripItemFormData } from '@type/tripItem';
+
const meta = {
title: 'trip/TripItemAddModal/StarRatingInput',
component: StarRatingInput,
diff --git a/frontend/src/stories/trip/TitleInput.stories.tsx b/frontend/src/stories/trip/TitleInput.stories.tsx
index b42626842..f993550da 100644
--- a/frontend/src/stories/trip/TitleInput.stories.tsx
+++ b/frontend/src/stories/trip/TitleInput.stories.tsx
@@ -1,9 +1,11 @@
import type { Meta, StoryObj } from '@storybook/react';
-import type { TripItemFormData } from '@type/tripItem';
+
import { useState } from 'react';
import TitleInput from '@components/trip/TripItemAddModal/TitleInput/TitleInput';
+import type { TripItemFormData } from '@type/tripItem';
+
const meta = {
title: 'trip/TripItemAddModal/TitleInput',
component: TitleInput,
diff --git a/frontend/src/stories/trip/TripInfoEditModal.stories.tsx b/frontend/src/stories/trip/TripInfoEditModal.stories.tsx
index e41a72616..4e668f39b 100644
--- a/frontend/src/stories/trip/TripInfoEditModal.stories.tsx
+++ b/frontend/src/stories/trip/TripInfoEditModal.stories.tsx
@@ -1,8 +1,9 @@
-import { trip } from '@mocks/data/trip';
import type { Meta, StoryObj } from '@storybook/react';
import TripInfoEditModal from '@components/trip/TripInfoEditModal/TripInfoEditModal';
+import { trip } from '@mocks/data/trip';
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const { dayLogs, ...information } = trip;
diff --git a/frontend/src/stories/trip/TripItemAddModal.stories.tsx b/frontend/src/stories/trip/TripItemAddModal.stories.tsx
index af9580f3c..890f99727 100644
--- a/frontend/src/stories/trip/TripItemAddModal.stories.tsx
+++ b/frontend/src/stories/trip/TripItemAddModal.stories.tsx
@@ -1,10 +1,11 @@
-import { trip } from '@mocks/data/trip';
import type { Meta, StoryObj } from '@storybook/react';
+import TripItemAddModal from '@components/trip/TripItemAddModal/TripItemAddModal';
+
import { useExpenseCategoryQuery } from '@hooks/api/useExpenseCategoryQuery';
import { useTripQuery } from '@hooks/api/useTripQuery';
-import TripItemAddModal from '@components/trip/TripItemAddModal/TripItemAddModal';
+import { trip } from '@mocks/data/trip';
const meta = {
title: 'trip/TripItemAddModal',
diff --git a/frontend/src/stories/trips/TripsItem.stories.tsx b/frontend/src/stories/trips/TripsItem.stories.tsx
index e0bbf2368..52c07dcc3 100644
--- a/frontend/src/stories/trips/TripsItem.stories.tsx
+++ b/frontend/src/stories/trips/TripsItem.stories.tsx
@@ -1,9 +1,10 @@
-import { trips } from '@mocks/data/trips';
import type { Meta, StoryObj } from '@storybook/react';
+import TripsItem from '@components/trips/TripsItem/TripsItem';
+
import { formatDate } from '@utils/formatter';
-import TripsItem from '@components/trips/TripsItem/TripsItem';
+import { trips } from '@mocks/data/trips';
const meta = {
title: 'trips/TripsItem',
diff --git a/frontend/src/stories/trips/TripsItemList.stories.tsx b/frontend/src/stories/trips/TripsItemList.stories.tsx
index 3f7bd47b4..e804dd1d9 100644
--- a/frontend/src/stories/trips/TripsItemList.stories.tsx
+++ b/frontend/src/stories/trips/TripsItemList.stories.tsx
@@ -1,9 +1,10 @@
-import { trips } from '@mocks/data/trips';
import type { Meta, StoryObj } from '@storybook/react';
+import TripsItemList from '@components/trips/TripsItemList/TripsItemList';
+
import { sortByStartDate } from '@utils/sort';
-import TripsItemList from '@components/trips/TripsItemList/TripsItemList';
+import { trips } from '@mocks/data/trips';
const meta = {
title: 'trips/TripsItemList',
diff --git a/frontend/src/styles/index.ts b/frontend/src/styles/index.ts
index e29483eac..4fbd22333 100644
--- a/frontend/src/styles/index.ts
+++ b/frontend/src/styles/index.ts
@@ -1,4 +1,5 @@
import { css } from '@emotion/react';
+
import { Theme } from 'hang-log-design-system';
export const GlobalStyle = css({
diff --git a/frontend/src/types/dayLog.ts b/frontend/src/types/dayLog.ts
index 4b55d0ecb..a477b5ff5 100644
--- a/frontend/src/types/dayLog.ts
+++ b/frontend/src/types/dayLog.ts
@@ -1,6 +1,7 @@
-import type { DAY_LOG_ITEM_FILTERS } from '@constants/trip';
import type { TripItemData } from '@type/tripItem';
+import type { DAY_LOG_ITEM_FILTERS } from '@constants/trip';
+
export interface DayLogData {
id: number;
title: string;
diff --git a/frontend/src/types/expense.ts b/frontend/src/types/expense.ts
index faa139d7c..625d19def 100644
--- a/frontend/src/types/expense.ts
+++ b/frontend/src/types/expense.ts
@@ -1,6 +1,7 @@
-import type { EXPENSE_CATEGORY_NAMES } from '@constants/expense';
import type { CurrencyType } from '@type/tripItem';
+import type { EXPENSE_CATEGORY_NAMES } from '@constants/expense';
+
export type ExpenseCategoryNameType = (typeof EXPENSE_CATEGORY_NAMES)[number];
export interface ExpenseCategoryData {
diff --git a/frontend/src/utils/formatter.ts b/frontend/src/utils/formatter.ts
index d8514c6a8..b3755fcb1 100644
--- a/frontend/src/utils/formatter.ts
+++ b/frontend/src/utils/formatter.ts
@@ -1,6 +1,7 @@
-import { REGEX } from '@constants/regex';
import type { DateRangeData } from '@type/trips';
+import { REGEX } from '@constants/regex';
+
export const formatDate = (date: string) => {
return date.replace(/-/g, '.');
};
@@ -20,9 +21,7 @@ export const formatDateRange = ({ startDate, endDate }: DateRangeData) => {
};
export const formatStringToLetter = (string: string) => {
- const letterRegex = new RegExp(REGEX.ONLY_LETTER, 'g');
-
- const matches = string.match(letterRegex);
+ const matches = string.match(REGEX.ONLY_LETTER);
if (!matches) {
return '';