Yadciel/taskcafe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: change url structure to use short ids instead of full uuids

Browse Source
This commit is contained in:
Jordan Knott
2021-11-04 13:36:46 -05:00
parent f9a5007104
commit df6140a10f
32 changed files with 613 additions and 289 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/App/Routes.tsx
View File

@ -70,11 +70,10 @@ const Routes: React.FC = () => {
<Route exact path="/confirm" component={Confirm} />
<Switch>
<MainContent>
<Route path="/projects/:projectID" component={Project} />
<Route path="/p/:projectID" component={Project} />
<UserRequiredRoute>
<Route exact path="/" component={Dashboard} />
<Route exact path="/projects" component={Projects} />
<Route exact path="/" component={Projects} />
<Route path="/teams/:teamID" component={Teams} />
<Route path="/profile" component={Profile} />
<Route path="/admin" component={Admin} />

3
frontend/src/Projects/Project/Board/index.tsx
View File

@ -429,6 +429,7 @@ const ProjectBoard: React.FC<ProjectBoardProps> = ({ projectID, onCardLabelClick
createTask: {
__typename: 'Task',
id: `${Math.round(Math.random() * -1000000)}`,
shortId: '',
name,
watched: false,
complete: false,
@ -605,7 +606,7 @@ const ProjectBoard: React.FC<ProjectBoardProps> = ({ projectID, onCardLabelClick
<SimpleLists
isPublic={user === null}
onTaskClick={(task) => {
history.push(`${match.url}/c/${task.id}`);
history.push(`${match.url}/c/${task.shortId}`);
}}
onCardLabelClick={onCardLabelClick ?? NOOP}
cardLabelVariant={cardLabelVariant ?? 'large'}

22
frontend/src/Projects/Project/index.tsx
View File

@ -87,7 +87,7 @@ const Project = () => {
}
}
}),
{ projectID },
{ projectID: data ? data.findProject.id : '' },
),
});
@ -100,7 +100,7 @@ const Project = () => {
produce(cache, (draftCache) => {
draftCache.findProject.name = newName.data?.updateProjectName.name ?? '';
}),
{ projectID },
{ projectID: data ? data.findProject.id : '' },
);
},
});
@ -123,7 +123,7 @@ const Project = () => {
];
}
}),
{ projectID },
{ projectID: data ? data.findProject.id : '' },
);
},
});
@ -138,7 +138,7 @@ const Project = () => {
(m) => m.email !== response.data?.deleteInvitedProjectMember.invitedMember.email ?? '',
);
}),
{ projectID },
{ projectID: data ? data.findProject.id : '' },
);
},
});
@ -153,7 +153,7 @@ const Project = () => {
(m) => m.id !== response.data?.deleteProjectMember.member.id,
);
}),
{ projectID },
{ projectID: data ? data.findProject.id : '' },
);
},
});
@ -171,29 +171,29 @@ const Project = () => {
<>
<GlobalTopNavbar
onChangeRole={(userID, roleCode) => {
updateProjectMemberRole({ variables: { userID, roleCode, projectID } });
updateProjectMemberRole({ variables: { userID, roleCode, projectID: data ? data.findProject.id : '' } });
}}
onChangeProjectOwner={() => {
hidePopup();
}}
onRemoveFromBoard={(userID) => {
deleteProjectMember({ variables: { userID, projectID } });
deleteProjectMember({ variables: { userID, projectID: data ? data.findProject.id : '' } });
hidePopup();
}}
onRemoveInvitedFromBoard={(email) => {
deleteInvitedProjectMember({ variables: { projectID, email } });
deleteInvitedProjectMember({ variables: { projectID: data ? data.findProject.id : '', email } });
hidePopup();
}}
onSaveProjectName={(projectName) => {
updateProjectName({ variables: { projectID, name: projectName } });
updateProjectName({ variables: { projectID: data ? data.findProject.id : '', name: projectName } });
}}
onInviteUser={($target) => {
showPopup(
$target,
<UserManagementPopup
projectID={projectID}
projectID={data ? data.findProject.id : ''}
onInviteProjectMembers={(members) => {
inviteProjectMembers({ variables: { projectID, members } });
inviteProjectMembers({ variables: { projectID: data ? data.findProject.id : '', members } });
hidePopup();
}}
users={data.users}

4
frontend/src/Projects/index.tsx
View File

@ -307,7 +307,7 @@ const Projects = () => {
<ProjectList>
{personalProjects.map((project, idx) => (
<ProjectListItem key={project.id}>
<ProjectTile color={colors[idx % 5]} to={`/projects/${project.id}`}>
<ProjectTile color={colors[idx % 5]} to={`/p/${project.shortId}`}>
<ProjectTileFade />
<ProjectTileDetails>
<ProjectTileName>{project.name}</ProjectTileName>
@ -351,7 +351,7 @@ const Projects = () => {
<ProjectList>
{team.projects.map((project, idx) => (
<ProjectListItem key={project.id}>
<ProjectTile color={colors[idx % 5]} to={`/projects/${project.id}`}>
<ProjectTile color={colors[idx % 5]} to={`/p/${project.shortId}`}>
<ProjectTileFade />
<ProjectTileDetails>
<ProjectTileName>{project.name}</ProjectTileName>

2
frontend/src/shared/components/NotifcationPopup/index.tsx
View File

@ -331,7 +331,7 @@ const Notification: React.FC<NotificationProps> = ({ causedBy, createdAt, data,
prefix.push(<UserCircle width={14} height={16} />);
prefix.push(<NotificationPrefix>Assigned </NotificationPrefix>);
prefix.push(<span>you to the task "{dataMap.get('TaskName')}"</span>);
link = `/projects/${dataMap.get('ProjectID')}/board/c/${dataMap.get('TaskID')}`;
link = `/p/${dataMap.get('ProjectID')}/board/c/${dataMap.get('TaskID')}`;
break;
default:
throw new Error('unknown action type');

38
frontend/src/shared/generated/graphql.tsx
View File

@ -278,11 +278,13 @@ export type DuplicateTaskGroupPayload = {
};
export type FindProject = {
projectID: Scalars['UUID'];
projectID?: Maybe<Scalars['UUID']>;
projectShortID?: Maybe<Scalars['String']>;
};
export type FindTask = {
taskID: Scalars['UUID'];
taskID?: Maybe<Scalars['UUID']>;
taskShortID?: Maybe<Scalars['String']>;
};
export type FindTeam = {
@ -908,6 +910,7 @@ export type ProfileIcon = {
export type Project = {
__typename?: 'Project';
id: Scalars['ID'];
shortId: Scalars['String'];
createdAt: Scalars['Time'];
name: Scalars['String'];
team?: Maybe<Team>;
@ -1068,6 +1071,7 @@ export type Subscription = {
export type Task = {
__typename?: 'Task';
id: Scalars['ID'];
shortId: Scalars['String'];
taskGroup: TaskGroup;
createdAt: Scalars['Time'];
name: Scalars['String'];
@ -1419,7 +1423,7 @@ export type CreateProjectMutation = (
{ __typename?: 'Mutation' }
& { createProject: (
{ __typename?: 'Project' }
& Pick<Project, 'id' | 'name'>
& Pick<Project, 'id' | 'shortId' | 'name'>
& { team?: Maybe<(
{ __typename?: 'Team' }
& Pick<Team, 'id' | 'name'>
@ -1509,7 +1513,7 @@ export type DeleteTaskGroupMutation = (
);
export type FindProjectQueryVariables = Exact<{
projectID: Scalars['UUID'];
projectID: Scalars['String'];
}>;
@ -1517,7 +1521,7 @@ export type FindProjectQuery = (
{ __typename?: 'Query' }
& { findProject: (
{ __typename?: 'Project' }
& Pick<Project, 'name' | 'publicOn'>
& Pick<Project, 'id' | 'name' | 'publicOn'>
& { team?: Maybe<(
{ __typename?: 'Team' }
& Pick<Team, 'id'>
@ -1584,7 +1588,7 @@ export type FindProjectQuery = (
);
export type FindTaskQueryVariables = Exact<{
taskID: Scalars['UUID'];
taskID: Scalars['String'];
}>;
@ -1592,7 +1596,7 @@ export type FindTaskQuery = (
{ __typename?: 'Query' }
& { findTask: (
{ __typename?: 'Task' }
& Pick<Task, 'id' | 'name' | 'watched' | 'description' | 'dueDate' | 'position' | 'complete' | 'hasTime'>
& Pick<Task, 'id' | 'shortId' | 'name' | 'watched' | 'description' | 'dueDate' | 'position' | 'complete' | 'hasTime'>
& { taskGroup: (
{ __typename?: 'TaskGroup' }
& Pick<TaskGroup, 'id' | 'name'>
@ -1668,7 +1672,7 @@ export type FindTaskQuery = (
export type TaskFieldsFragment = (
{ __typename?: 'Task' }
& Pick<Task, 'id' | 'name' | 'description' | 'dueDate' | 'hasTime' | 'complete' | 'watched' | 'completedAt' | 'position'>
& Pick<Task, 'id' | 'shortId' | 'name' | 'description' | 'dueDate' | 'hasTime' | 'complete' | 'watched' | 'completedAt' | 'position'>
& { badges: (
{ __typename?: 'TaskBadges' }
& { checklist?: Maybe<(
@ -1715,7 +1719,7 @@ export type GetProjectsQuery = (
& Pick<Team, 'id' | 'name' | 'createdAt'>
)>, projects: Array<(
{ __typename?: 'Project' }
& Pick<Project, 'id' | 'name'>
& Pick<Project, 'id' | 'shortId' | 'name'>
& { team?: Maybe<(
{ __typename?: 'Team' }
& Pick<Team, 'id' | 'name'>
@ -1785,7 +1789,7 @@ export type MyTasksQuery = (
{ __typename?: 'MyTasksPayload' }
& { tasks: Array<(
{ __typename?: 'Task' }
& Pick<Task, 'id' | 'name' | 'dueDate' | 'hasTime' | 'complete' | 'completedAt'>
& Pick<Task, 'id' | 'shortId' | 'name' | 'dueDate' | 'hasTime' | 'complete' | 'completedAt'>
& { taskGroup: (
{ __typename?: 'TaskGroup' }
& Pick<TaskGroup, 'id' | 'name'>
@ -2859,6 +2863,7 @@ export type UsersQuery = (
export const TaskFieldsFragmentDoc = gql`
fragment TaskFields on Task {
id
shortId
name
description
dueDate
@ -2988,6 +2993,7 @@ export const CreateProjectDocument = gql`
mutation createProject($teamID: UUID, $name: String!) {
createProject(input: {teamID: $teamID, name: $name}) {
id
shortId
name
team {
id
@ -3215,8 +3221,9 @@ export type DeleteTaskGroupMutationHookResult = ReturnType<typeof useDeleteTaskG
export type DeleteTaskGroupMutationResult = Apollo.MutationResult<DeleteTaskGroupMutation>;
export type DeleteTaskGroupMutationOptions = Apollo.BaseMutationOptions<DeleteTaskGroupMutation, DeleteTaskGroupMutationVariables>;
export const FindProjectDocument = gql`
query findProject($projectID: UUID!) {
findProject(input: {projectID: $projectID}) {
query findProject($projectID: String!) {
findProject(input: {projectShortID: $projectID}) {
id
name
publicOn
team {
@ -3332,9 +3339,10 @@ export type FindProjectQueryHookResult = ReturnType<typeof useFindProjectQuery>;
export type FindProjectLazyQueryHookResult = ReturnType<typeof useFindProjectLazyQuery>;
export type FindProjectQueryResult = Apollo.QueryResult<FindProjectQuery, FindProjectQueryVariables>;
export const FindTaskDocument = gql`
query findTask($taskID: UUID!) {
findTask(input: {taskID: $taskID}) {
query findTask($taskID: String!) {
findTask(input: {taskShortID: $taskID}) {
id
shortId
name
watched
description
@ -3477,6 +3485,7 @@ export const GetProjectsDocument = gql`
}
projects {
id
shortId
name
team {
id
@ -3625,6 +3634,7 @@ export const MyTasksDocument = gql`
myTasks(input: {status: $status, sort: $sort}) {
tasks {
id
shortId
taskGroup {
id
name

1
frontend/src/shared/graphql/createProject.graphqls
View File

@ -1,6 +1,7 @@
mutation createProject($teamID: UUID, $name: String!) {
createProject(input: {teamID: $teamID, name: $name}) {
id
shortId
name
team {
id

5
frontend/src/shared/graphql/findProject.ts
View File

@ -2,8 +2,9 @@ import gql from 'graphql-tag';
import TASK_FRAGMENT from './fragments/task';
const FIND_PROJECT_QUERY = gql`
query findProject($projectID: UUID!) {
findProject(input: { projectID: $projectID }) {
query findProject($projectID: String!) {
findProject(input: { projectShortID: $projectID }) {
id
name
publicOn
team {

5
frontend/src/shared/graphql/findTask.graphqls
View File

@ -1,6 +1,7 @@
query findTask($taskID: UUID!) {
findTask(input: {taskID: $taskID}) {
query findTask($taskID: String!) {
findTask(input: {taskShortID: $taskID}) {
id
shortId
name
watched
description

1
frontend/src/shared/graphql/fragments/task.ts
View File

@ -3,6 +3,7 @@ import gql from 'graphql-tag';
const TASK_FRAGMENT = gql`
fragment TaskFields on Task {
id
shortId
name
description
dueDate

1
frontend/src/shared/graphql/getProjects.graphqls
View File

@ -10,6 +10,7 @@ query getProjects {
}
projects {
id
shortId
name
team {
id

1
frontend/src/shared/graphql/myTasks.graphqls
View File

@ -6,6 +6,7 @@ query myTasks($status: MyTasksStatus!, $sort: MyTasksSort!) {
myTasks(input: { status: $status, sort: $sort }) {
tasks {
id
shortId
taskGroup {
id
name

1
frontend/src/types.d.ts vendored
View File

@ -103,6 +103,7 @@ type TaskComment = {
type Task = {
id: string;
shortId: string;
taskGroup: InnerTaskGroup;
name: string;
watched?: boolean;