mirror of https://github.com/mue/mue.git
refactor(widgets): Continue move to feature based organisation
This commit is contained in:
parent
8bf70eff81
commit
6041372860
|
@ -2,9 +2,9 @@ import variables from 'config/variables';
|
||||||
import { PureComponent } from 'react';
|
import { PureComponent } from 'react';
|
||||||
import { ToastContainer } from 'react-toastify';
|
import { ToastContainer } from 'react-toastify';
|
||||||
|
|
||||||
import Background from 'features/widgets/background/Background';
|
import Background from 'features/background/Background';
|
||||||
import Widgets from 'features/widgets/Widgets';
|
import Widgets from 'features/misc/views/Widgets';
|
||||||
import Modals from 'features/modals/Modals';
|
import Modals from 'features/misc/modals/Modals';
|
||||||
|
|
||||||
import { loadSettings, moveSettings } from 'utils/settings';
|
import { loadSettings, moveSettings } from 'utils/settings';
|
||||||
|
|
||||||
|
|
|
@ -3,24 +3,20 @@ import { PureComponent } from 'react';
|
||||||
import { MdSource, MdOutlineKeyboardArrowRight, MdOutlineAutoAwesome } from 'react-icons/md';
|
import { MdSource, MdOutlineKeyboardArrowRight, MdOutlineAutoAwesome } from 'react-icons/md';
|
||||||
|
|
||||||
import { Header } from 'components/Layout/Settings';
|
import { Header } from 'components/Layout/Settings';
|
||||||
import Checkbox from '../../../../../../components/Form/Settings/Checkbox/Checkbox';
|
import Checkbox from '../../../components/Form/Settings/Checkbox/Checkbox';
|
||||||
import ChipSelect from '../../../../../../components/Form/Settings/ChipSelect/ChipSelect';
|
import ChipSelect from '../../../components/Form/Settings/ChipSelect/ChipSelect';
|
||||||
import Dropdown from '../../../../../../components/Form/Settings/Dropdown/Dropdown';
|
import Dropdown from '../../../components/Form/Settings/Dropdown/Dropdown';
|
||||||
import Slider from '../../../../../../components/Form/Settings/Slider/Slider';
|
import Slider from '../../../components/Form/Settings/Slider/Slider';
|
||||||
import Radio from '../../../../../../components/Form/Settings/Radio/Radio';
|
import Radio from '../../../components/Form/Settings/Radio/Radio';
|
||||||
import {
|
import { Row, Content, Action } from '../../../components/Layout/Settings/Item/SettingsItem';
|
||||||
Row,
|
import Text from '../../../components/Form/Settings/Text/Text';
|
||||||
Content,
|
|
||||||
Action,
|
|
||||||
} from '../../../../../../components/Layout/Settings/Item/SettingsItem';
|
|
||||||
import Text from '../../../../../../components/Form/Settings/Text/Text';
|
|
||||||
|
|
||||||
import ColourSettings from './Colour';
|
import ColourSettings from './Colour';
|
||||||
import CustomSettings from './Custom';
|
import CustomSettings from './Custom';
|
||||||
|
|
||||||
import values from 'utils/data/slider_values.json';
|
import values from 'utils/data/slider_values.json';
|
||||||
|
|
||||||
export default class BackgroundSettings extends PureComponent {
|
class BackgroundOptions extends PureComponent {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.state = {
|
this.state = {
|
||||||
|
@ -627,3 +623,5 @@ export default class BackgroundSettings extends PureComponent {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export { BackgroundOptions as default, BackgroundOptions };
|
|
@ -2,16 +2,12 @@ import variables from 'config/variables';
|
||||||
import { PureComponent, Fragment } from 'react';
|
import { PureComponent, Fragment } from 'react';
|
||||||
import { ColorPicker } from '@muetab/react-color-gradient-picker';
|
import { ColorPicker } from '@muetab/react-color-gradient-picker';
|
||||||
import { toast } from 'react-toastify';
|
import { toast } from 'react-toastify';
|
||||||
import {
|
import { Row, Content, Action } from '../../../components/Layout/Settings/Item/SettingsItem';
|
||||||
Row,
|
|
||||||
Content,
|
|
||||||
Action,
|
|
||||||
} from '../../../../../../components/Layout/Settings/Item/SettingsItem';
|
|
||||||
|
|
||||||
import { hexToRgb, rgbToHex } from 'utils/background/gradient';
|
import { hexToRgb, rgbToHex } from 'utils/background/gradient';
|
||||||
|
|
||||||
//import '@muetab/react-color-gradient-picker/dist/index.css';
|
//import '@muetab/react-color-gradient-picker/dist/index.css';
|
||||||
import '../../../scss/settings/react-color-picker-gradient-picker-custom-styles.scss';
|
import '../scss/react-color-picker-gradient-picker-custom-styles.scss';
|
||||||
|
|
||||||
export default class ColourSettings extends PureComponent {
|
export default class ColourSettings extends PureComponent {
|
||||||
DefaultGradientSettings = {
|
DefaultGradientSettings = {
|
|
@ -13,8 +13,8 @@ import EventBus from 'utils/eventbus';
|
||||||
import { compressAccurately, filetoDataURL } from 'image-conversion';
|
import { compressAccurately, filetoDataURL } from 'image-conversion';
|
||||||
import { videoCheck } from 'utils/background';
|
import { videoCheck } from 'utils/background';
|
||||||
|
|
||||||
import Checkbox from '../../../../../../components/Form/Settings/Checkbox/Checkbox';
|
import Checkbox from '../../../components/Form/Settings/Checkbox/Checkbox';
|
||||||
import FileUpload from '../../../../../../components/Form/Settings/FileUpload/FileUpload';
|
import FileUpload from '../../../components/Form/Settings/FileUpload/FileUpload';
|
||||||
import { Tooltip } from 'components/Elements';
|
import { Tooltip } from 'components/Elements';
|
||||||
import Modal from 'react-modal';
|
import Modal from 'react-modal';
|
||||||
|
|
|
@ -0,0 +1 @@
|
||||||
|
export * from './BackgroundOptions';
|
|
@ -3,8 +3,8 @@ import { PureComponent } from 'react';
|
||||||
import Modal from 'react-modal';
|
import Modal from 'react-modal';
|
||||||
|
|
||||||
import Main from './main/Main';
|
import Main from './main/Main';
|
||||||
import Navbar from '../widgets/navbar/Navbar';
|
import Navbar from '../../navbar/Navbar';
|
||||||
import Preview from '../helpers/preview/Preview';
|
import Preview from '../../helpers/preview/Preview';
|
||||||
|
|
||||||
import EventBus from 'utils/eventbus';
|
import EventBus from 'utils/eventbus';
|
||||||
|
|
|
@ -12,7 +12,7 @@ import {
|
||||||
|
|
||||||
import Item from '../components/Items/Item';
|
import Item from '../components/Items/Item';
|
||||||
import Items from '../components/Items/Items';
|
import Items from '../components/Items/Items';
|
||||||
import Dropdown from '../../../../../components/Form/Settings/Dropdown/Dropdown';
|
import Dropdown from '../../../../../../components/Form/Settings/Dropdown/Dropdown';
|
||||||
import { Header } from 'components/Layout/Settings';
|
import { Header } from 'components/Layout/Settings';
|
||||||
import { Button } from 'components/Elements';
|
import { Button } from 'components/Elements';
|
||||||
|
|
|
@ -15,7 +15,7 @@ import ResetModal from '../ResetModal';
|
||||||
|
|
||||||
import { Header, Section, Row, Content, Action } from 'components/Layout/Settings';
|
import { Header, Section, Row, Content, Action } from 'components/Layout/Settings';
|
||||||
|
|
||||||
import time_zones from 'features/widgets/time/timezones.json';
|
import time_zones from 'features/time/timezones.json';
|
||||||
|
|
||||||
export default function AdvancedSettings() {
|
export default function AdvancedSettings() {
|
||||||
const [resetModal, setResetModal] = useState(false);
|
const [resetModal, setResetModal] = useState(false);
|
|
@ -1,13 +1,17 @@
|
||||||
import variables from 'config/variables';
|
import variables from 'config/variables';
|
||||||
import { useState, memo } from 'react';
|
import { useState, memo } from 'react';
|
||||||
import Checkbox from '../../../../../components/Form/Settings/Checkbox/Checkbox';
|
import Checkbox from '../../../../../../components/Form/Settings/Checkbox/Checkbox';
|
||||||
import Slider from '../../../../../components/Form/Settings/Slider/Slider';
|
import Slider from '../../../../../../components/Form/Settings/Slider/Slider';
|
||||||
import { TextField } from '@mui/material';
|
import { TextField } from '@mui/material';
|
||||||
|
|
||||||
import EventBus from 'utils/eventbus';
|
import EventBus from 'utils/eventbus';
|
||||||
import values from 'utils/data/slider_values.json';
|
import values from 'utils/data/slider_values.json';
|
||||||
|
|
||||||
import { Row, Content, Action } from '../../../../../components/Layout/Settings/Item/SettingsItem';
|
import {
|
||||||
|
Row,
|
||||||
|
Content,
|
||||||
|
Action,
|
||||||
|
} from '../../../../../../components/Layout/Settings/Item/SettingsItem';
|
||||||
|
|
||||||
function ExperimentalSettings() {
|
function ExperimentalSettings() {
|
||||||
const [eventType, setEventType] = useState();
|
const [eventType, setEventType] = useState();
|
|
@ -4,16 +4,16 @@ import { memo } from 'react';
|
||||||
import Tabs from './backend/Tabs';
|
import Tabs from './backend/Tabs';
|
||||||
|
|
||||||
import Overview from '../settings/sections/Overview';
|
import Overview from '../settings/sections/Overview';
|
||||||
import { NavbarOptions } from 'features/widgets/navbar';
|
import { NavbarOptions } from 'features/navbar';
|
||||||
import { GreetingOptions } from 'features/widgets/greeting';
|
import { GreetingOptions } from 'features/greeting';
|
||||||
import { TimeOptions } from 'features/widgets/time';
|
import { TimeOptions } from 'features/time';
|
||||||
import { QuickLinksOptions } from 'features/widgets/quicklinks';
|
import { QuickLinksOptions } from 'features/quicklinks';
|
||||||
import { QuoteOptions } from 'features/widgets/quote';
|
import { QuoteOptions } from 'features/quote';
|
||||||
import Date from '../settings/sections/Date';
|
import Date from '../settings/sections/Date';
|
||||||
import { MessageOptions } from 'features/widgets/message';
|
import { MessageOptions } from 'features/message';
|
||||||
import Background from '../settings/sections/background/Background';
|
import { BackgroundOptions } from 'features/background';
|
||||||
import { SearchOptions } from 'features/widgets/search';
|
import { SearchOptions } from 'features/search';
|
||||||
import { WeatherOptions } from 'features/widgets/weather';
|
import { WeatherOptions } from 'features/weather';
|
||||||
import Appearance from '../settings/sections/Appearance';
|
import Appearance from '../settings/sections/Appearance';
|
||||||
import Language from '../settings/sections/Language';
|
import Language from '../settings/sections/Language';
|
||||||
import Advanced from '../settings/sections/Advanced';
|
import Advanced from '../settings/sections/Advanced';
|
||||||
|
@ -50,7 +50,7 @@ const sections = [
|
||||||
{
|
{
|
||||||
label: 'modals.main.settings.sections.background.title',
|
label: 'modals.main.settings.sections.background.title',
|
||||||
name: 'background',
|
name: 'background',
|
||||||
component: Background,
|
component: BackgroundOptions,
|
||||||
},
|
},
|
||||||
{ label: 'modals.main.settings.sections.search.title', name: 'search', component: SearchOptions },
|
{ label: 'modals.main.settings.sections.search.title', name: 'search', component: SearchOptions },
|
||||||
{
|
{
|
|
@ -92,23 +92,25 @@ class Tabs extends PureComponent {
|
||||||
</div>
|
</div>
|
||||||
<div className="modalTabContent">
|
<div className="modalTabContent">
|
||||||
<div className="modalNavbar">
|
<div className="modalNavbar">
|
||||||
{navbarButtons.map(({ tab, icon }) => (
|
{navbarButtons.map(({ tab, icon }, index) => (
|
||||||
<Button
|
<Button
|
||||||
type="navigation"
|
type="navigation"
|
||||||
onClick={() => this.props.changeTab(tab)}
|
onClick={() => this.props.changeTab(tab)}
|
||||||
icon={icon}
|
icon={icon}
|
||||||
label={variables.getMessage(`modals.main.navbar.${tab}`)}
|
label={variables.getMessage(`modals.main.navbar.${tab}`)}
|
||||||
active={this.props.current === tab}
|
active={this.props.current === tab}
|
||||||
key={tab}
|
key={`${tab}-${index}`}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
{this.props.children.map((tab) => {
|
{this.props.children.map((tab, index) => {
|
||||||
if (tab.props.label !== this.state.currentTab) {
|
if (tab.props.label !== this.state.currentTab) {
|
||||||
return undefined;
|
return undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
return <ErrorBoundary>{tab.props.children}</ErrorBoundary>;
|
return (
|
||||||
|
<ErrorBoundary key={`error-boundary-${index}`}>{tab.props.children}</ErrorBoundary>
|
||||||
|
);
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue