Skip to content

Commit

Permalink
fix : merge 진행 중 충돌 해결 2
Browse files Browse the repository at this point in the history
  • Loading branch information
@jiHeeFlee
jiHeeFlee committed Feb 2, 2025
1 parent 23efab5 commit 42e7e03
Showing 1 changed file with 1 addition and 106 deletions.
107 changes: 1 addition & 106 deletions src/components/post/Editor/IdeEditor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,63 +16,20 @@ const IdeEditor: React.FC<IdeEditorProps> = ({
const [themeLoaded, setThemeLoaded] = useState(false);
const editorRef = useRef<monaco.editor.IStandaloneCodeEditor | null>(null); // 코드 복사, 저장 : 명시적으로 monaco.editor.IStandaloneCodeEditor 타입 지정
const stompClientRef = useRef<Client | null>(null); // Websocket 클라이언트
<<<<<<< HEAD:src/components/Post/Editor/IdeEditor.tsx
const postId = 2;
const id= 2
const token = 'eyJhbGciOiJIUzI1NiJ9.eyJtZW1iZXJJZCI6NSwibG9naW5JZCI6ImNvZWR1RkUiLCJyb2xlIjpbIlVTRVIiXSwiZXhwIjoxNzM4NDY3NzYzLCJpYXQiOjE3Mzg0NjQxNjN9.a0P5HJ5RvORW6mOcunuGSH9mIgUIin9QYdIBZHnhm2k';

useEffect(()=>{
// 1️⃣ Websocket 연결 설정
=======
const postId = 1;
const id = 1;
const token = `Bearer ${localStorage.getItem('accessToken')}`;

useEffect(() => {
// JSON 테마 파일 로드 및 Monaco Editor 초기화
const loadCustomTheme = async () => {
try {
const response = await fetch('/monaco-themes/dark.json'); // public 폴더 기준
if (!response.ok) {
throw new Error(
`HTTP error! 테마 로드 안됨!! Status: ${response.status}`
);
}

// 'response.json()'의 결과를 CustomTheme 타입으로 캐스팅
const customTheme = (await response.json()) as CustomTheme;
const monaco = await loader.init(); // Monaco 로더 초기화

monaco.editor.defineTheme('custom-dark', customTheme); // 커스텀 테마 등록
setThemeLoaded(true); // 테마 로드 완료
} catch (error) {
console.error('Failed to load Monaco theme:', (error as Error).message);
}
};

loadCustomTheme();

if (editorRef.current) {
editorRef.current.focus(); // 마운트 시 code 창에 자동으로 포커스
}

// Websocket 연결 설정
>>>>>>> dev:src/components/post/Editor/IdeEditor.tsx
// 1️⃣ Websocket 연결 설정
stompClientRef.current = new Client({
// [필수] 연결할 서버 주소 명시
brokerURL:
'ws://ec2-3-36-75-8.ap-northeast-2.compute.amazonaws.com:8080/chatting',
<<<<<<< HEAD:src/components/Post/Editor/IdeEditor.tsx
connectHeaders : { Authorization : token },
debug: (str)=> console.log(`[ 🔍 WebSocket Debug ] : ${str}`),
onConnect:()=>{
console.log("[ ✅ 성공 ] Connected IDE");
=======
connectHeaders: { Authorization: token },
debug: (str) => console.log(`[ WebSocket Debug ] : ${str}`),
onConnect: () => {
console.log('[ ✅ 성공 ]Connected IDE');
>>>>>>> dev:src/components/post/Editor/IdeEditor.tsx

// 코드 변경 이벤트 구독
stompClientRef.current?.subscribe(`/ide/edit/${postId}`,(message)=>{
Expand All @@ -87,33 +44,20 @@ const IdeEditor: React.FC<IdeEditorProps> = ({

editorRef.current.setValue(receivedData.newContent);
}
<<<<<<< HEAD:src/components/Post/Editor/IdeEditor.tsx
} catch(error){
console.error("[ ❌ JSON 파싱 오류 ] 서버 응답이 올바르지 않습니다.", message.body);
=======
} catch (error) {
console.error(
'❌ JSON 파싱 오류: 서버 응답이 올바르지 않습니다.',
message.body
);
>>>>>>> dev:src/components/post/Editor/IdeEditor.tsx
}
});
},
onStompError: (frame) => {
<<<<<<< HEAD:src/components/Post/Editor/IdeEditor.tsx
console.error('[ ❌ STOMP 오류 ]', frame);
if (frame.headers?.message?.includes("Not authenticated")) {
alert("세션이 만료되었습니다. 다시 로그인해주세요.");
// 로그인 페이지로 리디렉트 가능
window.location.href = "/sign-in";
=======
console.error('[❌ STOMP 오류]', frame);
if (frame.headers?.message?.includes('Not authenticated')) {
alert('세션이 만료되었습니다. 다시 로그인해주세요.');
// ✅ 로그인 페이지로 리디렉트 가능
window.location.href = '/sign-in';
>>>>>>> dev:src/components/post/Editor/IdeEditor.tsx
}
},
onDisconnect: () => {
Expand All @@ -126,7 +70,6 @@ const IdeEditor: React.FC<IdeEditorProps> = ({

stompClientRef.current.activate();

<<<<<<< HEAD:src/components/Post/Editor/IdeEditor.tsx
// 2️⃣ JSON 테마 파일 로드 및 Monaco Editor 초기화
const loadCustomTheme = async () => {
try {
Expand All @@ -149,9 +92,6 @@ const IdeEditor: React.FC<IdeEditorProps> = ({
loadCustomTheme();

return ()=>{
=======
return () => {
>>>>>>> dev:src/components/post/Editor/IdeEditor.tsx
stompClientRef.current?.deactivate();
if (stompClientRef.current) {
console.log('💡 WebSocket 연결 해제');
Expand All @@ -160,33 +100,6 @@ const IdeEditor: React.FC<IdeEditorProps> = ({
};
}, []);

// useEffect(()=>{
// // JSON 테마 파일 로드 및 Monaco Editor 초기화
// const loadCustomTheme = async () => {
// try {
// const response = await fetch('/monaco-themes/dark.json'); // public 폴더 기준
// if (!response.ok) {
// throw new Error(`HTTP error! 테마 로드 안됨!! Status: ${response.status}`);
// }

// // 'response.json()'의 결과를 CustomTheme 타입으로 캐스팅
// const customTheme = (await response.json()) as CustomTheme;
// const monaco = await loader.init(); // Monaco 로더 초기화

// monaco.editor.defineTheme('custom-dark', customTheme); // 커스텀 테마 등록
// setThemeLoaded(true); // 테마 로드 완료
// } catch (error) {
// console.error('Failed to load Monaco theme:', (error as Error).message);
// }
// };

// loadCustomTheme();

// if(editorRef.current){
// editorRef.current.focus(); // 마운트 시 code 창에 자동으로 포커스
// }
// },[])

if (!themeLoaded) {
return (
<div style={{ color: '#000' }}>
Expand All @@ -196,7 +109,6 @@ const IdeEditor: React.FC<IdeEditorProps> = ({
}

const handleEditorMount = (editor: monaco.editor.IStandaloneCodeEditor) => {
<<<<<<< HEAD:src/components/Post/Editor/IdeEditor.tsx
editorRef.current = editor;


Expand All @@ -205,12 +117,6 @@ const IdeEditor: React.FC<IdeEditorProps> = ({

// 변경된 코드 가져오기
const updateCode = editorRef.current.getValue();
=======
editor.onDidChangeModelContent(() => {
if (!editorRef.current) return;
const updateCode = editorRef.current?.getValue() || 'print(\"test\") '; // 값이 없을 경우 문자열로 설정

>>>>>>> dev:src/components/post/Editor/IdeEditor.tsx
const messageContent = {
// Authorization:token,
// destination:'/send/posts/edit/1',
Expand All @@ -233,17 +139,6 @@ const IdeEditor: React.FC<IdeEditorProps> = ({
} else {
console.warn('⚠️ WebSocket 클라이언트가 아직 초기화되지 않았습니다.');
}
<<<<<<< HEAD:src/components/Post/Editor/IdeEditor.tsx
=======
// stompClientRef.current?.publish({
// destination: `/send/posts/edit/${postId}`,
// headers: {
// Authorization: token,
// 'content-type': 'application/json'
// },
// body: JSON.stringify(messageContent),
// });
>>>>>>> dev:src/components/post/Editor/IdeEditor.tsx
});
};

Expand Down

0 comments on commit 42e7e03

Please sign in to comment.