Skip to content
This repository was archived by the owner on Sep 1, 2021. It is now read-only.

Commit a7dc8a9

Browse files
Better leveling (#38)
* change lelvel up notification to simple toggle * made no xp roles and no xp channels work
1 parent 798d78e commit a7dc8a9

File tree

3 files changed

+336
-241
lines changed

3 files changed

+336
-241
lines changed

src/components/DashBoard/Discord/Plugins/Leveling.js

Lines changed: 187 additions & 104 deletions
Original file line numberDiff line numberDiff line change
@@ -4,25 +4,38 @@ import { DiscordContext } from "../../../../contexts/DiscordContext";
44
import { Link } from "react-router-dom";
55
import StyledSelect from "../../../../styled-components/StyledSelect";
66
import { Typography } from "@material-ui/core";
7-
import PrettoSlider from "../../../../styled-components/PrettoSlider"
7+
import PrettoSlider from "../../../../styled-components/PrettoSlider";
8+
import FancySwitch from "../../../../styled-components/FancySwitch";
9+
import {
10+
parseSelectValue,
11+
TransformObjectToSelectValue,
12+
channelLabel,
13+
} from "../../../../utils/functions";
14+
import RoleItem from "../../../../styled-components/RoleItem";
815

9-
const marks = [...Array(7)].map((item, index) => ({ value: (index / 2), label: `x${(index / 2)}` }));
16+
const marks = [...Array(7)].map((item, index) => ({ value: index / 2, label: `x${index / 2}` }));
1017

1118
const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
12-
const [levelUpAnnouncement, setLevelUpAnnouncement] = useState();
19+
const [levelUpAnnouncement, setLevelUpAnnouncement] = useState(false);
1320
const [announcementChannel, setAnnouncementChannel] = useState(false);
14-
const [levelUpMessage, setLevelUpMessage] = useState("Congrats {player}, you leveled up to level {level}!");
15-
const { setDashboardOpen, saveOnType } = useContext(DiscordContext);
21+
const [noXpRoles, setNoXpRoles] = useState([]);
22+
const [noXpChannels, setNoXpChannels] = useState([]);
23+
const [generalScaling, setGeneralScaling] = useState(1);
24+
const [levelUpMessage, setLevelUpMessage] = useState(
25+
"Congrats {player}, you leveled up to level {level}!"
26+
);
27+
const { setDashboardOpen, saveOnType } = useContext(DiscordContext);
1628
const guildId = userConnectedGuildInfo?.id;
1729

1830
const handleTypeSelect = useCallback(
1931
async e => {
2032
const guildLevelRef = firebase.db.collection("Leveling").doc(guildId);
21-
setLevelUpAnnouncement(e);
33+
let value = e.target.checked ? 3 : 1;
34+
setLevelUpAnnouncement(e.target.checked);
2235
try {
23-
await guildLevelRef.update({ type: e.value });
36+
await guildLevelRef.update({ type: value });
2437
} catch (err) {
25-
await guildLevelRef.set({ type: e.value });
38+
await guildLevelRef.set({ type: value });
2639
}
2740
setDashboardOpen(true);
2841
},
@@ -48,10 +61,12 @@ const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
4861
async e => {
4962
const guildLevelRef = firebase.db.collection("Leveling").doc(guildId);
5063
setAnnouncementChannel(e);
64+
const notifications = parseSelectValue(e);
65+
console.log(notifications);
5166
try {
52-
guildLevelRef.update({ notifications: e.value });
67+
await guildLevelRef.update({ notifications });
5368
} catch (err) {
54-
guildLevelRef.set({ notifications: e.value });
69+
await guildLevelRef.set({ notifications });
5570
}
5671
setDashboardOpen(true);
5772
},
@@ -60,36 +75,105 @@ const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
6075

6176
useEffect(() => {
6277
(async () => {
63-
const guild = await firebase.db
64-
.collection("Leveling")
65-
.doc(guildId || " ")
66-
.get();
67-
const data = guild.data();
68-
if (data) {
69-
const id = data.notifications;
70-
if (id) {
71-
const apiUrl = `${process.env.REACT_APP_API_URL}/resolvechannel?guild=${guildId}&channel=${id}`;
72-
const response = await fetch(apiUrl);
73-
const channel = await response.json();
74-
setAnnouncementChannel({
75-
value: id,
76-
label: (
77-
<>
78-
<span>{channel.name}</span>
79-
<span className="channel-category">{channel.parent}</span>
80-
</>
81-
),
82-
});
83-
setLevelUpAnnouncement({
84-
value: data.type,
85-
label: ["Disabled", "Current Channel", "Custom Channel"][data.type - 1],
86-
});
87-
setLevelUpMessage(data.message);
78+
try {
79+
const guildRef = await firebase.db.collection("Leveling").doc(guildId || " ");
80+
const guild = await guildRef.get();
81+
const settings = await guildRef.collection("settings").get();
82+
const data = guild.data();
83+
const settingsData = settings.docs
84+
.map(doc => ({ id: doc.id, ...doc.data() }))
85+
.reduce((acc, cur) => ({ [cur.id]: cur, ...acc }), {});
86+
if (settingsData) {
87+
setGeneralScaling(settingsData.scaling.general || 1);
88+
setNoXpRoles(
89+
settingsData.bannedItems?.roles
90+
?.map(id => userConnectedGuildInfo.roles.find(role => role.id === id))
91+
?.map(role => ({
92+
value: TransformObjectToSelectValue(role),
93+
label: <RoleItem {...role}>{role.name}</RoleItem>,
94+
})) || []
95+
);
96+
setNoXpChannels(
97+
settingsData.bannedItems?.channels
98+
?.map(id =>
99+
userConnectedGuildInfo.channels.find(channel => channel.id === id)
100+
)
101+
.map(channel => ({
102+
value: TransformObjectToSelectValue(channel),
103+
label: channelLabel(channel),
104+
})) || []
105+
);
106+
}
107+
if (data) {
108+
const id = data.notifications;
109+
if (id) {
110+
const apiUrl = `${process.env.REACT_APP_API_URL}/resolvechannel?guild=${guildId}&channel=${id}`;
111+
const response = await fetch(apiUrl);
112+
const channel = await response.json();
113+
setAnnouncementChannel({
114+
value: id,
115+
label: channelLabel(channel),
116+
});
117+
setLevelUpAnnouncement({
118+
value: data.type,
119+
label: ["Disabled", "Current Channel", "Custom Channel"][data.type - 1],
120+
});
121+
setLevelUpMessage(data.message);
122+
}
88123
}
124+
} catch (err) {
125+
console.log(err.message);
89126
}
90127
})();
91128
}, [location, guildId]);
92129

130+
const handleGeneralScaling = async (e, value) => {
131+
const guildLevelRef = firebase.db
132+
.collection("Leveling")
133+
.doc(guildId)
134+
.collection("settings")
135+
.doc("scaling");
136+
setGeneralScaling(value);
137+
try {
138+
await guildLevelRef.update({ general: value });
139+
} catch (err) {
140+
await guildLevelRef.set({ general: value });
141+
}
142+
setDashboardOpen(true);
143+
};
144+
145+
const handleNoXpRoleSelect = async e => {
146+
const guildLevelRef = firebase.db
147+
.collection("Leveling")
148+
.doc(guildId)
149+
.collection("settings")
150+
.doc("bannedItems");
151+
setNoXpRoles(e);
152+
const value = parseSelectValue(e);
153+
try {
154+
await guildLevelRef.update({ roles: value });
155+
} catch (err) {
156+
await guildLevelRef.set({ roles: value });
157+
}
158+
setDashboardOpen(true);
159+
};
160+
161+
const handleNoXpChannelSelect = async e => {
162+
const guildLevelRef = firebase.db
163+
.collection("Leveling")
164+
.doc(guildId)
165+
.collection("settings")
166+
.doc("bannedItems");
167+
setNoXpChannels(e);
168+
const value = parseSelectValue(e);
169+
try {
170+
await guildLevelRef.update({ channels: value });
171+
} catch (err) {
172+
await guildLevelRef.set({ channels: value });
173+
}
174+
setDashboardOpen(true);
175+
};
176+
93177
return (
94178
<div>
95179
<div className="plugin-item-header">
@@ -102,9 +186,14 @@ const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
102186
<div className="plugin-item-subheader flex">
103187
<span>
104188
<h2>Leveling Up</h2>
105-
<h4>Whenever a user gains a level, DisStreamBot can send a personalized message.</h4>
189+
<h4>
190+
Whenever a user gains a level, DisStreamBot can send a personalized message.
191+
</h4>
106192
</span>
107-
<Link className="leader-board-link" to={`/leaderboard/${userConnectedGuildInfo?.id}`}>
193+
<Link
194+
className="leader-board-link"
195+
to={`/leaderboard/${userConnectedGuildInfo?.id}`}
196+
>
108197
Leaderboard
109198
</Link>
110199
</div>
@@ -113,43 +202,36 @@ const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
113202
<div className="channels">
114203
<div id="announcement-type">
115204
<h5 className="bold uppercase">Level up announcement</h5>
205+
<FancySwitch
206+
checked={levelUpAnnouncement}
207+
onChange={handleTypeSelect}
208+
name="enable-message"
209+
/>
210+
</div>
211+
<div id="announcement-channel">
212+
<h5 className="bold uppercase">ANNOUNCEMENT CHANNEL</h5>
116213
<StyledSelect
214+
isDisabled={!levelUpAnnouncement}
117215
closeMenuOnSelect
118-
onChange={handleTypeSelect}
119-
placeholder="Select Annoucement type"
120-
value={levelUpAnnouncement}
121-
options={[
122-
{ value: 1, label: "Disabled" },
123-
{ value: 3, label: "Custom Channel" },
124-
].map(type => type)}
216+
onChange={handleAnnoucmentSelect}
217+
placeholder="Select Annoucement Channel"
218+
value={announcementChannel}
219+
options={userConnectedGuildInfo?.channels
220+
?.sort((a, b) => a.parent.localeCompare(b.parent))
221+
?.map(channel => ({
222+
value: TransformObjectToSelectValue(channel),
223+
label: channelLabel(channel),
224+
}))}
125225
/>
126226
</div>
127-
{levelUpAnnouncement?.value === 3 && (
128-
<div id="announcement-channel">
129-
<h5 className="bold uppercase">ANNOUNCEMENT CHANNEL</h5>
130-
<StyledSelect
131-
closeMenuOnSelect
132-
onChange={handleAnnoucmentSelect}
133-
placeholder="Select Annoucement Channel"
134-
value={announcementChannel}
135-
options={userConnectedGuildInfo?.channels
136-
?.sort((a, b) => a.parent.localeCompare(b.parent))
137-
?.map(channel => ({
138-
value: channel.id,
139-
label: (
140-
<>
141-
<span>{channel.name}</span>
142-
<span className="channel-category">{channel.parent}</span>
143-
</>
144-
),
145-
}))}
146-
/>
147-
</div>
148-
)}
149227
</div>
150228
<div className="message">
151229
<h5>LEVEL UP ANNOUNCEMENT MESSAGE</h5>
152-
<textarea disabled={levelUpAnnouncement.value===1} value={levelUpMessage} onChange={handleMessageChange}></textarea>
230+
<textarea
231+
disabled={!levelUpAnnouncement}
232+
value={levelUpMessage}
233+
onChange={handleMessageChange}
234+
></textarea>
153235
</div>
154236
</div>
155237
</div>
@@ -160,58 +242,59 @@ const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
160242
General XP Scaling
161243
</Typography>
162244
<PrettoSlider
245+
value={generalScaling}
246+
onChange={handleGeneralScaling}
163247
defaultValue={1}
164248
getAriaValueText={value => `${value}xp`}
165-
aria-labelledby="discrete-slider"
249+
aria-labelledby="xp scaling"
166250
valueLabelDisplay="auto"
167251
step={0.5}
168-
// marks
169252
min={0}
170253
max={3}
171254
marks={marks}
172255
/>
173256
</div>
174257
<hr />
175-
258+
176259
<h4 className="plugin-section-title">No Rank Items</h4>
260+
177261
<div className="no-rank-items">
178262
<div>
179-
<StyledSelect
180-
closeMenuOnSelect
181-
onChange={() => {}}
182-
placeholder="No XP Roles"
183-
value={""}
184-
options={userConnectedGuildInfo?.channels
185-
?.sort((a, b) => a.parent.localeCompare(b.parent))
186-
?.map(channel => ({
187-
value: channel.id,
188-
label: (
189-
<>
190-
<span>{channel.name}</span>
191-
<span className="channel-category">{channel.parent}</span>
192-
</>
193-
),
194-
}))}
195-
/>
263+
<h4 className="plugin-section-title">No XP Roles</h4>
264+
<h4 className="plugin-section-title">No XP Channels</h4>
196265
</div>
197266
<div>
198-
<StyledSelect
199-
closeMenuOnSelect
200-
onChange={() => {}}
201-
placeholder="No XP Channels"
202-
value={""}
203-
options={userConnectedGuildInfo?.channels
204-
?.sort((a, b) => a.parent.localeCompare(b.parent))
205-
?.map(channel => ({
206-
value: channel.id,
207-
label: (
208-
<>
209-
<span>{channel.name}</span>
210-
<span className="channel-category">{channel.parent}</span>
211-
</>
212-
),
213-
}))}
214-
/>
267+
<div>
268+
<StyledSelect
269+
isMulti
270+
closeMenuOnSelect={false}
271+
onChange={handleNoXpRoleSelect}
272+
placeholder="No XP Roles"
273+
value={noXpRoles}
274+
options={userConnectedGuildInfo?.roles
275+
?.sort((a, b) => b.rawPosition - a.rawPosition)
276+
?.map(role => ({
277+
value: TransformObjectToSelectValue(role),
278+
label: <RoleItem {...role}>{role.name}</RoleItem>,
279+
}))}
280+
/>
281+
</div>
282+
283+
<div>
284+
<StyledSelect
285+
isMulti
286+
closeMenuOnSelect={false}
287+
onChange={handleNoXpChannelSelect}
288+
placeholder="No XP Channels"
289+
value={noXpChannels}
290+
options={userConnectedGuildInfo?.channels
291+
?.sort((a, b) => a.parent.localeCompare(b.parent))
292+
?.map(channel => ({
293+
value: TransformObjectToSelectValue(channel),
294+
label: channelLabel(channel),
295+
}))}
296+
/>
297+
</div>
215298
</div>
216299
</div>
217300
</div>

0 commit comments

Comments
 (0)