diff --git a/packages/app/src/components/global-footer.tsx b/packages/app/src/components/global-footer.tsx
index 7988a0df4..cb7f4dc79 100644
--- a/packages/app/src/components/global-footer.tsx
+++ b/packages/app/src/components/global-footer.tsx
@@ -140,33 +140,57 @@ export function GlobalFooter() {
);
}
- // For home and orchestrator screens, show centered realtime button
+ // For home and orchestrator screens, show three buttons
return (
-
-
-
-
-
-
-
+ <>
+
+
+ router.push("/")}
+ style={styles.footerButton}
+ >
+
+ Agents
+
+
+ setShowCreateModal(true)}
+ style={styles.footerButton}
+ >
+
+ New Agent
+
+
+
+
+ Realtime
+
+
+
+
+ setShowCreateModal(false)}
+ />
+ >
);
}
@@ -186,18 +210,23 @@ const styles = StyleSheet.create((theme) => ({
right: 0,
bottom: 0,
},
- centeredButtonContainer: {
- padding: theme.spacing[6],
- alignItems: "center",
- justifyContent: "center",
+ threeButtonContainer: {
+ flexDirection: "row",
+ padding: theme.spacing[4],
+ gap: theme.spacing[3],
},
- centeredRealtimeButton: {
- width: 56,
- height: 56,
- borderRadius: theme.borderRadius.full,
- backgroundColor: theme.colors.palette.blue[600],
+ footerButton: {
+ flex: 1,
+ flexDirection: "column",
alignItems: "center",
justifyContent: "center",
+ paddingVertical: theme.spacing[3],
+ gap: theme.spacing[1],
+ },
+ footerButtonText: {
+ color: theme.colors.foreground,
+ fontSize: theme.fontSize.xs,
+ fontWeight: theme.fontWeight.normal,
},
buttonDisabled: {
opacity: 0.5,