Michael/Socialflow
1
0 Fork 0
mirror of https://github.com/R0m1k3/Socialflow.git synced 2026-10-12 01:36:54 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(reels): add stabilization to desktop, improve mobile UX with Switch, and remove desktop camera

Browse Source
This commit is contained in:
Michael committed 2026-01-23 17:39:50 +01:00
1 parent 230a30b339
commit 027b0f7e73
2 files changed
+30 -21
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

client/src/pages/mobile/new-reel.tsx
+2 -2
View File
@@ -13,7 +13,7 @@ import Sidebar from "@/components/sidebar";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Textarea } from "@/components/ui/textarea";
import { Checkbox } from "@/components/ui/checkbox";
import { Switch } from "@/components/ui/switch";
import { Slider } from "@/components/ui/slider";
import { useToast } from "@/hooks/use-toast";
import { apiRequest, queryClient } from "@/lib/queryClient";
@@ -307,7 +307,7 @@ export default function MobileNewReel() {
</div>
<div className="text-xs text-muted-foreground">Recommandé pour Facebook Reels</div>
</div>
<Checkbox
<Switch
checked={stabilize}
onCheckedChange={(checked) => setStabilize(!!checked)}
/>
client/src/pages/new-reel.tsx
+28 -19
View File
@@ -68,7 +68,8 @@ export default function NewReel() {
const [ttsEnabled, setTtsEnabled] = useState(true);
const [ttsVoice, setTtsVoice] = useState("fr-FR-VivienneMultilingualNeural");
const [drawText, setDrawText] = useState(true);
const [shouldStabilize, setShouldStabilize] = useState(false);
const [stabilize, setStabilize] = useState(true); // default to true
// État audio preview
const [isPlaying, setIsPlaying] = useState<string | null>(null);
@@ -339,7 +340,7 @@ export default function NewReel() {
ttsEnabled,
ttsVoice,
drawText,
stabilize: shouldStabilize,
stabilize: stabilize,
});
};
@@ -361,13 +362,13 @@ export default function NewReel() {
<CameraRecorder
onCapture={(file, options) => {
if (options?.stabilize) {
setShouldStabilize(true);
setStabilize(true);
toast({
title: "Stabilisation activée",
description: "La vidéo sera stabilisée lors de la création du Reel (ceci peut prendre plus de temps)",
});
} else {
setShouldStabilize(false);
setStabilize(false);
}
uploadMutation.mutate(file);
setShowCamera(false);
@@ -467,15 +468,6 @@ export default function NewReel() {
<input {...getInputProps()} />
<div className="flex gap-2 mb-4">
<Button
onClick={() => cameraInputRef.current?.click()}
disabled={uploadMutation.isPending}
variant="outline"
className="lg:hidden"
>
<Camera className="w-4 h-4 mr-2" />
Filmer (Qualité Max)
</Button>
<Button
onClick={open}
disabled={uploadMutation.isPending}
@@ -523,11 +515,28 @@ export default function NewReel() {
</div>
{selectedVideo && (
<div className="mt-4 flex justify-end">
<Button onClick={() => setCurrentStep('music')}>
Continuer
<ChevronRight className="w-4 h-4 ml-2" />
</Button>
<div className="mt-6 p-4 border rounded-xl bg-accent/30 space-y-4">
<div className="flex items-center justify-between">
<div className="space-y-0.5">
<Label className="text-base font-semibold flex items-center gap-2">
<Sparkles className="w-5 h-5 text-primary" />
Stabilisation & Qualité 1080p
</Label>
<p className="text-sm text-muted-foreground">
Recommandé pour un rendu professionnel sur Facebook Reels
</p>
</div>
<Switch
checked={stabilize}
onCheckedChange={setStabilize}
/>
</div>
<div className="flex justify-end">
<Button onClick={() => setCurrentStep('music')}>
Continuer
<ChevronRight className="w-4 h-4 ml-2" />
</Button>
</div>
</div>
)}
</CardContent>
@@ -1024,7 +1033,7 @@ export default function NewReel() {
{/* Overlay de progression */}
<ProcessingOverlay
isVisible={createReelMutation.isPending}
stabilize={shouldStabilize}
stabilize={stabilize}
ttsEnabled={ttsEnabled}
/>
</div >