chore: update component name

Author: luckfunc

src/App.tsx

@@ -1,5 +1,5 @@
 import { useState, useEffect } from 'react';
-import JsonFormatter from './components/JsonFormatter';
+import JsonFormatter from './components/json-formatter';
 import './App.less';
 
 export default function App() {

src/components/JsonFormatter.tsx renamed to src/components/json-formatter/index.tsx

@@ -1,14 +1,14 @@
-import React, { useState, useCallback } from 'react';
+import { useState, useCallback } from 'react';
 import Editor from '@monaco-editor/react';
-import { DEFAULT_JSON } from '../constants';
-import './JsonFormatter.less';
+import { DEFAULT_JSON } from '../../constants';
+import './style.less';
 
 interface JsonFormatterProps {
   isDarkMode: boolean;
   onThemeChange: (isDark: boolean) => void;
 }
 
-const JsonFormatter: React.FC<JsonFormatterProps> = ({ isDarkMode, onThemeChange }) => {
+export default function JsonFormatter({ isDarkMode, onThemeChange }: JsonFormatterProps) {
   const [inputJson, setInputJson] = useState(DEFAULT_JSON);
   const [outputJson, setOutputJson] = useState('');
   const [error, setError] = useState('');
@@ -185,6 +185,4 @@ const JsonFormatter: React.FC<JsonFormatterProps> = ({ isDarkMode, onThemeChange
       </div>
     </div>
   );
-};
-
-export default JsonFormatter;
+}

src/components/JsonFormatter.less renamed to src/components/json-formatter/style.less

@@ -1,4 +1,4 @@
-@import '../styles/variables.less';
+@import '../../styles/variables.less';
 
 .formatter-container {
   width: 100%;
@@ -230,4 +230,4 @@
     color: @light-success;
     border-color: @light-success-border;
   }
-}
+}