fix multi engine and redirect issues (#65)

* fix multi engine and redirect issues * fix tsc error
mahmoudmoravej · Mar 8, 2024 · 8b464ba · 8b464ba
1 parent fe613e0
commit 8b464ba
Show file tree

Hide file tree

Showing 9 changed files with 173 additions and 101 deletions.
diff --git a/app/@types/graphql/schema.ts b/app/@types/graphql/schema.ts
@@ -20,8 +20,8 @@ export type Scalars = {
 
 export type Activity = {
   __typename?: 'Activity';
-  aiEngine: AiEngine;
-  aiEngineId: Scalars['Int']['output'];
+  aiEngineType: AiEngineType;
+  aiEngineTypeId: Scalars['Int']['output'];
   channelActivityId: Scalars['String']['output'];
   channelActivityUrl?: Maybe<Scalars['String']['output']>;
   channelId: Scalars['Int']['output'];
@@ -83,8 +83,8 @@ export type Advice = {
   activitiesTotal: Scalars['Int']['output'];
   activityPrompt?: Maybe<Scalars['String']['output']>;
   activitySummary?: Maybe<Scalars['String']['output']>;
-  aiEngine: AiEngine;
-  aiEngineId: Scalars['Int']['output'];
+  aiEngineType: AiEngineType;
+  aiEngineTypeId: Scalars['Int']['output'];
   analyzedActivitiesTotal: Scalars['Int']['output'];
   analyzedAt: Scalars['ISO8601DateTime']['output'];
   contentReadyVisionsTotal: Scalars['Int']['output'];
@@ -630,6 +630,7 @@ export type Organization = {
   githubToken?: Maybe<Scalars['String']['output']>;
   id: Scalars['Int']['output'];
   isPersonal: Scalars['Boolean']['output'];
+  isSystem: Scalars['Boolean']['output'];
   name: Scalars['String']['output'];
   owner: User;
   useSystemAiEngine: Scalars['Boolean']['output'];
@@ -1187,16 +1188,16 @@ export type FindOrganizationQueryVariables = Exact<{
 }>;
 
 
-export type FindOrganizationQuery = { __typename?: 'Query', organization: { __typename?: 'Organization', id: number, name: string, isPersonal: boolean, githubOrgs?: string | null, useSystemGithubToken: boolean, githubToken?: string | null, useSystemAiEngine: boolean, owner: { __typename?: 'User', email: string }, aiEngines?: { __typename?: 'AiEngineConnection', nodes?: Array<{ __typename?: 'AiEngine', id: number, settings?: string | null, type: { __typename?: 'AiEngineType', id: number, title: string } } | null> | null } | null } };
+export type FindOrganizationQuery = { __typename?: 'Query', organization: { __typename?: 'Organization', id: number, name: string, isPersonal: boolean, isSystem: boolean, githubOrgs?: string | null, useSystemGithubToken: boolean, githubToken?: string | null, useSystemAiEngine: boolean, owner: { __typename?: 'User', email: string }, aiEngines?: { __typename?: 'AiEngineConnection', nodes?: Array<{ __typename?: 'AiEngine', id: number, settings?: string | null, type: { __typename?: 'AiEngineType', id: number, title: string } } | null> | null } | null } };
 
-export type OrganizationFragmentFragment = { __typename?: 'Organization', id: number, name: string, isPersonal: boolean, githubOrgs?: string | null, useSystemGithubToken: boolean, githubToken?: string | null, useSystemAiEngine: boolean, owner: { __typename?: 'User', email: string }, aiEngines?: { __typename?: 'AiEngineConnection', nodes?: Array<{ __typename?: 'AiEngine', id: number, settings?: string | null, type: { __typename?: 'AiEngineType', id: number, title: string } } | null> | null } | null };
+export type OrganizationFragmentFragment = { __typename?: 'Organization', id: number, name: string, isPersonal: boolean, isSystem: boolean, githubOrgs?: string | null, useSystemGithubToken: boolean, githubToken?: string | null, useSystemAiEngine: boolean, owner: { __typename?: 'User', email: string }, aiEngines?: { __typename?: 'AiEngineConnection', nodes?: Array<{ __typename?: 'AiEngine', id: number, settings?: string | null, type: { __typename?: 'AiEngineType', id: number, title: string } } | null> | null } | null };
 
 export type UpdateOrganizationMutationVariables = Exact<{
   input: OrganizationUpdateInput;
 }>;
 
 
-export type UpdateOrganizationMutation = { __typename?: 'Mutation', organizationUpdate?: { __typename?: 'OrganizationUpdatePayload', organization: { __typename?: 'Organization', id: number, name: string, isPersonal: boolean, githubOrgs?: string | null, useSystemGithubToken: boolean, githubToken?: string | null, useSystemAiEngine: boolean, owner: { __typename?: 'User', email: string }, aiEngines?: { __typename?: 'AiEngineConnection', nodes?: Array<{ __typename?: 'AiEngine', id: number, settings?: string | null, type: { __typename?: 'AiEngineType', id: number, title: string } } | null> | null } | null } } | null };
+export type UpdateOrganizationMutation = { __typename?: 'Mutation', organizationUpdate?: { __typename?: 'OrganizationUpdatePayload', organization: { __typename?: 'Organization', id: number, name: string, isPersonal: boolean, isSystem: boolean, githubOrgs?: string | null, useSystemGithubToken: boolean, githubToken?: string | null, useSystemAiEngine: boolean, owner: { __typename?: 'User', email: string }, aiEngines?: { __typename?: 'AiEngineConnection', nodes?: Array<{ __typename?: 'AiEngine', id: number, settings?: string | null, type: { __typename?: 'AiEngineType', id: number, title: string } } | null> | null } | null } } | null };
 
 export type FindVisionQueryVariables = Exact<{
   id: Scalars['ID']['input'];
@@ -1308,6 +1309,7 @@ export const OrganizationFragmentFragmentDoc = gql`
     email
   }
   isPersonal
+  isSystem
   githubOrgs
   useSystemGithubToken
   githubToken

diff --git a/app/components/OrganizationForm.tsx b/app/components/OrganizationForm.tsx
@@ -16,6 +16,7 @@ import { ChangeEventHandler } from "react";
 
 export type OrganizationFormData = Omit<OrganizationUpdate, "aiEngines"> & {
   isPersonal: boolean;
+  isSystem: boolean;
 } & {
   aiEngines:
     | { id: number; title: string; settings: string }[]
@@ -58,7 +59,7 @@ export function OrganizationForm<T extends OrganizationFormData>({
       <div className="w-1/2">
         <Form className="mb-2 mt-8 w-80 max-w-screen-lg sm:w-auto">
           <div className="mb-1 flex flex-col gap-6">
-            {!organization.isPersonal && (
+            {!organization.isPersonal && !organization.isSystem && (
               <>
                 <Typography variant="h6" color="blue-gray" className="-mb-3">
                   Name
@@ -71,6 +72,7 @@ export function OrganizationForm<T extends OrganizationFormData>({
                   }}
                   crossOrigin={undefined}
                   value={organization.name ?? ""}
+                  readOnly={organization.isSystem}
                   onChange={({ target }) => {
                     updateData({ ...organization, name: target.value });
                   }}
@@ -87,51 +89,58 @@ export function OrganizationForm<T extends OrganizationFormData>({
                   }}
                   crossOrigin={undefined}
                   value={organization.ownerEmail ?? ""}
+                  readOnly={organization.isSystem}
                   onChange={({ target }) => {
                     updateData({ ...organization, ownerEmail: target.value });
                   }}
                 />
               </>
             )}
-            <Typography variant="h6" color="blue-gray" className="-mb-3">
-              Github Organizations (comma separated)
-            </Typography>
-            <Input
-              size="lg"
-              className=" !border-t-blue-gray-200 focus:!border-t-gray-900"
-              labelProps={{
-                className: "before:content-none after:content-none",
-              }}
-              crossOrigin={undefined}
-              value={organization.githubOrgs ?? ""}
-              onChange={({ target }) => {
-                updateData({ ...organization, githubOrgs: target.value });
-              }}
-            />
-            <Card>
-              <List>
-                <ListItem className="p-0">
-                  <Radio
-                    name="github_token"
-                    label="Use system Default Github API key"
-                    crossOrigin={undefined}
-                    value={true.toString()}
-                    defaultChecked={organization.useSystemGithubToken}
-                    onChange={onUseSystemDefaultGithubToken}
-                  />
-                </ListItem>
-                <ListItem className="p-0">
-                  <Radio
-                    name="github_token"
-                    label="Use My Github API Key"
-                    crossOrigin={undefined}
-                    value={false.toString()}
-                    defaultChecked={!organization.useSystemGithubToken}
-                    onChange={onUseSystemDefaultGithubToken}
-                  />
-                </ListItem>
-              </List>
-            </Card>
+            {!organization.isSystem && (
+              <>
+                <Typography variant="h6" color="blue-gray" className="-mb-3">
+                  Github Organizations (comma separated)
+                </Typography>
+                <Input
+                  size="lg"
+                  className=" !border-t-blue-gray-200 focus:!border-t-gray-900"
+                  labelProps={{
+                    className: "before:content-none after:content-none",
+                  }}
+                  crossOrigin={undefined}
+                  value={organization.githubOrgs ?? ""}
+                  onChange={({ target }) => {
+                    updateData({ ...organization, githubOrgs: target.value });
+                  }}
+                />
+              </>
+            )}
+            {!organization.isSystem && (
+              <Card>
+                <List>
+                  <ListItem className="p-0">
+                    <Radio
+                      name="github_token"
+                      label="Use system default Github API key"
+                      crossOrigin={undefined}
+                      value={true.toString()}
+                      checked={organization.useSystemGithubToken}
+                      onChange={onUseSystemDefaultGithubToken}
+                    />
+                  </ListItem>
+                  <ListItem className="p-0">
+                    <Radio
+                      name="github_token"
+                      label="Use Github API Key"
+                      crossOrigin={undefined}
+                      value={false.toString()}
+                      checked={!organization.useSystemGithubToken}
+                      onChange={onUseSystemDefaultGithubToken}
+                    />
+                  </ListItem>
+                </List>
+              </Card>
+            )}
             {!organization.useSystemGithubToken && (
               <>
                 <Typography variant="h6" color="blue-gray" className="-mb-3">
@@ -159,34 +168,36 @@ export function OrganizationForm<T extends OrganizationFormData>({
                 />
               </>
             )}
-            <Card>
-              <List>
-                <ListItem className="p-0">
-                  <Radio
-                    name="ai_engine"
-                    label="Use system Default AI Engine"
-                    crossOrigin={undefined}
-                    value={true.toString()}
-                    defaultChecked={organization.useSystemAiEngine}
-                    onChange={onUseSystemAiEngine}
-                  />
-                </ListItem>
-                <ListItem className="p-0">
-                  <Radio
-                    name="ai_engine"
-                    label="Use My AI Engine"
-                    crossOrigin={undefined}
-                    value={false.toString()}
-                    defaultChecked={!organization.useSystemAiEngine}
-                    onChange={onUseSystemAiEngine}
-                  />
-                </ListItem>
-              </List>
-            </Card>
+            {!organization.isSystem && (
+              <Card>
+                <List>
+                  <ListItem className="p-0">
+                    <Radio
+                      name="ai_engine"
+                      label="Use system default AI Engine"
+                      crossOrigin={undefined}
+                      value={true.toString()}
+                      checked={organization.useSystemAiEngine}
+                      onChange={onUseSystemAiEngine}
+                    />
+                  </ListItem>
+                  <ListItem className="p-0">
+                    <Radio
+                      name="ai_engine"
+                      label="Use AI Engine"
+                      crossOrigin={undefined}
+                      value={false.toString()}
+                      checked={!organization.useSystemAiEngine}
+                      onChange={onUseSystemAiEngine}
+                    />
+                  </ListItem>
+                </List>
+              </Card>
+            )}
             {!organization.useSystemAiEngine && (
               <>
                 <Typography variant="h6" color="blue-gray" className="-mb-3">
-                  My AI Engines Settings
+                  AI Engines Settings
                 </Typography>
 
                 {organization?.aiEngines?.map(({ id, title, settings }) => (
@@ -206,11 +217,18 @@ export function OrganizationForm<T extends OrganizationFormData>({
                           }}
                           value={formatJson(settings)}
                           onChange={({ target }) => {
+                            const aiEngines = [
+                              ...(organization.aiEngines ?? []),
+                            ];
+                            const currentEngine = aiEngines.find(
+                              (o) => o.id == id,
+                            );
+                            if (currentEngine)
+                              currentEngine.settings = target.value;
+
                             updateData({
                               ...organization,
-                              aiEngines: [
-                                { id, title, settings: target.value },
-                              ],
+                              aiEngines,
                             });
                           }}
                         />
@@ -232,7 +250,8 @@ export function OrganizationForm<T extends OrganizationFormData>({
   );
 }
 
-function formatJson(json: string) {
+function formatJson(json?: string | null) {
+  if (json == null) return "";
   try {
     return JSON.stringify(JSON.parse(json), null, 2);
   } catch {

diff --git a/app/routes/_dashboard.organizations.$id.edit/graphql/organizationFragment.gql b/app/routes/_dashboard.organizations.$id.edit/graphql/organizationFragment.gql
@@ -5,6 +5,7 @@ fragment OrganizationFragment on Organization {
     email
   }
   isPersonal
+  isSystem
   githubOrgs
   useSystemGithubToken
   githubToken

diff --git a/app/routes/_dashboard.organizations.$id.edit/route.tsx b/app/routes/_dashboard.organizations.$id.edit/route.tsx
@@ -63,7 +63,12 @@ export default function OrganizationEdit() {
   return (
     <Card color="transparent" shadow={false}>
       <Typography variant="h4" color="blue-gray">
-        Modifying {organization.isPersonal ? "Account" : "Organization"}{" "}
+        Modifying{" "}
+        {organization.isPersonal
+          ? "Account"
+          : organization.isSystem
+            ? "System"
+            : "Organization"}{" "}
         Settings
       </Typography>
       <OrganizationForm
@@ -103,7 +108,7 @@ function getEditData(
 function getSubmitData(
   data: Exclude<OrganizationEditFormData, null | undefined>,
 ): OrganizationUpdate {
-  const { id: _, isPersonal: __, aiEngines, ...input } = data;
+  const { id: _, isPersonal: __, isSystem: ___, aiEngines, ...input } = data;
 
   return {
     ...input,

diff --git a/app/routes/auth.google.signin.callback.tsx b/app/routes/auth.google.signin.callback.tsx
@@ -1,6 +1,8 @@
 import { LoaderFunctionArgs, redirect } from "@remix-run/node";
 import { AuthorizationError } from "remix-auth";
+
 import { authenticator } from "~/services/auth.server";
+import { parseAuthenticationMessage } from "~/utils";
 
 export async function loader({ request }: LoaderFunctionArgs) {
   try {
@@ -10,12 +12,19 @@ export async function loader({ request }: LoaderFunctionArgs) {
     });
   } catch (error) {
     if (error instanceof Response) return error;
-    if (error instanceof AuthorizationError) {
-      return redirect("/signin", {
-        headers: {
-          "Set-Cookie": "signin-error=unauthorized; Path=/",
+    else if (error instanceof AuthorizationError) {
+      const errorMessageDetails = parseAuthenticationMessage(error.message);
+
+      return redirect(
+        errorMessageDetails.organization_id != null
+          ? `/signin/${errorMessageDetails.organization_id}`
+          : "/signin",
+        {
+          headers: {
+            "Set-Cookie": "signin-error=unauthorized; Path=/",
+          },
         },
-      });
+      );
     }
   }
 }
diff --git a/app/routes/auth.google.signup.callback.tsx b/app/routes/auth.google.signup.callback.tsx
@@ -1,7 +1,8 @@
 import { LoaderFunctionArgs, redirect } from "@remix-run/node";
-
 import { AuthorizationError } from "remix-auth";
+
 import { authenticator } from "~/services/auth.server";
+import { parseAuthenticationMessage } from "~/utils";
 
 export async function loader({ request }: LoaderFunctionArgs) {
   try {
@@ -12,11 +13,18 @@ export async function loader({ request }: LoaderFunctionArgs) {
   } catch (error) {
     if (error instanceof Response) return error;
     else if (error instanceof AuthorizationError) {
-      return redirect("/signup", {
-        headers: {
-          "Set-Cookie": `signup-error=${error.message}; Path=/`,
+      const errorMessageDetails = parseAuthenticationMessage(error.message);
+
+      return redirect(
+        errorMessageDetails.organization_id != null
+          ? `/signup/${errorMessageDetails.organization_id}`
+          : "/signup",
+        {
+          headers: {
+            "Set-Cookie": `signup-error=${errorMessageDetails.message}; Path=/`,
+          },
         },
-      });
+      );
     }
   }
 }