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

Better leveling #38

Merged
merged 2 commits into from
Nov 11, 2020
Merged

Better leveling #38

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
38b0b92
change lelvel up notification to simple toggle
GypsyDangerous Nov 11, 2020
d311807
made no xp roles and no xp channels work
GypsyDangerous Nov 11, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
291 changes: 187 additions & 104 deletions src/components/DashBoard/Discord/Plugins/Leveling.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,25 +4,38 @@ import { DiscordContext } from "../../../../contexts/DiscordContext";
import { Link } from "react-router-dom";
import StyledSelect from "../../../../styled-components/StyledSelect";
import { Typography } from "@material-ui/core";
import PrettoSlider from "../../../../styled-components/PrettoSlider"
import PrettoSlider from "../../../../styled-components/PrettoSlider";
import FancySwitch from "../../../../styled-components/FancySwitch";
import {
parseSelectValue,
TransformObjectToSelectValue,
channelLabel,
} from "../../../../utils/functions";
import RoleItem from "../../../../styled-components/RoleItem";

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

const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
const [levelUpAnnouncement, setLevelUpAnnouncement] = useState();
const [levelUpAnnouncement, setLevelUpAnnouncement] = useState(false);
const [announcementChannel, setAnnouncementChannel] = useState(false);
const [levelUpMessage, setLevelUpMessage] = useState("Congrats {player}, you leveled up to level {level}!");
const { setDashboardOpen, saveOnType } = useContext(DiscordContext);
const [noXpRoles, setNoXpRoles] = useState([]);
const [noXpChannels, setNoXpChannels] = useState([]);
const [generalScaling, setGeneralScaling] = useState(1);
const [levelUpMessage, setLevelUpMessage] = useState(
"Congrats {player}, you leveled up to level {level}!"
);
const { setDashboardOpen, saveOnType } = useContext(DiscordContext);
const guildId = userConnectedGuildInfo?.id;

const handleTypeSelect = useCallback(
async e => {
const guildLevelRef = firebase.db.collection("Leveling").doc(guildId);
setLevelUpAnnouncement(e);
let value = e.target.checked ? 3 : 1;
setLevelUpAnnouncement(e.target.checked);
try {
await guildLevelRef.update({ type: e.value });
await guildLevelRef.update({ type: value });
} catch (err) {
await guildLevelRef.set({ type: e.value });
await guildLevelRef.set({ type: value });
}
setDashboardOpen(true);
},
Expand All @@ -48,10 +61,12 @@ const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
async e => {
const guildLevelRef = firebase.db.collection("Leveling").doc(guildId);
setAnnouncementChannel(e);
const notifications = parseSelectValue(e);
console.log(notifications);
try {
guildLevelRef.update({ notifications: e.value });
await guildLevelRef.update({ notifications });
} catch (err) {
guildLevelRef.set({ notifications: e.value });
await guildLevelRef.set({ notifications });
}
setDashboardOpen(true);
},
Expand All @@ -60,36 +75,105 @@ const Leveling = ({ location, guild: userConnectedGuildInfo }) => {

useEffect(() => {
(async () => {
const guild = await firebase.db
.collection("Leveling")
.doc(guildId || " ")
.get();
const data = guild.data();
if (data) {
const id = data.notifications;
if (id) {
const apiUrl = `${process.env.REACT_APP_API_URL}/resolvechannel?guild=${guildId}&channel=${id}`;
const response = await fetch(apiUrl);
const channel = await response.json();
setAnnouncementChannel({
value: id,
label: (
<>
<span>{channel.name}</span>
<span className="channel-category">{channel.parent}</span>
</>
),
});
setLevelUpAnnouncement({
value: data.type,
label: ["Disabled", "Current Channel", "Custom Channel"][data.type - 1],
});
setLevelUpMessage(data.message);
try {
const guildRef = await firebase.db.collection("Leveling").doc(guildId || " ");
const guild = await guildRef.get();
const settings = await guildRef.collection("settings").get();
const data = guild.data();
const settingsData = settings.docs
.map(doc => ({ id: doc.id, ...doc.data() }))
.reduce((acc, cur) => ({ [cur.id]: cur, ...acc }), {});
if (settingsData) {
setGeneralScaling(settingsData.scaling.general || 1);
setNoXpRoles(
settingsData.bannedItems?.roles
?.map(id => userConnectedGuildInfo.roles.find(role => role.id === id))
?.map(role => ({
value: TransformObjectToSelectValue(role),
label: <RoleItem {...role}>{role.name}</RoleItem>,
})) || []
);
setNoXpChannels(
settingsData.bannedItems?.channels
?.map(id =>
userConnectedGuildInfo.channels.find(channel => channel.id === id)
)
.map(channel => ({
value: TransformObjectToSelectValue(channel),
label: channelLabel(channel),
})) || []
);
}
if (data) {
const id = data.notifications;
if (id) {
const apiUrl = `${process.env.REACT_APP_API_URL}/resolvechannel?guild=${guildId}&channel=${id}`;
const response = await fetch(apiUrl);
const channel = await response.json();
setAnnouncementChannel({
value: id,
label: channelLabel(channel),
});
setLevelUpAnnouncement({
value: data.type,
label: ["Disabled", "Current Channel", "Custom Channel"][data.type - 1],
});
setLevelUpMessage(data.message);
}
}
} catch (err) {
console.log(err.message);
}
})();
}, [location, guildId]);

const handleGeneralScaling = async (e, value) => {
const guildLevelRef = firebase.db
.collection("Leveling")
.doc(guildId)
.collection("settings")
.doc("scaling");
setGeneralScaling(value);
try {
await guildLevelRef.update({ general: value });
} catch (err) {
await guildLevelRef.set({ general: value });
}
setDashboardOpen(true);
};

const handleNoXpRoleSelect = async e => {
const guildLevelRef = firebase.db
.collection("Leveling")
.doc(guildId)
.collection("settings")
.doc("bannedItems");
setNoXpRoles(e);
const value = parseSelectValue(e);
try {
await guildLevelRef.update({ roles: value });
} catch (err) {
await guildLevelRef.set({ roles: value });
}
setDashboardOpen(true);
};

const handleNoXpChannelSelect = async e => {
const guildLevelRef = firebase.db
.collection("Leveling")
.doc(guildId)
.collection("settings")
.doc("bannedItems");
setNoXpChannels(e);
const value = parseSelectValue(e);
try {
await guildLevelRef.update({ channels: value });
} catch (err) {
await guildLevelRef.set({ channels: value });
}
setDashboardOpen(true);
};

return (
<div>
<div className="plugin-item-header">
Expand All @@ -102,9 +186,14 @@ const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
<div className="plugin-item-subheader flex">
<span>
<h2>Leveling Up</h2>
<h4>Whenever a user gains a level, DisStreamBot can send a personalized message.</h4>
<h4>
Whenever a user gains a level, DisStreamBot can send a personalized message.
</h4>
</span>
<Link className="leader-board-link" to={`/leaderboard/${userConnectedGuildInfo?.id}`}>
<Link
className="leader-board-link"
to={`/leaderboard/${userConnectedGuildInfo?.id}`}
>
Leaderboard
</Link>
</div>
Expand All @@ -113,43 +202,36 @@ const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
<div className="channels">
<div id="announcement-type">
<h5 className="bold uppercase">Level up announcement</h5>
<FancySwitch
checked={levelUpAnnouncement}
onChange={handleTypeSelect}
name="enable-message"
/>
</div>
<div id="announcement-channel">
<h5 className="bold uppercase">ANNOUNCEMENT CHANNEL</h5>
<StyledSelect
isDisabled={!levelUpAnnouncement}
closeMenuOnSelect
onChange={handleTypeSelect}
placeholder="Select Annoucement type"
value={levelUpAnnouncement}
options={[
{ value: 1, label: "Disabled" },
{ value: 3, label: "Custom Channel" },
].map(type => type)}
onChange={handleAnnoucmentSelect}
placeholder="Select Annoucement Channel"
value={announcementChannel}
options={userConnectedGuildInfo?.channels
?.sort((a, b) => a.parent.localeCompare(b.parent))
?.map(channel => ({
value: TransformObjectToSelectValue(channel),
label: channelLabel(channel),
}))}
/>
</div>
{levelUpAnnouncement?.value === 3 && (
<div id="announcement-channel">
<h5 className="bold uppercase">ANNOUNCEMENT CHANNEL</h5>
<StyledSelect
closeMenuOnSelect
onChange={handleAnnoucmentSelect}
placeholder="Select Annoucement Channel"
value={announcementChannel}
options={userConnectedGuildInfo?.channels
?.sort((a, b) => a.parent.localeCompare(b.parent))
?.map(channel => ({
value: channel.id,
label: (
<>
<span>{channel.name}</span>
<span className="channel-category">{channel.parent}</span>
</>
),
}))}
/>
</div>
)}
</div>
<div className="message">
<h5>LEVEL UP ANNOUNCEMENT MESSAGE</h5>
<textarea disabled={levelUpAnnouncement.value===1} value={levelUpMessage} onChange={handleMessageChange}></textarea>
<textarea
disabled={!levelUpAnnouncement}
value={levelUpMessage}
onChange={handleMessageChange}
></textarea>
</div>
</div>
</div>
Expand All @@ -160,58 +242,59 @@ const Leveling = ({ location, guild: userConnectedGuildInfo }) => {
General XP Scaling
</Typography>
<PrettoSlider
value={generalScaling}
onChange={handleGeneralScaling}
defaultValue={1}
getAriaValueText={value => `${value}xp`}
aria-labelledby="discrete-slider"
aria-labelledby="xp scaling"
valueLabelDisplay="auto"
step={0.5}
// marks
min={0}
max={3}
marks={marks}
/>
</div>
<hr />

<h4 className="plugin-section-title">No Rank Items</h4>

<div className="no-rank-items">
<div>
<StyledSelect
closeMenuOnSelect
onChange={() => {}}
placeholder="No XP Roles"
value={""}
options={userConnectedGuildInfo?.channels
?.sort((a, b) => a.parent.localeCompare(b.parent))
?.map(channel => ({
value: channel.id,
label: (
<>
<span>{channel.name}</span>
<span className="channel-category">{channel.parent}</span>
</>
),
}))}
/>
<h4 className="plugin-section-title">No XP Roles</h4>
<h4 className="plugin-section-title">No XP Channels</h4>
</div>
<div>
<StyledSelect
closeMenuOnSelect
onChange={() => {}}
placeholder="No XP Channels"
value={""}
options={userConnectedGuildInfo?.channels
?.sort((a, b) => a.parent.localeCompare(b.parent))
?.map(channel => ({
value: channel.id,
label: (
<>
<span>{channel.name}</span>
<span className="channel-category">{channel.parent}</span>
</>
),
}))}
/>
<div>
<StyledSelect
isMulti
closeMenuOnSelect={false}
onChange={handleNoXpRoleSelect}
placeholder="No XP Roles"
value={noXpRoles}
options={userConnectedGuildInfo?.roles
?.sort((a, b) => b.rawPosition - a.rawPosition)
?.map(role => ({
value: TransformObjectToSelectValue(role),
label: <RoleItem {...role}>{role.name}</RoleItem>,
}))}
/>
</div>

<div>
<StyledSelect
isMulti
closeMenuOnSelect={false}
onChange={handleNoXpChannelSelect}
placeholder="No XP Channels"
value={noXpChannels}
options={userConnectedGuildInfo?.channels
?.sort((a, b) => a.parent.localeCompare(b.parent))
?.map(channel => ({
value: TransformObjectToSelectValue(channel),
label: channelLabel(channel),
}))}
/>
</div>
</div>
</div>
</div>
Expand Down
Loading