mirror of
https://github.com/rjNemo/ticket_manager
synced 2026-06-06 00:36:39 +00:00
pull signin
This commit is contained in:
commit
1f76be84e8
99 changed files with 999 additions and 792 deletions
|
|
@ -13,7 +13,7 @@ using TicketManager.Resources;
|
|||
|
||||
namespace TicketManager.Controllers
|
||||
{
|
||||
// [Authorize]
|
||||
[Authorize]
|
||||
[Produces("application/json")]
|
||||
[Route("api/v1/users")]
|
||||
[ApiController]
|
||||
|
|
@ -64,7 +64,7 @@ namespace TicketManager.Controllers
|
|||
[HttpGet("{id}")]
|
||||
[ProducesResponseType(StatusCodes.Status200OK)]
|
||||
[ProducesResponseType(StatusCodes.Status404NotFound)]
|
||||
public async Task<ActionResult<AppUserDTO>> GetUser(Guid id)
|
||||
public async Task<ActionResult<AppUserDTO>> GetUser(string id)
|
||||
{
|
||||
var user = await _context.AppUsers
|
||||
.Include(u => u.Assignments)
|
||||
|
|
@ -103,7 +103,7 @@ namespace TicketManager.Controllers
|
|||
[HttpPut("{id}")]
|
||||
[ProducesResponseType(StatusCodes.Status204NoContent)]
|
||||
[ProducesResponseType(StatusCodes.Status404NotFound)]
|
||||
public async Task<IActionResult> PutUser(Guid id, AppUser user)
|
||||
public async Task<IActionResult> PutUser(string id, AppUser user)
|
||||
{
|
||||
if (id != user.Id)
|
||||
{
|
||||
|
|
@ -159,6 +159,7 @@ namespace TicketManager.Controllers
|
|||
|
||||
var user = new AppUser()
|
||||
{
|
||||
Id = userDto.Id,
|
||||
FirstName = userDto.FirstName,
|
||||
LastName = userDto.LastName,
|
||||
Presentation = userDto.Presentation,
|
||||
|
|
@ -202,7 +203,7 @@ namespace TicketManager.Controllers
|
|||
}
|
||||
|
||||
[HttpGet("{id}/projects")]
|
||||
public async Task<ActionResult<IEnumerable<ProjectDTORead>>> GetAppUserProjects(Guid id)
|
||||
public async Task<ActionResult<IEnumerable<ProjectDTORequest>>> GetAppUserProjects(string id)
|
||||
{
|
||||
var user = await _context.AppUsers
|
||||
.Include(u => u.Assignments)
|
||||
|
|
@ -218,7 +219,7 @@ namespace TicketManager.Controllers
|
|||
}
|
||||
|
||||
[HttpGet("{id}/tickets/")]
|
||||
public async Task<ActionResult<IEnumerable<TicketDTORead>>> GetAppUserTickets(Guid id)
|
||||
public async Task<ActionResult<IEnumerable<TicketDTORead>>> GetAppUserTickets(string id)
|
||||
{
|
||||
var user = await _context.AppUsers
|
||||
.Include(u => u.Assignments)
|
||||
|
|
@ -233,7 +234,7 @@ namespace TicketManager.Controllers
|
|||
return user.GetTickets().Select(t => new TicketDTORead(t)).ToList();
|
||||
}
|
||||
|
||||
private bool UserExists(Guid id)
|
||||
private bool UserExists(string id)
|
||||
{
|
||||
return _context.AppUsers.Any(e => e.Id == id);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ using System;
|
|||
namespace TicketManager.Controllers
|
||||
{
|
||||
// [Authorize(Roles = "Admin")]
|
||||
// [Authorize]
|
||||
[Authorize]
|
||||
[Produces("application/json")]
|
||||
[Route("api/v1/[controller]")]
|
||||
[ApiController]
|
||||
|
|
@ -180,11 +180,15 @@ namespace TicketManager.Controllers
|
|||
EndingDate = projectDto.EndingDate,
|
||||
Manager = await _context.AppUsers.FindAsync(projectDto.ManagerId)
|
||||
};
|
||||
// project.LogAction(
|
||||
// $"{project.Title} has been created by {project.Manager.FullName}.",
|
||||
// ActivityType.StartTask);
|
||||
|
||||
_context.Projects.Add(project);
|
||||
_context.Assignments.Add(new Assignment()
|
||||
{
|
||||
Project = project,
|
||||
ProjectId = project.Id,
|
||||
User = project.Manager,
|
||||
UserId = project.Manager.Id
|
||||
});
|
||||
await _context.SaveChangesAsync();
|
||||
var dto = new ProjectDTO(project);
|
||||
return CreatedAtAction("GetProject", new { id = project.Id }, dto);
|
||||
|
|
@ -271,7 +275,7 @@ namespace TicketManager.Controllers
|
|||
[HttpPatch("{id}/members")]
|
||||
public async Task<ActionResult<Project>> SetProjectMembers(
|
||||
[FromRoute] int id,
|
||||
[FromBody] Guid[] membersId)
|
||||
[FromBody] string[] membersId)
|
||||
{
|
||||
Project project = await _context.Projects
|
||||
.Include(p => p.Assignments)
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ using TicketManager.Models;
|
|||
|
||||
namespace TicketManager.Controllers
|
||||
{
|
||||
// [Authorize]
|
||||
[Authorize]
|
||||
[Route("api/v1/[controller]")]
|
||||
[ApiController]
|
||||
public class TicketsController : ControllerBase
|
||||
|
|
@ -105,6 +105,9 @@ namespace TicketManager.Controllers
|
|||
Description = ticketDto.Description,
|
||||
EndingDate = ticketDto.EndingDate,
|
||||
CreatorId = ticketDto.CreatorId,
|
||||
Category = (Category)ticketDto.Category,
|
||||
Impact = (Impact)ticketDto.Impact,
|
||||
Difficulty = (Difficulty)ticketDto.Difficulty,
|
||||
Project = await _context.Projects.FindAsync(ticketDto.ProjectId)
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ namespace TicketManager.Models
|
|||
{
|
||||
public class AppUser
|
||||
{
|
||||
public Guid Id { get; set; }
|
||||
public string Id { get; set; }
|
||||
|
||||
[Required]
|
||||
[StringLength(50)]
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ namespace TicketManager.Models
|
|||
public class Assignment
|
||||
{
|
||||
public AppUser User { get; set; }
|
||||
public Guid UserId { get; set; }
|
||||
public string UserId { get; set; }
|
||||
public Project Project { get; set; }
|
||||
public int ProjectId { get; set; }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ namespace TicketManager.Models
|
|||
public Impact Impact { get; set; } = Impact.Undefined;
|
||||
public Difficulty Difficulty { get; set; } = Difficulty.Undefined;
|
||||
public Category Category { get; set; } = Category.Undefined;
|
||||
public Guid CreatorId { get; set; }
|
||||
public string CreatorId { get; set; }
|
||||
|
||||
[Display(Name = "Project")]
|
||||
public Project Project { get; set; }
|
||||
|
|
|
|||
|
|
@ -60,3 +60,6 @@
|
|||
- [ ] Query progression info in UserPage
|
||||
- [x] Add info fields in New Ticket Form
|
||||
- [ ] Filter users in Users Modal
|
||||
- [ ] EditForms for Project and Ticket
|
||||
- [ ] Admin Page
|
||||
- [ ] Use auth0 user info to create appUser account
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ namespace TicketManager.Resources
|
|||
Tickets = user.GetTickets().Select(u => new TicketDTORead(u)).ToList();
|
||||
}
|
||||
|
||||
public Guid Id { get; set; }
|
||||
public string Id { get; set; }
|
||||
|
||||
public string FirstName { get; set; }
|
||||
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ namespace TicketManager.Resources
|
|||
Picture = user.Picture;
|
||||
}
|
||||
|
||||
public Guid Id { get; set; }
|
||||
public string Id { get; set; }
|
||||
|
||||
public string FirstName { get; set; }
|
||||
|
||||
|
|
|
|||
|
|
@ -4,6 +4,8 @@ namespace TicketManager.Resources
|
|||
{
|
||||
public class NewAppUserDTO
|
||||
{
|
||||
public string Id { get; set; }
|
||||
|
||||
[Required]
|
||||
public string FirstName { get; set; }
|
||||
public string LastName { get; set; }
|
||||
|
|
|
|||
|
|
@ -11,6 +11,6 @@ namespace TicketManager.Resources
|
|||
[Required]
|
||||
public DateTime EndingDate { get; set; }
|
||||
[Required]
|
||||
public Guid ManagerId { get; set; }
|
||||
public string ManagerId { get; set; }
|
||||
}
|
||||
}
|
||||
|
|
@ -16,13 +16,13 @@ namespace TicketManager.Resources
|
|||
[DataType(DataType.Date)]
|
||||
public DateTime EndingDate { get; set; }
|
||||
|
||||
public string Impact { get; set; }
|
||||
public int Impact { get; set; }
|
||||
|
||||
public string Difficulty { get; set; }
|
||||
public int Difficulty { get; set; }
|
||||
|
||||
public string Category { get; set; }
|
||||
public int Category { get; set; }
|
||||
[Required]
|
||||
public Guid CreatorId { get; set; }
|
||||
public string CreatorId { get; set; }
|
||||
[Required]
|
||||
public int ProjectId { get; set; }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ namespace TicketManager.Resources
|
|||
|
||||
public string Category { get; set; }
|
||||
|
||||
public Guid CreatorId { get; set; }
|
||||
public string CreatorId { get; set; }
|
||||
|
||||
public ProjectDTORead Project { get; set; }
|
||||
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ namespace TicketManager.Resources
|
|||
|
||||
public string Category { get; set; }
|
||||
|
||||
public Guid CreatorId { get; set; }
|
||||
public string CreatorId { get; set; }
|
||||
public List<Note> Notes { get; set; } = new List<Note>();
|
||||
|
||||
public List<File> Files { get; set; } = new List<File>();
|
||||
|
|
|
|||
BIN
app.db
BIN
app.db
Binary file not shown.
85
client/package-lock.json
generated
85
client/package-lock.json
generated
|
|
@ -1288,22 +1288,35 @@
|
|||
}
|
||||
},
|
||||
"@material-ui/core": {
|
||||
"version": "4.9.8",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.9.8.tgz",
|
||||
"integrity": "sha512-4cslpG6oLoPWUfwPkX+hvbak4hAGiOfgXOu/UIYeeMrtsTEebC0Mirjoby7zhS4ny86YI3rXEFW6EZDmlj5n5w==",
|
||||
"version": "4.9.13",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.9.13.tgz",
|
||||
"integrity": "sha512-GEXNwUr+laZ0N+F1efmHB64Fyg+uQIRXLqbSejg3ebSXgLYNpIjnMOPRfWdu4rICq0dAIgvvNXGkKDMcf3AMpA==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.4.4",
|
||||
"@material-ui/styles": "^4.9.6",
|
||||
"@material-ui/system": "^4.9.6",
|
||||
"@material-ui/types": "^5.0.0",
|
||||
"@material-ui/utils": "^4.9.6",
|
||||
"@material-ui/react-transition-group": "^4.3.0",
|
||||
"@material-ui/styles": "^4.9.13",
|
||||
"@material-ui/system": "^4.9.13",
|
||||
"@material-ui/types": "^5.0.1",
|
||||
"@material-ui/utils": "^4.9.12",
|
||||
"@types/react-transition-group": "^4.2.0",
|
||||
"clsx": "^1.0.2",
|
||||
"clsx": "^1.0.4",
|
||||
"hoist-non-react-statics": "^3.3.2",
|
||||
"popper.js": "^1.14.1",
|
||||
"popper.js": "^1.16.1-lts",
|
||||
"prop-types": "^15.7.2",
|
||||
"react-is": "^16.8.0",
|
||||
"react-transition-group": "^4.3.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@material-ui/utils": {
|
||||
"version": "4.9.12",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.9.12.tgz",
|
||||
"integrity": "sha512-/0rgZPEOcZq5CFA4+4n6Q6zk7fi8skHhH2Bcra8R3epoJEYy5PL55LuMazPtPH1oKeRausDV/Omz4BbgFsn1HQ==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.4.4",
|
||||
"prop-types": "^15.7.2",
|
||||
"react-is": "^16.8.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"@material-ui/icons": {
|
||||
|
|
@ -1326,16 +1339,27 @@
|
|||
"react-is": "^16.8.0"
|
||||
}
|
||||
},
|
||||
"@material-ui/react-transition-group": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/react-transition-group/-/react-transition-group-4.3.0.tgz",
|
||||
"integrity": "sha512-CwQ0aXrlUynUTY6sh3UvKuvye1o92en20VGAs6TORnSxUYeRmkX8YeTUN3lAkGiBX1z222FxLFO36WWh6q73rQ==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"dom-helpers": "^5.0.1",
|
||||
"loose-envify": "^1.4.0",
|
||||
"prop-types": "^15.6.2"
|
||||
}
|
||||
},
|
||||
"@material-ui/styles": {
|
||||
"version": "4.9.6",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.9.6.tgz",
|
||||
"integrity": "sha512-ijgwStEkw1OZ6gCz18hkjycpr/3lKs1hYPi88O/AUn4vMuuGEGAIrqKVFq/lADmZUNF3DOFIk8LDkp7zmjPxtA==",
|
||||
"version": "4.9.13",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.9.13.tgz",
|
||||
"integrity": "sha512-lWlXJanBdHQ18jW/yphedRokHcvZD1GdGzUF/wQxKDsHwDDfO45ZkAxuSBI202dG+r1Ph483Z3pFykO2obeSRA==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.4.4",
|
||||
"@emotion/hash": "^0.8.0",
|
||||
"@material-ui/types": "^5.0.0",
|
||||
"@material-ui/types": "^5.0.1",
|
||||
"@material-ui/utils": "^4.9.6",
|
||||
"clsx": "^1.0.2",
|
||||
"clsx": "^1.0.4",
|
||||
"csstype": "^2.5.2",
|
||||
"hoist-non-react-statics": "^3.3.2",
|
||||
"jss": "^10.0.3",
|
||||
|
|
@ -1350,9 +1374,9 @@
|
|||
}
|
||||
},
|
||||
"@material-ui/system": {
|
||||
"version": "4.9.6",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.9.6.tgz",
|
||||
"integrity": "sha512-QtfoAePyqXoZ2HUVSwGb1Ro0kucMCvVjbI0CdYIR21t0Opgfm1Oer6ni9P5lfeXA39xSt0wCierw37j+YES48Q==",
|
||||
"version": "4.9.13",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.9.13.tgz",
|
||||
"integrity": "sha512-6AlpvdW6KJJ5bF1Xo2OD13sCN8k+nlL36412/bWnWZOKIfIMo/Lb8c8d1DOIaT/RKWxTEUaWnKZjabVnA3eZjA==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.4.4",
|
||||
"@material-ui/utils": "^4.9.6",
|
||||
|
|
@ -1360,9 +1384,9 @@
|
|||
}
|
||||
},
|
||||
"@material-ui/types": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.0.0.tgz",
|
||||
"integrity": "sha512-UeH2BuKkwDndtMSS0qgx1kCzSMw+ydtj0xx/XbFtxNSTlXydKwzs5gVW5ZKsFlAkwoOOQ9TIsyoCC8hq18tOwg=="
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.0.1.tgz",
|
||||
"integrity": "sha512-wURPSY7/3+MAtng3i26g+WKwwNE3HEeqa/trDBR5+zWKmcjO+u9t7Npu/J1r+3dmIa/OeziN9D/18IrBKvKffw=="
|
||||
},
|
||||
"@material-ui/utils": {
|
||||
"version": "4.9.6",
|
||||
|
|
@ -3779,11 +3803,11 @@
|
|||
"integrity": "sha1-2bkoGtz9jO2TW9urqDeGiX9k6ZY="
|
||||
},
|
||||
"css-vendor": {
|
||||
"version": "2.0.7",
|
||||
"resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.7.tgz",
|
||||
"integrity": "sha512-VS9Rjt79+p7M0WkPqcAza4Yq1ZHrsHrwf7hPL/bjQB+c1lwmAI+1FXxYTYt818D/50fFVflw0XKleiBN5RITkg==",
|
||||
"version": "2.0.8",
|
||||
"resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.8.tgz",
|
||||
"integrity": "sha512-x9Aq0XTInxrkuFeHKbYC7zWY8ai7qJ04Kxd9MnvbC1uO5DagxoHQjm4JvG+vCdXOoFtCjbL2XSZfxmoYa9uQVQ==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.6.2",
|
||||
"@babel/runtime": "^7.8.3",
|
||||
"is-in-browser": "^1.0.2"
|
||||
}
|
||||
},
|
||||
|
|
@ -4223,9 +4247,9 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@babel/runtime": {
|
||||
"version": "7.9.2",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.9.2.tgz",
|
||||
"integrity": "sha512-NE2DtOdufG7R5vnfQUTehdTfNycfUANEtCa9PssN9O/xmTzP4E08UI797ixaei6hBEVL9BI/PsdJS5x7mWoB9Q==",
|
||||
"version": "7.9.6",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.9.6.tgz",
|
||||
"integrity": "sha512-64AF1xY3OAkFHqOb9s4jpgk1Mm5vDZ4L3acHvAml+53nO1XbXLuDodsVpO4OIUsmemlUHMxNdYMNJmsvOwLrvQ==",
|
||||
"requires": {
|
||||
"regenerator-runtime": "^0.13.4"
|
||||
}
|
||||
|
|
@ -12926,9 +12950,10 @@
|
|||
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
|
||||
},
|
||||
"typescript": {
|
||||
"version": "3.7.5",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.7.5.tgz",
|
||||
"integrity": "sha512-/P5lkRXkWHNAbcJIiHPfRoKqyd7bsyCma1hZNUGfn20qm64T6ZBlrzprymeu918H+mB/0rIg2gGK/BXkhhYgBw=="
|
||||
"version": "3.8.3",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.8.3.tgz",
|
||||
"integrity": "sha512-MYlEfn5VrLNsgudQTVJeNaQFUAI7DkhnOjdpAp4T+ku1TfQClewlbSuTVHiA+8skNBgaf02TL/kLOvig4y3G8w==",
|
||||
"dev": true
|
||||
},
|
||||
"underscore": {
|
||||
"version": "1.9.2",
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
"private": true,
|
||||
"dependencies": {
|
||||
"@auth0/auth0-spa-js": "^1.6.4",
|
||||
"@material-ui/core": "^4.9.8",
|
||||
"@material-ui/core": "^4.9.13",
|
||||
"@material-ui/icons": "^4.9.1",
|
||||
"@material-ui/lab": "^4.0.0-alpha.47",
|
||||
"@testing-library/jest-dom": "^4.2.4",
|
||||
|
|
@ -24,7 +24,7 @@
|
|||
"react-router-dom": "^5.1.2",
|
||||
"react-scripts": "3.3.1",
|
||||
"react-swipeable-views": "^0.13.9",
|
||||
"typescript": "^3.7.5",
|
||||
"typescript": "^3.8.3",
|
||||
"underscore": "^1.9.2"
|
||||
},
|
||||
"scripts": {
|
||||
|
|
|
|||
|
|
@ -11,12 +11,6 @@
|
|||
/>
|
||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
|
||||
<!-- <link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css"
|
||||
/>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script> -->
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"short_name": "React App",
|
||||
"name": "Create React App Sample",
|
||||
"short_name": "BugBuster",
|
||||
"name": "BugBuster | Project Management",
|
||||
"icons": [
|
||||
{
|
||||
"src": "favicon.ico",
|
||||
|
|
|
|||
|
|
@ -1,9 +0,0 @@
|
|||
import React from 'react';
|
||||
import { render } from '@testing-library/react';
|
||||
import App from './App';
|
||||
|
||||
test('renders learn react link', () => {
|
||||
const { getByText } = render(<App />);
|
||||
const linkElement = getByText(/learn react/i);
|
||||
expect(linkElement).toBeInTheDocument();
|
||||
});
|
||||
|
|
@ -1,21 +1,17 @@
|
|||
import React from "react";
|
||||
import { Router } from "react-router-dom";
|
||||
import { useAuth0 } from "./authentication/auth0";
|
||||
import * as createHistory from "history";
|
||||
// import history from "./utils/history";
|
||||
import MainLayout from "./layouts/MainLayout";
|
||||
import { AppRouter } from "./utils/router";
|
||||
|
||||
export const history = createHistory.createBrowserHistory();
|
||||
import AppRouter from "./routes/AppRouter";
|
||||
import history from "./utils/history";
|
||||
import Preloader from "./components/Preloader";
|
||||
|
||||
export default function App() {
|
||||
const { loading } = useAuth0();
|
||||
|
||||
if (loading) {
|
||||
return <div>Loading...</div>;
|
||||
}
|
||||
|
||||
return (
|
||||
return loading ? (
|
||||
<Preloader />
|
||||
) : (
|
||||
<Router history={history}>
|
||||
<MainLayout>
|
||||
<AppRouter />
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
import { Ticket } from "../types/Ticket";
|
||||
import { Project } from "../types/Project";
|
||||
import { AppFile } from "../types/AppFile";
|
||||
import { Activity } from "../types/Activity";
|
||||
import { User } from "../types/User";
|
||||
import { getRemainingdays } from "../utils/methods";
|
||||
import Activity from "../types/Activity";
|
||||
import AppFile from "../types/AppFile";
|
||||
import Project from "../types/Project";
|
||||
import Ticket from "../types/Ticket";
|
||||
import User from "../types/User";
|
||||
import getRemainingdays from "../utils/methods";
|
||||
|
||||
export default class ProjectVM {
|
||||
public id: number;
|
||||
|
|
@ -47,7 +47,7 @@ export default class ProjectVM {
|
|||
this.ticketsDone =
|
||||
this.tickets === undefined
|
||||
? 0
|
||||
: this.tickets.filter(t => t.status === "Done").length;
|
||||
: this.tickets.filter((t) => t.status === "Done").length;
|
||||
this.remainingDays = getRemainingdays(project.endingDate);
|
||||
this.allProjects = allProjects;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
import { Ticket } from "../types/Ticket";
|
||||
import { Project } from "../types/Project";
|
||||
import { User } from "../types/User";
|
||||
import Project from "../types/Project";
|
||||
import Ticket from "../types/Ticket";
|
||||
import User from "../types/User";
|
||||
|
||||
export class TicketVM {
|
||||
export default class TicketVM {
|
||||
public id: number;
|
||||
public title: string;
|
||||
public description: string;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { Project } from "../types/Project";
|
||||
import { Ticket } from "../types/Ticket";
|
||||
import { User } from "../types/User";
|
||||
import { Activity } from "../types/Activity";
|
||||
import Activity from "../types/Activity";
|
||||
import Project from "../types/Project";
|
||||
import Ticket from "../types/Ticket";
|
||||
import User from "../types/User";
|
||||
|
||||
export class UserVM {
|
||||
public id: string;
|
||||
|
|
@ -16,9 +16,8 @@ export class UserVM {
|
|||
public projects: Project[];
|
||||
public tickets: Ticket[];
|
||||
public activities: Activity[];
|
||||
public allUsers: User[];
|
||||
|
||||
public constructor(user: User, allUsers: User[]) {
|
||||
public constructor(user: User) {
|
||||
this.id = user.id;
|
||||
this.firstName = user.firstName;
|
||||
this.lastName = user.lastName;
|
||||
|
|
@ -31,6 +30,5 @@ export class UserVM {
|
|||
this.projects = user.projects;
|
||||
this.tickets = user.tickets;
|
||||
this.activities = user.activities;
|
||||
this.allUsers = allUsers;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
// src/react-auth0-spa.js
|
||||
import React, { useState, useEffect, useContext } from "react";
|
||||
import createAuth0Client from "@auth0/auth0-spa-js";
|
||||
|
||||
|
|
@ -68,6 +67,7 @@ export const Auth0Provider = ({
|
|||
setIsAuthenticated(true);
|
||||
setUser(user);
|
||||
};
|
||||
|
||||
return (
|
||||
<Auth0Context.Provider
|
||||
value={{
|
||||
|
|
@ -81,7 +81,7 @@ export const Auth0Provider = ({
|
|||
loginWithRedirect: (...p) => auth0Client.loginWithRedirect(...p),
|
||||
getTokenSilently: (...p) => auth0Client.getTokenSilently(...p),
|
||||
getTokenWithPopup: (...p) => auth0Client.getTokenWithPopup(...p),
|
||||
logout: (...p) => auth0Client.logout(...p)
|
||||
logout: (...p) => auth0Client.logout(...p),
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
|
|
|
|||
9
client/src/authentication/helpers.ts
Normal file
9
client/src/authentication/helpers.ts
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
/**
|
||||
* retrieve userId
|
||||
* @param user Auth0 user object
|
||||
*/
|
||||
export const getUID = (user: any) => {
|
||||
const { sub } = user;
|
||||
const uid = sub.split("|")[1];
|
||||
return uid;
|
||||
};
|
||||
|
|
@ -1,12 +1,12 @@
|
|||
import React, { FC } from "react";
|
||||
import { Activity } from "../types/Activity";
|
||||
import Activity from "../types/Activity";
|
||||
|
||||
type IProps = {
|
||||
activities: Activity[];
|
||||
filterText: string;
|
||||
};
|
||||
|
||||
export const ActivityCollection: FC<IProps> = ({ activities, filterText }) => {
|
||||
const ActivityCollection: FC<IProps> = ({ activities, filterText }) => {
|
||||
return activities === undefined ? (
|
||||
<></>
|
||||
) : (
|
||||
|
|
@ -17,7 +17,7 @@ export const ActivityCollection: FC<IProps> = ({ activities, filterText }) => {
|
|||
) : (
|
||||
activities
|
||||
.filter(
|
||||
a =>
|
||||
(a) =>
|
||||
a.description
|
||||
.toLowerCase()
|
||||
.includes(filterText.toLowerCase()) ||
|
||||
|
|
@ -67,3 +67,4 @@ export const ActivityEntry: FC<IFProps> = ({ activity }) => {
|
|||
</>
|
||||
);
|
||||
};
|
||||
export default ActivityCollection;
|
||||
|
|
|
|||
|
|
@ -1,9 +1,8 @@
|
|||
import React, { FC } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import Avatar from "@material-ui/core/Avatar";
|
||||
import { makeStyles, Theme, createStyles, Avatar } from "@material-ui/core";
|
||||
import AvatarGroup from "@material-ui/lab/AvatarGroup";
|
||||
import { User } from "../../types/User";
|
||||
import { makeStyles, Theme, createStyles } from "@material-ui/core";
|
||||
import User from "../../types/User";
|
||||
|
||||
interface AvatarListProps {
|
||||
users: User[];
|
||||
|
|
@ -34,3 +33,5 @@ export const AvatarList: FC<AvatarListProps> = ({ users }) => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default AvatarList;
|
||||
|
|
|
|||
|
|
@ -12,17 +12,17 @@ const useStyles = makeStyles((theme: Theme) =>
|
|||
root: {
|
||||
display: "flex",
|
||||
"& > *": {
|
||||
margin: theme.spacing(1)
|
||||
}
|
||||
margin: theme.spacing(1),
|
||||
},
|
||||
},
|
||||
small: {
|
||||
width: theme.spacing(3),
|
||||
height: theme.spacing(3)
|
||||
height: theme.spacing(3),
|
||||
},
|
||||
large: {
|
||||
width: theme.spacing(10),
|
||||
height: theme.spacing(10)
|
||||
}
|
||||
height: theme.spacing(10),
|
||||
},
|
||||
})
|
||||
);
|
||||
|
||||
|
|
@ -35,3 +35,5 @@ export const UserAvatar: FC<IProps> = ({ picture, alt }) => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default UserAvatar;
|
||||
|
|
|
|||
|
|
@ -1,30 +1,36 @@
|
|||
import React from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import {
|
||||
AppBar,
|
||||
Button,
|
||||
IconButton,
|
||||
Toolbar,
|
||||
Typography,
|
||||
Avatar,
|
||||
} from "@material-ui/core";
|
||||
import { createStyles, makeStyles, Theme } from "@material-ui/core/styles";
|
||||
import AppBar from "@material-ui/core/AppBar";
|
||||
import Toolbar from "@material-ui/core/Toolbar";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
import Button from "@material-ui/core/Button";
|
||||
import IconButton from "@material-ui/core/IconButton";
|
||||
import MenuIcon from "@material-ui/icons/Menu";
|
||||
import * as ROUTES from "../constants/routes";
|
||||
import { useAuth0 } from "../authentication/auth0";
|
||||
import { getUID } from "../authentication/helpers";
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) =>
|
||||
createStyles({
|
||||
root: {
|
||||
flexGrow: 1
|
||||
flexGrow: 1,
|
||||
},
|
||||
menuButton: {
|
||||
marginRight: theme.spacing(2)
|
||||
marginRight: theme.spacing(2),
|
||||
},
|
||||
title: {
|
||||
flexGrow: 1
|
||||
}
|
||||
flexGrow: 1,
|
||||
},
|
||||
})
|
||||
);
|
||||
|
||||
export default function ButtonAppBar() {
|
||||
const classes = useStyles();
|
||||
const { isAuthenticated, loginWithRedirect, logout } = useAuth0();
|
||||
const { isAuthenticated, loginWithRedirect, logout, user } = useAuth0();
|
||||
|
||||
return (
|
||||
<div className={classes.root}>
|
||||
|
|
@ -39,18 +45,31 @@ export default function ButtonAppBar() {
|
|||
<MenuIcon />
|
||||
</IconButton>
|
||||
<Typography variant="h6" className={classes.title}>
|
||||
<Button color="inherit" href="/">
|
||||
<Button color="inherit" component={Link} to={ROUTES.HOME}>
|
||||
BugBuster
|
||||
</Button>
|
||||
</Typography>
|
||||
{!isAuthenticated ? (
|
||||
<Button color="inherit" onClick={() => loginWithRedirect({})}>
|
||||
<Button
|
||||
color="secondary"
|
||||
variant="contained"
|
||||
onClick={() => loginWithRedirect({})}
|
||||
>
|
||||
Log in
|
||||
</Button>
|
||||
) : (
|
||||
<>
|
||||
<Button
|
||||
color="inherit"
|
||||
component={Link}
|
||||
to={`${ROUTES.USERS}/${getUID(user)}`}
|
||||
>
|
||||
<Avatar src={user.picture} />
|
||||
</Button>
|
||||
<Button color="inherit" onClick={() => logout()}>
|
||||
Log out
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
|
|
|
|||
|
|
@ -9,12 +9,12 @@ interface IProps {
|
|||
onClick?: (e: MouseEvent) => void;
|
||||
}
|
||||
|
||||
export const Button: FC<IProps> = ({
|
||||
const Button: FC<IProps> = ({
|
||||
size = "small",
|
||||
shape = "",
|
||||
color,
|
||||
onClick,
|
||||
children
|
||||
children,
|
||||
}) => {
|
||||
return (
|
||||
<button
|
||||
|
|
@ -25,3 +25,5 @@ export const Button: FC<IProps> = ({
|
|||
</button>
|
||||
);
|
||||
};
|
||||
|
||||
export default Button;
|
||||
|
|
|
|||
|
|
@ -10,13 +10,7 @@ interface IProps {
|
|||
text?: string;
|
||||
}
|
||||
|
||||
export const FloatingButton: FC<IProps> = ({
|
||||
color,
|
||||
icon,
|
||||
size,
|
||||
text,
|
||||
onClick
|
||||
}) => {
|
||||
const FloatingButton: FC<IProps> = ({ color, icon, size, text, onClick }) => {
|
||||
return (
|
||||
<Fab color={color} aria-label={icon} size={size} onClick={onClick}>
|
||||
<AddIcon />
|
||||
|
|
@ -24,3 +18,5 @@ export const FloatingButton: FC<IProps> = ({
|
|||
</Fab>
|
||||
);
|
||||
};
|
||||
|
||||
export default FloatingButton;
|
||||
|
|
|
|||
|
|
@ -1,11 +1,8 @@
|
|||
import React, { FC, ReactNode } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import { makeStyles } from "@material-ui/core/styles";
|
||||
import Card from "@material-ui/core/Card";
|
||||
import CardActions from "@material-ui/core/CardActions";
|
||||
import CardContent from "@material-ui/core/CardContent";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
import { ProgressBar } from "../Progress/ProgressBar";
|
||||
import { Card, CardActions, CardContent, Typography } from "@material-ui/core";
|
||||
import ProgressBar from "../Progress/ProgressBar";
|
||||
|
||||
interface IProps {
|
||||
title?: string;
|
||||
|
|
@ -22,7 +19,7 @@ const useStyles = makeStyles({
|
|||
},
|
||||
});
|
||||
|
||||
export const HorizontalCard: FC<IProps> = ({
|
||||
const HorizontalCard: FC<IProps> = ({
|
||||
title,
|
||||
link = "#",
|
||||
content,
|
||||
|
|
@ -46,3 +43,5 @@ export const HorizontalCard: FC<IProps> = ({
|
|||
</Card>
|
||||
);
|
||||
};
|
||||
|
||||
export default HorizontalCard;
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import React, { FC } from "react";
|
||||
import { HorizontalCard } from "./HorizontalCard";
|
||||
import { makeStyles, Theme, createStyles } from "@material-ui/core";
|
||||
import { AvatarList } from "../Avatars/AvatarList";
|
||||
import { ProgressInfo } from "../Progress/ProgressInfo";
|
||||
import { User } from "../../types/User";
|
||||
import { getRemainingdays } from "../../utils/methods";
|
||||
import HorizontalCard from "./HorizontalCard";
|
||||
import AvatarList from "../Avatars/AvatarList";
|
||||
import ProgressInfo from "../Progress/ProgressInfo";
|
||||
import User from "../../types/User";
|
||||
import getRemainingdays from "../../utils/methods";
|
||||
|
||||
interface IProps {
|
||||
title?: string;
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
import React, { FC, MouseEvent } from "react";
|
||||
import { Button, Typography, Grid } from "@material-ui/core";
|
||||
import { HorizontalCard } from "./HorizontalCard";
|
||||
import HorizontalCard from "./HorizontalCard";
|
||||
import TicketChipsArray from "./TicketChipsArray";
|
||||
import { Ticket } from "../../types/Ticket";
|
||||
import { getRemainingdays } from "../../utils/methods";
|
||||
import Ticket from "../../types/Ticket";
|
||||
import getRemainingdays from "../../utils/methods";
|
||||
|
||||
interface IProps {
|
||||
ticket?: Ticket;
|
||||
|
|
|
|||
|
|
@ -1,12 +1,14 @@
|
|||
import React, { FC } from "react";
|
||||
import {
|
||||
Avatar,
|
||||
ListItemAvatar,
|
||||
List,
|
||||
ListItemText,
|
||||
ListItem,
|
||||
} from "@material-ui/core";
|
||||
import { createStyles, Theme, makeStyles } from "@material-ui/core/styles";
|
||||
import List from "@material-ui/core/List";
|
||||
import ListItem from "@material-ui/core/ListItem";
|
||||
import ListItemText from "@material-ui/core/ListItemText";
|
||||
import ListItemAvatar from "@material-ui/core/ListItemAvatar";
|
||||
import Avatar from "@material-ui/core/Avatar";
|
||||
import WorkIcon from "@material-ui/icons/Work";
|
||||
import { AppFile } from "../types/AppFile";
|
||||
import AppFile from "../types/AppFile";
|
||||
|
||||
type IProps = {
|
||||
files: AppFile[];
|
||||
|
|
@ -18,12 +20,12 @@ const useStyles = makeStyles((theme: Theme) =>
|
|||
root: {
|
||||
width: "100%",
|
||||
maxWidth: 360,
|
||||
backgroundColor: theme.palette.background.paper
|
||||
}
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
},
|
||||
})
|
||||
);
|
||||
|
||||
export const FileCollection: FC<IProps> = ({ files, filterText }) => {
|
||||
const FileCollection: FC<IProps> = ({ files, filterText }) => {
|
||||
const classes = useStyles();
|
||||
return (
|
||||
<List className={classes.root}>
|
||||
|
|
@ -32,7 +34,7 @@ export const FileCollection: FC<IProps> = ({ files, filterText }) => {
|
|||
) : (
|
||||
files
|
||||
.filter(
|
||||
f =>
|
||||
(f) =>
|
||||
f.name.toLowerCase().includes(filterText.toLowerCase()) ||
|
||||
f.format.toLowerCase().includes(filterText.toLowerCase())
|
||||
)
|
||||
|
|
@ -61,3 +63,4 @@ export const FileEntry: FC<IFProps> = ({ file }) => {
|
|||
</ListItem>
|
||||
);
|
||||
};
|
||||
export default FileCollection;
|
||||
|
|
|
|||
|
|
@ -1,9 +1,7 @@
|
|||
import React, { FC, ChangeEvent, MouseEvent } from "react";
|
||||
import { useRouteMatch } from "react-router-dom";
|
||||
import { Grid, TextField } from "@material-ui/core";
|
||||
import { createStyles, makeStyles, Theme } from "@material-ui/core/styles";
|
||||
import TextField from "@material-ui/core/TextField";
|
||||
import { Grid } from "@material-ui/core";
|
||||
// import { AccountCircle, FilterList, FilterListSharp } from "@material-ui/icons";
|
||||
|
||||
type IProps = {
|
||||
filterText: string;
|
||||
|
|
@ -28,7 +26,7 @@ const useStyles = makeStyles((theme: Theme) =>
|
|||
})
|
||||
);
|
||||
|
||||
export const FilterBar: FC<IProps> = ({
|
||||
const FilterBar: FC<IProps> = ({
|
||||
filterText,
|
||||
handleChange,
|
||||
// clearFilterText
|
||||
|
|
@ -55,3 +53,4 @@ export const FilterBar: FC<IProps> = ({
|
|||
</div>
|
||||
);
|
||||
};
|
||||
export default FilterBar;
|
||||
|
|
|
|||
|
|
@ -1,8 +1,7 @@
|
|||
import React, { FC } from "react";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
import { Link as RouterLink } from "react-router-dom";
|
||||
import { Container, Typography, Link } from "@material-ui/core";
|
||||
import { makeStyles } from "@material-ui/core/styles";
|
||||
import Container from "@material-ui/core/Container";
|
||||
import Link from "@material-ui/core/Link";
|
||||
|
||||
interface IProps {
|
||||
brand: string;
|
||||
|
|
@ -11,14 +10,14 @@ interface IProps {
|
|||
|
||||
const copyParams: IProps = {
|
||||
brand: "BugBuster",
|
||||
text: "Made with 🔥"
|
||||
text: "Made with 🔥",
|
||||
};
|
||||
|
||||
const Copyright: FC<IProps> = ({ brand, text }) => {
|
||||
return (
|
||||
<Typography variant="body2" color="textSecondary">
|
||||
{"© "}
|
||||
<Link color="inherit" href="/">
|
||||
<Link color="inherit" component={RouterLink} to="/">
|
||||
{brand}
|
||||
</Link>{" "}
|
||||
{new Date().getFullYear()}
|
||||
|
|
@ -27,15 +26,15 @@ const Copyright: FC<IProps> = ({ brand, text }) => {
|
|||
);
|
||||
};
|
||||
|
||||
const useStyles = makeStyles(theme => ({
|
||||
const useStyles = makeStyles((theme) => ({
|
||||
footer: {
|
||||
padding: theme.spacing(3, 2),
|
||||
marginTop: "auto",
|
||||
backgroundColor:
|
||||
theme.palette.type === "light"
|
||||
? theme.palette.grey[200]
|
||||
: theme.palette.grey[800]
|
||||
}
|
||||
: theme.palette.grey[800],
|
||||
},
|
||||
}));
|
||||
|
||||
export default function Footer() {
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ type HeaderProps = {
|
|||
description: string;
|
||||
};
|
||||
|
||||
export const Header: FC<HeaderProps> = ({ title, description }) => {
|
||||
const Header: FC<HeaderProps> = ({ title, description }) => {
|
||||
return (
|
||||
<Box>
|
||||
<Typography variant="h2" component="h2">
|
||||
|
|
@ -18,3 +18,5 @@ export const Header: FC<HeaderProps> = ({ title, description }) => {
|
|||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default Header;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import React, { FC } from "react";
|
||||
|
||||
export const InputField: FC = () => {
|
||||
const InputField: FC = () => {
|
||||
return (
|
||||
<div className="input-field">
|
||||
<input id="email" type="text" className="validate" />
|
||||
|
|
@ -8,3 +8,5 @@ export const InputField: FC = () => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default InputField;
|
||||
|
|
|
|||
|
|
@ -3,9 +3,8 @@ import { CloudUpload } from "@material-ui/icons";
|
|||
import { makeStyles, createStyles, Theme } from "@material-ui/core/styles";
|
||||
import Button from "@material-ui/core/Button";
|
||||
|
||||
export const InputFile: FC = () => {
|
||||
const InputFile: FC = () => {
|
||||
return (
|
||||
<>
|
||||
<form action="/upload">
|
||||
<div className="file-field input-field">
|
||||
<UploadButton>
|
||||
|
|
@ -18,7 +17,6 @@ export const InputFile: FC = () => {
|
|||
</UploadButton>
|
||||
</div>
|
||||
</form>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
|
|
@ -26,12 +24,12 @@ const useStyles = makeStyles((theme: Theme) =>
|
|||
createStyles({
|
||||
root: {
|
||||
"& > *": {
|
||||
margin: theme.spacing(1)
|
||||
}
|
||||
margin: theme.spacing(1),
|
||||
},
|
||||
},
|
||||
input: {
|
||||
display: "none"
|
||||
}
|
||||
display: "none",
|
||||
},
|
||||
})
|
||||
);
|
||||
|
||||
|
|
@ -60,3 +58,5 @@ const UploadButton: FC = () => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default InputFile;
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
import React, { FC, useState, ChangeEvent, MouseEvent } from "react";
|
||||
import { ActivityCollection } from "../ActivityCollection";
|
||||
import { Activity } from "../../types/Activity";
|
||||
import { FilterBar } from "../FilterBar";
|
||||
import ActivityCollection from "../ActivityCollection";
|
||||
import FilterBar from "../FilterBar";
|
||||
import Activity from "../../types/Activity";
|
||||
|
||||
type IProps = {
|
||||
activities: Activity[];
|
||||
};
|
||||
|
||||
export const ActivityList: FC<IProps> = ({ activities }) => {
|
||||
const ActivityList: FC<IProps> = ({ activities }) => {
|
||||
const [filterText, setFilterText] = useState<string>("");
|
||||
const clearFilterText: (e: MouseEvent) => void = (e: MouseEvent) => {
|
||||
setFilterText("");
|
||||
|
|
@ -30,3 +30,5 @@ export const ActivityList: FC<IProps> = ({ activities }) => {
|
|||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default ActivityList;
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
import React, { FC, useState, ChangeEvent, MouseEvent } from "react";
|
||||
import { AppFile } from "../../types/AppFile";
|
||||
import { FileCollection } from "../FileCollection";
|
||||
import { InputFile } from "../InputFile";
|
||||
import { FilterBar } from "../FilterBar";
|
||||
import { Grid, Typography } from "@material-ui/core";
|
||||
import FileCollection from "../FileCollection";
|
||||
import FilterBar from "../FilterBar";
|
||||
import InputFile from "../InputFile";
|
||||
import AppFile from "../../types/AppFile";
|
||||
|
||||
type IProps = {
|
||||
files: AppFile[];
|
||||
};
|
||||
|
||||
export const FileList: FC<IProps> = ({ files }) => {
|
||||
const FileList: FC<IProps> = ({ files }) => {
|
||||
const [filterText, setFilterText] = useState<string>("");
|
||||
const clearFilterText = (e: MouseEvent): void => {
|
||||
setFilterText("");
|
||||
|
|
@ -38,3 +38,5 @@ export const FileList: FC<IProps> = ({ files }) => {
|
|||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default FileList;
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
import React, { FC, useState, ChangeEvent, MouseEvent } from "react";
|
||||
import { UsersModalEntry } from "../Modals/UsersModalEntry";
|
||||
import { FilterBar } from "../FilterBar";
|
||||
import { User } from "../../types/User";
|
||||
import FilterBar from "../FilterBar";
|
||||
import UsersModalEntry from "../Modals/UsersModalEntry";
|
||||
import User from "../../types/User";
|
||||
|
||||
interface IProps {
|
||||
users: User[];
|
||||
}
|
||||
|
||||
export const MemberList: FC<IProps> = ({ users }) => {
|
||||
const MemberList: FC<IProps> = ({ users }) => {
|
||||
const [members, setMembers] = useState<User[]>([]);
|
||||
const [filterText, setFilterText] = useState<string>("");
|
||||
const clearFilterText = (e: MouseEvent): void => {
|
||||
|
|
@ -37,3 +37,5 @@ export const MemberList: FC<IProps> = ({ users }) => {
|
|||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default MemberList;
|
||||
|
|
|
|||
|
|
@ -6,12 +6,11 @@ import {
|
|||
createStyles,
|
||||
Theme,
|
||||
} from "@material-ui/core";
|
||||
import { FilterBar } from "../FilterBar";
|
||||
import FilterBar from "../FilterBar";
|
||||
import ProjectCard from "../Cards/ProjectCard";
|
||||
import { FloatingButton } from "../Buttons/FloatingButton";
|
||||
import { NewProjectModal } from "../Modals/NewProjectModal";
|
||||
import { Project } from "../../types/Project";
|
||||
import { User } from "../../types/User";
|
||||
import FloatingButton from "../Buttons/FloatingButton";
|
||||
import NewProjectModal from "../Modals/NewProjectModal";
|
||||
import Project from "../../types/Project";
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) =>
|
||||
createStyles({
|
||||
|
|
@ -27,10 +26,9 @@ const useStyles = makeStyles((theme: Theme) =>
|
|||
|
||||
type IProps = {
|
||||
projects: Project[];
|
||||
allUsers: User[];
|
||||
};
|
||||
|
||||
export const ProjectList: FC<IProps> = ({ projects, allUsers }) => {
|
||||
const ProjectList: FC<IProps> = ({ projects }) => {
|
||||
const [filterText, setFilterText] = useState<string>("");
|
||||
const clearFilterText: (e: MouseEvent) => void = (e: MouseEvent) => {
|
||||
setFilterText("");
|
||||
|
|
@ -59,7 +57,6 @@ export const ProjectList: FC<IProps> = ({ projects, allUsers }) => {
|
|||
setShowNew(false);
|
||||
}}
|
||||
show={showNew}
|
||||
allUsers={allUsers}
|
||||
/>
|
||||
<Grid container>
|
||||
<Grid
|
||||
|
|
@ -109,3 +106,5 @@ export const ProjectList: FC<IProps> = ({ projects, allUsers }) => {
|
|||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default ProjectList;
|
||||
|
|
|
|||
|
|
@ -6,15 +6,14 @@ import {
|
|||
Theme,
|
||||
createStyles,
|
||||
} from "@material-ui/core";
|
||||
import { FloatingButton } from "../Buttons/FloatingButton";
|
||||
import { FilterBar } from "../FilterBar";
|
||||
import { HttpResponse } from "../../types/HttpResponse";
|
||||
import { Ticket } from "../../types/Ticket";
|
||||
import { NewTicketModal } from "../Modals/NewTicketModal";
|
||||
import { Project } from "../../types/Project";
|
||||
import { put } from "../../utils/http";
|
||||
import { Constants } from "../../utils/Constants";
|
||||
import FloatingButton from "../Buttons/FloatingButton";
|
||||
import FilterBar from "../FilterBar";
|
||||
import TicketCard from "../Cards/TicketCard";
|
||||
import NewTicketModal from "../Modals/NewTicketModal";
|
||||
import Ticket from "../../types/Ticket";
|
||||
import Project from "../../types/Project";
|
||||
import { useAuth0 } from "../../authentication/auth0";
|
||||
import { TicketService } from "../../services";
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) =>
|
||||
createStyles({
|
||||
|
|
@ -34,7 +33,7 @@ type TicketListProps = {
|
|||
addButton?: Boolean;
|
||||
};
|
||||
|
||||
export const TicketList: FC<TicketListProps> = ({
|
||||
const TicketList: FC<TicketListProps> = ({
|
||||
tickets,
|
||||
allProjects,
|
||||
addButton = true,
|
||||
|
|
@ -59,6 +58,14 @@ export const TicketList: FC<TicketListProps> = ({
|
|||
t.title.toLowerCase().includes(filterText.toLowerCase())
|
||||
);
|
||||
|
||||
const { getTokenSilently } = useAuth0();
|
||||
|
||||
const handleValidate = async (id: number) => {
|
||||
const token = await getTokenSilently();
|
||||
const Tickets = new TicketService(token);
|
||||
await Tickets.close(id.toString());
|
||||
};
|
||||
|
||||
const classes = useStyles();
|
||||
|
||||
return (
|
||||
|
|
@ -99,7 +106,6 @@ export const TicketList: FC<TicketListProps> = ({
|
|||
/>
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
<div className="col s12 grey lighten-1">
|
||||
{filteredTickets.length === 0 ? (
|
||||
<TicketCard />
|
||||
) : (
|
||||
|
|
@ -108,19 +114,16 @@ export const TicketList: FC<TicketListProps> = ({
|
|||
key={t.id}
|
||||
ticket={t}
|
||||
link={`/tickets/${t.id}`}
|
||||
validateTicket={async (e: MouseEvent) => {
|
||||
e.preventDefault();
|
||||
await put<HttpResponse<Ticket>>(
|
||||
`${Constants.ticketsURI}/${t.id}/closed`,
|
||||
{}
|
||||
);
|
||||
validateTicket={() => {
|
||||
handleValidate(t.id);
|
||||
}}
|
||||
/>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default TicketList;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React, { FC } from "react";
|
||||
import { InputField } from "./InputField";
|
||||
import { PasswordField } from "./PasswordField";
|
||||
import { Button } from "./Buttons/Button";
|
||||
import InputField from "./InputField";
|
||||
import PasswordField from "./PasswordField";
|
||||
import Button from "./Buttons/Button";
|
||||
|
||||
export const LogInForm: FC = () => {
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import React, { FC } from "react";
|
||||
import Dialog from "@material-ui/core/Dialog";
|
||||
import {
|
||||
Dialog,
|
||||
DialogTitle,
|
||||
Typography,
|
||||
IconButton,
|
||||
|
|
@ -36,7 +36,7 @@ const useStyles = makeStyles((theme: Theme) =>
|
|||
})
|
||||
);
|
||||
|
||||
export const Modal: FC<IProps> = ({
|
||||
const Modal: FC<IProps> = ({
|
||||
handleClose,
|
||||
show,
|
||||
action,
|
||||
|
|
@ -77,3 +77,5 @@ export const Modal: FC<IProps> = ({
|
|||
</Dialog>
|
||||
);
|
||||
};
|
||||
|
||||
export default Modal;
|
||||
|
|
|
|||
|
|
@ -1,36 +1,48 @@
|
|||
import React, { FC, useState, FormEvent } from "react";
|
||||
import { TextField } from "@material-ui/core";
|
||||
import { Modal } from "./Modal";
|
||||
import { Project } from "../../types/Project";
|
||||
import { User } from "../../types/User";
|
||||
import { post } from "../../utils/http";
|
||||
import { Constants } from "../../utils/Constants";
|
||||
import Modal from "./Modal";
|
||||
import Preloader from "../Preloader";
|
||||
import { useAuth0 } from "../../authentication/auth0";
|
||||
import { ProjectService } from "../../services";
|
||||
import { getUID } from "../../authentication/helpers";
|
||||
import { today } from "../../utils/methods";
|
||||
|
||||
interface IProps {
|
||||
show: boolean;
|
||||
handleClose: () => void;
|
||||
allUsers: User[];
|
||||
}
|
||||
|
||||
export const NewProjectModal: FC<IProps> = ({ show, handleClose }) => {
|
||||
const NewProjectModal: FC<IProps> = ({ show, handleClose }) => {
|
||||
const [title, setTitle] = useState("");
|
||||
const [description, setDescription] = useState("");
|
||||
const [endingDate, setEndingDate] = useState("");
|
||||
const [endingDate, setEndingDate] = useState(today());
|
||||
const [loading, setLoading] = useState(false);
|
||||
const { getTokenSilently, user } = useAuth0();
|
||||
|
||||
const handleSubmit = async (e: FormEvent) => {
|
||||
e.preventDefault();
|
||||
setLoading(true);
|
||||
let newProject = {
|
||||
title: title,
|
||||
description: description,
|
||||
endingDate: new Date(endingDate).toISOString(),
|
||||
managerId: "cd179eb7-3a54-4060-b22c-3e947bdffcbc", // get current User id
|
||||
managerId: getUID(user),
|
||||
};
|
||||
|
||||
await post<Project>(`${Constants.projectsURI}`, newProject);
|
||||
const token = await getTokenSilently();
|
||||
const Projects = new ProjectService(token);
|
||||
Projects.add(newProject).catch((err) => console.error(err));
|
||||
setLoading(false);
|
||||
setTitle("");
|
||||
setDescription("");
|
||||
setEndingDate(today());
|
||||
|
||||
handleClose();
|
||||
};
|
||||
|
||||
return (
|
||||
return loading ? (
|
||||
<Preloader />
|
||||
) : (
|
||||
<Modal
|
||||
name="New Project"
|
||||
show={show}
|
||||
|
|
@ -88,3 +100,5 @@ export const NewProjectModal: FC<IProps> = ({ show, handleClose }) => {
|
|||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default NewProjectModal;
|
||||
|
|
|
|||
|
|
@ -7,14 +7,16 @@ import {
|
|||
makeStyles,
|
||||
Theme,
|
||||
} from "@material-ui/core";
|
||||
import { Modal } from "./Modal";
|
||||
import { Ticket } from "../../types/Ticket";
|
||||
import { Project } from "../../types/Project";
|
||||
import { post } from "../../utils/http";
|
||||
import { Constants } from "../../utils/Constants";
|
||||
import Modal from "./Modal";
|
||||
import Project from "../../types/Project";
|
||||
import Category from "../../types/enums/category";
|
||||
import Impact from "../../types/enums/impact";
|
||||
import Difficulty from "../../types/enums/difficulty";
|
||||
import { TicketService } from "../../services";
|
||||
import { useAuth0 } from "../../authentication/auth0";
|
||||
import { getUID } from "../../authentication/helpers";
|
||||
import { today } from "../../utils/methods";
|
||||
import Preloader from "../Preloader";
|
||||
|
||||
interface IProps {
|
||||
show: boolean;
|
||||
|
|
@ -28,42 +30,50 @@ const useStyles = makeStyles((theme: Theme) => ({
|
|||
},
|
||||
}));
|
||||
|
||||
export const NewTicketModal: FC<IProps> = ({
|
||||
show,
|
||||
handleClose,
|
||||
allProjects,
|
||||
}) => {
|
||||
const [title, setTitle] = useState("");
|
||||
const [description, setDescription] = useState("");
|
||||
const [endingDate, setEndingDate] = useState("");
|
||||
|
||||
const NewTicketModal: FC<IProps> = ({ show, handleClose, allProjects }) => {
|
||||
const { getTokenSilently, user } = useAuth0();
|
||||
const { url } = useRouteMatch();
|
||||
const id = url.split("/")[2];
|
||||
const [projectId, setProjectId] = useState(id);
|
||||
const [categoryID, setCategoryID] = useState(0);
|
||||
const [impactID, setImpactID] = useState(0);
|
||||
const [difficultyID, setDifficultyID] = useState(0);
|
||||
const [title, setTitle] = useState("");
|
||||
const [description, setDescription] = useState("");
|
||||
const [endingDate, setEndingDate] = useState(today());
|
||||
const [categoryID, setCategoryID] = useState(1);
|
||||
const [impactID, setImpactID] = useState(1);
|
||||
const [difficultyID, setDifficultyID] = useState(1);
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const handleSubmit = async (e: FormEvent) => {
|
||||
e.preventDefault();
|
||||
setLoading(true);
|
||||
let newTicket = {
|
||||
title: title,
|
||||
description: description,
|
||||
endingDate: new Date(endingDate).toISOString(),
|
||||
creatorId: "20bf4b2a-7209-4826-96cd-29c2bc937a94", // get current User id
|
||||
creatorId: getUID(user),
|
||||
projectId: parseInt(projectId),
|
||||
impact: impactID,
|
||||
difficulty: difficultyID,
|
||||
category: categoryID,
|
||||
};
|
||||
|
||||
// const response: HttpResponse<Ticket> =
|
||||
await post<Ticket>(`${Constants.ticketsURI}`, newTicket);
|
||||
const token = await getTokenSilently();
|
||||
const Tickets = new TicketService(token);
|
||||
Tickets.add(newTicket).catch((err) => console.error(err));
|
||||
setLoading(false);
|
||||
setTitle("");
|
||||
setDescription("");
|
||||
setEndingDate(today());
|
||||
setCategoryID(1);
|
||||
setImpactID(1);
|
||||
setDifficultyID(1);
|
||||
handleClose();
|
||||
};
|
||||
|
||||
const classes = useStyles();
|
||||
return (
|
||||
return loading ? (
|
||||
<Preloader />
|
||||
) : (
|
||||
<Modal
|
||||
name="New Ticket"
|
||||
show={show}
|
||||
|
|
@ -160,7 +170,7 @@ export const NewTicketModal: FC<IProps> = ({
|
|||
className={classes.select}
|
||||
>
|
||||
{Category.map((c: string, i: number) => (
|
||||
<MenuItem key={i} value={i}>
|
||||
<MenuItem key={i} value={i + 1}>
|
||||
{c}
|
||||
</MenuItem>
|
||||
))}
|
||||
|
|
@ -181,7 +191,7 @@ export const NewTicketModal: FC<IProps> = ({
|
|||
margin="normal"
|
||||
>
|
||||
{Impact.map((c: string, i: number) => (
|
||||
<MenuItem key={i} value={i}>
|
||||
<MenuItem key={i} value={i + 1}>
|
||||
{c}
|
||||
</MenuItem>
|
||||
))}
|
||||
|
|
@ -202,7 +212,7 @@ export const NewTicketModal: FC<IProps> = ({
|
|||
margin="normal"
|
||||
>
|
||||
{Difficulty.map((c: string, i: number) => (
|
||||
<MenuItem key={i} value={i}>
|
||||
<MenuItem key={i} value={i + 1}>
|
||||
{c}
|
||||
</MenuItem>
|
||||
))}
|
||||
|
|
@ -211,3 +221,5 @@ export const NewTicketModal: FC<IProps> = ({
|
|||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default NewTicketModal;
|
||||
|
|
|
|||
|
|
@ -1,20 +1,22 @@
|
|||
import React, { FC, useState, ChangeEvent, FormEvent } from "react";
|
||||
import { useParams } from "react-router-dom";
|
||||
import { Grid } from "@material-ui/core";
|
||||
import {
|
||||
Avatar,
|
||||
Checkbox,
|
||||
Grid,
|
||||
List,
|
||||
ListItem,
|
||||
ListItemSecondaryAction,
|
||||
ListItemText,
|
||||
ListItemAvatar,
|
||||
} from "@material-ui/core";
|
||||
import { createStyles, makeStyles, Theme } from "@material-ui/core/styles";
|
||||
import List from "@material-ui/core/List";
|
||||
import ListItem from "@material-ui/core/ListItem";
|
||||
import ListItemSecondaryAction from "@material-ui/core/ListItemSecondaryAction";
|
||||
import ListItemText from "@material-ui/core/ListItemText";
|
||||
import ListItemAvatar from "@material-ui/core/ListItemAvatar";
|
||||
import Checkbox from "@material-ui/core/Checkbox";
|
||||
import Avatar from "@material-ui/core/Avatar";
|
||||
import { Modal } from "./Modal";
|
||||
import { AvatarList } from "../Avatars/AvatarList";
|
||||
import { FilterBar } from "../FilterBar";
|
||||
import { User } from "../../types/User";
|
||||
import { patch } from "../../utils/http";
|
||||
import { Constants } from "../../utils/Constants";
|
||||
import AvatarList from "../Avatars/AvatarList";
|
||||
import FilterBar from "../FilterBar";
|
||||
import Modal from "./Modal";
|
||||
import User from "../../types/User";
|
||||
import { ProjectService } from "../../services";
|
||||
import { useAuth0 } from "../../authentication/auth0";
|
||||
|
||||
interface IProps {
|
||||
show: boolean;
|
||||
|
|
@ -33,12 +35,7 @@ const useStyles = makeStyles((theme: Theme) =>
|
|||
})
|
||||
);
|
||||
|
||||
export const UsersModal: FC<IProps> = ({
|
||||
show,
|
||||
handleClose,
|
||||
users,
|
||||
allUsers,
|
||||
}) => {
|
||||
const UsersModal: FC<IProps> = ({ show, handleClose, users, allUsers }) => {
|
||||
const { id } = useParams();
|
||||
|
||||
const [filterText, setFilterText] = useState<string>("");
|
||||
|
|
@ -62,12 +59,14 @@ export const UsersModal: FC<IProps> = ({
|
|||
setMembers(newChecked);
|
||||
};
|
||||
|
||||
const { getTokenSilently } = useAuth0();
|
||||
const handleSubmit = async (e: FormEvent) => {
|
||||
e.preventDefault();
|
||||
await patch<User[]>(
|
||||
`${Constants.projectsURI}/${id}/members`,
|
||||
members //.map((m) => m.id)
|
||||
);
|
||||
if (id !== undefined) {
|
||||
const token = await getTokenSilently();
|
||||
const Projects = new ProjectService(token);
|
||||
await Projects.setMembers(id, members);
|
||||
}
|
||||
handleClose();
|
||||
};
|
||||
|
||||
|
|
@ -112,3 +111,5 @@ export const UsersModal: FC<IProps> = ({
|
|||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default UsersModal;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React, { FC } from "react";
|
||||
import { User } from "../../types/User";
|
||||
import User from "../../types/User";
|
||||
|
||||
interface IProps {
|
||||
setMembers: React.Dispatch<React.SetStateAction<User[]>>;
|
||||
|
|
@ -7,7 +7,7 @@ interface IProps {
|
|||
user: User;
|
||||
}
|
||||
|
||||
export const UsersModalEntry: FC<IProps> = ({ user, setMembers, members }) => {
|
||||
const UsersModalEntry: FC<IProps> = ({ user, setMembers, members }) => {
|
||||
const match: (id: string) => boolean = (id: string) => {
|
||||
return Boolean(members.find((m) => m.id === id));
|
||||
};
|
||||
|
|
@ -40,3 +40,5 @@ export const UsersModalEntry: FC<IProps> = ({ user, setMembers, members }) => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default UsersModalEntry;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from "react";
|
||||
import { useAuth0 } from "../authentication/auth0";
|
||||
|
||||
export const NavBar = () => {
|
||||
const NavBar = () => {
|
||||
const { isAuthenticated, loginWithRedirect, logout } = useAuth0();
|
||||
|
||||
return (
|
||||
|
|
@ -14,3 +14,5 @@ export const NavBar = () => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default NavBar;
|
||||
|
|
|
|||
|
|
@ -1,67 +0,0 @@
|
|||
import React, { FC } from "react";
|
||||
import { TextField, MenuItem } from "@material-ui/core";
|
||||
import { Project } from "../types/Project";
|
||||
|
||||
interface IProps {
|
||||
title: string;
|
||||
setTitle: React.Dispatch<React.SetStateAction<string>>;
|
||||
description: string;
|
||||
setDescription: React.Dispatch<React.SetStateAction<string>>;
|
||||
endingDate: string;
|
||||
setEndingDate: React.Dispatch<React.SetStateAction<string>>;
|
||||
allProjects: Project[];
|
||||
projectId: string;
|
||||
setProjectId: React.Dispatch<React.SetStateAction<string>>;
|
||||
}
|
||||
|
||||
export const NewTicketForm: FC<IProps> = ({
|
||||
title,
|
||||
setTitle,
|
||||
description,
|
||||
setDescription,
|
||||
endingDate,
|
||||
setEndingDate,
|
||||
allProjects,
|
||||
projectId,
|
||||
setProjectId,
|
||||
}) => {
|
||||
return (
|
||||
<>
|
||||
{/* <div className="row">
|
||||
<div className="input-field">
|
||||
<i className="material-icons prefix">date_range</i>
|
||||
<input
|
||||
id="Due Date"
|
||||
type="text"
|
||||
className="datepicker"
|
||||
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
|
||||
setEndingDate(e.target.value)
|
||||
}
|
||||
/>
|
||||
<label htmlFor="Due Date">Due Date</label>
|
||||
</div>
|
||||
|
||||
<div className="input-field">
|
||||
<select
|
||||
id="project"
|
||||
className="browser-default"
|
||||
value={projectId}
|
||||
onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {
|
||||
e.preventDefault();
|
||||
setProjectId(e.target.value);
|
||||
}}
|
||||
>
|
||||
<option value={0} disabled>
|
||||
Project
|
||||
</option>
|
||||
{allProjects.map((p) => (
|
||||
<option key={p.id} value={p.id}>
|
||||
{p.title}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
</div> */}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
@ -1,16 +1,11 @@
|
|||
import React, { FC, useState, ReactNode } from "react";
|
||||
import { makeStyles, Theme, useTheme } from "@material-ui/core/styles";
|
||||
import AppBar from "@material-ui/core/AppBar";
|
||||
import Tabs from "@material-ui/core/Tabs";
|
||||
import Tab from "@material-ui/core/Tab";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
import Box from "@material-ui/core/Box";
|
||||
import SwipeableViews from "react-swipeable-views";
|
||||
import { Ticket } from "../../types/Ticket";
|
||||
import { Project } from "../../types/Project";
|
||||
import { TicketList } from "../Lists/TicketList";
|
||||
// import { FileList } from "./AppFileList";
|
||||
import { AppFile } from "../../types/AppFile";
|
||||
import { makeStyles, Theme, useTheme } from "@material-ui/core/styles";
|
||||
import { AppBar, Box, Tab, Tabs, Typography } from "@material-ui/core";
|
||||
import Ticket from "../../types/Ticket";
|
||||
import Project from "../../types/Project";
|
||||
import TicketList from "../Lists/TicketList";
|
||||
import AppFile from "../../types/AppFile";
|
||||
|
||||
interface TabProps {
|
||||
children?: ReactNode;
|
||||
|
|
@ -59,7 +54,7 @@ interface IProps {
|
|||
allProjects: Project[];
|
||||
}
|
||||
|
||||
export const ProjectTabPanel: FC<IProps> = ({
|
||||
const ProjectTabPanel: FC<IProps> = ({
|
||||
tickets,
|
||||
tabNames,
|
||||
files,
|
||||
|
|
@ -116,3 +111,5 @@ export const ProjectTabPanel: FC<IProps> = ({
|
|||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ProjectTabPanel;
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
import React, { FC } from "react";
|
||||
import { Route, useRouteMatch, Redirect } from "react-router-dom";
|
||||
import { TabRouterHeader } from "./TabRouterHeader";
|
||||
import { TicketList } from "../Lists/TicketList";
|
||||
import { FileList } from "../Lists/AppFileList";
|
||||
import { Ticket } from "../../types/Ticket";
|
||||
import { AppFile } from "../../types/AppFile";
|
||||
import { Activity } from "../../types/Activity";
|
||||
import { Project } from "../../types/Project";
|
||||
import TabRouterHeader from "./TabRouterHeader";
|
||||
import TicketList from "../Lists/TicketList";
|
||||
import FileList from "../Lists/AppFileList";
|
||||
import Ticket from "../../types/Ticket";
|
||||
import AppFile from "../../types/AppFile";
|
||||
import Activity from "../../types/Activity";
|
||||
import Project from "../../types/Project";
|
||||
|
||||
interface IProps {
|
||||
tickets: Ticket[];
|
||||
|
|
@ -17,7 +17,7 @@ interface IProps {
|
|||
allProjects: Project[];
|
||||
}
|
||||
|
||||
export const TabRouter: FC<IProps> = ({
|
||||
const TabRouter: FC<IProps> = ({
|
||||
tickets,
|
||||
tabNames,
|
||||
files,
|
||||
|
|
@ -48,3 +48,5 @@ export const TabRouter: FC<IProps> = ({
|
|||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default TabRouter;
|
||||
|
|
|
|||
|
|
@ -6,9 +6,9 @@ interface IProps {
|
|||
tabNames: string[];
|
||||
}
|
||||
|
||||
export const TabRouterHeader: FC<IProps> = ({
|
||||
const TabRouterHeader: FC<IProps> = ({
|
||||
tabNames,
|
||||
tabClass = `tab col s${12 / tabNames.length}`
|
||||
tabClass = `tab col s${12 / tabNames.length}`,
|
||||
}) => {
|
||||
const [isActive, setIsActive] = useState(0);
|
||||
const nTabs = tabNames.length;
|
||||
|
|
@ -31,7 +31,7 @@ export const TabRouterHeader: FC<IProps> = ({
|
|||
className="indicator indigo lighten-2"
|
||||
style={{
|
||||
left: `${(isActive / nTabs) * 100}%`,
|
||||
right: `${(1 - (isActive + 1) / nTabs) * 100}%`
|
||||
right: `${(1 - (isActive + 1) / nTabs) * 100}%`,
|
||||
}}
|
||||
></li>
|
||||
</ul>
|
||||
|
|
@ -54,7 +54,7 @@ const TabUnit: FC<TabUnitProps> = ({
|
|||
setIsActive,
|
||||
text,
|
||||
value,
|
||||
nTabs
|
||||
nTabs,
|
||||
}) => {
|
||||
const { url } = useRouteMatch();
|
||||
return (
|
||||
|
|
@ -63,7 +63,7 @@ const TabUnit: FC<TabUnitProps> = ({
|
|||
key={value}
|
||||
style={{
|
||||
left: `${(isActive / nTabs) * 100}%`,
|
||||
right: `${(1 - (isActive + 1) / nTabs) * 100}%`
|
||||
right: `${(1 - (isActive + 1) / nTabs) * 100}%`,
|
||||
}}
|
||||
>
|
||||
<Link
|
||||
|
|
@ -81,3 +81,5 @@ const TabUnit: FC<TabUnitProps> = ({
|
|||
</li>
|
||||
);
|
||||
};
|
||||
|
||||
export default TabRouterHeader;
|
||||
|
|
|
|||
|
|
@ -1,16 +1,11 @@
|
|||
import React, { FC, useState, ReactNode } from "react";
|
||||
import SwipeableViews from "react-swipeable-views";
|
||||
import { makeStyles, Theme, useTheme } from "@material-ui/core/styles";
|
||||
import AppBar from "@material-ui/core/AppBar";
|
||||
import Tabs from "@material-ui/core/Tabs";
|
||||
import Tab from "@material-ui/core/Tab";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
import Box from "@material-ui/core/Box";
|
||||
import { Ticket } from "../../types/Ticket";
|
||||
import { Project } from "../../types/Project";
|
||||
import { ProjectList } from "../Lists/ProjectList";
|
||||
import { TicketList } from "../Lists/TicketList";
|
||||
import { User } from "../../types/User";
|
||||
import { AppBar, Box, Tab, Tabs, Typography } from "@material-ui/core";
|
||||
import ProjectList from "../Lists/ProjectList";
|
||||
import TicketList from "../Lists/TicketList";
|
||||
import Ticket from "../../types/Ticket";
|
||||
import Project from "../../types/Project";
|
||||
|
||||
interface TabProps {
|
||||
children?: ReactNode;
|
||||
|
|
@ -55,15 +50,9 @@ interface IProps {
|
|||
tabNames: string[];
|
||||
tickets: Ticket[];
|
||||
projects: Project[];
|
||||
allUsers: User[];
|
||||
}
|
||||
|
||||
export const UserTabPanel: FC<IProps> = ({
|
||||
tickets,
|
||||
tabNames,
|
||||
projects,
|
||||
allUsers,
|
||||
}) => {
|
||||
const UserTabPanel: FC<IProps> = ({ tickets, tabNames, projects }) => {
|
||||
const classes = useStyles();
|
||||
const theme = useTheme();
|
||||
const [value, setValue] = useState(0);
|
||||
|
|
@ -98,7 +87,7 @@ export const UserTabPanel: FC<IProps> = ({
|
|||
onChangeIndex={handleChangeIndex}
|
||||
>
|
||||
<TabPanel value={value} index={0} dir={theme.direction}>
|
||||
<ProjectList projects={projects} allUsers={allUsers} />
|
||||
<ProjectList projects={projects} />
|
||||
</TabPanel>
|
||||
<TabPanel value={value} index={1} dir={theme.direction}>
|
||||
<TicketList tickets={tickets} allProjects={[]} addButton={false} />
|
||||
|
|
@ -107,3 +96,4 @@ export const UserTabPanel: FC<IProps> = ({
|
|||
</div>
|
||||
);
|
||||
};
|
||||
export default UserTabPanel;
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
import React, { FC } from "react";
|
||||
import { Route, useRouteMatch, Redirect } from "react-router-dom";
|
||||
import { TabRouterHeader } from "./TabRouterHeader";
|
||||
import { ProjectList } from "../Lists/ProjectList";
|
||||
import { Ticket } from "../../types/Ticket";
|
||||
import { Project } from "../../types/Project";
|
||||
import { TicketList } from "../Lists/TicketList";
|
||||
import TabRouterHeader from "./TabRouterHeader";
|
||||
import TicketList from "../Lists/TicketList";
|
||||
import Ticket from "../../types/Ticket";
|
||||
import Project from "../../types/Project";
|
||||
|
||||
interface IProps {
|
||||
tabNames: string[];
|
||||
|
|
@ -33,3 +32,5 @@ export const UserTabRouter: FC<IProps> = ({ tickets, tabNames, projects }) => {
|
|||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default UserTabRouter;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import React, { FC } from "react";
|
||||
|
||||
export const PasswordField: FC = () => {
|
||||
const PasswordField: FC = () => {
|
||||
return (
|
||||
<div className="input-field">
|
||||
<input id="password" type="password" className="validate" />
|
||||
|
|
@ -8,3 +8,5 @@ export const PasswordField: FC = () => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default PasswordField;
|
||||
|
|
|
|||
|
|
@ -1,55 +1,24 @@
|
|||
import React, { FC } from "react";
|
||||
import { Backdrop, CircularProgress } from "@material-ui/core";
|
||||
import { makeStyles, createStyles, Theme } from "@material-ui/core/styles";
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) =>
|
||||
createStyles({
|
||||
backdrop: {
|
||||
zIndex: theme.zIndex.drawer + 1,
|
||||
color: "#fff",
|
||||
},
|
||||
})
|
||||
);
|
||||
|
||||
const Preloader: FC = () => {
|
||||
const classes = useStyles();
|
||||
|
||||
export const Preloader: FC = () => {
|
||||
return (
|
||||
<div className="preloader-wrapper big active">
|
||||
<div className="spinner-layer spinner-blue">
|
||||
<div className="circle-clipper left">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
<div className="gap-patch">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
<div className="circle-clipper right">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="spinner-layer spinner-red">
|
||||
<div className="circle-clipper left">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
<div className="gap-patch">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
<div className="circle-clipper right">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="spinner-layer spinner-yellow">
|
||||
<div className="circle-clipper left">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
<div className="gap-patch">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
<div className="circle-clipper right">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="spinner-layer spinner-green">
|
||||
<div className="circle-clipper left">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
<div className="gap-patch">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
<div className="circle-clipper right">
|
||||
<div className="circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Backdrop className={classes.backdrop} open={true}>
|
||||
<CircularProgress color="inherit" />
|
||||
</Backdrop>
|
||||
);
|
||||
};
|
||||
|
||||
export default Preloader;
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
import React, { FC } from "react";
|
||||
import { UserAvatar } from "./Avatars/UserAvatar";
|
||||
import { Link } from "react-router-dom";
|
||||
import { UserAvatar } from "./Avatars/UserAvatar";
|
||||
|
||||
export const ProfileSelector: FC = () => {
|
||||
const ProfileSelector: FC = () => {
|
||||
return (
|
||||
<div className="section col s10 offset-s1 white z-depth-1">
|
||||
<div className="row ">
|
||||
|
|
@ -20,3 +20,4 @@ export const ProfileSelector: FC = () => {
|
|||
</div>
|
||||
);
|
||||
};
|
||||
export default ProfileSelector;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
import React, { FC } from "react";
|
||||
import { Box, LinearProgress } from "@material-ui/core";
|
||||
import { makeStyles, Theme, createStyles } from "@material-ui/core/styles";
|
||||
import LinearProgress from "@material-ui/core/LinearProgress";
|
||||
import { Box } from "@material-ui/core";
|
||||
|
||||
type IProps = {
|
||||
value: number;
|
||||
|
|
@ -18,7 +17,7 @@ const useStyles = makeStyles((theme: Theme) =>
|
|||
})
|
||||
);
|
||||
|
||||
export const ProgressBar: FC<IProps> = ({ value }) => {
|
||||
const ProgressBar: FC<IProps> = ({ value }) => {
|
||||
// const styleString: CSSProperties = { width: `${value}%` };
|
||||
// let barColor: string = "green";
|
||||
|
||||
|
|
@ -43,3 +42,5 @@ export const ProgressBar: FC<IProps> = ({ value }) => {
|
|||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default ProgressBar;
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ type IProps = {
|
|||
// })
|
||||
// );
|
||||
|
||||
export const ProgressInfo: FC<IProps> = ({
|
||||
const ProgressInfo: FC<IProps> = ({
|
||||
tasksDone,
|
||||
tasksTotalCount,
|
||||
remainingDays,
|
||||
|
|
@ -39,3 +39,5 @@ export const ProgressInfo: FC<IProps> = ({
|
|||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default ProgressInfo;
|
||||
|
|
|
|||
|
|
@ -2,20 +2,17 @@ import React from "react";
|
|||
import Avatar from "@material-ui/core/Avatar";
|
||||
import Button from "@material-ui/core/Button";
|
||||
import CssBaseline from "@material-ui/core/CssBaseline";
|
||||
import TextField from "@material-ui/core/TextField";
|
||||
import FormControlLabel from "@material-ui/core/FormControlLabel";
|
||||
import Checkbox from "@material-ui/core/Checkbox";
|
||||
import Link from "@material-ui/core/Link";
|
||||
import Paper from "@material-ui/core/Paper";
|
||||
import Grid from "@material-ui/core/Grid";
|
||||
import LockOutlinedIcon from "@material-ui/icons/LockOutlined";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
import { makeStyles, createStyles, Theme } from "@material-ui/core/styles";
|
||||
import { useAuth0 } from "../authentication/auth0";
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) =>
|
||||
createStyles({
|
||||
root: {
|
||||
height: "100vh"
|
||||
height: "100vh",
|
||||
},
|
||||
image: {
|
||||
backgroundImage: "url(https://source.unsplash.com/daily?dev)",
|
||||
|
|
@ -25,30 +22,31 @@ const useStyles = makeStyles((theme: Theme) =>
|
|||
? theme.palette.grey[50]
|
||||
: theme.palette.grey[900],
|
||||
backgroundSize: "cover",
|
||||
backgroundPosition: "center"
|
||||
backgroundPosition: "center",
|
||||
},
|
||||
paper: {
|
||||
margin: theme.spacing(8, 4),
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
alignItems: "center"
|
||||
alignItems: "center",
|
||||
},
|
||||
avatar: {
|
||||
margin: theme.spacing(1),
|
||||
backgroundColor: theme.palette.secondary.main
|
||||
backgroundColor: theme.palette.secondary.main,
|
||||
},
|
||||
form: {
|
||||
width: "100%",
|
||||
marginTop: theme.spacing(1)
|
||||
marginTop: theme.spacing(1),
|
||||
},
|
||||
submit: {
|
||||
margin: theme.spacing(3, 0, 2)
|
||||
}
|
||||
margin: theme.spacing(3, 0, 2),
|
||||
},
|
||||
})
|
||||
);
|
||||
|
||||
export default function SignInSide() {
|
||||
const classes = useStyles();
|
||||
const { loginWithRedirect } = useAuth0();
|
||||
|
||||
return (
|
||||
<Grid container component="main" className={classes.root}>
|
||||
|
|
@ -63,53 +61,16 @@ export default function SignInSide() {
|
|||
Sign in
|
||||
</Typography>
|
||||
<form className={classes.form} noValidate>
|
||||
<TextField
|
||||
variant="outlined"
|
||||
margin="normal"
|
||||
required
|
||||
fullWidth
|
||||
id="email"
|
||||
label="Email Address"
|
||||
name="email"
|
||||
autoComplete="email"
|
||||
autoFocus
|
||||
/>
|
||||
<TextField
|
||||
variant="outlined"
|
||||
margin="normal"
|
||||
required
|
||||
fullWidth
|
||||
name="password"
|
||||
label="Password"
|
||||
type="password"
|
||||
id="password"
|
||||
autoComplete="current-password"
|
||||
/>
|
||||
<FormControlLabel
|
||||
control={<Checkbox value="remember" color="primary" />}
|
||||
label="Remember me"
|
||||
/>
|
||||
<Button
|
||||
type="submit"
|
||||
fullWidth
|
||||
variant="contained"
|
||||
color="primary"
|
||||
className={classes.submit}
|
||||
onClick={() => loginWithRedirect({})}
|
||||
>
|
||||
Sign In
|
||||
</Button>
|
||||
<Grid container>
|
||||
<Grid item xs>
|
||||
<Link href="#" variant="body2">
|
||||
Forgot password?
|
||||
</Link>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Link href="#" variant="body2">
|
||||
{"Don't have an account? Sign Up"}
|
||||
</Link>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</form>
|
||||
</div>
|
||||
</Grid>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import React, { FC } from "react";
|
||||
import { Header } from "../components/Header";
|
||||
import { UserAvatar } from "./Avatars/UserAvatar";
|
||||
import Header from "../components/Header";
|
||||
import UserAvatar from "./Avatars/UserAvatar";
|
||||
import {
|
||||
Grid,
|
||||
// makeStyles, Theme
|
||||
|
|
@ -19,7 +19,7 @@ interface IProps {
|
|||
// },
|
||||
// }));
|
||||
|
||||
export const UserHeader: FC<IProps> = ({ fullName, presentation, picture }) => {
|
||||
const UserHeader: FC<IProps> = ({ fullName, presentation, picture }) => {
|
||||
// const classes = useStyles();
|
||||
return (
|
||||
// <div className={classes.root}>
|
||||
|
|
@ -34,3 +34,5 @@ export const UserHeader: FC<IProps> = ({ fullName, presentation, picture }) => {
|
|||
// </div>
|
||||
);
|
||||
};
|
||||
|
||||
export default UserHeader;
|
||||
|
|
|
|||
7
client/src/constants/routes.ts
Normal file
7
client/src/constants/routes.ts
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
export const HOME: string = "/";
|
||||
export const PROJECTS: string = "/projects";
|
||||
export const TICKETS: string = "/tickets";
|
||||
export const USERS: string = "/users";
|
||||
export const SIGN_IN: string = "/signin";
|
||||
export const NOT_FOUND: string = "/404";
|
||||
export const TEST: string = "/test";
|
||||
|
|
@ -5,7 +5,7 @@ interface IProps {
|
|||
error: string;
|
||||
}
|
||||
|
||||
export const ErrorController: FC<IProps> = ({ error }) => {
|
||||
const ErrorController: FC<IProps> = ({ error }) => {
|
||||
switch (error) {
|
||||
case "Bad Request":
|
||||
return <Redirect to="/400" />;
|
||||
|
|
@ -20,3 +20,5 @@ export const ErrorController: FC<IProps> = ({ error }) => {
|
|||
return <Redirect to="/404" />;
|
||||
}
|
||||
};
|
||||
|
||||
export default ErrorController;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
import React, { FC } from "react";
|
||||
import { HomePage } from "../pages/HomePage";
|
||||
import HomePage from "../pages/HomePage";
|
||||
|
||||
export const HomeController: FC = () => {
|
||||
const HomeController: FC = () => {
|
||||
return <HomePage />;
|
||||
};
|
||||
|
||||
export default HomeController;
|
||||
|
|
|
|||
|
|
@ -1,16 +1,15 @@
|
|||
import React, { FC, useState, useEffect } from "react";
|
||||
import { useParams } from "react-router-dom";
|
||||
import { ErrorController } from "./ErrorController";
|
||||
import { ProjectPage } from "../pages/ProjectPage";
|
||||
import ErrorController from "./ErrorController";
|
||||
import ProjectPage from "../pages/ProjectPage";
|
||||
import ProjectVM from "../VM/ProjectVM";
|
||||
import { Project } from "../types/Project";
|
||||
import { HttpResponse } from "../types/HttpResponse";
|
||||
import { Preloader } from "../components/Preloader";
|
||||
import { Constants } from "../utils/Constants";
|
||||
import { get } from "../utils/http";
|
||||
import { User } from "../types/User";
|
||||
import Project from "../types/Project";
|
||||
import User from "../types/User";
|
||||
import Preloader from "../components/Preloader";
|
||||
import { ProjectService, UserService } from "../services";
|
||||
import { useAuth0 } from "../authentication/auth0";
|
||||
|
||||
export const ProjectController: FC = () => {
|
||||
const ProjectController: FC = () => {
|
||||
const [project, setProject] = useState<Project>({} as Project);
|
||||
const [allUsers, setAllUsers] = useState<User[]>([]);
|
||||
const [allProjects, setAllProjects] = useState<Project[]>([]);
|
||||
|
|
@ -18,61 +17,62 @@ export const ProjectController: FC = () => {
|
|||
const [hasError, setHasError] = useState(false);
|
||||
const [error, setError] = useState("");
|
||||
const { id } = useParams();
|
||||
const { getTokenSilently } = useAuth0();
|
||||
|
||||
async function httpGetProjects(id: string): Promise<void> {
|
||||
useEffect(() => {
|
||||
const getProject = async (id: string): Promise<void> => {
|
||||
const token = await getTokenSilently();
|
||||
try {
|
||||
const response: HttpResponse<Project> = await get<Project>(
|
||||
`${Constants.projectsURI}/${id}`
|
||||
);
|
||||
if (response.parsedBody !== undefined) {
|
||||
setProject(response.parsedBody);
|
||||
const Projects = new ProjectService(token);
|
||||
const project: Project = await Projects.get(id);
|
||||
if (project !== undefined) {
|
||||
setProject(project);
|
||||
setIsLoading(false);
|
||||
}
|
||||
} catch (ex) {
|
||||
console.error(ex);
|
||||
setHasError(true);
|
||||
setError(ex);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
async function httpGetAllUsers(): Promise<void> {
|
||||
const getAllUsers = async (): Promise<void> => {
|
||||
const token = await getTokenSilently();
|
||||
try {
|
||||
const response: HttpResponse<User> = await get<User>(
|
||||
`${Constants.usersURI}`
|
||||
);
|
||||
if (response.parsedBody !== undefined) {
|
||||
setAllUsers((response.parsedBody as unknown) as User[]);
|
||||
const Users = new UserService(token);
|
||||
const response: User[] = await Users.all();
|
||||
if (response !== undefined) {
|
||||
setAllUsers(response);
|
||||
setIsLoading(false);
|
||||
}
|
||||
} catch (ex) {
|
||||
setHasError(true);
|
||||
setError(ex);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
async function httpGetAllProjects(): Promise<void> {
|
||||
const getAllProjects = async (): Promise<void> => {
|
||||
const token = await getTokenSilently();
|
||||
try {
|
||||
const response: HttpResponse<Project> = await get<Project>(
|
||||
`${Constants.projectsURI}`
|
||||
);
|
||||
if (response.parsedBody !== undefined) {
|
||||
setAllProjects((response.parsedBody as unknown) as Project[]);
|
||||
const Projects = new ProjectService(token);
|
||||
const response: Project[] = await Projects.all();
|
||||
if (response !== undefined) {
|
||||
setAllProjects(response);
|
||||
}
|
||||
} catch (ex) {
|
||||
setHasError(true);
|
||||
setError(ex);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (id !== undefined) {
|
||||
httpGetProjects(id);
|
||||
httpGetAllUsers();
|
||||
httpGetAllProjects();
|
||||
getProject(id);
|
||||
getAllUsers();
|
||||
getAllProjects();
|
||||
} else {
|
||||
setHasError(true);
|
||||
setError("Bad Request");
|
||||
}
|
||||
}, [id]);
|
||||
}, [id, getTokenSilently]);
|
||||
|
||||
if (hasError) {
|
||||
return <ErrorController error={error} />;
|
||||
|
|
@ -81,3 +81,5 @@ export const ProjectController: FC = () => {
|
|||
const viewModel = new ProjectVM(project, allUsers, allProjects);
|
||||
return isLoading ? <Preloader /> : <ProjectPage viewModel={viewModel} />;
|
||||
};
|
||||
|
||||
export default ProjectController;
|
||||
|
|
|
|||
|
|
@ -1,45 +1,44 @@
|
|||
import React, { FC, useState, useEffect } from "react";
|
||||
import { useParams } from "react-router-dom";
|
||||
import { TicketPage } from "../pages/TicketPage";
|
||||
import { ErrorController } from "./ErrorController";
|
||||
import { HttpResponse } from "../types/HttpResponse";
|
||||
import { Preloader } from "../components/Preloader";
|
||||
import { get } from "../utils/http";
|
||||
import { Constants } from "../utils/Constants";
|
||||
import { Ticket } from "../types/Ticket";
|
||||
import { TicketVM } from "../VM/TicketVM";
|
||||
import ErrorController from "./ErrorController";
|
||||
import TicketPage from "../pages/TicketPage";
|
||||
import TicketVM from "../VM/TicketVM";
|
||||
import Ticket from "../types/Ticket";
|
||||
import Preloader from "../components/Preloader";
|
||||
import { useAuth0 } from "../authentication/auth0";
|
||||
import { TicketService } from "../services";
|
||||
|
||||
export const TicketController: FC = () => {
|
||||
const TicketController: FC = () => {
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [ticket, setTicket] = useState<Ticket>({} as Ticket);
|
||||
const [hasError, setHasError] = useState(false);
|
||||
const [error, setError] = useState("");
|
||||
const { id } = useParams();
|
||||
const { getTokenSilently } = useAuth0();
|
||||
|
||||
async function httpGetTicket(id: string): Promise<void> {
|
||||
useEffect(() => {
|
||||
const getTicket = async (id: string): Promise<void> => {
|
||||
const token = await getTokenSilently();
|
||||
try {
|
||||
const response: HttpResponse<Ticket> = await get<Ticket>(
|
||||
`${Constants.ticketsURI}/${id}`
|
||||
);
|
||||
if (response.parsedBody !== undefined) {
|
||||
setTicket(response.parsedBody);
|
||||
const Tickets = new TicketService(token);
|
||||
const response: Ticket = await Tickets.get(id);
|
||||
if (response !== undefined) {
|
||||
setTicket(response);
|
||||
setIsLoading(false);
|
||||
}
|
||||
} catch (ex) {
|
||||
console.error(ex);
|
||||
setHasError(true);
|
||||
setError(ex);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (id !== undefined) {
|
||||
httpGetTicket(id);
|
||||
getTicket(id);
|
||||
} else {
|
||||
setHasError(true);
|
||||
setError("Bad Request");
|
||||
}
|
||||
}, [id]);
|
||||
}, [id, getTokenSilently]);
|
||||
|
||||
if (hasError) {
|
||||
return <ErrorController error={error} />;
|
||||
|
|
@ -48,3 +47,5 @@ export const TicketController: FC = () => {
|
|||
const viewModel = new TicketVM(ticket);
|
||||
return isLoading ? <Preloader /> : <TicketPage viewModel={viewModel} />;
|
||||
};
|
||||
|
||||
export default TicketController;
|
||||
|
|
|
|||
|
|
@ -1,66 +1,75 @@
|
|||
import React, { FC, useState, useEffect } from "react";
|
||||
import { useParams } from "react-router-dom";
|
||||
import { UserPage } from "../pages/UserPage";
|
||||
import ErrorController from "./ErrorController";
|
||||
import UserPage from "../pages/UserPage";
|
||||
import { UserVM } from "../VM/UserVM";
|
||||
import { User } from "../types/User";
|
||||
import { HttpResponse } from "../types/HttpResponse";
|
||||
import { Preloader } from "../components/Preloader";
|
||||
import { get } from "../utils/http";
|
||||
import { Constants } from "../utils/Constants";
|
||||
import { ErrorController } from "./ErrorController";
|
||||
import User from "../types/User";
|
||||
import Preloader from "../components/Preloader";
|
||||
import { UserService } from "../services";
|
||||
import { useAuth0 } from "../authentication/auth0";
|
||||
import { getUID } from "../authentication/helpers";
|
||||
|
||||
export const UserController: FC = () => {
|
||||
const UserController: FC = () => {
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [user, setUser] = useState<User>({} as User);
|
||||
const [account, setAccount] = useState<User>({} as User);
|
||||
const [hasError, setHasError] = useState(false);
|
||||
const [error, setError] = useState("");
|
||||
const [allUsers, setAllUsers] = useState<User[]>([]);
|
||||
const { id } = useParams();
|
||||
|
||||
async function httpGetUser(id: string): Promise<void> {
|
||||
try {
|
||||
const response: HttpResponse<User> = await get<User>(
|
||||
`${Constants.usersURI}/${id}`
|
||||
);
|
||||
if (response.parsedBody !== undefined) {
|
||||
setUser(response.parsedBody);
|
||||
setIsLoading(false);
|
||||
}
|
||||
} catch (ex) {
|
||||
console.error(ex);
|
||||
setHasError(true);
|
||||
setError(ex);
|
||||
}
|
||||
}
|
||||
|
||||
async function httpGetAllUsers(): Promise<void> {
|
||||
try {
|
||||
const response: HttpResponse<User> = await get<User>(
|
||||
`${Constants.usersURI}`
|
||||
);
|
||||
if (response.parsedBody !== undefined) {
|
||||
setAllUsers((response.parsedBody as unknown) as User[]);
|
||||
}
|
||||
} catch (ex) {
|
||||
setHasError(true);
|
||||
setError(ex);
|
||||
}
|
||||
}
|
||||
const { getTokenSilently, user } = useAuth0();
|
||||
|
||||
useEffect(() => {
|
||||
const getUser = async (id: string): Promise<void> => {
|
||||
const token = await getTokenSilently();
|
||||
const Users = new UserService(token);
|
||||
let response: User | undefined;
|
||||
|
||||
try {
|
||||
response = await Users.get(id);
|
||||
} catch (ex) {
|
||||
if (ex === "Not Found") {
|
||||
// create user
|
||||
const { given_name, family_name, email, nickname, picture } = user;
|
||||
const newUser: User = {
|
||||
id: getUID(user),
|
||||
firstName: given_name,
|
||||
lastName: family_name,
|
||||
fullName: `${given_name} ${family_name}`,
|
||||
email,
|
||||
presentation: nickname,
|
||||
picture,
|
||||
phone: "",
|
||||
creationDate: Date.now().toLocaleString(),
|
||||
activities: [],
|
||||
projects: [],
|
||||
tickets: [],
|
||||
};
|
||||
response = await Users.add(newUser);
|
||||
} else {
|
||||
setHasError(true);
|
||||
setError(ex);
|
||||
}
|
||||
} finally {
|
||||
if (response !== undefined) {
|
||||
setAccount(response);
|
||||
setIsLoading(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
if (id !== undefined) {
|
||||
httpGetUser(id);
|
||||
httpGetAllUsers();
|
||||
getUser(id);
|
||||
} else {
|
||||
setHasError(true);
|
||||
setError("Bad Request");
|
||||
}
|
||||
}, [id]);
|
||||
}, [id, getTokenSilently, user]);
|
||||
|
||||
if (hasError) {
|
||||
return <ErrorController error={error} />;
|
||||
}
|
||||
|
||||
const viewModel = new UserVM(user, allUsers);
|
||||
const viewModel = new UserVM(account);
|
||||
return isLoading ? <Preloader /> : <UserPage viewModel={viewModel} />;
|
||||
};
|
||||
|
||||
export default UserController;
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import { Auth0Provider } from "./authentication/auth0";
|
|||
import config from "./authentication/config.json";
|
||||
import history from "./utils/history";
|
||||
|
||||
const onRedirectCallback = appState => {
|
||||
const onRedirectCallback = (appState) => {
|
||||
history.push(
|
||||
appState && appState.targetUrl
|
||||
? appState.targetUrl
|
||||
|
|
@ -18,6 +18,7 @@ ReactDOM.render(
|
|||
<Auth0Provider
|
||||
domain={config.domain}
|
||||
client_id={config.clientId}
|
||||
audience={config.audience}
|
||||
redirect_uri={window.location.origin}
|
||||
onRedirectCallback={onRedirectCallback}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -1,23 +1,7 @@
|
|||
import React from "react";
|
||||
// import { LogInForm } from "../components/LogInForm";
|
||||
// import { ProfileSelector } from "../components/ProfileSelector";
|
||||
import SignInSide from "../components/SignInSide";
|
||||
import React, { FC } from "react";
|
||||
|
||||
export const HomePage: React.FC = () => {
|
||||
return (
|
||||
// <div className="section">
|
||||
// <div className="container center">
|
||||
// <h1 className="center">Ticket Manager</h1>
|
||||
// <div className="row">
|
||||
// <div className="col s6">
|
||||
// <ProfileSelector />
|
||||
// </div>
|
||||
// <div className="col s6">
|
||||
// <LogInForm />
|
||||
// </div>
|
||||
// </div>
|
||||
// </div>
|
||||
// </div>
|
||||
<SignInSide />
|
||||
);
|
||||
const HomePage: FC = () => {
|
||||
return <div>HomePage</div>;
|
||||
};
|
||||
|
||||
export default HomePage;
|
||||
|
|
|
|||
|
|
@ -1,9 +1,8 @@
|
|||
import React, { FC } from "react";
|
||||
import PageLayout from "../layouts/PageLayout";
|
||||
import { Header } from "../components/Header";
|
||||
import Header from "../components/Header";
|
||||
|
||||
interface IProps {}
|
||||
export const NotFoundPage: FC<IProps> = () => {
|
||||
const NotFoundPage: FC = () => {
|
||||
return (
|
||||
<PageLayout
|
||||
header={<Header title="Error page" description="Something went wrong" />}
|
||||
|
|
@ -11,3 +10,5 @@ export const NotFoundPage: FC<IProps> = () => {
|
|||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default NotFoundPage;
|
||||
|
|
|
|||
|
|
@ -1,14 +1,14 @@
|
|||
import React, { FC, useState } from "react";
|
||||
import { Grid, makeStyles, Theme } from "@material-ui/core";
|
||||
import { Header } from "../components/Header";
|
||||
import { AvatarList } from "../components/Avatars/AvatarList";
|
||||
import { ProgressBar } from "../components/Progress/ProgressBar";
|
||||
import { FloatingButton } from "../components/Buttons/FloatingButton";
|
||||
import { UsersModal } from "../components/Modals/UsersModal";
|
||||
import { ProjectTabPanel } from "../components/Panels/ProjectTabPanel";
|
||||
import Header from "../components/Header";
|
||||
import AvatarList from "../components/Avatars/AvatarList";
|
||||
import ProgressBar from "../components/Progress/ProgressBar";
|
||||
import FloatingButton from "../components/Buttons/FloatingButton";
|
||||
import UsersModal from "../components/Modals/UsersModal";
|
||||
import ProjectTabPanel from "../components/Panels/ProjectTabPanel";
|
||||
import ProgressInfo from "../components/Progress/ProgressInfo";
|
||||
import ProjectVM from "../VM/ProjectVM";
|
||||
import PageLayout from "../layouts/PageLayout";
|
||||
import { ProgressInfo } from "../components/Progress/ProgressInfo";
|
||||
|
||||
interface IProps {
|
||||
viewModel: ProjectVM;
|
||||
|
|
@ -22,7 +22,7 @@ const useStyles = makeStyles((theme: Theme) => ({
|
|||
},
|
||||
}));
|
||||
|
||||
export const ProjectPage: FC<IProps> = ({ viewModel }) => {
|
||||
const ProjectPage: FC<IProps> = ({ viewModel }) => {
|
||||
const {
|
||||
// id,
|
||||
title,
|
||||
|
|
@ -97,3 +97,5 @@ export const ProjectPage: FC<IProps> = ({ viewModel }) => {
|
|||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default ProjectPage;
|
||||
|
|
|
|||
20
client/src/pages/SigninPage.tsx
Normal file
20
client/src/pages/SigninPage.tsx
Normal file
|
|
@ -0,0 +1,20 @@
|
|||
import React, { FC } from "react";
|
||||
import { Redirect } from "react-router-dom";
|
||||
import SignInSide from "../components/SignInSide";
|
||||
import { useAuth0 } from "../authentication/auth0";
|
||||
import { getUID } from "../authentication/helpers";
|
||||
import * as ROUTES from "../constants/routes";
|
||||
|
||||
const SigninPage: FC = () => {
|
||||
const { isAuthenticated, user } = useAuth0();
|
||||
|
||||
if (isAuthenticated) {
|
||||
// retrieve userId
|
||||
const uid = getUID(user);
|
||||
return <Redirect to={`${ROUTES.USERS}/${uid}`} />;
|
||||
} else {
|
||||
return <SignInSide />;
|
||||
}
|
||||
};
|
||||
|
||||
export default SigninPage;
|
||||
|
|
@ -2,12 +2,12 @@ import React, { FC } from "react";
|
|||
import { Link } from "react-router-dom";
|
||||
import { makeStyles, Theme, Grid, Typography } from "@material-ui/core";
|
||||
import { Timer } from "@material-ui/icons";
|
||||
import TicketVM from "../VM/TicketVM";
|
||||
import PageLayout from "../layouts/PageLayout";
|
||||
import { TicketVM } from "../VM/TicketVM";
|
||||
import { Header } from "../components/Header";
|
||||
import { AvatarList } from "../components/Avatars/AvatarList";
|
||||
import Header from "../components/Header";
|
||||
import AvatarList from "../components/Avatars/AvatarList";
|
||||
import TicketChipsArray from "../components/Cards/TicketChipsArray";
|
||||
import { getRemainingdays } from "../utils/methods";
|
||||
import getRemainingdays from "../utils/methods";
|
||||
|
||||
interface IProps {
|
||||
viewModel: TicketVM;
|
||||
|
|
@ -16,7 +16,6 @@ interface IProps {
|
|||
const useStyles = makeStyles((theme: Theme) => ({
|
||||
root: {
|
||||
margin: theme.spacing(1),
|
||||
// flexGrow: 1,
|
||||
},
|
||||
table: {
|
||||
margin: "auto",
|
||||
|
|
@ -28,7 +27,7 @@ const useStyles = makeStyles((theme: Theme) => ({
|
|||
},
|
||||
}));
|
||||
|
||||
export const TicketPage: FC<IProps> = ({ viewModel }) => {
|
||||
const TicketPage: FC<IProps> = ({ viewModel }) => {
|
||||
const {
|
||||
title,
|
||||
description,
|
||||
|
|
@ -133,3 +132,5 @@ export const TicketPage: FC<IProps> = ({ viewModel }) => {
|
|||
// </TableContainer>
|
||||
// );
|
||||
// };
|
||||
|
||||
export default TicketPage;
|
||||
|
|
|
|||
|
|
@ -1,22 +1,15 @@
|
|||
import React, { FC } from "react";
|
||||
import { UserVM } from "../VM/UserVM";
|
||||
import { UserHeader } from "../components/UserHeader";
|
||||
import { UserTabPanel } from "../components/Panels/UserTabPanel";
|
||||
import UserHeader from "../components/UserHeader";
|
||||
import UserTabPanel from "../components/Panels/UserTabPanel";
|
||||
import PageLayout from "../layouts/PageLayout";
|
||||
|
||||
interface IProps {
|
||||
viewModel: UserVM;
|
||||
}
|
||||
|
||||
export const UserPage: FC<IProps> = ({ viewModel }) => {
|
||||
const {
|
||||
fullName,
|
||||
presentation,
|
||||
picture,
|
||||
projects,
|
||||
tickets,
|
||||
allUsers,
|
||||
} = viewModel;
|
||||
const UserPage: FC<IProps> = ({ viewModel }) => {
|
||||
const { fullName, presentation, picture, projects, tickets } = viewModel;
|
||||
const tabNames: string[] = ["Projects", "Tickets"];
|
||||
|
||||
return (
|
||||
|
|
@ -33,9 +26,10 @@ export const UserPage: FC<IProps> = ({ viewModel }) => {
|
|||
tabNames={tabNames}
|
||||
projects={projects}
|
||||
tickets={tickets}
|
||||
allUsers={allUsers}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default UserPage;
|
||||
|
|
|
|||
33
client/src/routes/AppRouter.tsx
Normal file
33
client/src/routes/AppRouter.tsx
Normal file
|
|
@ -0,0 +1,33 @@
|
|||
import React from "react";
|
||||
import { Route, Switch } from "react-router-dom";
|
||||
import PrivateRoute from "./PrivateRoute";
|
||||
import HomeController from "../controllers/HomeController";
|
||||
import ProjectController from "../controllers/ProjectController";
|
||||
import UserController from "../controllers/UserController";
|
||||
import TicketController from "../controllers/TicketController";
|
||||
import NotFoundPage from "../pages/NotFoundPage";
|
||||
import TestPage from "../pages/TestPage";
|
||||
import SigninPage from "../pages/SigninPage";
|
||||
import * as ROUTES from "../constants/routes";
|
||||
|
||||
const AppRouter = () => {
|
||||
return (
|
||||
<Switch>
|
||||
<PrivateRoute path={ROUTES.TEST} component={TestPage} />
|
||||
<Route exact path={ROUTES.HOME} component={HomeController} />
|
||||
<Route path={ROUTES.SIGN_IN} component={SigninPage} />
|
||||
<PrivateRoute
|
||||
path={`${ROUTES.PROJECTS}/:id`}
|
||||
component={ProjectController}
|
||||
/>
|
||||
<PrivateRoute
|
||||
path={`${ROUTES.TICKETS}/:id`}
|
||||
component={TicketController}
|
||||
/>
|
||||
<PrivateRoute path={`${ROUTES.USERS}/:id`} component={UserController} />
|
||||
<Route path={ROUTES.NOT_FOUND} component={NotFoundPage} />
|
||||
</Switch>
|
||||
);
|
||||
};
|
||||
|
||||
export default AppRouter;
|
||||
|
|
@ -2,7 +2,7 @@ import React, { useEffect } from "react";
|
|||
import { Route } from "react-router-dom";
|
||||
import { useAuth0 } from "../authentication/auth0";
|
||||
|
||||
export const PrivateRoute = ({ component: Component, path, ...rest }) => {
|
||||
const PrivateRoute = ({ component: Component, path, ...rest }) => {
|
||||
const { loading, isAuthenticated, loginWithRedirect } = useAuth0();
|
||||
|
||||
useEffect(() => {
|
||||
|
|
@ -11,14 +11,16 @@ export const PrivateRoute = ({ component: Component, path, ...rest }) => {
|
|||
}
|
||||
const fn = async () => {
|
||||
await loginWithRedirect({
|
||||
appState: { targetUrl: window.location.pathname }
|
||||
appState: { targetUrl: window.location.pathname },
|
||||
});
|
||||
};
|
||||
fn();
|
||||
}, [loading, isAuthenticated, loginWithRedirect, path]);
|
||||
|
||||
const render = props =>
|
||||
const render = (props) =>
|
||||
isAuthenticated === true ? <Component {...props} /> : null;
|
||||
|
||||
return <Route path={path} render={render} {...rest} />;
|
||||
};
|
||||
|
||||
export default PrivateRoute;
|
||||
72
client/src/services/http.ts
Normal file
72
client/src/services/http.ts
Normal file
|
|
@ -0,0 +1,72 @@
|
|||
import HttpResponse from "../types/HttpResponse";
|
||||
|
||||
export default class HttpHandler<T> {
|
||||
private newHeaders = async (token: string) => {
|
||||
// const { getTokenSilently } = useAuth0();
|
||||
// const token = await getTokenSilently();
|
||||
|
||||
return new Headers({
|
||||
Accept: "application/json",
|
||||
"Content-Type": "application/json",
|
||||
Authorization: `Bearer ${token}`,
|
||||
});
|
||||
};
|
||||
|
||||
private execute = async (request: RequestInfo): Promise<HttpResponse<T>> => {
|
||||
const response: HttpResponse<T> = await fetch(request);
|
||||
try {
|
||||
response.parsedBody = await response.json();
|
||||
} catch (ex) {}
|
||||
if (!response.ok) {
|
||||
throw response.statusText;
|
||||
}
|
||||
return response;
|
||||
};
|
||||
|
||||
get = async (path: string, token: string): Promise<HttpResponse<T>> => {
|
||||
const args: RequestInit = {
|
||||
method: "get",
|
||||
headers: await this.newHeaders(token),
|
||||
};
|
||||
return await this.execute(new Request(path, args));
|
||||
};
|
||||
|
||||
post = async (
|
||||
path: string,
|
||||
body: any,
|
||||
token: string
|
||||
): Promise<HttpResponse<T>> => {
|
||||
const args: RequestInit = {
|
||||
method: "post",
|
||||
headers: await this.newHeaders(token),
|
||||
body: JSON.stringify(body),
|
||||
};
|
||||
return await this.execute(new Request(path, args));
|
||||
};
|
||||
|
||||
put = async (
|
||||
path: string,
|
||||
body: any,
|
||||
token: string
|
||||
): Promise<HttpResponse<T>> => {
|
||||
const args: RequestInit = {
|
||||
method: "put",
|
||||
headers: await this.newHeaders(token),
|
||||
body: JSON.stringify(body),
|
||||
};
|
||||
return await this.execute(new Request(path, args));
|
||||
};
|
||||
|
||||
patch = async (
|
||||
path: string,
|
||||
body: any,
|
||||
token: string
|
||||
): Promise<HttpResponse<T>> => {
|
||||
const args: RequestInit = {
|
||||
method: "patch",
|
||||
headers: await this.newHeaders(token),
|
||||
body: JSON.stringify(body),
|
||||
};
|
||||
return await this.execute(new Request(path, args));
|
||||
};
|
||||
}
|
||||
13
client/src/services/index.ts
Normal file
13
client/src/services/index.ts
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
import ProjectService from "./project";
|
||||
import TicketService from "./ticket";
|
||||
import UserService from "./user";
|
||||
|
||||
export default interface IService<T> {
|
||||
all(): Promise<T[]>;
|
||||
get(id: string): Promise<T>;
|
||||
add(item: any): Promise<T>;
|
||||
update(id: string, item: T): Promise<void>;
|
||||
delete(id: string): Promise<void>;
|
||||
}
|
||||
|
||||
export { ProjectService, TicketService, UserService };
|
||||
44
client/src/services/project.ts
Normal file
44
client/src/services/project.ts
Normal file
|
|
@ -0,0 +1,44 @@
|
|||
import IService from ".";
|
||||
import Project from "../types/Project";
|
||||
import HttpHandler from "./http";
|
||||
|
||||
interface NewProject {
|
||||
title: string;
|
||||
description: string;
|
||||
endingDate: string;
|
||||
managerId: string;
|
||||
}
|
||||
export default class ProjectService implements IService<Project> {
|
||||
constructor(private key: string) {}
|
||||
|
||||
private http = new HttpHandler<Project>();
|
||||
private path: string = "/api/v1/projects";
|
||||
|
||||
all = async (): Promise<Project[]> => {
|
||||
const response = await this.http.get(this.path, this.key);
|
||||
return (response.parsedBody as unknown) as Project[];
|
||||
};
|
||||
|
||||
get = async (id: string): Promise<Project> => {
|
||||
const response = await this.http.get(`${this.path}/${id}`, this.key);
|
||||
const body = response.parsedBody;
|
||||
return body ?? ({} as Project);
|
||||
};
|
||||
|
||||
add = async (item: NewProject): Promise<Project> => {
|
||||
const response = await this.http.post(this.path, item, this.key);
|
||||
const body = response.parsedBody;
|
||||
return body ?? ({} as Project);
|
||||
};
|
||||
|
||||
update(id: string, item: Project): Promise<void> {
|
||||
throw new Error("Method not implemented.");
|
||||
}
|
||||
delete(id: string): Promise<void> {
|
||||
throw new Error("Method not implemented.");
|
||||
}
|
||||
|
||||
setMembers = async (id: string, members: string[]): Promise<void> => {
|
||||
await this.http.patch(`${this.path}/${id}/members`, members, this.key);
|
||||
};
|
||||
}
|
||||
50
client/src/services/ticket.ts
Normal file
50
client/src/services/ticket.ts
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
import IService from ".";
|
||||
import Ticket from "../types/Ticket";
|
||||
import HttpHandler from "./http";
|
||||
|
||||
interface NewTicket {
|
||||
title: string;
|
||||
description: string;
|
||||
endingDate: string;
|
||||
creatorId: string;
|
||||
projectId: number;
|
||||
impact: number;
|
||||
difficulty: number;
|
||||
category: number;
|
||||
}
|
||||
|
||||
export default class TicketService implements IService<Ticket> {
|
||||
constructor(private key: string) {}
|
||||
|
||||
private http = new HttpHandler<Ticket>();
|
||||
private path: string = "/api/v1/tickets";
|
||||
|
||||
all = async (): Promise<Ticket[]> => {
|
||||
const response = await this.http.get(this.path, this.key);
|
||||
return (response.parsedBody as unknown) as Ticket[];
|
||||
};
|
||||
|
||||
get = async (id: string): Promise<Ticket> => {
|
||||
const response = await this.http.get(`${this.path}/${id}`, this.key);
|
||||
const body = response.parsedBody;
|
||||
return body ?? ({} as Ticket);
|
||||
};
|
||||
|
||||
add = async (item: NewTicket): Promise<Ticket> => {
|
||||
const response = await this.http.post(this.path, item, this.key);
|
||||
const body = response.parsedBody;
|
||||
return body ?? ({} as Ticket);
|
||||
};
|
||||
|
||||
update(id: string, item: Ticket): Promise<void> {
|
||||
throw new Error("Method not implemented.");
|
||||
}
|
||||
|
||||
delete(id: string): Promise<void> {
|
||||
throw new Error("Method not implemented.");
|
||||
}
|
||||
|
||||
close = async (id: string): Promise<void> => {
|
||||
await this.http.put(`${this.path}/${id}/closed`, {}, this.key);
|
||||
};
|
||||
}
|
||||
35
client/src/services/user.ts
Normal file
35
client/src/services/user.ts
Normal file
|
|
@ -0,0 +1,35 @@
|
|||
import IService from ".";
|
||||
import User from "../types/User";
|
||||
import HttpHandler from "./http";
|
||||
|
||||
export default class UserService implements IService<User> {
|
||||
constructor(private key: string) {}
|
||||
|
||||
private http = new HttpHandler<User>();
|
||||
private path: string = "/api/v1/users";
|
||||
|
||||
all = async (): Promise<User[]> => {
|
||||
const response = await this.http.get(this.path, this.key);
|
||||
return (response.parsedBody as unknown) as User[];
|
||||
};
|
||||
|
||||
get = async (id: string): Promise<User> => {
|
||||
const response = await this.http.get(`${this.path}/${id}`, this.key);
|
||||
const body = response.parsedBody;
|
||||
return body ?? ({} as User);
|
||||
};
|
||||
|
||||
add = async (item: User): Promise<User> => {
|
||||
const response = await this.http.post(this.path, item, this.key);
|
||||
const body = response.parsedBody;
|
||||
return body ?? ({} as User);
|
||||
};
|
||||
|
||||
update = async (id: string, item: User): Promise<void> => {
|
||||
throw new Error("Method not implemented.");
|
||||
};
|
||||
|
||||
delete = async (id: string): Promise<void> => {
|
||||
throw new Error("Method not implemented.");
|
||||
};
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
import { User } from "./User";
|
||||
import { Ticket } from "./Ticket";
|
||||
import User from "./User";
|
||||
import Ticket from "./Ticket";
|
||||
|
||||
export interface Activity {
|
||||
export default interface Activity {
|
||||
id: number;
|
||||
description: string;
|
||||
date: Date;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { User } from "./User";
|
||||
import User from "./User";
|
||||
|
||||
export interface AppFile {
|
||||
export default interface AppFile {
|
||||
id: number;
|
||||
name: string;
|
||||
description: string;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
export interface HttpResponse<T> extends Response {
|
||||
export default interface HttpResponse<T> extends Response {
|
||||
parsedBody?: T;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
export interface Note {
|
||||
export default interface Note {
|
||||
Id: number;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
import { Ticket } from "./Ticket";
|
||||
import { User } from "./User";
|
||||
import { AppFile } from "./AppFile";
|
||||
import { Activity } from "./Activity";
|
||||
import AppFile from "./AppFile";
|
||||
import Activity from "./Activity";
|
||||
import Ticket from "./Ticket";
|
||||
import User from "./User";
|
||||
|
||||
export interface Project {
|
||||
export default interface Project {
|
||||
id: number;
|
||||
title: string;
|
||||
description: string;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { Project } from "./Project";
|
||||
import { User } from "./User";
|
||||
import Project from "./Project";
|
||||
import User from "./User";
|
||||
|
||||
export interface Ticket {
|
||||
export default interface Ticket {
|
||||
id: number;
|
||||
title: string;
|
||||
description: string;
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
import { Activity } from "./Activity";
|
||||
import { Project } from "./Project";
|
||||
import { Ticket } from "./Ticket";
|
||||
import Activity from "./Activity";
|
||||
import Project from "./Project";
|
||||
import Ticket from "./Ticket";
|
||||
|
||||
export interface User {
|
||||
export default interface User {
|
||||
id: string;
|
||||
firstName: string;
|
||||
lastName: string;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export class Constants {
|
||||
export default class Constants {
|
||||
static projectsURI: string = "/api/v1/projects";
|
||||
static ticketsURI: string = "/api/v1/tickets";
|
||||
static usersURI: string = "/api/v1/users";
|
||||
|
|
|
|||
|
|
@ -1,2 +1,4 @@
|
|||
import { createBrowserHistory } from "history";
|
||||
export default createBrowserHistory;
|
||||
import * as createHistory from "history";
|
||||
const history = createHistory.createBrowserHistory();
|
||||
|
||||
export default history;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { HttpResponse } from "../types/HttpResponse";
|
||||
import HttpResponse from "../types/HttpResponse";
|
||||
|
||||
export async function http<T>(request: RequestInfo): Promise<HttpResponse<T>> {
|
||||
const response: HttpResponse<T> = await fetch(request);
|
||||
|
|
@ -24,7 +24,7 @@ export async function post<T>(
|
|||
args: RequestInit = {
|
||||
method: "post",
|
||||
headers: headers,
|
||||
body: JSON.stringify(body)
|
||||
body: JSON.stringify(body),
|
||||
}
|
||||
): Promise<HttpResponse<T>> {
|
||||
return await http<T>(new Request(path, args));
|
||||
|
|
@ -36,7 +36,7 @@ export async function put<T>(
|
|||
args: RequestInit = {
|
||||
method: "put",
|
||||
headers: headers,
|
||||
body: JSON.stringify(body)
|
||||
body: JSON.stringify(body),
|
||||
}
|
||||
): Promise<HttpResponse<T>> {
|
||||
return await http<T>(new Request(path, args));
|
||||
|
|
@ -48,7 +48,7 @@ export async function patch<T>(
|
|||
args: RequestInit = {
|
||||
method: "patch",
|
||||
headers: headers,
|
||||
body: JSON.stringify(body)
|
||||
body: JSON.stringify(body),
|
||||
}
|
||||
): Promise<HttpResponse<T>> {
|
||||
return await http<T>(new Request(path, args));
|
||||
|
|
@ -58,5 +58,5 @@ const headers: Headers = new Headers({
|
|||
Accept: "application/json",
|
||||
"Content-Type": "application/json",
|
||||
Authorization:
|
||||
"Bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCIsImtpZCI6Ik1UWkNSRFEzUkRnd1FUQXlNRFExTmtOQ09UQXlSamhGTURaRU1Ea3pNRGxHUkRrelFqZENSZyJ9.eyJpc3MiOiJodHRwczovL2Rldi1meWpydm9oeC5hdXRoMC5jb20vIiwic3ViIjoiR3dlZTlGUnN3ejNWNE5vZFVRTjJIcjJyQjJTMDI1UmZAY2xpZW50cyIsImF1ZCI6Imh0dHBzOi8vbG9jYWxob3N0OjUwMDEvYXBpL1YxLyIsImlhdCI6MTU4NDE5ODQ4MCwiZXhwIjoxNTg0Mjg0ODgwLCJhenAiOiJHd2VlOUZSc3d6M1Y0Tm9kVVFOMkhyMnJCMlMwMjVSZiIsImd0eSI6ImNsaWVudC1jcmVkZW50aWFscyJ9.I1D49ILGBLhnq9biIA0y6Ra93zTKRDJI_rfGvU05MtT1zkI1ZliX9P-7LyKeWBv8tPonB6gT12lJiai_GHBET8kKbXNqwfVvDJ3eqYK-TtTqfL65RfWL9tQfQybHbfuF9M0oiXMqWMqmsc5Umpp4a3bLTQgwkUEKxcdMm84L7zoaqMycns4mFojWpQJKfPa64oZFDIXYy6hPDXcX50Djuk1m-aqMhtpmqkZvPfwEjvtEtGGCTOJHV7uugn3r8Wk4HX02ShrV676GICE1Yw7eHufAbY7yvHz3ImZ1cfEVrRbbijPA2vogXd5RmqNyindDDlT1Y_C80U0DyvhS7P7apQ"
|
||||
"Bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCIsImtpZCI6Ik1UWkNSRFEzUkRnd1FUQXlNRFExTmtOQ09UQXlSamhGTURaRU1Ea3pNRGxHUkRrelFqZENSZyJ9.eyJpc3MiOiJodHRwczovL2Rldi1meWpydm9oeC5hdXRoMC5jb20vIiwic3ViIjoiR3dlZTlGUnN3ejNWNE5vZFVRTjJIcjJyQjJTMDI1UmZAY2xpZW50cyIsImF1ZCI6Imh0dHBzOi8vbG9jYWxob3N0OjUwMDEvYXBpL1YxLyIsImlhdCI6MTU4NDE5ODQ4MCwiZXhwIjoxNTg0Mjg0ODgwLCJhenAiOiJHd2VlOUZSc3d6M1Y0Tm9kVVFOMkhyMnJCMlMwMjVSZiIsImd0eSI6ImNsaWVudC1jcmVkZW50aWFscyJ9.I1D49ILGBLhnq9biIA0y6Ra93zTKRDJI_rfGvU05MtT1zkI1ZliX9P-7LyKeWBv8tPonB6gT12lJiai_GHBET8kKbXNqwfVvDJ3eqYK-TtTqfL65RfWL9tQfQybHbfuF9M0oiXMqWMqmsc5Umpp4a3bLTQgwkUEKxcdMm84L7zoaqMycns4mFojWpQJKfPa64oZFDIXYy6hPDXcX50Djuk1m-aqMhtpmqkZvPfwEjvtEtGGCTOJHV7uugn3r8Wk4HX02ShrV676GICE1Yw7eHufAbY7yvHz3ImZ1cfEVrRbbijPA2vogXd5RmqNyindDDlT1Y_C80U0DyvhS7P7apQ",
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,7 +1,12 @@
|
|||
export const getRemainingdays: (endDate: string) => number = (
|
||||
endDate: string
|
||||
) => {
|
||||
const getRemainingdays: (endDate: string) => number = (endDate: string) => {
|
||||
let endingDate: Date = new Date(endDate);
|
||||
let today: Date = new Date();
|
||||
return Math.abs(endingDate.getDate() - today.getDate());
|
||||
};
|
||||
|
||||
export default getRemainingdays;
|
||||
|
||||
/**
|
||||
* get today date
|
||||
*/
|
||||
export const today = (): string => new Date().toISOString().split("T")[0];
|
||||
|
|
|
|||
|
|
@ -1,37 +0,0 @@
|
|||
import React from "react";
|
||||
import { Route, Switch } from "react-router-dom";
|
||||
import { HomeController } from "../controllers/HomeController";
|
||||
import { ProjectController } from "../controllers/ProjectController";
|
||||
import { UserController } from "../controllers/UserController";
|
||||
import { TicketController } from "../controllers/TicketController";
|
||||
import { NotFoundPage } from "../pages/NotFoundPage";
|
||||
|
||||
export const AppRouter = () => {
|
||||
return (
|
||||
<Switch>
|
||||
{/* <PrivateRoute exact path="/test">
|
||||
<TestPage />
|
||||
</PrivateRoute> */}
|
||||
|
||||
<Route exact path="/">
|
||||
<HomeController />
|
||||
</Route>
|
||||
|
||||
<Route path="/users/:id">
|
||||
<UserController />
|
||||
</Route>
|
||||
|
||||
<Route path="/projects/:id">
|
||||
<ProjectController />
|
||||
</Route>
|
||||
|
||||
<Route path="/tickets/:id">
|
||||
<TicketController />
|
||||
</Route>
|
||||
|
||||
<Route path="/404">
|
||||
<NotFoundPage />
|
||||
</Route>
|
||||
</Switch>
|
||||
);
|
||||
};
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"target": "es5",
|
||||
"target": "es6",
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
|
|
@ -13,7 +13,14 @@
|
|||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "react"
|
||||
"jsx": "react",
|
||||
"sourceMap": true,
|
||||
"declaration": false,
|
||||
"emitDecoratorMetadata": true,
|
||||
"downlevelIteration": true,
|
||||
"experimentalDecorators": true,
|
||||
"importHelpers": true,
|
||||
"typeRoots": ["node_modules/@types"]
|
||||
},
|
||||
"include": ["src"]
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue