Compare commits

...

2 Commits

  1. 1
      package.json
  2. 9
      src/App.js
  3. 22
      src/Redux/proxy.js
  4. 2
      src/Redux/reducers/user.js
  5. 34
      src/Router.js
  6. 3
      src/history.js
  7. 2
      src/views/Auth/Auth.js
  8. 36
      src/views/ChatRoom/Body/Body.js
  9. 11
      src/views/ChatRoom/Body/Message/Message2D/Message2D.js
  10. 2
      src/views/ChatRoom/Body/Message/NormalMessage/NormalMessage.js
  11. 2
      src/views/ChatRoom/Body/Message/RadioMessage/RadioMessage.js
  12. 2
      src/views/ChatRoom/Body/Message/SliderMessage/SliderMessage.js
  13. 5
      src/views/ChatRoom/ChatRoom.js
  14. 2
      src/views/Home/Header/NavbarDrawer/NavbarDrawer.js
  15. 9
      yarn.lock

@ -16,6 +16,7 @@
"babel-plugin-wildcard": "^7.0.0", "babel-plugin-wildcard": "^7.0.0",
"bootstrap": "^4.6.0", "bootstrap": "^4.6.0",
"create-index": "^2.6.0", "create-index": "^2.6.0",
"history": "^5.0.0",
"jalali-moment": "^3.3.10", "jalali-moment": "^3.3.10",
"leaflet": "^1.7.1", "leaflet": "^1.7.1",
"node-sass": "^5.0.0", "node-sass": "^5.0.0",

@ -1,9 +1,14 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import AppRouter from './Router'; import AppRouter from './Router';
import store from './Redux/store';
import { Provider } from 'react-redux';
class App extends Component { class App extends Component {
render() { render() {
return <AppRouter />; return (
<Provider store={store}>
<AppRouter />
</Provider>
);
} }
} }

@ -4,6 +4,7 @@ const baseURL = 'https://chatstory.ir/api/v1'; //"https://chatstory.ir/api/v1";
const token = ''; const token = '';
const loginURL = 'user/otp/login'; const loginURL = 'user/otp/login';
const logoutURL = 'user/logout'; const logoutURL = 'user/logout';
window.baseURL = baseURL;
const Axios = axios.create({ const Axios = axios.create({
withCredentials: true, withCredentials: true,
validateStatus: null, validateStatus: null,
@ -43,18 +44,31 @@ class Proxy {
}; };
login = async (data, opt = { headers: { Authorization: `Bearer ${token}` } }) => { login = async (data, opt = { headers: { Authorization: `Bearer ${token}` } }) => {
const login = await this.post(loginURL, data, opt); const login = await this.post(loginURL, data, opt);
if (!login || !login.refreshToken) this.result('login', false); if (!login || !login.refreshToken) return this.result('login', false);
localStorage.setItem('refresh', login.refreshToken); localStorage.setItem('refresh', login.refreshToken);
delete login.refreshToken; delete login.refreshToken;
if (data != {}) setTimeout(() => (window.location.href = '/'), 100); localStorage.setItem('userData', JSON.stringify(login));
if (data != {}) window.router.setState({ islogin: true });
return this.result('login', login); return this.result('login', login);
}; };
logout = async () => { logout = async () => {
this.post(logoutURL); this.post(logoutURL);
localStorage.removeItem('refresh'); localStorage.removeItem('refresh');
window.location.href = '/'; localStorage.removeItem('userData');
window.router.setState({ islogin: false });
return this.result('logout', {});
};
status = () => {
let refresh = localStorage.getItem('refresh');
let userData = localStorage.getItem('userData');
if (!refresh) return false;
if (refresh == 'undefined') {
localStorage.removeItem('refresh');
localStorage.removeItem('userData');
return false;
}
return JSON.parse(userData);
}; };
status = () => (localStorage.getItem('refresh') ? true : false);
} }
const _proxy = new Proxy(); const _proxy = new Proxy();

@ -6,7 +6,7 @@ export default function user(state = initialState, action) {
let { type, data } = action; let { type, data } = action;
switch (type) { switch (type) {
case 'login': case 'login':
return { ...state, ...data, islogin: proxy.status() }; return { ...state, ...proxy.status(), islogin: proxy.status(), ...data };
case 'logout': case 'logout':
return { ...state, islogin: proxy.status() }; return { ...state, islogin: proxy.status() };
default: default:

@ -1,40 +1,32 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import store from './Redux/store'; import proxy from './Redux/proxy';
import { Provider } from 'react-redux';
import Home from './views/Home/Home'; import Home from './views/Home/Home';
import ChatRoom from './views/ChatRoom/ChatRoom'; import ChatRoom from './views/ChatRoom/ChatRoom';
import Auth from './views/Auth/Auth'; import Auth from './views/Auth/Auth';
import proxy from './Redux/proxy'; // import { connect } from 'react-redux';
export default class AppRouter extends Component { class AppRouter extends Component {
constructor(props) {
super(props);
window.router = this;
}
state = {};
render() { render() {
let home; let home = (
if (proxy.status()) {
home = (
<Route exact path={'/'}> <Route exact path={'/'}>
<Home /> {proxy.status() ? <Home /> : <Auth />}
</Route> </Route>
); );
} else {
home = (
<Route exact path={'/'}>
<Auth />
</Route>
);
}
return ( return (
<Provider store={store}>
<Router> <Router>
<Switch>{home}</Switch> <Switch>{home}</Switch>
<Route exact path={`/chatroom/:id`}> <Route exact path={`/chatroom/:id`}>
<ChatRoom /> <ChatRoom />
</Route> </Route>
<Route exact path={'/auth'}>
<Auth />
</Route>
</Router> </Router>
</Provider>
); );
} }
} }
export default AppRouter; //connect((state) => ({ isLogin: state.user.isLogin }), {})(AppRouter);

@ -0,0 +1,3 @@
// import { createBrowserHistory } from 'history';
// export default createBrowserHistory();

@ -8,11 +8,11 @@ import './Auth.scss';
export default class Auth extends Component { export default class Auth extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
page: 'logo', page: 'logo',
}; };
} }
setPage = (val) => { setPage = (val) => {
this.setState({ this.setState({
page: val, page: val,

@ -6,8 +6,7 @@ import { RecordState } from 'audio-react-recorder';
import ReactPlayer from 'react-player'; import ReactPlayer from 'react-player';
import ReactAudioPlayer from 'react-audio-player'; import ReactAudioPlayer from 'react-audio-player';
import { ToastContainer } from 'react-toastify'; import { ToastContainer } from 'react-toastify';
import photo from '../../../assets/images/reza.png';
import photo1 from '../../../assets/images/user2.png';
import './Body.scss'; import './Body.scss';
import { list, send, sendKeys } from '../../../Redux/actions/message'; import { list, send, sendKeys } from '../../../Redux/actions/message';
import { info, bio } from '../../../Redux/actions/chat'; import { info, bio } from '../../../Redux/actions/chat';
@ -343,12 +342,15 @@ class Body extends Component {
} }
render() { render() {
const { setPage } = this.props; const { setPage, chatInfo, messageList, userId } = this.props;
const userIdx = {};
chatInfo.users.map((e) => (userIdx[e.id] = e));
console.log({ userId });
return ( return (
<div className="chat-body d-flex flex-column"> <div className="chat-body d-flex flex-column">
<div className="chat-room__status d-flex flex-column" onClick={() => setPage('info')}> <div className="chat-room__status d-flex flex-column" onClick={() => setPage('info')}>
<h1>{this.props.info.title}</h1> <h1>{chatInfo.title}</h1>
<p>{this.props.info.subtitle}</p> <p>{chatInfo.subtitle}</p>
</div> </div>
<div <div
className="chat-body__content d-flex flex-column" className="chat-body__content d-flex flex-column"
@ -359,15 +361,18 @@ class Body extends Component {
paddingBottom: this.state.footer === 'suggest' ? 110 : 70, paddingBottom: this.state.footer === 'suggest' ? 110 : 70,
}} }}
> >
{this.props.message_list.map((item, i) => {chatInfo.users &&
this.state.image === null && this.state.music === null && this.state.video === null ? ( messageList.map((item, i) =>
this.state.image === null &&
this.state.music === null &&
this.state.video === null ? (
<Message <Message
isSelf={this.props.userId == item.userId} isSelf={userId == item.userId}
key={i} key={i}
file={this.state.image} file={this.state.image}
document={this.state.document} document={this.state.document}
message={item} message={item}
user={this.props.info.users[item.userId]} user={userIdx[item.userId] || { id: 0, fileId: 0, name: 'null' }}
/> />
) : null ) : null
)} )}
@ -435,10 +440,13 @@ class Body extends Component {
} }
} }
export default connect( export default connect(
(state) => ({ (state) => {
info: state.chat.info, console.log(state);
userId: state.user.id, return {
message_list: state.message.list || [], chatInfo: state.chat.info,
}), userId: state.user.isLogin.id,
messageList: state.message.list || [],
};
},
{ list, send, sendKeys, info, bio } { list, send, sendKeys, info, bio }
)(Body); )(Body);

@ -14,7 +14,7 @@ export default class Message2D extends Component {
}} }}
> >
<img <img
src={user.imageUri} src={window.baseURL + '/file/download/' + user.fileId}
style={{ alignSelf: isSelf ? 'flex-end' : 'flex-start' }} style={{ alignSelf: isSelf ? 'flex-end' : 'flex-start' }}
alt={message.id} alt={message.id}
/> />
@ -26,11 +26,14 @@ export default class Message2D extends Component {
) : null} ) : null}
</div> </div>
<div className="message-2d__options d-flex flex-column"> <div className="message-2d__options d-flex flex-column">
{message.options.map((option) => ( {message.options.map((option, i) => (
<div className="message-2d__options--row d-flex"> <div
key={message.id + '_' + option.id + '_' + i}
className="message-2d__options--row d-flex"
>
{option.map((item, i) => ( {option.map((item, i) => (
<div <div
key={i} key={message.id + '_' + item.id + '_' + i}
className="d-flex" className="d-flex"
style={{ width: `calc(100% / ${option.length} )` }} style={{ width: `calc(100% / ${option.length} )` }}
draggable={true} draggable={true}

@ -18,7 +18,7 @@ export default class NormalMessage extends Component {
}} }}
> >
<img <img
src={user.imageUri} src={window.baseURL + '/file/download/' + user.fileId}
style={{ alignSelf: isSelf ? 'flex-end' : 'flex-start' }} style={{ alignSelf: isSelf ? 'flex-end' : 'flex-start' }}
alt={message.id} alt={message.id}
/> />

@ -26,7 +26,7 @@ export default class RadioMessage extends Component {
}} }}
> >
<img <img
src={user.imageUri} src={window.baseURL + '/file/download/' + user.fileId}
style={{ alignSelf: isSelf ? 'flex-end' : 'flex-start' }} style={{ alignSelf: isSelf ? 'flex-end' : 'flex-start' }}
alt={message.id} alt={message.id}
/> />

@ -42,7 +42,7 @@ export default class SliderMessage extends Component {
}} }}
> >
<img <img
src={user.imageUri} src={window.baseURL + '/file/download/' + user.fileId}
style={{ alignSelf: isSelf ? 'flex-end' : 'flex-start' }} style={{ alignSelf: isSelf ? 'flex-end' : 'flex-start' }}
alt={message.id} alt={message.id}
/> />

@ -8,11 +8,14 @@ import './ChatRoom.scss';
export default class ChatRoom extends Component { export default class ChatRoom extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
window.nav = this.nav.bind(this);
this.state = { this.state = {
page: 'chatroom', page: 'chatroom',
}; };
} }
nav = (url) => {
this.props.history.push(url);
};
setPage = (val) => { setPage = (val) => {
this.setState({ this.setState({
page: val, page: val,

@ -50,7 +50,7 @@ class NavbarDrawer extends Component {
}, },
{ {
name: 'خروج', name: 'خروج',
link: '/auth', link: '/',
icon: <ExitToAppIcon style={{ color: 'white', width: 35, height: 35, marginLeft: 10 }} />, icon: <ExitToAppIcon style={{ color: 'white', width: 35, height: 35, marginLeft: 10 }} />,
toast: '', toast: '',
onClick: this.props.logout, onClick: this.props.logout,

@ -1158,7 +1158,7 @@
dependencies: dependencies:
regenerator-runtime "^0.13.4" regenerator-runtime "^0.13.4"
"@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.12.5", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2": "@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.12.5", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
version "7.14.0" version "7.14.0"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.14.0.tgz#46794bc20b612c5f75e62dd071e24dfd95f1cbe6" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.14.0.tgz#46794bc20b612c5f75e62dd071e24dfd95f1cbe6"
integrity sha512-JELkvo/DlpNdJ7dlyw/eY7E0suy5i5GQH+Vlxaq1nsNJ+H7f4Vtv3jMeCEgRhZZQFXTjldYfQgv2qmM6M1v5wA== integrity sha512-JELkvo/DlpNdJ7dlyw/eY7E0suy5i5GQH+Vlxaq1nsNJ+H7f4Vtv3jMeCEgRhZZQFXTjldYfQgv2qmM6M1v5wA==
@ -6182,6 +6182,13 @@ history@^4.9.0:
tiny-warning "^1.0.0" tiny-warning "^1.0.0"
value-equal "^1.0.1" value-equal "^1.0.1"
history@^5.0.0:
version "5.0.0"
resolved "https://registry.yarnpkg.com/history/-/history-5.0.0.tgz#0cabbb6c4bbf835addb874f8259f6d25101efd08"
integrity sha512-3NyRMKIiFSJmIPdq7FxkNMJkQ7ZEtVblOQ38VtKaA0zZMW1Eo6Q6W8oDKEflr1kNNTItSnk4JMCO1deeSgbLLg==
dependencies:
"@babel/runtime" "^7.7.6"
hmac-drbg@^1.0.1: hmac-drbg@^1.0.1:
version "1.0.1" version "1.0.1"
resolved "https://registry.yarnpkg.com/hmac-drbg/-/hmac-drbg-1.0.1.tgz#d2745701025a6c775a6c545793ed502fc0c649a1" resolved "https://registry.yarnpkg.com/hmac-drbg/-/hmac-drbg-1.0.1.tgz#d2745701025a6c775a6c545793ed502fc0c649a1"

Loading…
Cancel
Save