diff --git a/src/client/chat--leftFriends.jsx b/src/client/chat--leftFriends.jsx
index 026d64e..e504c53 100644
--- a/src/client/chat--leftFriends.jsx
+++ b/src/client/chat--leftFriends.jsx
@@ -1,13 +1,10 @@
import './chat--leftFriends.scss';
-import classnames from 'classnames';
import React from 'react';
-import {useParams} from 'react-router-dom';
import Channel from './channel';
export default function ChatLeftRooms() {
- const {type, name} = useParams();
const favorites = ['BabeHasHiccups'];
const friends = ['BabeHasHiccups', 'mystifired'].filter((channel) => -1 === favorites.indexOf(channel));
const favoritesActions = [
diff --git a/src/client/chat--leftRooms.jsx b/src/client/chat--leftRooms.jsx
index ee0654e..be020e8 100644
--- a/src/client/chat--leftRooms.jsx
+++ b/src/client/chat--leftRooms.jsx
@@ -1,13 +1,10 @@
import './chat--leftRooms.scss';
-import classnames from 'classnames';
import React from 'react';
-import {useParams} from 'react-router-dom';
import Channel from './channel';
export default function ChatLeftRooms() {
- const {type, name} = useParams();
const favorites = ['reddichat'];
const recent = ['reddichat', 'anonymous'].filter((channel) => -1 === favorites.indexOf(channel));
const favoritesActions = [
diff --git a/src/client/chat.jsx b/src/client/chat.jsx
index 6e4e92e..2478176 100644
--- a/src/client/chat.jsx
+++ b/src/client/chat.jsx
@@ -1,9 +1,10 @@
import './chat.scss';
import React, {useEffect, useRef} from 'react';
-import {useHistory} from 'react-router-dom';
+import {useSelector} from 'react-redux';
+import {useHistory, useParams} from 'react-router-dom';
-import hydration from '~/common/hydration';
+import {userSelector} from '~/common/state/user';
import useBreakpoints from './hooks/useBreakpoints';
import ChatCenter from './chat--center';
@@ -12,14 +13,17 @@ import ChatRight from './chat--right';
export default function Chat() {
const history = useHistory();
+ const {type, name} = useParams();
const ref = useRef(null);
const {tablet} = useBreakpoints();
+ const user = useSelector(userSelector);
+ const allowedUser = !user.isAnonymous || ('r' === type && 'anonymous' === name);
useEffect(() => {
- if (!hydration('user')) {
+ if (!allowedUser) {
history.goBack();
}
});
- if (!hydration('user')) {
+ if (!allowedUser) {
return null;
}
let origin;
@@ -81,9 +85,9 @@ export default function Chat() {
{...(tablet ? {} : onPointerEvents)}
ref={ref}
>
-
+ If you are exceptionally brave, you may choose to + {' '} + chat anonymously + . +
diff --git a/src/client/home.scss b/src/client/home.scss index a7c76bf..08ddfae 100644 --- a/src/client/home.scss +++ b/src/client/home.scss @@ -67,3 +67,11 @@ font-size: 2em; } } + +.home__anonymous { + line-height: 1.5em; + text-align: center; + a { + color: lighten($color-active, 20%); + } +} diff --git a/src/common/hydration.js b/src/common/state/hydration.js similarity index 100% rename from src/common/hydration.js rename to src/common/state/hydration.js diff --git a/src/common/state/user.js b/src/common/state/user.js index 6e6e56e..8be46bc 100644 --- a/src/common/state/user.js +++ b/src/common/state/user.js @@ -4,7 +4,7 @@ import { createSlice, } from '@reduxjs/toolkit'; -import hydration from '../hydration'; +import hydration from './hydration'; export const userSelector = (state) => state.user; @@ -32,6 +32,7 @@ const slice = createSlice({ name: 'user', initialState: hydration('user') || { friends: {}, + isAnonymous: true, redditUsername: 'anonymous', }, reducers: {