title_bar.rs

  1use std::marker::PhantomData;
  2
  3use gpui2::elements::div;
  4use gpui2::style::StyleHelpers;
  5use gpui2::{Element, IntoElement, ParentElement, ViewContext};
  6
  7use crate::prelude::Shape;
  8use crate::{avatar, follow_group, icon_button, text_button, theme, tool_divider};
  9
 10#[derive(Element)]
 11pub struct TitleBar<V: 'static> {
 12    view_type: PhantomData<V>,
 13}
 14
 15pub fn title_bar<V: 'static>() -> TitleBar<V> {
 16    TitleBar {
 17        view_type: PhantomData,
 18    }
 19}
 20
 21impl<V: 'static> TitleBar<V> {
 22    fn render(&mut self, _: &mut V, cx: &mut ViewContext<V>) -> impl IntoElement<V> {
 23        let theme = theme(cx);
 24        let player_list = vec![
 25            avatar("https://avatars.githubusercontent.com/u/1714999?v=4"),
 26            avatar("https://avatars.githubusercontent.com/u/1714999?v=4"),
 27        ];
 28
 29        div()
 30            .flex()
 31            .items_center()
 32            .justify_between()
 33            .w_full()
 34            .h_8()
 35            .fill(theme.lowest.base.default.background)
 36            .child(
 37                div()
 38                    .flex()
 39                    .items_center()
 40                    .h_full()
 41                    .gap_4()
 42                    .px_2()
 43                    // === Traffic Lights === //
 44                    .child(
 45                        div()
 46                            .flex()
 47                            .items_center()
 48                            .gap_2()
 49                            .child(
 50                                div()
 51                                    .w_3()
 52                                    .h_3()
 53                                    .rounded_full()
 54                                    .fill(theme.lowest.positive.default.foreground),
 55                            )
 56                            .child(
 57                                div()
 58                                    .w_3()
 59                                    .h_3()
 60                                    .rounded_full()
 61                                    .fill(theme.lowest.warning.default.foreground),
 62                            )
 63                            .child(
 64                                div()
 65                                    .w_3()
 66                                    .h_3()
 67                                    .rounded_full()
 68                                    .fill(theme.lowest.negative.default.foreground),
 69                            ),
 70                    )
 71                    // === Project Info === //
 72                    .child(
 73                        div()
 74                            .flex()
 75                            .items_center()
 76                            .gap_1()
 77                            .child(text_button("maxbrunsfeld"))
 78                            .child(text_button("zed"))
 79                            .child(text_button("nate/gpui2-ui-components")),
 80                    )
 81                    .child(follow_group(player_list.clone()).player(0))
 82                    .child(follow_group(player_list.clone()).player(1))
 83                    .child(follow_group(player_list.clone()).player(2)),
 84            )
 85            .child(
 86                div()
 87                    .flex()
 88                    .items_center()
 89                    .child(
 90                        div()
 91                            .px_2()
 92                            .flex()
 93                            .items_center()
 94                            .gap_1()
 95                            .child(icon_button("icons/stop_sharing.svg"))
 96                            .child(icon_button("icons/exit.svg")),
 97                    )
 98                    .child(tool_divider())
 99                    .child(
100                        div()
101                            .px_2()
102                            .flex()
103                            .items_center()
104                            .gap_1()
105                            .child(icon_button("icons/mic.svg"))
106                            .child(icon_button("icons/speaker-loud.svg"))
107                            .child(icon_button("icons/desktop.svg")),
108                    )
109                    .child(
110                        div().px_2().flex().items_center().child(
111                            avatar("https://avatars.githubusercontent.com/u/1714999?v=4")
112                                .shape(Shape::RoundedRectangle),
113                        ),
114                    ),
115            )
116    }
117}