chore: Use string IDs instead of integer ones

packages/backend/src/graphql/mutations/create-auth-data.ts

@@ -1,10 +1,9 @@
-import { GraphQLNonNull, GraphQLInt } from 'graphql';
+import { GraphQLNonNull, GraphQLString } from 'graphql';
-import Connection from '../../models/connection';
 import authLinkType from '../types/auth-link';
 import RequestWithCurrentUser from '../../types/express/request-with-current-user';
 
 type Params = {
-  id: number;
+  id: string;
 };
 
 const createAuthDataResolver = async (
@@ -40,7 +39,7 @@ const createAuthDataResolver = async (
 const createAuthData = {
   type: authLinkType,
   args: {
-    id: { type: GraphQLNonNull(GraphQLInt) },
+    id: { type: GraphQLNonNull(GraphQLString) },
   },
   resolve: (_: any, params: Params, req: RequestWithCurrentUser) =>
     createAuthDataResolver(params, req),

packages/backend/src/graphql/mutations/create-flow.ts

@@ -3,7 +3,7 @@ import flowType from '../types/flow';
 import RequestWithCurrentUser from '../../types/express/request-with-current-user';
 
 const createFlowResolver = async (req: RequestWithCurrentUser) => {
-  const flow = await req.currentUser.$relatedQuery('flows').insert();
+  const flow = await req.currentUser.$relatedQuery('flows').insert({});
 
   await Step.query().insert({
     flowId: flow.id,

packages/backend/src/graphql/mutations/delete-connection.ts

@@ -1,8 +1,8 @@
-import { GraphQLInt, GraphQLNonNull, GraphQLBoolean } from 'graphql';
+import { GraphQLString, GraphQLNonNull, GraphQLBoolean } from 'graphql';
 import RequestWithCurrentUser from '../../types/express/request-with-current-user';
 
 type Params = {
-  id: number;
+  id: string;
   data: object;
 };
 const deleteConnectionResolver = async (
@@ -23,7 +23,7 @@ const deleteConnectionResolver = async (
 const deleteConnection = {
   type: GraphQLBoolean,
   args: {
-    id: { type: GraphQLNonNull(GraphQLInt) },
+    id: { type: GraphQLNonNull(GraphQLString) },
   },
   resolve: (_: any, params: Params, req: RequestWithCurrentUser) =>
     deleteConnectionResolver(params, req),

packages/backend/src/graphql/mutations/delete-step.ts

@@ -1,9 +1,9 @@
-import { GraphQLInt, GraphQLNonNull, GraphQLBoolean } from 'graphql';
+import { GraphQLString, GraphQLNonNull, GraphQLBoolean } from 'graphql';
 import Step from '../../models/step';
 import RequestWithCurrentUser from '../../types/express/request-with-current-user';
 
 type Params = {
-  id: number;
+  id: string;
 };
 
 const deleteStepResolver = async (
@@ -24,7 +24,7 @@ const deleteStepResolver = async (
 const deleteStep = {
   type: GraphQLBoolean,
   args: {
-    id: { type: GraphQLNonNull(GraphQLInt) },
+    id: { type: GraphQLNonNull(GraphQLString) },
   },
   resolve: (_: any, params: Params, req: RequestWithCurrentUser) =>
     deleteStepResolver(params, req),

packages/backend/src/graphql/mutations/execute-step.ts

@@ -1,34 +1,38 @@
-import { GraphQLInt, GraphQLNonNull } from 'graphql';
+import { GraphQLString, GraphQLNonNull } from 'graphql';
 import Connection from '../../models/connection';
 import Step from '../../models/step';
 import stepType from '../types/step';
 
 type Params = {
-  id: number,
+  id: string;
-  data: Record<string, unknown>
+  data: Record<string, unknown>;
-}
+};
 const executeStepResolver = async (params: Params): Promise<any> => {
-  const step = await Step.query().findOne({
+  const step = await Step.query()
-    id: params.id
+    .findOne({
-  }).throwIfNotFound();
+      id: params.id,
+    })
+    .throwIfNotFound();
 
-  const connection = await Connection.query().findOne({
+  const connection = await Connection.query()
-    id: step.connectionId
+    .findOne({
-  }).throwIfNotFound();
+      id: step.connectionId,
+    })
+    .throwIfNotFound();
 
   const appClass = (await import(`../../apps/${step.appKey}`)).default;
   const appInstance = new appClass(connection.data);
   await appInstance.triggers[step.key].run();
 
   return step;
-}
+};
 
 const executeStep = {
   type: stepType,
   args: {
-    id: { type: GraphQLNonNull(GraphQLInt) }
+    id: { type: GraphQLNonNull(GraphQLString) },
   },
-  resolve: (_: any, params: Params) => executeStepResolver(params)
+  resolve: (_: any, params: Params) => executeStepResolver(params),
 };
 
 export default executeStep;

packages/backend/src/graphql/mutations/reset-connection.ts

@@ -1,9 +1,9 @@
-import { GraphQLInt, GraphQLNonNull } from 'graphql';
+import { GraphQLString, GraphQLNonNull } from 'graphql';
 import connectionType from '../types/connection';
 import RequestWithCurrentUser from '../../types/express/request-with-current-user';
 
 type Params = {
-  id: number;
+  id: string;
 };
 
 const resetConnectionResolver = async (
@@ -27,7 +27,7 @@ const resetConnectionResolver = async (
 const resetConnection = {
   type: connectionType,
   args: {
-    id: { type: GraphQLNonNull(GraphQLInt) },
+    id: { type: GraphQLNonNull(GraphQLString) },
   },
   resolve: (_: any, params: Params, req: RequestWithCurrentUser) =>
     resetConnectionResolver(params, req),

packages/backend/src/graphql/mutations/update-connection.ts

@@ -1,12 +1,13 @@
-import { GraphQLInt, GraphQLNonNull } from 'graphql';
+import { GraphQLString, GraphQLNonNull } from 'graphql';
 import { GraphQLJSONObject } from 'graphql-type-json';
 import connectionType from '../types/connection';
 import RequestWithCurrentUser from '../../types/express/request-with-current-user';
 
 type Params = {
-  id: number;
+  id: string;
   data: object;
 };
+
 const updateConnectionResolver = async (
   params: Params,
   req: RequestWithCurrentUser
@@ -31,7 +32,7 @@ const updateConnectionResolver = async (
 const updateConnection = {
   type: connectionType,
   args: {
-    id: { type: GraphQLNonNull(GraphQLInt) },
+    id: { type: GraphQLNonNull(GraphQLString) },
     data: { type: GraphQLNonNull(GraphQLJSONObject) },
   },
   resolve: (_: any, params: Params, req: RequestWithCurrentUser) =>

packages/backend/src/graphql/mutations/update-flow.ts

@@ -1,11 +1,12 @@
-import { GraphQLInt, GraphQLString, GraphQLNonNull } from 'graphql';
+import { GraphQLString, GraphQLNonNull } from 'graphql';
 import flowType from '../types/flow';
 import RequestWithCurrentUser from '../../types/express/request-with-current-user';
 
 type Params = {
-  id: number;
+  id: string;
   name: string;
 };
+
 const updateFlowResolver = async (
   params: Params,
   req: RequestWithCurrentUser
@@ -28,7 +29,7 @@ const updateFlowResolver = async (
 const updateFlow = {
   type: flowType,
   args: {
-    id: { type: GraphQLNonNull(GraphQLInt) },
+    id: { type: GraphQLNonNull(GraphQLString) },
     name: { type: GraphQLNonNull(GraphQLString) },
   },
   resolve: (_: any, params: Params, req: RequestWithCurrentUser) =>

packages/backend/src/graphql/mutations/update-step.ts

@@ -5,15 +5,15 @@ import RequestWithCurrentUser from '../../types/express/request-with-current-use
 
 type Params = {
   input: {
-    id: number;
+    id: string;
     key: string;
     appKey: string;
     parameters: string;
     flow: {
-      id: number;
+      id: string;
     };
     connection: {
-      id: number;
+      id: string;
     };
   };
 };

packages/backend/src/graphql/mutations/verify-connection.ts

@@ -1,10 +1,11 @@
-import { GraphQLInt, GraphQLNonNull } from 'graphql';
+import { GraphQLString, GraphQLNonNull } from 'graphql';
 import connectionType from '../types/connection';
 import RequestWithCurrentUser from '../../types/express/request-with-current-user';
 
 type Params = {
-  id: number;
+  id: string;
 };
+
 const verifyConnectionResolver = async (
   params: Params,
   req: RequestWithCurrentUser
@@ -36,7 +37,7 @@ const verifyConnectionResolver = async (
 const verifyConnection = {
   type: connectionType,
   args: {
-    id: { type: GraphQLNonNull(GraphQLInt) },
+    id: { type: GraphQLNonNull(GraphQLString) },
   },
   resolve: (_: any, params: Params, req: RequestWithCurrentUser) =>
     verifyConnectionResolver(params, req),

packages/backend/src/graphql/queries/get-flow.ts

@@ -1,9 +1,9 @@
-import { GraphQLNonNull, GraphQLInt } from 'graphql';
+import { GraphQLNonNull, GraphQLString } from 'graphql';
 import RequestWithCurrentUser from '../../types/express/request-with-current-user';
 import flowType from '../types/flow';
 
 type Params = {
-  id: number;
+  id: string;
 };
 
 const getFlowResolver = async (params: Params, req: RequestWithCurrentUser) => {
@@ -20,7 +20,7 @@ const getFlowResolver = async (params: Params, req: RequestWithCurrentUser) => {
 const getFlow = {
   type: flowType,
   args: {
-    id: { type: GraphQLNonNull(GraphQLInt) },
+    id: { type: GraphQLNonNull(GraphQLString) },
   },
   resolve: (_: any, params: Params, req: RequestWithCurrentUser) =>
     getFlowResolver(params, req),

packages/backend/src/graphql/types/connection.ts

@@ -1,4 +1,4 @@
-import { GraphQLObjectType, GraphQLString, GraphQLBoolean, GraphQLInt } from 'graphql';
+import { GraphQLObjectType, GraphQLString, GraphQLBoolean } from 'graphql';
 import connectionDataType from './connection-data';
 
 const connectionType = new GraphQLObjectType({
@@ -8,14 +8,14 @@ const connectionType = new GraphQLObjectType({
     const appType = require('./app').default;
 
     return {
-      id: { type: GraphQLInt },
+      id: { type: GraphQLString },
       key: { type: GraphQLString },
       data: { type: connectionDataType },
       verified: { type: GraphQLBoolean },
       app: { type: appType },
-      createdAt: { type: GraphQLString }
+      createdAt: { type: GraphQLString },
-    }
+    };
-  }
+  },
-})
+});
 
 export default connectionType;

packages/backend/src/graphql/types/flow.ts

@@ -1,16 +1,21 @@
-import { GraphQLList, GraphQLObjectType, GraphQLString, GraphQLInt, GraphQLBoolean } from 'graphql';
+import {
+  GraphQLList,
+  GraphQLObjectType,
+  GraphQLString,
+  GraphQLBoolean,
+} from 'graphql';
 import StepType from './step';
 
 const flowType = new GraphQLObjectType({
   name: 'Flow',
   fields: {
-    id: { type: GraphQLInt },
+    id: { type: GraphQLString },
     name: { type: GraphQLString },
     active: { type: GraphQLBoolean },
     steps: {
       type: GraphQLList(StepType),
-    }
+    },
-  }
+  },
-})
+});
 
 export default flowType;

packages/backend/src/graphql/types/step.ts

@@ -10,8 +10,8 @@ import ConnectionType from './connection';
 const stepType = new GraphQLObjectType({
   name: 'Step',
   fields: {
-    id: { type: GraphQLInt },
+    id: { type: GraphQLString },
-    previousStepId: { type: GraphQLInt },
+    previousStepId: { type: GraphQLString },
     key: { type: GraphQLString },
     appKey: { type: GraphQLString },
     type: {
@@ -32,15 +32,15 @@ const stepType = new GraphQLObjectType({
 export const stepInputType = new GraphQLInputObjectType({
   name: 'StepInput',
   fields: {
-    id: { type: GraphQLInt },
+    id: { type: GraphQLString },
-    previousStepId: { type: GraphQLInt },
+    previousStepId: { type: GraphQLString },
     key: { type: GraphQLString },
     appKey: { type: GraphQLString },
     connection: {
       type: new GraphQLInputObjectType({
         name: 'StepConnectionInput',
         fields: {
-          id: { type: GraphQLInt },
+          id: { type: GraphQLString },
         },
       }),
     },
@@ -48,7 +48,7 @@ export const stepInputType = new GraphQLInputObjectType({
       type: new GraphQLInputObjectType({
         name: 'StepFlowInput',
         fields: {
-          id: { type: GraphQLInt },
+          id: { type: GraphQLString },
         },
       }),
     },
@@ -57,7 +57,7 @@ export const stepInputType = new GraphQLInputObjectType({
       type: new GraphQLInputObjectType({
         name: 'PreviousStepInput',
         fields: {
-          id: { type: GraphQLInt },
+          id: { type: GraphQLString },
         },
       }),
     },

packages/backend/src/graphql/types/user.ts

@@ -1,13 +1,13 @@
-import { GraphQLObjectType, GraphQLString, GraphQLInt } from 'graphql';
+import { GraphQLObjectType, GraphQLString } from 'graphql';
 
 const userType = new GraphQLObjectType({
   name: 'User',
   fields: {
-    id: { type: GraphQLInt },
+    id: { type: GraphQLString },
     email: { type: GraphQLString },
     createdAt: { type: GraphQLString },
-    updatedAt: { type: GraphQLString }
+    updatedAt: { type: GraphQLString },
-  }
+  },
-})
+});
 
 export default userType;

packages/backend/src/models/connection.ts

@@ -1,23 +1,23 @@
 import { QueryContext, ModelOptions } from 'objection';
 import type { RelationMappings } from 'objection';
 import { AES, enc } from 'crypto-js';
-import Base from './base'
+import Base from './base';
-import User from './user'
+import User from './user';
 import appConfig from '../config/app';
 
 class Connection extends Base {
-  id!: number
+  id!: number;
-  key!: string
+  key!: string;
-  data!: any
+  data!: any;
-  userId!: number
+  userId!: number;
-  verified: boolean
+  verified: boolean;
-  count: number
+  count: number;
 
   static tableName = 'connections';
 
   static jsonSchema = {
     type: 'object',
-    required: ['key', 'data', 'userId'],
+    required: ['key', 'data'],
 
     properties: {
       id: { type: 'integer' },
@@ -25,8 +25,8 @@ class Connection extends Base {
       data: { type: 'object' },
       userId: { type: 'integer' },
       verified: { type: 'boolean' },
-    }
+    },
-  }
+  };
 
   static relationMappings = (): RelationMappings => ({
     user: {
@@ -36,21 +36,26 @@ class Connection extends Base {
         from: 'connections.user_id',
         to: 'users.id',
       },
-    }
+    },
-  })
+  });
 
   encryptData(): void {
-    if(!this.eligibleForEncryption()) return;
+    if (!this.eligibleForEncryption()) return;
-    this.data = AES.encrypt(JSON.stringify(this.data), appConfig.encryptionKey).toString();
+    this.data = AES.encrypt(
+      JSON.stringify(this.data),
+      appConfig.encryptionKey
+    ).toString();
   }
 
   decryptData(): void {
-    if(!this.eligibleForEncryption()) return;
+    if (!this.eligibleForEncryption()) return;
-    this.data = JSON.parse(AES.decrypt(this.data, appConfig.encryptionKey).toString(enc.Utf8));
+    this.data = JSON.parse(
+      AES.decrypt(this.data, appConfig.encryptionKey).toString(enc.Utf8)
+    );
   }
 
   eligibleForEncryption(): boolean {
-    return this.data ? true : false
+    return this.data ? true : false;
   }
 
   // TODO: Make another abstraction like beforeSave instead of using
@@ -60,7 +65,10 @@ class Connection extends Base {
     this.encryptData();
   }
 
-  async $beforeUpdate(opt: ModelOptions, queryContext: QueryContext): Promise<void> {
+  async $beforeUpdate(
+    opt: ModelOptions,
+    queryContext: QueryContext
+  ): Promise<void> {
     await super.$beforeUpdate(opt, queryContext);
     this.encryptData();
   }

packages/backend/src/models/step.ts

@@ -27,7 +27,7 @@ class Step extends Base {
       id: { type: 'integer' },
       flowId: { type: 'integer' },
       key: { type: ['string', null] },
-      appKey: { type: 'string', minLength: 1, maxLength: 255 },
+      appKey: { type: ['string', null], minLength: 1, maxLength: 255 },
       type: { type: 'string', enum: ['action', 'trigger'] },
       connectionId: { type: ['integer', null] },
       position: { type: 'integer' },

packages/web/src/components/Editor/index.tsx

@@ -14,13 +14,10 @@ import type { Step } from 'types/step';
 
 type EditorProps = {
   flow: Flow;
-}
+};
 
-function updateHandlerFactory(flowId: number, previousStepId: number) {
+function updateHandlerFactory(flowId: string, previousStepId: string) {
-  return function createStepUpdateHandler(
+  return function createStepUpdateHandler(cache: any, mutationResult: any) {
-    cache: any,
-    mutationResult: any,
-  ) {
     const { data } = mutationResult;
     const { createStep: createdStep } = data;
     const { getFlow: flow } = cache.readQuery({
@@ -40,7 +37,7 @@ function updateHandlerFactory(flowId: number, previousStepId: number) {
       variables: { id: flowId },
       data: { getFlow: { ...flow, steps } },
     });
-  }
+  };
 }
 
 export default function Editor(props: EditorProps): React.ReactElement {
@@ -49,41 +46,47 @@ export default function Editor(props: EditorProps): React.ReactElement {
   const [currentStep, setCurrentStep] = React.useState<number | null>(0);
   const { flow } = props;
 
-  const onStepChange = React.useCallback((step: any) => {
+  const onStepChange = React.useCallback(
-    const mutationInput: Record<string, unknown> = {
+    (step: any) => {
-      id: step.id,
+      const mutationInput: Record<string, unknown> = {
-      key: step.key,
+        id: step.id,
-      parameters: JSON.stringify(step.parameters, null, 2),
+        key: step.key,
-      connection: {
+        parameters: JSON.stringify(step.parameters, null, 2),
-        id: step.connection?.id
+        connection: {
-      },
+          id: step.connection?.id,
-      flow: {
+        },
-        id: flow.id,
+        flow: {
-      },
+          id: flow.id,
-    };
+        },
+      };
 
-    if (step.appKey) {
+      if (step.appKey) {
-      mutationInput.appKey = step.appKey;
+        mutationInput.appKey = step.appKey;
-    }
+      }
 
-    updateStep({ variables: { input: mutationInput } });
+      updateStep({ variables: { input: mutationInput } });
-  }, [updateStep, flow.id]);
+    },
+    [updateStep, flow.id]
+  );
 
-  const addStep = React.useCallback((previousStepId) => {
+  const addStep = React.useCallback(
-    const mutationInput = {
+    (previousStepId) => {
-      previousStep: {
+      const mutationInput = {
-        id: previousStepId,
+        previousStep: {
-      },
+          id: previousStepId,
-      flow: {
+        },
-        id: flow.id,
+        flow: {
-      },
+          id: flow.id,
-    };
+        },
+      };
 
-    createStep({
+      createStep({
-      variables: { input: mutationInput },
+        variables: { input: mutationInput },
-      update: updateHandlerFactory(flow.id, previousStepId),
+        update: updateHandlerFactory(flow.id, previousStepId),
-    });
+      });
-  }, [createStep, flow.id]);
+    },
+    [createStep, flow.id]
+  );
 
   return (
     <Box
@@ -113,5 +116,5 @@ export default function Editor(props: EditorProps): React.ReactElement {
         </React.Fragment>
       ))}
     </Box>
-  )
+  );
-};
+}

packages/web/src/graphql/mutations/create-auth-data.ts

@@ -1,7 +1,7 @@
 import { gql } from '@apollo/client';
 
 export const CREATE_AUTH_DATA = gql`
-  mutation createAuthData($id: Int!) {
+  mutation createAuthData($id: String!) {
     createAuthData(id: $id) {
       url
     }

packages/web/src/graphql/mutations/delete-connection.ts

@@ -1,7 +1,7 @@
 import { gql } from '@apollo/client';
 
 export const DELETE_CONNECTION = gql`
-  mutation DeleteConnection($id: Int!) {
+  mutation DeleteConnection($id: String!) {
     deleteConnection(id: $id)
   }
 `;

packages/web/src/graphql/mutations/reset-connection.ts

@@ -1,7 +1,7 @@
 import { gql } from '@apollo/client';
 
 export const RESET_CONNECTION = gql`
-  mutation ResetConnection($id: Int!) {
+  mutation ResetConnection($id: String!) {
     resetConnection(id: $id) {
       id
     }

packages/web/src/graphql/mutations/update-connection.ts

@@ -1,7 +1,7 @@
 import { gql } from '@apollo/client';
 
 export const UPDATE_CONNECTION = gql`
-  mutation UpdateConnection($id: Int!, $data: JSONObject!) {
+  mutation UpdateConnection($id: String!, $data: JSONObject!) {
     updateConnection(id: $id, data: $data) {
       id
       key

packages/web/src/graphql/mutations/verify-connection.ts

@@ -1,7 +1,7 @@
 import { gql } from '@apollo/client';
 
 export const VERIFY_CONNECTION = gql`
-  mutation VerifyConnection($id: Int!) {
+  mutation VerifyConnection($id: String!) {
     verifyConnection(id: $id) {
       id
       verified

packages/web/src/graphql/queries/get-flow.ts

@@ -1,7 +1,7 @@
 import { gql } from '@apollo/client';
 
 export const GET_FLOW = gql`
-  query GetFlow($id: Int!) {
+  query GetFlow($id: String!) {
     getFlow(id: $id) {
       id
       name

packages/web/src/graphql/queries/test-connection.ts

@@ -1,7 +1,7 @@
 import { gql } from '@apollo/client';
 
 export const TEST_CONNECTION = gql`
-  query TestConnection($id: Int!) {
+  query TestConnection($id: String!) {
     testConnection(id: $id) {
       id
       verified

packages/web/src/types/flow.ts

@@ -1,7 +1,7 @@
 import type { Step } from './step';
 
 export type Flow = {
-  id: number;
+  id: string;
   name: string;
   steps: Step[];
   active: boolean;

packages/web/src/types/step.ts

@@ -9,9 +9,9 @@ export type Step = {
   name: string;
   appKey: string;
   type: StepType;
-  previousStepId: number | null;
+  previousStepId: string | null;
   parameters: Record<string, unknown>;
   connection: {
-    id: number;
+    id: string;
   };
 };