notnite.com
this repo has no description
moonbase: Add divider to extension updates (closes #145)
+16
-6
+4
packages/core-extensions/src/moonbase/style.css
+4
packages/core-extensions/src/moonbase/style.css
+12
-6
packages/core-extensions/src/moonbase/webpackModules/ui/extensions/index.tsx
+12
-6
packages/core-extensions/src/moonbase/webpackModules/ui/extensions/index.tsx
···
6
6
import React from "@moonlight-mod/wp/react";
7
7
import spacepack from "@moonlight-mod/wp/spacepack_spacepack";
8
8
import { useStateFromStoresObject } from "@moonlight-mod/wp/discord/packages/flux";
9
+
import * as Components from "@moonlight-mod/wp/discord/components/common/index";
9
10
10
11
import { MoonbaseSettingsStore } from "@moonlight-mod/wp/moonbase_stores";
11
12
import { ExtensionCompat } from "@moonlight-mod/core/extension/loader";
···
67
68
);
68
69
69
70
// Prioritize extensions with updates
70
-
filtered.sort((a, b) => {
71
-
if (a.hasUpdate && !b.hasUpdate) return -1;
72
-
if (!a.hasUpdate && b.hasUpdate) return 1;
73
-
return 0;
74
-
});
71
+
const filteredWithUpdates = filtered.filter((ext) => ext!.hasUpdate);
72
+
const filteredWithoutUpdates = filtered.filter((ext) => !ext!.hasUpdate);
73
+
const { FormDivider } = Components;
75
74
76
75
return (
77
76
<>
···
89
88
}}
90
89
/>
91
90
<FilterBar filter={filter} setFilter={setFilter} selectedTags={selectedTags} setSelectedTags={setSelectedTags} />
92
-
{filtered.map((ext) => (
91
+
92
+
{filteredWithUpdates.map((ext) => (
93
+
<ExtensionCard uniqueId={ext.uniqueId} key={ext.uniqueId} />
94
+
))}
95
+
{filteredWithUpdates.length > 0 && filteredWithoutUpdates.length > 0 && (
96
+
<FormDivider className="moonbase-update-divider" />
97
+
)}
98
+
{filteredWithoutUpdates.map((ext) => (
93
99
<ExtensionCard uniqueId={ext.uniqueId} key={ext.uniqueId} />
94
100
))}
95
101
</>