Update instructions and general package cleanup (#29)

* Update root readme and setup depcheck

* Use fetched domain data in edit domain dialog box

* Use fetched project data in general tab

* Rename files in gql-client package

---------

Co-authored-by: neeraj <neeraj.rtly@gmail.com>

packages/backend/.gitignore

@@ -1 +1,2 @@
 db
+dist

packages/backend/package.json

@@ -3,11 +3,14 @@
   "version": "1.0.0",
   "main": "index.js",
   "dependencies": {
+    "@graphql-tools/schema": "^10.0.2",
+    "@graphql-tools/utils": "^10.0.12",
     "@types/debug": "^4.1.5",
     "@types/express": "^4.17.21",
     "@types/node": "^20.11.0",
     "apollo-server-core": "^3.13.0",
     "apollo-server-express": "^3.13.0",
+    "debug": "^4.3.1",
     "express": "^4.18.2",
     "fs-extra": "^11.2.0",
     "graphql": "^16.8.1",
@@ -19,6 +22,7 @@
   },
   "scripts": {
     "start": "DEBUG=snowball:* ts-node ./src/index.ts",
+    "build": "tsc",
     "lint": "eslint .",
     "format": "prettier --write .",
     "format:check": "prettier --check ."

packages/backend/src/constants.ts

@@ -1,3 +1,5 @@
+export const DEFAULT_CONFIG_FILE_PATH = 'environments/local.toml';
+
 export const DEFAULT_GQL_PATH = '/graphql';
 
 // Note: temporary hardcoded user, later to be derived from auth token

packages/backend/src/index.ts

@@ -8,13 +8,13 @@ import { createAndStartServer } from './server';
 import { createResolvers } from './resolvers';
 import { getConfig } from './utils';
 import { Config } from './config';
+import { DEFAULT_CONFIG_FILE_PATH } from './constants';
 
 const log = debug('snowball:server');
-const configFilePath = 'environments/local.toml';
 
 export const main = async (): Promise<void> => {
   // TODO: get config path using cli
-  const { server, database } = await getConfig<Config>(configFilePath);
+  const { server, database } = await getConfig<Config>(DEFAULT_CONFIG_FILE_PATH);
 
   const db = new Database(database);
   await db.init();

packages/frontend/package.json

@@ -14,6 +14,8 @@
     "assert": "^2.1.0",
     "date-fns": "^3.0.1",
     "downshift": "^8.2.3",
+    "eslint-config-react-app": "^7.0.1",
+    "gql-client": "^1.0.0",
     "luxon": "^3.4.4",
     "react": "^18.2.0",
     "react-day-picker": "^8.9.1",

packages/frontend/src/components/projects/project/settings/DomainCard.tsx

@@ -163,6 +163,7 @@ const DomainCard = ({ domain, repo, project }: DomainCardProps) => {
         open={editDialogOpen}
         domain={domain}
         repo={repo}
+        project={project}
       />
     </>
   );

packages/frontend/src/components/projects/project/settings/Domains.tsx

@@ -4,7 +4,10 @@ import { useParams, Link, useOutletContext } from 'react-router-dom';
 import { Button, Typography } from '@material-tailwind/react';
 
 import DomainCard from './DomainCard';
-import { DomainDetails, ProjectsOutletContext } from '../../../../types/project';
+import {
+  DomainDetails,
+  ProjectsOutletContext,
+} from '../../../../types/project';
 
 const Domains = () => {
   const { id } = useParams();

packages/frontend/src/components/projects/project/settings/EditDomainDialog.tsx

@@ -14,8 +14,11 @@ import {
   Option,
 } from '@material-tailwind/react';
 
-import { DomainDetails, RepositoryDetails } from '../../../../types/project';
-import domains from '../../../../assets/domains.json';
+import {
+  DomainDetails,
+  ProjectDetails,
+  RepositoryDetails,
+} from '../../../../types/project';
 
 const DEFAULT_REDIRECT_OPTIONS = ['none'];
 
@@ -24,6 +27,7 @@ interface EditDomainDialogProp {
   handleOpen: () => void;
   domain: DomainDetails;
   repo: RepositoryDetails;
+  project: ProjectDetails;
 }
 
 const EditDomainDialog = ({
@@ -31,6 +35,7 @@ const EditDomainDialog = ({
   handleOpen,
   domain,
   repo,
+  project,
 }: EditDomainDialogProp) => {
   const getRedirectUrl = (domain: DomainDetails) => {
     const domainArr = domain.name.split('www.');
@@ -43,6 +48,12 @@ const EditDomainDialog = ({
     return redirectUrl;
   };
 
+  const domains = project.deployments
+    .filter((deployment: any) => {
+      return deployment.domain != null;
+    })
+    .map((deployment: any) => deployment.domain);
+
   const redirectOptions = useMemo(() => {
     const redirectUrl = getRedirectUrl(domain);
     return [...DEFAULT_REDIRECT_OPTIONS, redirectUrl];

packages/frontend/src/components/projects/project/settings/GeneralTabPanel.tsx

@@ -1,5 +1,5 @@
-import React, { useState } from 'react';
-import { Link } from 'react-router-dom';
+import React, { useState, useMemo } from 'react';
+import { Link, useOutletContext, useParams } from 'react-router-dom';
 import { useForm, Controller } from 'react-hook-form';
 import toast from 'react-hot-toast';
 
@@ -13,6 +13,7 @@ import {
 
 import DeleteProjectDialog from './DeleteProjectDialog';
 import ConfirmDialog from '../../../shared/ConfirmDialog';
+import { ProjectsOutletContext } from '../../../../types/project';
 
 const PROJECT_ID = '62f87575-7a2b-4951-8156-9f9821j380d';
 const TEAMS = ['Airfoil'];
@@ -33,6 +34,13 @@ const CopyIcon = ({ value }: { value: string }) => {
 };
 
 const GeneralTabPanel = () => {
+  const { id } = useParams();
+  const { projects } = useOutletContext<ProjectsOutletContext>();
+
+  const currProject = useMemo(() => {
+    return projects.find((project: any) => project.id === id);
+  }, [id]);
+
   const {
     handleSubmit: handleTransfer,
     control,
@@ -53,8 +61,8 @@ const GeneralTabPanel = () => {
 
   const { handleSubmit, register } = useForm({
     defaultValues: {
-      appName: 'iglootools',
-      description: '',
+      appName: currProject?.name,
+      description: currProject?.description,
     },
   });
 

packages/frontend/src/layouts/ProjectSearch.tsx

@@ -38,6 +38,7 @@ const ProjectSearch = () => {
                     name: '',
                     value: '',
                   },
+                  isRedirectedto: deployment.domain.isRedirected,
                 }
               : null,
           };

packages/frontend/src/types/project.ts

@@ -3,6 +3,7 @@ export interface ProjectDetails {
   name: string;
   title: string;
   organization: string;
+  description: string;
   url: string;
   domain: string | null;
   id: number;

packages/gql-client/index.ts

@@ -1 +1 @@
-export * from './src/gql-client';
+export * from './src/client';

packages/gql-client/src/client.ts

@@ -1,6 +1,6 @@
 import { ApolloClient, InMemoryCache, NormalizedCacheObject } from '@apollo/client';
 
-import { getUser, getOrganizations, getDeployments } from './gql-queries';
+import { getUser, getOrganizations, getDeployments } from './queries';
 
 export interface GraphQLConfig {
   gqlEndpoint: string;