Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commita8c2586

Browse files
authored
feat: implement UI for top level dynamic parameters diagnostics (#17394)
<img width="672" alt="Screenshot 2025-04-14 at 21 31 11"src="https://github.com/user-attachments/assets/5ca25c9d-e82e-4d52-8c43-91e4dc31117d"/>
1 parent3d787da commita8c2586

File tree

4 files changed

+55
-11
lines changed

4 files changed

+55
-11
lines changed

‎site/src/index.css

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@
3030
--surface-sky:20194%86%;
3131
--border-default:2406%90%;
3232
--border-success:14276%36%;
33+
--border-warning:30.66,97.16%,72.35%;
3334
--border-destructive:084%60%;
3435
--border-hover:240,5%,34%;
3536
--overlay-default:2405%84%/80%;
@@ -67,6 +68,7 @@
6768
--surface-sky:20480%16%;
6869
--border-default:2404%16%;
6970
--border-success:14276%36%;
71+
--border-warning:30.66,97.16%,72.35%;
7072
--border-destructive:091%71%;
7173
--border-hover:240,5%,34%;
7274
--overlay-default:24010%4%/80%;

‎site/src/modules/workspaces/DynamicParameter/DynamicParameter.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -247,10 +247,13 @@ const ParameterField: FC<ParameterFieldProps> = ({
247247
className="flex items-center space-x-2"
248248
>
249249
<RadioGroupItem
250-
id={option.value.value}
250+
id={`${id}-${option.value.value}`}
251251
value={option.value.value}
252252
/>
253-
<LabelhtmlFor={option.value.value}className="cursor-pointer">
253+
<Label
254+
htmlFor={`${id}-${option.value.value}`}
255+
className="cursor-pointer"
256+
>
254257
<OptionDisplayoption={option}/>
255258
</Label>
256259
</div>
@@ -350,15 +353,15 @@ const ParameterDiagnostics: FC<ParameterDiagnosticsProps> = ({
350353
<divclassName="flex flex-col gap-2">
351354
{diagnostics.map((diagnostic,index)=>(
352355
<div
353-
key={`diagnostic-${diagnostic.summary}-${index}`}
356+
key={`parameter-diagnostic-${diagnostic.summary}-${index}`}
354357
className={`text-xs px-1${
355358
diagnostic.severity==="error"
356359
?"text-content-destructive"
357360
:"text-content-warning"
358361
}`}
359362
>
360-
<divclassName="font-medium">{diagnostic.summary}</div>
361-
{diagnostic.detail&&<div>{diagnostic.detail}</div>}
363+
<pclassName="font-medium">{diagnostic.summary}</p>
364+
{diagnostic.detail&&<pclassName="m-0">{diagnostic.detail}</p>}
362365
</div>
363366
))}
364367
</div>

‎site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx

Lines changed: 44 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,5 @@
11
importtype*asTypesGenfrom"api/typesGenerated";
2-
importtype{
3-
DynamicParametersRequest,
4-
PreviewDiagnostics,
5-
PreviewParameter,
6-
}from"api/typesGenerated";
2+
importtype{PreviewDiagnostics,PreviewParameter}from"api/typesGenerated";
73
import{Alert}from"components/Alert/Alert";
84
import{ErrorAlert}from"components/Alert/ErrorAlert";
95
import{Avatar}from"components/Avatar/Avatar";
@@ -19,7 +15,7 @@ import { Switch } from "components/Switch/Switch";
1915
import{UserAutocomplete}from"components/UserAutocomplete/UserAutocomplete";
2016
import{typeFormikContextType,useFormik}from"formik";
2117
import{useDebouncedFunction}from"hooks/debounce";
22-
import{ArrowLeft}from"lucide-react";
18+
import{ArrowLeft,CircleAlert,TriangleAlert}from"lucide-react";
2319
import{
2420
DynamicParameter,
2521
getInitialParameterValues,
@@ -413,6 +409,7 @@ export const CreateWorkspacePageViewExperimental: FC<
413409
parameters cannot be modified once the workspace is created.
414410
</p>
415411
</hgroup>
412+
<Diagnosticsdiagnostics={diagnostics}/>
416413
{presets.length>0&&(
417414
<Stackdirection="column"spacing={2}>
418415
<divclassName="flex flex-col gap-2">
@@ -502,3 +499,44 @@ export const CreateWorkspacePageViewExperimental: FC<
502499
</>
503500
);
504501
};
502+
503+
interfaceDiagnosticsProps{
504+
diagnostics:PreviewParameter["diagnostics"];
505+
}
506+
507+
exportconstDiagnostics:FC<DiagnosticsProps>=({ diagnostics})=>{
508+
return(
509+
<divclassName="flex flex-col gap-4">
510+
{diagnostics.map((diagnostic,index)=>(
511+
<div
512+
key={`diagnostic-${diagnostic.summary}-${index}`}
513+
className={`text-xs flex flex-col rounded-md border px-4 pb-3 border-solid
514+
${
515+
diagnostic.severity==="error"
516+
?" text-content-destructive border-border-destructive"
517+
:" text-content-warning border-border-warning"
518+
}`}
519+
>
520+
<divclassName="flex items-center m-0">
521+
{diagnostic.severity==="error"&&(
522+
<CircleAlert
523+
className="me-2 -mt-0.5 inline-flex opacity-80"
524+
size={16}
525+
aria-hidden="true"
526+
/>
527+
)}
528+
{diagnostic.severity==="warning"&&(
529+
<TriangleAlert
530+
className="me-2 -mt-0.5 inline-flex opacity-80"
531+
size={16}
532+
aria-hidden="true"
533+
/>
534+
)}
535+
<pclassName="font-medium">{diagnostic.summary}</p>
536+
</div>
537+
{diagnostic.detail&&<pclassName="m-0 pb-0">{diagnostic.detail}</p>}
538+
</div>
539+
))}
540+
</div>
541+
);
542+
};

‎site/tailwind.config.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,7 @@ module.exports = {
5252
},
5353
border:{
5454
DEFAULT:"hsl(var(--border-default))",
55+
warning:"hsl(var(--border-warning))",
5556
destructive:"hsl(var(--border-destructive))",
5657
success:"hsl(var(--border-success))",
5758
hover:"hsl(var(--border-hover))",

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp