refactor: naver maps api 업데이트에 따른 변경사항 반영 (#61)

ncpClientId -> ncpKeyId
https://navermaps.github.io/maps.js.ncp/docs/tutorial-2-Getting-Started.html

Author: yeskyu12

src/hooks/useNaverMapInit/index.ts

@@ -4,7 +4,7 @@ import { useIsomorphicLayoutEffect } from "../useIsomorphicLayoutEffect";
 import { SCRIPT_ID } from "./constants";
 import type { InitResult, UseNaverMapInit } from "./types";
 import {
-  createNaverMapScriptByClientId,
+  createNaverMapScriptByKeyId,
   insertNaverMapScriptIntoHead,
 } from "./utils";
 
@@ -17,7 +17,7 @@ import {
  * @param onError - This function will triggered when loading script failed. If 'onError' changes too often, wrap that definition in useCallback
  */
 export const useNaverMapInit: UseNaverMapInit = ({
-  ncpClientId,
+  ncpKeyId,
   submodules,
   onLoad,
   onError,
@@ -39,8 +39,8 @@ export const useNaverMapInit: UseNaverMapInit = ({
 
     const initNaverMapScript = async () => {
       const scriptInitResult = new Promise<InitResult>((resolve, reject) => {
-        const script = createNaverMapScriptByClientId({
-          ncpClientId,
+        const script = createNaverMapScriptByKeyId({
+          ncpKeyId: ncpKeyId,
           submodules,
         });
         insertNaverMapScriptIntoHead(script);
@@ -62,7 +62,7 @@ export const useNaverMapInit: UseNaverMapInit = ({
     };
 
     initNaverMapScript();
-  }, [ncpClientId]);
+  }, [ncpKeyId]);
 
   useIsomorphicLayoutEffect(() => {
     if (onLoad && isFunction(onLoad) && isLoaded) {

src/hooks/useNaverMapInit/types.ts

@@ -1,5 +1,5 @@
 export interface InitParams {
-  ncpClientId: string;
+  ncpKeyId: string;
   submodules?: Submodule[]
   onLoad?: VoidFunction;
   onError?: VoidFunction;

…/utils/createNaverMapScriptByClientId.ts …nit/utils/createNaverMapScriptByKeyId.tssrc/hooks/useNaverMapInit/utils/createNaverMapScriptByClientId.ts renamed to src/hooks/useNaverMapInit/utils/createNaverMapScriptByKeyId.ts src/hooks/useNaverMapInit/utils/createNaverMapScriptByClientId.ts renamed to src/hooks/useNaverMapInit/utils/createNaverMapScriptByKeyId.ts

@@ -1,12 +1,12 @@
 import { SCRIPT_ID } from "../constants";
 import type { InitParams } from "../types";
 
-export const createNaverMapScriptByClientId = ({
-  ncpClientId,
+export const createNaverMapScriptByKeyId = ({
+  ncpKeyId,
   submodules,
-}: Pick<InitParams, "ncpClientId" | "submodules">) => {
+}: Pick<InitParams, "ncpKeyId" | "submodules">) => {
   const script = document.createElement("script");
-  let paramsString = `ncpClientId=${ncpClientId}`;
+  let paramsString = `ncpKeyId=${ncpKeyId}`;
 
   if (submodules?.length) {
     paramsString = paramsString.concat(`&submodules=${submodules.join(",")}`);

src/hooks/useNaverMapInit/utils/index.ts

@@ -1,2 +1,2 @@
-export * from "./createNaverMapScriptByClientId";
+export * from "./createNaverMapScriptByKeyId";
 export * from "./insertNaverMapScriptIntoHead";