Skip to content

Commit

Permalink
finalized add user button
Browse files Browse the repository at this point in the history
  • Loading branch information
Lucasha11 committed Apr 9, 2024
2 parents c998925 + 11d7d54 commit 04b483c
Show file tree
Hide file tree
Showing 29 changed files with 453 additions and 101 deletions.
18 changes: 17 additions & 1 deletion package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 4 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,8 @@
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"lint": "eslint \"src/**/*.{js,jsx,tsx,ts}\" --fix"
"lint": "eslint \"src/**/*.{js,jsx,tsx,ts}\" --fix",
"format": "prettier --write \"src/**/*.{js,jsx,tsx,ts,json,css,scss,md}\""
},
"eslintConfig": {
"extends": [
Expand Down Expand Up @@ -56,6 +57,7 @@
"eslint-plugin-import": "^2.29.1",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^6.1.1",
"eslint-plugin-react": "^7.33.2"
"eslint-plugin-react": "^7.33.2",
"prettier": "^3.2.5"
}
}
14 changes: 11 additions & 3 deletions src/api/apiClient.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,22 @@
import axios, { type AxiosRequestConfig, type Method, type AxiosResponse } from 'axios'
import axios, {
type AxiosRequestConfig,
type Method,
type AxiosResponse
} from 'axios'

const apiClient = axios.create({
baseURL: 'https://auth.api.sitblueprint.com/api',
baseURL: 'https://dev.api.sitblueprint.com/api/v1',
headers: {
Accept: 'application/json',
'Content-type': 'application/json'
}
} satisfies AxiosRequestConfig)

const request = async (method: Method, url: string, params?: unknown): Promise<AxiosResponse> => {
const request = async (
method: Method,
url: string,
params?: unknown
): Promise<AxiosResponse> => {
return await apiClient.request({ method, url, params })
}

Expand Down
36 changes: 36 additions & 0 deletions src/api/lib/team.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import { type AxiosResponse, AxiosError } from 'axios'
import request from '../apiClient'

const API_NAME = 'Blueprint Backend API'
const BASE = '/team/'

export const getAllTeams = async (): Promise<AxiosResponse> => {
try {
const response = await request('GET', BASE + 'all')
return response
} catch (error) {
if (error instanceof AxiosError) {
console.error(`${API_NAME} Error: ${error.message}`, error.response?.data)
throw new Error(`${API_NAME} Error: ${error.response?.status} ${error.response?.data?.error}`)
}
throw new Error('Unknown Error')
}
}

export const getTeam = async (teamId: string): Promise<AxiosResponse> => {
try {
const response = await request('GET', BASE + `user?userId=${teamId}`)
return response
} catch (error) {
if (error instanceof AxiosError) {
console.error(
`${API_NAME} Error: ${error.message}`,
error.response?.data
)
throw new Error(
`${API_NAME} Error: ${error.response?.status} ${error.response?.data?.error}`
)
}
throw new Error('Unknown Error')
}
}
95 changes: 82 additions & 13 deletions src/api/lib/users.tsx
Original file line number Diff line number Diff line change
@@ -1,27 +1,96 @@
import { type AxiosResponse } from 'axios'
import { type AxiosResponse, AxiosError } from 'axios'
import request from '../apiClient'
import type { User } from '../../types/index'

const API_NAME = 'Blueprint Backend API'
const BASE = '/user/'

export const getAllUsers = async (): Promise<AxiosResponse> => {
return await request('GET', '/v1/users/all')
try {
const response = await request('GET', BASE + 'all')
return response
} catch (error) {
if (error instanceof AxiosError) {
console.error(
`${API_NAME} Error: ${error.message}`,
error.response?.data
)
throw new Error(
`${API_NAME} Error: ${error.response?.status} ${error.response?.data?.error}`
)
}
throw new Error('Unknown Error')
}
}

export const getUser = async (username: string): Promise<AxiosResponse> => {
return await request('GET', `/v1/users/user?username=${username}`)
export const getUser = async (userId: string): Promise<AxiosResponse> => {
try {
const response = await request('GET', BASE + `user?userId=${userId}`)
return response
} catch (error) {
if (error instanceof AxiosError) {
console.error(
`${API_NAME} Error: ${error.message}`,
error.response?.data
)
throw new Error(
`${API_NAME} Error: ${error.response?.status} ${error.response?.data?.error}`
)
}
throw new Error('Unknown Error')
}
}

export const addUser = async (user: User): Promise<AxiosResponse> => {
return await request('POST', '/v1/users/user', JSON.stringify(user))
}

export const updateUser = async (username: string, user: User): Promise<AxiosResponse> => {
return await request('PUT', `/v1/users/user?username=${username}`, JSON.stringify(user))
try {
const response = await request('POST', BASE + 'user', JSON.stringify(user))
return response
} catch (error) {
if (error instanceof AxiosError) {
console.error(
`${API_NAME} Error: ${error.message}`,
error.response?.data
)
throw new Error(
`${API_NAME} Error: ${error.response?.status} ${error.response?.data?.error}`
)
}
throw new Error('Unknown Error')
}
}

export const deleteUser = async (username: string): Promise<AxiosResponse> => {
return await request('DELETE', `/v1/users/user?username=${username}`)
export const updateUser = async (user: User): Promise<AxiosResponse> => {
try {
const response = await request('PUT', BASE + 'user', JSON.stringify(user))
return response
} catch (error) {
if (error instanceof AxiosError) {
console.error(
`${API_NAME} Error: ${error.message}`,
error.response?.data
)
throw new Error(
`${API_NAME} Error: ${error.response?.status} ${error.response?.data?.error}`
)
}
throw new Error('Unknown Error')
}
}

export const getMemberSizeWeeklyChange = async (): Promise<AxiosResponse> => {
return await request('GET', '/v1/users/member-size-weekly-change')
export const deleteUser = async (userId: string): Promise<AxiosResponse> => {
try {
const response = await request('DELETE', BASE + `userId?=${userId}`)
return response
} catch (error) {
if (error instanceof AxiosError) {
console.error(
`${API_NAME} Error: ${error.message}`,
error.response?.data
)
throw new Error(
`${API_NAME} Error: ${error.response?.status} ${error.response?.data?.error}`
)
}
throw new Error('Unknown Error')
}
}
12 changes: 8 additions & 4 deletions src/app/App.tsx
Original file line number Diff line number Diff line change
@@ -1,15 +1,19 @@
import { Routes, Route } from 'react-router-dom'
import HomePage from '../pages/HomePage'
import DashboardPage from '../pages/DashboardPage'
import BlogPage from '../pages/BlogPage'
import ApplicationsPage from '../pages/ApplicatiosPage'
import BudgetPage from '../pages/BudgetPage'
import TeamPage from '../pages/TeamPage'

function App (): JSX.Element {
return (
<div>
<Routes>
<Route path='/' element={<HomePage />} />
<Route path='/dashboard' element={<DashboardPage />} />
<Route path='/blog' element={<BlogPage />} />
<Route path="/" element={<HomePage />} />
<Route path="/blog" element={<BlogPage />} />
<Route path="/applications" element={<ApplicationsPage />} />
<Route path="/budget" element={<BudgetPage />} />
<Route path="/team/:teamName" element={<TeamPage />} />
</Routes>
</div>
)
Expand Down
7 changes: 6 additions & 1 deletion src/components/MetricCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,12 @@ interface MetricCardProps {
change: 'increase' | 'decrease'
}

function MetricCard ({ label, statistic, changePercentage, change }: MetricCardProps): JSX.Element {
function MetricCard ({
label,
statistic,
changePercentage,
change
}: MetricCardProps): JSX.Element {
return (
<Stat>
<StatLabel>{label}</StatLabel>
Expand Down
90 changes: 80 additions & 10 deletions src/components/Sidebar.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,15 @@
import { useState } from 'react'
import { Link as ReactRouterLink } from 'react-router-dom'
import { Box, Flex, HStack, VStack, Button, Image, Text, Link as ChakraLink } from '@chakra-ui/react'
import {
Box,
Flex,
HStack,
VStack,
Button,
Image,
Text,
Link as ChakraLink
} from '@chakra-ui/react'
import { motion } from 'framer-motion'
import HomeIcon from './icons/HomeIcon'
import DashboardIcon from './icons/Dashboard'
Expand All @@ -18,32 +27,93 @@ function Sidebar (): JSX.Element {
animate={{ width: hidden ? 0 : '300px' }}
transition={{ ease: 'easeOut', duration: 0.3 }}
>
<Flex height="100%" backgroundColor="blue.500" direction="column" justifyContent="space-between" color="white" overflow="hidden">
<Flex
height="100%"
backgroundColor="blue.500"
direction="column"
justifyContent="space-between"
color="white"
overflow="hidden"
>
<Box>
<HStack padding="16px" columnGap="20px">
<Image src={Logo} alt="Blueprint Logo" boxSize="80px" minWidth="80px"></Image>
<Image
src={Logo}
alt="Blueprint Logo"
boxSize="80px"
minWidth="80px"
></Image>
</HStack>
<VStack paddingX="8px" spacing="15px" align="left">
<ChakraLink as={ReactRouterLink} to='/' _hover={{ textDecoration: 'none' }}>
<Button leftIcon={<HomeIcon />} colorScheme="whiteAlpha" width="100%" padding="8px" justifyContent="start" backgroundColor="transparent" variant="solid" display="flex">
<ChakraLink
as={ReactRouterLink}
to="/"
_hover={{ textDecoration: 'none' }}
>
<Button
leftIcon={<HomeIcon />}
colorScheme="whiteAlpha"
width="100%"
padding="8px"
justifyContent="start"
backgroundColor="transparent"
variant="solid"
display="flex"
>
<Text alignSelf="flex-end">Home</Text>
</Button>
</ChakraLink>
<ChakraLink as={ReactRouterLink} to='/dashboard' _hover={{ textDecoration: 'none' }}>
<Button leftIcon={<DashboardIcon />} colorScheme="whiteAlpha" width="100%" padding="8px" justifyContent="start" backgroundColor="transparent" variant="solid" display="flex">
<ChakraLink
as={ReactRouterLink}
to="/dashboard"
_hover={{ textDecoration: 'none' }}
>
<Button
leftIcon={<DashboardIcon />}
colorScheme="whiteAlpha"
width="100%"
padding="8px"
justifyContent="start"
backgroundColor="transparent"
variant="solid"
display="flex"
>
<Text alignSelf="flex-end">Dashboard</Text>
</Button>
</ChakraLink>
<ChakraLink as={ReactRouterLink} to='/blog' _hover={{ textDecoration: 'none' }}>
<Button leftIcon={<BlogIcon />} colorScheme="whiteAlpha" width="100%" padding="8px" justifyContent="start" backgroundColor="transparent" variant="solid" display="flex">
<ChakraLink
as={ReactRouterLink}
to="/blog"
_hover={{ textDecoration: 'none' }}
>
<Button
leftIcon={<BlogIcon />}
colorScheme="whiteAlpha"
width="100%"
padding="8px"
justifyContent="start"
backgroundColor="transparent"
variant="solid"
display="flex"
>
<Text alignSelf="flex-end">Blog</Text>
</Button>
</ChakraLink>
</VStack>
</Box>
</Flex>
</motion.nav>
<Button onClick={() => { setHidden(!hidden) }} leftIcon={<ExpandIcon />} colorScheme="none" backgroundColor="transparent" color="black" position="absolute" right="-50px"></Button>
<Button
onClick={() => {
setHidden(!hidden)
}}
leftIcon={<ExpandIcon />}
colorScheme="none"
backgroundColor="transparent"
color="black"
position="absolute"
right="-50px"
></Button>
</Flex>
)
}
Expand Down
Loading

0 comments on commit 04b483c

Please sign in to comment.