- Live Log
+
+ Live Log
+
Real-time updates of short URL visits.
@@ -161,7 +163,9 @@ export default function LiveLog({ admin }: { admin: boolean }) {
variant={"outline"}
size="sm"
className={`ml-auto gap-2 transition-colors hover:border-blue-600 hover:text-blue-600 ${
- isLive ? "border-blue-600 text-blue-500" : ""
+ isLive
+ ? "animate-pulse border-dashed border-blue-600 text-blue-500"
+ : ""
}`}
>
{isLive ? "Stop" : "Live"}
@@ -171,7 +175,7 @@ export default function LiveLog({ admin }: { admin: boolean }) {
variant={"outline"}
size="sm"
onClick={() => handleRefresh()}
- disabled={isLoading}
+ disabled={!isLive}
>
{isLoading ? (
@@ -190,17 +194,17 @@ export default function LiveLog({ admin }: { admin: boolean }) {
}`}
disabled={logs.length === 0}
>
-
+
-
+ 0 ? " pb-6" : "")}>
{error ? (
{error.message}
) : logs.length === 0 && !newLogs ? (
-
+ //
+ <>
) : (
- // <>
@@ -213,7 +217,7 @@ export default function LiveLog({ admin }: { admin: boolean }) {
Clicks
-
+
{logs.map((log, index) => (
diff --git a/app/(protected)/dashboard/urls/url-list.tsx b/app/(protected)/dashboard/urls/url-list.tsx
index e1a4e00..ced7d36 100644
--- a/app/(protected)/dashboard/urls/url-list.tsx
+++ b/app/(protected)/dashboard/urls/url-list.tsx
@@ -23,6 +23,7 @@ import {
CardHeader,
CardTitle,
} from "@/components/ui/card";
+import { Input } from "@/components/ui/input";
import { Skeleton } from "@/components/ui/skeleton";
import {
Table,
@@ -49,7 +50,7 @@ import { PaginationWrapper } from "@/components/shared/pagination";
import UserUrlMetaInfo from "./meta";
export interface UrlListProps {
- user: Pick;
+ user: Pick;
action: string;
}
@@ -91,17 +92,29 @@ export default function UserUrlsList({ user, action }: UrlListProps) {
const [pageSize, setPageSize] = useState(10);
const [isShowStats, setShowStats] = useState(false);
const [selectedUrlId, setSelectedUrlId] = useState("");
+ const [searchParams, setSearchParams] = useState({
+ slug: "",
+ target: "",
+ userName: "",
+ });
const { mutate } = useSWRConfig();
const { data, error, isLoading } = useSWR<{
total: number;
list: ShortUrlFormData[];
- }>(`${action}?page=${currentPage}&size=${pageSize}`, fetcher, {
- revalidateOnFocus: false,
- });
+ }>(
+ `${action}?page=${currentPage}&size=${pageSize}&slug=${searchParams.slug}&userName=${searchParams.userName}&target=${searchParams.target}`,
+ fetcher,
+ {
+ revalidateOnFocus: false,
+ },
+ );
const handleRefresh = () => {
- mutate(`${action}?page=${currentPage}&size=${pageSize}`, undefined);
+ mutate(
+ `${action}?page=${currentPage}&size=${pageSize}&slug=${searchParams.slug}&userName=${searchParams.userName}&target=${searchParams.target}`,
+ undefined,
+ );
};
return (
@@ -148,6 +161,41 @@ export default function UserUrlsList({ user, action }: UrlListProps) {
+
+ {
+ setSearchParams({
+ ...searchParams,
+ slug: e.target.value,
+ });
+ }}
+ />
+ {
+ setSearchParams({
+ ...searchParams,
+ target: e.target.value,
+ });
+ }}
+ />
+ {user.role === "ADMIN" && (
+ {
+ setSearchParams({
+ ...searchParams,
+ userName: e.target.value,
+ });
+ }}
+ />
+ )}
+
{isShowForm && (
+
+
) : data && data.list && data.list.length ? (
data.list.map((short) => (
diff --git a/app/api/url/admin/route.ts b/app/api/url/admin/route.ts
index e23ae2c..7e26960 100644
--- a/app/api/url/admin/route.ts
+++ b/app/api/url/admin/route.ts
@@ -17,16 +17,24 @@ export async function GET(req: Request) {
const url = new URL(req.url);
const page = url.searchParams.get("page");
const size = url.searchParams.get("size");
+ const userName = url.searchParams.get("userName") || "";
+ const slug = url.searchParams.get("slug") || "";
+ const target = url.searchParams.get("target") || "";
const data = await getUserShortUrls(
user.id,
1,
Number(page || "1"),
Number(size || "10"),
"ADMIN",
+ userName,
+ slug,
+ target,
);
return Response.json(data);
} catch (error) {
+ console.log(error);
+
return Response.json(error?.statusText || error, {
status: error.status || 500,
statusText: error.statusText || "Server error",
diff --git a/app/api/url/route.ts b/app/api/url/route.ts
index a595e99..3dc2408 100644
--- a/app/api/url/route.ts
+++ b/app/api/url/route.ts
@@ -11,11 +11,18 @@ export async function GET(req: Request) {
const url = new URL(req.url);
const page = url.searchParams.get("page");
const size = url.searchParams.get("size");
+ const userName = url.searchParams.get("userName") || "";
+ const slug = url.searchParams.get("slug") || "";
+ const target = url.searchParams.get("target") || "";
const data = await getUserShortUrls(
user.id,
1,
Number(page || "1"),
Number(size || "10"),
+ "USER",
+ userName,
+ slug,
+ target,
);
return Response.json(data);
diff --git a/components/shared/icons.tsx b/components/shared/icons.tsx
index 89d0763..a73f37d 100644
--- a/components/shared/icons.tsx
+++ b/components/shared/icons.tsx
@@ -33,6 +33,7 @@ import {
Moon,
MoreVertical,
Package,
+ Paintbrush,
Plus,
QrCode,
Search,
@@ -62,6 +63,7 @@ export const Icons = {
fileText: FileText,
dashboard: LayoutPanelLeft,
ellipsis: MoreVertical,
+ paintbrush: Paintbrush,
github: ({ ...props }: LucideProps) => (