Index: phonelux-frontend/src/components/EditOfferComponent/EditOfferComponent.js
===================================================================
--- phonelux-frontend/src/components/EditOfferComponent/EditOfferComponent.js	(revision fd5b100c1a316b5c886ba2b92de69042a34fde9a)
+++ phonelux-frontend/src/components/EditOfferComponent/EditOfferComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -17,14 +17,4 @@
 
     componentDidMount(){
-        // if(!localStorage.getItem('token'))
-        // {
-        //     window.location.href = "/"
-        // }
-
-        // if(this.context.role != 'ADMIN' && this.context.role != 'SUPERADMIN')
-        // {
-        //     window.location.href = "/"
-        // }
-
         var config = {
             method: 'get',
Index: phonelux-frontend/src/components/HomepageComponent.js
===================================================================
--- phonelux-frontend/src/components/HomepageComponent.js	(revision fd5b100c1a316b5c886ba2b92de69042a34fde9a)
+++ phonelux-frontend/src/components/HomepageComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -220,5 +220,5 @@
   render() {
     // console.log(this.context)
-    // console.log(localStorage.getItem('token'))
+    console.log(localStorage.getItem('token'))
     // console.log(this.state)
     return (
Index: phonelux-frontend/src/components/LoginRegisterComponents/LoginFormComponent.css
===================================================================
--- phonelux-frontend/src/components/LoginRegisterComponents/LoginFormComponent.css	(revision fd5b100c1a316b5c886ba2b92de69042a34fde9a)
+++ phonelux-frontend/src/components/LoginRegisterComponents/LoginFormComponent.css	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -162,2 +162,15 @@
   background-color: rgb(251, 224, 224);
  }
+
+ .login-with-facebook-image{
+  width: 40%;
+ }
+
+.login-with-facebook-image:hover{
+  cursor: pointer;
+}
+
+ .login-with-facebook-wrapper{
+  display: flex;
+  justify-content: center;
+ }
Index: phonelux-frontend/src/components/LoginRegisterComponents/LoginFormComponent.js
===================================================================
--- phonelux-frontend/src/components/LoginRegisterComponents/LoginFormComponent.js	(revision fd5b100c1a316b5c886ba2b92de69042a34fde9a)
+++ phonelux-frontend/src/components/LoginRegisterComponents/LoginFormComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -6,4 +6,5 @@
 import { Link } from 'react-router-dom';
 import axios from 'axios';
+import FacebookLogin from 'react-facebook-login'
 
 export class LoginFormComponent extends Component {
@@ -18,8 +19,5 @@
     }
   }
-  
-  changeHandler = (e) =>{
-      this.setState({[e.target.name] : e.target.value})
-  }
+
 
   submitHandler = (e) => {
Index: phonelux-frontend/src/components/NavbarComponent/NavbarComponent.js
===================================================================
--- phonelux-frontend/src/components/NavbarComponent/NavbarComponent.js	(revision fd5b100c1a316b5c886ba2b92de69042a34fde9a)
+++ phonelux-frontend/src/components/NavbarComponent/NavbarComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -12,4 +12,7 @@
 import SupervisorAccountIcon from '@mui/icons-material/SupervisorAccount';
 import CompareIcon from '@mui/icons-material/Compare';
+import BugReportIcon from '@mui/icons-material/BugReport';
+import ReportIcon from '@mui/icons-material/Report';
+import UpdateIcon from '@mui/icons-material/Update';
 
 export class NavbarComponent extends Component {
@@ -36,4 +39,20 @@
             <Link style={{color: 'black'}} to={"/management/users"}>
               <SupervisorAccountIcon style={{fontSize: '40px', marginTop: '10px', marginRight: '10px' }} className='navbar-superadmin-icon'/>
+            </Link>
+          </Tippy> : <></>
+        }
+         {
+          localStorage.getItem('token') && this.context.role == 'SUPERADMIN' ? 
+          <Tippy placement='bottom' content='Преземање на содржина'>
+            <Link style={{color: 'black'}} to={"/scrapperinfo"}>
+              <UpdateIcon style={{fontSize: '40px', marginTop: '10px', marginRight: '10px' }} className='navbar-superadmin-icon'/>
+            </Link>
+          </Tippy> : <></>
+        }
+         {
+          localStorage.getItem('token') && (this.context.role == 'SUPERADMIN' || this.context.role == 'ADMIN') ? 
+          <Tippy placement='bottom' content='Пријавени понуди'>
+            <Link style={{color: 'black'}} to={"/offerreport/reports"}>
+              <BugReportIcon style={{fontSize: '40px', marginTop: '10px', marginRight: '10px' }} className='navbar-offerreports-icon'/>
             </Link>
           </Tippy> : <></>
Index: phonelux-frontend/src/components/OfferReportsComponent/OfferReportsComponent.css
===================================================================
--- phonelux-frontend/src/components/OfferReportsComponent/OfferReportsComponent.css	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
+++ phonelux-frontend/src/components/OfferReportsComponent/OfferReportsComponent.css	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -0,0 +1,82 @@
+.offerreports-section-header{
+    background-color: #B6E2C8;
+    justify-content: center;
+    align-content: center;
+    margin-top: -30px;
+    width: 100%;
+    display: flex;
+    font-size: 18px;
+}
+.offerreports-section-header-text{
+    width: fit-content;
+}
+
+.offerreports-section-table-row:nth-of-type(even){
+    background-color: #eef2f0;
+}
+
+.offerreports-section-table{
+    border-collapse: collapse;
+    width: 100%;
+    table-layout: fixed;
+}
+
+.offerreports-section-table-row{
+    border: 1px solid gainsboro;
+    padding: 20px ;
+    font-size: 18px;
+}
+
+.offerreports-section-table td{
+    text-align: center;
+    word-wrap: break-word;
+}
+
+.offerreports-section-table-head{
+    background-color: #a6c9ab;
+    font-size: 22px;
+}
+
+.offerreports-section-table-head th{
+    word-wrap: break-word;
+    width: 100%;
+}
+
+.reportoffer-removeall-button{    
+    font-weight: bold;
+    font-size: 15px;
+    width: 80%;
+    border-radius: 20px;
+    border: 2px solid red;
+    background-color: rgb(243, 203, 203);
+}
+
+.reportoffer-removeall-button:hover{
+    cursor: pointer;
+    background-color: rgb(228, 179, 179);
+    box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
+    transition: box-shadow 0.5s, background-color 0.5s ;
+}
+
+.no-offerreports-message{
+    text-align: center;
+    background-color: #a6c9ab;
+    padding: 10px;
+    border-radius: 50px;
+    border: 1px solid black;
+    width: fit-content;
+}
+
+.no-offerreports-wrapper{
+    margin-top: 100px;
+    display: flex;
+    justify-content: center;
+    width: 100%;
+}
+
+.offerreports-pagination-wrapper{
+    margin-top: 40px;
+    display: flex;
+    justify-content: center;
+    margin-bottom: 30px;
+}
Index: phonelux-frontend/src/components/OfferReportsComponent/OfferReportsComponent.js
===================================================================
--- phonelux-frontend/src/components/OfferReportsComponent/OfferReportsComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
+++ phonelux-frontend/src/components/OfferReportsComponent/OfferReportsComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -0,0 +1,149 @@
+import { Pagination } from '@mui/material'
+import axios from 'axios'
+import React, { Component } from 'react'
+import HeaderComponent from '../HeaderComponent/HeaderComponent'
+import './OfferReportsComponent.css'
+import SingleReportComponent from './SingleReportComponent'
+
+export class OfferReportsComponent extends Component {
+
+    constructor(props) {
+      super(props)
+    
+      this.state = {
+         offerReports: [],
+         currentReports: [],
+         reportsPerPage:10,
+         numberOfPages: 0,
+         currentPage: 1,
+      }
+    }
+
+    componentDidMount(){
+       this.getOfferReports()
+    }
+
+    removeOfferReport = (id) => {
+        var config = {
+            method: 'delete',
+            url: '/offerreport/remove/'+id,
+            headers: { 
+              'Authorization': 'Bearer '+localStorage.getItem('token')
+            }
+          };
+          
+          axios(config)
+          .then(response => {
+            this.getOfferReports()
+          })
+          .catch(error => {
+            console.log(error);
+          });
+          
+    }
+
+    removeAllOfferReports = () => {
+        var config = {
+            method: 'delete',
+            url: '/offerreport/removeall',
+            headers: { 
+              'Authorization': 'Bearer '+localStorage.getItem('token')
+            }
+          };
+          
+          axios(config)
+          .then(response => {
+            this.getOfferReports()
+          })
+          .catch(error => {
+            console.log(error);
+          });
+    }
+
+    getOfferReports = () => {
+        var config = {
+            method: 'get',
+            url: '/offerreport/allreports',
+            headers: { 
+                'Authorization': 'Bearer '+localStorage.getItem('token')
+            }
+            };
+    
+            axios(config)
+            .then(response => {
+            this.setState({
+                offerReports: response.data,
+                numberOfPages: Math.ceil(response.data.length / this.state.reportsPerPage)
+            },(e) => this.setNewPage(e,this.state.currentPage))
+            })
+            .catch(error => {
+            console.log(error);
+            });
+    }
+
+    setNewPage = (event,page) => {
+
+        const indexOfLastReport = parseInt(page) * this.state.reportsPerPage;
+        const indexOfFirstReport = indexOfLastReport - this.state.reportsPerPage;
+    
+        const currReports = this.state.offerReports.slice(indexOfFirstReport, indexOfLastReport)
+    
+        this.setState({
+          currentPage: parseInt(page),
+          currentReports: currReports
+        })
+    }
+    
+  render() {
+    console.log(this.state)
+    return (
+        <div className='offerreports-section-main'>
+        <HeaderComponent/>
+        <div className='offerreports-section-header'>
+          <h1 className='offerreports-section-header-text'>
+            Пријавени невалидни понуди
+          </h1>
+        </div>
+
+        {
+            this.state.offerReports.length > 0 ? 
+            <>
+              <div className='offerreports-section'>
+                <table cellPadding={20} className='offerreports-section-table'>
+                <thead className='offerreports-section-table-head'>
+                    <tr>
+                    <th>Име на понуда</th>
+                    <th>Време на пријавување</th>
+                    <th>Последно пријавена од</th>
+                    <th>Вкупно пријави</th>
+                    <th>
+                    <button className='reportoffer-removeall-button' onClick={this.removeAllOfferReports}>Отстрани ги сите пријави</button>
+                    </th>
+                    </tr>
+                </thead>
+                <tbody>
+                    {
+                    this.state.currentReports.map((offer,idx) => <SingleReportComponent key={idx} id={offer.id} 
+                    times_reported={offer.times_reported} reportedAt={offer.reportedAt} phoneOffer={offer.phoneOffer} 
+                    reportedBy={offer.reportedBy} removeOfferReport={this.removeOfferReport}/>)
+                    }
+                </tbody>
+                </table>
+
+                </div>
+                <div className='offerreports-pagination-wrapper'>
+                <Pagination className='offerreports-pagination' onChange={this.setNewPage} page={this.state.currentPage}
+                count={this.state.numberOfPages} color="primary" />
+                </div>      
+            </>
+            :
+            <div className='no-offerreports-wrapper'>
+                <h1 className='no-offerreports-message'>Нема пријавено понуди</h1>
+            </div>
+        }
+      </div>
+    )
+  }
+}
+
+export default OfferReportsComponent
Index: phonelux-frontend/src/components/OfferReportsComponent/SingleReportComponent.css
===================================================================
--- phonelux-frontend/src/components/OfferReportsComponent/SingleReportComponent.css	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
+++ phonelux-frontend/src/components/OfferReportsComponent/SingleReportComponent.css	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -0,0 +1,4 @@
+.offerreport-remove-icon{
+    cursor: pointer;
+}
+
Index: phonelux-frontend/src/components/OfferReportsComponent/SingleReportComponent.js
===================================================================
--- phonelux-frontend/src/components/OfferReportsComponent/SingleReportComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
+++ phonelux-frontend/src/components/OfferReportsComponent/SingleReportComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -0,0 +1,35 @@
+import React, { Component } from 'react'
+import { Link } from 'react-router-dom'
+import './SingleReportComponent.css'
+import DeleteIcon from '@mui/icons-material/Delete';
+import Tippy from '@tippyjs/react';
+import { Delete } from '@mui/icons-material';
+
+export class SingleReportComponent extends Component {
+    constructor(props) {
+      super(props)
+    
+      this.state = {
+         
+      }
+    }
+    
+  render() {
+    return (
+        <tr className='offerreports-section-table-row'>
+          <td><Link to={"/phoneoffer/"+this.props.phoneOffer.id}>{this.props.phoneOffer.offer_name}</Link></td>
+          <td>{this.props.reportedAt.split('T')[0]}</td>
+          <td>{this.props.reportedBy}</td>
+          <td>{this.props.times_reported}</td>
+          <td>{
+           <Tippy placement='bottom' content='Отстрани пријава'>
+           <Delete className='offerreport-remove-icon' onClick={() => this.props.removeOfferReport(this.props.id)}
+            style={{fontSize: '45px'}}/>
+        </Tippy>
+        }</td>
+        </tr>
+      )
+  }
+}
+
+export default SingleReportComponent
Index: phonelux-frontend/src/components/PhoneOfferDetailsComponent/PhoneOfferDetailsComponent.css
===================================================================
--- phonelux-frontend/src/components/PhoneOfferDetailsComponent/PhoneOfferDetailsComponent.css	(revision fd5b100c1a316b5c886ba2b92de69042a34fde9a)
+++ phonelux-frontend/src/components/PhoneOfferDetailsComponent/PhoneOfferDetailsComponent.css	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -140,4 +140,8 @@
 }
 
+.offerdetails-report-icon{
+    cursor: pointer;
+}
 
 
+
Index: phonelux-frontend/src/components/PhoneOfferDetailsComponent/PhoneOfferDetailsComponent.js
===================================================================
--- phonelux-frontend/src/components/PhoneOfferDetailsComponent/PhoneOfferDetailsComponent.js	(revision fd5b100c1a316b5c886ba2b92de69042a34fde9a)
+++ phonelux-frontend/src/components/PhoneOfferDetailsComponent/PhoneOfferDetailsComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -9,4 +9,5 @@
 import VisibilityIcon from '@mui/icons-material/Visibility';
 import VisibilityOffIcon from '@mui/icons-material/VisibilityOff';
+import ReportIcon from '@mui/icons-material/Report';
 
 
@@ -61,4 +62,23 @@
   }
 
+    reportOffer = () =>{
+      alert('Пратена е пријава до администратор за невалидност на спецификациите на понудата!')
+      var config = {
+        method: 'post',
+        url: '/offerreport/'+this.state.offerId+'/'+this.context.userId,
+        headers: { 
+          'Authorization': 'Bearer '+localStorage.getItem('token')
+        }
+      };
+      
+      axios(config)
+      .then(function (response) {
+        console.log(JSON.stringify(response.data));
+      })
+      .catch(function (error) {
+        console.log(error);
+      });
+    }
+
   render() {
     console.log(this.state)
@@ -71,4 +91,10 @@
           {
             localStorage.getItem('token') ? 
+            <Tippy placement='bottom' content='Пријави понуда за неточни спецификации'>
+            <ReportIcon onClick={this.reportOffer} className='offerdetails-report-icon' style={{fontSize: '45px'}}/>
+         </Tippy> : <></>
+          }
+          {
+            localStorage.getItem('token') ? 
             this.state.showAllSpecs ? 
               <Tippy placement='bottom' content='Прикажи ги избраните спецификации'>
@@ -103,4 +129,5 @@
 
           })()}
+
         </div>
         <div className='phone-offer-details-last-updated-wrapper'></div>
@@ -109,5 +136,7 @@
         <table className='phone-offer-details-table'>
           <thead>
-          <tr><th colSpan={2}>Детали за понудата</th></tr>
+          <tr><th colSpan={2}>
+            Детали за понудата
+          </th></tr>
           </thead>
           <tbody>
Index: phonelux-frontend/src/components/ScrappersComponent/ScrapperInfoComponent.js
===================================================================
--- phonelux-frontend/src/components/ScrappersComponent/ScrapperInfoComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
+++ phonelux-frontend/src/components/ScrappersComponent/ScrapperInfoComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -0,0 +1,25 @@
+import React, { Component } from 'react'
+
+export class ScrapperInfoComponent extends Component {
+    constructor(props) {
+      super(props)
+    
+      this.state = {
+         
+      }
+    }
+    
+  render() {
+    return (
+        <tr className='scrappers-section-table-row'>
+        <td>{this.props.store}</td>
+        <td>{this.props.status == 'success' ? <span className='scrapper-info-success'>Успешно</span> 
+        : 
+        <span className='scrapper-info-failed'>Неуспешно</span>}</td>
+        <td>{this.props.recievedAt.split('T')[0]}</td>
+      </tr>
+    )
+  }
+}
+
+export default ScrapperInfoComponent
Index: phonelux-frontend/src/components/ScrappersComponent/ScrappersComponent.css
===================================================================
--- phonelux-frontend/src/components/ScrappersComponent/ScrappersComponent.css	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
+++ phonelux-frontend/src/components/ScrappersComponent/ScrappersComponent.css	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -0,0 +1,52 @@
+.scrappers-section-header{
+    background-color: #B6E2C8;
+    justify-content: center;
+    align-content: center;
+    margin-top: -30px;
+    width: 100%;
+    display: flex;
+    font-size: 18px;
+}
+.scrappers-section-header-text{
+    width: fit-content;
+}
+
+
+.scrappers-section-table{
+    border-collapse: collapse;
+    width: 100%;
+    table-layout: fixed;
+}
+
+.scrappers-section-table-row{
+    border: 1px solid gainsboro;
+    padding: 20px ;
+    font-size: 18px;
+}
+
+.scrappers-section-table td{
+    text-align: center;
+    word-wrap: break-word;
+}
+
+.scrappers-section-table-head{
+    background-color: #a6c9ab;
+    font-size: 22px;
+}
+
+.scrappers-section-table-head th{
+    word-wrap: break-word;
+    width: 100%;
+}
+
+.scrapper-info-failed{
+    color: red;
+}
+
+.scrapper-info-success{
+    color: #58ad7b;
+}
+
+.scrappers-section-table-row{
+    font-weight: bold;
+}
Index: phonelux-frontend/src/components/ScrappersComponent/ScrappersComponent.js
===================================================================
--- phonelux-frontend/src/components/ScrappersComponent/ScrappersComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
+++ phonelux-frontend/src/components/ScrappersComponent/ScrappersComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -0,0 +1,69 @@
+import axios from 'axios'
+import React, { Component } from 'react'
+import HeaderComponent from '../HeaderComponent/HeaderComponent'
+import ScrapperInfoComponent from './ScrapperInfoComponent'
+import "./ScrappersComponent.css"
+
+export class ScrappersComponent extends Component {
+    constructor(props) {
+      super(props)
+    
+      this.state = {
+        scrapperinfos: []
+      }
+
+    }
+
+    componentDidMount(){
+        var config = {
+            method: 'get',
+            url: '/scrapperinfo',
+            headers: { 
+              'Authorization': 'Bearer '+localStorage.getItem('token')
+            }
+          };
+          
+          axios(config)
+          .then(response => {
+            this.setState({
+                scrapperinfos: response.data
+            })
+          })
+          .catch(error => {
+            console.log(error);
+          });
+    }
+    
+  render() {
+    return (
+        <div className='scrappers-section-main'>
+            <HeaderComponent/>
+            <div className='scrappers-section-header'>
+            <h1 className='scrappers-section-header-text'>
+                Преземање на содржина
+            </h1>
+            </div>
+
+            <div className='scrappers-info-section'>
+                <table cellPadding={20} className='scrappers-section-table'>
+                    <thead className='scrappers-section-table-head'>
+                    <tr>
+                    <th>Продавница</th>
+                    <th>Статус</th>
+                    <th>Датум</th>
+                    </tr>
+                    </thead>
+                    <tbody>
+                    {
+                        this.state.scrapperinfos.map((info,idx) => <ScrapperInfoComponent key={idx} id={info.id} store={info.store} 
+                        status={info.status} recievedAt={info.recievedAt}/>) 
+                    }
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    )
+  }
+}
+
+export default ScrappersComponent
Index: phonelux-frontend/src/components/SuperAdminComponent/SuperAdminComponent.js
===================================================================
--- phonelux-frontend/src/components/SuperAdminComponent/SuperAdminComponent.js	(revision fd5b100c1a316b5c886ba2b92de69042a34fde9a)
+++ phonelux-frontend/src/components/SuperAdminComponent/SuperAdminComponent.js	(revision 47f4eafa88902f713d8f8cfe5d10306816c61ea3)
@@ -69,13 +69,4 @@
 
     componentDidMount(){
-      // if(!localStorage.getItem('token'))
-      // {
-      //     window.location.href = "/"
-      // }
-
-      // if(this.context.role != 'SUPERADMIN')
-      // {
-      //     window.location.href = "/"
-      // }
       this.getUsers()
     }
