Make FacePile a component again (#4143)

This PR turns `FacePile` back into a component.

Our usage of it seemed a little weird, with us calling `render`
manually.

We're now implementing `Styled` on `FacePile` through its inner `Div` so
that we can apply the `p_1` at the call site.

Release Notes:

- N/A

crates/collab_ui/src/face_pile.rs

@@ -1,14 +1,28 @@
-use gpui::{div, AnyElement, Div, ParentElement, Styled};
+use gpui::AnyElement;
 use smallvec::SmallVec;
-use ui::FluentBuilder;
+use ui::prelude::*;
 
-#[derive(Default)]
+#[derive(IntoElement)]
 pub struct FacePile {
-    pub faces: SmallVec<[AnyElement; 2]>,
+    base: Div,
+    faces: SmallVec<[AnyElement; 2]>,
 }
 
 impl FacePile {
-    pub fn render(self) -> Div {
+    pub fn empty() -> Self {
+        Self::new(SmallVec::new())
+    }
+
+    pub fn new(faces: SmallVec<[AnyElement; 2]>) -> Self {
+        Self {
+            base: h_flex(),
+            faces,
+        }
+    }
+}
+
+impl RenderOnce for FacePile {
+    fn render(self, _cx: &mut WindowContext) -> impl IntoElement {
         let player_count = self.faces.len();
         let player_list = self.faces.into_iter().enumerate().map(|(ix, player)| {
             let isnt_last = ix < player_count - 1;
@@ -18,7 +32,7 @@ impl FacePile {
                 .when(isnt_last, |div| div.neg_mr_1())
                 .child(player)
         });
-        div().flex().items_center().children(player_list)
+        self.base.children(player_list)
     }
 }
 
@@ -27,3 +41,9 @@ impl ParentElement for FacePile {
         &mut self.faces
     }
 }
+
+impl Styled for FacePile {
+    fn style(&mut self) -> &mut gpui::StyleRefinement {
+        self.base.style()
+    }
+}