Fix Plyr controls and site_settings permissions
## Changes ### Video Player CSS Overlay Fix - Moved overlay inside plyr__video-embed container - Added check for plyr__control--overlaid (play button) - Now only blocks YouTube iframe, not Plyr controls - Preserves full functionality of play button, progress bar, etc. ### Site Settings Permissions - Added RLS policy to make site_settings publicly readable - All authenticated users can now access brand_accent_color - Fixes 404 error when members try to fetch accent color ## Technical Details - Overlay now properly allows clicks through to Plyr controls - Site settings now accessible via public RLS policy for authenticated users 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -192,29 +192,31 @@ export const VideoPlayerWithChapters = forwardRef<VideoPlayerRef, VideoPlayerWit
|
||||
const youtubeId = effectiveVideoUrl ? getYouTubeId(effectiveVideoUrl) : null;
|
||||
|
||||
return (
|
||||
<div className={`relative ${className}`}>
|
||||
{/* CSS Overlay to block YouTube UI interactions */}
|
||||
<div ref={wrapperRef} className={`plyr__video-embed relative ${className}`}>
|
||||
{youtubeId && (
|
||||
<>
|
||||
{/* CSS Overlay to block YouTube UI interactions - only covers iframe */}
|
||||
<div
|
||||
className="absolute inset-0 z-10 pointer-events-auto"
|
||||
style={{ background: 'transparent' }}
|
||||
onClick={(e) => {
|
||||
// Allow clicks to pass through to Plyr controls
|
||||
const plyrControls = (e.currentTarget.parentElement as HTMLElement)?.querySelector('.plyr__controls');
|
||||
if (plyrControls && plyrControls.contains(e.target as Node)) {
|
||||
const plyrOverlay = (e.currentTarget.parentElement as HTMLElement)?.querySelector('.plyr__control--overlaid');
|
||||
if ((plyrControls && plyrControls.contains(e.target as Node)) ||
|
||||
(plyrOverlay && plyrOverlay.contains(e.target as Node))) {
|
||||
e.stopPropagation();
|
||||
}
|
||||
}}
|
||||
/>
|
||||
<div ref={wrapperRef} className={`plyr__video-embed`}>
|
||||
{youtubeId && (
|
||||
<iframe
|
||||
src={`https://www.youtube-nocookie.com/embed/${youtubeId}?origin=${window.location.origin}&iv_load_policy=3&modestbranding=1&playsinline=1&rel=0&showinfo=0&controls=0&disablekb=1&fs=0`}
|
||||
allowFullScreen
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
className="pointer-events-none"
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
||||
10
supabase/migrations/20251231000001_public_site_settings.sql
Normal file
10
supabase/migrations/20251231000001_public_site_settings.sql
Normal file
@@ -0,0 +1,10 @@
|
||||
-- Make site_settings publicly accessible for accent color
|
||||
-- All users (authenticated) can read brand settings
|
||||
|
||||
DROP POLICY IF EXISTS "site_settings_public_select" ON site_settings;
|
||||
|
||||
CREATE POLICY "site_settings_public_select"
|
||||
ON site_settings
|
||||
FOR SELECT
|
||||
TO authenticated
|
||||
USING (true);
|
||||
Reference in New Issue
Block a user