Skip to content

Commit

Permalink
Merge pull request #2572 from headlamp-k8s/plugin-name-formats
Browse files Browse the repository at this point in the history 
frontend: PluginSettings: Use author for plugin origin
  • Loading branch information
@illume
illume authored Nov 22, 2024
2 parents 8ff79cf + 97131b9 commit e50133c
Show file tree
Hide file tree
Showing 112 changed files with 520 additions and 251 deletions.
2 changes: 1 addition & 1 deletion e2e-tests/tests/pluginSetting.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ test('plugin settings page should have a table', async ({ page }) => {

test('pod counter plugin should have setting option', async ({ page }) => {
const headlampPage = new HeadlampPage(page);
const pluginName = '@kinvolk/headlamp-pod-counter';
const pluginName = 'headlamp-pod-counter';

await headlampPage.authenticate();
await headlampPage.navigateTopage('/settings/plugins', /Plugin/);
Expand Down
23 changes: 19 additions & 4 deletions frontend/src/components/App/PluginSettings/PluginSettings.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,8 +100,23 @@ export function PluginSettingsPure(props: PluginSettingsPureProps) {
/** enableSave state enables the save button when changes are made to the plugin list */
const [enableSave, setEnableSave] = useState(false);

/** pluginChanges state is the array of plugin data and any current changes made by the user to a plugin's "Enable" field via toggler */
const [pluginChanges, setPluginChanges] = useState(() => pluginArr.map((p: any) => p));
/**
* pluginChanges state is the array of plugin data and any current changes made by the user to a plugin's "Enable" field via toggler.
* The name and origin fields are split for consistency.
*/
const [pluginChanges, setPluginChanges] = useState(() =>
pluginArr.map((plugin: PluginInfo) => {
const [author, name] = plugin.name.includes('@')
? plugin.name.split(/\/(.+)/)
: [null, plugin.name];

return {
...plugin,
displayName: name ?? plugin.name,
origin: plugin.origin ?? author?.substring(1) ?? t('translation|Unknown'),
};
})
);

/**
* useEffect to control the rendering of the save button.
Expand Down Expand Up @@ -186,7 +201,7 @@ export function PluginSettingsPure(props: PluginSettingsPureProps) {
params={{ name: plugin.name }}
align="right"
>
{plugin.name}
{plugin.displayName}
</HeadlampLink>
</Typography>
<Typography variant="caption">{plugin.version}</Typography>
Expand All @@ -204,7 +219,7 @@ export function PluginSettingsPure(props: PluginSettingsPureProps) {
const url = plugin?.homepage || plugin?.repository?.url;
return plugin?.origin ? (
url ? (
<Link href={url}>{plugin?.origin}</Link>
<Link href={url}>{plugin.origin}</Link>
) : (
plugin?.origin
)
Expand Down
10 changes: 9 additions & 1 deletion frontend/src/components/App/PluginSettings/PluginSettingsDetails.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,9 @@ export function PluginSettingsDetailsPure(props: PluginSettingsDetailsPureProps)
const [enableSaveButton, setEnableSaveButton] = useState(false);
const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
const history = useHistory();
const [author, name] = plugin.name.includes('@')
? plugin.name.substring(1).split(/\/(.+)/)
: [null, plugin.name];

useEffect(() => {
if (!_.isEqual(config, data)) {
Expand Down Expand Up @@ -156,7 +159,12 @@ export function PluginSettingsDetailsPure(props: PluginSettingsDetailsPureProps)

return (
<>
<SectionBox aria-live="polite" title={plugin.name} backLink={'/settings/plugins'}>
<SectionBox
aria-live="polite"
title={name}
subtitle={author ? `${t('translation|By')}: ${author}` : undefined}
backLink={'/settings/plugins'}
>
{plugin.description}
<ScrollableBox style={{ height: '70vh' }} py={0}>
<ConfirmDialog
Expand Down
37 changes: 31 additions & 6 deletions ...nents/App/PluginSettings/__snapshots__/PluginSettings.DefaultSaveEnable.stories.storyshot
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
>
<div
class="MuiBox-root css-70qvj9"
class="MuiBox-root css-15xsm7k"
>
<h1
class="MuiTypography-root MuiTypography-h1 MuiTypography-noWrap css-yeaech-MuiTypography-root"
Expand Down Expand Up @@ -488,7 +488,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-0"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -529,7 +534,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-1"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -570,7 +580,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-2"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -611,7 +626,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-3"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -652,7 +672,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-4"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down
2 changes: 1 addition & 1 deletion ...nd/src/components/App/PluginSettings/__snapshots__/PluginSettings.Empty.stories.storyshot
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
>
<div
class="MuiBox-root css-70qvj9"
class="MuiBox-root css-15xsm7k"
>
<h1
class="MuiTypography-root MuiTypography-h1 MuiTypography-noWrap css-yeaech-MuiTypography-root"
Expand Down
37 changes: 31 additions & 6 deletions ...ents/App/PluginSettings/__snapshots__/PluginSettings.EmptyHomepageItems.stories.storyshot
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
>
<div
class="MuiBox-root css-70qvj9"
class="MuiBox-root css-15xsm7k"
>
<h1
class="MuiTypography-root MuiTypography-h1 MuiTypography-noWrap css-yeaech-MuiTypography-root"
Expand Down Expand Up @@ -488,7 +488,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-0"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -529,7 +534,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-1"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -570,7 +580,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-2"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -611,7 +626,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-3"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -652,7 +672,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-4"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down
37 changes: 31 additions & 6 deletions ...src/components/App/PluginSettings/__snapshots__/PluginSettings.FewItems.stories.storyshot
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
>
<div
class="MuiBox-root css-70qvj9"
class="MuiBox-root css-15xsm7k"
>
<h1
class="MuiTypography-root MuiTypography-h1 MuiTypography-noWrap css-yeaech-MuiTypography-root"
Expand Down Expand Up @@ -488,7 +488,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-0"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -529,7 +534,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-1"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -570,7 +580,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-2"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -611,7 +626,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-3"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down Expand Up @@ -652,7 +672,12 @@
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-ac5fut-MuiTableCell-root"
data-index="2"
>
Unknown
<a
class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineHover css-srrjpp-MuiTypography-root-MuiLink-root"
href="https://example.com/plugin-link-4"
>
Unknown
</a>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignLeft MuiTableCell-sizeMedium css-14fks5x-MuiTableCell-root"
Expand Down
Loading

0 comments on commit e50133c

Please sign in to comment.