mirror of
https://github.com/lone-cloud/gerbil
synced 2026-06-03 19:54:44 -07:00
better UX to enable/disable button than hide/show it based on state values
This commit is contained in:
parent
ea777fed39
commit
ecdd47af36
1 changed files with 13 additions and 4 deletions
|
|
@ -37,7 +37,7 @@ export const ModelFileField = ({
|
||||||
const [analysisError, setAnalysisError] = useState<string>();
|
const [analysisError, setAnalysisError] = useState<string>();
|
||||||
|
|
||||||
const getHelperText = () => {
|
const getHelperText = () => {
|
||||||
if (!value.trim()) return undefined;
|
if (validationState === 'neutral') return undefined;
|
||||||
|
|
||||||
if (validationState === 'invalid') {
|
if (validationState === 'invalid') {
|
||||||
return 'Enter a valid URL or file path';
|
return 'Enter a valid URL or file path';
|
||||||
|
|
@ -47,7 +47,7 @@ export const ModelFileField = ({
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleAnalyzeModel = async () => {
|
const handleAnalyzeModel = async () => {
|
||||||
if (!value.trim()) return;
|
if (validationState === 'neutral' || validationState === 'invalid') return;
|
||||||
|
|
||||||
setAnalysisModalOpened(true);
|
setAnalysisModalOpened(true);
|
||||||
setAnalysisLoading(true);
|
setAnalysisLoading(true);
|
||||||
|
|
@ -97,13 +97,22 @@ export const ModelFileField = ({
|
||||||
</ActionIcon>
|
</ActionIcon>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
)}
|
)}
|
||||||
{showAnalyze && value.trim() && validationState !== 'invalid' && (
|
{showAnalyze && (
|
||||||
<Tooltip label="Analyze model">
|
<Tooltip
|
||||||
|
label={
|
||||||
|
validationState === 'neutral' || validationState === 'invalid'
|
||||||
|
? 'Enter a valid model path'
|
||||||
|
: 'Analyze model'
|
||||||
|
}
|
||||||
|
>
|
||||||
<ActionIcon
|
<ActionIcon
|
||||||
onClick={handleAnalyzeModel}
|
onClick={handleAnalyzeModel}
|
||||||
variant="light"
|
variant="light"
|
||||||
color="blue"
|
color="blue"
|
||||||
size="lg"
|
size="lg"
|
||||||
|
disabled={
|
||||||
|
validationState === 'neutral' || validationState === 'invalid'
|
||||||
|
}
|
||||||
>
|
>
|
||||||
<Info size={16} />
|
<Info size={16} />
|
||||||
</ActionIcon>
|
</ActionIcon>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue