Add project visibility feature

This commit introduces visibility setting for projects. It modifies the resolver to make visibility an optional input on project creation with a default set to 'INTERNAL'. It also adjusts the GraphQL schema to recognize the new visibility options and associates it with project entities.

backend/src/db/migrations/20231223000001-add-project-visibility.js

@@ -0,0 +1,16 @@
+'use strict';
+
+const TABLE_NAME = 'projects';
+const COLUMN_NAME = 'visibility';
+
+/** @type {import('sequelize-cli').Migration} */
+export default {
+  async up(queryInterface, Sequelize) {
+    await queryInterface.addColumn(TABLE_NAME, COLUMN_NAME, {
+      type: Sequelize.STRING,
+    });
+  },
+  async down(queryInterface, Sequelize) {
+    await queryInterface.removeColumn(TABLE_NAME, COLUMN_NAME);
+  },
+};

backend/src/db/models/project.js

@@ -24,6 +24,13 @@ export default (sequelize, DataTypes) => {
       status: {
         type: DataTypes.STRING,
       },
+      visibility: {
+        type: DataTypes.STRING,
+        defaultValue: 'internal',
+        validate: {
+          isIn: [['PRIVATE', 'INTERNAL', 'PUBLIC']],
+        },
+      },
       createdAt: {
         type: DataTypes.DATE,
         field: 'created_at',

backend/src/resolvers.js

@@ -312,35 +312,25 @@ const resolvers = {
       return { message: 'issue deleted', status: 'success' };
     },
     createProject: async (parent, { input }, { db }) => {
+      // TODO: we should do a sequelize transaction here
       const project = await db.sequelize.models.Project.create({
         name: input.name,
         key: input.key,
+        visibility: input.visibility ?? 'INTERNAL',
       });
 
-      // TODO: maybe promise all here?
+      const projectId = Number(project.id);
 
       // TODO: We should create mappings for these statuses
-      const issueStatuses = await db.sequelize.models.IssueStatuses.bulkCreate([
-        {
-          projectId: Number(project.id),
-          name: 'Backlog',
-        },
-        {
-          projectId: Number(project.id),
-          name: 'To Do',
-        },
-        {
-          projectId: Number(project.id),
-          name: 'In Progress',
-        },
-        {
-          projectId: Number(project.id),
-          name: 'Done',
-        },
-      ]);
+      const issueStatuses = await db.sequelize.models.IssueStatuses.bulkCreate(
+        ['Backlog', 'To Do', 'In Progress', 'Done'].map((name) => ({
+          projectId,
+          name,
+        }))
+      );
 
       const board = await db.sequelize.models.Board.create({
-        projectId: Number(project.id),
+        projectId,
         name: input?.boardName ?? 'default',
         style: input.boardStyle,
         viewState: issueStatuses.map((is) => ({

backend/src/type-defs.js

@@ -6,6 +6,12 @@ const typeDefs = gql`
   # in the resolver map below.
   scalar Upload
 
+  enum ProjectVisibility {
+    PUBLIC
+    INTERNAL
+    PRIVATE
+  }
+
   enum Order {
     ASC
     DESC
@@ -61,6 +67,7 @@ const typeDefs = gql`
     description: String
     imageId: Int
     status: String
+    visibility: ProjectVisibility
     createdAt: String
     updatedAt: String
     boards: [Board]
@@ -159,6 +166,7 @@ const typeDefs = gql`
     name: String!
     key: String!
     description: String
+    visibility: ProjectVisibility
     boardName: String!
     boardStyle: BoardStyle!
   }

frontend/components/ProjectList/index.tsx

@@ -11,7 +11,15 @@ import { useQuery } from '@apollo/client';
 import { GET_PROJECTS } from '@/gql/gql-queries-mutations';
 import { GetProjectsQuery, Project } from '@/gql/__generated__/graphql';
 
-const cols = ['ID', 'Name', 'Key', 'Board Style', 'Description', ''];
+const cols = [
+  'ID',
+  'Name',
+  'Key',
+  'Board Style',
+  'Visibility',
+  'Description',
+  '',
+];
 
 // TODO: Make this its own component?
 const ProjectOptionsDropdown = () => {
@@ -205,6 +213,9 @@ const ProjectList = () => {
                         ? project?.boards?.[0].style
                         : 'Kanban'}
                     </td>
+                    <td className='whitespace-nowrap px-3 py-1'>
+                      {project?.visibility}
+                    </td>
                     <td className='whitespace-nowrap px-3 py-1'>
                       {project?.description}
                     </td>