starred/yaak-mountain-loop
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-03-22 17:39:12 +01:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

Better status tags and delete request on key

Browse Source
This commit is contained in:
Gregory Schier
2023-04-04 12:36:30 -07:00
parent 7d154800a0
commit b3c461afdd
12 changed files with 125 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src-web/components/core/Editor/Editor.css
View File

@@ -183,19 +183,16 @@
@apply bg-highlight text-gray-900;
}
& > ul > li:hover {
@apply text-gray-800;
}
.cm-completionIcon {
@apply text-sm flex items-center pb-0.5 flex-shrink-0;
}
.cm-completionLabel {
@apply text-gray-700;
}
.cm-completionDetail {
@apply ml-auto pl-4;
@apply ml-auto pl-6;
}
}
}

23
src-web/components/core/StatusColor.tsx
View File

@@ -1,23 +0,0 @@
import classnames from 'classnames';
import type { ReactNode } from 'react';
interface Props {
statusCode: number;
children: ReactNode;
}
export function StatusColor({ statusCode, children }: Props) {
return (
<span
className={classnames(
statusCode >= 100 && statusCode < 200 && 'text-green-600',
statusCode >= 200 && statusCode < 300 && 'text-green-600',
statusCode >= 300 && statusCode < 400 && 'text-pink-600',
statusCode >= 400 && statusCode < 500 && 'text-orange-600',
statusCode >= 500 && statusCode < 600 && 'text-red-600',
)}
>
{children}
</span>
);
}

47
src-web/components/core/StatusTag.tsx Normal file
View File

@@ -0,0 +1,47 @@
import classnames from 'classnames';
import type { HttpResponse } from '../../lib/models';
interface Props {
response: Pick<HttpResponse, 'status' | 'error'>;
className?: string;
asBackground?: boolean;
}
export function StatusTag({ asBackground, response, className }: Props) {
const { status, error } = response;
const label = error ? 'ERR' : status;
if (asBackground) {
return (
<span
className={classnames(
className,
'text-white bg-opacity-90',
status >= 0 && status < 100 && 'bg-red-600',
status >= 100 && status < 200 && 'bg-yellow-600',
status >= 200 && status < 300 && 'bg-green-600',
status >= 300 && status < 400 && 'bg-pink-600',
status >= 400 && status < 500 && 'bg-orange-600',
status >= 500 && 'bg-red-600',
)}
>
{label}
</span>
);
} else {
return (
<span
className={classnames(
className,
status >= 0 && status < 100 && 'text-red-600',
status >= 100 && status < 200 && 'text-green-600',
status >= 200 && status < 300 && 'text-green-600',
status >= 300 && status < 400 && 'text-pink-600',
status >= 400 && status < 500 && 'text-orange-600',
status >= 500 && 'text-red-600',
)}
>
{label}
</span>
);
}
}