show a->z in model store vs z->a as default

src/renderer/components/ModelZoo/ModelStore.tsx

@@ -20,6 +20,7 @@ import {
 import {
   ArrowDownIcon,
   CheckIcon,
+  ChevronDownIcon,
   CreativeCommonsIcon,
   DownloadIcon,
   ExternalLinkIcon,
@@ -59,10 +60,10 @@ type Order = 'asc' | 'desc';
 
 function getComparator<Key extends keyof any>(
   order: Order,
-  orderBy: Key
+  orderBy: Key,
 ): (
   a: { [key in Key]: number | string },
-  b: { [key in Key]: number | string }
+  b: { [key in Key]: number | string },
 ) => number {
   return order === 'desc'
     ? (a, b) => descendingComparator(a, b, orderBy)
@@ -75,7 +76,7 @@ function getComparator<Key extends keyof any>(
 // with exampleArray.slice().sort(exampleComparator)
 function stableSort<T>(
   array: readonly T[],
-  comparator: (a: T, b: T) => number
+  comparator: (a: T, b: T) => number,
 ) {
   const stabilizedThis = array.map((el, index) => [el, index] as [T, number]);
   stabilizedThis.sort((a, b) => {
@@ -97,7 +98,7 @@ function getModelHuggingFaceURL(model) {
 const fetcher = (url) => fetch(url).then((res) => res.json());
 
 export default function ModelStore() {
-  const [order, setOrder] = useState<Order>('desc');
+  const [order, setOrder] = useState<Order>('asc');
   // jobId is null if there is no current download in progress,
   // and it is -1 if a download has been initiated but it hasn't started yet
   const [jobId, setJobId] = useState(null);
@@ -118,7 +119,7 @@ export default function ModelStore() {
   const { data: modelDownloadProgress } = useSWR(
     jobId && jobId != '-1' ? chatAPI.Endpoints.Jobs.Get(jobId) : null,
     fetcher,
-    { refreshInterval: 2000 }
+    { refreshInterval: 2000 },
   );
 
   // Creating a separate object to get useEffect for download jobs to work
@@ -128,12 +129,12 @@ export default function ModelStore() {
   // check if we have a Hugging Face access token
   const { data: hftoken } = useSWR(
     chatAPI.Endpoints.Config.Get('HuggingfaceUserAccessToken'),
-    fetcher
+    fetcher,
   );
 
   const { data: canLogInToHuggingFace } = useSWR(
     chatAPI.Endpoints.Models.HuggingFaceLogin(),
-    fetcher
+    fetcher,
   );
 
   // Set isHFAccessTokenSet to true if message in canLogInToHuggingFace is 'OK'
@@ -224,7 +225,7 @@ export default function ModelStore() {
         flexDirection: 'column',
         overflow: 'hidden',
       }}
-      >
+    >
       <Box
         sx={{
           position: 'relative',
@@ -336,7 +337,7 @@ export default function ModelStore() {
                     component="button"
                     onClick={() => setOrder(order === 'asc' ? 'desc' : 'asc')}
                     fontWeight="lg"
-                    endDecorator={<ArrowDownIcon />}
+                    endDecorator={<ChevronDownIcon />}
                     sx={{
                       '& svg': {
                         transition: '0.2s',
@@ -360,7 +361,7 @@ export default function ModelStore() {
               {modelGalleryData &&
                 stableSort(
                   filterByFilters(modelGalleryData, searchText, filters),
-                  getComparator(order, 'name')
+                  getComparator(order, 'name'),
                 ).map((row) => (
                   <tr key={row.uniqueID}>
                     <td>
@@ -473,7 +474,7 @@ export default function ModelStore() {
                                 'To access gated Hugging Face models you must first:\r\r' +
                                   '1. Create a READ access token in your Hugging Face account.\r\r' +
                                   '2. Enter the token on the Transformer Lab Settings page.\r\r' +
-                                  'Click OK to go to Settings.'
+                                  'Click OK to go to Settings.',
                               );
                               if (confirm_result) {
                                 navigate('/settings');
@@ -492,19 +493,19 @@ export default function ModelStore() {
                               setCurrentlyDownloading(row.name);
                               try {
                                 let response = await fetch(
-                                  chatAPI.Endpoints.Jobs.Create()
+                                  chatAPI.Endpoints.Jobs.Create(),
                                 );
                                 const newJobId = await response.json();
                                 setJobId(newJobId);
                                 response = await downloadModelFromGallery(
                                   row?.uniqueID,
-                                  newJobId
+                                  newJobId,
                                 );
                                 if (response?.status == 'error') {
                                   setCurrentlyDownloading(null);
                                   setJobId(null);
                                   return alert(
-                                    `Failed to download:\n${response.message}`
+                                    `Failed to download:\n${response.message}`,
                                   );
                                 } else if (response?.status == 'unauthorized') {
                                   setCurrentlyDownloading(null);
@@ -514,7 +515,7 @@ export default function ModelStore() {
                                     window
                                       .open(
                                         getModelHuggingFaceURL(row),
-                                        '_blank'
+                                        '_blank',
                                       )
                                       ?.focus();
                                   }
@@ -539,7 +540,7 @@ export default function ModelStore() {
                                         value={clamp(
                                           modelDownloadProgress?.progress,
                                           0,
-                                          100
+                                          100,
                                         )}
                                         sx={{ width: '100px' }}
                                         variant="solid"
@@ -550,10 +551,10 @@ export default function ModelStore() {
                                         <>
                                           {clamp(
                                             Number.parseFloat(
-                                              modelDownloadProgress?.progress
+                                              modelDownloadProgress?.progress,
                                             ),
                                             0,
-                                            100
+                                            100,
                                           ).toFixed(0)}
                                           %
                                         </>
@@ -570,7 +571,7 @@ export default function ModelStore() {
                                         modelDownloadProgress?.job_data
                                           ?.downloaded *
                                           1024 *
-                                          1024
+                                          1024,
                                       )}
                                       {/* {modelDownloadProgress?.job_data} */}
                                       <ArrowDownIcon size="18px" />