OpenSource/homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix widgets

Browse Source
This commit is contained in:
lukylix 2023-07-07 01:09:07 +02:00
parent 1bd300e497
commit 20e0d655fb
5 changed files with 3527 additions and 155 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Dockerfile
View File

@ -8,6 +8,8 @@ WORKDIR /app
COPY --link package.json pnpm-lock.yaml* ./
SHELL ["/bin/ash", "-xeo", "pipefail", "-c"]
RUN nslookup www.google.com
RUN sed -i 's/https/http/' /etc/apk/repositories
RUN apk add --no-cache libc6-compat \
&& apk add --no-cache --virtual .gyp python3 make g++ \
&& npm install -g pnpm

2
src/components/services/list.jsx
View File

@ -26,7 +26,7 @@ export default function List({ group, services, layout, isGroup = false }) {
service.type === "grouped-service" ? (
<List
key={service.name}
group={service.name}
group={group}
services={service.services}
layout={{ columns: parseInt(service.name, 10) || service.services.length, style: "row" }}
isGroup

73
src/pages/index.jsx
View File

@ -177,7 +177,14 @@ function Home({ initialSettings }) {
const { data: bookmarks } = useSWR("/api/bookmarks");
const { data: widgets } = useSWR("/api/widgets");
const servicesAndBookmarks = [...services.map(sg => sg.services).flat(), ...bookmarks.map(bg => bg.bookmarks).flat()]
const servicesAndBookmarks = [
...services
.map((sg) => sg.services)
.flat(1)
.map((service) => (service.type === "grouped-service" ? service.services : service))
.flat(1),
...bookmarks.map((bg) => bg.bookmarks).flat(),
];
useEffect(() => {
if (settings.language) {
@ -196,15 +203,15 @@ function Home({ initialSettings }) {
const [searching, setSearching] = useState(false);
const [searchString, setSearchString] = useState("");
let searchProvider = null;
const searchWidget = Object.values(widgets).find(w => w.type === "search");
const searchWidget = Object.values(widgets).find((w) => w.type === "search");
if (searchWidget) {
if (Array.isArray(searchWidget.options?.provider)) {
// if search provider is a list, try to retrieve from localstorage, fall back to the first
searchProvider = getStoredProvider() ?? searchProviders[searchWidget.options.provider[0]];
} else if (searchWidget.options?.provider === 'custom') {
} else if (searchWidget.options?.provider === "custom") {
searchProvider = {
url: searchWidget.options.url
}
url: searchWidget.options.url,
};
} else {
searchProvider = searchProviders[searchWidget.options?.provider];
}
@ -223,12 +230,12 @@ function Home({ initialSettings }) {
}
}
document.addEventListener('keydown', handleKeyDown);
document.addEventListener("keydown", handleKeyDown);
return function cleanup() {
document.removeEventListener('keydown', handleKeyDown);
}
})
document.removeEventListener("keydown", handleKeyDown);
};
});
return (
<>
@ -255,12 +262,7 @@ function Home({ initialSettings }) {
<meta name="theme-color" content={themes[initialSettings.color || "slate"][initialSettings.theme || "dark"]} />
</Head>
<div className="relative container m-auto flex flex-col justify-start z-10 h-full">
<div
className={classNames(
"flex flex-row flex-wrap justify-between",
headerStyles[headerStyle]
)}
>
<div className={classNames("flex flex-row flex-wrap justify-between", headerStyles[headerStyle])}>
<QuickLaunch
servicesAndBookmarks={servicesAndBookmarks}
searchString={searchString}
@ -274,17 +276,19 @@ function Home({ initialSettings }) {
{widgets
.filter((widget) => !rightAlignedWidgets.includes(widget.type))
.map((widget, i) => (
<Widget key={i} widget={widget} style={{ header: headerStyle, isRightAligned: false}} />
<Widget key={i} widget={widget} style={{ header: headerStyle, isRightAligned: false }} />
))}
<div className={classNames(
<div
className={classNames(
"m-auto flex flex-wrap grow sm:basis-auto justify-between md:justify-end",
headerStyle === "boxedWidgets" ? "sm:ml-4" : "sm:ml-2"
)}>
)}
>
{widgets
.filter((widget) => rightAlignedWidgets.includes(widget.type))
.map((widget, i) => (
<Widget key={i} widget={widget} style={{ header: headerStyle, isRightAligned: true}} />
<Widget key={i} widget={widget} style={{ header: headerStyle, isRightAligned: true }} />
))}
</div>
</>
@ -300,18 +304,21 @@ function Home({ initialSettings }) {
services={group}
layout={initialSettings.layout?.[group.name]}
fiveColumns={settings.fiveColumns}
disableCollapse={settings.disableCollapse} />
disableCollapse={settings.disableCollapse}
/>
))}
</div>
)}
{bookmarks?.length > 0 && (
<div className={`grow flex flex-wrap pt-0 p-4 sm:p-8 gap-2 grid-cols-1 lg:grid-cols-2 lg:grid-cols-${Math.min(6, bookmarks.length)}`}>
<div
className={`grow flex flex-wrap pt-0 p-4 sm:p-8 gap-2 grid-cols-1 lg:grid-cols-2 lg:grid-cols-${Math.min(
6,
bookmarks.length
)}`}
>
{bookmarks.map((group) => (
<BookmarksGroup
key={group.name}
group={group}
disableCollapse={settings.disableCollapse} />
<BookmarksGroup key={group.name} group={group} disableCollapse={settings.disableCollapse} />
))}
</div>
)}
@ -323,9 +330,7 @@ function Home({ initialSettings }) {
{!initialSettings?.theme && <ThemeToggle />}
</div>
<div className="flex mt-4 w-full justify-end">
{!initialSettings?.hideVersion && <Version />}
</div>
<div className="flex mt-4 w-full justify-end">{!initialSettings?.hideVersion && <Version />}</div>
</div>
</div>
</>
@ -340,7 +345,7 @@ export default function Wrapper({ initialSettings, fallback }) {
if (initialSettings && initialSettings.background) {
let opacity = initialSettings.backgroundOpacity ?? 1;
let backgroundImage = initialSettings.background;
if (typeof initialSettings.background === 'object') {
if (typeof initialSettings.background === "object") {
backgroundImage = initialSettings.background.image;
backgroundBlur = initialSettings.background.blur !== undefined;
backgroundSaturate = initialSettings.background.saturate !== undefined;
@ -375,11 +380,13 @@ export default function Wrapper({ initialSettings, fallback }) {
<div
id="inner_wrapper"
className={classNames(
'fixed overflow-auto w-full h-full',
backgroundBlur && `backdrop-blur${initialSettings.background.blur.length ? '-' : ""}${initialSettings.background.blur}`,
"fixed overflow-auto w-full h-full",
backgroundBlur &&
`backdrop-blur${initialSettings.background.blur.length ? "-" : ""}${initialSettings.background.blur}`,
backgroundSaturate && `backdrop-saturate-${initialSettings.background.saturate}`,
backgroundBrightness && `backdrop-brightness-${initialSettings.background.brightness}`,
)}>
backgroundBrightness && `backdrop-brightness-${initialSettings.background.brightness}`
)}
>
<Index initialSettings={initialSettings} fallback={fallback} />
</div>
</div>

45
src/utils/config/service-helpers.js
View File

@ -25,11 +25,12 @@ export async function servicesFromConfig() {
return [];
}
// map easy to write YAML objects into easy to consume JS arrays
const servicesArray = services.map((servicesGroup) => ({
name: Object.keys(servicesGroup)[0],
services: servicesGroup[Object.keys(servicesGroup)[0]].map((entries) => {
if (Array.isArray(entries[Object.keys(entries)[0]]))
return {
services: servicesGroup[Object.keys(servicesGroup)[0]].map((entries) =>
Array.isArray(entries[Object.keys(entries)[0]])
? {
name: Object.keys(entries)[0],
services: entries[Object.keys(entries)[0]].map((entry) => ({
name: Object.keys(entry)[0],
@ -37,23 +38,21 @@ export async function servicesFromConfig() {
type: "service",
})),
type: "grouped-service",
};
return {
}
: {
name: Object.keys(entries)[0],
...entries[Object.keys(entries)[0]],
type: "service",
};
}),
}
),
}));
// add default weight to services based on their position in the configuration
servicesArray.forEach((group, groupIndex) => {
group.services.forEach((service, serviceIndex) => {
if (!service.weight && service.type !== "grouped-service") {
servicesArray[groupIndex].services[serviceIndex].weight = (serviceIndex + 1) * 100;
}
if (!service.weight) servicesArray[groupIndex].services[serviceIndex].weight = (serviceIndex + 1) * 100;
if (service.type === "grouped-service") {
servicesArray[groupIndex].services[serviceIndex].weight = (serviceIndex + 1) * 100;
service.services.forEach((groupedService, groupedServiceIndex) => {
if (!groupedService.weight) {
servicesArray[groupIndex].services[serviceIndex].services[groupedServiceIndex].weight =
@ -297,11 +296,11 @@ export async function servicesFromKubernetes() {
}
}
export function cleanServiceGroups(groups) {
return groups.map((serviceGroup) => ({
name: serviceGroup.name,
services: serviceGroup.services.map((service) => {
const cleanedService = { ...service };
export function cleanService(service, serviceGroup) {
const cleanedService =
service.type === "grouped-service"
? { ...service, services: service.services.map((s) => cleanService(s, serviceGroup)) }
: { ...service };
if (cleanedService.showStats !== undefined) cleanedService.showStats = JSON.parse(cleanedService.showStats);
if (typeof service.weight === "string") {
const weight = parseInt(service.weight, 10);
@ -387,7 +386,12 @@ export function cleanServiceGroups(groups) {
}
return cleanedService;
}),
}
export function cleanServiceGroups(groups) {
return groups.map((serviceGroup) => ({
name: serviceGroup.name,
services: serviceGroup.services.map((service) => cleanService(service, serviceGroup)),
}));
}
@ -396,7 +400,10 @@ export async function getServiceItem(group, service) {
const serviceGroup = configuredServices.find((g) => g.name === group);
if (serviceGroup) {
const serviceEntry = serviceGroup.services.find((s) => s.name === service);
const serviceEntry = serviceGroup.services
.map((s) => (s.type === "grouped-service" ? s.services : s))
.flat(1)
.find((s) => s.name === service);
if (serviceEntry) return serviceEntry;
}

3356
yarn.lock Normal file
View File

File diff suppressed because it is too large Load Diff