From 472fc452395a4f6143bfeb995136b11ab9266562 Mon Sep 17 00:00:00 2001
From: "Julian@Hasura" <118911427+julian-mayorga@users.noreply.github.com>
Date: Tue, 14 Mar 2023 21:23:16 -0300
Subject: [PATCH] console: Support X-Hasura-User-Id for number inputs DSF-162

PR-URL: https://github.com/hasura/graphql-engine-mono/pull/8261
Co-authored-by: Julian <843342+okjulian@users.noreply.github.com>
GitOrigin-RevId: 118bdb9261f92f6829ea19633de660388ff7db82
---
 .../RowPermissionsInput.stories.tsx           | 43 +++++++++++++++++++
 .../components/ValueInput.tsx                 | 20 +++++----
 .../components/ValueInputType.tsx             |  5 +--
 .../components/utils/helpers.ts               |  4 +-
 4 files changed, 56 insertions(+), 16 deletions(-)

diff --git a/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/RowPermissionsInput.stories.tsx b/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/RowPermissionsInput.stories.tsx
index 05875af3aac..7f391318f8d 100644
--- a/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/RowPermissionsInput.stories.tsx
+++ b/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/RowPermissionsInput.stories.tsx
@@ -345,6 +345,49 @@ BooleanArrayTypeRoot.play = async ({ canvasElement }) => {
   ).toBeInTheDocument();
 };
 
+export const NumericValue: ComponentStory<
+  typeof RowPermissionsInput
+> = args => (
+  <RowPermissionsInput
+    onPermissionsChange={action('onPermissionsChange')}
+    table={['Album']}
+    tables={tables}
+    comparators={comparators}
+    permissions={{ id: { _eq: '' } }}
+  />
+);
+
+NumericValue.play = async ({ canvasElement }) => {
+  const canvas = within(canvasElement);
+  expect(
+    canvas.getByTestId('id._eq-value-input-x-hasura-user-id')
+  ).toBeInTheDocument();
+};
+
+export const NumericIntValue: ComponentStory<
+  typeof RowPermissionsInput
+> = args => (
+  <RowPermissionsInput
+    onPermissionsChange={action('onPermissionsChange')}
+    table={['Album']}
+    tables={tables}
+    comparators={comparators}
+    permissions={{ id: { _eq: 0 } }}
+  />
+);
+
+export const NumericFloatValue: ComponentStory<
+  typeof RowPermissionsInput
+> = args => (
+  <RowPermissionsInput
+    onPermissionsChange={action('onPermissionsChange')}
+    table={['Album']}
+    tables={tables}
+    comparators={comparators}
+    permissions={{ id: { _eq: 0.9 } }}
+  />
+);
+
 SetRootLevelPermission.play = async ({ canvasElement }) => {
   const canvas = within(canvasElement);
   await userEvent.click(canvas.getByTestId('-operator'));
diff --git a/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/ValueInput.tsx b/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/ValueInput.tsx
index 6ba36c2e0b3..49a9773b821 100644
--- a/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/ValueInput.tsx
+++ b/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/ValueInput.tsx
@@ -70,15 +70,17 @@ export const ValueInput = ({ value, path }: { value: any; path: string[] }) => {
         value={value}
         comparatorType={comparator?.type}
       />
-      {inputType === 'text' && isComparator(comparatorName) && (
-        <Button
-          disabled={comparatorName === '_where' && isEmpty(table)}
-          onClick={() => setValue(path, 'X-Hasura-User-Id')}
-          mode="default"
-        >
-          [x-hasura-user-id]
-        </Button>
-      )}
+      {(inputType === 'text' || inputType === 'number') &&
+        isComparator(comparatorName) && (
+          <Button
+            disabled={comparatorName === '_where' && isEmpty(table)}
+            onClick={() => setValue(path, 'X-Hasura-User-Id')}
+            data-testid={`${componentLevelId}-x-hasura-user-id`}
+            mode="default"
+          >
+            [x-hasura-user-id]
+          </Button>
+        )}
     </>
   );
 };
diff --git a/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/ValueInputType.tsx b/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/ValueInputType.tsx
index e0de855d2b6..fb28eb87dbc 100644
--- a/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/ValueInputType.tsx
+++ b/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/ValueInputType.tsx
@@ -23,9 +23,6 @@ export const ValueInputType = ({
   const { setValue } = useContext(rowPermissionsContext);
   const { table } = useContext(tableContext);
 
-  const inputType =
-    jsType === 'boolean' ? 'checkbox' : jsType === 'string' ? 'text' : 'number';
-
   switch (jsType) {
     case 'boolean':
       return (
@@ -55,7 +52,7 @@ export const ValueInputType = ({
           data-testid={componentLevelId}
           disabled={comparatorName === '_where' && isEmpty(table)}
           className="border border-gray-200 rounded-md p-2 !mr-4"
-          type={inputType}
+          type="text"
           value={value}
           onChange={e => {
             setValue(path, graphQLTypeToJsType(e.target.value, comparatorType));
diff --git a/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/utils/helpers.ts b/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/utils/helpers.ts
index f5c66a81f8d..cbdb86a9458 100644
--- a/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/utils/helpers.ts
+++ b/frontend/libs/console/legacy-ce/src/lib/features/Permissions/PermissionsForm/components/RowPermissionsBuilder/components/utils/helpers.ts
@@ -120,9 +120,7 @@ export function graphQLTypeToJsType(
   if (!isScalarType(type)) {
     return value;
   }
-  if (type.name === 'Int' || type.name === 'ID' || type.name === 'Float') {
-    return Number(value);
-  } else if (type.name === 'Boolean') {
+  if (type.name === 'Boolean') {
     return Boolean(value);
   }