Dockery/Homarr
1
0
Fork 0
mirror of https://github.com/ajnart/homarr.git synced 2025-11-14 17:26:26 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'dev' into dnd

Browse Source
This commit is contained in:
Thomas Camlong
2022-05-23 11:24:31 +02:00
committed by GitHub
parent b69343af56 225f910fe8
commit 19bd14c63d
17 changed files with 1768 additions and 1721 deletions
Download Patch File Download Diff File Expand all files Collapse all files

180
package.json
View File

@@ -1,93 +1,95 @@
{
"name": "homarr",
"version": "0.4.0",
"private": "false",
"description": "Homarr - A homepage for your server.",
"repository": {
"type": "git",
"url": "https://github.com/ajnart/homarr"
},
"scripts": {
"dev": "next dev",
"build": "next build",
"analyze": "ANALYZE=true next build",
"start": "next start",
"typecheck": "tsc --noEmit",
"export": "next build && next export",
"lint": "next lint",
"jest": "jest",
"jest:watch": "jest --watch",
"prettier:check": "prettier --check \"**/*.{ts,tsx}\"",
"prettier:write": "prettier --write \"**/*.{ts,tsx}\"",
"test": "npm run prettier:check && npm run lint && npm run typecheck && npm run jest",
"storybook": "start-storybook -p 7001",
"storybook:build": "build-storybook",
"ci": "yarn test && yarn lint --fix && yarn typecheck && yarn prettier:write"
},
"dependencies": {
"name": "homarr",
"version": "0.4.0",
"private": "false",
"description": "Homarr - A homepage for your server.",
"repository": {
"type": "git",
"url": "https://github.com/ajnart/homarr"
},
"scripts": {
"dev": "next dev",
"build": "next build",
"analyze": "ANALYZE=true next build",
"start": "next start",
"typecheck": "tsc --noEmit",
"export": "next build && next export",
"lint": "next lint",
"jest": "jest",
"jest:watch": "jest --watch",
"prettier:check": "prettier --check \"**/*.{ts,tsx}\"",
"prettier:write": "prettier --write \"**/*.{ts,tsx}\"",
"test": "npm run prettier:check && npm run lint && npm run typecheck && npm run jest",
"storybook": "start-storybook -p 7001",
"storybook:build": "build-storybook",
"ci": "yarn test && yarn lint --fix && yarn typecheck && yarn prettier:write"
},
"dependencies": {
"@dnd-kit/core": "^6.0.1",
"@dnd-kit/sortable": "^7.0.0",
"@mantine/core": "^4.2.4",
"@mantine/dates": "^4.2.4",
"@mantine/dropzone": "^4.2.4",
"@mantine/form": "^4.2.4",
"@mantine/hooks": "^4.2.4",
"@mantine/modals": "^4.2.4",
"@mantine/next": "^4.2.4",
"@mantine/notifications": "^4.2.4",
"@mantine/prism": "^4.2.4",
"@mantine/rte": "^4.2.4",
"@mantine/spotlight": "^4.2.4",
"@modulz/radix-icons": "^4.0.0",
"axios": "^0.27.2",
"cookies-next": "^2.0.4",
"dayjs": "^1.11.2",
"framer-motion": "^6.3.1",
"js-file-download": "^0.4.12",
"next": "12.1.5-canary.4",
"prism-react-renderer": "^1.3.1",
"react": "18.0.0",
"react-dom": "18.0.0",
"tabler-icons-react": "^1.46.0"
},
"devDependencies": {
"@babel/core": "^7.17.8",
"@next/bundle-analyzer": "^12.1.4",
"@next/eslint-plugin-next": "^12.1.4",
"@storybook/addon-essentials": "^6.4.22",
"@storybook/addon-links": "^6.4.22",
"@storybook/react": "^6.4.22",
"@testing-library/dom": "^8.12.0",
"@testing-library/jest-dom": "^5.16.3",
"@testing-library/react": "^13.0.0",
"@testing-library/user-event": "^14.0.4",
"@types/jest": "^27.4.1",
"@types/node": "^17.0.23",
"@types/react": "17.0.43",
"@typescript-eslint/eslint-plugin": "^5.16.0",
"@typescript-eslint/parser": "^5.16.0",
"babel-loader": "^8.2.4",
"eslint": "^8.11.0",
"eslint-config-airbnb": "19.0.4",
"eslint-config-airbnb-typescript": "^16.1.4",
"eslint-config-mantine": "1.1.0",
"eslint-plugin-import": "^2.25.4",
"eslint-plugin-jest": "^26.1.3",
"eslint-plugin-jsx-a11y": "^6.5.1",
"eslint-plugin-react": "^7.29.4",
"eslint-plugin-react-hooks": "^4.3.0",
"eslint-plugin-storybook": "^0.5.11",
"eslint-plugin-testing-library": "^5.2.0",
"eslint-plugin-unused-imports": "^2.0.0",
"jest": "^27.5.1",
"prettier": "^2.6.2",
"storybook-addon-mock": "^2.3.2",
"storybook-addon-turbo-build": "^1.1.0",
"storybook-dark-mode": "^1.0.9",
"ts-jest": "^27.1.4",
"typescript": "4.6.3"
},
"resolutions": {
"@types/react": "17.0.30"
}
"@mantine/core": "^4.2.4",
"@mantine/dates": "^4.2.4",
"@mantine/dropzone": "^4.2.4",
"@mantine/form": "^4.2.4",
"@mantine/hooks": "^4.2.4",
"@mantine/modals": "^4.2.4",
"@mantine/next": "^4.2.4",
"@mantine/notifications": "^4.2.4",
"@mantine/prism": "^4.2.4",
"@mantine/rte": "^4.2.4",
"@mantine/spotlight": "^4.2.4",
"@modulz/radix-icons": "^4.0.0",
"axios": "^0.27.2",
"cookies-next": "^2.0.4",
"dayjs": "^1.11.2",
"framer-motion": "^6.3.1",
"js-file-download": "^0.4.12",
"next": "12.1.5-canary.4",
"prism-react-renderer": "^1.3.1",
"react": "18.0.0",
"react-dom": "18.0.0",
"tabler-icons-react": "^1.46.0",
"uuid": "^8.3.2"
},
"devDependencies": {
"@babel/core": "^7.17.8",
"@next/bundle-analyzer": "^12.1.4",
"@next/eslint-plugin-next": "^12.1.4",
"@storybook/addon-essentials": "^6.4.22",
"@storybook/addon-links": "^6.4.22",
"@storybook/react": "^6.4.22",
"@testing-library/dom": "^8.12.0",
"@testing-library/jest-dom": "^5.16.3",
"@testing-library/react": "^13.0.0",
"@testing-library/user-event": "^14.0.4",
"@types/jest": "^27.4.1",
"@types/node": "^17.0.23",
"@types/react": "17.0.43",
"@types/uuid": "^8.3.4",
"@typescript-eslint/eslint-plugin": "^5.16.0",
"@typescript-eslint/parser": "^5.16.0",
"babel-loader": "^8.2.4",
"eslint": "^8.11.0",
"eslint-config-airbnb": "19.0.4",
"eslint-config-airbnb-typescript": "^16.1.4",
"eslint-config-mantine": "1.1.0",
"eslint-plugin-import": "^2.25.4",
"eslint-plugin-jest": "^26.1.3",
"eslint-plugin-jsx-a11y": "^6.5.1",
"eslint-plugin-react": "^7.29.4",
"eslint-plugin-react-hooks": "^4.3.0",
"eslint-plugin-storybook": "^0.5.11",
"eslint-plugin-testing-library": "^5.2.0",
"eslint-plugin-unused-imports": "^2.0.0",
"jest": "^27.5.1",
"prettier": "^2.6.2",
"storybook-addon-mock": "^2.3.2",
"storybook-addon-turbo-build": "^1.1.0",
"storybook-dark-mode": "^1.0.9",
"ts-jest": "^27.1.4",
"typescript": "4.6.3"
},
"resolutions": {
"@types/react": "17.0.30"
}
}

3
src/components/AppShelf/AddAppShelfItem.tsx
View File

@@ -14,6 +14,7 @@ import {
import { useForm } from '@mantine/form';
import { useState } from 'react';
import { Apps } from 'tabler-icons-react';
import { v4 as uuidv4 } from 'uuid';
import { useConfig } from '../../tools/state';
import { ServiceTypeList } from '../../tools/types';
@@ -67,7 +68,7 @@ export function AddAppShelfItemForm(props: { setOpened: (b: boolean) => void } &
const form = useForm({
initialValues: {
id: props.id ?? crypto.randomUUID(),
id: props.id ?? uuidv4(),
type: props.type ?? 'Other',
name: props.name ?? '',
icon: props.icon ?? '/favicon.svg',

29
src/components/Settings/ModuleEnabler.tsx
View File

@@ -5,34 +5,25 @@ import { useConfig } from '../../tools/state';
export default function ModuleEnabler(props: any) {
const { config, setConfig } = useConfig();
const modules = Object.values(Modules).map((module) => module);
const enabledModules = config.settings.enabledModules ?? [];
modules.filter((module) => enabledModules.includes(module.title));
return (
<Group direction="column">
{modules.map((module) => (
<Switch
key={module.title}
size="md"
checked={enabledModules.includes(module.title)}
checked={config.modules?.[module.title]?.enabled ?? false}
label={`Enable ${module.title} module`}
onChange={(e) => {
if (e.currentTarget.checked) {
setConfig({
...config,
settings: {
...config.settings,
enabledModules: [...enabledModules, module.title],
setConfig({
...config,
modules: {
...config.modules,
[module.title]: {
...config.modules?.[module.title],
enabled: e.currentTarget.checked,
},
});
} else {
setConfig({
...config,
settings: {
...config.settings,
enabledModules: enabledModules.filter((m) => m !== module.title),
},
});
}
},
});
}}
/>
))}

30
src/components/modules/calendar/CalendarModule.tsx
View File

@@ -33,22 +33,22 @@ export default function CalendarComponent(props: any) {
const nextMonth = new Date(new Date().setMonth(new Date().getMonth() + 2)).toISOString();
if (sonarrService && sonarrService.apiKey) {
const baseUrl = new URL(sonarrService.url).origin;
fetch(
`${baseUrl}/api/calendar?apikey=${sonarrService?.apiKey}&end=${nextMonth}`
).then((response) => {
response.ok &&
response.json().then((data) => {
setSonarrMedias(data);
showNotification({
title: 'Sonarr',
icon: <Check />,
color: 'green',
autoClose: 1500,
radius: 'md',
message: `Loaded ${data.length} releases`,
fetch(`${baseUrl}/api/calendar?apikey=${sonarrService?.apiKey}&end=${nextMonth}`).then(
(response) => {
response.ok &&
response.json().then((data) => {
setSonarrMedias(data);
showNotification({
title: 'Sonarr',
icon: <Check />,
color: 'green',
autoClose: 1500,
radius: 'md',
message: `Loaded ${data.length} releases`,
});
});
});
});
}
);
}
if (radarrService && radarrService.apiKey) {
const baseUrl = new URL(radarrService.url).origin;

9
src/components/modules/date/DateModule.tsx
View File

@@ -21,13 +21,8 @@ export const DateModule: IModule = {
export default function DateComponent(props: any) {
const [date, setDate] = useState(new Date());
const { config } = useConfig();
const hours = date.getHours();
const minutes = date.getMinutes();
const isFullTime =
config.settings[`${DateModule.title}.full`] === undefined
? true
: config.settings[`${DateModule.title}.full`];
const formatString = isFullTime ? 'HH:mm' : 'h:mm a';
const isFullTime = config?.modules?.[DateModule.title]?.options?.full?.value ?? false;
const formatString = isFullTime ? 'HH:mm' : 'h:mm A';
// Change date on minute change
// Note: Using 10 000ms instead of 1000ms to chill a little :)
useEffect(() => {

27
src/components/modules/moduleWrapper.tsx
View File

@@ -5,9 +5,9 @@ import { IModule } from './modules';
export function ModuleWrapper(props: any) {
const { module }: { module: IModule } = props;
const { config, setConfig } = useConfig();
const enabledModules = config.settings.enabledModules ?? [];
const enabledModules = config.modules ?? {};
// Remove 'Module' from enabled modules titles
const isShown = enabledModules.includes(module.title);
const isShown = enabledModules[module.title]?.enabled ?? false;
const theme = useMantineTheme();
const items: JSX.Element[] = [];
if (module.options) {
@@ -18,25 +18,31 @@ export function ModuleWrapper(props: any) {
// Loop over all the types with a for each loop
types.forEach((type, index) => {
const optionName = `${module.title}.${keys[index]}`;
const moduleInConfig = config.modules?.[module.title];
// TODO: Add support for other types
if (type === 'boolean') {
items.push(
<Switch
defaultChecked={
// Set default checked to the value of the option if it exists
config.settings[optionName] ??
(module.options && module.options[keys[index]].value) ??
false
moduleInConfig?.options?.[keys[index]]?.value ?? false
}
defaultValue={config.settings[optionName] ?? false}
key={keys[index]}
onClick={(e) => {
setConfig({
...config,
settings: {
...config.settings,
enabledModules: [...config.settings.enabledModules],
[optionName]: e.currentTarget.checked,
modules: {
...config.modules,
[module.title]: {
...config.modules[module.title],
options: {
...config.modules[module.title].options,
[keys[index]]: {
...config.modules[module.title].options?.[keys[index]],
value: e.currentTarget.checked,
},
},
},
},
});
}}
@@ -46,7 +52,6 @@ export function ModuleWrapper(props: any) {
}
});
}
// Sussy baka
if (!isShown) {
return null;
}

2
src/components/modules/modules.tsx
View File

@@ -14,7 +14,7 @@ interface Option {
[x: string]: OptionValues;
}
interface OptionValues {
export interface OptionValues {
name: string;
value: boolean;
}

5
src/components/modules/ping/PingModule.tsx
View File

@@ -19,8 +19,9 @@ export default function PingComponent(props: any) {
const { url }: { url: string } = props;
const [isOnline, setOnline] = useState<State>('loading');
const exists = config.modules?.[PingModule.title]?.enabled ?? false;
useEffect(() => {
if (!config.settings.enabledModules.includes('Ping Services')) {
if (!exists) {
return;
}
axios
@@ -32,7 +33,7 @@ export default function PingComponent(props: any) {
setOnline('down');
});
}, []);
if (!config.settings.enabledModules.includes('Ping Services')) {
if (!exists) {
return null;
}
return (

5
src/components/modules/search/SearchModule.tsx
View File

@@ -46,7 +46,10 @@ export default function SearchBar(props: any) {
});
// If enabled modules doesn't contain the module, return null
if (!config.settings.enabledModules.includes(SearchModule.title)) {
// If module in enabled
const exists = config.modules?.[SearchModule.title]?.enabled ?? false;
if (!exists) {
return null;
}

8
src/components/modules/weather/WeatherModule.tsx
View File

@@ -132,9 +132,7 @@ export default function WeatherComponent(props: any) {
const { config } = useConfig();
const [weather, setWeather] = useState({} as WeatherResponse);
const isFahrenheit: boolean =
config.settings[`${WeatherModule.title}.freedomunit`] === undefined
? false
: config.settings[`${WeatherModule.title}.freedomunit`];
config?.modules?.[WeatherModule.title]?.options?.freedomunit?.value ?? false;
if ('geolocation' in navigator && location.lat === 0 && location.lng === 0) {
navigator.geolocation.getCurrentPosition((position) => {
@@ -163,10 +161,10 @@ export default function WeatherComponent(props: any) {
<Group spacing={0}>
<WeatherIcon code={weather.current_weather.weathercode} />
<Space mx="sm" />
<span>{weather.daily.temperature_2m_max[0]}°C</span>
<span>{usePerferedUnit(weather.daily.temperature_2m_max[0])}</span>
<ArrowUpRight size={16} style={{ right: 15 }} />
<Space mx="sm" />
<span>{weather.daily.temperature_2m_min[0]}°C</span>
<span>{usePerferedUnit(weather.daily.temperature_2m_min[0])}</span>
<ArrowDownRight size={16} />
</Group>
</Group>

4
src/pages/[slug].tsx
View File

@@ -20,12 +20,12 @@ export async function getServerSideProps(
return {
props: {
config: {
name: '',
name: 'Default config',
services: [],
settings: {
enabledModules: [],
searchUrl: 'https://www.google.com/search?q=',
},
modules: {},
},
},
};

3
src/pages/index.tsx
View File

@@ -27,10 +27,9 @@ export async function getServerSideProps({
name: cookie.toString(),
services: [],
settings: {
enabledModules: [],
searchBar: true,
searchUrl: 'https://www.google.com/search?q=',
},
modules: {},
},
},
};

33
src/pages/tryconfig.tsx Normal file
View File

@@ -0,0 +1,33 @@
import { Button } from '@mantine/core';
import { Prism } from '@mantine/prism';
import { useState } from 'react';
import { DateModule } from '../components/modules';
import { useConfig } from '../tools/state';
export default function TryConfig(props: any) {
const { config } = useConfig();
const [tempConfig, setTempConfig] = useState(config);
return (
<>
<Prism language="json">{JSON.stringify(tempConfig, null, 2)}</Prism>
<Button
onClick={() => {
setTempConfig({
...tempConfig,
modules: {
[DateModule.title]: {
enabled: true,
title: DateModule.title,
options: {
...DateModule.options,
},
},
},
});
}}
>
Add a module to the modules thingy
</Button>
</>
);
}

8
src/tools/state.tsx
View File

@@ -17,10 +17,9 @@ const configContext = createContext<configContextType>({
name: 'default',
services: [],
settings: {
searchBar: true,
searchUrl: 'https://www.google.com/search?q=',
enabledModules: [],
searchUrl: 'https://google.com/search?q=',
},
modules: {},
},
setConfig: () => {},
loadConfig: async (name: string) => {},
@@ -44,10 +43,9 @@ export function ConfigProvider({ children }: Props) {
name: 'default',
services: [],
settings: {
searchBar: true,
searchUrl: 'https://www.google.com/search?q=',
enabledModules: [],
},
modules: {},
});
async function loadConfig(configName: string) {

33
src/tools/types.ts
View File

@@ -1,32 +1,43 @@
import { OptionValues } from '../components/modules/modules';
export interface Settings {
searchUrl: string;
enabledModules: string[];
[key: string]: any;
}
export interface Config {
name: string;
services: serviceItem[];
settings: Settings;
modules: {
[key: string]: ConfigModule;
};
}
interface ConfigModule {
title: string;
enabled: boolean;
options: {
[key: string]: OptionValues;
};
}
export const ServiceTypeList = [
'Other',
'Sonarr',
'Radarr',
'Lidarr',
'qBittorrent',
'Plex',
'Emby',
'Lidarr',
'Plex',
'Radarr',
'Sonarr',
'qBittorrent',
];
export type ServiceType =
| 'Other'
| 'Sonarr'
| 'Radarr'
| 'Emby'
| 'Lidarr'
| 'qBittorrent'
| 'Plex'
| 'Emby';
| 'Radarr'
| 'Sonarr'
| 'qBittorrent';
export interface serviceItem {
id: string;

2
tsconfig.json
View File

@@ -16,5 +16,5 @@
"incremental": true
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "next.config.js"],
"exclude": ["node_modules", "**/*.story.*"]
"exclude": ["node_modules"]
}

3108
yarn.lock
View File

File diff suppressed because it is too large Load Diff