chore: run lint and prettier

This commit is contained in:
David Ralph 2024-03-19 21:45:17 +00:00
parent 57df2ce523
commit 2136f558b9
62 changed files with 225 additions and 145 deletions

View File

@ -1,6 +1,6 @@
/* eslint-disable no-use-before-define */
/* eslint-disable no-undef */
if (typeof browser === "undefined") {
if (typeof browser === 'undefined') {
var browser = chrome;
}

View File

@ -77,4 +77,4 @@ function AddModal({ urlError, iconError, addLink, closeModal, edit, editData, ed
}
const MemoizedAddModal = memo(AddModal);
export { MemoizedAddModal as default, MemoizedAddModal as AddModal}
export { MemoizedAddModal as default, MemoizedAddModal as AddModal };

View File

@ -1 +1 @@
export * from './AddModal';
export * from './AddModal';

View File

@ -259,11 +259,13 @@ h5 {
flex-flow: row;
align-items: center;
gap: 25px;
svg {
@include themed() {
@include themed {
background-image: t($slightGradient);
box-shadow: t($boxShadow);
}
padding: 15px;
border-radius: 100%;
}

View File

@ -4,6 +4,7 @@
.btn-settings {
@include modal-button(standard);
display: inline;
margin-top: 0;
float: none !important;
@ -12,6 +13,7 @@
.btn-navigation {
@include modal-button(standard);
padding: 0 15px;
@include themed {
@ -58,15 +60,11 @@
}
.btn-collection {
display: flex;
align-items: center;
gap: 15px;
padding: 1px 12px;
backdrop-filter: blur(16px) saturate(180%);
background-color: rgb(255 255 255 / 10%);
border: 1px solid rgb(209 213 219 / 30%);
color: #fff;
border-radius: 12px;
height: 40px;
font-size: 1rem;
@ -85,21 +83,21 @@
}
&:active {
@include themed() {
@include themed {
background: t($modal-sidebarActive);
box-shadow: 0 0 0 1px t($color);
}
}
&:focus {
@include themed() {
@include themed {
background: t($modal-sidebarActive);
box-shadow: 0 0 0 1px t($color);
}
}
&:disabled {
@include themed() {
@include themed {
background: t($modal-sidebarActive);
cursor: not-allowed;
}

View File

@ -22,6 +22,7 @@ p.description {
.item {
flex: 1 0 40% !important;
}
.infoItem {
display: flex;
flex-flow: row;
@ -30,10 +31,11 @@ p.description {
flex: 1 0 44%;
svg {
@include themed() {
@include themed {
background-image: t($slightGradient);
}
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
font-size: 20px;
border-radius: 100%;
@ -47,6 +49,7 @@ p.description {
.header {
text-transform: uppercase;
@include themed {
color: t($subColor);
}
@ -66,7 +69,6 @@ p.description {
}
}
.showMoreItems {
display: flex;
flex-flow: column;
@ -79,4 +81,4 @@ p.description {
display: flex;
flex-flow: column;
gap: 15px;
}
}

View File

@ -5,7 +5,7 @@
/* button {
@include modal-button(standard);
}*/
} */
@include themed {
padding: 1rem 3rem 3rem;
@ -148,6 +148,7 @@ table {
gap: 25px;
padding: 25px;
justify-content: space-between;
@include themed {
background: t($modal-sidebar);
border-radius: t($borderRadius);
@ -162,10 +163,11 @@ table {
}
.icon {
@include themed() {
@include themed {
background-image: t($slightGradient);
box-shadow: t($boxShadow);
}
padding: 15px;
border-radius: 100%;
font-size: 25px;

View File

@ -51,7 +51,6 @@ input {
/* date picker */
&[type='date'] {
width: 260px;
display: flex;
flex-flow: column;
@include themed {

View File

@ -86,7 +86,6 @@
border: none;
outline: none;
}
}
.shareHeader {
@ -94,12 +93,14 @@
flex-flow: row;
justify-content: space-between;
align-items: center;
.close {
padding: 15px;
place-items: center;
display: grid;
cursor: pointer;
transition: 0.3s;
@include themed {
border-radius: t($borderRadius);
}

View File

@ -5,7 +5,7 @@
*/
export function isValidRGBValue(value) {
return typeof value === 'number' && Number.isNaN(value) === false && value >= 0 && value <= 255;
};
}
/**
* "If the red, green, and blue values are valid, return an object with the red, green, and blue

View File

@ -63,7 +63,9 @@ function PhotoInformation({ info, url, api }) {
const [other, setOther] = useState(false);
const [shareModal, openShareModal] = useState(false);
const [excludeModal, openExcludeModal] = useState(false);
const [favouriteTooltipText, setFavouriteTooltipText] = useState(variables.getMessage('widgets.quote.favourite'));
const [favouriteTooltipText, setFavouriteTooltipText] = useState(
variables.getMessage('widgets.quote.favourite'),
);
if (info.hidden === true || !info.credit) {
return null;
@ -207,11 +209,7 @@ function PhotoInformation({ info, url, api }) {
<Share onClick={() => openShareModal(true)} />
</Tooltip>
)}
<Tooltip
title={favouriteTooltipText}
key="favourite"
placement="top"
>
<Tooltip title={favouriteTooltipText} key="favourite" placement="top">
<Favourite
pun={info.pun}
offline={info.offline}

View File

@ -210,7 +210,14 @@ export default class ColourSettings extends PureComponent {
<div className="colourInput">{gradientInputs}</div>
{!gradientHasMoreThanOneColour && (
<>
<Button type="settings" onClick={this.addColour} icon={<MdAdd />} label={variables.getMessage('modals.main.settings.sections.background.source.add_colour')} />
<Button
type="settings"
onClick={this.addColour}
icon={<MdAdd />}
label={variables.getMessage(
'modals.main.settings.sections.background.source.add_colour',
)}
/>
</>
)}
</>

View File

@ -197,8 +197,22 @@ export default class CustomSettings extends PureComponent {
</div>
</div>
<div className="topbarbuttons">
<Button type="settings" onClick={() => this.uploadCustomBackground()} icon={<MdOutlineFileUpload />} label={variables.getMessage('modals.main.settings.sections.background.source.upload')} />
<Button type="settings" onClick={() => this.setState({ customURLModal: true })} icon={<MdAddLink />} label={variables.getMessage('modals.main.settings.sections.background.source.add_url')} />
<Button
type="settings"
onClick={() => this.uploadCustomBackground()}
icon={<MdOutlineFileUpload />}
label={variables.getMessage(
'modals.main.settings.sections.background.source.upload',
)}
/>
<Button
type="settings"
onClick={() => this.setState({ customURLModal: true })}
icon={<MdAddLink />}
label={variables.getMessage(
'modals.main.settings.sections.background.source.add_url',
)}
/>
</div>
</div>
<div className="dropzone-content">
@ -217,7 +231,11 @@ export default class CustomSettings extends PureComponent {
'modals.main.settings.sections.background.source.remove',
)}
>
<Button type="settings" onClick={() => this.modifyCustomBackground('remove', index)} icon={<MdCancel />} />
<Button
type="settings"
onClick={() => this.modifyCustomBackground('remove', index)}
icon={<MdCancel />}
/>
</Tooltip>
)}
</div>
@ -240,7 +258,14 @@ export default class CustomSettings extends PureComponent {
},
)}
</span>
<Button type="settings" onClick={() => this.uploadCustomBackground()} icon={<MdFolder />} label={variables.getMessage('modals.main.settings.sections.background.source.select')} />
<Button
type="settings"
onClick={() => this.uploadCustomBackground()}
icon={<MdFolder />}
label={variables.getMessage(
'modals.main.settings.sections.background.source.select',
)}
/>
</div>
</div>
)}

View File

@ -1,2 +1,2 @@
export * from './options';
export * from './Greeting';
export * from './Greeting';

View File

@ -1 +1 @@
export * from './GreetingOptions';
export * from './GreetingOptions';

View File

@ -3,51 +3,51 @@ import { Button } from 'components/Elements';
import variables from 'config/variables';
const Collection = ({ collection, toggle, collectionFunction }) => {
const { news, background_colour, img, display_name, description, name } = collection;
const { news, background_colour, img, display_name, description, name } = collection;
const getStyle = () => {
if (news) {
return { backgroundColor: background_colour };
}
return {
backgroundImage: `linear-gradient(to left, #000, transparent, #000), url('${variables.constants.DDG_IMAGE_PROXY + img}')`,
};
const getStyle = () => {
if (news) {
return { backgroundColor: background_colour };
}
return {
backgroundImage: `linear-gradient(to left, #000, transparent, #000), url('${variables.constants.DDG_IMAGE_PROXY + img}')`,
};
};
return (
<div className="collection" style={getStyle()}>
<div className="content">
<span className="title">{display_name} using component</span>
<span className="subtitle">{description}</span>
</div>
{collection.news === true ? (
<a
className="btn-collection"
href={collection.news_link}
target="_blank"
rel="noopener noreferrer"
>
{variables.getMessage('modals.main.marketplace.learn_more')} <MdOutlineOpenInNew />
</a>
) : (
<Button
type="collection"
onClick={() => collectionFunction(collection.name)}
icon={<MdOutlineArrowForward />}
label={variables.getMessage('modals.main.marketplace.explore_collection')}
iconPlacement={'right'}
/>
)}
{/*<Button
return (
<div className="collection" style={getStyle()}>
<div className="content">
<span className="title">{display_name} using component</span>
<span className="subtitle">{description}</span>
</div>
{collection.news === true ? (
<a
className="btn-collection"
href={collection.news_link}
target="_blank"
rel="noopener noreferrer"
>
{variables.getMessage('modals.main.marketplace.learn_more')} <MdOutlineOpenInNew />
</a>
) : (
<Button
type="collection"
onClick={() => collectionFunction(collection.name)}
icon={<MdOutlineArrowForward />}
label={variables.getMessage('modals.main.marketplace.explore_collection')}
iconPlacement={'right'}
/>
)}
{/*<Button
type="collection"
onClick={() => toggle('collection', name)}
icon={<MdOutlineArrowForward />}
label={variables.getMessage('modals.main.marketplace.explore_collection')}
iconPlacement="right"
/>*/}
</div>
);
</div>
);
};
export default Collection;
export { Collection };
export { Collection };

View File

@ -1 +1 @@
export * from './Collection';
export * from './Collection';

View File

@ -22,7 +22,7 @@
.carousel_container {
display: flex;
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
user-select: none;
-webkit-tap-highlight-color: transparent;
margin-left: -10px;

View File

@ -1 +1 @@
export * from './Carousel';
export * from './Carousel';

View File

@ -16,4 +16,4 @@ function Lightbox({ modalClose, img }) {
const MemoizedLightbox = memo(Lightbox);
export default MemoizedLightbox;
export { MemoizedLightbox as Lightbox };
export { MemoizedLightbox as Lightbox };

View File

@ -1 +1 @@
export * from './Lightbox';
export * from './Lightbox';

View File

@ -25,4 +25,4 @@ function SideloadFailedModal({ modalClose, reason }) {
const MemoizedSideloadFailedModal = memo(SideloadFailedModal);
export default MemoizedSideloadFailedModal;
export { MemoizedSideloadFailedModal as SideloadFailedModal };
export { MemoizedSideloadFailedModal as SideloadFailedModal };

View File

@ -1 +1 @@
export * from './SideloadFailedModal';
export * from './SideloadFailedModal';

View File

@ -1,3 +1,3 @@
export * from './Carousel';
export * from './SideloadFailedModal';
export * from './Lightbox';
export * from './Lightbox';

View File

@ -209,7 +209,10 @@ class Item extends PureComponent {
<span className="title">
{variables.getMessage('modals.main.marketplace.product.description')}
</span>
<span className="subtitle" dangerouslySetInnerHTML={{ __html: this.props.data.description }} />
<span
className="subtitle"
dangerouslySetInnerHTML={{ __html: this.props.data.description }}
/>
</div>
<div className="moreInfo">
{moreInfoItem(

View File

@ -1,2 +1,2 @@
export * from './Elements';
export * from './Items';
export * from './Items';

View File

@ -25,7 +25,11 @@ export default class Added extends PureComponent {
};
this.buttons = {
uninstall: (
<Button type="settings" onClick={() => this.uninstall()} label={variables.getMessage('modals.main.marketplace.product.buttons.remove')} />
<Button
type="settings"
onClick={() => this.uninstall()}
label={variables.getMessage('modals.main.marketplace.product.buttons.remove')}
/>
),
};
}

View File

@ -28,7 +28,10 @@ export default class Create extends PureComponent {
{variables.getMessage('modals.main.addons.create.moved_description')}
</span>
<div className="createButtons">
<Button type="settings" label={variables.getMessage('modals.main.addons.create.moved_button')} />
<Button
type="settings"
label={variables.getMessage('modals.main.addons.create.moved_button')}
/>
</div>
</div>
</div>

View File

@ -1,2 +1,2 @@
export * from './Message';
export * from './options';
export * from './options';

View File

@ -105,7 +105,12 @@ class MessageOptions extends PureComponent {
</div>
<div>
<div className="messageAction">
<Button type="settings" onClick={() => this.modifyMessage('remove', index)} icon={<MdCancel />} label={variables.getMessage('modals.main.marketplace.product.buttons.remove')} />
<Button
type="settings"
onClick={() => this.modifyMessage('remove', index)}
icon={<MdCancel />}
label={variables.getMessage('modals.main.marketplace.product.buttons.remove')}
/>
</div>
</div>
</div>
@ -136,4 +141,4 @@ class MessageOptions extends PureComponent {
}
}
export { MessageOptions as default, MessageOptions };
export { MessageOptions as default, MessageOptions };

View File

@ -1 +1 @@
export * from './MessageOptions';
export * from './MessageOptions';

View File

@ -28,7 +28,7 @@ class Changelog extends PureComponent {
);
return text;
}
};
async getUpdate() {
const releases = await fetch(

View File

@ -14,7 +14,7 @@ import { getLocalisedAchievementData, achievements, checkAchievements } from 'ut
class Stats extends PureComponent {
constructor() {
super();
super();
this.state = {
stats: JSON.parse(localStorage.getItem('statsData')) || {},
achievements,

View File

@ -52,12 +52,22 @@ const QuickLink = ({ item, deleteLink, startEditLink }) => {
</div>
<div>
<div className="messageAction">
<Button type="settings" onClick={() => startEditLink(item)} icon={<MdEdit />} label={variables.getMessage('modals.main.settings.sections.quicklinks.edit')} />
<Button type="settings" onClick={(e) => deleteLink(item.key, e)} icon={ <MdCancel />} label={variables.getMessage('modals.main.marketplace.product.buttons.remove')} />
<Button
type="settings"
onClick={() => startEditLink(item)}
icon={<MdEdit />}
label={variables.getMessage('modals.main.settings.sections.quicklinks.edit')}
/>
<Button
type="settings"
onClick={(e) => deleteLink(item.key, e)}
icon={<MdCancel />}
label={variables.getMessage('modals.main.marketplace.product.buttons.remove')}
/>
</div>
</div>
</div>
);
};
export default QuickLink;
export default QuickLink;

View File

@ -75,7 +75,7 @@ class Maximise extends PureComponent {
title={variables.getMessage('modals.main.settings.sections.background.buttons.view')}
>
<button
className="navbarButton"
className="navbarButton"
style={{ fontSize: this.props.fontSize }}
onClick={this.maximise}
aria-label={variables.getMessage('modals.main.settings.sections.background.buttons.view')}

View File

@ -120,4 +120,4 @@ class QuickLinks extends PureComponent {
}
}
export { QuickLinks as default, QuickLinks };
export { QuickLinks as default, QuickLinks };

View File

@ -1,2 +1,2 @@
export * from './options';
export * from './QuickLinks';
export * from './QuickLinks';

View File

@ -52,8 +52,18 @@ const QuickLink = ({ item, deleteLink, startEditLink }) => {
</div>
<div>
<div className="messageAction">
<Button type="settings" onClick={() => startEditLink(item)} icon={<MdEdit />} label={variables.getMessage('modals.main.settings.sections.quicklinks.edit')} />
<Button type="settings" onClick={(e) => deleteLink(item.key, e)} icon={ <MdCancel />} label={variables.getMessage('modals.main.marketplace.product.buttons.remove')} />
<Button
type="settings"
onClick={() => startEditLink(item)}
icon={<MdEdit />}
label={variables.getMessage('modals.main.settings.sections.quicklinks.edit')}
/>
<Button
type="settings"
onClick={(e) => deleteLink(item.key, e)}
icon={<MdCancel />}
label={variables.getMessage('modals.main.marketplace.product.buttons.remove')}
/>
</div>
</div>
</div>

View File

@ -1 +1 @@
export * from './QuickLinksOptions';
export * from './QuickLinksOptions';

View File

@ -169,7 +169,12 @@ class QuoteOptions extends PureComponent {
subtitle={variables.getMessage(`${QUOTE_SECTION}.custom_subtitle`)}
/>
<Action>
<Button type="settings" onClick={() => this.modifyCustomQuote('add')} icon={<MdAdd />} label={variables.getMessage(`${QUOTE_SECTION}.add`)} />
<Button
type="settings"
onClick={() => this.modifyCustomQuote('add')}
icon={<MdAdd />}
label={variables.getMessage(`${QUOTE_SECTION}.add`)}
/>
</Action>
</Row>
@ -202,7 +207,14 @@ class QuoteOptions extends PureComponent {
</div>
<div>
<div className="messageAction">
<Button type="settings" onClick={() => this.modifyCustomQuote('remove', index)} icon={<MdCancel />} label={variables.getMessage('modals.main.marketplace.product.buttons.remove')} />
<Button
type="settings"
onClick={() => this.modifyCustomQuote('remove', index)}
icon={<MdCancel />}
label={variables.getMessage(
'modals.main.marketplace.product.buttons.remove',
)}
/>
</div>
</div>
</div>
@ -216,7 +228,12 @@ class QuoteOptions extends PureComponent {
<span className="subtitle">
{variables.getMessage('modals.main.settings.sections.message.add_some')}
</span>
<Button type="settings" onClick={() => this.modifyCustomQuote('add')} icon={<MdAdd />} label={variables.getMessage(`${QUOTE_SECTION}.add`)} />
<Button
type="settings"
onClick={() => this.modifyCustomQuote('add')}
icon={<MdAdd />}
label={variables.getMessage(`${QUOTE_SECTION}.add`)}
/>
</div>
</div>
)}

View File

@ -1,2 +1,2 @@
export * from './options';
export * from './Search';
export * from './Search';

View File

@ -1 +1 @@
export * from './SearchOptions';
export * from './SearchOptions';

View File

@ -1,2 +1,2 @@
export * from './options';
export * from './Weather';
export * from './Weather';

View File

@ -221,4 +221,4 @@ class WeatherOptions extends PureComponent {
}
}
export { WeatherOptions as default, WeatherOptions };
export { WeatherOptions as default, WeatherOptions };

View File

@ -1 +1 @@
export * from './WeatherOptions';
export * from './WeatherOptions';

View File

@ -76,18 +76,21 @@
flex-flow: row;
width: 100%;
justify-content: space-between;
svg {
font-size: 2em !important;
}
span {
font-size: 34px;
}
}
.weatherExpandedInfo {
padding: 0 25px 25px 25px;
padding: 0 25px 25px;
text-align: left;
@include themed() {
@include themed {
border-top: 1px solid t($btn-backgroundHover);
}
}

View File

@ -28,4 +28,4 @@ function ProgressBar({ numberOfTabs, currentTab, switchTab }) {
const MemoizedProgressBar = memo(ProgressBar);
export default MemoizedProgressBar;
export { MemoizedProgressBar as ProgressBar };
export { MemoizedProgressBar as ProgressBar };

View File

@ -1 +1 @@
export * from './ProgressBar';
export * from './ProgressBar';

View File

@ -1,7 +1,5 @@
const Content = ({ children }) => {
return (
<div className="content">{children}</div>
)
}
return <div className="content">{children}</div>;
};
export { Content as default, Content };
export { Content as default, Content };

View File

@ -2,9 +2,7 @@ function Header({ title, subtitle }) {
return (
<>
<span className="mainTitle">{title}</span>
<span className="subtitle">
{subtitle}
</span>
<span className="subtitle">{subtitle}</span>
</>
);
}

View File

@ -1,7 +1,5 @@
function Layout() {
return (
<h1>Cheese</h1>
)
return <h1>Cheese</h1>;
}
export { Layout as default, Layout };
export { Layout as default, Layout };

View File

@ -1,7 +1,3 @@
const Panel = ({ children, type }) => (
<section className={type}>
{children}
</section>
);
const Panel = ({ children, type }) => <section className={type}>{children}</section>;
export { Panel as default, Panel };

View File

@ -1,5 +1,3 @@
const Wrapper = ({ children }) => (
<div className="welcomeContent">{children}</div>
)
const Wrapper = ({ children }) => <div className="welcomeContent">{children}</div>;
export { Wrapper as default, Wrapper };
export { Wrapper as default, Wrapper };

View File

@ -1,4 +1,4 @@
export * from './Wrapper';
export * from './Panel';
export * from './Header';
export * from './Content';
export * from './Content';

View File

@ -4,4 +4,4 @@ export * from './ImportSettings';
export * from './ThemeSelection';
export * from './StyleSelection';
export * from './PrivacyOptions';
export * from './Final';
export * from './Final';

View File

@ -1,2 +1,2 @@
export * from './Layout';
export * from './Elements';
export * from './Elements';

View File

@ -1,4 +1,4 @@
@import '../../scss/index.scss';
@import '../../scss/index';
@import 'scss/variables';
.welcomemodal {
@ -92,13 +92,16 @@
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto auto;
div:nth-child(1) {
grid-column: span 1 / span 1 !important;
}
div:nth-child(2),
div:nth-child(3) {
grid-column: span 1 / span 1 !important;
}
@include themed {
.active {
background: t($modal-sidebarActive);

View File

@ -68,7 +68,7 @@ $themes: (
'modal-sidebarActive': rgb(219 219 219 / 72%),
'modal-secondaryColour': #fafafa,
'link': #5352ed,
'slightGradient': linear-gradient(#ffffff, #dddddd),
'slightGradient': linear-gradient(#fff, #ddd),
),
dark: (
'weather': #e7e7e7,

View File

@ -133,7 +133,7 @@ body {
a {
border: 0;
border-radius: 12px;
padding: 10px 30px 10px 30px;
padding: 10px 30px;
font-size: 1rem;
display: flex;
align-items: center;
@ -150,7 +150,7 @@ body {
@media (prefers-color-scheme: dark) {
/** {
background-color: #000000 !important;
}*/
} */
.criticalError {
.criticalError-message {
@ -158,7 +158,7 @@ body {
}
p {
color: rgba(255, 255, 255, 0.7529411765);
color: rgb(255 255 255 / 75.3%);
}
a {
@ -175,7 +175,7 @@ body {
@media (prefers-color-scheme: light) {
* {
background-color: #ffffff !important;
background-color: #fff !important;
}
.criticalError {
@ -184,7 +184,7 @@ body {
}
p {
color: rgba(0, 0, 0, 0.7529411765);
color: rgb(0 0 0 / 75.3%);
}
a {

View File

@ -1,4 +1,4 @@
import { getTitleFromUrl } from "./getTitleFromUrl";
import { isValidUrl } from "./isValidUrl";
import { getTitleFromUrl } from './getTitleFromUrl';
import { isValidUrl } from './isValidUrl';
export { getTitleFromUrl, isValidUrl };
export { getTitleFromUrl, isValidUrl };

View File

@ -1,5 +1,5 @@
import variables from "config/variables";
import ExperimentalInit from "utils/experimental";
import variables from 'config/variables';
import ExperimentalInit from 'utils/experimental';
/**
* It loads the settings from localStorage and applies them to the page.

View File

@ -1,4 +1,4 @@
import { setDefaultSettings } from "./default";
import { setDefaultSettings } from './default';
/**
* Saves all of the current settings, resets them, sets the defaults and then overrides