extras
/
mue
mirror of https://github.com/mue/mue.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: cleanup, settings UI improvements 

Co-authored-by: David Ralph <ohlookitsderpy@protonmail.com>
This commit is contained in:
alexsparkes 2024-02-03 01:21:18 +00:00
parent b3b17ad234
commit cdae5ed29e
38 changed files with 1526 additions and 1435 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/icons/mue_about.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

29
qodana.yaml Normal file
View File

@ -0,0 +1,29 @@
#-------------------------------------------------------------------------------#
# Qodana analysis is configured by qodana.yaml file #
# https://www.jetbrains.com/help/qodana/qodana-yaml.html #
#-------------------------------------------------------------------------------#
version: "1.0"
#Specify inspection profile for code analysis
profile:
name: qodana.starter
#Enable inspections
#include:
# - name: <SomeEnabledInspectionId>
#Disable inspections
#exclude:
# - name: <SomeDisabledInspectionId>
# paths:
# - <path/where/not/run/inspection>
#Execute shell command before Qodana execution (Applied in CI/CD pipeline)
#bootstrap: sh ./prepare-qodana.sh
#Install IDE plugins before Qodana execution (Applied in CI/CD pipeline)
#plugins:
# - id: <plugin.id> #(plugin id can be found at https://plugins.jetbrains.com)
#Specify Qodana linter for analysis (Applied in CI/CD pipeline)
linter: jetbrains/qodana-js:latest

1
src/components/helpers/carousel/carousel.scss
View File

@ -10,7 +10,6 @@
&.is-draggable {
cursor: move;
cursor: grab;
}
&.is-dragging {

2
src/components/helpers/sharemodal/ShareModal.jsx
View File

@ -103,7 +103,7 @@ function ShareModal({ modalClose, data }) {
<button
onClick={() =>
window
.open(`http://connect.qq.com/widget/shareqq/index.html?url=${data.url}`, '_blank')
.open(`https://connect.qq.com/widget/shareqq/index.html?url=${data.url}`, '_blank')
.focus()
}
>

15
src/components/modals/apps/Apps.jsx
View File

@ -1,7 +1,10 @@
import Tooltip from 'components/helpers/tooltip/Tooltip';
import './scss/index.scss';
import variables from 'modules/variables';
import { MdLinkOff } from 'react-icons/md';
import Tooltip from 'components/helpers/tooltip/Tooltip';
import './scss/index.scss';
const Apps = ({ appsInfo }) => {
return (
<div className="appsShortcutContainer">
@ -29,10 +32,12 @@ const Apps = ({ appsInfo }) => {
))
) : (
<div className="noAppsContainer">
<h3>
No app links found
<div className="emptyNewMessage">
<MdLinkOff />
</h3>
<span className="title">
{variables.language.getMessage(variables.languagecode, 'widgets.navbar.apps.no_apps')}
</span>
</div>
</div>
)}
</div>

122
src/components/modals/apps/scss/index.scss
View File

@ -3,75 +3,75 @@
$appsWidth: 21rem;
.appsShortcutContainer {
max-height: 35rem;
overflow-y: auto;
// scrollbar-width: thin;
border-radius: 0.8em;
padding: 1.2em;
display: grid;
grid-template-columns: repeat(3, auto);
grid-auto-rows: 100px;
gap: 10px;
place-items: center;
max-height: 35rem;
overflow-y: auto;
// scrollbar-width: thin;
border-radius: 0.8em;
padding: 1.2em;
display: grid;
grid-template-columns: repeat(3, auto);
grid-auto-rows: 100px;
gap: 10px;
place-items: center;
@include themed {
background: t($modal-secondaryColour);
}
@include themed {
background: t($modal-secondaryColour);
}
.noAppsContainer {
h3 {
margin: 0;
display: flex;
align-items: center;
}
svg {
font-size: 30px;
margin-left: 10px;
}
}
.noAppsContainer {
h3 {
margin: 0;
display: flex;
align-items: center;
}
svg {
font-size: 30px;
margin-left: 10px;
}
}
}
.appsIcon {
display: inline-flex;
align-items: center;
justify-content: center;
flex-direction: column;
text-decoration: none;
padding: 10px;
border-radius: 0.8em;
cursor: pointer;
width: 5rem;
height: 4.7rem;
transition: 0.5s;
display: inline-flex;
align-items: center;
justify-content: center;
flex-direction: column;
text-decoration: none;
padding: 10px;
border-radius: 0.8em;
cursor: pointer;
width: 5rem;
height: 4.7rem;
transition: 0.5s;
img {
border-radius: 0.6rem;
}
span {
display: inline-block;
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-align: center;
margin-top: 10px;
}
img {
border-radius: 0.6rem;
}
&:hover {
span {
white-space: initial;
}
span {
display: inline-block;
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-align: center;
margin-top: 10px;
}
height: max-content;
}
&:hover {
span {
white-space: initial;
}
@include themed {
color: t($color);
height: max-content;
}
&:hover {
background: t($modal-sidebarActive);
}
}
@include themed {
color: t($color);
&:hover {
background: t($modal-sidebarActive);
}
}
}

4
src/components/modals/main/scss/settings/_main.scss
View File

@ -42,10 +42,6 @@ input {
vertical-align: middle;
background: none;
&::-moz-color-swatch-wrapper {
padding: 0;
}
&::-moz-color-swatch {
border: none;
border-radius: 100%;

6
src/components/modals/main/scss/settings/modules/tabs/_about.scss
View File

@ -47,3 +47,9 @@
}
}
}
.aboutText {
text-align: center;
display: flex;
flex-flow: column;
}

1
src/components/modals/main/scss/settings/react-color-picker-gradient-picker-custom-styles.scss
View File

@ -22,7 +22,6 @@ div.color-preview-area > div > div:nth-child(5) {
}
.input-field .label {
color: inherit;
color: var(--modal-text) !important;
}

2
src/components/modals/main/settings/ChipSelect.jsx
View File

@ -8,7 +8,7 @@ import FormControl from '@mui/material/FormControl';
import Select from '@mui/material/Select';
import Chip from '@mui/material/Chip';
function ChipSelect({ label, options, name }) {
function ChipSelect({ label, options }) {
let start = (localStorage.getItem('apiCategories') || '').split(',');
if (start[0] === '') {
start = [];

73
src/components/modals/main/settings/sections/About.jsx
View File

@ -20,8 +20,8 @@ export default class About extends PureComponent {
update: variables.getMessage('modals.main.settings.sections.about.version.checking_update'),
loading: variables.getMessage('modals.main.loading'),
image: document.body.classList.contains('dark')
? 'icons/mue_dark.png'
: 'icons/mue_light.png',
? 'icons/mue_about.png'
: 'icons/mue_about.png',
};
this.controller = new AbortController();
}
@ -128,36 +128,51 @@ export default class About extends PureComponent {
render() {
return (
<>
<span className="mainTitle">
{variables.getMessage('modals.main.settings.sections.about.title')}
</span>
<div className="settingsRow" style={{ justifyContent: 'center' }}>
<div style={{ display: 'flex', flexFlow: 'column', gap: '5px' }}>
<img draggable={false} className="aboutLogo" src={this.state.image} alt="Logo" />
<span className="title">
{variables.getMessage('modals.main.settings.sections.about.version.title')}{' '}
{variables.constants.VERSION}
</span>
<span className="subtitle">({this.state.update})</span>
<span className="subtitle">
{variables.getMessage('modals.main.settings.sections.about.copyright')}{' '}
{variables.constants.COPYRIGHT_YEAR}-{new Date().getFullYear()}{' '}
<a
className="link"
href={
'https://github.com/' +
variables.constants.ORG_NAME +
'/' +
variables.constants.REPO_NAME +
'/graphs/contributors'
}
target="_blank"
rel="noopener noreferrer"
>
{variables.constants.COPYRIGHT_NAME}
</a>{' '}
({variables.constants.COPYRIGHT_LICENSE})
</span>
<div className="aboutText">
<span className="title">Mue, By Kaiso</span>
<span className="subtitle">
{variables.getMessage('modals.main.settings.sections.about.version.title')}{' '}
{variables.constants.VERSION}
</span>
<span className="subtitle">({this.state.update})</span>
</div>
<div>
<span className="subtitle">
Copyright 2018-
{new Date().getFullYear()}{' '}
<a
className="link"
href={
'https://github.com/' +
variables.constants.ORG_NAME +
'/' +
variables.constants.REPO_NAME +
'/graphs/contributors'
}
target="_blank"
rel="noopener noreferrer"
>
The Mue Authors
</a>
,{' '}
</span>
<span className="subtitle">
Copyright 2023-2024{' '}
<a
className="link"
href="https://kaiso.one"
target="_blank"
rel="noopener noreferrer"
>
{' '}
Kaiso One Ltd
</a>
</span>
</div>
<span className="subtitle">Licensed under the BSD-3-Clause License</span>
<span className="subtitle">
<a
href={variables.constants.PRIVACY_URL}

2
src/components/modals/main/settings/sections/Greeting.jsx
View File

@ -77,7 +77,7 @@ export default class GreetingSettings extends PureComponent {
<input
type="date"
onChange={this.changeDate}
value={this.state.birthday.toISOString().substr(0, 10)}
value={this.state.birthday.toISOString().substring(0, 10)}
required
/>
</SettingsItem>

18
src/components/modals/main/settings/sections/Stats.jsx
View File

@ -1,10 +1,12 @@
/* eslint-disable array-callback-return */
import variables from 'modules/variables';
import { PureComponent } from 'react';
import { MdShowChart, MdRestartAlt } from 'react-icons/md';
import { MdShowChart, MdRestartAlt, MdDownload } from 'react-icons/md';
import { FaTrophy } from 'react-icons/fa';
import { toast } from 'react-toastify';
import { saveFile } from 'modules/helpers/settings/modals';
import achievementsData from 'modules/helpers/settings/achievements.json';
import translations from 'modules/helpers/settings/achievement_translations/index';
@ -21,6 +23,7 @@ const achievementLanguage = {
id_ID: translations.id_ID,
tr_TR: translations.tr_TR,
bn: translations.bn,
pt_BR: translations.pt_BR,
};
export default class Stats extends PureComponent {
@ -78,6 +81,14 @@ export default class Stats extends PureComponent {
this.forceUpdate();
}
downloadStats() {
let date = new Date();
// Format the date as YYYY-MM-DD_HH-MM-SS
let formattedDate = `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}_${date.getHours().toString().padStart(2, '0')}-${date.getMinutes().toString().padStart(2, '0')}-${date.getSeconds().toString().padStart(2, '0')}`;
let filename = `mue_stats_${formattedDate}.json`;
saveFile(JSON.stringify(this.state.stats, null, 2), filename);
}
componentDidMount() {
this.getAchievements();
this.forceUpdate();
@ -102,7 +113,10 @@ export default class Stats extends PureComponent {
<span className="mainTitle">
{variables.getMessage('modals.main.settings.sections.stats.title')}
</span>
<div className="statsReset">
<div className="headerActions">
<button onClick={() => this.downloadStats()}>
<MdDownload /> {variables.getMessage('widgets.background.download')}
</button>
<button onClick={() => this.resetStats()}>
<MdRestartAlt /> {variables.getMessage('modals.main.settings.buttons.reset')}
</button>

12
src/components/modals/main/settings/sections/quicklinks/AddModal.jsx
View File

@ -11,7 +11,7 @@ function AddModal({ urlError, iconError, addLink, closeModal, edit, editData, ed
const [icon, setIcon] = useState(edit ? editData.icon : '');
return (
<div className="smallModal" style={{ width: '260px' }}>
<div className="addLinkModal">
<div className="shareHeader">
<span className="title">
{edit
@ -30,15 +30,14 @@ function AddModal({ urlError, iconError, addLink, closeModal, edit, editData, ed
placeholder={variables.getMessage('widgets.quicklinks.name')}
value={name}
onChange={(e) => setName(e.target.value.replace(/(\r\n|\n|\r)/gm, ''))}
style={{ gridColumn: 'span 2' }}
/>
<span className="dropdown-error" />
<TextareaAutosize
maxRows={10}
placeholder={variables.getMessage('widgets.quicklinks.url')}
value={url}
onChange={(e) => setUrl(e.target.value.replace(/(\r\n|\n|\r)/gm, ''))}
/>
<span className="dropdown-error">{urlError}</span>
<TextareaAutosize
maxRows={10}
maxLines={1}
@ -46,7 +45,11 @@ function AddModal({ urlError, iconError, addLink, closeModal, edit, editData, ed
value={icon}
onChange={(e) => setIcon(e.target.value.replace(/(\r\n|\n|\r)/gm, ''))}
/>
<span className="dropdown-error">{iconError}</span>
</div>
<div className="addFooter">
<span className="dropdown-error">
{iconError} {urlError}
</span>
{edit ? (
<button
style={{
@ -63,6 +66,7 @@ function AddModal({ urlError, iconError, addLink, closeModal, edit, editData, ed
height: '16px',
fontSize: '15px',
}}
className="sideload"
onClick={() => addLink(name, url, icon)}
>
<MdAddLink /> {variables.getMessage('widgets.quicklinks.add')}

6
src/components/modals/welcome/welcome.scss
View File

@ -72,7 +72,7 @@
margin: 5px;
transition: 0.2s ease-in-out;
cursor: pointer;
border-radius: 10px 10px 0x 0;
border-radius: 10px 10px 0 0;
&:hover {
background: #dd4038;
border-radius: 10px;
@ -202,13 +202,13 @@ a.privacy {
}
img {
max-width: 60%;
border-radius: 10px 10px 10px 0px;
border-radius: 10px 10px 10px 0;
}
}
.shareYourMue {
padding: 8px 20px 8px 20px;
border-radius: 0px 0px 10px 10px;
border-radius: 0 0 10px 10px;
letter-spacing: 2px;
@include themed {
background-color: t($modal-sidebarActive);

3
src/components/widgets/background/scss/_photoinformation.scss
View File

@ -62,8 +62,7 @@
}
.photoInformation-content {
padding: 20px;
padding-left: 0;
padding: 20px 20px 20px 0;
}
.map-concept {

38
src/components/widgets/quicklinks/quicklinks.scss
View File

@ -149,10 +149,40 @@ button.quicklinks {
bottom: 515px;
}
.addLinkModal {
@extend %tabText;
padding: 15px;
@include themed {
background: t($modal-secondaryColour);
}
button {
@include modal-button(standard);
padding: 10px 30px 10px 30px;
float: right;
}
.addFooter {
display: flex;
flex-flow: row;
justify-content: space-between;
align-items: center;
}
.dropdown-error {
font-size: 16px;
padding-left: 5px;
color: #e74c3c;
}
}
.quicklinkModalTextbox {
display: flex;
flex-flow: column;
gap: 5px;
display: grid;
grid-template-rows: auto 1fr; /* Two rows: first auto-sized, second filling remaining space */
grid-template-columns: repeat(2, 1fr); /* Two equal-width columns for the first row */
grid-gap: 10px; /* Optional gap between items */
padding: 15px 0 15px 0;
button {
display: flex;
@ -162,7 +192,7 @@ button.quicklinks {
}
.dropdown-error {
font-size: 13px;
font-size: 30px;
padding-left: 5px;
color: #e74c3c;
}

2
src/components/widgets/time/clock.scss
View File

@ -54,6 +54,6 @@
.seconds {
font-size: 0.2em;
line-height: 0%;
line-height: 0;
}
}

1
src/components/widgets/weather/weather.scss
View File

@ -1,3 +1,4 @@
//noinspection CssUnknownTarget
@import 'scss/variables';
.weather {

3
src/modules/constants.js
View File

@ -26,9 +26,6 @@ export const REPO_NAME = 'mue';
export const EMAIL = 'hello@muetab.com';
export const TWITTER_HANDLE = 'getmue';
export const DISCORD_SERVER = 'zv8C9F8';
export const COPYRIGHT_NAME = 'The Mue Authors & Kaiso One Ltd';
export const COPYRIGHT_YEAR = '2018';
export const COPYRIGHT_LICENSE = 'BSD-3-Clause License';
export const OPENCOLLECTIVE_USERNAME = 'mue';
export const OFFLINE_IMAGES = 20;

2
src/modules/helpers/settings/achievement_translations/index.js
View File

@ -10,6 +10,7 @@ import zh_CN from './zh_CN.json';
import id_ID from './id_ID.json';
import tr_TR from './tr_TR.json';
import bn from './bn.json';
import pt_BR from './pt_BR.json';
const translations = {
de_DE,
@ -24,6 +25,7 @@ const translations = {
id_ID,
tr_TR,
bn,
pt_BR,
};
export default translations;

8
src/modules/helpers/settings/achievement_translations/pt_BR.json Normal file
View File

@ -0,0 +1,8 @@
[
"Opened 10 tabs",
"Opened 39 tabs",
"Opened 100 tabs",
"Opened 305 tabs",
"Installed an add-on",
"Installed 5 add-ons"
]

8
src/modules/helpers/settings/modals.js
View File

@ -52,9 +52,11 @@ export function exportSettings() {
settings[key] = localStorage.getItem(key);
});
// i think a good improvement would be to make the file names more descriptive, or allow for saving as custom
// otherwise you'll end up with mue-settings (6000).json and have absolutely no idea what any of them are for
saveFile(settings, 'mue-settings.json');
let date = new Date();
// Format the date as YYYY-MM-DD_HH-MM-SS
let formattedDate = `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}_${date.getHours().toString().padStart(2, '0')}-${date.getMinutes().toString().padStart(2, '0')}-${date.getSeconds().toString().padStart(2, '0')}`;
let filename = `mue_settings_backup_${formattedDate}.json`;
saveFile(settings, filename);
variables.stats.postEvent('tab', 'Settings exported');
}

1
src/translations/bn.json
View File

@ -459,7 +459,6 @@
},
"about": {
"title": "About",
"copyright": "Copyright",
"version": {
"title": "Version",
"checking_update": "Checking for update",

1
src/translations/de_DE.json
View File

@ -459,7 +459,6 @@
},
"about": {
"title": "Über",
"copyright": "Urheberrechte",
"version": {
"title": "Version",
"checking_update": "Auf Update prüfen",

1
src/translations/en_GB.json
View File

@ -464,7 +464,6 @@
},
"about": {
"title": "About",
"copyright": "Copyright",
"version": {
"title": "Version",
"checking_update": "Checking for update",

1
src/translations/en_US.json
View File

@ -464,7 +464,6 @@
},
"about": {
"title": "About",
"copyright": "Copyright",
"version": {
"title": "Version",
"checking_update": "Checking for update",

1293
src/translations/es.json
View File

File diff suppressed because it is too large Load Diff

1
src/translations/es_419.json
View File

@ -459,7 +459,6 @@
},
"about": {
"title": "Acerca de",
"copyright": "Copyright",
"version": {
"title": "Versión",
"checking_update": "Comprobando actualizaciones",

1
src/translations/fr.json
View File

@ -459,7 +459,6 @@
},
"about": {
"title": "à propos de",
"copyright": "Droits d'auteur",
"version": {
"title": "Version",
"checking_update": "Vérification de la mise à jour",

1
src/translations/id_ID.json
View File

@ -459,7 +459,6 @@
},
"about": {
"title": "Tentang Mue",
"copyright": "Hak Cipta",
"version": {
"title": "Versi",
"checking_update": "Periksa pembaruan",

1
src/translations/nl.json
View File

@ -113,7 +113,6 @@
"about": {
"contact_us": "Contact Us",
"contributors": "Contributors",
"copyright": "Copyright",
"form_button": "Forum",
"no_supporters": "There are currently no Mue supporters",
"photographers": "Photographers",

1
src/translations/no.json
View File

@ -459,7 +459,6 @@
},
"about": {
"title": "About",
"copyright": "Copyright",
"version": {
"title": "Version",
"checking_update": "Checking for update",

1
src/translations/pt.json
View File

@ -459,7 +459,6 @@
},
"about": {
"title": "Sobre",
"copyright": "Direito autoral",
"version": {
"title": "Versão",
"checking_update": "Verificando atualização",

5
src/translations/pt_BR.json
View File

@ -43,9 +43,9 @@
},
"weather": {
"not_found": "Não encontrado",
"meters": "{quantidade} metros",
"meters": "{amount} metros",
"extra_information": "Informação extra",
"feels_like": "Parece {quantia}"
"feels_like": "Parece {amount}"
},
"quote": {
"link_tooltip": "Abrir na Wikipédia",
@ -459,7 +459,6 @@
},
"about": {
"title": "Sobre",
"copyright": "Direito autoral",
"version": {
"title": "Versão",
"checking_update": "Verificando atualização",

1
src/translations/ru.json
View File

@ -459,7 +459,6 @@
},
"about": {
"title": "О программе",
"copyright": "Copyright",
"version": {
"title": "Version",
"checking_update": "Проверка обновлений",

1293
src/translations/tr_TR.json
View File

File diff suppressed because it is too large Load Diff

1
src/translations/zh_CN.json
View File

@ -459,7 +459,6 @@
},
"about": {
"title": "关于",
"copyright": "版权",
"version": {
"title": "版本",
"checking_update": "正在检查更新……",