Set subdomain for project and set URL for each deployment (#52)

* Display current deployment info in overview tab

* Add assign domain dialog box in deployments

* Add empty link for project settings in assign domain dialog box

* Use react router dom link

* Add sub domain to project entity

* Add deployment url with custom generated string

* Set nano id to deployment id

* Add sub domain while creating new project

* Use same id as in url

* Update readme steps for production build

* Update README

---------

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

packages/backend/src/constants.ts

@@ -4,3 +4,5 @@ export const DEFAULT_GQL_PATH = '/graphql';
 
 // Note: temporary hardcoded user, later to be derived from auth token
 export const USER_ID = 1;
+
+export const PROJECT_DOMAIN = 'snowball.xyz';

packages/backend/src/database.ts

@@ -2,6 +2,8 @@ import { DataSource, DeepPartial } from 'typeorm';
 import path from 'path';
 import debug from 'debug';
 import assert from 'assert';
+import { customAlphabet } from 'nanoid';
+import { lowercase, numbers } from 'nanoid-dictionary';
 
 import { DatabaseConfig } from './config';
 import { User } from './entity/User';
@@ -11,9 +13,12 @@ import { Deployment, Environment } from './entity/Deployment';
 import { Permission, ProjectMember } from './entity/ProjectMember';
 import { EnvironmentVariable } from './entity/EnvironmentVariable';
 import { Domain } from './entity/Domain';
+import { PROJECT_DOMAIN } from './constants';
 
 const log = debug('snowball:database');
 
+const nanoid = customAlphabet(lowercase + numbers, 8);
+
 // TODO: Fix order of methods
 export class Database {
   private dataSource: DataSource;
@@ -90,6 +95,7 @@ export class Database {
     const project = await projectRepository
       .createQueryBuilder('project')
       .leftJoinAndSelect('project.deployments', 'deployments', 'deployments.isCurrent = true')
+      .leftJoinAndSelect('deployments.createdBy', 'user')
       .leftJoinAndSelect('deployments.domain', 'domain')
       .leftJoinAndSelect('project.owner', 'owner')
       .leftJoinAndSelect('project.organization', 'organization')
@@ -314,7 +320,7 @@ export class Database {
 
   async updateDeploymentById (deploymentId: string, updates: DeepPartial<Deployment>): Promise<boolean> {
     const deploymentRepository = this.dataSource.getRepository(Deployment);
-    const updateResult = await deploymentRepository.update({ id: Number(deploymentId) }, updates);
+    const updateResult = await deploymentRepository.update({ id: deploymentId }, updates);
 
     if (updateResult.affected) {
       return updateResult.affected > 0;
@@ -341,6 +347,8 @@ export class Database {
       id: Number(projectDetails.organizationId)
     });
 
+    newProject.subDomain = `${newProject.name}.${PROJECT_DOMAIN}`;
+
     return projectRepository.save(newProject);
   }
 
@@ -364,14 +372,14 @@ export class Database {
         createdBy: true
       },
       where: {
-        id: Number(deploymentId)
+        id: deploymentId
       }
     });
 
     if (deployment === null) {
       throw new Error('Deployment not found');
     }
-    const { id, createdAt, updatedAt, ...updatedDeployment } = deployment;
+    const { createdAt, updatedAt, ...updatedDeployment } = deployment;
 
     if (updatedDeployment.environment === Environment.Production) {
       // TODO: Put isCurrent field in project
@@ -381,7 +389,10 @@ export class Database {
       });
     }
 
-    await deploymentRepository.update({ id: Number(deploymentId) }, { domain: null, isCurrent: false });
+    await deploymentRepository.update({ id: deploymentId }, { domain: null, isCurrent: false });
+
+    updatedDeployment.id = nanoid();
+    updatedDeployment.url = `${updatedDeployment.id}-${updatedDeployment.project.subDomain}`;
 
     return deploymentRepository.save(updatedDeployment);
   }
@@ -442,7 +453,7 @@ export class Database {
 
     const oldCurrentDeploymentUpdate = await deploymentRepository.update({ project: { id: projectId }, isCurrent: true }, { isCurrent: false, domain: null });
 
-    const newCurrentDeploymentUpdate = await deploymentRepository.update({ id: Number(deploymentId) }, { isCurrent: true, domain: oldCurrentDeployment?.domain });
+    const newCurrentDeploymentUpdate = await deploymentRepository.update({ id: deploymentId }, { isCurrent: true, domain: oldCurrentDeployment?.domain });
 
     if (oldCurrentDeploymentUpdate.affected && newCurrentDeploymentUpdate.affected) {
       return oldCurrentDeploymentUpdate.affected > 0 && newCurrentDeploymentUpdate.affected > 0;

packages/backend/src/entity/Deployment.ts

@@ -1,6 +1,6 @@
 import {
   Entity,
-  PrimaryGeneratedColumn,
+  PrimaryColumn,
   Column,
   CreateDateColumn,
   UpdateDateColumn,
@@ -27,8 +27,9 @@ enum Status {
 
 @Entity()
 export class Deployment {
-  @PrimaryGeneratedColumn()
-    id!: number;
+  // TODO: set custom generated id
+  @PrimaryColumn('varchar')
+    id!: string;
 
   @ManyToOne(() => Project, { onDelete: 'CASCADE' })
   @JoinColumn({ name: 'projectId' })
@@ -47,6 +48,9 @@ export class Deployment {
   @Column('varchar')
     title!: string;
 
+  @Column('varchar')
+    url!: string;
+
   @Column({
     enum: Environment
   })

packages/backend/src/entity/Project.ts

@@ -57,6 +57,9 @@ export class Project {
   @Column('varchar')
     icon!: string;
 
+  @Column('varchar')
+    subDomain!: string;
+
   @CreateDateColumn()
     createdAt!: Date;
 

packages/backend/src/schema.gql

@@ -72,6 +72,7 @@ type Project {
   updatedAt: String!
   organization: Organization!
   icon: String
+  subDomain: String
 }
 
 type ProjectMember {
@@ -89,6 +90,7 @@ type Deployment {
   branch: String!
   commitHash: String!
   title: String!
+  url: String!
   environment: Environment!
   isCurrent: Boolean!
   status: DeploymentStatus!

packages/backend/src/utils.ts

@@ -52,6 +52,7 @@ export const deploymentToGqlType = (dbDeployment: Deployment): any => {
     branch: dbDeployment.branch,
     commitHash: dbDeployment.commitHash,
     title: dbDeployment.title,
+    url: dbDeployment.url,
     environment: dbDeployment.environment,
     isCurrent: dbDeployment.isCurrent,
     status: dbDeployment.status,