diff --git a/remotion/Contributions/PlanetEntrance.tsx b/remotion/Contributions/PlanetEntrance.tsx index 1d5bc146..ff8a9f81 100644 --- a/remotion/Contributions/PlanetEntrance.tsx +++ b/remotion/Contributions/PlanetEntrance.tsx @@ -4,8 +4,8 @@ import { type Planet } from "../../src/config"; import { getPlanetFile } from "../planets"; export const PlanetEntrance: React.FC<{ - planet: Planet; - frame: number; + readonly planet: Planet; + readonly frame: number; }> = ({ planet, frame }) => { const planetSize = interpolate(frame, [80, 180], [0, 1200], { extrapolateRight: "clamp", diff --git a/remotion/EndScene/CallToAction.tsx b/remotion/EndScene/CallToAction.tsx index be3da5c8..fc353bab 100644 --- a/remotion/EndScene/CallToAction.tsx +++ b/remotion/EndScene/CallToAction.tsx @@ -11,9 +11,9 @@ const padding = 10; const iconHeight = 120; export const CallToAction: React.FC<{ - exitProgress: number; - enterProgress: number; - planet: Planet; + readonly exitProgress: number; + readonly enterProgress: number; + readonly planet: Planet; }> = ({ exitProgress, enterProgress, planet }) => { const startDistance = 10; const stillDistance = 1; diff --git a/remotion/EndScene/HidePlanet.tsx b/remotion/EndScene/HidePlanet.tsx index 57b9f442..ff540751 100644 --- a/remotion/EndScene/HidePlanet.tsx +++ b/remotion/EndScene/HidePlanet.tsx @@ -3,9 +3,9 @@ import { AbsoluteFill } from "remotion"; import type { Planet } from "../../src/config"; export const HidePlanets: React.FC<{ - children: React.ReactNode; - planet: Planet; - exitProgress: number; + readonly children: React.ReactNode; + readonly planet: Planet; + readonly exitProgress: number; }> = ({ children, exitProgress }) => { return ( = ({ rocket, planetType }) => { const frame = useCurrentFrame(); diff --git a/remotion/EndScene/PlanetBackground.tsx b/remotion/EndScene/PlanetBackground.tsx index ca2a7dbe..1105b33b 100644 --- a/remotion/EndScene/PlanetBackground.tsx +++ b/remotion/EndScene/PlanetBackground.tsx @@ -17,7 +17,7 @@ export const prefetchPlanetLandingBackground = (planet: Planet): string[] => { }; export const PlanetBackground: React.FC<{ - planet: Planet; + readonly planet: Planet; }> = ({ planet }) => { const frame = useCurrentFrame(); diff --git a/remotion/EndScene/Threads.tsx b/remotion/EndScene/Threads.tsx index c2810cf8..940c1de3 100644 --- a/remotion/EndScene/Threads.tsx +++ b/remotion/EndScene/Threads.tsx @@ -79,7 +79,7 @@ type ThreadT = { orbs: Array<{ top: number; type: number }>; }; -const Thread = (props: { thread: ThreadT }) => { +const Thread = (props: { readonly thread: ThreadT }) => { const frame = useCurrentFrame(); return ( diff --git a/remotion/IGStory/BarChart.tsx b/remotion/IGStory/BarChart.tsx index 31a0f46b..13531795 100644 --- a/remotion/IGStory/BarChart.tsx +++ b/remotion/IGStory/BarChart.tsx @@ -3,9 +3,9 @@ import { z } from "zod"; import { PANE_BACKGROUND, PANE_BORDER } from "../TopLanguages/Pane"; const Bar: React.FC<{ - progress: number; - letter: string; - most: boolean; + readonly progress: number; + readonly letter: string; + readonly most: boolean; }> = ({ progress, letter, most }) => { return (
; + readonly graphData: z.infer; }> = ({ graphData }) => { const highest = Math.max(...graphData.map((g) => g)); diff --git a/remotion/IGStory/GraphData.tsx b/remotion/IGStory/GraphData.tsx index 53dcdd33..ed25b2b6 100644 --- a/remotion/IGStory/GraphData.tsx +++ b/remotion/IGStory/GraphData.tsx @@ -2,9 +2,9 @@ import React from "react"; import { interpolateColors } from "remotion"; const Dot: React.FC<{ - index: number; - value: number; - max: number; + readonly index: number; + readonly value: number; + readonly max: number; }> = ({ index, max, value }) => { const row = index % 7; const column = Math.floor(index / 7); @@ -31,7 +31,7 @@ const Dot: React.FC<{ }; export const ContributionGraphic: React.FC<{ - graphData: number[]; + readonly graphData: number[]; }> = ({ graphData }) => { return (
= ({ issues }) => { return (
= ({ issues, contributionData, diff --git a/remotion/Issues/GlowStick.tsx b/remotion/Issues/GlowStick.tsx index 88ac25e1..6e71e500 100644 --- a/remotion/Issues/GlowStick.tsx +++ b/remotion/Issues/GlowStick.tsx @@ -14,10 +14,10 @@ const IMAGE_HEIGHT = 165; const STICK_PADDING_TOP = 10; export const GlowStick: React.FC<{ - targetX: number; - targetY: number; - shootDelay: number; - duration: number; + readonly targetX: number; + readonly targetY: number; + readonly shootDelay: number; + readonly duration: number; }> = ({ targetX, targetY, shootDelay, duration }) => { const angleRadians = getAngleForShoot(targetX, targetY); diff --git a/remotion/Issues/Rocket.tsx b/remotion/Issues/Rocket.tsx index b4ccff6c..76d0449f 100644 --- a/remotion/Issues/Rocket.tsx +++ b/remotion/Issues/Rocket.tsx @@ -23,9 +23,9 @@ export const RocketComponent = ({ rocket, ...props }: SVGProps & { - shots: ShotWithShootDelay[]; - jumpIn: number; - rocket: Rocket; + readonly shots: ShotWithShootDelay[]; + readonly jumpIn: number; + readonly rocket: Rocket; }) => { const frame = useCurrentFrame(); diff --git a/remotion/Issues/Ufo.tsx b/remotion/Issues/Ufo.tsx index ce3b19e9..a10c9c91 100644 --- a/remotion/Issues/Ufo.tsx +++ b/remotion/Issues/Ufo.tsx @@ -16,14 +16,14 @@ export const Ufo = ({ columns, ...props }: SVGProps & { - x: number; - y: number; - scale: number; - columns: number; - column: number; - explodeAfter: number; - yOffset: number; - exit: number; + readonly x: number; + readonly y: number; + readonly scale: number; + readonly columns: number; + readonly column: number; + readonly explodeAfter: number; + readonly yOffset: number; + readonly exit: number; }) => { const actualUfoWidth = UFO_WIDTH * scale; const actualUfoHeight = UFO_HEIGHT * scale; diff --git a/remotion/Issues/ZeroIssues.tsx b/remotion/Issues/ZeroIssues.tsx index 438cb95a..19b410b3 100644 --- a/remotion/Issues/ZeroIssues.tsx +++ b/remotion/Issues/ZeroIssues.tsx @@ -17,7 +17,7 @@ const UFOS = 9; export const ZERO_ISSUES_DURATION = 140; const UfoPosition: React.FC<{ - index: number; + readonly index: number; }> = ({ index }) => { const frame = useCurrentFrame(); const { fps } = useVideoConfig(); diff --git a/remotion/OgImage/BarChart.tsx b/remotion/OgImage/BarChart.tsx index dbaf82fd..eebd4965 100644 --- a/remotion/OgImage/BarChart.tsx +++ b/remotion/OgImage/BarChart.tsx @@ -3,9 +3,9 @@ import { z } from "zod"; import { PANE_BACKGROUND, PANE_BORDER } from "../TopLanguages/Pane"; const Bar: React.FC<{ - progress: number; - letter: string; - most: boolean; + readonly progress: number; + readonly letter: string; + readonly most: boolean; }> = ({ progress, letter, most }) => { return (
; + readonly graphData: z.infer; }> = ({ graphData }) => { const highest = Math.max(...graphData.map((g) => g)); diff --git a/remotion/OgImage/GraphData.tsx b/remotion/OgImage/GraphData.tsx index 98a749cb..76d61b49 100644 --- a/remotion/OgImage/GraphData.tsx +++ b/remotion/OgImage/GraphData.tsx @@ -2,9 +2,9 @@ import React from "react"; import { interpolateColors } from "remotion"; const Dot: React.FC<{ - index: number; - value: number; - max: number; + readonly index: number; + readonly value: number; + readonly max: number; }> = ({ index, max, value }) => { const row = index % 7; const column = Math.floor(index / 7); @@ -31,7 +31,7 @@ const Dot: React.FC<{ }; export const ContributionGraphic: React.FC<{ - graphData: number[]; + readonly graphData: number[]; }> = ({ graphData }) => { return (
= ({ issues }) => { return (
= ({ issues, contributionData, diff --git a/remotion/Opening/RocketFront.tsx b/remotion/Opening/RocketFront.tsx index c82197cd..c415e7b2 100644 --- a/remotion/Opening/RocketFront.tsx +++ b/remotion/Opening/RocketFront.tsx @@ -2,7 +2,7 @@ import { AbsoluteFill, Img } from "remotion"; import type { Rocket } from "../../src/config"; import { getSideRocketSource } from "../Spaceship"; -const SvgComponent = (props: { rocket: Rocket }) => ( +const SvgComponent = (props: { readonly rocket: Rocket }) => ( { }; export const TakeOff: React.FC<{ - rocket: Rocket; + readonly rocket: Rocket; }> = ({ rocket }) => { const frame = useCurrentFrame(); const acceleratedFrame = remapSpeed(frame, takeOffSpeedFucntion); diff --git a/remotion/Poof/index.tsx b/remotion/Poof/index.tsx index 3f05b185..4d258d4a 100644 --- a/remotion/Poof/index.tsx +++ b/remotion/Poof/index.tsx @@ -284,9 +284,9 @@ const PoofSprite: React.FC = () => { }; export const Poof: React.FC<{ - x: number; - y: number; - ufoScale: number; + readonly x: number; + readonly y: number; + readonly ufoScale: number; }> = ({ x, y, ufoScale }) => { const actualScale = ufoScale * 1.5; diff --git a/remotion/Productivity/TabletSVG.tsx b/remotion/Productivity/TabletSVG.tsx index edcc8273..0b1d4085 100644 --- a/remotion/Productivity/TabletSVG.tsx +++ b/remotion/Productivity/TabletSVG.tsx @@ -4,6 +4,6 @@ import { Img, staticFile } from "remotion"; export const TABLET_BG = "#080817"; export const HANDS_ASSET = staticFile("hands.png"); -export const TabletSVG = (props: { style: React.CSSProperties }) => ( +export const TabletSVG = (props: { readonly style: React.CSSProperties }) => ( ); diff --git a/remotion/Productivity/Wheel.tsx b/remotion/Productivity/Wheel.tsx index a5247c74..d9da3428 100644 --- a/remotion/Productivity/Wheel.tsx +++ b/remotion/Productivity/Wheel.tsx @@ -42,12 +42,12 @@ const WHEEL_INIT_SPEED = wheelSpring({ fps: FPS, frame: 0, delay: 0 }); export const Wheel: React.FC<{ - value: string; - values: string[]; - radius: number; - renderLabel: (value: string) => React.ReactNode; - delay: number; - soundDelay: number; + readonly value: string; + readonly values: string[]; + readonly radius: number; + readonly renderLabel: (value: string) => React.ReactNode; + readonly delay: number; + readonly soundDelay: number; }> = ({ value, values, radius, renderLabel, delay, soundDelay }) => { const frame = useCurrentFrame(); const { fps } = useVideoConfig(); diff --git a/remotion/PromoVideo/Planets.tsx b/remotion/PromoVideo/Planets.tsx index 325d9cb4..126def27 100644 --- a/remotion/PromoVideo/Planets.tsx +++ b/remotion/PromoVideo/Planets.tsx @@ -22,7 +22,7 @@ const PLANETS_ASSETS = [ ]; export const Planets: React.FC<{ - layout: PromoVideoLayout; + readonly layout: PromoVideoLayout; }> = ({ layout }) => { const { height, width, fps } = useVideoConfig(); const frame = useCurrentFrame(); diff --git a/remotion/PromoVideo/PromoVideoCTA.tsx b/remotion/PromoVideo/PromoVideoCTA.tsx index 290c2cac..8a565082 100644 --- a/remotion/PromoVideo/PromoVideoCTA.tsx +++ b/remotion/PromoVideo/PromoVideoCTA.tsx @@ -13,7 +13,7 @@ import { RemotionShineEffect } from "../PullRequests/RemotionShineEffect"; import type { PromoVideoLayout } from "./promo-video-layout"; export const PromoVideoCallToAction: React.FC<{ - layout: PromoVideoLayout; + readonly layout: PromoVideoLayout; }> = ({ layout }) => { const frame = useCurrentFrame(); const { fps } = useVideoConfig(); diff --git a/remotion/PromoVideo/Title.tsx b/remotion/PromoVideo/Title.tsx index b172dba3..69dfbe85 100644 --- a/remotion/PromoVideo/Title.tsx +++ b/remotion/PromoVideo/Title.tsx @@ -14,7 +14,7 @@ import { RocketFront } from "../TopLanguages/svgs/FrontRocketSource"; import type { PromoVideoLayout } from "./promo-video-layout"; export const PromoVideoTitle: React.FC<{ - layout: PromoVideoLayout; + readonly layout: PromoVideoLayout; }> = ({ layout }) => { const frame = useCurrentFrame(); const { fps } = useVideoConfig(); diff --git a/remotion/PromoVideo/Title2.tsx b/remotion/PromoVideo/Title2.tsx index efa30742..3ecebb26 100644 --- a/remotion/PromoVideo/Title2.tsx +++ b/remotion/PromoVideo/Title2.tsx @@ -11,7 +11,7 @@ import { RemotionShineEffect } from "../PullRequests/RemotionShineEffect"; import type { PromoVideoLayout } from "./promo-video-layout"; export const YourYearInReview: React.FC<{ - layout: PromoVideoLayout; + readonly layout: PromoVideoLayout; }> = ({ layout }) => { const widthWidth = layout === "short" ? 800 : 350; const frame = useCurrentFrame(); diff --git a/remotion/PullRequests/MergeNumber.tsx b/remotion/PullRequests/MergeNumber.tsx index 78e80042..924d0a55 100644 --- a/remotion/PullRequests/MergeNumber.tsx +++ b/remotion/PullRequests/MergeNumber.tsx @@ -2,7 +2,7 @@ import React from "react"; import { PANE_TEXT_COLOR } from "../TopLanguages/Pane"; export const MergeNumber: React.FC<{ - num: number; + readonly num: number; }> = ({ num }) => { return (
= ({ borderRadius, width, height, id }) => { const ref = useRef(null); const linearGradient = useRef(null); diff --git a/remotion/PullRequests/WholePaths.tsx b/remotion/PullRequests/WholePaths.tsx index a1cb5f85..28d21358 100644 --- a/remotion/PullRequests/WholePaths.tsx +++ b/remotion/PullRequests/WholePaths.tsx @@ -12,8 +12,8 @@ import { PATH_ANIMATION_DURATION, Path } from "./Path"; import { makeRandomPath } from "./make-random-path"; export const WholePaths: React.FC<{ - extraPaths: number; - initialPullRequests: number; + readonly extraPaths: number; + readonly initialPullRequests: number; }> = ({ extraPaths, initialPullRequests }) => { const frame = useCurrentFrame(); diff --git a/remotion/ShineEffect.tsx b/remotion/ShineEffect.tsx index 8d1419c0..999e53ac 100644 --- a/remotion/ShineEffect.tsx +++ b/remotion/ShineEffect.tsx @@ -4,7 +4,7 @@ import React, { useEffect, useMemo, useRef, useState } from "react"; import { AbsoluteFill } from "remotion"; export const ShineEffect: React.FC<{ - borderRadius: number; + readonly borderRadius: number; }> = ({ borderRadius }) => { const ref = useRef(null); const linearGradient = useRef(null); diff --git a/remotion/Spaceship.tsx b/remotion/Spaceship.tsx index 46f8f3f6..0edb5d4c 100644 --- a/remotion/Spaceship.tsx +++ b/remotion/Spaceship.tsx @@ -13,7 +13,7 @@ export const getSideRocketSource = (rocket: Rocket) => { return staticFile("rocket-side-yellow.png"); }; -export const RocketSide = (props: { rocket: Rocket }) => ( +export const RocketSide = (props: { readonly rocket: Rocket }) => ( = ({ x, y, scale, currentFrame, startFrame }) => { const actualScale = scale * 1.5; diff --git a/remotion/StarSprite/index.tsx b/remotion/StarSprite/index.tsx index c1a9e778..31ab9817 100644 --- a/remotion/StarSprite/index.tsx +++ b/remotion/StarSprite/index.tsx @@ -15,7 +15,7 @@ const BIGGEST_HEIGHT = 284; export const STAR_EXPLODE_DURATION = 8; export const StarSprite: React.FC<{ - burstFrame?: number; + readonly burstFrame?: number; }> = ({ burstFrame }) => { const frame = useCurrentFrame(); diff --git a/remotion/StarsGiven/CustomScreen.tsx b/remotion/StarsGiven/CustomScreen.tsx index 5cecf70a..c0635784 100644 --- a/remotion/StarsGiven/CustomScreen.tsx +++ b/remotion/StarsGiven/CustomScreen.tsx @@ -2,7 +2,7 @@ import React from "react"; import { AbsoluteFill } from "remotion"; export const CockpitRightScreen: React.FC<{ - children: React.ReactNode; + readonly children: React.ReactNode; }> = ({ children }) => { return ( = ({ children }) => { const outer: React.CSSProperties = useMemo(() => { return { diff --git a/remotion/StarsGiven/Shines.tsx b/remotion/StarsGiven/Shines.tsx index 42039162..8f852c85 100644 --- a/remotion/StarsGiven/Shines.tsx +++ b/remotion/StarsGiven/Shines.tsx @@ -109,8 +109,8 @@ export const Shine: React.FC> = ({ }; const ShineSequence: React.FC<{ - rotationShake: number; - i: number; + readonly rotationShake: number; + readonly i: number; }> = ({ i, rotationShake }) => { return ( = ({ xShake, yShake, rotationShake }) => { const sequences = useMemo(() => { return new Array(150).fill(true).map((a, i) => { diff --git a/remotion/StarsGiven/Star.tsx b/remotion/StarsGiven/Star.tsx index 8a0e9317..81910036 100644 --- a/remotion/StarsGiven/Star.tsx +++ b/remotion/StarsGiven/Star.tsx @@ -41,9 +41,9 @@ export const getStarBurstFirstFrame = ({ }; export const Star: React.FC<{ - duration: number; - angle: number; - hitSpaceship: null | { index: number }; + readonly duration: number; + readonly angle: number; + readonly hitSpaceship: null | { index: number }; }> = ({ duration, angle, hitSpaceship }) => { const frame = useCurrentFrame(); diff --git a/remotion/TopLanguages/FloatingOctocat.tsx b/remotion/TopLanguages/FloatingOctocat.tsx index edbbbb9a..eb6d84db 100644 --- a/remotion/TopLanguages/FloatingOctocat.tsx +++ b/remotion/TopLanguages/FloatingOctocat.tsx @@ -5,7 +5,7 @@ import { OctocatBody } from "../../vite/VideoPage/Background/Octocat-body"; import { NewOctocatLine } from "./NewOctocatLine"; import { getOctocatLine } from "./octocat-line"; -export const FloatingOctocat: React.FC<{}> = ({}) => { +export const FloatingOctocat: React.FC<{}> = () => { const frame = useCurrentFrame(); const { fps } = useVideoConfig(); diff --git a/remotion/TopLanguages/Language.tsx b/remotion/TopLanguages/Language.tsx index 42644003..d22f992c 100644 --- a/remotion/TopLanguages/Language.tsx +++ b/remotion/TopLanguages/Language.tsx @@ -4,8 +4,8 @@ import type { PlanetInfo } from "./constants"; import { StandardPlanet } from "./svgs/planets/StandardPlanet"; export const LanguagePlanet: React.FC<{ - planetInfo: PlanetInfo; - style: React.CSSProperties; + readonly planetInfo: PlanetInfo; + readonly style: React.CSSProperties; }> = ({ planetInfo, style }) => { if (planetInfo.source) { return ; diff --git a/remotion/TopLanguages/LanguageDescription.tsx b/remotion/TopLanguages/LanguageDescription.tsx index 737b39d1..7d5e4a18 100644 --- a/remotion/TopLanguages/LanguageDescription.tsx +++ b/remotion/TopLanguages/LanguageDescription.tsx @@ -11,10 +11,10 @@ import type { languageSchema } from "../../src/config"; import { InnerLanguageDescription } from "./InnerLanguageDescription"; export const LanguageDescription: React.FC<{ - language: z.infer; - position: number; - delay: number; - duration: number; + readonly language: z.infer; + readonly position: number; + readonly delay: number; + readonly duration: number; }> = ({ language, position, delay, duration }) => { const frame = useCurrentFrame(); const { fps } = useVideoConfig(); diff --git a/remotion/TopLanguages/NewOctocatLine.tsx b/remotion/TopLanguages/NewOctocatLine.tsx index 987a0a74..a2cf05f4 100644 --- a/remotion/TopLanguages/NewOctocatLine.tsx +++ b/remotion/TopLanguages/NewOctocatLine.tsx @@ -6,8 +6,8 @@ const getLeftColor = () => { }; export const NewOctocatLine: React.FC<{ - progress: number; - d: string; + readonly progress: number; + readonly d: string; }> = ({ progress, d }) => { const { strokeDasharray, strokeDashoffset } = evolvePath(progress, d); diff --git a/remotion/TopLanguages/RotatingPlanet.tsx b/remotion/TopLanguages/RotatingPlanet.tsx index d29138a4..bddaa9eb 100644 --- a/remotion/TopLanguages/RotatingPlanet.tsx +++ b/remotion/TopLanguages/RotatingPlanet.tsx @@ -29,7 +29,7 @@ const planetStyle: React.CSSProperties = { }; export const RotatingPlanet: React.FC<{ - randomSeed: string; + readonly randomSeed: string; }> = ({ randomSeed }) => { const sortedRandomly = useMemo(() => { return planets.slice().sort((a) => { diff --git a/remotion/TopLanguages/svgs/FrontRocketSource.tsx b/remotion/TopLanguages/svgs/FrontRocketSource.tsx index 7f81c2ed..27d06899 100644 --- a/remotion/TopLanguages/svgs/FrontRocketSource.tsx +++ b/remotion/TopLanguages/svgs/FrontRocketSource.tsx @@ -23,8 +23,8 @@ export const getFrontRocketSource = (rocket: Rocket) => { }; export const RocketFront = (props: { - style?: React.CSSProperties; - rocket: Rocket; + readonly style?: React.CSSProperties; + readonly rocket: Rocket; }) => ( & { - customColor: string | null; + readonly customColor: string | null; }) => { if (!customColor) { throw new Error("customColor is null"); diff --git a/vite/Box/Box.tsx b/vite/Box/Box.tsx index 088efec0..f6f50be4 100644 --- a/vite/Box/Box.tsx +++ b/vite/Box/Box.tsx @@ -3,9 +3,9 @@ import React from "react"; import styles from "./styles.module.css"; export const Box: React.FC<{ - children: ReactNode; - style?: React.CSSProperties; - className?: string; + readonly children: ReactNode; + readonly style?: React.CSSProperties; + readonly className?: string; }> = ({ style, className, children }) => { return (
diff --git a/vite/Button/Button.tsx b/vite/Button/Button.tsx index a8e8937c..77621885 100644 --- a/vite/Button/Button.tsx +++ b/vite/Button/Button.tsx @@ -8,15 +8,15 @@ import styles from "./styles.module.css"; const ButtonForward: React.ForwardRefRenderFunction< HTMLButtonElement, { - onClick?: () => void; - disabled?: boolean; - children: React.ReactNode; - loading?: boolean; - primary?: boolean; - style?: React.CSSProperties; - className?: string; - type?: ButtonHTMLAttributes["type"]; - hoverEffect?: boolean; + readonly onClick?: () => void; + readonly disabled?: boolean; + readonly children: React.ReactNode; + readonly loading?: boolean; + readonly primary?: boolean; + readonly style?: React.CSSProperties; + readonly className?: string; + readonly type?: ButtonHTMLAttributes["type"]; + readonly hoverEffect?: boolean; } > = ( { diff --git a/vite/HomeBox/HomeBox.tsx b/vite/HomeBox/HomeBox.tsx index 1c419faa..dc052ebe 100644 --- a/vite/HomeBox/HomeBox.tsx +++ b/vite/HomeBox/HomeBox.tsx @@ -6,8 +6,8 @@ import { HomeBoxTop } from "./HomeBoxTop"; import styles from "./styles.module.css"; export const HomeBox: React.FC<{ - userNotFound: boolean; - setUserNotFound: React.Dispatch>; + readonly userNotFound: boolean; + readonly setUserNotFound: React.Dispatch>; }> = (props) => { return ( >; + readonly userNotFound: boolean; + readonly setUserNotFound: React.Dispatch>; }; const getRandomUsername = () => { diff --git a/vite/HomeLink/index.tsx b/vite/HomeLink/index.tsx index 8d94d5b5..f43ca69f 100644 --- a/vite/HomeLink/index.tsx +++ b/vite/HomeLink/index.tsx @@ -3,9 +3,9 @@ import React from "react"; import styles from "./styles.module.css"; export const HomeLink: React.FC<{ - label: string; - icon: (params: { height: number; width: number; color: string }) => ReactNode; - href: string; + readonly label: string; + readonly icon: (params: { height: number; width: number; color: string }) => ReactNode; + readonly href: string; }> = ({ label, icon, href }) => { return ( diff --git a/vite/Input/Input.tsx b/vite/Input/Input.tsx index bd5cd0be..0dbaaecb 100644 --- a/vite/Input/Input.tsx +++ b/vite/Input/Input.tsx @@ -2,13 +2,13 @@ import React from "react"; import styles from "./styles.module.css"; export const Input: React.FC<{ - text: string; - setText: (v: string) => void; - disabled?: boolean; - placeHolder?: string; - style?: React.CSSProperties; - invalid?: boolean; - className?: string; + readonly text: string; + readonly setText: (v: string) => void; + readonly disabled?: boolean; + readonly placeHolder?: string; + readonly style?: React.CSSProperties; + readonly invalid?: boolean; + readonly className?: string; }> = ({ text, setText, disabled, placeHolder, style, invalid, className }) => { return ( = ({ size }) => { const style = useMemo(() => { return { diff --git a/vite/VideoPage/Actions/SharingActions.tsx b/vite/VideoPage/Actions/SharingActions.tsx index 60da7dde..0e4a4f73 100644 --- a/vite/VideoPage/Actions/SharingActions.tsx +++ b/vite/VideoPage/Actions/SharingActions.tsx @@ -12,7 +12,7 @@ export const twitterSharingLink = `https://twitter.com/intent/tweet?text=${encod export const linkedInSharingLink = "https://www.linkedin.com/"; -export const SharingActions: React.FC<{}> = ({}) => { +export const SharingActions: React.FC<{}> = () => { const { username } = userRoute.useParams(); return (
diff --git a/vite/VideoPage/Background/Earth.tsx b/vite/VideoPage/Background/Earth.tsx index 71f411d5..2ad814d5 100644 --- a/vite/VideoPage/Background/Earth.tsx +++ b/vite/VideoPage/Background/Earth.tsx @@ -1,6 +1,6 @@ import React from "react"; -export const Earth: React.FC<{ className?: string }> = ({ className }) => { +export const Earth: React.FC<{ readonly className?: string }> = ({ className }) => { return ( { }; export const MobileActionsContainer: React.FC<{ - loadingState: LoadingState; + readonly loadingState: LoadingState; }> = ({ loadingState }) => { const navigate = useNavigate({ from: videoRoute.id }); diff --git a/vite/VideoPage/Player/PlayButton.tsx b/vite/VideoPage/Player/PlayButton.tsx index 2949e6f4..9fe02e42 100644 --- a/vite/VideoPage/Player/PlayButton.tsx +++ b/vite/VideoPage/Player/PlayButton.tsx @@ -8,8 +8,8 @@ import styles from "./playbutton.module.css"; const HIDE_ANIMATION = 500; export const PlayButton: React.FC<{ - onPlay: (e: React.MouseEvent) => void; - progress: number; + readonly onPlay: (e: React.MouseEvent) => void; + readonly progress: number; }> = ({ onPlay, progress }) => { const ref = useRef(null); diff --git a/vite/VideoPage/Player/PlayState.tsx b/vite/VideoPage/Player/PlayState.tsx index 0daa68d8..3b89188f 100644 --- a/vite/VideoPage/Player/PlayState.tsx +++ b/vite/VideoPage/Player/PlayState.tsx @@ -5,10 +5,10 @@ import type { Planet, Rocket, TopLanguage } from "../../../src/config"; import { PlayButton } from "./PlayButton"; export const PlayState: React.FC<{ - isPlaying: boolean; - onClickPlayButton: (e: React.MouseEvent) => void; - onClickPauseButton: () => void; - props: { + readonly isPlaying: boolean; + readonly onClickPlayButton: (e: React.MouseEvent) => void; + readonly onClickPauseButton: () => void; + readonly props: { rocket: Rocket; planetType: Planet; durationInFrames: number; diff --git a/vite/VideoPage/Player/PrefetchProgress.tsx b/vite/VideoPage/Player/PrefetchProgress.tsx index 6ec63e3e..6717163c 100644 --- a/vite/VideoPage/Player/PrefetchProgress.tsx +++ b/vite/VideoPage/Player/PrefetchProgress.tsx @@ -3,7 +3,7 @@ import React from "react"; import { AbsoluteFill } from "remotion"; export const PrefetchProgress: React.FC<{ - progress: number; + readonly progress: number; }> = ({ progress }) => { return ( = ({ style, ...props }) => { const { status, loadingState } = useUserVideo(); diff --git a/vite/VideoPage/Sidebar/Sidebar.tsx b/vite/VideoPage/Sidebar/Sidebar.tsx index e4d7bb34..910b0150 100644 --- a/vite/VideoPage/Sidebar/Sidebar.tsx +++ b/vite/VideoPage/Sidebar/Sidebar.tsx @@ -10,12 +10,12 @@ import { DownloadButton } from "./DownloadButton"; import styles from "./styles.module.css"; export const Sidebar: React.FC<{ - inputProps: z.infer; - setIsModalOpen: React.Dispatch>; - rocket: Rocket; - setIsPlaying: React.Dispatch>; - playerRef: React.RefObject; - status: RenderStatus; + readonly inputProps: z.infer; + readonly setIsModalOpen: React.Dispatch>; + readonly rocket: Rocket; + readonly setIsPlaying: React.Dispatch>; + readonly playerRef: React.RefObject; + readonly status: RenderStatus; }> = ({ inputProps, status, diff --git a/vite/VideoPage/VideoBox.tsx b/vite/VideoPage/VideoBox.tsx index 02e0740f..639ee347 100644 --- a/vite/VideoPage/VideoBox.tsx +++ b/vite/VideoPage/VideoBox.tsx @@ -14,11 +14,11 @@ import { VideoBoxTop } from "./VideoBoxTop"; import styles from "./styles.module.css"; export const VideoBox: React.FC<{ - inputProps: z.infer; - rocket: Rocket; - setRocket: React.Dispatch>; - isModalOpen: boolean; - setIsModalOpen: React.Dispatch>; + readonly inputProps: z.infer; + readonly rocket: Rocket; + readonly setRocket: React.Dispatch>; + readonly isModalOpen: boolean; + readonly setIsModalOpen: React.Dispatch>; }> = ({ inputProps, rocket, setRocket, isModalOpen, setIsModalOpen }) => { const [isPlaying, setIsPlaying] = useState(false); const playerRef = useRef(null); diff --git a/vite/context.tsx b/vite/context.tsx index fcd906f5..e146641f 100644 --- a/vite/context.tsx +++ b/vite/context.tsx @@ -20,8 +20,8 @@ type ContextType = { const UserVideoContext = React.createContext(null); const UserVideoProvider: React.FC<{ - children: ReactNode; - user: ProfileStats; + readonly children: ReactNode; + readonly user: ProfileStats; }> = ({ children, user }) => { const { compositionParams, setRocket } = useCompositionParams(user); const status = useVideo({ @@ -105,7 +105,7 @@ const UserVideoProvider: React.FC<{ ); }; -export const UserVideoContextProvider: React.FC<{ children: ReactNode }> = ({ +export const UserVideoContextProvider: React.FC<{ readonly children: ReactNode }> = ({ children, }) => { const user = window.__USER__;