Delete Item and blacklist implemented

Client/client/cypress/integration/1-getting-started/HomeDash.spec.jsx

@@ -1,5 +1,3 @@
-
-
 describe('HomeDash Component', () => {
     it('Should change whats rendered when top nav links are clicked', () => {
         cy.visit('http://localhost:3000/');

Client/client/cypress/integration/1-getting-started/MyCloset.spec.js

@@ -0,0 +1,69 @@
+describe('HomeDash Component', () => {
+it('Should change to MyCloset page when MyCloset button is pressed', () => {
+    cy.visit('http://localhost:3000/');
+
+    cy.get('input[name="email"]').type('test@test.com')
+    cy.get('input[name="password"]').type('test')
+
+    cy.get('button[type="submit"]').click()
+
+    cy.get('nav').within(()=> {
+        cy.get('h1').contains('Hi test!')
+    })
+
+    cy.get('.body').within(() => {
+        cy.get('.is-info').click()
+    })
+    cy.url().should('include', 'http://localhost:3000/MyCloset')
+
+ })
+
+ it('Should change whats rendered when top nav links are clicked', () => {
+    cy.visit('http://localhost:3000/');
+
+    cy.get('input[name="email"]').type('test@test.com')
+    cy.get('input[name="password"]').type('test')
+
+    cy.get('button[type="submit"]').click()
+
+    cy.get('nav').within(()=> {
+        cy.get('h1').contains('Hi test!')
+    })
+
+    cy.get('.body').within(() => {
+        cy.get('.is-info').click()
+    })
+
+    cy.get('.categories').within(()=> {
+    cy.get('li').click({multiple: true, force: true}) 
+
+    })
+})
+
+it('Should change to ItemDetails Page when a item is clicked', () => {
+    cy.visit('http://localhost:3000/');
+
+    cy.get('input[name="email"]').type('test@test.com')
+    cy.get('input[name="password"]').type('test')
+
+    cy.get('button[type="submit"]').click()
+
+    cy.get('.body').within(() => {
+        cy.get('.is-info').click()
+    })
+
+    cy.get('.categories').within(()=> {
+    cy.get('li').click({multiple: true, force: true}) 
+
+    })
+
+    cy.get('.pt-2').within(()=> {
+        cy.get('div').within(() => {
+          cy.get('img').last().click() 
+
+        })
+    })
+    cy.url().should('include', 'http://localhost:3000/itemDetail')
+
+})
+})

Client/client/cypress/integration/1-getting-started/SearchResults.spec.js

@@ -0,0 +1,34 @@
+describe('SearchResults Component', () => {
+    it('Should change whats rendered when new search terms are typed', () => {
+        cy.visit('http://localhost:3000/');
+
+        cy.get('input[name="email"]').type('test@test.com')
+        cy.get('input[name="password"]').type('test')
+
+        cy.get('button[type="submit"]').click()
+
+       cy.get('.search-bar').type('test')
+
+       cy.get('.search-follow').within(() => {
+           cy.get('.is-4').contains('test')
+       })
+    })
+    it('Should change screen when an item is clicked from the search results', () => {
+        cy.visit('http://localhost:3000/');
+
+        cy.get('input[name="email"]').type('test@test.com')
+        cy.get('input[name="password"]').type('test')
+
+        cy.get('button[type="submit"]').click()
+
+       cy.get('.search-bar').type('shirt')
+
+       cy.get('.search-follow').within(() => {
+           cy.get('.search-item-box').within(() => {
+               cy.get('img').last().click({force: true})
+           })
+       })
+       cy.url().should('include', 'http://localhost:3000/itemDetail')
+
+})
+})

Client/client/cypress/integration/1-getting-started/UserCloset.spec.js

@@ -0,0 +1,21 @@
+describe('UserCloset Component', () => {
+    it('Should change whats rendered when new search terms are typed', () => {
+        cy.visit('http://localhost:3000/');
+
+        cy.get('input[name="email"]').type('test@test.com')
+        cy.get('input[name="password"]').type('test')
+
+        cy.get('button[type="submit"]').click()
+
+       cy.get('.search-bar').type('test')
+
+       cy.get('.search-follow').within(() => {
+           cy.get('.is-4').first().click({force: true})
+       })
+
+       cy.url().should('include', 'http://localhost:3000/UserCloset/')
+       cy.get('.body').within(() => {
+           cy.get('.mt-5').contains("test's Closet")
+       })
+    })
+})

Client/client/src/App.tsx

@@ -13,7 +13,7 @@ import UserCloset from './components/UserCloset/UserCloset';
 import LoginPage from './components/LoginPage/LoginPage';
 import actions from './redux/actions';
 import { connect } from 'react-redux';
-
+import apiService from './apiServices';
 import logo from './utils/ClothierLiteCrop.png'
 import fetchService from './fetchService'
 
@@ -59,6 +59,7 @@ function App({getItems, getUser, user, setSearchVal, searchVal}: props): JSX.Ele
 
   const logOut = () => {
     localStorage.removeItem('accessToken');
+    apiService.logout();
     setAuthenticated(false);
   }
 

Client/client/src/apiServices.tsx

@@ -27,6 +27,15 @@ async login(user:BasicUser) {
     .then((res) => (res.json()))
     .catch((err) => console.log(err))
 },
+async logout() {
+  return fetch(`${baseURL}/logout`, {
+    method: 'POST',
+    credentials: 'include',
+    mode: 'cors',
+  })
+    .then((res) => (res.json()))
+    .catch((err) => console.log(err));
+},
 async profile (accessToken:string | number | null, tokenType:any) {
   return fetch(`${baseURL}/me`, {
     method: 'GET',
@@ -112,7 +121,25 @@ async fetchOneItem (id:string) {
   .then(response => response.json())
   .catch(err => console.log(err));
   return result;
-}
+},
+async deleteItemFromCloset(UserId:number, ItemId:number){
+  const res = fetch(baseURL + '/adq', {
+    method: 'DELETE',
+    credentials: 'include',
+    mode: 'cors',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify({
+      UserId,
+      ItemId
+    })
+  })
+  .then(response => response.json())
+  .catch(err => console.log(err));
+  return res;
+},
+
 
 }
 

Client/client/src/components/DeleteButton.tsx

@@ -0,0 +1,9 @@
+import React from 'react'
+import apiService from '../apiServices'
+const DeleteButton = ({ user, item}:any) => {
+    return (
+        <button className='button is-danger' onClick={() => apiService.deleteItemFromCloset(user.primaryKey, item.itemPrimaryKey,)}>X</button>
+    )
+}
+
+export default DeleteButton

Client/client/src/components/MyCloset/MyCloset.tsx

@@ -8,17 +8,19 @@ import '../../styles/app.css';
 import fetchService from '../../fetchService';
 import { User, Category } from '../../Interfaces/interfaces'
 import Categories from '../Categories';
+import DeleteButton from '../DeleteButton';
 
 
 interface props  {
   user: User
   getUser: Function,
   getItems: Function
   searchVal: string
+  DeleteItemFromCloset: Function
 }
 
 
-function MyCloset({user, getUser, getItems, searchVal}: props) : JSX.Element {
+function MyCloset({user, getUser, getItems, DeleteItemFromCloset, searchVal}: props) : JSX.Element {
   const ADQitems = user.ADQs;
   const userCategories = [...new Set(user.ADQs.map((item) => item.item.category))];
   const initialState = userCategories.map(category => {return {category: category, isActive: ''}})
@@ -86,6 +88,7 @@ function MyCloset({user, getUser, getItems, searchVal}: props) : JSX.Element {
                 <div className='tile is-child box item-box' key={item.itemPrimaryKey}>
                   <Link to={`/itemDetail/${item.itemPrimaryKey}`}>
                     <img src={item.item.image} alt="n/a"/>
+                  <DeleteButton user={user} item={item} DeleteItemFromCloset={DeleteItemFromCloset} />
                   </Link>
             </div>
             )}
@@ -95,6 +98,7 @@ function MyCloset({user, getUser, getItems, searchVal}: props) : JSX.Element {
                 <div className='tile is-child box item-box' key={item.itemPrimaryKey}>
                   <Link to={`/itemDetail/${item.itemPrimaryKey}`}>
                     <img src={item.item.image} alt="n/a"/>
+                    <DeleteButton user={user} item={item} DeleteItemFromCloset={DeleteItemFromCloset} />
                   </Link>
                 </div>
               )}
@@ -104,6 +108,7 @@ function MyCloset({user, getUser, getItems, searchVal}: props) : JSX.Element {
                   <div className='tile is-child box item-box' key={item.itemPrimaryKey}>
                     <Link to={`/itemDetail/${item.itemPrimaryKey}`}>
                       <img src={item.item.image} alt="n/a"/>
+                    <DeleteButton user={user} item={item} DeleteItemFromCloset={DeleteItemFromCloset}/>
                     </Link>
                   </div>
                 )}
@@ -112,6 +117,7 @@ function MyCloset({user, getUser, getItems, searchVal}: props) : JSX.Element {
               {filteredItems.slice((quarter*3)).map(item =>
                   <div className='tile is-child box item-box' key={item.itemPrimaryKey}>
                     <Link to={`/itemDetail/${item.itemPrimaryKey}`}>
+                       <DeleteButton user={user} item={item} DeleteItemFromCloset={DeleteItemFromCloset} />
                       <img src={item.item.image} alt="n/a"/>
                     </Link>
                   </div>
@@ -139,6 +145,7 @@ const mapStateToProps = ({store}:any) => {
 
 const mapDispatchToProps = (dispatch:any) => {
   return {
+    DeleteItemFromCloset: (action:any) => dispatch(action),
     getItems: (action:any) => dispatch(action),
     getUser: (action:any) => dispatch(action),
   };

Client/client/src/redux/actions.tsx

@@ -20,7 +20,7 @@ const actions = {
   setSelectedUser : (user:User) => ({
     type: 'setSelectedUser',
     payload: user
-  }),
+  })
 };
 
 export default actions;

Server/controllers/mainMethods.ts

@@ -181,6 +181,23 @@ export async function postADQ(ctx : any) {
   }
 };
 
+export async function removeADQ(ctx : any) {
+  const body = ctx.request.body;
+  try{
+    await db.ADQ.destroy({
+      where: {
+        userPrimaryKey: body.UserId,
+        itemPrimaryKey: body.ItemId,
+      }
+    })
+    ctx.status = 201;
+  }catch(er){
+    ctx.body = er;
+    ctx.status = 404;
+  }
+
+}
+
 // Follow Users Method
 
 export async function followUser(ctx:any) {

Server/index.test.ts

@@ -1107,7 +1107,7 @@ describe('Testing of endpoints on server', () => {
    request(server)
     .post('/follow')
     .send({
-      currentUserId: 100,
+      currentUserId: 6444454848,
       profileUser: 2,
     })
     .expect(404)
@@ -1193,6 +1193,17 @@ describe('Testing of endpoints on server', () => {
         return done();
       })
   })
+  test('DELETE /adq should remove item from closet', async () => {
+    const priorToAdd = await request(server).get('/adq')
+    await request(server).post('/adq').send({UserId: 1, ItemId: 227})
+    const afterAdd = await request(server).get('/adq')
+    await request(server).delete('/adq').send({UserId: 1,ItemId: 227})
+    const afterRemove = await request(server).get('/adq')
+    if(priorToAdd.body.length < afterAdd.body.length && afterAdd.body.length > afterRemove.body.length){
+        expect(true).toBe(true);
+    }else{expect(false).toBe(true)}
+
+  })
 
   test('POST /logout should blacklist the session', async () => {
     const login = await request(server).post('/login').send({

Server/package.json

@@ -31,5 +31,6 @@
     "supertest": "^6.1.6",
     "ts-jest": "^27.0.5",
     "ts-node": "^10.2.1"
-  }
+  },
+  "esModuleInterop": true
 }

Server/router.js

@@ -21,9 +21,11 @@ router.post('/items', mainMethods.postItems); //NO LONGER NEEDED
 router.post('/OneItem', mainMethods.getOneItem);  //Done
 
 //Get all adquisitions
-router.get('/adq', mainMethods.getADQ);
+router.get('/adq', mainMethods.getADQ); //done
 // Register new adquisition
-router.post('/adq', mainMethods.postADQ);
+router.post('/adq', mainMethods.postADQ); //done
+//Remove a adquisition
+router.delete('/adq', mainMethods.removeADQ);
 
 //Get all follows
 router.get('/follow', mainMethods.getFollows); // Done