ui_storybook/stories/
recorder_devices.rs

1//! Capture-source + device-picker stories (M-UI.8 / AUT-128).
2
3use leptos::prelude::*;
4
5use crate::components::recorder::{
6    CaptureSourceKind, CaptureSourceRow, DevicePickerMenu, DevicePickerState,
7};
8use crate::fixtures::devices::{
9    sample_camera_options, sample_capture_source_camera, sample_capture_source_microphone,
10    sample_microphone_options,
11};
12
13use super::{Story, StoryViewport, render};
14
15/// All capture-source + device-picker stories.
16#[must_use]
17pub fn stories() -> Vec<Story> {
18    vec![
19        Story {
20            id: "capture-source-camera-collapsed",
21            category: "Recorder",
22            title: "Capture source — camera (collapsed)",
23            viewport: StoryViewport::Fixed {
24                width: 400,
25                height: 80,
26            },
27            render: render_camera_collapsed,
28        },
29        Story {
30            id: "capture-source-microphone-collapsed",
31            category: "Recorder",
32            title: "Capture source — microphone with live meter",
33            viewport: StoryViewport::Fixed {
34                width: 400,
35                height: 80,
36            },
37            render: render_microphone_collapsed,
38        },
39        Story {
40            id: "device-picker-camera-open",
41            category: "Recorder",
42            title: "Device picker — cameras (open)",
43            viewport: StoryViewport::Fixed {
44                width: 360,
45                height: 360,
46            },
47            render: render_camera_open,
48        },
49        Story {
50            id: "device-picker-microphone-open",
51            category: "Recorder",
52            title: "Device picker — microphones (open)",
53            viewport: StoryViewport::Fixed {
54                width: 360,
55                height: 360,
56            },
57            render: render_microphone_open,
58        },
59        Story {
60            id: "device-picker-empty",
61            category: "Recorder",
62            title: "Device picker — no devices detected",
63            viewport: StoryViewport::Fixed {
64                width: 360,
65                height: 280,
66            },
67            render: render_empty,
68        },
69        Story {
70            id: "device-picker-permission-needed",
71            category: "Recorder",
72            title: "Device picker — permission needed",
73            viewport: StoryViewport::Fixed {
74                width: 360,
75                height: 280,
76            },
77            render: render_permission_needed,
78        },
79    ]
80}
81
82fn render_camera_collapsed() -> String {
83    render(view! {
84        <div style="padding:12px">
85            <CaptureSourceRow view=sample_capture_source_camera(true, false) />
86        </div>
87    })
88}
89
90fn render_microphone_collapsed() -> String {
91    render(view! {
92        <div style="padding:12px">
93            <CaptureSourceRow view=sample_capture_source_microphone(true, false, Some(0.45)) />
94        </div>
95    })
96}
97
98fn render_camera_open() -> String {
99    render(view! {
100        <DevicePickerMenu
101            kind=CaptureSourceKind::Camera
102            devices=sample_camera_options()
103        />
104    })
105}
106
107fn render_microphone_open() -> String {
108    render(view! {
109        <DevicePickerMenu
110            kind=CaptureSourceKind::Microphone
111            devices=sample_microphone_options()
112        />
113    })
114}
115
116fn render_empty() -> String {
117    render(view! {
118        <DevicePickerMenu
119            kind=CaptureSourceKind::Camera
120            devices=vec![]
121            state=DevicePickerState::Empty
122        />
123    })
124}
125
126fn render_permission_needed() -> String {
127    render(view! {
128        <DevicePickerMenu
129            kind=CaptureSourceKind::Microphone
130            devices=vec![]
131            state=DevicePickerState::PermissionNeeded
132        />
133    })
134}
ui_storybook/stories/recorder_devices.rs

ui_storybook/stories/
recorder_devices.rs
