fix(ui): update search placeholder [EE-6667] (#11191)

* update search placeholder

* remove box selector description
pull/11207/head
Prabhat Khera 10 months ago committed by GitHub
parent 861ed662e2
commit a374157d6f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -6,7 +6,7 @@
<div class="searchBar vertical-center !mr-0"> <div class="searchBar vertical-center !mr-0">
<pr-icon icon="'search'" class="searchIcon"></pr-icon> <pr-icon icon="'search'" class="searchIcon"></pr-icon>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search for a chart..." auto-focus ng-model-options="{ debounce: 300 }" /> <input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus ng-model-options="{ debounce: 300 }" />
</div> </div>
<div class="w-1/5"> <div class="w-1/5">
<por-select <por-select

@ -34,7 +34,7 @@ class KubernetesDeployController {
{ ...git, value: KubernetesDeployBuildMethods.GIT }, { ...git, value: KubernetesDeployBuildMethods.GIT },
{ ...editor, value: KubernetesDeployBuildMethods.WEB_EDITOR }, { ...editor, value: KubernetesDeployBuildMethods.WEB_EDITOR },
{ ...url, value: KubernetesDeployBuildMethods.URL }, { ...url, value: KubernetesDeployBuildMethods.URL },
{ ...customTemplate, description: 'Use custom template', value: KubernetesDeployBuildMethods.CUSTOM_TEMPLATE }, { ...customTemplate, value: KubernetesDeployBuildMethods.CUSTOM_TEMPLATE },
{ ...helm, value: KubernetesDeployBuildMethods.HELM }, { ...helm, value: KubernetesDeployBuildMethods.HELM },
]; ];

@ -10,7 +10,6 @@ export const editor: BoxSelectorOption<'editor'> = {
icon: Edit, icon: Edit,
iconType: 'badge', iconType: 'badge',
label: 'Web editor', label: 'Web editor',
description: 'Use our Web editor',
value: 'editor', value: 'editor',
}; };
@ -19,7 +18,6 @@ export const upload: BoxSelectorOption<'upload'> = {
icon: UploadCloud, icon: UploadCloud,
iconType: 'badge', iconType: 'badge',
label: 'Upload', label: 'Upload',
description: 'Upload from your computer',
value: 'upload', value: 'upload',
}; };
@ -28,7 +26,6 @@ export const git: BoxSelectorOption<'repository'> = {
icon: GitIcon, icon: GitIcon,
iconType: 'logo', iconType: 'logo',
label: 'Repository', label: 'Repository',
description: 'Use a git repository',
value: 'repository', value: 'repository',
}; };
@ -46,7 +43,6 @@ export const customTemplate: BoxSelectorOption<'template'> = {
icon: FileText, icon: FileText,
iconType: 'badge', iconType: 'badge',
label: 'Custom template', label: 'Custom template',
description: 'Use a custom template',
value: 'template', value: 'template',
}; };
@ -54,7 +50,6 @@ export const helm: BoxSelectorOption<'helm'> = {
id: 'method_helm', id: 'method_helm',
icon: Helm, icon: Helm,
label: 'Helm chart', label: 'Helm chart',
description: 'Use a Helm chart',
value: 'helm', value: 'helm',
iconClass: '!text-[#0f1689] th-dark:!text-white th-highcontrast:!text-white', iconClass: '!text-[#0f1689] th-dark:!text-white th-highcontrast:!text-white',
}; };
@ -64,6 +59,5 @@ export const url: BoxSelectorOption<'url'> = {
icon: Globe, icon: Globe,
iconType: 'badge', iconType: 'badge',
label: 'URL', label: 'URL',
description: 'Specify a URL to a file',
value: 'url', value: 'url',
}; };

@ -2,6 +2,7 @@ import { useMemo, useEffect } from 'react';
import { useCurrentUser } from '@/react/hooks/useUser'; import { useCurrentUser } from '@/react/hooks/useUser';
import helm from '@/assets/ico/vendor/helm.svg?c'; import helm from '@/assets/ico/vendor/helm.svg?c';
import { isPureAdmin } from '@/portainer/users/user.helpers';
import { Link } from '@@/Link'; import { Link } from '@@/Link';
import { Datatable } from '@@/datatables'; import { Datatable } from '@@/datatables';
@ -22,6 +23,8 @@ export function HelmRepositoryDatatable() {
const { user } = useCurrentUser(); const { user } = useCurrentUser();
const helmReposQuery = useHelmRepositories(user.Id); const helmReposQuery = useHelmRepositories(user.Id);
const isAdminUser = isPureAdmin(user);
const tableState = useTableState(settingsStore, storageKey); const tableState = useTableState(settingsStore, storageKey);
const helmRepos = useMemo(() => { const helmRepos = useMemo(() => {
@ -58,7 +61,7 @@ export function HelmRepositoryDatatable() {
<Datatable <Datatable
getRowId={(row) => String(row.Id)} getRowId={(row) => String(row.Id)}
dataset={helmRepos} dataset={helmRepos}
description={<HelmDatatableDescription />} description={<HelmDatatableDescription isAdmin={isAdminUser} />}
settingsManager={tableState} settingsManager={tableState}
columns={columns} columns={columns}
title="Helm repositories" title="Helm repositories"
@ -74,15 +77,19 @@ export function HelmRepositoryDatatable() {
); );
} }
function HelmDatatableDescription() { function HelmDatatableDescription({ isAdmin }: { isAdmin: boolean }) {
return ( return (
<TextTip color="blue" className="mb-3"> <TextTip color="blue" className="mb-3">
Adding a Helm repo here only makes it available in your own user Adding a Helm repo here only makes it available in your own user
account&apos;s Portainer UI. Helm charts are pulled down from these repos account&apos;s Portainer UI. Helm charts are pulled down from these repos
(plus the{' '} (plus the{' '}
{isAdmin ? (
<Link to="portainer.settings" params={{ '#': 'kubernetes-settings' }}> <Link to="portainer.settings" params={{ '#': 'kubernetes-settings' }}>
<span>globally-set Helm repo</span> <span>globally-set Helm repo</span>
</Link> </Link>
) : (
<span>globally-set Helm repo</span>
)}
) and shown in the Create from Manifest screen&apos;s Helm charts list. ) and shown in the Create from Manifest screen&apos;s Helm charts list.
</TextTip> </TextTip>
); );

Loading…
Cancel
Save