Skip to content

Commit 803cefa

Browse files
alrocaralrocar
authored
add tooltip (#33)
* add tooltip * update tests * update favicon * default dates * update favicon * update favicon * reduce date ranges * update search
1 parent d6d1e88 commit 803cefa

File tree

13 files changed

+382
-18538
lines changed

13 files changed

+382
-18538
lines changed

‎dashboard/log-analyzer/package-lock.json‎

Lines changed: 205 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dashboard/log-analyzer/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@
1717
"@radix-ui/react-select": "^2.1.5",
1818
"@radix-ui/react-separator": "^1.1.1",
1919
"@radix-ui/react-slot": "^1.1.1",
20+
"@radix-ui/react-tooltip": "^1.1.8",
2021
"@tinybirdco/charts": "^0.2.4",
2122
"class-variance-authority": "^0.7.1",
2223
"clsx": "^2.1.1",

‎dashboard/log-analyzer/src/app/favicon.ico‎

-10.3 KB
Binary file not shown.

‎dashboard/log-analyzer/src/app/globals.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -159,7 +159,7 @@
159159
::placeholder {
160160
font-family: inherit !important;
161161
font-size: inherit !important;
162-
font-weight: inherit !important;
162+
font-weight: normal !important;
163163
color: var(--text-primary) !important;
164164
}
165165

‎dashboard/log-analyzer/src/app/layout.tsx‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
import type { Metadata } from "next";
22
import "./globals.css";
3+
import { TooltipProvider } from "@/components/ui/tooltip";
34

45
export const metadata: Metadata = {
5-
title: "Log Analyzer",
6-
description: "A dashboard for analyzing logs",
6+
title: "Log Analytics",
7+
description: "Custom real-time log analytics with Tinybird",
8+
icons: {
9+
icon: '/favicon.ico'
10+
},
711
};
812

913
export default function RootLayout({
@@ -14,7 +18,9 @@ export default function RootLayout({
1418
return (
1519
<html lang="en">
1620
<body>
17-
{children}
21+
<TooltipProvider>
22+
{children}
23+
</TooltipProvider>
1824
</body>
1925
</html>
2026
);

‎dashboard/log-analyzer/src/components/filters/DateRangeSelector.tsx‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -21,9 +21,6 @@ export function DateRangeSelector() {
2121
let startDate: Date;
2222

2323
switch (value) {
24-
case '30m':
25-
startDate = new Date(now.getTime() - 30 * 60 * 1000);
26-
break;
2724
case '1h':
2825
startDate = new Date(now.getTime() - 60 * 60 * 1000);
2926
break;
@@ -59,8 +56,6 @@ export function DateRangeSelector() {
5956
<SelectValue placeholder="Time Range" />
6057
</SelectTrigger>
6158
<SelectContent>
62-
<SelectItem value="5m" className="hover:bg-[var(--background-hover)]">Last 5 minutes</SelectItem>
63-
<SelectItem value="30m" className="hover:bg-[var(--background-hover)]">Last 30 minutes</SelectItem>
6459
<SelectItem value="1h" className="hover:bg-[var(--background-hover)]">Last 1 hour</SelectItem>
6560
<SelectItem value="24h" className="hover:bg-[var(--background-hover)]">Last 24 hours</SelectItem>
6661
<SelectItem value="3d" className="hover:bg-[var(--background-hover)]">Last 3 days</SelectItem>

‎dashboard/log-analyzer/src/components/filters/SearchBar.tsx‎

Lines changed: 37 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { useRouter, useSearchParams, usePathname } from "next/navigation";
66
import { Button } from "@/components/ui/button";
77
import { useState, useEffect } from "react";
88
import { getTotalRowCount } from "@/lib/utils";
9-
9+
import { TooltipProvider, TooltipRoot, TooltipTrigger, TooltipContent } from "@/components/ui/tooltip";
1010
export function SearchBar() {
1111
const router = useRouter();
1212
const pathname = usePathname();
@@ -63,27 +63,41 @@ export function SearchBar() {
6363
};
6464

6565
return (
66-
<div className="relative flex-1">
67-
<Search className="absolute left-3 top-3 h-4 w-4 text-[var(--button-text)]" />
68-
<Input
69-
placeholder={isDisabled ? "Narrow the filter to enable search" : "Search... (e.g. Internal.*Memory|Internal.*Timeout)"}
70-
className="h-10 pl-9 pr-9 border-[var(--border-gray)]"
71-
value={inputValue}
72-
onChange={(e) => setInputValue(e.target.value)}
73-
onKeyDown={handleKeyDown}
74-
disabled={isDisabled}
75-
/>
76-
{inputValue && (
77-
<Button
78-
variant="ghost"
79-
size="icon"
80-
className="absolute right-1.5 top-1.5 h-7 w-7 rounded-full hover:bg-muted"
81-
onClick={handleClear}
82-
disabled={isDisabled}
83-
>
84-
<X className="h-4 w-4" />
85-
</Button>
86-
)}
87-
</div>
66+
<TooltipProvider delayDuration={0}>
67+
<TooltipRoot>
68+
<TooltipTrigger asChild>
69+
<div className="relative flex-1">
70+
<Search className="absolute left-3 top-3 h-4 w-4 text-[var(--button-text)]" />
71+
<Input
72+
placeholder={isDisabled ? "Narrow the filters to enable search" : "Search... "}
73+
className="h-10 pl-9 pr-9 border-[var(--border-gray)] font-semibold"
74+
value={inputValue}
75+
onChange={(e) => setInputValue(e.target.value)}
76+
onKeyDown={handleKeyDown}
77+
disabled={isDisabled}
78+
/>
79+
{inputValue && (
80+
<Button
81+
variant="ghost"
82+
size="icon"
83+
className="absolute right-1.5 top-1.5 h-7 w-7 rounded-full hover:bg-muted"
84+
onClick={handleClear}
85+
disabled={isDisabled}
86+
>
87+
<X className="h-4 w-4" />
88+
</Button>
89+
)}
90+
</div>
91+
</TooltipTrigger>
92+
<TooltipContent side="bottom" align="start" className="mt-2">
93+
{isDisabled ? (
94+
<p>Filter by Environment and Service and one day of data.
95+
</p>
96+
) : (
97+
<p>Use text or regular expressions: Internal.*Memory|Internal.*Timeout</p>
98+
)}
99+
</TooltipContent>
100+
</TooltipRoot>
101+
</TooltipProvider>
88102
);
89103
}

0 commit comments

Comments
 (0)