mirror of
https://github.com/awatertrevi/infisical.git
synced 2026-10-21 09:28:14 +00:00
feat: upgraded to tw v4
This commit is contained in:
@@ -81,7 +81,7 @@ export const LogsDateFilter = ({ setFilter, filter, timezone, setTimezone }: Pro
|
||||
"w-[3.82rem] rounded-none px-3 py-2 font-normal first:rounded-l-md",
|
||||
filter.type === AuditLogDateFilterType.Relative &&
|
||||
filter.relativeModeValue === el &&
|
||||
"border-primary/40 bg-primary/[0.1]"
|
||||
"border-primary/40 bg-primary/10"
|
||||
)}
|
||||
key={`${el}-relative`}
|
||||
onClick={() =>
|
||||
@@ -122,9 +122,9 @@ export const LogsDateFilter = ({ setFilter, filter, timezone, setTimezone }: Pro
|
||||
<Button
|
||||
variant="outline_bg"
|
||||
className={twMerge(
|
||||
"w-[8rem] rounded-none rounded-r-md px-3 py-2 font-normal",
|
||||
"w-32 rounded-none rounded-r-md px-3 py-2 font-normal",
|
||||
(filter.type === AuditLogDateFilterType.Absolute || isCustomRelative) &&
|
||||
"border-primary/40 bg-primary/[0.1]"
|
||||
"border-primary/40 bg-primary/10"
|
||||
)}
|
||||
>
|
||||
<span>Custom</span> <FontAwesomeIcon className="ml-1" icon={faCalendar} />
|
||||
@@ -135,7 +135,7 @@ export const LogsDateFilter = ({ setFilter, filter, timezone, setTimezone }: Pro
|
||||
</DropdownMenuTrigger>
|
||||
</div>
|
||||
<DropdownMenuContent
|
||||
className="!min-w-[434px] bg-mineshaft-800 p-4"
|
||||
className="min-w-[434px]! bg-mineshaft-800 p-4"
|
||||
align="end"
|
||||
sideOffset={8}
|
||||
>
|
||||
@@ -151,7 +151,7 @@ export const LogsDateFilter = ({ setFilter, filter, timezone, setTimezone }: Pro
|
||||
className={twMerge(
|
||||
"h-8 rounded-r-none font-normal",
|
||||
field.value === AuditLogDateFilterType.Absolute &&
|
||||
"border-primary/40 bg-primary/[0.1]"
|
||||
"border-primary/40 bg-primary/10"
|
||||
)}
|
||||
>
|
||||
Absolute
|
||||
@@ -162,7 +162,7 @@ export const LogsDateFilter = ({ setFilter, filter, timezone, setTimezone }: Pro
|
||||
className={twMerge(
|
||||
"h-8 rounded-l-none font-normal",
|
||||
field.value === AuditLogDateFilterType.Relative &&
|
||||
"border-primary/40 bg-primary/[0.1]"
|
||||
"border-primary/40 bg-primary/10"
|
||||
)}
|
||||
>
|
||||
Relative
|
||||
@@ -191,7 +191,7 @@ export const LogsDateFilter = ({ setFilter, filter, timezone, setTimezone }: Pro
|
||||
onClick={() => field.onChange(value)}
|
||||
className={twMerge(
|
||||
"h-8 w-12",
|
||||
field.value === value && "border-primary/40 bg-primary/[0.1]"
|
||||
field.value === value && "border-primary/40 bg-primary/10"
|
||||
)}
|
||||
>
|
||||
{v}
|
||||
@@ -234,7 +234,7 @@ export const LogsDateFilter = ({ setFilter, filter, timezone, setTimezone }: Pro
|
||||
</FormControl>
|
||||
</div>
|
||||
{error && (
|
||||
<span className="text-xs text-red-600 text-opacity-90">
|
||||
<span className="text-opacity-90 text-xs text-red-600">
|
||||
{error.message}
|
||||
</span>
|
||||
)}
|
||||
@@ -324,7 +324,7 @@ export const LogsDateFilter = ({ setFilter, filter, timezone, setTimezone }: Pro
|
||||
<Select
|
||||
value={timezone}
|
||||
onValueChange={(val) => setTimezone(val as Timezone)}
|
||||
className="w-[10.6rem] border !border-mineshaft-500 !bg-mineshaft-600 capitalize"
|
||||
className="w-[10.6rem] border border-mineshaft-500! bg-mineshaft-600! capitalize"
|
||||
dropdownContainerClassName="max-w-none"
|
||||
position="popper"
|
||||
dropdownContainerStyle={{
|
||||
|
||||
@@ -124,7 +124,7 @@ export const LogsFilter = ({ presets, setFilter, filter, project }: Props) => {
|
||||
<Button variant="outline_bg" colorSchema="primary" className="relative">
|
||||
<FontAwesomeIcon icon={faFilterCircleXmark} />
|
||||
{activeFilterCount > 0 && (
|
||||
<Badge className="absolute bottom-0 right-0" variant="primary">
|
||||
<Badge className="absolute right-0 bottom-0" variant="primary">
|
||||
{activeFilterCount}
|
||||
</Badge>
|
||||
)}
|
||||
@@ -175,7 +175,7 @@ export const LogsFilter = ({ presets, setFilter, filter, project }: Props) => {
|
||||
<FormControl>
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<div className="thin-scrollbar inline-flex w-full cursor-pointer items-center justify-between whitespace-nowrap rounded-md border border-mineshaft-500 bg-mineshaft-700 px-3 py-2 font-inter text-sm font-normal text-bunker-200 outline-none data-[placeholder]:text-mineshaft-200">
|
||||
<div className="inline-flex thin-scrollbar w-full cursor-pointer items-center justify-between rounded-md border border-mineshaft-500 bg-mineshaft-700 px-3 py-2 font-inter text-sm font-normal whitespace-nowrap text-bunker-200 outline-hidden data-placeholder:text-mineshaft-200">
|
||||
{selectedEventTypes?.length === 1
|
||||
? filteredEventTypes.find(
|
||||
(eventType) => eventType.value === selectedEventTypes[0]
|
||||
@@ -189,7 +189,7 @@ export const LogsFilter = ({ presets, setFilter, filter, project }: Props) => {
|
||||
<DropdownMenuContent
|
||||
align="end"
|
||||
sideOffset={2}
|
||||
className="thin-scrollbar z-[100] max-h-80 overflow-hidden"
|
||||
className="z-100 max-h-80 thin-scrollbar overflow-hidden"
|
||||
>
|
||||
<div className="max-h-80 overflow-y-auto">
|
||||
{filteredEventTypes.length > 0 ? (
|
||||
@@ -337,9 +337,9 @@ export const LogsFilter = ({ presets, setFilter, filter, project }: Props) => {
|
||||
exit={{ opacity: 0, height: 0 }}
|
||||
transition={{ duration: 0.3 }}
|
||||
>
|
||||
<div className="mb-3 mt-2">
|
||||
<div className="mt-2 mb-3">
|
||||
<p className="text-xs opacity-60">Secrets</p>
|
||||
<div className="h-[1px] w-full rounded-full bg-mineshaft-500" />
|
||||
<div className="h-px w-full rounded-full bg-mineshaft-500" />
|
||||
</div>
|
||||
<LogFilterItem
|
||||
label="Environment"
|
||||
|
||||
@@ -77,13 +77,13 @@ const LogsSectionComponent = ({
|
||||
<div className="mb-4 flex flex-wrap items-center justify-between gap-y-2">
|
||||
<div>
|
||||
<div className="flex items-center gap-1 whitespace-nowrap">
|
||||
<p className="text-xl font-semibold text-mineshaft-100">Audit History</p>
|
||||
<p className="text-xl font-medium text-mineshaft-100">Audit History</p>
|
||||
<a
|
||||
href="https://infisical.com/docs/documentation/platform/audit-logs"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<div className="ml-1 mt-[0.1rem] inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
|
||||
<div className="mt-[0.1rem] ml-1 inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
|
||||
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
|
||||
<span>Docs</span>
|
||||
<FontAwesomeIcon
|
||||
|
||||
@@ -22,7 +22,7 @@ const Tag = ({ label, value }: TagProps) => {
|
||||
|
||||
return (
|
||||
<div className="flex items-center space-x-1.5">
|
||||
<div className="rounded bg-mineshaft-600 p-0.5 pl-1 font-mono">{label}:</div>
|
||||
<div className="rounded-sm bg-mineshaft-600 p-0.5 pl-1 font-mono">{label}:</div>
|
||||
<div>{value}</div>
|
||||
</div>
|
||||
);
|
||||
@@ -34,7 +34,7 @@ export const LogsTableRow = ({ auditLog, rowNumber, timezone }: Props) => {
|
||||
return (
|
||||
<>
|
||||
<Tr
|
||||
className="h-10 cursor-pointer border-x-0 border-b border-t-0 hover:bg-mineshaft-700"
|
||||
className="h-10 cursor-pointer border-x-0 border-t-0 border-b hover:bg-mineshaft-700"
|
||||
role="button"
|
||||
tabIndex={0}
|
||||
onClick={() => setIsOpen.toggle()}
|
||||
@@ -62,9 +62,9 @@ export const LogsTableRow = ({ auditLog, rowNumber, timezone }: Props) => {
|
||||
</Td>
|
||||
</Tr>
|
||||
{isOpen && (
|
||||
<Tr className={`log-${auditLog.id} h-10 border-x-0 border-b border-t-0`}>
|
||||
<Tr className={`log-${auditLog.id} h-10 border-x-0 border-t-0 border-b`}>
|
||||
<Td colSpan={3} className="px-3 py-2">
|
||||
<div className="thin-scrollbar my-1 max-h-96 overflow-auto whitespace-pre-wrap rounded border border-mineshaft-600 bg-bunker-800 p-2 font-mono leading-6">
|
||||
<div className="my-1 max-h-96 thin-scrollbar overflow-auto rounded-sm border border-mineshaft-600 bg-bunker-800 p-2 font-mono leading-6 whitespace-pre-wrap">
|
||||
{JSON.stringify(auditLog, null, 4)}
|
||||
</div>
|
||||
</Td>
|
||||
|
||||
Reference in New Issue
Block a user