diff --git a/package.json b/package.json
index a8e3c4e..1f29171 100644
--- a/package.json
+++ b/package.json
@@ -2,6 +2,7 @@
"name": "chat-pwa",
"version": "0.1.0",
"private": true,
+ "proxy": "http://localhost:4040/",
"dependencies": {
"@material-ui/core": "^4.11.4",
"@material-ui/icons": "^4.11.2",
@@ -44,16 +45,9 @@
"react-app/jest"
]
},
- "browserslist": {
- "production": [
- ">0.2%",
- "not dead",
- "not op_mini all"
- ],
- "development": [
- "last 1 chrome version",
- "last 1 firefox version",
- "last 1 safari version"
- ]
- }
-}
+ "browserslist": [
+ ">0.2%",
+ "not dead",
+ "not op_mini all"
+ ]
+}
\ No newline at end of file
diff --git a/src/Redux/proxy.js b/src/Redux/proxy.js
new file mode 100644
index 0000000..cccdbf9
--- /dev/null
+++ b/src/Redux/proxy.js
@@ -0,0 +1,50 @@
+import axios from 'axios'
+const Axios = axios.create({
+ withCredentials: true,
+ validateStatus:null,
+ baseURL: "https://chatstory.ir/api/v1"
+ // baseURL: "http://localhost:4040/api/v1"
+ })
+ class Proxy{
+ constructor({alert,loginUrl}={}){
+ this.alert = alert || window.alert;
+ this.loginUrl = loginUrl || "user/otp/login";
+ }
+ get = (url,params,opt={})=> this.check(()=>Axios.get(url,{params,...opt}));
+ post = (url,params,opt={})=> this.check(()=>Axios.post(url,params,opt));
+ put = (url,params,opt={})=> this.check(()=> Axios.put(url,params,opt));
+ delete = (url,params,opt={})=> this.check(()=> Axios.delete(url,params,opt));
+ check = async (fetch)=>{
+ let response = await fetch()
+ switch(response.status){
+ case 200: return response.data.data;
+ case 401:
+ console.log("refreshing")
+ if(await this.refresh()) return (await fetch()).data.data;
+ break;
+ default: window.alert(response.data.message);
+ }
+ return false;
+ }
+ refresh = async()=>{
+ let refresh = localStorage.getItem('refresh')
+ if(!refresh) window.location.href = "/"
+ let login = await this.login({},{headers: { "Authorization": `Bearer ${refresh}`}})
+ return login ? true : false
+ }
+ login = async(data,opt={})=>{
+ const login = await this.post(this.loginUrl,data,opt)
+ if(!login) return false;
+ localStorage.setItem("refresh",login.refreshToken)
+ delete login.refreshToken
+ return login
+ }
+ logout = async()=>{
+ localStorage.removeItem("refresh");
+ window.location.href = "/"
+ }
+ status = ()=>localStorage.getItem("refresh")?true:false;
+
+ }
+ const _proxy = new Proxy()
+ export default _proxy;
\ No newline at end of file
diff --git a/src/Router.js b/src/Router.js
index f5f6453..d21d079 100644
--- a/src/Router.js
+++ b/src/Router.js
@@ -6,12 +6,11 @@ import { Provider } from "react-redux";
import Home from "./views/Home/Home";
import ChatRoom from "./views/ChatRoom/ChatRoom";
import Auth from "./views/Auth/Auth";
-
-
+import proxy from "./Redux/proxy";
export default class AppRouter extends Component {
render() {
let home;
- if(!localStorage.getItem("access_token")){
+ if(proxy.status()){
home =
diff --git a/src/views/Auth/Auth.js b/src/views/Auth/Auth.js
index 38dc521..03f9dd3 100644
--- a/src/views/Auth/Auth.js
+++ b/src/views/Auth/Auth.js
@@ -28,7 +28,7 @@ export default class Auth extends Component {
this.state.page === 'bio' ? : null
}
{
- this.state.page === 'login' ? : null
+ this.state.page === 'login' ? : null
}
);
diff --git a/src/views/Auth/Auth.scss b/src/views/Auth/Auth.scss
index 81de3a9..c041c4c 100644
--- a/src/views/Auth/Auth.scss
+++ b/src/views/Auth/Auth.scss
@@ -1,4 +1,4 @@
-@media screen and (max-width: 450px){
+@media screen and (max-width: 4500px){
.auth{
width: 100vw;
height: 100vh;
diff --git a/src/views/Auth/Bio/Bio.scss b/src/views/Auth/Bio/Bio.scss
index 2f11fd6..152f521 100644
--- a/src/views/Auth/Bio/Bio.scss
+++ b/src/views/Auth/Bio/Bio.scss
@@ -1,4 +1,4 @@
-@media screen and (max-width: 450px){
+@media screen and (max-width: 4500px){
.bio{
width: 100%;
height: 100%;
diff --git a/src/views/Auth/Login/Code/Code.js b/src/views/Auth/Login/Code/Code.js
index 2506e34..dc110e9 100644
--- a/src/views/Auth/Login/Code/Code.js
+++ b/src/views/Auth/Login/Code/Code.js
@@ -24,13 +24,18 @@ export default class Code extends Component {
[e.target.name]: e.target.value,
})
if(e.target.name === 'auth_code1'){
+ this.setState({o1:e.target.value})
this.inputRef2.focus();
}else if(e.target.name === 'auth_code2'){
+ this.setState({o2:e.target.value})
this.inputRef3.focus();
}else if(e.target.name === 'auth_code3'){
+ this.setState({o3:e.target.value})
this.inputRef4.focus();
}else if(e.target.name === 'auth_code4'){
- window.location.href="/"
+ const o4 = e.target.value;
+ const {o1,o2,o3} = this.state
+ this.props.parent.setState({otp:`${o1}${o2}${o3}${o4}`})
return;
}
diff --git a/src/views/Auth/Login/Login.js b/src/views/Auth/Login/Login.js
index ba0b08a..20d5a87 100644
--- a/src/views/Auth/Login/Login.js
+++ b/src/views/Auth/Login/Login.js
@@ -2,8 +2,9 @@ import React, { Component } from 'react';
import Mobile from './Mobile/Mobile';
import Code from './Code/Code';
-
+import proxy from '../../../Redux/proxy'
import './Login.scss';
+
export default class Login extends Component {
constructor(props) {
super(props);
@@ -11,26 +12,20 @@ export default class Login extends Component {
section : 0,
}
}
- setSection = (val) => {
- this.setState({
- section : val,
- })
- }
- componentDidMount() {
-
+ async componentDidUpdate(){
+ const {cellphone,otp,section} = this.state
+ if(cellphone && !otp) proxy.get("public/otp",{cellphone})
+ if(section && cellphone && otp) if(await proxy.login({cellphone,otp})) window.location.href="/"
}
render() {
+ const {section} = this.state;
return(
{
- this.state.section === 0 ?
-
: null
- }
- {
- this.state.section === 1 ?
-
: null
+ section ? :
}
+
Eema
Entertainments
diff --git a/src/views/Auth/Login/Login.scss b/src/views/Auth/Login/Login.scss
index 0055fd0..76898fc 100644
--- a/src/views/Auth/Login/Login.scss
+++ b/src/views/Auth/Login/Login.scss
@@ -1,4 +1,4 @@
-@media screen and (max-width: 450px){
+@media screen and (max-width: 4500px){
.login{
width: 100%;
height: 100%;
diff --git a/src/views/Auth/Login/Mobile/Mobile.js b/src/views/Auth/Login/Mobile/Mobile.js
index 7639e85..e3eefe5 100644
--- a/src/views/Auth/Login/Mobile/Mobile.js
+++ b/src/views/Auth/Login/Mobile/Mobile.js
@@ -11,10 +11,14 @@ export default class Mobile extends Component {
-
- {this.props.tabBar === 'chat' ? : null}
- {this.props.tabBar === 'location' ? : null}
- {this.props.tabBar === 'info' ? : null}
+ {this.props.tabBar === 'chat' ? : null}
+ {this.props.tabBar === 'location' ? : null}
+ {this.props.tabBar === 'info' ? : null}
);
}
diff --git a/src/views/Home/Body/Body.scss b/src/views/Home/Body/Body.scss
index 8ccc048..a9d17c9 100644
--- a/src/views/Home/Body/Body.scss
+++ b/src/views/Home/Body/Body.scss
@@ -1,4 +1,4 @@
-@media screen and (max-width: 450px){
+@media screen and (max-width: 4500px){
.body{
background-color: rgb(228, 227, 227);
flex : 1;
@@ -6,6 +6,7 @@
border-top-left-radius: 40px;
z-index: 10;
overflow-y : scroll;
+ overflow-x: hidden;
border :4px solid white;
top:5px;
position: relative;
diff --git a/src/views/Home/Body/ChatList/Chat/Chat.scss b/src/views/Home/Body/ChatList/Chat/Chat.scss
index 1f979e5..0812a55 100644
--- a/src/views/Home/Body/ChatList/Chat/Chat.scss
+++ b/src/views/Home/Body/ChatList/Chat/Chat.scss
@@ -1,4 +1,4 @@
-@media screen and (max-width: 450px){
+@media screen and (max-width: 4500px){
.chat{
width: 100%;
direction: rtl;
diff --git a/src/views/Home/Body/ChatList/ChatList.js b/src/views/Home/Body/ChatList/ChatList.js
index 9f2fcee..fdba790 100644
--- a/src/views/Home/Body/ChatList/ChatList.js
+++ b/src/views/Home/Body/ChatList/ChatList.js
@@ -1,10 +1,11 @@
import React, { Component } from 'react';
import Chat from './Chat/Chat';
-
import pencil from '../../../../assets/icons/pencil.svg';
import logo from '../../../../assets/icons/logo.svg';
import './ChatList.scss';
+import proxy from "../../../../Redux/proxy"
+
export default class ChatList extends Component {
constructor(props) {
super(props);
@@ -26,6 +27,14 @@ export default class ChatList extends Component {
},
],
}
+
+
+
+ }
+ async componentDidMount(){
+ console.log(proxy)
+ let chatList = await proxy.get('chat/list');
+ console.log(chatList)
}
render(){
return (
diff --git a/src/views/Home/Body/ChatList/ChatList.scss b/src/views/Home/Body/ChatList/ChatList.scss
index 8283c21..8be54b1 100644
--- a/src/views/Home/Body/ChatList/ChatList.scss
+++ b/src/views/Home/Body/ChatList/ChatList.scss
@@ -1,4 +1,4 @@
-@media screen and (max-width: 450px){
+@media screen and (max-width: 4500px){
.chat-list{
flex : 1;
border-radius: 40px;
diff --git a/src/views/Home/Body/Location/Location.scss b/src/views/Home/Body/Location/Location.scss
index 5aa6b8e..6c796bc 100644
--- a/src/views/Home/Body/Location/Location.scss
+++ b/src/views/Home/Body/Location/Location.scss
@@ -1,4 +1,4 @@
-@media screen and (max-width: 450px){
+@media screen and (max-width: 4500px){
.location{
width: 100%;
height: 100%;
diff --git a/src/views/Home/Header/Header.scss b/src/views/Home/Header/Header.scss
index daa5e07..2d7d767 100644
--- a/src/views/Home/Header/Header.scss
+++ b/src/views/Home/Header/Header.scss
@@ -1,4 +1,4 @@
-@media screen and (max-width: 450px){
+@media screen and (max-width: 4500px){
.header{
height: 60px;
width: 100%;
diff --git a/src/views/Home/Header/NavbarDrawer/NavbarDrawer.js b/src/views/Home/Header/NavbarDrawer/NavbarDrawer.js
index ac91828..c4a4e7e 100644
--- a/src/views/Home/Header/NavbarDrawer/NavbarDrawer.js
+++ b/src/views/Home/Header/NavbarDrawer/NavbarDrawer.js
@@ -9,7 +9,7 @@ import SettingsIcon from '@material-ui/icons/Settings';
import UpdateIcon from '@material-ui/icons/Update';
import ReportIcon from '@material-ui/icons/Report';
import ShareIcon from '@material-ui/icons/Share';
-
+import proxy from '../../../../Redux/proxy'
// import {connect} from 'react-redux';
import './NavbarDrawer.scss';
@@ -51,9 +51,11 @@ class NavbarDrawer extends Component {
},
{
name: 'خروج',
- link: '/',
+ link: '/auth',
icon: ,
toast : '',
+ onClick : proxy.logout
+
},
],
}
diff --git a/src/views/Home/Home.scss b/src/views/Home/Home.scss
index bef0b16..ae77f13 100644
--- a/src/views/Home/Home.scss
+++ b/src/views/Home/Home.scss
@@ -1,5 +1,6 @@
-@media screen and (max-width: 450px){
+@media screen and (max-width: 4500px){
.home{
+ overflow-y: hidden;
flex : 1;
background: rgb(139, 73, 186);
background: linear-gradient(180deg, rgb(144, 73, 186) 0%, rgb(111,108,255) 22%);
diff --git a/src/views/Home/TabBar/TabBar.scss b/src/views/Home/TabBar/TabBar.scss
index 581c2af..cfdc5cc 100644
--- a/src/views/Home/TabBar/TabBar.scss
+++ b/src/views/Home/TabBar/TabBar.scss
@@ -1,4 +1,4 @@
-@media screen and (max-width: 450px){
+@media screen and (max-width: 4500px){
.tabBar{
height: 50px;
width: 100%;