Added automatic secret sorting on the first pull

README.md

@@ -60,7 +60,7 @@ To quickly get started, visit our [get started guide](https://infisical.com/docs
 
 ## 🔥 What's cool about this?
 
-Infisical makes secret management simple and end-to-end encrypted by default. We're on a mission to make it more accessible to all developers, <i>not just security teams</i>. 
+Infisical makes secret management simple and end-to-end encrypted by default. We're on a mission to make it more accessible to all developers, <i>not just security teams</i>.
 
 According to a [report](https://www.ekransystem.com/en/blog/secrets-management) in 2019, only 10% of organizations use secret management solutions despite all using digital secrets to some extent.
 
@@ -73,6 +73,7 @@ We are currently working hard to make Infisical more extensive. Need any integra
 Whether it's big or small, we love contributions ❤️ Check out our guide to see how to [get started](https://infisical.com/docs/contributing/overview).
 
 Not sure where to get started? You can:
+
 - [Book a free, non-pressure pairing sessions with one of our teammates](mailto:tony@infisical.com?subject=Pairing%20session&body=I'd%20like%20to%20do%20a%20pairing%20session!)!
 - Join our <a href="https://join.slack.com/t/infisical-users/shared_invite/zt-1kdbk07ro-RtoyEt_9E~fyzGo_xQYP6g">Slack</a>, and ask us any questions there.
 
@@ -81,7 +82,7 @@ Not sure where to get started? You can:
 - [Slack](https://join.slack.com/t/infisical-users/shared_invite/zt-1kdbk07ro-RtoyEt_9E~fyzGo_xQYP6g) (For live discussion with the community and the Infisical team)
 - [GitHub Discussions](https://github.com/Infisical/infisical/discussions) (For help with building and deeper conversations about features)
 - [GitHub Issues](https://github.com/Infisical/infisical-cli/issues) (For any bugs and errors you encounter using Infisical)
-- [Twitter](https://twitter.com/infisical) (Get news fast) 
+- [Twitter](https://twitter.com/infisical) (Get news fast)
 
 ## 🐥 Status
 
@@ -200,7 +201,6 @@ We're currently setting the foundation and building [integrations](https://infis
   </td>
 <td>
 
-
 <table>
   <tbody>
     <tr>
@@ -294,7 +294,6 @@ We're currently setting the foundation and building [integrations](https://infis
 </tr> 
 </table>
 
-
 ## 🏘 Open-source vs. paid
 
 This repo is entirely MIT licensed, with the exception of the `ee` directory which will contain premium enterprise features requiring a Infisical license in the future. We're currently focused on developing non-enterprise offerings first that should suit most use-cases.
@@ -311,4 +310,4 @@ Looking to report a security vulnerability? Please don't post about it in GitHub
 <!-- prettier-ignore-start -->
 <!-- markdownlint-disable -->
 
-<a href="https://github.com/dangtony98"><img src="https://avatars.githubusercontent.com/u/25857006?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/mv-turtle"><img src="https://avatars.githubusercontent.com/u/78047717?s=96&v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/maidul98"><img src="https://avatars.githubusercontent.com/u/9300960?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/gangjun06"><img src="https://avatars.githubusercontent.com/u/50910815?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/reginaldbondoc"><img src="https://avatars.githubusercontent.com/u/7693108?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/SH5H"><img src="https://avatars.githubusercontent.com/u/25437192?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/asharonbaltazar"><img src="https://avatars.githubusercontent.com/u/58940073?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/edgarrmondragon"><img src="https://avatars.githubusercontent.com/u/16805946?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/arjunyel"><img src="https://avatars.githubusercontent.com/u/11153289?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/adrianmarinwork"><img src="https://avatars.githubusercontent.com/u/118568289?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/hanywang2"><img src="https://avatars.githubusercontent.com/u/44352119?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/tobias-mintlify"><img src="https://avatars.githubusercontent.com/u/110702161?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/0xflotus"><img src="https://avatars.githubusercontent.com/u/26602940?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/wanjohiryan"><img src="https://avatars.githubusercontent.com/u/71614375?v=4" width="50" height="50" alt=""/></a> 
+<a href="https://github.com/dangtony98"><img src="https://avatars.githubusercontent.com/u/25857006?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/mv-turtle"><img src="https://avatars.githubusercontent.com/u/78047717?s=96&v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/maidul98"><img src="https://avatars.githubusercontent.com/u/9300960?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/gangjun06"><img src="https://avatars.githubusercontent.com/u/50910815?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/reginaldbondoc"><img src="https://avatars.githubusercontent.com/u/7693108?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/SH5H"><img src="https://avatars.githubusercontent.com/u/25437192?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/asharonbaltazar"><img src="https://avatars.githubusercontent.com/u/58940073?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/edgarrmondragon"><img src="https://avatars.githubusercontent.com/u/16805946?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/arjunyel"><img src="https://avatars.githubusercontent.com/u/11153289?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/LemmyMwaura"><img src="https://avatars.githubusercontent.com/u/20738858?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/adrianmarinwork"><img src="https://avatars.githubusercontent.com/u/118568289?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/hanywang2"><img src="https://avatars.githubusercontent.com/u/44352119?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/tobias-mintlify"><img src="https://avatars.githubusercontent.com/u/110702161?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/0xflotus"><img src="https://avatars.githubusercontent.com/u/26602940?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/wanjohiryan"><img src="https://avatars.githubusercontent.com/u/71614375?v=4" width="50" height="50" alt=""/></a>

frontend/components/utilities/secrets/getSecretsForProject.ts

@@ -81,17 +81,19 @@ const getSecretsForProject = async ({
           key: line['key'],
           value: line['value'],
           type: line['type']
-        }
+        };
       })
     );
 
-    return tempFileState.map((line, index) => [
-      guidGenerator(),
-      index,
-      line['key'],
-      line['value'],
-      line['type']
-    ]);
+    return tempFileState.map((line, index) => {
+      return {
+        id: guidGenerator(),
+        pos: index,
+        key: line['key'],
+        value: line['value'],
+        type: line['type']
+      };
+    });
   } catch (error) {
     console.log('Something went wrong during accessing or decripting secrets.');
   }

frontend/pages/dashboard/[id].js

@@ -265,14 +265,12 @@ export default function Dashboard() {
   /**
    * Reorder rows alphabetically or in the opprosite order
    */
-  const reorderRows = () => {
-    setSortMethod(prevSort =>
-      prevSort == 'alphabetical'
-        ? '-alphabetical'
-        : 'alphabetical'
+  const reorderRows = (dataToReorder) => {
+    setSortMethod((prevSort) =>
+      prevSort == 'alphabetical' ? '-alphabetical' : 'alphabetical'
     );
 
-    sortValuesHandler()
+    sortValuesHandler(dataToReorder);
   };
 
   useEffect(() => {
@@ -292,13 +290,14 @@ export default function Dashboard() {
         setBlurred(true);
         setWorkspaceId(router.query.id);
 
-        await getSecretsForProject({
+        const dataToSort = await getSecretsForProject({
           env,
           setFileState,
           setIsKeyAvailable,
           setData,
           workspaceId: router.query.id
         });
+        reorderRows(dataToSort);
 
         const user = await getUser();
         setIsNew(
@@ -321,13 +320,16 @@ export default function Dashboard() {
 
   const addRow = () => {
     setIsNew(false);
-    setData([...data, {
-      id:guidGenerator(),
-      pos:data.length,
-      key:'',
-      value:'',
-      type:'shared'
-    }]);
+    setData([
+      ...data,
+      {
+        id: guidGenerator(),
+        pos: data.length,
+        key: '',
+        value: '',
+        type: 'shared'
+      }
+    ]);
   };
 
   const deleteRow = (id) => {
@@ -450,23 +452,28 @@ export default function Dashboard() {
     setBlurred(!blurred);
   };
 
-  const sortValuesHandler = () => {
-    const sortedData = data.sort((a, b) =>
-      sortMethod == 'alphabetical'
-        ? a.key.localeCompare(b.key)
-        : b.key.localeCompare(a.key)
-    ).map((item, index) => {
-      return {
-        ...item, pos:index
-      }
-    })
+  const sortValuesHandler = (dataToSort) => {
+    const sortedData = (dataToSort != 1 ? dataToSort : data)
+      .sort((a, b) =>
+        sortMethod == 'alphabetical'
+          ? a.key.localeCompare(b.key)
+          : b.key.localeCompare(a.key)
+      )
+      .map((item, index) => {
+        return {
+          ...item,
+          pos: index
+        };
+      });
 
-    setData(sortedData)
-  }
+    setData(sortedData);
+  };
 
   // This function downloads the secrets as a .env file
   const download = () => {
-    const file = data.map((item) => [item.key, item.value].join('=')).join('\n');
+    const file = data
+      .map((item) => [item.key, item.value].join('='))
+      .join('\n');
     const blob = new Blob([file]);
     const fileDownloadUrl = URL.createObjectURL(blob);
     let alink = document.createElement('a');
@@ -600,7 +607,7 @@ export default function Dashboard() {
                     </div>
                     <div className="ml-2 min-w-max flex flex-row items-start justify-start">
                       <Button
-                        onButtonPressed={() => reorderRows()}
+                        onButtonPressed={() => reorderRows(1)}
                         color="mineshaft"
                         size="icon-md"
                         icon={
@@ -676,7 +683,8 @@ export default function Dashboard() {
                             .toLowerCase()
                             .includes(searchKeys.toLowerCase()) &&
                           keyPair.type == 'personal'
-                      )?.map((keyPair) => (
+                      )
+                      ?.map((keyPair) => (
                         <KeyPair
                           key={keyPair.id}
                           keyPair={keyPair}
@@ -724,7 +732,8 @@ export default function Dashboard() {
                             .toLowerCase()
                             .includes(searchKeys.toLowerCase()) &&
                           keyPair.type == 'shared'
-                      )?.map((keyPair) => (
+                      )
+                      ?.map((keyPair) => (
                         <KeyPair
                           key={keyPair.id}
                           keyPair={keyPair}

frontend/pages/integrations/[id].js

@@ -130,7 +130,7 @@ const Integration = ({ projectIntegration }) => {
                   let obj = Object.assign(
                     {},
                     ...currentSecrets.map((row) => ({
-                      [row[2]]: row[3]
+                      [row.key]: row.value
                     }))
                   );
                   await pushKeysIntegration({