mirror of https://github.com/mue/mue.git
feat: new error message
- clean up of translation code Co-authored-by: David Ralph <me@davidcralph.co.uk>
This commit is contained in:
parent
2f851d8933
commit
b9bb735371
|
@ -0,0 +1,28 @@
|
|||
// API URLs
|
||||
API_URL=https://api.muetab.com/v2
|
||||
SPONSORS_URL=https://sponsors.muetab.com
|
||||
GITHUB_URL=https://api.github.com
|
||||
DDG_IMAGE_PROXY=https://external-content.duckduckgo.com/iu/?u=
|
||||
OPENSTREETMAP_URL=https://www.openstreetmap.org
|
||||
|
||||
// Mue URLs
|
||||
WEBSITE_URL=https://muetab.com
|
||||
PRIVACY_URL=https://muetab.com/privacy
|
||||
BLOG_POST=https://blog.muetab.com/posts/version-7-0
|
||||
TRANSLATIONS_URL=https://docs.muetab.com/translations/
|
||||
WEBLATE_URL=https://hosted.weblate.org/projects/mue/mue-tab/
|
||||
REPORT_ITEM =https://github.com/mue/marketplace/issues/new?assignees=&labels=item+report&template=item-report.md&title=%5BItem+Report%5D+
|
||||
BUG_REPORT =https://github.com/mue/mue/issues/new?assignees=&labels=issue+report&template=bug-report.md&title=%5BBug%5D+
|
||||
DONATE_LINK=https://muetab.com/donate
|
||||
SENTRY_DSN =https://430352fd4b174d688ebd82fc85c22c58@o1217438.ingest.sentry.io/6359480
|
||||
KNOWLEDGEBASE=https://support.muetab.com
|
||||
|
||||
// Mue Info
|
||||
ORG_NAME=mue
|
||||
REPO_NAME=mue
|
||||
EMAIL=hello@muetab.com
|
||||
TWITTER_HANDLE=getmue
|
||||
DISCORD_SERVER=zv8C9F8
|
||||
OPENCOLLECTIVE_USERNAME=mue
|
||||
|
||||
VERSION=7.0.1
|
|
@ -1,19 +1,51 @@
|
|||
import React, { Component } from 'react';
|
||||
import React, { PureComponent } from 'react';
|
||||
|
||||
class ErrorBoundary extends Component {
|
||||
import { captureException } from '@sentry/react';
|
||||
|
||||
class ErrorBoundary extends PureComponent {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = { hasError: false };
|
||||
this.state = {
|
||||
error: false,
|
||||
errorData: '',
|
||||
showReport: true,
|
||||
};
|
||||
}
|
||||
|
||||
componentDidCatch(error, errorInfo) {
|
||||
this.setState({ hasError: true });
|
||||
this.setState({ error: true, errorData: errorInfo });
|
||||
console.error('Error boundary caught an error:', error, errorInfo);
|
||||
}
|
||||
|
||||
reportError() {
|
||||
captureException(this.state.errorData);
|
||||
this.setState({
|
||||
showReport: false,
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
if (this.state.hasError) {
|
||||
return <div>Mue has broken horribly</div>;
|
||||
if (this.state.error) {
|
||||
return (
|
||||
<div className="criticalError">
|
||||
<div className="criticalError-message">
|
||||
<h1>A critical error has occurred</h1>
|
||||
<p>
|
||||
The new tab page could not be loaded. Please uninstall the extension and try again.
|
||||
</p>
|
||||
<div className="criticalError-actions">
|
||||
{this.state.showReport ? (
|
||||
<button onClick={() => this.reportError()}>Report Issue</button>
|
||||
) : (
|
||||
<p>Sent Successfully</p>
|
||||
)}
|
||||
<a href="https://discord.gg/zv8C9F8" target="_blank" rel="noreferrer">
|
||||
Support Discord
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return this.props.children;
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
@import 'modules/tabs/about';
|
||||
@import 'modules/tabs/changelog';
|
||||
@import 'modules/tabs/order';
|
||||
@import 'modules/tabs/stats';
|
||||
|
||||
input {
|
||||
/* colour picker */
|
||||
|
@ -127,102 +128,18 @@ h4 {
|
|||
}
|
||||
}
|
||||
|
||||
.stats {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
gap: 30px;
|
||||
width: 100%;
|
||||
|
||||
.rightPanel {
|
||||
.statIcon {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.statGrid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||
grid-gap: 10px;
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
}
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.achievements {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
grid-gap: 10px;
|
||||
}
|
||||
|
||||
.achievement {
|
||||
padding: 20px 10px;
|
||||
display: flex;
|
||||
flex-flow: row !important;
|
||||
align-items: center;
|
||||
|
||||
@include themed {
|
||||
background: t($modal-secondaryColour);
|
||||
border: 1px solid t($modal-sidebarActive);
|
||||
border-radius: t($borderRadius);
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
svg {
|
||||
font-size: 20px !important;
|
||||
padding: 15px;
|
||||
border-radius: 100%;
|
||||
|
||||
@include themed {
|
||||
background: t($modal-sidebarActive);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.statSection.rightPanel {
|
||||
padding: 25px;
|
||||
|
||||
@include themed {
|
||||
border-radius: t($borderRadius);
|
||||
background: t($modal-secondaryColour);
|
||||
box-shadow: 0 0 0 1px t($modal-sidebarActive);
|
||||
|
||||
svg {
|
||||
font-size: 50px;
|
||||
color: t($subColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.achievementContent {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
gap: 2px;
|
||||
|
||||
span:first-child {
|
||||
font-weight: bold;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 13px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.customcss textarea {
|
||||
font-family: Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter',
|
||||
'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco,
|
||||
'Courier New', Courier, monospace !important;
|
||||
}
|
||||
|
||||
.preferences {
|
||||
transition: 0.4s ease-in-out;
|
||||
}
|
||||
|
||||
.preferencesInactive {
|
||||
opacity: 0.5;
|
||||
pointer-events: none;
|
||||
transition: 0.4s ease-in-out;
|
||||
}
|
||||
|
|
|
@ -0,0 +1,106 @@
|
|||
.stats {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
gap: 30px;
|
||||
width: 100%;
|
||||
|
||||
.rightPanel {
|
||||
.statIcon {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.statGrid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||||
grid-gap: 10px;
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
}
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.achievements {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
grid-gap: 10px;
|
||||
}
|
||||
|
||||
.achievement {
|
||||
padding: 20px 10px;
|
||||
display: flex;
|
||||
flex-flow: row !important;
|
||||
align-items: center;
|
||||
|
||||
@include themed {
|
||||
background: t($modal-secondaryColour);
|
||||
border: 1px solid t($modal-sidebarActive);
|
||||
border-radius: t($borderRadius);
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
svg {
|
||||
font-size: 20px !important;
|
||||
padding: 15px;
|
||||
border-radius: 100%;
|
||||
|
||||
@include themed {
|
||||
background: t($modal-sidebarActive);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.statSection.rightPanel {
|
||||
padding: 25px;
|
||||
|
||||
@include themed {
|
||||
border-radius: t($borderRadius);
|
||||
background: t($modal-secondaryColour);
|
||||
box-shadow: 0 0 0 1px t($modal-sidebarActive);
|
||||
|
||||
svg {
|
||||
font-size: 50px;
|
||||
color: t($subColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.achievementContent {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
gap: 2px;
|
||||
|
||||
span:first-child {
|
||||
font-weight: bold;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 13px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.statsTopBar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
button {
|
||||
margin-bottom: 15px;
|
||||
flex-flow: row !important;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
}
|
|
@ -99,6 +99,7 @@ class Tabs extends PureComponent {
|
|||
icon={icon}
|
||||
label={variables.getMessage(`modals.main.navbar.${tab}`)}
|
||||
active={this.props.current === tab}
|
||||
key={tab}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
|
|
@ -28,6 +28,4 @@ export const TWITTER_HANDLE = 'getmue';
|
|||
export const DISCORD_SERVER = 'zv8C9F8';
|
||||
export const OPENCOLLECTIVE_USERNAME = 'mue';
|
||||
|
||||
export const OFFLINE_IMAGES = 20;
|
||||
|
||||
export const VERSION = '7.0.1';
|
||||
|
|
|
@ -1,19 +1,21 @@
|
|||
import I18n from '@eartharoid/i18n';
|
||||
|
||||
import * as de_DE from '../translations/de_DE.json';
|
||||
import * as en_GB from '../translations/en_GB.json';
|
||||
import * as en_US from '../translations/en_US.json';
|
||||
import * as es from '../translations/es.json';
|
||||
import * as es_419 from '../translations/es_419.json';
|
||||
import * as fr from '../translations/fr.json';
|
||||
import * as nl from '../translations/nl.json';
|
||||
import * as no from '../translations/no.json';
|
||||
import * as ru from '../translations/ru.json';
|
||||
import * as zh_CN from '../translations/zh_CN.json';
|
||||
import * as id_ID from '../translations/id_ID.json';
|
||||
import * as tr_TR from '../translations/tr_TR.json';
|
||||
import * as pt_BR from '../translations/pt_BR.json';
|
||||
import * as bn from '../translations/bn.json';
|
||||
export const translations = {
|
||||
de_DE: import('../translations/de_DE.json'),
|
||||
en_GB: import('../translations/en_GB.json'),
|
||||
en_US: import('../translations/en_US.json'),
|
||||
es: import('../translations/es.json'),
|
||||
es_419: import('../translations/es_419.json'),
|
||||
fr: import('../translations/fr.json'),
|
||||
nl: import('../translations/nl.json'),
|
||||
no: import('../translations/no.json'),
|
||||
ru: import('../translations/ru.json'),
|
||||
zh_CN: import('../translations/zh_CN.json'),
|
||||
id_ID: import('../translations/id_ID.json'),
|
||||
tr_TR: import('../translations/tr_TR.json'),
|
||||
pt_BR: import('../translations/pt_BR.json'),
|
||||
bn: import('../translations/bn.json'),
|
||||
};
|
||||
|
||||
/**
|
||||
* Initialise the i18n object.
|
||||
|
@ -22,39 +24,6 @@ import * as bn from '../translations/bn.json';
|
|||
* @returns The i18n object.
|
||||
*/
|
||||
export function initTranslations(locale) {
|
||||
const i18n = new I18n(locale, {
|
||||
de_DE,
|
||||
en_GB,
|
||||
en_US,
|
||||
es,
|
||||
es_419,
|
||||
fr,
|
||||
nl,
|
||||
no,
|
||||
ru,
|
||||
zh_CN,
|
||||
id_ID,
|
||||
tr_TR,
|
||||
pt_BR,
|
||||
bn,
|
||||
});
|
||||
|
||||
const i18n = new I18n(locale, translations);
|
||||
return i18n;
|
||||
}
|
||||
|
||||
export const translations = {
|
||||
de_DE,
|
||||
en_GB,
|
||||
en_US,
|
||||
es,
|
||||
es_419,
|
||||
fr,
|
||||
nl,
|
||||
no,
|
||||
ru,
|
||||
zh_CN,
|
||||
id_ID,
|
||||
tr_TR,
|
||||
pt_BR,
|
||||
bn,
|
||||
};
|
||||
|
|
|
@ -116,25 +116,45 @@ body {
|
|||
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
.statsTopBar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
/* error */
|
||||
.criticalError {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
.criticalError-message {
|
||||
color: #fff;
|
||||
}
|
||||
p {
|
||||
color: #ffffffc0;
|
||||
}
|
||||
|
||||
button {
|
||||
margin-bottom: 15px;
|
||||
flex-flow: row !important;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
.criticalError-actions {
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
button,
|
||||
a {
|
||||
background: #0e1013;
|
||||
box-shadow: 0 0 0 1px #484848;
|
||||
border: 0;
|
||||
color: #fff;
|
||||
border-radius: 12px;
|
||||
padding: 10px 30px 10px 30px;
|
||||
font-size: 1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-flow: row;
|
||||
justify-content: center;
|
||||
gap: 20px;
|
||||
transition: 0.5s;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
background: #1e1e1e;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.preferences {
|
||||
transition: 0.4s ease-in-out;
|
||||
}
|
||||
|
||||
.preferencesInactive {
|
||||
opacity: 0.5;
|
||||
pointer-events: none;
|
||||
transition: 0.4s ease-in-out;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue