Ensures selected tokens are not the same (#7)

Updates the token selection logic to prevent selecting the same token for both input and output.
It now swaps the output token if the user selects the same input token, and vice-versa.
Also, removes the `disabled` prop for `` elements.

Author: joaobrunoah

client/src/pool-types/stable-surge/StableSurge.tsx

@@ -600,7 +600,12 @@ export default function StableSurge() {
                 fullWidth
                 margin='normal'
                 value={swapTokenInIndex}
-                onChange={e => setSwapTokenInIndex(Number(e.target.value))}
+                onChange={e => {
+                  if (Number(e.target.value) === swapTokenOutIndex) {
+                    setSwapTokenOutIndex(swapTokenInIndex);
+                  }
+                  setSwapTokenInIndex(Number(e.target.value));
+                }}
                 SelectProps={{
                   native: true,
                 }}
@@ -616,27 +621,20 @@ export default function StableSurge() {
                 fullWidth
                 margin='normal'
                 value={swapTokenOutIndex}
-                onChange={e => setSwapTokenOutIndex(Number(e.target.value))}
+                onChange={e => {
+                  if (Number(e.target.value) === swapTokenInIndex) {
+                    setSwapTokenInIndex(swapTokenOutIndex);
+                  }
+                  setSwapTokenOutIndex(Number(e.target.value));
+                }}
                 SelectProps={{
                   native: true,
                 }}
               >
-                <option value={0} disabled={swapTokenInIndex === 0}>
-                  {tokenNames[0]}
-                </option>
-                <option value={1} disabled={swapTokenInIndex === 1}>
-                  {tokenNames[1]}
-                </option>
-                {tokenCount >= 3 && (
-                  <option value={2} disabled={swapTokenInIndex === 2}>
-                    {tokenNames[2]}
-                  </option>
-                )}
-                {tokenCount >= 4 && (
-                  <option value={3} disabled={swapTokenInIndex === 3}>
-                    {tokenNames[3]}
-                  </option>
-                )}
+                <option value={0}>{tokenNames[0]}</option>
+                <option value={1}>{tokenNames[1]}</option>
+                {tokenCount >= 3 && <option value={2}>{tokenNames[2]}</option>}
+                {tokenCount >= 4 && <option value={3}>{tokenNames[3]}</option>}
               </TextField>
               <TextField
                 label='Amount In'