Skip to content

Commit a2aeafd

Browse files
committed
fix(hub): minor fixes to filters and sidebar (#2439)
<!-- Please make sure there is an issue that this PR is correlated to. --> ## Changes <!-- If there are frontend changes, please include screenshots. -->
1 parent 677643e commit a2aeafd

File tree

12 files changed

+331
-261
lines changed

12 files changed

+331
-261
lines changed

frontend/apps/hub/src/components/command-panel.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -141,13 +141,12 @@ export function CommandPanel({ className }: { className?: string }) {
141141
onClick={open}
142142
variant="outline"
143143
className={cn(
144-
"relative h-8 w-full justify-start rounded-[0.5rem] bg-background text-sm font-normal text-muted-foreground shadow-none hidden md:flex md:w-40 lg:w-64",
144+
"py-2 px-0 @[100px]:px-4 @[100px]:py-2 justify-center items-center relative h-8 w-full @[100px]:justify-start rounded-[0.5rem] bg-background text-sm font-normal text-muted-foreground shadow-none hidden md:flex md:w-40 lg:w-64",
145145
className,
146146
)}
147147
>
148-
<span className="hidden lg:inline-flex">Search...</span>
149-
<span className="inline-flex lg:hidden">Search...</span>
150-
<Kbd className="absolute right-[0.3rem] top-[0.3rem] hidden sm:flex">
148+
<span className="hidden @[100px]:inline-flex">Search...</span>
149+
<Kbd className="@[100px]:absolute right-[0.3rem] top-[0.3rem] hidden sm:flex">
151150
<Kbd.Key />K
152151
</Kbd>
153152
</Button>

frontend/apps/hub/src/components/header/changelog.tsx

Lines changed: 46 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -13,12 +13,14 @@ import {
1313
WithTooltip,
1414
cn,
1515
} from "@rivet-gg/components";
16-
import { Icon, faExternalLinkAlt, faSparkle } from "@rivet-gg/icons";
16+
import { Icon, faSparkle } from "@rivet-gg/icons";
1717
import { useSuspenseQuery } from "@tanstack/react-query";
1818
import { useLocalStorage } from "usehooks-ts";
1919
import { NavItem } from "./nav-item";
2020

21-
interface ChangelogEntryProps extends ChangelogItem {}
21+
interface ChangelogEntryProps extends ChangelogItem {
22+
isNew?: boolean;
23+
}
2224

2325
export function ChangelogEntry({
2426
published,
@@ -27,6 +29,7 @@ export function ChangelogEntry({
2729
description,
2830
slug,
2931
authors,
32+
isNew,
3033
}: ChangelogEntryProps) {
3134
return (
3235
<div className="py-2">
@@ -35,14 +38,25 @@ export function ChangelogEntry({
3538
<div className="bg-white text-background size-8 rounded-full flex items-center justify-center">
3639
<Icon icon={faSparkle} className="m-0" />
3740
</div>
38-
<h4 className="font-bold text-lg">New Update</h4>
41+
<h4 className="font-bold text-lg text-foreground">
42+
{isNew ? (
43+
<span>New Update</span>
44+
) : (
45+
<span>Latest Update</span>
46+
)}
47+
</h4>
3948
</div>
4049
<Badge variant="outline">
4150
{new Date(published).toLocaleDateString()}
4251
</Badge>
4352
</div>
4453

45-
<div>
54+
<a
55+
href={`https://rivet.gg/changelog/${slug}`}
56+
target="_blank"
57+
rel="noreferrer"
58+
className="block"
59+
>
4660
<Picture className="rounded-md border my-4 h-[200px] w-full block overflow-hidden">
4761
<PictureFallback>
4862
<Skeleton className="size-full" />
@@ -57,41 +71,36 @@ export function ChangelogEntry({
5771
<p className="font-semibold text-sm">{title}</p>
5872

5973
<p className="text-xs mt-1 text-muted-foreground">
60-
{description}
74+
{description}{" "}
75+
<span className="text-right text-xs inline gap-1.5 text-foreground items-center">
76+
Read more...
77+
</span>
78+
</p>
79+
</a>
80+
<div className="flex items-end justify-end mt-2">
81+
<div className="flex gap-2 items-center">
6182
<a
62-
className="text-right text-xs flex gap-1.5 text-foreground items-center"
63-
href={`https://rivet.gg/changelog/${slug}`}
64-
target="_blank"
65-
rel="noreferrer"
83+
className="flex gap-1.5 items-center flex-row-reverse text-right"
84+
href={authors[0].socials.twitter}
6685
>
67-
Read more <Icon icon={faExternalLinkAlt} />
86+
<Avatar className="size-8">
87+
<AvatarFallback>
88+
{authors[0].name[0]}
89+
</AvatarFallback>
90+
<AvatarImage
91+
src={`https://rivet.gg/${authors[0].avatar.url}`}
92+
alt={authors[0].name}
93+
/>
94+
</Avatar>
95+
<div className="ml-2">
96+
<p className="font-semibold text-sm">
97+
{authors[0].name}
98+
</p>
99+
<p className="text-xs text-muted-foreground">
100+
{authors[0].role}
101+
</p>
102+
</div>
68103
</a>
69-
</p>
70-
<div className="flex items-end justify-end mt-2">
71-
<div className="flex gap-2 items-center">
72-
<a
73-
className="flex gap-1.5 items-center flex-row-reverse text-right"
74-
href={authors[0].url}
75-
>
76-
<Avatar className="size-8">
77-
<AvatarFallback>
78-
{authors[0].name[0]}
79-
</AvatarFallback>
80-
<AvatarImage
81-
src={`https://rivet.gg/${authors[0].avatar.url}`}
82-
alt={authors[0].name}
83-
/>
84-
</Avatar>
85-
<div className="ml-2">
86-
<p className="font-semibold text-sm">
87-
{authors[0].name}
88-
</p>
89-
<p className="text-xs text-muted-foreground">
90-
{authors[0].role}
91-
</p>
92-
</div>
93-
</a>
94-
</div>
95104
</div>
96105
</div>
97106
</div>
@@ -134,10 +143,6 @@ export function Changelog({ className }: ChangelogProps) {
134143
</NavItem>
135144
);
136145

137-
if (data.length === 0) {
138-
return trigger;
139-
}
140-
141146
return (
142147
<WithTooltip
143148
delayDuration={0}
@@ -147,7 +152,7 @@ export function Changelog({ className }: ChangelogProps) {
147152
}
148153
}}
149154
trigger={trigger}
150-
content={<ChangelogEntry {...data[0]} />}
155+
content={<ChangelogEntry {...data[0]} isNew={hasNewChangelog} />}
151156
/>
152157
);
153158
}

frontend/apps/hub/src/components/header/header.tsx

Lines changed: 0 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -114,15 +114,6 @@ export function Header({ variant = "opaque" }: HeaderProps) {
114114
Changelog
115115
</a>
116116
</NavItem>
117-
<NavItem asChild>
118-
<a
119-
href="https://rivet.gg/support"
120-
target="_blank"
121-
rel="noreferrer"
122-
>
123-
Help
124-
</a>
125-
</NavItem>
126117
<NavItem asChild>
127118
<a
128119
href="https://rivet.gg/docs"
@@ -181,15 +172,6 @@ export function Header({ variant = "opaque" }: HeaderProps) {
181172
>
182173
<Changelog />
183174
</ErrorBoundary>
184-
<NavItem asChild className="hidden md:inline-block">
185-
<a
186-
href="https://rivet.gg/support"
187-
target="_blank"
188-
rel="noreferrer"
189-
>
190-
Help
191-
</a>
192-
</NavItem>
193175
<NavItem asChild className="hidden md:inline-block">
194176
<a
195177
href="https://rivet.gg/docs"

frontend/apps/hub/src/domains/user/queries/query-options.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -36,8 +36,8 @@ export const changelogQueryOptions = () => {
3636
if (!response.ok) {
3737
throw new Error("Failed to fetch changelog");
3838
}
39-
const result = Changelog.safeParse(await response.json());
40-
return result.success ? result.data : [];
39+
const result = Changelog.parse(await response.json());
40+
return result;
4141
},
4242
});
4343
};

frontend/apps/hub/src/domains/user/queries/type.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,14 @@ export const ChangelogItem = z.object({
88
slug: z.string(),
99
authors: z.array(
1010
z.object({
11-
url: z.string(),
1211
name: z.string(),
1312
role: z.string(),
1413
avatar: z.object({ url: z.string() }),
14+
socials: z.object({
15+
twitter: z.string().optional(),
16+
github: z.string().optional(),
17+
bluesky: z.string().optional(),
18+
})
1519
}),
1620
),
1721
});

frontend/apps/hub/src/layouts/root.tsx

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ const Footer = () => {
6464
return (
6565
<footer className="text-muted-foreground bg-background p-4 text-center text-sm border-t relative">
6666
<div className="container">
67-
<div className="flex items-center justify-between">
67+
<div className="flex items-center justify-between @container">
6868
<div className="flex gap-4 items-center justify-between w-full lg:w-auto lg:justify-normal">
6969
<div className="flex gap-4 items-center">
7070
<img
@@ -76,7 +76,7 @@ const Footer = () => {
7676
</div>
7777
<a
7878
className="flex items-center gap-2 hover:underline"
79-
href="https://rivet-gg.betteruptime.com/"
79+
href="https://rivet.betteruptime.com/"
8080
target="_blank"
8181
rel="noreferrer"
8282
>
@@ -127,13 +127,6 @@ const Footer = () => {
127127
>
128128
Home
129129
</NavItem>
130-
<NavItem
131-
href="https://rivet.gg/support"
132-
target="_blank"
133-
rel="noreferrer"
134-
>
135-
Help
136-
</NavItem>
137130
<NavItem
138131
href="https://rivet.gg/pricing"
139132
target="_blank"
@@ -149,7 +142,7 @@ const Footer = () => {
149142
Docs
150143
</NavItem>
151144
<NavItem
152-
href="https://calendly.com/d/zvq-v4z-84t/rivet-founders-15-minute"
145+
href="https://rivet.gg/sales"
153146
target="_blank"
154147
rel="noreferrer"
155148
>

0 commit comments

Comments
 (0)