guesung · guesung · Jan 29, 2025 · Jan 27, 2025 · Jan 27, 2025 · Jan 27, 2025
@@ -21,26 +21,34 @@
     "sourceType": "module",
   },
   "plugins": [
+    "unused-imports",
     "prettier",
     "simple-import-sort",
     "react",
     "@typescript-eslint",
     "react-hooks",
     "import",
     "jsx-a11y",
-    "turbo",
   ],
   "settings": {
     "react": {
       "version": "detect",
     },
+    "import/resolver": {
+      "typescript": {
+        "alwaysTryTypes": true,
+        "project": "./tsconfig.json",
+      },
+    },
   },
   "rules": {
+    "@typescript-eslint/consistent-type-imports": "error",
     "react/react-in-jsx-scope": "off",
     "import/no-unresolved": "off",
     "react/prop-types": "off",
     "simple-import-sort/imports": "error",
     "simple-import-sort/exports": "error",
+    "unused-imports/no-unused-imports": "error",
   },
   "globals": {
     "chrome": "readonly",

@@ -85,12 +85,14 @@
     "eslint": "8.57.0",
     "eslint-config-airbnb-typescript": "18.0.0",
     "eslint-config-prettier": "9.1.0",
+    "eslint-import-resolver-typescript": "^3.7.0",
     "eslint-plugin-import": "2.29.1",
     "eslint-plugin-jsx-a11y": "6.10.0",
     "eslint-plugin-prettier": "5.2.1",
     "eslint-plugin-react": "7.35.0",
     "eslint-plugin-react-hooks": "4.6.2",
     "eslint-plugin-simple-import-sort": "^12.1.1",
+    "eslint-plugin-unused-imports": "^4.1.4",
     "husky": "^9.1.5",
     "lint-staged": "^15.2.7",
     "overlay-kit": "^1.4.1",

@@ -0,0 +1,7 @@
+export { default as useDidMount } from './useDidMount';
+export { default as useError } from './useError';
+export { default as useFetch } from './useFetch';
+export { default as useKeyboardBind } from './useKeyboardBind';
+export { default as useThrottle } from './useThrottle';
+export { default as useUserPreferDarkMode } from './useUserPreferDarkMode';
+export { default as useDebounce } from './useDebounce';
@@ -0,0 +1,28 @@
+import { useEffect } from 'react';
+
+type KeyboardEventKey = 'Backspace' | 'Escape' | 's';
+
+interface UseKeyboardBindProps {
+  key: KeyboardEventKey;
+  callback: () => void;
+  isMetaKey?: boolean;
+}
+
+export default function useKeyboardBind({ key, callback, isMetaKey = false }: UseKeyboardBindProps) {
+  useEffect(
+    function keyboardBind() {
+      const handleKeyDown = (event: KeyboardEvent) => {
+        const metaKey = isMetaKey ? event.metaKey : true;
+        if (metaKey && event.key === key) {
+          event.preventDefault();
+
+          callback();
+        }
+      };
+
+      window.addEventListener('keydown', handleKeyDown);
+      return () => window.removeEventListener('keydown', handleKeyDown);
+    },
+    [key, callback],
+  );
+}
@@ -1,10 +1,3 @@
 export * from './supabase';
-
-export { default as useDidMount } from './useDidMount';
-export { default as useError } from './useError';
-export { default as useFetch } from './useFetch';
-export { default as useKeyboardBind } from './useKeyboardBind';
-export { default as useThrottle } from './useThrottle';
-export { default as useUserPreferDarkMode } from './useUserPreferDarkMode';
-export { default as useDebounce } from './useDebounce';
-export { useRAF } from './useRAF';
+export * from './common';
+export * from './extension';
@@ -1,14 +1,2 @@
-export { default as useCategoryDeleteMutation } from './useCategoryDeleteMutation';
-export { default as useCategoryPatchMutation } from './useCategoryPatchMutation';
-export { default as useCategoryPostMutation } from './useCategoryPostMutation';
-export { default as useCategoryQuery } from './useCategoryQuery';
-export { default as useCategoryUpsertMutation } from './useCategoryUpsertMutation';
-export { default as useDeleteMemosMutation } from './useDeleteMemosMutation';
-export { default as useMemoPatchMutation } from './useMemoPatchMutation';
-export { default as useMemoPostMutation } from './useMemoPostMutation';
-export { default as useMemoQuery } from './useMemoQuery';
-export { default as useMemosQuery } from './useMemosQuery';
-export { default as useMemosUpsertMutation } from './useMemosUpsertMutation';
-export { default as useSupabaseUser } from './useSupabaseUser';
-export { default as useSignoutMutation } from './useSignoutMutation';
-export { default as useFeedbackMutation } from './useFeedbackMutation';
+export * from './queries';
+export * from './mutations';
@@ -0,0 +1,10 @@
+export { default as useCategoryDeleteMutation } from './useCategoryDeleteMutation';
+export { default as useCategoryPatchMutation } from './useCategoryPatchMutation';
+export { default as useCategoryPostMutation } from './useCategoryPostMutation';
+export { default as useCategoryUpsertMutation } from './useCategoryUpsertMutation';
+export { default as useDeleteMemosMutation } from './useDeleteMemosMutation';
+export { default as useMemoPatchMutation } from './useMemoPatchMutation';
+export { default as useMemoPostMutation } from './useMemoPostMutation';
+export { default as useMemosUpsertMutation } from './useMemosUpsertMutation';
+export { default as useSignoutMutation } from './useSignoutMutation';
+export { default as useFeedbackMutation } from './useFeedbackMutation';
@@ -2,7 +2,7 @@ import { QUERY_KEY } from '@src/constants';
 import { CategoryService } from '@src/utils';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import useSupabaseClientQuery from './useSupabaseClientQuery';
+import { useSupabaseClientQuery } from '../queries';
 
 export default function useCategoryDeleteMutation() {
   const queryClient = useQueryClient();

@@ -2,7 +2,7 @@ import { QUERY_KEY } from '@src/constants';
 import { CategoryService } from '@src/utils';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import useSupabaseClientQuery from './useSupabaseClientQuery';
+import { useSupabaseClientQuery } from '../queries';
 
 export default function useCategoryPatchMutation() {
   const queryClient = useQueryClient();

@@ -2,7 +2,7 @@ import { QUERY_KEY } from '@src/constants';
 import { CategoryService } from '@src/utils';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import useSupabaseClientQuery from './useSupabaseClientQuery';
+import { useSupabaseClientQuery } from '../queries';
 
 export default function useCategoryPostMutation() {
   const queryClient = useQueryClient();

@@ -2,7 +2,7 @@ import { QUERY_KEY } from '@src/constants';
 import { CategoryService } from '@src/utils';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import useSupabaseClientQuery from './useSupabaseClientQuery';
+import { useSupabaseClientQuery } from '../queries';
 
 export default function useCategoryUpsertMutation() {
   const queryClient = useQueryClient();

@@ -3,7 +3,7 @@ import { MemoSupabaseResponse } from '@src/types';
 import { MemoService } from '@src/utils';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import useSupabaseClientQuery from './useSupabaseClientQuery';
+import { useSupabaseClientQuery } from '../queries';
 
 export default function useDeleteMemosMutation() {
   const queryClient = useQueryClient();

@@ -1,7 +1,6 @@
 import { FeedbackService } from '@src/utils';
 import { useMutation } from '@tanstack/react-query';
-
-import useSupabaseFeedbackClientQuery from './useSupabaseFeedbackClientQuery';
+import { useSupabaseFeedbackClientQuery } from '../queries';
 
 export default function useFeedbackMutation() {
   const { data: supabaseClient } = useSupabaseFeedbackClientQuery();

@@ -3,7 +3,7 @@ import { MemoRow, MemoSupabaseResponse, MemoTable } from '@src/types';
 import { MemoService } from '@src/utils';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import useSupabaseClientQuery from './useSupabaseClientQuery';
+import { useSupabaseClientQuery } from '../queries';
 
 type MutationVariables = {
   id: MemoRow['id'];

@@ -3,7 +3,7 @@ import type { MemoSupabaseResponse, MemoTable } from '@src/types';
 import { MemoService } from '@src/utils';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import useSupabaseClientQuery from './useSupabaseClientQuery';
+import { useSupabaseClientQuery } from '../queries';
 
 type MutationError = Error;
 

@@ -3,7 +3,7 @@ import { MemoRow, MemoSupabaseResponse, MemoTable } from '@src/types';
 import { MemoService } from '@src/utils';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 
-import useSupabaseClientQuery from './useSupabaseClientQuery';
+import { useSupabaseClientQuery } from '../queries';
 
 type MutationVariables = MemoTable['Insert'][];
 type MutationData = Awaited<ReturnType<MemoService['upsertMemos']>>;

@@ -1,5 +1,5 @@
 import { useMutation } from '@tanstack/react-query';
-import useSupabaseClientQuery from './useSupabaseClientQuery';
+import { useSupabaseClientQuery } from '../queries';
 import { AuthService } from '@src/utils/Supabase';
 
 export default function useSignoutMutation() {

@@ -0,0 +1,6 @@
+export { default as useMemosQuery } from './useMemosQuery';
+export { default as useMemoQuery } from './useMemoQuery';
+export { default as useCategoryQuery } from './useCategoryQuery';
+export { default as useSupabaseUserQuery } from './useSupabaseUserQuery';
+export { default as useSupabaseClientQuery } from './useSupabaseClientQuery';
+export { default as useSupabaseFeedbackClientQuery } from './useSupabaseFeedbackClientQuery';
@@ -5,7 +5,7 @@ import { useSuspenseQuery } from '@tanstack/react-query';
 
 import useSupabaseClientQuery from './useSupabaseClientQuery';
 
-export default function useSupabaseUser() {
+export default function useSupabaseUserQuery() {
   const { data: supabaseClient } = useSupabaseClientQuery();
 
   const query = useSuspenseQuery<UserResponse, Error>({

@@ -1,6 +1,5 @@
 import { StorageKeyType } from '@src/modules/chrome-storage';
-
-import { I18n } from '../../utils/extension/module/I18n';
+import { I18n } from '@src/utils/extension';
 
 export default class ChromeSyncStorage {
   static async get<T>(key: StorageKeyType): Promise<T> {

@@ -192,7 +192,6 @@ export default class ExtensionBridge {
     try {
       chrome.runtime.sendMessage(EXTENSION.id, { type: BRIDGE_MESSAGE_TYPES.GET_EXTENSION_MANIFEST }, callbackFn);
     } catch (error) {
-      console.log('여기서 에러가 발생했습니다.');
       throw new ExtensionError('Failed to request extension manifest', ExtensionErrorCode.RUNTIME_ERROR, error);
     }
   }

@@ -1,3 +1,3 @@
-export * from './constant';
 export { default as ExtensionBridge } from './ExtensionBridge';
+export * from './constant';
 export * from './type';
@@ -1,4 +1,4 @@
-export * from './constant';
 export { default as LocalStorage } from './LocalStorage';
+export * from './constant';
 export * from './type';
 export * from './util';
@@ -20,5 +20,4 @@ export default withSentryConfig(nextConfig, {
   org: 'guesung',
   project: 'web-memo',
   authToken: CONFIG.sentryAuthToken,
-  silent: process.env.NODE_ENV === 'production',
 });
@@ -8,7 +8,8 @@
     "analyze": "ANALYZE=true next build",
     "start": "next start",
     "type-check": "tsc --noEmit",
-    "tsc-watch": "tsc-watch"
+    "tsc-watch": "tsc-watch",
+    "lint": "eslint . --fix"
   },
   "dependencies": {
     "@egjs/react-infinitegrid": "^4.12.0",
@@ -31,7 +32,6 @@
     "accept-language": "^3.0.20",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
-    "eslint": "9.9.1",
     "eslint-config-next": "14.2.7",
     "i18next": "^23.16.8",
     "i18next-browser-languagedetector": "^8.0.0",

@@ -0,0 +1,61 @@
+'use client';
+
+import { URL } from '@extension/shared/constants';
+import { checkLocalStorageTrue, setLocalStorageTrue } from '@extension/shared/modules/local-storage';
+import {
+  Button,
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@src/components/ui';
+import { useGetExtensionManifest } from '@src/hooks';
+import type { LanguageType } from '@src/modules/i18n';
+import useTranslation from '@src/modules/i18n/util.client';
+import { useEffect, useState } from 'react';
+
+interface ExtensionInstallCheckDialogProps extends LanguageType {}
+export default function ExtensionInstallCheckDialog({ lng }: ExtensionInstallCheckDialogProps) {
+  const [open, setOpen] = useState(false);
+  const manifest = useGetExtensionManifest();
+
+  const { t } = useTranslation(lng);
+
+  const closeDialog = () => {
+    setOpen(false);
+  };
+
+  const handleOkClick = () => {
+    window.open(URL.chromeStore, '_blank', 'noopener,noreferrer');
+    closeDialog();
+  };
+
+  const handleCancelClick = () => {
+    setLocalStorageTrue('install');
+  };
-  const handleCancelClick = () => {
-    setLocalStorageTrue('install');
-  };
+  const handleCancelClick = () => {
+    setLocalStorageTrue('install');
+    closeDialog();
+  };
-  const handleCancelClick = () => {
-    setLocalStorageTrue('install');
-  };
+  const handleCancelClick = () => {
+    setLocalStorageTrue('install');
+    closeDialog();
+  };
+
+  useEffect(() => {
+    const isInstalled = typeof manifest === 'object';
+
+    if (!isInstalled && !checkLocalStorageTrue('install')) setOpen(true);
+  }, [manifest]);
+
+  return (
+    <Dialog open={open} >
+      <DialogContent >
+        <DialogHeader>
+          <DialogTitle>{t('dialogInstall.title')}</DialogTitle>
+          <DialogDescription>{t('dialogInstall.description')}</DialogDescription>
+        </DialogHeader>
+        <DialogFooter>
+          <Button  variant="secondary">
+            {t('dialogInstall.cancel')}
+          </Button>
+          <Button >
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}