Enhance DataTable sorting functionality to support three-state sorting (asc, desc, none) and update sort indicator logic for better user experience.

src/components/DataTable.jsx

@@ -29,9 +29,15 @@ const DataTable = () => {
   const sortData = (key) => {
     let direction = 'asc';
     
-    // If clicking the same column, toggle direction
-    if (sortConfig.key === key && sortConfig.direction === 'asc') {
-      direction = 'desc';
+    // Three-state sorting: asc → desc → none
+    if (sortConfig.key === key) {
+      if (sortConfig.direction === 'asc') {
+        direction = 'desc';
+      } else if (sortConfig.direction === 'desc') {
+        // Reset to no sorting
+        setSortConfig({ key: null, direction: 'none' });
+        return;
+      }
     }
     
     setSortConfig({ key, direction });
@@ -39,7 +45,7 @@ const DataTable = () => {
 
   // Get sorted data
   const getSortedData = () => {
-    if (!sortConfig.key) return data;
+    if (!sortConfig.key || sortConfig.direction === 'none') return data;
 
     return [...data].sort((a, b) => {
       let aValue = a[sortConfig.key];
@@ -64,7 +70,9 @@ const DataTable = () => {
   // Get sort indicator for column headers
   const getSortIndicator = (key) => {
     if (sortConfig.key !== key) return '↕️';
-    return sortConfig.direction === 'asc' ? '↑' : '↓';
+    if (sortConfig.direction === 'asc') return '↑';
+    if (sortConfig.direction === 'desc') return '↓';
+    return '↕️';
   };
 
   const fetchFromMongoDB = async () => {