Fix compiler errrors identified by tsc

Author: webstackdev

src/components/Animations/Computers/client/__tests__/index.spec.ts

@@ -5,6 +5,7 @@ import { experimental_AstroContainer as AstroContainer } from 'astro/container'
 import ComputersAnimationAstro from '@components/Animations/Computers/index.astro'
 import type { ComputersAnimationElement } from '@components/Animations/Computers/client'
 import type { WebComponentModule } from '@components/scripts/@types/webComponentModule'
+import type { AnimationControllerConfig, AnimationControllerHandle } from '@components/scripts/store'
 import { executeRender, withJsdomEnvironment } from '@test/unit/helpers/litRuntime'
 import { gsap } from 'gsap'
 
@@ -51,7 +52,7 @@ const getComputersModule = () => {
 const addScriptBreadcrumbMock = vi.hoisted(() => vi.fn())
 const handleScriptErrorMock = vi.hoisted(() => vi.fn())
 const createAnimationControllerMock = vi.hoisted(() =>
-  vi.fn(() => ({
+  vi.fn((_config: AnimationControllerConfig): AnimationControllerHandle => ({
     requestPlay: vi.fn(),
     requestPause: vi.fn(),
     clearUserPreference: vi.fn(),
@@ -317,7 +318,5 @@ function createTimelineMock() {
 
 const generateUniqueTagName = (): string => `computers-animation-${Math.random().toString(36).slice(2)}`
 
-const getLastControllerHandle = () =>
-  createAnimationControllerMock.mock.results.at(-1)?.value as
-    | ReturnType<typeof createAnimationControllerMock>
-    | undefined
+const getLastControllerHandle = (): AnimationControllerHandle | undefined =>
+  createAnimationControllerMock.mock.results.at(-1)?.value

src/components/CallToAction/Newsletter/client/__tests__/index.spec.ts

@@ -2,7 +2,7 @@
 import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest'
 import { experimental_AstroContainer as AstroContainer } from 'astro/container'
 import Newsletter from '@components/CallToAction/Newsletter/index.astro'
-import type { Props as NewsletterProps } from '@components/CallToAction/Newsletter/index.astro'
+import type { NewsletterProps } from '@components/CallToAction/Newsletter/props'
 import type { NewsletterFormElement } from '@components/CallToAction/Newsletter/client'
 import type { WebComponentModule } from '@components/scripts/@types/webComponentModule'
 import { executeRender } from '@test/unit/helpers/litRuntime'

src/components/CallToAction/Newsletter/client/__tests__/selectors.spec.ts

@@ -2,7 +2,7 @@
 import { beforeEach, describe, expect, test } from 'vitest'
 import { experimental_AstroContainer as AstroContainer } from 'astro/container'
 import Newsletter from '@components/CallToAction/Newsletter/index.astro'
-import type { Props as NewsletterProps } from '@components/CallToAction/Newsletter/index.astro'
+import type { NewsletterProps } from '@components/CallToAction/Newsletter/props'
 import type { NewsletterFormElement } from '@components/CallToAction/Newsletter/client'
 import { SELECTORS, getNewsletterElements } from '@components/CallToAction/Newsletter/client/selectors'
 import type { WebComponentModule } from '@components/scripts/@types/webComponentModule'

src/components/CallToAction/Newsletter/index.astro

@@ -16,17 +16,9 @@
  */
 
 import GDPRConsent from '@components/Consent/Checkbox/index.astro'
+import type { NewsletterProps } from './props'
 
-export interface Props {
-  /** Main heading for the newsletter signup */
-  title?: string
-  /** Supporting description text */
-  description?: string
-  /** Input placeholder text */
-  placeholder?: string
-  /** Submit button text */
-  buttonText?: string
-}
+export type Props = NewsletterProps
 
 const {
   title = 'Stay Updated',

src/components/CallToAction/Newsletter/props.ts

@@ -0,0 +1,10 @@
+export interface NewsletterProps {
+  /** Main heading for the newsletter signup */
+  title?: string
+  /** Supporting description text */
+  description?: string
+  /** Input placeholder text */
+  placeholder?: string
+  /** Submit button text */
+  buttonText?: string
+}

src/components/Carousel/client/__tests__/index.spec.ts

@@ -3,7 +3,7 @@
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { experimental_AstroContainer as AstroContainer } from 'astro/container'
 import CarouselComponent from '@components/Carousel/index.astro'
-import type { Props as CarouselProps } from '@components/Carousel/index.astro'
+import type { CarouselProps } from '@components/Carousel/props'
 import type { CarouselElement } from '@components/Carousel/client'
 import type { WebComponentModule } from '@components/scripts/@types/webComponentModule'
 import { executeRender } from '@test/unit/helpers/litRuntime'

src/components/Carousel/index.astro

@@ -2,33 +2,17 @@
 // Generic Carousel component for displaying content - both featured and suggested
 import { getCollection } from 'astro:content'
 import type { CollectionEntry } from 'astro:content'
+import type { CarouselProps, CollectionKeyMap } from './props'
 
-// Type mapping from prop values to actual collection keys
-type CollectionKeyMap = {
-  services: 'services'
-  'case-studies': 'caseStudies'
-  articles: 'articles'
-}
-
-// Type-safe union of valid collection prop names
-type CollectionPropName = keyof CollectionKeyMap
-
-// Generic interface that infers the collection type from the type prop
-export interface Props<T extends CollectionPropName = CollectionPropName> {
-  title?: string
-  limit?: number
-  variant?: 'featured' | 'suggested' | 'random'
-  currentSlug: string
-  type: T
-}
+export type { CarouselProps as Props } from './props'
 
 const {
   title = 'Featured Content',
   limit = 3,
   variant = 'featured',
   currentSlug,
   type,
-} = Astro.props
+} = Astro.props as CarouselProps
 
 // Map the prop type to the actual collection key with proper typing
 const collectionKey = {

src/components/Carousel/props.ts

@@ -0,0 +1,17 @@
+export type CarouselVariant = 'featured' | 'suggested' | 'random'
+
+export type CollectionKeyMap = {
+  services: 'services'
+  'case-studies': 'caseStudies'
+  articles: 'articles'
+}
+
+export type CollectionPropName = keyof CollectionKeyMap
+
+export interface CarouselProps<T extends CollectionPropName = CollectionPropName> {
+  title?: string
+  limit?: number
+  variant?: CarouselVariant
+  currentSlug: string
+  type: T
+}

src/components/Consent/Checkbox/client/__fixtures__/checkbox.fixture.astro

@@ -1,10 +1,6 @@
 ---
-import ConsentCheckbox, { type Props as ConsentCheckboxProps } from '@components/Consent/Checkbox/index.astro'
-
-export interface CheckboxFixtureProps extends ConsentCheckboxProps {
-  formId?: string
-  wrapInForm?: boolean
-}
+import ConsentCheckbox from '@components/Consent/Checkbox/index.astro'
+import type { CheckboxFixtureProps } from '@components/Consent/Checkbox/client/types'
 
 const fixtureProps: CheckboxFixtureProps = {
   purpose: 'Responding to your inquiry',

src/components/Consent/Checkbox/client/__tests__/testUtils.ts

@@ -1,6 +1,7 @@
 import { expect } from 'vitest'
 import { experimental_AstroContainer as AstroContainer } from 'astro/container'
-import CheckboxFixture, { type CheckboxFixtureProps } from '@components/Consent/Checkbox/client/__fixtures__/checkbox.fixture.astro'
+import CheckboxFixture from '@components/Consent/Checkbox/client/__fixtures__/checkbox.fixture.astro'
+import type { CheckboxFixtureProps } from '@components/Consent/Checkbox/client/types'
 import type { ConsentCheckboxElement } from '@components/Consent/Checkbox/client'
 import type { WebComponentModule } from '@components/scripts/@types/webComponentModule'
 import { executeRender } from '@test/unit/helpers/litRuntime'