Skip to content

Commit

Permalink
Merge branch 'main' into stream_manager_feature
Browse files Browse the repository at this point in the history
  • Loading branch information
0xspeedybird authored Dec 13, 2024
2 parents 81f65c2 + e29201d commit 177073e
Show file tree
Hide file tree
Showing 4 changed files with 100 additions and 81 deletions.
20 changes: 20 additions & 0 deletions apps/app/app/api/streams/update-params.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
"use server";

export async function updateParams(streamKey: string, body: any) {
console.log("Stream key:", streamKey);
console.log("Body:", body);
const response = await fetch(
`https://livepeer.monster/api/live/video-to-video/${streamKey}/update`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(body),
}
);

const data = await response.json();
console.log("Data:", data);
return data;
}
36 changes: 20 additions & 16 deletions apps/app/components/playground/try.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import { ChevronDown } from "lucide-react";
import { ScrollArea } from "@repo/design-system/components/ui/scroll-area";
import { Button } from "@repo/design-system/components/ui/button";
import { toast } from "sonner";
import { updateParams } from "@/app/api/streams/update-params";

export default function Try({
setStreamInfo,
Expand All @@ -37,7 +38,7 @@ export default function Try({
const [isOpen, setIsOpen] = useState(false);
const [showAlert, setShowAlert] = useState(false);
const [hasChanges, setHasChanges] = useState(false);

const [streamKey, setStreamKey] = useState<string | null>(null);
const { user } = usePrivy();

const handleInputChange = (id: string, value: any) => {
Expand All @@ -46,18 +47,20 @@ export default function Try({
[id]: value,
};
setInputValues(newValues);

const hasAnyChange = Object.keys(newValues).some(
key => newValues[key] !== initialValues[key]
(key) => newValues[key] !== initialValues[key]
);
setHasChanges(hasAnyChange);
};

const handleUpdate = async () => {
toast("Params updated successfully")
setInitialValues({...inputValues});

setHasChanges(false);
toast("Params updated successfully");
if (!streamKey) return;
updateParams(streamKey, inputValues);
setInitialValues({ ...inputValues });

setHasChanges(false);
};

const handleRun = async (): Promise<void> => {
Expand All @@ -74,13 +77,14 @@ toast("Params updated successfully")
setStreamUrl(
`https://ai.livepeer.monster/aiWebrtc/${stream.stream_key}/whip`
);
setStreamKey(stream.stream_key);
};

const inputs = pipeline.config.inputs;

const createDefaultValues = () => {
const primaryInput = inputs.primary;
const advancedInputs = inputs.advanced;
const primaryInput = inputs.primary;
const advancedInputs = inputs.advanced;
const allInputs = [primaryInput, ...advancedInputs];
return allInputs.reduce((acc, input) => {
acc[input.id] = input.defaultValue;
Expand Down Expand Up @@ -172,10 +176,7 @@ toast("Params updated successfully")
<div className="flex justify-end h-10">
{streamId && (
<>
<Button
onClick={handleUpdate}
disabled={!hasChanges}
>
<Button onClick={handleUpdate} disabled={!hasChanges}>
Update params
</Button>
</>
Expand Down Expand Up @@ -261,8 +262,11 @@ toast("Params updated successfully")
<Label className="text-muted-foreground">Stream Source</Label>
<div className="flex flex-row h-[300px] w-full bg-sidebar rounded-2xl items-center justify-center overflow-hidden relative">
{streamUrl ? (
<BroadcastWithControls ingestUrl={streamUrl} />
): (
<p>
{/* <BroadcastWithControls streamUrl={streamUrl} /> */}
Hello
</p>
) : (
<p className="text-muted-foreground">
Waiting for stream to start...
</p>
Expand All @@ -272,4 +276,4 @@ toast("Params updated successfully")
</div>
</div>
);
}
}
84 changes: 42 additions & 42 deletions apps/app/components/sidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -128,13 +128,12 @@ export const GlobalSidebar = ({ children }: GlobalSidebarProperties) => {
};

const labelMap: Record<string, string> = {
streams: 'Streams',
pipelines: 'Pipelines',
settings: 'Settings',
footer: 'More'
streams: "Streams",
pipelines: "Pipelines",
settings: "Settings",
footer: "More",
};


return (
<>
<Sidebar variant="inset" collapsible="icon">
Expand Down Expand Up @@ -215,43 +214,44 @@ export const GlobalSidebar = ({ children }: GlobalSidebarProperties) => {
</Link>
</SidebarHeader>
<SidebarContent>
{Object.entries(data).map(([key, items]) => (
<SidebarGroup key={key}
className={key === 'footer' ? 'mt-auto mb-10' : ''}
>
{key !== 'footer' && (
<SidebarGroupLabel>
{labelMap[key] || key.charAt(0).toUpperCase() + key.slice(1)}
</SidebarGroupLabel>
) }
<SidebarMenu>
{items.map((item) => (
<SidebarMenuItem key={item.title}>
<SidebarMenuButton
className="hover:bg-muted cursor-pointer"
onClick={() => {
if (item.external) {
window.open(item.url, "_blank");
} else {
router.replace(item.url);
}
if (isMobile) {
_sidebar.setOpenMobile(false);
}
}}
asChild
tooltip={item.title}
>
<div>
<item.icon />
<span>{item.title}</span>
</div>
</SidebarMenuButton>
</SidebarMenuItem>
))}
</SidebarMenu>
</SidebarGroup>
))}
{Object.entries(data).map(([key, items]) => (
<SidebarGroup
key={key}
className={key === "footer" ? "mt-auto mb-10" : ""}
>
{key !== "footer" && (
<SidebarGroupLabel>
{labelMap[key] || key.charAt(0).toUpperCase() + key.slice(1)}
</SidebarGroupLabel>
)}
<SidebarMenu>
{items.map((item) => (
<SidebarMenuItem key={item.title}>
<SidebarMenuButton
className="hover:bg-muted cursor-pointer"
onClick={() => {
if (item.external) {
window.open(item.url, "_blank");
} else {
router.replace(item.url);
}
if (isMobile) {
_sidebar.setOpenMobile(false);
}
}}
asChild
tooltip={item.title}
>
<div>
<item.icon />
<span>{item.title}</span>
</div>
</SidebarMenuButton>
</SidebarMenuItem>
))}
</SidebarMenu>
</SidebarGroup>
))}
</SidebarContent>
</Sidebar>
<SidebarInset>{children}</SidebarInset>
Expand Down
41 changes: 18 additions & 23 deletions apps/app/components/welcome/featured/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -59,13 +59,12 @@ export const pipelines = [
},
];


const dummyPlaybackIds = [
"9d5e2cjr1m1gjkfx",
"9d5e2cjr1m1gjkfx",
"9d5e2cjr1m1gjkfx",
"9d5e2cjr1m1gjkfx",
]
];

export default function Winners() {
return (
Expand All @@ -74,7 +73,8 @@ export default function Winners() {
<div>
<h3 className="font-medium text-lg">Yesterday's Challenge Winners</h3>
<p className="text-muted-foreground text-sm w-full">
Here are the winners of yesterday's prompt challenge. Check out the AI streams and give them a shoutout!
Here are the winners of yesterday's prompt challenge. Check out the
AI streams and give them a shoutout!
</p>
</div>
<div>
Expand All @@ -89,28 +89,23 @@ export default function Winners() {
</div>
<div className="grid md:grid-cols-4 gap-6 mt-4">
{dummyPlaybackIds.map((playbackId) => (
<div className="aspect-video relative">
<iframe
src={`https://monster.lvpr.tv/?v=${playbackId}`}
className="w-full h-full"
/>
<div className="absolute top-2 right-2 z-10 overflow-auto">
<div
className={
"flex items-center gap-1 overflow-hidden rounded-full bg-white pr-2 py-0.5 text-black text-xs"
}
>
<Image
src="https://github.com/suhailkakar.png"
alt="suhail"
width={100}
height={100}
className="h-5 w-5 flex-shrink-0 rounded-full "
<div className="aspect-video relative">
<iframe
src={`https://monster.lvpr.tv/?v=${playbackId}`}
className="w-full h-full"
/>
@johndoe
<div className="absolute top-2 right-2 z-10 overflow-auto">
<Link
href={`https://example.com`}
target="_blank"
className={
"flex items-center gap-1 overflow-hidden rounded-full bg-white px-2 py-0.5 text-black text-xs"
}
>
@johndoe
</Link>
</div>
</div>
</div>
</div>
))}
</div>
</div>
Expand Down

0 comments on commit 177073e

Please sign in to comment.