Skip to content

Commit f959bcc

Browse files
zigamacelezigamacele
committed
added failsafes, ui changes, readme update
1 parent f068821 commit f959bcc

File tree

8 files changed

+25
-22
lines changed

8 files changed

+25
-22
lines changed

‎README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Liver ![version](https://img.shields.io/badge/Version-v0.0.3-pink?style=for-the-badge&logo)
1+
# Liver ![version](https://img.shields.io/badge/Version-v0.1-pink?style=for-the-badge&logo)
22

33
<a><img align="right" src="https://i.imgur.com/F9qenDY.png"></a>
44

@@ -11,7 +11,7 @@ Get it for [Chrome](https://chrome.google.com/webstore/detail/liver/pjnhlmepkmji
1111

1212
## Images
1313

14-
<img src="https://i.imgur.com/YHybind.png" width="700">
14+
<img src="https://i.imgur.com/YHybind.png" width="800">
1515

1616
<br />
1717

‎src/Components/DisplayMyLivers.tsx‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,16 +39,14 @@ export default function DisplayMyLivers() {
3939

4040
function getMyLivers() {
4141
chrome.storage.local.get(['myLivers', 'customList'], function (data) {
42-
setDisplayLivers({ ...data.myLivers, ...data.customList });
43-
4442
if (Array.isArray(data.myLivers)) {
4543
let tempMyLivers: any = {};
4644
data.myLivers.forEach((channelID) => {
4745
tempMyLivers[channelID] = databaseSearch(channelID);
4846
});
4947
chrome.storage.local.set({ myLivers: tempMyLivers });
5048
window.location.reload();
51-
}
49+
} else setDisplayLivers({ ...data.myLivers, ...data.customList });
5250
});
5351
}
5452

‎src/Components/DisplayedLiver.tsx‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,11 @@ export function DisplayedLiver({
2222

2323
function checkMyLivers() {
2424
chrome.storage.local.get('customList', function (data) {
25-
setCustomList(data.customList);
25+
if (data.customList) setCustomList(data.customList);
26+
else {
27+
chrome.storage.local.set({ customList: {} });
28+
setCustomList({});
29+
}
2630
});
2731
}
2832

@@ -56,12 +60,13 @@ export function DisplayedLiver({
5660
try {
5761
const { data } = await axios.request(config);
5862
const twitter = data.twitter;
63+
const name = data.name;
5964
chrome.storage.local.get('customList', function (data) {
6065
let tempCustomList = data.customList;
6166
tempCustomList = {
6267
...tempCustomList,
6368
[channelID]: {
64-
name: member.channel.english_name,
69+
name: member.channel.english_name || name,
6570
imageURL: member.channel.photo,
6671
channelID: member.channel.id,
6772
twitter: twitter,
@@ -105,7 +110,7 @@ export function DisplayedLiver({
105110
>
106111
<img
107112
src={member.imageURL || member.channel.photo}
108-
alt={member.name || member.channel.english_name}
113+
alt={member.name}
109114
className={`rounded-full h-20 liver border-4 shadow-md ${
110115
isLive
111116
? 'border-red-500'
@@ -142,7 +147,7 @@ export function DisplayedLiver({
142147
) : (
143148
<BookmarkIcon
144149
onClick={() => addToMyLivers(member.channel.id)}
145-
className="h-5 w-5 p-0.5 text-black hover:text-neutral-500 bg-white border-2 border-red-500 rounded-full cursor-pointer"
150+
className="h-5 w-5 p-0.5 text-slate-700 hover:text-neutral-500 bg-white border-2 border-red-500 rounded-full cursor-pointer"
146151
/>
147152
)}
148153
</div>

‎src/Components/SelectLiver.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,6 @@ export default function SelectLiver({
3030
function databaseSearch(memberID: string) {
3131
for (const member of flattenedDatabase) {
3232
if (member.channelID === memberID) {
33-
console.log('MEMBEr', member);
3433
return member;
3534
}
3635
}

‎src/Components/Settings/Selectors.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -33,8 +33,8 @@ export default function Selectors({
3333
controlOutline: 'none',
3434
colorTextDisabled: '#94a3b8',
3535
colorTextPlaceholder: '#94a3b8',
36-
colorBgContainer: darkMode ? '#334155' : 'white',
37-
colorBgElevated: darkMode ? '#334155' : 'white',
36+
colorBgContainer: darkMode ? '#334155' : '#f8fafc',
37+
colorBgElevated: darkMode ? '#334155' : '#f8fafc',
3838
colorBorder: darkMode ? '#0f172a' : '#e2e8f0',
3939
controlItemBgActive: darkMode ? '#1e293b' : '#e2e8f0',
4040
controlItemBgHover: darkMode ? '#2D3A4B' : '#f1f5f9',

‎src/pages/Custom.tsx‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ export default function Custom() {
5353
chrome.storage.local.set({
5454
customList: {
5555
[userInput]: {
56-
name: APIData.english_name,
56+
name: APIData.english_name || APIData.name,
5757
channelID: APIData.id,
5858
imageURL: APIData.photo,
5959
twitter: APIData.twitter,
@@ -62,7 +62,7 @@ export default function Custom() {
6262
});
6363
setCustomList({
6464
[userInput]: {
65-
name: APIData.english_name,
65+
name: APIData.english_name || APIData.name,
6666
channelID: APIData.id,
6767
imageURL: APIData.photo,
6868
twitter: APIData.twitter,
@@ -76,7 +76,7 @@ export default function Custom() {
7676
liversArray = {
7777
...liversArray,
7878
[userInput]: {
79-
name: APIData.english_name,
79+
name: APIData.english_name || APIData.name,
8080
channelID: APIData.id,
8181
imageURL: APIData.photo,
8282
twitter: APIData.twitter,
@@ -90,7 +90,7 @@ export default function Custom() {
9090
liversArray = {
9191
...liversArray,
9292
[userInput]: {
93-
name: APIData.english_name,
93+
name: APIData.english_name || APIData.name,
9494
channelID: APIData.id,
9595
imageURL: APIData.photo,
9696
twitter: APIData.twitter,
@@ -107,7 +107,9 @@ export default function Custom() {
107107

108108
useEffect(() => {
109109
chrome.storage.local.get('customList', function (data) {
110-
setCustomList(data.customList);
110+
if (data.customList) {
111+
setCustomList(data.customList);
112+
}
111113
});
112114
chrome.storage.onChanged.addListener(function (changes) {
113115
if ('customList' in changes) {
@@ -129,7 +131,7 @@ export default function Custom() {
129131
<input
130132
value={userInput}
131133
className="w-full outline-none rounded-lg h-10 border placeholder:text-slate-400 dark:placeholder:text-slate-400 border-slate-300 dark:border-slate-600 px-4 py-1 bg-slate-200 dark:bg-slate-700 pr-6"
132-
placeholder="Enter VTuber's Youtube ID"
134+
placeholder="VTuber's Channel ID"
133135
onChange={(e) => setUserInput(e.target.value)}
134136
/>
135137
<PlusCircleIcon
@@ -148,9 +150,9 @@ export default function Custom() {
148150
<span>Need help?</span>
149151
</div>
150152
) : (
151-
<div className="flex gap-1 bg-slate-200 dark:bg-slate-700 px-3 py-2 rounded-lg shadow-sm">
153+
<div className="flex gap-1 bg-slate-200 dark:bg-slate-700 px-3 py-2 rounded-lg shadow-sm border border-slate-300 dark:border-slate-600">
152154
<div>
153-
<div>Youtube ID needs to be in this format:</div>
155+
<div>Channel ID needs to be in this format:</div>
154156
<div className="flex items-center">
155157
<div className="text-[10px]">youtube.com/channel/ </div>
156158
<span className="bg-slate-300 dark:bg-slate-600 text-[14px] font-bold ">

‎src/pages/Settings.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ export default function Settings({
3232
<Tooltip title="Remove All">
3333
<div
3434
onClick={handleReset}
35-
className="h-[30px] w-[30px] shadow-sm flex justify-center items-center cursor-pointer hover:text-rose-500 bg-white dark:bg-slate-700 rounded py-0.5 px-1"
35+
className="h-[30px] w-[30px] shadow-sm flex justify-center border border-slate-200 dark:border-slate-700 items-center cursor-pointer hover:text-rose-500 bg-white dark:bg-slate-700 rounded py-0.5 px-1"
3636
>
3737
<TrashIcon className="h-5 w-5" />
3838
</div>

‎src/pages/_app.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import { useState } from 'react';
55

66
export default function App({ Component, pageProps }: AppProps) {
77
const [showStreamTitle, setShowStreamTitle] = useState('');
8-
98
return (
109
<div className="flex flex-col gap-2">
1110
<Navigation

0 commit comments

Comments
 (0)