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,