diff --git a/examples/livesync/components/Project/Project.tsx b/examples/livesync/components/Project/Project.tsx
index 179b9c9..933f10c 100644
--- a/examples/livesync/components/Project/Project.tsx
+++ b/examples/livesync/components/Project/Project.tsx
@@ -1,12 +1,27 @@
+'use client';
+
+import { useEffect, useState } from 'react';
 import { Drawer } from '../Drawer';
 import { Table, IssueType } from '../Table';
+import { fetchIssues } from './actions';
 
 interface Props {
   issues: IssueType[];
   id: number;
 }
 
-export const Project = ({ issues, id }: Props) => {
+export const Project = ({ issues: initialIssues, id }: Props) => {
+  const [issues, setIssues] = useState<IssueType[]>(initialIssues);
+
+  useEffect(() => {
+    async function reload() {
+      const newIssues = await fetchIssues(id);
+      setIssues(newIssues);
+    }
+
+    reload();
+  });
+    
   return (
     <Drawer projectId={id}>
       <Table rows={issues} />
diff --git a/examples/livesync/components/Project/actions.ts b/examples/livesync/components/Project/actions.ts
new file mode 100644
index 0000000..4361e7c
--- /dev/null
+++ b/examples/livesync/components/Project/actions.ts
@@ -0,0 +1,27 @@
+'use server';
+
+import { sql } from '@/data';
+import { IssueType } from '../Table';
+
+export const fetchIssues = async (id: number) => {
+	const issues = await sql<IssueType[]>`
+        SELECT
+          i.id,
+          i.name,
+          i.due_date,
+          i.status,
+          i.owner_id,
+          i.story_points,
+          i.description,
+          u.first_name as owner_first_name,
+          u.last_name as owner_last_name,
+          u.color as owner_color
+        FROM issues i
+          LEFT OUTER JOIN users u
+          ON u.id = i.owner_id
+        WHERE project_id = ${id}
+        ORDER BY i.id DESC
+      `;
+
+	return Array.from(issues);
+};