@adminide-stack/yantra-mobile 12.0.128 → 12.0.129-alpha.1

package/lib/features/canvas/recorder/CameraRecorderExperience.js.map

@@ -1 +1 @@
-{"version":3,"file":"CameraRecorderExperience.js","sources":["../../../../src/features/canvas/recorder/CameraRecorderExperience.tsx"],"sourcesContent":["/**\n * Phone twin of web ScreenRecorder — camera (+ optional mic) capture onto the board.\n * True display capture (getDisplayMedia / ReplayKit broadcast) stays system-level;\n * this ships the in-app recording studio path.\n */\nimport React, { useState } from 'react';\nimport { ActivityIndicator, StyleSheet, Text, View } from 'react-native';\nimport { MaterialCommunityIcons } from '@expo/vector-icons';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport type { CanvasItem } from '../canvasCore';\nimport type { MediaPickSource } from '../CanvasToolDock';\nimport { friendlyMediaError } from '../videoEditor/mediaActions';\nimport { themedStyles, useCanvasTheme, type CanvasPalette } from '../canvasTheme';\nimport { Pressable, HIT, RADIUS, SPACE, TYPE, pressedStyle } from '../canvasUi';\n\nexport function CameraRecorderExperience({\n    onClose,\n    onPick,\n    onPlaced,\n}: {\n    onClose: () => void;\n    onPick: (source: MediaPickSource) => Promise<CanvasItem[]>;\n    onPlaced: (items: CanvasItem[]) => void;\n}) {\n    const theme = useCanvasTheme();\n    const styles = makeStyles(theme);\n    const insets = useSafeAreaInsets();\n    const [busy, setBusy] = useState(false);\n    const [error, setError] = useState<string | null>(null);\n\n    const capture = async (source: MediaPickSource) => {\n        setBusy(true);\n        setError(null);\n        try {\n            const items = await onPick(source);\n            if (!items.length) {\n                setError('No recording captured.');\n                return;\n            }\n            onPlaced(items);\n            onClose();\n        } catch (err: unknown) {\n            setError(friendlyMediaError(err, 'record'));\n        } finally {\n            setBusy(false);\n        }\n    };\n\n    return (\n        <View style={[styles.root, { paddingTop: insets.top + 8, paddingBottom: insets.bottom + 16 }]}>\n            <View style={styles.head}>\n                <Pressable\n                    onPress={onClose}\n                    hitSlop={10}\n                    style={({ pressed }) => [styles.close, pressedStyle(pressed)]}\n                >\n                    <MaterialCommunityIcons name=\"close\" size={22} color={theme.edInk} />\n                </Pressable>\n                <Text style={styles.title}>Record</Text>\n                <View style={styles.close} />\n            </View>\n            <View style={styles.stage}>\n                <View style={styles.stageWell}>\n                    <MaterialCommunityIcons name=\"record-circle-outline\" size={40} color=\"#f7f7fa\" />\n                </View>\n                <Text style={styles.fine}>\n                    Capture camera video or a still for the board. Full desktop screen share stays on web.\n                </Text>\n            </View>\n            {error ? <Text style={styles.error}>{error}</Text> : null}\n            <View style={styles.actions}>\n                <Pressable\n                    onPress={() => void capture('camera-video')}\n                    disabled={busy}\n                    style={({ pressed }) => [styles.cta, busy && styles.ctaOff, pressedStyle(pressed && !busy)]}\n                >\n                    {busy ? (\n                        <ActivityIndicator color={theme.primaryForeground} />\n                    ) : (\n                        <>\n                            <MaterialCommunityIcons name=\"video-outline\" size={20} color={theme.primaryForeground} />\n                            <Text style={styles.ctaLabel}>Record video</Text>\n                        </>\n                    )}\n                </Pressable>\n                <Pressable\n                    onPress={() => void capture('camera-photo')}\n                    disabled={busy}\n                    style={({ pressed }) => [styles.secondary, busy && styles.ctaOff, pressedStyle(pressed && !busy)]}\n                >\n                    <MaterialCommunityIcons name=\"camera-outline\" size={20} color={theme.edInk} />\n                    <Text style={styles.secondaryLabel}>Take photo</Text>\n                </Pressable>\n            </View>\n        </View>\n    );\n}\n\nconst makeStyles = themedStyles((theme: CanvasPalette) =>\n    StyleSheet.create({\n        root: { flex: 1, backgroundColor: theme.edBg, paddingHorizontal: SPACE.lg },\n        head: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            justifyContent: 'space-between',\n            minHeight: HIT + SPACE.xs,\n            marginHorizontal: -SPACE.sm,\n            marginBottom: SPACE.md,\n        },\n        close: { width: HIT, height: HIT, borderRadius: HIT / 2, alignItems: 'center', justifyContent: 'center' },\n        title: { ...TYPE.title, color: theme.edInk },\n        stage: {\n            flex: 1,\n            borderRadius: RADIUS.xl,\n            backgroundColor: '#050506',\n            alignItems: 'center',\n            justifyContent: 'center',\n            paddingHorizontal: SPACE.xl,\n            gap: SPACE.lg,\n        },\n        stageWell: {\n            width: 84,\n            height: 84,\n            borderRadius: 42,\n            alignItems: 'center',\n            justifyContent: 'center',\n            backgroundColor: 'rgba(255,255,255,0.08)',\n        },\n        fine: { ...TYPE.body, fontSize: 14, lineHeight: 20, color: 'rgba(247,247,250,0.72)', textAlign: 'center' },\n        actions: { gap: SPACE.sm, marginTop: SPACE.lg },\n        cta: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            justifyContent: 'center',\n            gap: SPACE.sm,\n            minHeight: 52,\n            borderRadius: RADIUS.pill,\n            backgroundColor: theme.primary,\n        },\n        secondary: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            justifyContent: 'center',\n            gap: SPACE.sm,\n            minHeight: 52,\n            borderRadius: RADIUS.pill,\n            backgroundColor: theme.edRaised,\n        },\n        ctaOff: { opacity: 0.45 },\n        ctaLabel: { ...TYPE.label, fontSize: 16, color: theme.primaryForeground },\n        secondaryLabel: { ...TYPE.label, fontSize: 16, color: theme.edInk },\n        error: {\n            ...TYPE.caption,\n            color: theme.edDanger,\n            marginTop: SPACE.md,\n            padding: SPACE.md,\n            borderRadius: RADIUS.md,\n            backgroundColor: theme.edDangerSoft,\n        },\n    }),\n);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"CameraRecorderExperience.js","sources":["../../../../src/features/canvas/recorder/CameraRecorderExperience.tsx"],"sourcesContent":["/**\n * Phone twin of web ScreenRecorder - camera (+ optional mic) capture onto the board.\n * True display capture (getDisplayMedia / ReplayKit broadcast) stays system-level;\n * this ships the in-app recording studio path.\n *\n * After a take: the review step (web RecordingReview) with a trim range and\n * the server conversions, and a My recordings tab (web RecordingsPanel).\n */\nimport React, { useState } from 'react';\nimport { ActivityIndicator, StyleSheet, Text, View } from 'react-native';\nimport { MaterialCommunityIcons } from '@expo/vector-icons';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport type { CanvasItem } from '../canvasCore';\nimport type { MediaPickSource } from '../CanvasToolDock';\nimport { friendlyMediaError, type RunMediaAction } from '../videoEditor/mediaActions';\nimport { themedStyles, useCanvasTheme, type CanvasPalette } from '../canvasTheme';\nimport { Pressable, HIT, RADIUS, SPACE, TYPE, Segmented, pressedStyle } from '../canvasUi';\nimport { RecordingReview } from './RecordingReview';\nimport { RecordingsList } from './RecordingsList';\n\ntype Mode = 'record' | 'library';\n\nlet placedSeq = 0;\nfunction boardItem(type: CanvasItem['type'], src: string, name: string): CanvasItem {\n    return {\n        id: `rec-${Date.now().toString(36)}-${placedSeq++}`,\n        type,\n        src,\n        x: 0,\n        y: 0,\n        width: type === 'audio' ? 320 : 640,\n        height: type === 'audio' ? 80 : 360,\n        zIndex: 1,\n        generatedAssetName: name,\n    };\n}\n\nexport function CameraRecorderExperience({\n    onClose,\n    onPick,\n    onPlaced,\n    runAction,\n}: {\n    onClose: () => void;\n    /** Connector runner for the review conversions and the recordings library. */\n    runAction?: RunMediaAction;\n    onPick: (source: MediaPickSource) => Promise<CanvasItem[]>;\n    onPlaced: (items: CanvasItem[]) => void;\n}) {\n    const theme = useCanvasTheme();\n    const styles = makeStyles(theme);\n    const insets = useSafeAreaInsets();\n    const [busy, setBusy] = useState(false);\n    const [error, setError] = useState<string | null>(null);\n    const [mode, setMode] = useState<Mode>('record');\n    const [take, setTake] = useState<{ url: string; name: string } | null>(null);\n\n    const capture = async (source: MediaPickSource) => {\n        setBusy(true);\n        setError(null);\n        try {\n            const items = await onPick(source);\n            if (!items.length) {\n                setError('No recording captured.');\n                return;\n            }\n            const video = items.find((item) => item.type === 'video');\n            if (source === 'camera-video' && video) {\n                // Review first: trim and convert before it lands on the board.\n                setTake({ url: video.src, name: video.generatedAssetName || 'Recording.mp4' });\n                return;\n            }\n            onPlaced(items);\n            onClose();\n        } catch (err: unknown) {\n            setError(friendlyMediaError(err, 'record'));\n        } finally {\n            setBusy(false);\n        }\n    };\n\n    return (\n        <View style={[styles.root, { paddingTop: insets.top + 8, paddingBottom: insets.bottom + 16 }]}>\n            <View style={styles.head}>\n                <Pressable\n                    onPress={onClose}\n                    hitSlop={10}\n                    style={({ pressed }) => [styles.close, pressedStyle(pressed)]}\n                >\n                    <MaterialCommunityIcons name=\"close\" size={22} color={theme.edInk} />\n                </Pressable>\n                <Text style={styles.title}>{take ? 'Review' : 'Record'}</Text>\n                <View style={styles.close} />\n            </View>\n            {take ? (\n                <RecordingReview\n                    url={take.url}\n                    name={take.name}\n                    runAction={runAction}\n                    onPlace={(kind, url, name) => {\n                        onPlaced([boardItem(kind, url, name)]);\n                        if (kind === 'video') onClose();\n                    }}\n                    onDiscard={() => setTake(null)}\n                    onRecordAnother={() => {\n                        setTake(null);\n                        void capture('camera-video');\n                    }}\n                />\n            ) : (\n                <>\n                    <Segmented\n                        options={[\n                            { id: 'record' as Mode, label: 'Record' },\n                            { id: 'library' as Mode, label: 'My recordings' },\n                        ]}\n                        value={mode}\n                        onChange={setMode}\n                        style={styles.modes}\n                    />\n                    {mode === 'library' ? (\n                        <RecordingsList\n                            runAction={runAction}\n                            onPlace={(row) => {\n                                onPlaced([boardItem('video', row.url, row.title)]);\n                                onClose();\n                            }}\n                        />\n                    ) : (\n                        <>\n                            <View style={styles.stage}>\n                                <View style={styles.stageWell}>\n                                    <MaterialCommunityIcons name=\"record-circle-outline\" size={40} color=\"#f7f7fa\" />\n                                </View>\n                                <Text style={styles.fine}>\n                                    Capture camera video or a still for the board. Screen recording stays on desktop\n                                    web.\n                                </Text>\n                            </View>\n                            {error ? <Text style={styles.error}>{error}</Text> : null}\n                            <View style={styles.actions}>\n                                <Pressable\n                                    onPress={() => void capture('camera-video')}\n                                    disabled={busy}\n                                    style={({ pressed }) => [\n                                        styles.cta,\n                                        busy && styles.ctaOff,\n                                        pressedStyle(pressed && !busy),\n                                    ]}\n                                >\n                                    {busy ? (\n                                        <ActivityIndicator color={theme.primaryForeground} />\n                                    ) : (\n                                        <>\n                                            <MaterialCommunityIcons\n                                                name=\"video-outline\"\n                                                size={20}\n                                                color={theme.primaryForeground}\n                                            />\n                                            <Text style={styles.ctaLabel}>Record video</Text>\n                                        </>\n                                    )}\n                                </Pressable>\n                                <Pressable\n                                    onPress={() => void capture('camera-photo')}\n                                    disabled={busy}\n                                    style={({ pressed }) => [\n                                        styles.secondary,\n                                        busy && styles.ctaOff,\n                                        pressedStyle(pressed && !busy),\n                                    ]}\n                                >\n                                    <MaterialCommunityIcons name=\"camera-outline\" size={20} color={theme.edInk} />\n                                    <Text style={styles.secondaryLabel}>Take photo</Text>\n                                </Pressable>\n                            </View>\n                        </>\n                    )}\n                </>\n            )}\n        </View>\n    );\n}\n\nconst makeStyles = themedStyles((theme: CanvasPalette) =>\n    StyleSheet.create({\n        root: { flex: 1, backgroundColor: theme.edBg, paddingHorizontal: SPACE.lg },\n        head: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            justifyContent: 'space-between',\n            minHeight: HIT + SPACE.xs,\n            marginHorizontal: -SPACE.sm,\n            marginBottom: SPACE.md,\n        },\n        close: { width: HIT, height: HIT, borderRadius: HIT / 2, alignItems: 'center', justifyContent: 'center' },\n        title: { ...TYPE.title, color: theme.edInk },\n        modes: { marginBottom: SPACE.md },\n        stage: {\n            flex: 1,\n            borderRadius: RADIUS.xl,\n            backgroundColor: '#050506',\n            alignItems: 'center',\n            justifyContent: 'center',\n            paddingHorizontal: SPACE.xl,\n            gap: SPACE.lg,\n        },\n        stageWell: {\n            width: 84,\n            height: 84,\n            borderRadius: 42,\n            alignItems: 'center',\n            justifyContent: 'center',\n            backgroundColor: 'rgba(255,255,255,0.08)',\n        },\n        fine: { ...TYPE.body, fontSize: 14, lineHeight: 20, color: 'rgba(247,247,250,0.72)', textAlign: 'center' },\n        actions: { gap: SPACE.sm, marginTop: SPACE.lg },\n        cta: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            justifyContent: 'center',\n            gap: SPACE.sm,\n            minHeight: 52,\n            borderRadius: RADIUS.pill,\n            backgroundColor: theme.primary,\n        },\n        secondary: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            justifyContent: 'center',\n            gap: SPACE.sm,\n            minHeight: 52,\n            borderRadius: RADIUS.pill,\n            backgroundColor: theme.edRaised,\n        },\n        ctaOff: { opacity: 0.45 },\n        ctaLabel: { ...TYPE.label, fontSize: 16, color: theme.primaryForeground },\n        secondaryLabel: { ...TYPE.label, fontSize: 16, color: theme.edInk },\n        error: {\n            ...TYPE.caption,\n            color: theme.edDanger,\n            marginTop: SPACE.md,\n            padding: SPACE.md,\n            borderRadius: RADIUS.md,\n            backgroundColor: theme.edDangerSoft,\n        },\n    }),\n);\n"],"names":[],"mappings":"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"}

package/lib/features/canvas/recorder/RecordingReview.js

@@ -0,0 +1,272 @@
+import {jsxs,jsx,Fragment}from'react/jsx-runtime';import {useState,useMemo}from'react';import {View,ActivityIndicator,ScrollView,Text,StyleSheet}from'react-native';import {MaterialCommunityIcons}from'@expo/vector-icons';import {friendlyMediaError}from'../videoEditor/mediaActions.js';import {useCanvasTheme,themedStyles}from'../canvasTheme.js';import {Pressable,pressedStyle,RADIUS,SPACE,TYPE}from'../canvasUi.js';import {SliderRow}from'../editorControls.js';import {formatDuration,trimRecording,finalizeRecording,exportRecordingGif,extractRecordingAudio,captionRecording,saveRecording}from'./recorderOps.js';var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+function RecordingReview({
+  url: initialUrl,
+  name,
+  runAction,
+  onPlace,
+  onDiscard,
+  onRecordAnother
+}) {
+  const theme = useCanvasTheme();
+  const styles = makeStyles(theme);
+  const [url, setUrl] = useState(initialUrl);
+  const [duration, setDuration] = useState(0);
+  const [trim, setTrim] = useState({
+    start: 0,
+    end: 0
+  });
+  const [playing, setPlaying] = useState(false);
+  const [job, setJob] = useState(null);
+  const [note, setNote] = useState(null);
+  const [error, setError] = useState(null);
+  const [saved, setSaved] = useState(false);
+  const end = trim.end || duration;
+  const trimmed = duration > 0 && (trim.start > 0.05 || end < duration - 0.05);
+  const stem = useMemo(() => name.replace(/\.[a-z0-9]+$/i, ""), [name]);
+  const run = (kind, task) => {
+    if (!runAction) return setError("The media pipeline is not available in this host.");
+    if (job) return;
+    setJob(kind);
+    setError(null);
+    setNote(null);
+    setPlaying(false);
+    task(runAction).then((out) => {
+      if (out.url) {
+        setUrl(out.url);
+        setDuration(0);
+        setTrim({
+          start: 0,
+          end: 0
+        });
+        setSaved(false);
+      }
+      setNote(out.message);
+    }).catch((err) => setError(friendlyMediaError(err, "recording"))).finally(() => setJob(null));
+  };
+  const actions = [{
+    id: "trim",
+    label: "Apply trim",
+    icon: "content-cut",
+    disabled: !trimmed,
+    onPress: () => run("trim", async (r) => ({
+      url: await trimRecording(r, url, trim.start, end),
+      message: "Trimmed."
+    }))
+  }, {
+    id: "mp4",
+    label: "Convert to MP4",
+    icon: "filmstrip",
+    onPress: () => run("mp4", async (r) => ({
+      url: await finalizeRecording(r, url),
+      message: "Converted to MP4."
+    }))
+  }, {
+    id: "gif",
+    label: "Make a GIF",
+    icon: "creation",
+    onPress: () => run("gif", async (r) => {
+      onPlace("image", await exportRecordingGif(r, url), `${stem}.gif`);
+      return {
+        message: "GIF placed on the board."
+      };
+    })
+  }, {
+    id: "audio",
+    label: "Extract audio",
+    icon: "music-note-outline",
+    onPress: () => run("audio", async (r) => {
+      onPlace("audio", await extractRecordingAudio(r, url), `${stem}.mp3`);
+      return {
+        message: "Audio placed on the board."
+      };
+    })
+  }, {
+    id: "captions",
+    label: "Burn in captions",
+    icon: "closed-caption-outline",
+    onPress: () => run("captions", async (r) => ({
+      url: await captionRecording(r, url),
+      message: "Captions burnt in."
+    }))
+  }, {
+    id: "save",
+    label: saved ? "Saved to recordings" : "Save to my recordings",
+    icon: "bookmark-outline",
+    disabled: saved,
+    onPress: () => run("save", async (r) => {
+      await saveRecording(r, {
+        url,
+        title: stem,
+        durationMs: duration * 1e3
+      });
+      setSaved(true);
+      return {
+        message: "Saved to My recordings."
+      };
+    })
+  }];
+  return /* @__PURE__ */ jsxs(View, { style: styles.root, children: [
+    /* @__PURE__ */ jsxs(View, { style: styles.player, children: [
+      /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "filmstrip", size: 40, color: "#f7f7fa" }),
+      /* @__PURE__ */ jsx(Pressable, { onPress: () => setPlaying((p) => !p), accessibilityLabel: playing ? "Pause" : "Play", style: ({
+        pressed
+      }) => [styles.play, pressedStyle(pressed)], children: /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: playing ? "pause" : "play", size: 24, color: "#0A0A0C" }) }),
+      job ? /* @__PURE__ */ jsx(View, { style: styles.veil, children: /* @__PURE__ */ jsx(ActivityIndicator, { color: "#F7F7FA" }) }) : null
+    ] }),
+    /* @__PURE__ */ jsxs(ScrollView, { style: styles.body, contentContainerStyle: styles.bodyContent, children: [
+      duration > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(Text, { style: styles.meta, children: [
+          formatDuration(duration * 1e3),
+          " \xB7 keeping ",
+          formatDuration(trim.start * 1e3),
+          " -",
+          " ",
+          formatDuration(end * 1e3)
+        ] }),
+        /* @__PURE__ */ jsx(SliderRow, { label: "Trim start", value: trim.start, min: 0, max: duration, step: 0.1, format: (v) => `${v.toFixed(1)}s`, onChange: (v) => setTrim((t) => __spreadProps(__spreadValues({}, t), {
+          start: Math.min(v, (t.end || duration) - 0.5)
+        })) }),
+        /* @__PURE__ */ jsx(SliderRow, { label: "Trim end", value: end, min: 0, max: duration, step: 0.1, format: (v) => `${v.toFixed(1)}s`, onChange: (v) => setTrim((t) => __spreadProps(__spreadValues({}, t), {
+          end: Math.max(v, t.start + 0.5)
+        })) })
+      ] }) : /* @__PURE__ */ jsx(Text, { style: styles.meta, children: "Play the take once to read its length for trimming." }),
+      /* @__PURE__ */ jsx(View, { style: styles.grid, children: actions.map((a) => {
+        const off = Boolean(job) || a.disabled || !runAction;
+        return /* @__PURE__ */ jsxs(Pressable, { onPress: a.onPress, disabled: off, style: ({
+          pressed
+        }) => [styles.action, off && styles.off, pressedStyle(pressed && !off)], children: [
+          job === a.id ? /* @__PURE__ */ jsx(ActivityIndicator, { size: "small", color: theme.edInk }) : /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: a.icon, size: 16, color: theme.edInk }),
+          /* @__PURE__ */ jsx(Text, { style: styles.actionLabel, children: a.label })
+        ] }, a.id);
+      }) }),
+      error || note ? /* @__PURE__ */ jsx(Text, { style: error ? styles.error : styles.note, children: error != null ? error : note }) : null
+    ] }),
+    /* @__PURE__ */ jsxs(View, { style: styles.footer, children: [
+      /* @__PURE__ */ jsx(Pressable, { onPress: onDiscard, disabled: Boolean(job), style: ({
+        pressed
+      }) => [styles.ghost, pressedStyle(pressed)], children: /* @__PURE__ */ jsx(Text, { style: styles.ghostLabel, children: "Discard" }) }),
+      /* @__PURE__ */ jsx(Pressable, { onPress: onRecordAnother, disabled: Boolean(job), style: ({
+        pressed
+      }) => [styles.ghost, pressedStyle(pressed)], children: /* @__PURE__ */ jsx(Text, { style: styles.ghostLabel, children: "Record another" }) }),
+      /* @__PURE__ */ jsx(Pressable, { onPress: () => onPlace("video", url, name), disabled: Boolean(job), style: ({
+        pressed
+      }) => [styles.cta, Boolean(job) && styles.off, pressedStyle(pressed)], children: /* @__PURE__ */ jsx(Text, { style: styles.ctaLabel, children: "Add to board" }) })
+    ] })
+  ] });
+}
+const makeStyles = themedStyles((theme) => StyleSheet.create({
+  root: {
+    flex: 1
+  },
+  player: {
+    height: 260,
+    borderRadius: RADIUS.xl,
+    overflow: "hidden",
+    backgroundColor: "#050506",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  play: {
+    position: "absolute",
+    bottom: SPACE.md,
+    right: SPACE.md,
+    width: 48,
+    height: 48,
+    borderRadius: 24,
+    backgroundColor: "#F7F7FA",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  veil: __spreadProps(__spreadValues({}, StyleSheet.absoluteFillObject), {
+    alignItems: "center",
+    justifyContent: "center",
+    backgroundColor: "rgba(10,10,12,0.5)"
+  }),
+  body: {
+    flex: 1
+  },
+  bodyContent: {
+    paddingTop: SPACE.md,
+    paddingBottom: SPACE.md
+  },
+  meta: __spreadProps(__spreadValues({}, TYPE.caption), {
+    color: theme.edInk2,
+    marginBottom: SPACE.sm
+  }),
+  grid: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    gap: SPACE.sm
+  },
+  action: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: SPACE.xs + 2,
+    minHeight: 40,
+    paddingHorizontal: SPACE.md,
+    borderRadius: RADIUS.pill,
+    backgroundColor: theme.edRaised
+  },
+  actionLabel: __spreadProps(__spreadValues({}, TYPE.label), {
+    color: theme.edInk
+  }),
+  off: {
+    opacity: 0.45
+  },
+  note: __spreadProps(__spreadValues({}, TYPE.caption), {
+    color: theme.edInk2,
+    marginTop: SPACE.md
+  }),
+  error: __spreadProps(__spreadValues({}, TYPE.caption), {
+    color: theme.edDanger,
+    marginTop: SPACE.md,
+    padding: SPACE.md,
+    borderRadius: RADIUS.md,
+    backgroundColor: theme.edDangerSoft
+  }),
+  footer: {
+    flexDirection: "row",
+    gap: SPACE.sm,
+    alignItems: "center",
+    paddingTop: SPACE.sm
+  },
+  ghost: {
+    minHeight: 48,
+    paddingHorizontal: SPACE.md,
+    borderRadius: RADIUS.pill,
+    justifyContent: "center"
+  },
+  ghostLabel: __spreadProps(__spreadValues({}, TYPE.label), {
+    color: theme.edInk2
+  }),
+  cta: {
+    flex: 1,
+    minHeight: 48,
+    borderRadius: RADIUS.pill,
+    backgroundColor: theme.primary,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  ctaLabel: __spreadProps(__spreadValues({}, TYPE.label), {
+    fontSize: 15,
+    color: theme.primaryForeground
+  })
+}));export{RecordingReview};//# sourceMappingURL=RecordingReview.js.map

package/lib/features/canvas/recorder/RecordingReview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecordingReview.js","sources":["../../../../src/features/canvas/recorder/RecordingReview.tsx"],"sourcesContent":["/**\n * What happens between \"Stop\" and the clip landing on the board (web\n * RecordingReview): playback, a trim range and the server conversions.\n * A replacement (trim, MP4, captions) swaps the take; a new artefact (GIF,\n * audio) goes straight to the board and leaves the take alone.\n */\nimport React, { useMemo, useState } from 'react';\nimport { ActivityIndicator, ScrollView, StyleSheet, Text, View } from 'react-native';\nimport { MaterialCommunityIcons } from '@expo/vector-icons';\nimport { getVideoPreviewRenderer } from '../videoRenderer';\nimport { friendlyMediaError, type RunMediaAction } from '../videoEditor/mediaActions';\nimport { themedStyles, useCanvasTheme, type CanvasPalette } from '../canvasTheme';\nimport { Pressable, RADIUS, SPACE, TYPE, pressedStyle } from '../canvasUi';\nimport { SliderRow } from '../editorControls';\nimport {\n    captionRecording,\n    exportRecordingGif,\n    extractRecordingAudio,\n    finalizeRecording,\n    formatDuration,\n    saveRecording,\n    trimRecording,\n} from './recorderOps';\n\ntype Job = 'trim' | 'mp4' | 'gif' | 'audio' | 'captions' | 'save';\n\nexport function RecordingReview({\n    url: initialUrl,\n    name,\n    runAction,\n    onPlace,\n    onDiscard,\n    onRecordAnother,\n}: {\n    url: string;\n    name: string;\n    runAction?: RunMediaAction;\n    onPlace: (kind: 'video' | 'image' | 'audio', url: string, name: string) => void;\n    onDiscard: () => void;\n    onRecordAnother: () => void;\n}) {\n    const theme = useCanvasTheme();\n    const styles = makeStyles(theme);\n    const VideoPreview = getVideoPreviewRenderer();\n    const [url, setUrl] = useState(initialUrl);\n    const [duration, setDuration] = useState(0);\n    const [trim, setTrim] = useState({ start: 0, end: 0 });\n    const [playing, setPlaying] = useState(false);\n    const [job, setJob] = useState<Job | null>(null);\n    const [note, setNote] = useState<string | null>(null);\n    const [error, setError] = useState<string | null>(null);\n    const [saved, setSaved] = useState(false);\n    const end = trim.end || duration;\n    const trimmed = duration > 0 && (trim.start > 0.05 || end < duration - 0.05);\n    const stem = useMemo(() => name.replace(/\\.[a-z0-9]+$/i, ''), [name]);\n\n    const run = (kind: Job, task: (run: RunMediaAction) => Promise<{ url?: string; message: string }>) => {\n        if (!runAction) return setError('The media pipeline is not available in this host.');\n        if (job) return;\n        setJob(kind);\n        setError(null);\n        setNote(null);\n        setPlaying(false);\n        task(runAction)\n            .then((out) => {\n                if (out.url) {\n                    setUrl(out.url);\n                    setDuration(0);\n                    setTrim({ start: 0, end: 0 });\n                    setSaved(false);\n                }\n                setNote(out.message);\n            })\n            .catch((err: unknown) => setError(friendlyMediaError(err, 'recording')))\n            .finally(() => setJob(null));\n    };\n\n    const actions: Array<{\n        id: Job;\n        label: string;\n        icon: React.ComponentProps<typeof MaterialCommunityIcons>['name'];\n        disabled?: boolean;\n        onPress: () => void;\n    }> = [\n        {\n            id: 'trim',\n            label: 'Apply trim',\n            icon: 'content-cut',\n            disabled: !trimmed,\n            onPress: () =>\n                run('trim', async (r) => ({ url: await trimRecording(r, url, trim.start, end), message: 'Trimmed.' })),\n        },\n        {\n            id: 'mp4',\n            label: 'Convert to MP4',\n            icon: 'filmstrip',\n            onPress: () =>\n                run('mp4', async (r) => ({ url: await finalizeRecording(r, url), message: 'Converted to MP4.' })),\n        },\n        {\n            id: 'gif',\n            label: 'Make a GIF',\n            icon: 'creation',\n            onPress: () =>\n                run('gif', async (r) => {\n                    onPlace('image', await exportRecordingGif(r, url), `${stem}.gif`);\n                    return { message: 'GIF placed on the board.' };\n                }),\n        },\n        {\n            id: 'audio',\n            label: 'Extract audio',\n            icon: 'music-note-outline',\n            onPress: () =>\n                run('audio', async (r) => {\n                    onPlace('audio', await extractRecordingAudio(r, url), `${stem}.mp3`);\n                    return { message: 'Audio placed on the board.' };\n                }),\n        },\n        {\n            id: 'captions',\n            label: 'Burn in captions',\n            icon: 'closed-caption-outline',\n            onPress: () =>\n                run('captions', async (r) => ({ url: await captionRecording(r, url), message: 'Captions burnt in.' })),\n        },\n        {\n            id: 'save',\n            label: saved ? 'Saved to recordings' : 'Save to my recordings',\n            icon: 'bookmark-outline',\n            disabled: saved,\n            onPress: () =>\n                run('save', async (r) => {\n                    await saveRecording(r, { url, title: stem, durationMs: duration * 1000 });\n                    setSaved(true);\n                    return { message: 'Saved to My recordings.' };\n                }),\n        },\n    ];\n\n    return (\n        <View style={styles.root}>\n            <View style={styles.player}>\n                {VideoPreview ? (\n                    <VideoPreview\n                        src={url}\n                        playing={playing}\n                        rate={1}\n                        volume={1}\n                        muted={false}\n                        trimStartSec={trim.start}\n                        trimEndSec={trim.end > 0 ? trim.end : null}\n                        loop\n                        onTime={(_sec, dur) => {\n                            if (dur > 0 && Math.abs(dur - duration) > 0.05) {\n                                setDuration(dur);\n                                setTrim((t) => (t.end > 0 ? t : { start: 0, end: dur }));\n                            }\n                        }}\n                    />\n                ) : (\n                    <MaterialCommunityIcons name=\"filmstrip\" size={40} color=\"#f7f7fa\" />\n                )}\n                <Pressable\n                    onPress={() => setPlaying((p) => !p)}\n                    accessibilityLabel={playing ? 'Pause' : 'Play'}\n                    style={({ pressed }) => [styles.play, pressedStyle(pressed)]}\n                >\n                    <MaterialCommunityIcons name={playing ? 'pause' : 'play'} size={24} color=\"#0A0A0C\" />\n                </Pressable>\n                {job ? (\n                    <View style={styles.veil}>\n                        <ActivityIndicator color=\"#F7F7FA\" />\n                    </View>\n                ) : null}\n            </View>\n            <ScrollView style={styles.body} contentContainerStyle={styles.bodyContent}>\n                {duration > 0 ? (\n                    <>\n                        <Text style={styles.meta}>\n                            {formatDuration(duration * 1000)} · keeping {formatDuration(trim.start * 1000)} -{' '}\n                            {formatDuration(end * 1000)}\n                        </Text>\n                        <SliderRow\n                            label=\"Trim start\"\n                            value={trim.start}\n                            min={0}\n                            max={duration}\n                            step={0.1}\n                            format={(v) => `${v.toFixed(1)}s`}\n                            onChange={(v) => setTrim((t) => ({ ...t, start: Math.min(v, (t.end || duration) - 0.5) }))}\n                        />\n                        <SliderRow\n                            label=\"Trim end\"\n                            value={end}\n                            min={0}\n                            max={duration}\n                            step={0.1}\n                            format={(v) => `${v.toFixed(1)}s`}\n                            onChange={(v) => setTrim((t) => ({ ...t, end: Math.max(v, t.start + 0.5) }))}\n                        />\n                    </>\n                ) : (\n                    <Text style={styles.meta}>Play the take once to read its length for trimming.</Text>\n                )}\n                <View style={styles.grid}>\n                    {actions.map((a) => {\n                        const off = Boolean(job) || a.disabled || !runAction;\n                        return (\n                            <Pressable\n                                key={a.id}\n                                onPress={a.onPress}\n                                disabled={off}\n                                style={({ pressed }) => [\n                                    styles.action,\n                                    off && styles.off,\n                                    pressedStyle(pressed && !off),\n                                ]}\n                            >\n                                {job === a.id ? (\n                                    <ActivityIndicator size=\"small\" color={theme.edInk} />\n                                ) : (\n                                    <MaterialCommunityIcons name={a.icon} size={16} color={theme.edInk} />\n                                )}\n                                <Text style={styles.actionLabel}>{a.label}</Text>\n                            </Pressable>\n                        );\n                    })}\n                </View>\n                {error || note ? <Text style={error ? styles.error : styles.note}>{error ?? note}</Text> : null}\n            </ScrollView>\n            <View style={styles.footer}>\n                <Pressable\n                    onPress={onDiscard}\n                    disabled={Boolean(job)}\n                    style={({ pressed }) => [styles.ghost, pressedStyle(pressed)]}\n                >\n                    <Text style={styles.ghostLabel}>Discard</Text>\n                </Pressable>\n                <Pressable\n                    onPress={onRecordAnother}\n                    disabled={Boolean(job)}\n                    style={({ pressed }) => [styles.ghost, pressedStyle(pressed)]}\n                >\n                    <Text style={styles.ghostLabel}>Record another</Text>\n                </Pressable>\n                <Pressable\n                    onPress={() => onPlace('video', url, name)}\n                    disabled={Boolean(job)}\n                    style={({ pressed }) => [styles.cta, Boolean(job) && styles.off, pressedStyle(pressed)]}\n                >\n                    <Text style={styles.ctaLabel}>Add to board</Text>\n                </Pressable>\n            </View>\n        </View>\n    );\n}\n\nconst makeStyles = themedStyles((theme: CanvasPalette) =>\n    StyleSheet.create({\n        root: { flex: 1 },\n        player: {\n            height: 260,\n            borderRadius: RADIUS.xl,\n            overflow: 'hidden',\n            backgroundColor: '#050506',\n            alignItems: 'center',\n            justifyContent: 'center',\n        },\n        play: {\n            position: 'absolute',\n            bottom: SPACE.md,\n            right: SPACE.md,\n            width: 48,\n            height: 48,\n            borderRadius: 24,\n            backgroundColor: '#F7F7FA',\n            alignItems: 'center',\n            justifyContent: 'center',\n        },\n        veil: {\n            ...StyleSheet.absoluteFillObject,\n            alignItems: 'center',\n            justifyContent: 'center',\n            backgroundColor: 'rgba(10,10,12,0.5)',\n        },\n        body: { flex: 1 },\n        bodyContent: { paddingTop: SPACE.md, paddingBottom: SPACE.md },\n        meta: { ...TYPE.caption, color: theme.edInk2, marginBottom: SPACE.sm },\n        grid: { flexDirection: 'row', flexWrap: 'wrap', gap: SPACE.sm },\n        action: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            gap: SPACE.xs + 2,\n            minHeight: 40,\n            paddingHorizontal: SPACE.md,\n            borderRadius: RADIUS.pill,\n            backgroundColor: theme.edRaised,\n        },\n        actionLabel: { ...TYPE.label, color: theme.edInk },\n        off: { opacity: 0.45 },\n        note: { ...TYPE.caption, color: theme.edInk2, marginTop: SPACE.md },\n        error: {\n            ...TYPE.caption,\n            color: theme.edDanger,\n            marginTop: SPACE.md,\n            padding: SPACE.md,\n            borderRadius: RADIUS.md,\n            backgroundColor: theme.edDangerSoft,\n        },\n        footer: { flexDirection: 'row', gap: SPACE.sm, alignItems: 'center', paddingTop: SPACE.sm },\n        ghost: { minHeight: 48, paddingHorizontal: SPACE.md, borderRadius: RADIUS.pill, justifyContent: 'center' },\n        ghostLabel: { ...TYPE.label, color: theme.edInk2 },\n        cta: {\n            flex: 1,\n            minHeight: 48,\n            borderRadius: RADIUS.pill,\n            backgroundColor: theme.primary,\n            alignItems: 'center',\n            justifyContent: 'center',\n        },\n        ctaLabel: { ...TYPE.label, fontSize: 15, color: theme.primaryForeground },\n    }),\n);\n"],"names":[],"mappings":"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"}

package/lib/features/canvas/recorder/RecordingsList.js

@@ -0,0 +1,179 @@
+import {jsxs,jsx}from'react/jsx-runtime';import {useState,useCallback,useEffect}from'react';import {View,Text,FlatList,Image,ActivityIndicator,StyleSheet}from'react-native';import {MaterialCommunityIcons}from'@expo/vector-icons';import {friendlyMediaError}from'../videoEditor/mediaActions.js';import {useCanvasTheme,themedStyles}from'../canvasTheme.js';import {Pressable,pressedStyle,SPACE,RADIUS,TYPE}from'../canvasUi.js';import {listRecordings,formatDuration,deleteRecording}from'./recorderOps.js';var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const PAGE_SIZE = 24;
+function RecordingsList({
+  runAction,
+  onPlace
+}) {
+  const theme = useCanvasTheme();
+  const styles = makeStyles(theme);
+  const [rows, setRows] = useState([]);
+  const [total, setTotal] = useState(0);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [pendingDelete, setPendingDelete] = useState(null);
+  const load = useCallback(async (offset) => {
+    if (!runAction) return setError("My recordings needs a signed-in session.");
+    setLoading(true);
+    setError(null);
+    try {
+      const page = await listRecordings(runAction, PAGE_SIZE, offset);
+      setTotal(page.totalCount);
+      setRows((prev) => {
+        const base = offset === 0 ? [] : prev;
+        const seen = new Set(base.map((r) => r.id));
+        return [...base, ...page.recordings.filter((r) => !seen.has(r.id))];
+      });
+    } catch (err) {
+      setError(friendlyMediaError(err, "recordings list"));
+    } finally {
+      setLoading(false);
+    }
+  }, [runAction]);
+  useEffect(() => {
+    void load(0);
+  }, [load]);
+  const remove = async (id) => {
+    if (!runAction) return;
+    try {
+      await deleteRecording(runAction, id);
+      setRows((list) => list.filter((r) => r.id !== id));
+      setTotal((t) => Math.max(0, t - 1));
+    } catch (err) {
+      setError(friendlyMediaError(err, "delete"));
+    } finally {
+      setPendingDelete(null);
+    }
+  };
+  return /* @__PURE__ */ jsxs(View, { style: styles.root, children: [
+    /* @__PURE__ */ jsx(Text, { style: styles.meta, children: total > 0 ? `${total} recording${total === 1 ? "" : "s"}` : " " }),
+    error ? /* @__PURE__ */ jsxs(Pressable, { onPress: () => void load(0), style: styles.errorBox, children: [
+      /* @__PURE__ */ jsx(Text, { style: styles.error, children: error }),
+      /* @__PURE__ */ jsx(Text, { style: styles.retry, children: "Try again" })
+    ] }) : null,
+    /* @__PURE__ */ jsx(FlatList, { data: rows, keyExtractor: (r) => r.id, onEndReachedThreshold: 0.4, onEndReached: () => {
+      if (!loading && rows.length < total) void load(rows.length);
+    }, ListEmptyComponent: loading ? null : /* @__PURE__ */ jsx(Text, { style: styles.empty, children: "No recordings yet. Record a take and tap Save to my recordings." }), ListFooterComponent: loading ? /* @__PURE__ */ jsx(ActivityIndicator, { color: theme.edInk2, style: styles.spinner }) : null, renderItem: ({
+      item
+    }) => /* @__PURE__ */ jsxs(View, { style: styles.row, children: [
+      /* @__PURE__ */ jsxs(Pressable, { onPress: () => onPlace(item), accessibilityLabel: `Add ${item.title} to the board`, style: ({
+        pressed
+      }) => [styles.rowMain, pressedStyle(pressed)], children: [
+        /* @__PURE__ */ jsx(View, { style: styles.thumb, children: item.thumbnailUrl ? /* @__PURE__ */ jsx(Image, { source: {
+          uri: item.thumbnailUrl
+        }, style: styles.thumbImg }) : /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "filmstrip", size: 20, color: "#f7f7fa" }) }),
+        /* @__PURE__ */ jsxs(View, { style: styles.rowText, children: [
+          /* @__PURE__ */ jsx(Text, { style: styles.title, numberOfLines: 1, children: item.title }),
+          /* @__PURE__ */ jsxs(Text, { style: styles.sub, numberOfLines: 1, children: [
+            item.durationMs != null ? formatDuration(item.durationMs) : "",
+            item.width && item.height ? ` \xB7 ${item.width}\xD7${item.height}` : ""
+          ] })
+        ] })
+      ] }),
+      pendingDelete === item.id ? /* @__PURE__ */ jsx(Pressable, { onPress: () => void remove(item.id), style: ({
+        pressed
+      }) => [styles.confirm, pressedStyle(pressed)], children: /* @__PURE__ */ jsx(Text, { style: styles.confirmLabel, children: "Delete" }) }) : /* @__PURE__ */ jsx(Pressable, { onPress: () => setPendingDelete(item.id), hitSlop: 8, accessibilityLabel: `Delete ${item.title}`, style: ({
+        pressed
+      }) => [styles.trash, pressedStyle(pressed)], children: /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "trash-can-outline", size: 18, color: theme.edInk3 }) })
+    ] }) })
+  ] });
+}
+const makeStyles = themedStyles((theme) => StyleSheet.create({
+  root: {
+    flex: 1
+  },
+  meta: __spreadProps(__spreadValues({}, TYPE.caption), {
+    color: theme.edInk3,
+    marginBottom: SPACE.sm
+  }),
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: SPACE.sm,
+    marginBottom: SPACE.sm
+  },
+  rowMain: {
+    flex: 1,
+    flexDirection: "row",
+    alignItems: "center",
+    gap: SPACE.md
+  },
+  thumb: {
+    width: 72,
+    height: 48,
+    borderRadius: RADIUS.sm,
+    overflow: "hidden",
+    backgroundColor: "#050506",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  thumbImg: {
+    width: "100%",
+    height: "100%"
+  },
+  rowText: {
+    flex: 1
+  },
+  title: __spreadProps(__spreadValues({}, TYPE.label), {
+    color: theme.edInk
+  }),
+  sub: __spreadProps(__spreadValues({}, TYPE.caption), {
+    fontWeight: "400",
+    color: theme.edInk3
+  }),
+  trash: {
+    width: 36,
+    height: 36,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  confirm: {
+    minHeight: 32,
+    paddingHorizontal: SPACE.md,
+    borderRadius: RADIUS.pill,
+    justifyContent: "center",
+    backgroundColor: theme.edDangerSoft
+  },
+  confirmLabel: __spreadProps(__spreadValues({}, TYPE.label), {
+    color: theme.edDanger
+  }),
+  empty: __spreadProps(__spreadValues({}, TYPE.body), {
+    fontSize: 14,
+    color: theme.edInk3,
+    textAlign: "center",
+    marginTop: SPACE.xl
+  }),
+  spinner: {
+    marginVertical: SPACE.md
+  },
+  errorBox: {
+    padding: SPACE.md,
+    borderRadius: RADIUS.md,
+    backgroundColor: theme.edDangerSoft,
+    marginBottom: SPACE.sm
+  },
+  error: __spreadProps(__spreadValues({}, TYPE.caption), {
+    color: theme.edDanger
+  }),
+  retry: __spreadProps(__spreadValues({}, TYPE.label), {
+    color: theme.edDanger,
+    marginTop: SPACE.xs
+  })
+}));export{RecordingsList};//# sourceMappingURL=RecordingsList.js.map

package/lib/features/canvas/recorder/RecordingsList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecordingsList.js","sources":["../../../../src/features/canvas/recorder/RecordingsList.tsx"],"sourcesContent":["/**\n * The recording library (web RecordingsPanel): everything this user saved\n * from a recorder, newest first, with load-more, place and a confirmed delete.\n */\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { ActivityIndicator, FlatList, Image, StyleSheet, Text, View } from 'react-native';\nimport { MaterialCommunityIcons } from '@expo/vector-icons';\nimport { friendlyMediaError, type RunMediaAction } from '../videoEditor/mediaActions';\nimport { themedStyles, useCanvasTheme, type CanvasPalette } from '../canvasTheme';\nimport { Pressable, RADIUS, SPACE, TYPE, pressedStyle } from '../canvasUi';\nimport { deleteRecording, formatDuration, listRecordings, type RecordingSummary } from './recorderOps';\n\nconst PAGE_SIZE = 24;\n\nexport function RecordingsList({\n    runAction,\n    onPlace,\n}: {\n    runAction?: RunMediaAction;\n    onPlace: (row: RecordingSummary) => void;\n}) {\n    const theme = useCanvasTheme();\n    const styles = makeStyles(theme);\n    const [rows, setRows] = useState<RecordingSummary[]>([]);\n    const [total, setTotal] = useState(0);\n    const [loading, setLoading] = useState(false);\n    const [error, setError] = useState<string | null>(null);\n    const [pendingDelete, setPendingDelete] = useState<string | null>(null);\n\n    const load = useCallback(\n        async (offset: number) => {\n            if (!runAction) return setError('My recordings needs a signed-in session.');\n            setLoading(true);\n            setError(null);\n            try {\n                const page = await listRecordings(runAction, PAGE_SIZE, offset);\n                setTotal(page.totalCount);\n                setRows((prev) => {\n                    const base = offset === 0 ? [] : prev;\n                    const seen = new Set(base.map((r) => r.id));\n                    return [...base, ...page.recordings.filter((r) => !seen.has(r.id))];\n                });\n            } catch (err: unknown) {\n                setError(friendlyMediaError(err, 'recordings list'));\n            } finally {\n                setLoading(false);\n            }\n        },\n        [runAction],\n    );\n\n    useEffect(() => {\n        void load(0);\n    }, [load]);\n\n    const remove = async (id: string) => {\n        if (!runAction) return;\n        try {\n            await deleteRecording(runAction, id);\n            setRows((list) => list.filter((r) => r.id !== id));\n            setTotal((t) => Math.max(0, t - 1));\n        } catch (err: unknown) {\n            setError(friendlyMediaError(err, 'delete'));\n        } finally {\n            setPendingDelete(null);\n        }\n    };\n\n    return (\n        <View style={styles.root}>\n            <Text style={styles.meta}>{total > 0 ? `${total} recording${total === 1 ? '' : 's'}` : ' '}</Text>\n            {error ? (\n                <Pressable onPress={() => void load(0)} style={styles.errorBox}>\n                    <Text style={styles.error}>{error}</Text>\n                    <Text style={styles.retry}>Try again</Text>\n                </Pressable>\n            ) : null}\n            <FlatList\n                data={rows}\n                keyExtractor={(r) => r.id}\n                onEndReachedThreshold={0.4}\n                onEndReached={() => {\n                    if (!loading && rows.length < total) void load(rows.length);\n                }}\n                ListEmptyComponent={\n                    loading ? null : (\n                        <Text style={styles.empty}>\n                            No recordings yet. Record a take and tap Save to my recordings.\n                        </Text>\n                    )\n                }\n                ListFooterComponent={loading ? <ActivityIndicator color={theme.edInk2} style={styles.spinner} /> : null}\n                renderItem={({ item }) => (\n                    <View style={styles.row}>\n                        <Pressable\n                            onPress={() => onPlace(item)}\n                            accessibilityLabel={`Add ${item.title} to the board`}\n                            style={({ pressed }) => [styles.rowMain, pressedStyle(pressed)]}\n                        >\n                            <View style={styles.thumb}>\n                                {item.thumbnailUrl ? (\n                                    <Image source={{ uri: item.thumbnailUrl }} style={styles.thumbImg} />\n                                ) : (\n                                    <MaterialCommunityIcons name=\"filmstrip\" size={20} color=\"#f7f7fa\" />\n                                )}\n                            </View>\n                            <View style={styles.rowText}>\n                                <Text style={styles.title} numberOfLines={1}>\n                                    {item.title}\n                                </Text>\n                                <Text style={styles.sub} numberOfLines={1}>\n                                    {item.durationMs != null ? formatDuration(item.durationMs) : ''}\n                                    {item.width && item.height ? ` · ${item.width}×${item.height}` : ''}\n                                </Text>\n                            </View>\n                        </Pressable>\n                        {pendingDelete === item.id ? (\n                            <Pressable\n                                onPress={() => void remove(item.id)}\n                                style={({ pressed }) => [styles.confirm, pressedStyle(pressed)]}\n                            >\n                                <Text style={styles.confirmLabel}>Delete</Text>\n                            </Pressable>\n                        ) : (\n                            <Pressable\n                                onPress={() => setPendingDelete(item.id)}\n                                hitSlop={8}\n                                accessibilityLabel={`Delete ${item.title}`}\n                                style={({ pressed }) => [styles.trash, pressedStyle(pressed)]}\n                            >\n                                <MaterialCommunityIcons name=\"trash-can-outline\" size={18} color={theme.edInk3} />\n                            </Pressable>\n                        )}\n                    </View>\n                )}\n            />\n        </View>\n    );\n}\n\nconst makeStyles = themedStyles((theme: CanvasPalette) =>\n    StyleSheet.create({\n        root: { flex: 1 },\n        meta: { ...TYPE.caption, color: theme.edInk3, marginBottom: SPACE.sm },\n        row: { flexDirection: 'row', alignItems: 'center', gap: SPACE.sm, marginBottom: SPACE.sm },\n        rowMain: { flex: 1, flexDirection: 'row', alignItems: 'center', gap: SPACE.md },\n        thumb: {\n            width: 72,\n            height: 48,\n            borderRadius: RADIUS.sm,\n            overflow: 'hidden',\n            backgroundColor: '#050506',\n            alignItems: 'center',\n            justifyContent: 'center',\n        },\n        thumbImg: { width: '100%', height: '100%' },\n        rowText: { flex: 1 },\n        title: { ...TYPE.label, color: theme.edInk },\n        sub: { ...TYPE.caption, fontWeight: '400', color: theme.edInk3 },\n        trash: { width: 36, height: 36, alignItems: 'center', justifyContent: 'center' },\n        confirm: {\n            minHeight: 32,\n            paddingHorizontal: SPACE.md,\n            borderRadius: RADIUS.pill,\n            justifyContent: 'center',\n            backgroundColor: theme.edDangerSoft,\n        },\n        confirmLabel: { ...TYPE.label, color: theme.edDanger },\n        empty: { ...TYPE.body, fontSize: 14, color: theme.edInk3, textAlign: 'center', marginTop: SPACE.xl },\n        spinner: { marginVertical: SPACE.md },\n        errorBox: {\n            padding: SPACE.md,\n            borderRadius: RADIUS.md,\n            backgroundColor: theme.edDangerSoft,\n            marginBottom: SPACE.sm,\n        },\n        error: { ...TYPE.caption, color: theme.edDanger },\n        retry: { ...TYPE.label, color: theme.edDanger, marginTop: SPACE.xs },\n    }),\n);\n"],"names":[],"mappings":"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"}