Skip to content

Commit f2373d4

Browse files
LuisSanteLuisSante
committed
feat: 🎸 update page
1 parent 7ddf947 commit f2373d4

File tree

6 files changed

+212
-121
lines changed

6 files changed

+212
-121
lines changed

‎app/data/data.json‎

Lines changed: 46 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,66 @@
11
{
22
"title": "Visual Data Science Lab - Weekly Seminar",
3-
"recent_talk": {
4-
"date": "Wed, Dec 4, 2024",
5-
"time": "11:00 - 12:00",
6-
"location": "Room 1114, 370 Jay St OR Join Zoom Meeting",
7-
"speakers": [
8-
{
3+
"location": "Fundacao Getulio Vargas, Praia de Botafogo, 190, 5th floor, Rio de Janeiro, RJ, Brazil",
4+
"group_seminar": [
5+
{
6+
"date": "Mon, Feb 24, 2025",
7+
"time": "11:00 - 12:00",
8+
"speaker": {
99
"name": "Mauro Diaz",
10-
"topic": "Safeguarding Large Language Models in Real-time with Tunable Safety-Performance Trade-offs"
11-
},
12-
{
10+
"topic": "Safeguarding Large Language Models in Real-time with Tunable Safety-Performance Trade-offs",
11+
"image": "/images/maurodiaz.jpg",
12+
"advisor": "Jorge Poco",
13+
"description": "Large Language Models (LLMs) have been shown to be susceptible to jailbreak attacks, or adversarial attacks used to illicit high risk behavior from a model. Jailbreaks have been exploited by cybercriminals and blackhat actors to cause significant harm, highlighting the critical need to safeguard widely-deployed models. Safeguarding approaches, which include fine-tuning models or having LLMs 'self-reflect', may lengthen the inference time of a model, incur a computational penalty, reduce the semantic fluency of an output, and restrict 'normal' model behavior. Importantly, these Safety-Performance Trade-offs (SPTs) remain an understudied area. In this work, we introduce a novel safeguard, called SafeNudge, that combines Controlled Text Generation with 'nudging,' or using text interventions to change the behavior of a model. SafeNudge triggers during text-generation while a jailbreak attack is being executed, and can reduce successful jailbreak attempts by 30% by guiding the LLM towards a safe response. It adds minimal latency to inference and has a negligible impact on the semantic fluency of outputs. Further, we allow for tunable SPTs. SafeNudge is open-source and available through https://pypi.org/, and is compatible with models loaded with the Hugging Face transformers library."
14+
}
15+
},
16+
{
17+
"date": "Tue, Feb 25, 2025",
18+
"time": "11:00 - 12:00",
19+
"speaker": {
1320
"name": "Andres de la Puente",
14-
"topic": "Understanding, Enhancing, and Augmenting Human Interaction through Adaptive Systems"
21+
"topic": "Understanding, Enhancing, and Augmenting Human Interaction through Adaptive Systems",
22+
"image": "/images/andresdelapuente.jpeg",
23+
"advisor": "Jorge Poco",
24+
"description": "By leveraging computational methods, physiological sensing, and AI-driven adaptation, I develop intelligent interfaces that dynamically respond to users’ cognitive and behavioral states, optimizing experience and performance in real time. My work spans aviation, driving assistance, healthcare, and gaming, demonstrating the impact of adaptive systems across diverse domains."
1525
}
16-
]
17-
},
18-
"talk_details": [
26+
},
1927
{
20-
"topic": "Safeguarding Large Language Models in Real-time with Tunable Safety-Performance Trade-offs",
21-
"image": "/images/maurodiaz.jpg",
22-
"speaker": "Andrew Bell",
23-
"advisor": "Julia Stoyanovich",
24-
"description": "Large Language Models (LLMs) have been shown to be susceptible to jailbreak attacks, or adversarial attacks used to illicit high risk behavior from a model. Jailbreaks have been exploited by cybercriminals and blackhat actors to cause significant harm, highlighting the critical need to safeguard widely-deployed models. Safeguarding approaches, which include fine-tuning models or having LLMs 'self-reflect', may lengthen the inference time of a model, incur a computational penalty, reduce the semantic fluency of an output, and restrict 'normal' model behavior. Importantly, these Safety-Performance Trade-offs (SPTs) remain an understudied area. In this work, we introduce a novel safeguard, called SafeNudge, that combines Controlled Text Generation with 'nudging,' or using text interventions to change the behavior of a model. SafeNudge triggers during text-generation while a jailbreak attack is being executed, and can reduce successful jailbreak attempts by 30% by guiding the LLM towards a safe response. It adds minimal latency to inference and has a negligible impact on the semantic fluency of outputs. Further, we allow for tunable SPTs. SafeNudge is open-source and available through https://pypi.org/, and is compatible with models loaded with the Hugging Face transformers library."
28+
"date": "Wed, Feb 26, 2025",
29+
"time": "11:00 - 12:00",
30+
"speaker": {
31+
"name": "Juan Pablo Heredia",
32+
"topic": "Data Visualization for Large-Scale Text Data",
33+
"image": "/images/juanpabloheredia.png",
34+
"advisor": "Jorge Poco",
35+
"description": "By leveraging computational methods, physiological sensing, and AI-driven adaptation, I develop intelligent interfaces that dynamically respond to users’ cognitive and behavioral states, optimizing experience and performance in real time. My work spans aviation, driving assistance, healthcare, and gaming, demonstrating the impact of adaptive systems across diverse domains."
36+
}
2537
},
2638
{
27-
"topic": "Understanding, Enhancing, and Augmenting Human Interaction through Adaptive Systems",
28-
"image": "/images/andresdelapuente.jpeg",
29-
"speaker": "Jewelina Wen",
30-
"advisor": "Claudio Silva",
31-
"description": "By leveraging computational methods, physiological sensing, and AI-driven adaptation, I develop intelligent interfaces that dynamically respond to users’ cognitive and behavioral states, optimizing experience and performance in real time. My work spans aviation, driving assistance, healthcare, and gaming, demonstrating the impact of adaptive systems across diverse domains."
39+
"date": "Thu, Feb 27, 2025",
40+
"time": "11:00 - 12:00",
41+
"speaker": {
42+
"name": "Adrian Felipe Moreno",
43+
"topic": "Topic Modelling for Large-Scale Text Data",
44+
"image": "/images/felipemoreno.png",
45+
"advisor": "Jorge Poco",
46+
"description": "By leveraging computational methods, physiological sensing, and AI-driven adaptation, I develop intelligent interfaces that dynamically respond to users’ cognitive and behavioral states, optimizing experience and performance in real time. My work spans aviation, driving assistance, healthcare, and gaming, demonstrating the impact of adaptive systems across diverse domains."
47+
}
3248
}
3349
],
3450
"upcoming_events": [
3551
{
36-
"date": "Mar 12, 2025",
52+
"date": "Mar 21, 2025",
3753
"time": "11:00 - 11:30",
38-
"location": "Room 1114, 370 Jay St",
39-
"speaker": "TBD",
54+
"location": "Fundacao Getulio Vargas, Praia de Botafogo, 190, 5th floor, Rio de Janeiro, RJ, Brazil",
55+
"speaker": "Juan Pablo Heredia",
4056
"topic": "Topic Modelling for Large-Scale Text Data"
4157
},
4258
{
43-
"date": "Mar 12, 2025",
59+
"date": "Mar 28, 2025",
4460
"time": "11:30 - 12:00",
45-
"location": "Room 1114, 370 Jay St",
46-
"speaker": "TBD",
47-
"topic": "Data Visualization for Large-Scale Text Data"
61+
"location": "Fundacao Getulio Vargas, Praia de Botafogo, 190, 5th floor, Rio de Janeiro, RJ, Brazil",
62+
"speaker": "",
63+
"topic": ""
4864
}
4965
],
5066
"historical_events": [

‎app/page.tsx‎

Lines changed: 121 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -11,116 +11,148 @@ import {
1111
TableHeader,
1212
TableRow,
1313
} from "@/components/ui/table";
14+
import { isFutureTalk, isRecentTalk } from "@/lib/utils";
1415

1516
export default function Home() {
1617
const [isExpanded, setIsExpanded] = useState(false);
17-
18+
const futureTalks = data.group_seminar.filter((seminar) =>
19+
isFutureTalk(seminar.date)
20+
);
21+
const recentTalks = data.group_seminar.filter((seminar) =>
22+
isRecentTalk(seminar.date)
23+
);
24+
1825
const toggleExpand = () => {
1926
setIsExpanded(!isExpanded);
2027
};
2128

2229
const shouldShowToggle = (text: string) => {
23-
return text.length > 10
24-
}
30+
return text.length > 10;
31+
};
2532

26-
const basePath = process.env.NEXT_PUBLIC_BASE_PATH || "https://visual-ds.github.io/group-seminar.github.io/";
33+
const basePath =
34+
process.env.NEXT_PUBLIC_BASE_PATH ||
35+
"https://visual-ds.github.io/group-seminar.github.io/";
2736
console.log("base Path", basePath);
2837

2938
return (
3039
<div className="max-w-7xl mx-auto text-gray-800 p-4">
3140
<h1 className="text-4xl font-bold text-center py-6">{data.title}</h1>
32-
<div className="pb-8">
33-
<h2 className="text-xl font-semibold">Recent Talk</h2>
34-
<div className="p-4">
35-
<p className="py-2">
36-
<strong>Date:</strong> {data.recent_talk.date}
37-
</p>
38-
<Separator />
39-
<p className="py-2">
40-
<strong>Time:</strong> {data.recent_talk.time}
41-
</p>
42-
<Separator />
43-
<p className="py-2">
44-
<strong>Location:</strong> {data.recent_talk.location}
45-
</p>
46-
<Separator />
47-
{data.recent_talk.speakers.map((speaker, index) => (
48-
<div key={index}>
49-
<p className="py-2">
50-
<strong>Speaker {index + 1}:</strong> {speaker.name} -{" "}
51-
{speaker.topic}
52-
</p>
53-
<Separator />
54-
</div>
55-
))}
56-
</div>
57-
</div>
58-
<div className="pb-8">
59-
<h2 className="text-xl py-2 font-semibold">Talk Details</h2>
60-
{data.talk_details.map((talk, index) => (
61-
<div
62-
key={index}
63-
className="flex gap-6 items-start text-sm border rounded-lg p-4 mb-4 bg-white shadow"
64-
>
65-
<img src={`${basePath}/${talk.image}`} className="rounded-full w-40 h-40" />
66-
<div className="flex flex-col gap-2">
67-
<h3 className="font-bold md:text-lg text-xs">{talk.topic}</h3>
68-
<p className="italic md:text-md text-xs">
69-
{talk.speaker}, Advised by {talk.advisor}
70-
</p>
71-
<div className="hidden md:block">
72-
<p>{talk.description}</p>
73-
</div>
74-
<div className="md:hidden text-left text-xs">
75-
<div className="relative">
76-
{isExpanded ? (
77-
<p>{talk.description}</p>
78-
) : (
79-
<p>{talk.description.slice(0, 40)}{shouldShowToggle(talk.description) ? '...' : ''}</p>
80-
)}
81-
82-
{shouldShowToggle(talk.description) && (
83-
<button
84-
onClick={toggleExpand}
85-
className="text-blue-600 hover:text-blue-800 text-xs mt-1 focus:outline-none"
86-
>
87-
{isExpanded ? 'Show less' : 'Show more'}
88-
</button>
89-
)}
41+
<>
42+
{recentTalks.map((seminar, index) => (
43+
<div key={index}>
44+
{/* RECENT TALKS*/}
45+
<div className="pb-8">
46+
<h2 className="text-xl font-semibold">Recent Talk</h2>
47+
<div className="p-4">
48+
<p className="py-2">
49+
<strong>Date:</strong> {seminar.date}
50+
</p>
51+
<Separator />
52+
<p className="py-2">
53+
<strong>Time:</strong> {seminar.time}
54+
</p>
55+
<Separator />
56+
<p className="py-2">
57+
<strong>Location:</strong> {data.location}
58+
</p>
59+
<Separator />
60+
{/*
61+
{seminar.speaker.map((speak, index) => (
62+
<div key={index}>
63+
<p className="py-2">
64+
<strong>Speaker {index + 1}:</strong> {speak.name} -{" "}
65+
{speak.topic}
66+
</p>
67+
<Separator />
68+
</div>
69+
))}
70+
*/}
71+
<p className="py-2">
72+
<strong>Speaker {index + 1}:</strong> {seminar.speaker.name} -{" "}
73+
{seminar.speaker.topic}
74+
</p>
75+
<Separator />
9076
</div>
77+
</div>
78+
79+
{/* MORE INFORMATION*/}
80+
<div className="pb-8">
81+
<h2 className="text-xl py-2 font-semibold">Talk Details</h2>
82+
<div className="flex gap-6 items-start text-sm border rounded-lg p-4 mb-4 bg-white shadow">
83+
<img
84+
src={`${basePath}/${seminar.speaker.image}`}
85+
className="rounded-full w-40 h-40"
86+
/>
87+
<div className="flex flex-col gap-2">
88+
<h3 className="font-bold md:text-lg text-xs">
89+
{seminar.speaker.topic}
90+
</h3>
91+
<p className="italic md:text-md text-xs">
92+
{seminar.speaker.name}, Advised by {seminar.speaker.advisor}
93+
</p>
94+
<div className="hidden md:block">
95+
<p>{seminar.speaker.description}</p>
96+
</div>
97+
<div className="md:hidden text-left text-xs">
98+
<div className="relative">
99+
{isExpanded ? (
100+
<p>{seminar.speaker.description}</p>
101+
) : (
102+
<p>
103+
{seminar.speaker.description.slice(0, 40)}
104+
{shouldShowToggle(seminar.speaker.description)
105+
? "..."
106+
: ""}
107+
</p>
108+
)}
109+
110+
{shouldShowToggle(seminar.speaker.description) && (
111+
<button
112+
onClick={toggleExpand}
113+
className="text-blue-600 hover:text-blue-800 text-xs mt-1 focus:outline-none"
114+
>
115+
{isExpanded ? "Show less" : "Show more"}
116+
</button>
117+
)}
118+
</div>
119+
</div>
120+
</div>
91121
</div>
92122
</div>
93123
</div>
94124
))}
95-
</div>
125+
</>
126+
127+
{/* FUTURE TALKS*/}
96128
<div className="py-8">
97129
<h2 className="text-xl py-2 font-semibold">Upcoming Events</h2>
98-
<Table>
99-
<TableHeader>
100-
<TableRow className="bg-gray-200">
101-
<TableHead>Date</TableHead>
102-
<TableHead>Time</TableHead>
103-
<TableHead>Location</TableHead>
104-
<TableHead className="text-right">Speaker</TableHead>
105-
<TableHead className="text-right">Topic</TableHead>
106-
</TableRow>
107-
</TableHeader>
108-
<TableBody>
109-
{data.upcoming_events.map((event, index) => (
110-
<TableRow key={index}>
111-
<TableCell>{event.date}</TableCell>
112-
<TableCell>{event.time}</TableCell>
113-
<TableCell>{event.location}</TableCell>
114-
<TableCell className="text-right">
115-
{event.speaker || "TBD"}
116-
</TableCell>
117-
<TableCell className="text-right">
118-
{event.topic || "TBD"}
119-
</TableCell>
120-
</TableRow>
121-
))}
122-
</TableBody>
123-
</Table>
130+
<Table>
131+
<TableHeader>
132+
<TableRow className="bg-gray-200">
133+
<TableHead>Date</TableHead>
134+
<TableHead>Time</TableHead>
135+
<TableHead>Location</TableHead>
136+
<TableHead className="text-right">Speaker</TableHead>
137+
<TableHead className="text-right">Topic</TableHead>
138+
</TableRow>
139+
</TableHeader>
140+
<TableBody>
141+
{futureTalks.map((seminar, index) => (
142+
<TableRow key={index}>
143+
<TableCell>{seminar.date}</TableCell>
144+
<TableCell>{seminar.time}</TableCell>
145+
<TableCell>{data.location}</TableCell>
146+
<TableCell className="text-right">
147+
{seminar.speaker.name || "TBD"}
148+
</TableCell>
149+
<TableCell className="text-right">
150+
{seminar.speaker.topic || "TBD"}
151+
</TableCell>
152+
</TableRow>
153+
))}
154+
</TableBody>
155+
</Table>
124156
</div>
125157
</div>
126158
);

‎lib/utils.ts‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,46 @@ import { twMerge } from "tailwind-merge"
44
export function cn(...inputs: ClassValue[]) {
55
return twMerge(clsx(inputs))
66
}
7+
8+
export function isRecentTalk(date: string) {
9+
const currentDate = new Date();
10+
const seminarDate = new Date(date);
11+
12+
const simplifiedCurrentDate = new Date(
13+
currentDate.getFullYear(),
14+
currentDate.getMonth(),
15+
currentDate.getDate()
16+
);
17+
18+
const simplifiedSeminarDate = new Date(
19+
seminarDate.getFullYear(),
20+
seminarDate.getMonth(),
21+
seminarDate.getDate()
22+
);
23+
24+
const isEqual = simplifiedSeminarDate.getTime() === simplifiedCurrentDate.getTime();
25+
26+
return isEqual;
27+
}
28+
29+
export function isFutureTalk(date: string) {
30+
const currentDate = new Date();
31+
const seminarDate = new Date(date);
32+
33+
const simplifiedCurrentDate = new Date(
34+
currentDate.getFullYear(),
35+
currentDate.getMonth(),
36+
currentDate.getDate()
37+
);
38+
39+
const simplifiedSeminarDate = new Date(
40+
seminarDate.getFullYear(),
41+
seminarDate.getMonth(),
42+
seminarDate.getDate()
43+
);
44+
45+
const isFuture = simplifiedSeminarDate.getTime() > simplifiedCurrentDate.getTime();
46+
47+
return isFuture;
48+
}
49+

‎next.config.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ const nextConfig: NextConfig = {
66
images: {
77
unoptimized: true,
88
},
9-
basePath: '/group-seminar.github.io',
10-
assetPrefix: '/group-seminar.github.io',
9+
// basePath: '/group-seminar.github.io',
10+
// assetPrefix: '/group-seminar.github.io',
1111
trailingSlash: true,
1212
};
1313

‎public/images/felipemoreno.png‎

61.4 KB
Loading

‎public/images/juanpabloheredia.png‎

83.6 KB
Loading

0 commit comments

Comments
 (0)