Port post embeds to new arch (#7408)

* Direct port of embeds to new arch

(cherry picked from commit cc3fa1f6cea396dd9222486c633a508bfee1ecd6)

* Re-org

* Split out ListEmbed and FeedEmbed

* Split out ImageEmbed

* DRY up a bit

* Port over ExternalLinkEmbed

* Port over Player and Gif embeds

* Migrate ComposerReplyTo

* Replace other usages of old post-embeds

* Migrate view contexts

* Copy pasta VideoEmbed

* Copy pasta GifEmbed

* Swap in new file location

* Clean up

* Fix up native

* Add back in correct moderation on List and Feed embeds

* Format

* Prettier

* delete old video utils

* move bandwidth-estimate.ts

* Remove log

* Add LazyQuoteEmbed for composer use

* Clean up unused things

* Remove remaining items

* Prettier

* Fix imports

* Handle nested quotes same as prod

* Add back silenced error handling

* Fix lint

---------

Co-authored-by: Samuel Newman <mozzius@protonmail.com>

1 files changed, 47 insertions, 0 deletions

diff --git a/src/components/Post/Embed/VideoEmbed/VideoVolumeContext.tsx b/src/components/Post/Embed/VideoEmbed/VideoVolumeContext.tsx
new file mode 100644
index 000000000..6343081da
--- /dev/null
+++ b/src/components/Post/Embed/VideoEmbed/VideoVolumeContext.tsx
@@ -0,0 +1,47 @@
+import React from 'react'
+
+const Context = React.createContext<{
+  // native
+  muted: boolean
+  setMuted: React.Dispatch<React.SetStateAction<boolean>>
+  // web
+  volume: number
+  setVolume: React.Dispatch<React.SetStateAction<number>>
+} | null>(null)
+
+export function Provider({children}: {children: React.ReactNode}) {
+  const [muted, setMuted] = React.useState(true)
+  const [volume, setVolume] = React.useState(1)
+
+  const value = React.useMemo(
+    () => ({
+      muted,
+      setMuted,
+      volume,
+      setVolume,
+    }),
+    [muted, setMuted, volume, setVolume],
+  )
+
+  return <Context.Provider value={value}>{children}</Context.Provider>
+}
+
+export function useVideoVolumeState() {
+  const context = React.useContext(Context)
+  if (!context) {
+    throw new Error(
+      'useVideoVolumeState must be used within a VideoVolumeProvider',
+    )
+  }
+  return [context.volume, context.setVolume] as const
+}
+
+export function useVideoMuteState() {
+  const context = React.useContext(Context)
+  if (!context) {
+    throw new Error(
+      'useVideoMuteState must be used within a VideoVolumeProvider',
+    )
+  }
+  return [context.muted, context.setMuted] as const
+}