@mediacubeco/expo-template-fsd 2.3.1 → 2.4.0

package/.claude/skills/git-commit/SKILL.md

@@ -1,139 +0,0 @@
----
-name: git-commit
-description: Creates git commits with proper messages and decomposes staged/unstaged changes into logical atomic commits. Use this skill whenever the user says "commit", "закоммить", "сделай коммит", "commit changes", "push", or asks to commit anything. Also use when the user asks to split or decompose changes into multiple commits. Always invoke this skill before running any git commit command — it provides the decomposition logic and message format rules for this project.
----
-
-# Git Commit Skill
-
-This skill governs how to commit changes in this repository. The key goals are:
-
-- Every commit is **atomic** — one logical change per commit, easy to revert or cherry-pick
-- Every commit message **starts with the branch identifier** so commits are traceable to their task
-- The message body is **specific and complete** — a future reader can understand what changed without looking at the diff
-
-## Step 1: Understand the branch
-
-Extract the branch identifier by stripping the `feature/` prefix:
-
-```bash
-git branch --show-current
-# feature/CU-869cbv9z3  →  prefix = "CU-869cbv9z3"
-# fix/CU-123abc         →  prefix = "CU-123abc"
-# main                  →  prefix = "" (no prefix, use plain message)
-```
-
-If the branch has no prefix to strip (e.g., `main`, `develop`), commit without a prefix.
-
-## Step 2: Analyze all changes
-
-Run these together to get the full picture:
-
-```bash
-git status
-git diff HEAD
-git diff --cached
-```
-
-Read the actual diff carefully — don't just look at filenames. You need to understand _what_ each change does, not just _where_ it is, to group things correctly.
-
-## Step 3: Decompose into logical commits
-
-This is the most important step. Think like a reviewer who will bisect this history in six months.
-
-**Each commit should answer one question: "What single thing does this do?"**
-
-Good decomposition principles:
-
-- **By concern, not by file** — a component and its corresponding style/hook that only exist to support it belong together
-- **Config/tooling separate from features** — `eslint`, `tsconfig`, `package.json`, `.env` changes are their own commit unless they were added specifically to enable a single feature that's in the same batch
-- **Shared infrastructure separate from consumers** — a new shared component goes in one commit, the screen that uses it goes in another
-- **Refactoring separate from new behavior** — if you cleaned up a file while adding a feature, those are two commits
-- **In FSD terms**: changes that span multiple layers (`shared` + `entities` + `features` + `pages`) usually mean multiple commits — one per layer boundary crossed
-
-Common anti-patterns to avoid:
-
-- One giant commit with "various fixes" — always decompose
-- Splitting one logical unit across commits (e.g., a component in one commit, its required types in another)
-- Committing unrelated files together just because they were modified in the same session
-
-After analyzing, produce a decomposition plan like this (show it mentally, then execute without asking for confirmation unless the decomposition is genuinely ambiguous):
-
-```
-Commit 1: CU-869cbv9z3: add UserEntity and UserResource types
-  → src/shared/lib/api/entities/user.ts
-  → src/shared/lib/api/resources/user.ts
-
-Commit 2: CU-869cbv9z3: add UserRepository with profile endpoint
-  → src/shared/lib/api/models/user-repository.ts
-  → src/shared/lib/api/api.ts (registration only)
-
-Commit 3: CU-869cbv9z3: add profile screen with user data fetching
-  → src/pages/profile/
-  → src/features/profile/
-```
-
-## Step 4: Stage and commit each group
-
-For each commit in the plan, stage exactly the relevant files and commit:
-
-```bash
-# Stage specific files (never use git add . or git add -A)
-git add .
-
-# Commit with the correct message format
-git commit -m "{prefix}: add UserEntity and UserResource types"
-```
-
-Repeat for each commit in the plan.
-
-If a single file contains changes that belong to different logical commits (mixed concerns in one file), use `git add -p` to stage only the relevant hunks:
-
-```bash
-git add -p src/shared/lib/api/api.ts
-```
-
-## Commit message format
-
-```
-BRANCH-ID: short imperative description
-```
-
-Rules:
-
-- Start with the branch ID (everything after `feature/`, `fix/`, `chore/` etc.)
-- Follow with `: ` then the message
-- Use imperative mood: "add", "fix", "remove", "update", "extract" — not "added", "adding", "fixes"
-- Be specific: "add UserEntity with profile fields" beats "add user types"
-- Keep it under 72 characters total
-- No period at the end
-
-**Examples:**
-
-| Situation            | Message                                               |
-| -------------------- | ----------------------------------------------------- |
-| New API types        | `{prefix} - add OrderResource and OrderEntity`        |
-| New screen           | `{prefix} - add checkout screen with order summary`   |
-| Bug fix              | `{prefix} - fix token refresh on 401 response`        |
-| Config change        | `{prefix} - add react-query persistence config`       |
-| Refactor             | `{prefix} - extract AuthHeader into shared component` |
-| Multiple small fixes | `{prefix} - fix navigation types and screen params`   |
-
-## Step 5: Verify
-
-After all commits are done:
-
-```bash
-git log --oneline -10
-```
-
-Each commit should read cleanly as a standalone unit of work. If two adjacent commits feel like they should be one, or one commit feels like it should be two — that's worth noting but not worth amending if already done.
-
-## Edge cases
-
-**Nothing staged, nothing to commit** — say so and stop. Don't create empty commits.
-
-**Only whitespace / formatting changes** — still a valid commit: `{prefix} - format auth module`.
-
-**Single logical change across many files** — fine, that's one commit. Stage all the files together.
-
-**Uncertain decomposition** — if you genuinely cannot tell whether two changes are the same logical unit, keep them together. Atomic is better than artificially split.

package/.gitignore

@@ -1,34 +0,0 @@
-# dependencies
-node_modules/
-yarn-debug.*
-yarn-error.*
-
-# build
-/ios
-/android
-dist/
-web-build/
-.expo/
-.kotlin/
-.DS_Store
-.metro-health-check*
-*.orig.*
-*.pem
-*.jks
-*.p8
-*.p12
-*.key
-*.mobileprovision
-
-# typescript
-*.tsbuildinfo
-
-# secret
-/.secret/*
-!/.secret/README.md
-
-# env
-.env*.local
-
-# ai
-.agents/skills/

package/src/shared/assets/icons/like.tsx

@@ -1,17 +0,0 @@
-import { Path, Svg } from 'react-native-svg'
-import { type IconProps } from './type'
-
-const Like = ({ size, color }: IconProps) => {
-  return (
-    <Svg width={size} height={size} viewBox={'0 0 24 24'} fill={'none'}>
-      <Path
-        d={
-          'M12.0817 17.2109L11.9999 17.2927L11.91 17.2109C8.0272 13.6878 5.46044 11.3581 5.46044 8.99567C5.46044 7.36079 6.6866 6.13463 8.32147 6.13463C9.58033 6.13463 10.8065 6.95207 11.2397 8.06379H12.7602C13.1934 6.95207 14.4196 6.13463 15.6784 6.13463C17.3133 6.13463 18.5395 7.36079 18.5395 8.99567C18.5395 11.3581 15.9727 13.6878 12.0817 17.2109ZM15.6784 4.49976C14.2561 4.49976 12.891 5.16188 11.9999 6.20003C11.1089 5.16188 9.74382 4.49976 8.32147 4.49976C5.80376 4.49976 3.82556 6.46978 3.82556 8.99567C3.82556 12.0774 6.60485 14.6033 10.8147 18.4207L11.9999 19.4998L13.1852 18.4207C17.395 14.6033 20.1743 12.0774 20.1743 8.99567C20.1743 6.46978 18.1961 4.49976 15.6784 4.49976Z'
-        }
-        fill={color}
-      />
-    </Svg>
-  )
-}
-
-export default Like

package/src/shared/hooks/use-animated.ts

@@ -1,200 +0,0 @@
-import { useCallback } from 'react'
-import {
-  createAnimatedComponent as animate,
-  Extrapolation as AnimatedExtrapolation,
-  cancelAnimation,
-  interpolate as reInterpolate,
-  interpolateColor as reInterpolateColor,
-  useAnimatedStyle,
-  useSharedValue,
-  withClamp,
-  withDelay,
-  withRepeat,
-  withSequence,
-  withSpring,
-  withTiming,
-} from 'react-native-reanimated'
-import { runOnJS } from 'react-native-worklets'
-import { type Theme, useThemeMode } from '../lib'
-
-type AnimatedState = string | number
-
-type AnimatedStateRange = string[] | number[]
-
-type AnimatedConfig = {
-  delay?: keyof Theme['DELAYS']
-  duration?: keyof Theme['DURATIONS']
-  repeat?: number
-  clamp?: [min?: AnimatedState, max?: AnimatedState]
-}
-
-const useAnimated = <Value extends AnimatedState = AnimatedState>(
-  initValue: Value,
-  config?: AnimatedConfig
-) => {
-  const value = useSharedValue(initValue)
-  const { DELAYS, DURATIONS } = useThemeMode()
-
-  const {
-    delay: defaultDelay = 'EMPTY',
-    duration: defaultDuration = 'BASE',
-    repeat: defaultRepeat = 1,
-    clamp: defaultCamp = [],
-  } = config ?? {}
-
-  const timing = useCallback(
-    async (newValue: Value, config?: AnimatedConfig) => {
-      const {
-        delay = defaultDelay,
-        duration = defaultDuration,
-        repeat = defaultRepeat,
-        clamp = defaultCamp,
-      } = config ?? {}
-
-      return new Promise((resolve) => {
-        value.value = withDelay(
-          DELAYS[delay],
-          withRepeat(
-            withClamp(
-              { min: clamp[0], max: clamp[1] },
-              withTiming(newValue, { duration: DURATIONS[duration] })
-            ),
-            repeat,
-            false,
-            () => runOnJS(resolve)(undefined)
-          )
-        ) as Value
-      })
-    },
-    [value, defaultDelay, defaultDuration, defaultRepeat, defaultCamp, DELAYS, DURATIONS]
-  )
-
-  const spring = useCallback(
-    async (newValue: Value, config?: AnimatedConfig) => {
-      const {
-        delay = defaultDelay,
-        duration = defaultDuration,
-        repeat = defaultRepeat,
-        clamp = defaultCamp,
-      } = config ?? {}
-
-      return new Promise((resolve) => {
-        value.value = withDelay(
-          DELAYS[delay],
-          withRepeat(
-            withClamp(
-              { min: clamp[0], max: clamp[1] },
-              withSpring(newValue, { duration: DURATIONS[duration] })
-            ),
-            repeat,
-            false,
-            () => runOnJS(resolve)(undefined)
-          ) as Value
-        )
-      })
-    },
-    [value, defaultDelay, defaultDuration, defaultRepeat, defaultCamp, DELAYS, DURATIONS]
-  )
-
-  const sequenceTiming = useCallback(
-    (newValue: Value[], config?: AnimatedConfig) => {
-      const {
-        delay = defaultDelay,
-        duration = defaultDuration,
-        repeat = defaultRepeat,
-        clamp = defaultCamp,
-      } = config ?? {}
-
-      return new Promise((resolve) => {
-        value.value = withDelay(
-          DELAYS[delay],
-          withRepeat(
-            withClamp(
-              { min: clamp[0], max: clamp[1] },
-              withSequence(
-                ...newValue.map((value) => withTiming(value, { duration: DURATIONS[duration] }))
-              )
-            ),
-            repeat,
-            false,
-            () => runOnJS(resolve)(undefined)
-          ) as Value
-        )
-      })
-    },
-    [value, defaultDelay, defaultDuration, defaultRepeat, defaultCamp, DELAYS, DURATIONS]
-  )
-
-  const sequenceSpring = useCallback(
-    (newValue: Value[], config?: AnimatedConfig) => {
-      const {
-        delay = defaultDelay,
-        duration = defaultDuration,
-        repeat = defaultRepeat,
-        clamp = defaultCamp,
-      } = config ?? {}
-
-      return new Promise((resolve) => {
-        value.value = withDelay(
-          DELAYS[delay],
-          withRepeat(
-            withClamp(
-              { min: clamp[0], max: clamp[1] },
-              withSequence(
-                ...newValue.map((value) => withSpring(value, { duration: DURATIONS[duration] }))
-              )
-            ),
-            repeat,
-            false,
-            () => runOnJS(resolve)(undefined)
-          ) as Value
-        )
-      })
-    },
-    [value, defaultDelay, defaultDuration, defaultRepeat, defaultCamp, DELAYS, DURATIONS]
-  )
-
-  const stop = useCallback(() => {
-    'worklet'
-
-    cancelAnimation(value)
-  }, [value])
-
-  const interpolate = useCallback(
-    <Range extends AnimatedStateRange>(
-      range: Range,
-      inputRange?: number[],
-      extrapolation?: AnimatedExtrapolation
-    ): Range[number] => {
-      'worklet'
-
-      const defaultInputRange: number[] = []
-
-      const segments = range.length - 1
-
-      for (let index = 0; index < range.length; index += 1) {
-        defaultInputRange.push(segments > 0 ? (1 / segments) * index : 0)
-      }
-
-      if (typeof range[0] === 'number') {
-        return reInterpolate(
-          value.value as number,
-          inputRange ?? defaultInputRange,
-          range as number[],
-          extrapolation
-        )
-      } else {
-        return reInterpolateColor(
-          value.value as number,
-          inputRange ?? defaultInputRange,
-          range as string[]
-        )
-      }
-    },
-    [value]
-  )
-
-  return [value, { timing, spring, sequenceTiming, sequenceSpring, stop, interpolate }] as const
-}
-
-export { useAnimated, useAnimatedStyle, animate, AnimatedExtrapolation }

package/src/shared/hooks/use-mixins.ts

@@ -1,36 +0,0 @@
-import { useCallback } from 'react'
-import { useWindowDimensions } from 'react-native'
-
-const useMixins = () => {
-  const { width, height } = useWindowDimensions()
-
-  /**
-   * @default 1
-   **/
-  const byWindowWidth = useCallback(
-    (value: number = 1) => {
-      return width * value
-    },
-    [width]
-  )
-
-  /**
-   * @default 1
-   **/
-  const byWindowHeight = useCallback(
-    (value: number = 1) => {
-      return height * value
-    },
-    [height]
-  )
-
-  return {
-    byWindowWidth,
-    byWindowHeight,
-  }
-}
-
-type Mixins = ReturnType<typeof useMixins>
-
-export { useMixins }
-export type { Mixins }

package/src/shared/hooks/use-safe-area.ts

@@ -1,75 +0,0 @@
-import { Platform } from '@mediacubeco/base-react-native'
-import { useSafeAreaInsets } from 'react-native-safe-area-context'
-import { useBottomTabBarHeight } from 'expo-router/js-tabs'
-import { useHeaderHeight } from 'expo-router/react-navigation'
-import { useNavigationNativeTabs } from '../lib'
-
-const ANDROID_TAB_BAR_DEFAULT_HEIGHT = 56
-const IOS_TAB_BAR_DEFAULT_HEIGHT = 50
-
-const useNavigationHeaderHeight = (safeArea: number = 0) => {
-  try {
-    const height = useHeaderHeight()
-
-    return Platform.by({
-      android: height ? 0 : safeArea,
-      ios: height || safeArea,
-      default: safeArea,
-    })
-  } catch (_) {
-    return safeArea
-  }
-}
-
-const useNavigationFooterHeight = (safeArea: number = 0) => {
-  const isNativeTabs = useNavigationNativeTabs()
-
-  try {
-    const height = useBottomTabBarHeight()
-
-    return {
-      bottom: Platform.by({
-        android: height ? 0 : safeArea,
-        ios: height ? 0 : safeArea,
-        default: safeArea,
-      }),
-      value: Platform.by({
-        android: height,
-        ios: height,
-        default: safeArea,
-      }),
-    }
-  } catch (_) {
-    return {
-      bottom: Platform.by({
-        android: isNativeTabs ? 0 : safeArea,
-        ios: safeArea,
-        default: safeArea,
-      }),
-      value: Platform.by({
-        android: isNativeTabs ? safeArea * 2 + ANDROID_TAB_BAR_DEFAULT_HEIGHT : safeArea,
-        ios: isNativeTabs ? safeArea + IOS_TAB_BAR_DEFAULT_HEIGHT : safeArea,
-        default: safeArea,
-      }),
-    }
-  }
-}
-
-const useSafeArea = () => {
-  const { top, bottom, left, right } = useSafeAreaInsets()
-  const header = useNavigationHeaderHeight(top)
-  const footer = useNavigationFooterHeight(bottom)
-
-  return {
-    TOP: header,
-    BOTTOM: footer.bottom,
-    FOOTER: footer.value,
-    LEFT: left,
-    RIGHT: right,
-  }
-}
-
-type SafeArea = ReturnType<typeof useSafeArea>
-
-export { useSafeArea }
-export type { SafeArea }

package/src/shared/lib/api/repositories/auth/auth.ts

@@ -1,23 +0,0 @@
-import { ApiInstance } from '../../models'
-import {
-  type SignInConfig,
-  type SignInResponse,
-  type SignUpConfig,
-  type SignUpResponse,
-} from './auth.types'
-
-class AuthRepository extends ApiInstance {
-  async signIn(_: SignInConfig) {
-    const { data } = await this.post<SignInResponse>('/sign-in')
-
-    return data
-  }
-
-  async signUp(_: SignUpConfig) {
-    const { data } = await this.post<SignUpResponse>('/sign-up')
-
-    return data
-  }
-}
-
-export default AuthRepository

package/src/shared/lib/api/repositories/auth/auth.types.ts

@@ -1,22 +0,0 @@
-import { type ApiResponse } from '../../api.types'
-
-// config
-
-type SignInConfig = {}
-
-type SignUpConfig = {}
-
-// response
-
-type SignInResponse = ApiResponse<{}>
-
-type SignUpResponse = ApiResponse<{}>
-
-export type {
-  // config
-  SignInConfig,
-  SignUpConfig,
-  // response
-  SignInResponse,
-  SignUpResponse,
-}

package/src/shared/lib/api/repositories/auth/index.ts

@@ -1 +0,0 @@
-export { default as AuthRepository } from './auth'

package/src/shared/lib/navigation/hooks/use-navigation-native-tabs.ts

@@ -1,10 +0,0 @@
-import { useContext } from 'react'
-import { NavigationNativeTabsContext } from '../navigation-native-tabs.context'
-
-const useNavigationNativeTabs = () => {
-  const isNativeTabs = useContext(NavigationNativeTabsContext)
-
-  return isNativeTabs
-}
-
-export { useNavigationNativeTabs }

package/src/shared/lib/navigation/hooks/use-navigation-options.ts

@@ -1,123 +0,0 @@
-import { Platform } from '@mediacubeco/base-react-native'
-import { useCallback } from 'react'
-import { isGlassEffectAPIAvailable } from 'expo-glass-effect'
-import { type StackScreenProps } from 'expo-router'
-import {
-  type MaterialIcon,
-  type NativeTabsProps,
-  type NativeTabsTriggerIconProps,
-  type NativeTabsTriggerLabelProps,
-  type NativeTabTriggerProps,
-  type SFSymbolIcon,
-} from 'expo-router/unstable-native-tabs'
-import { useThemeMode, useThemeSetup } from '../../theme'
-
-const useNavigationStackOptions = () => {
-  const { COLORS } = useThemeMode()
-  const { themeModeSystem } = useThemeSetup()
-
-  const createStackOptions = useCallback(
-    (options?: StackScreenProps['options']) => {
-      return {
-        headerShown: false,
-        headerTransparent: false,
-        headerShadowVisible: false,
-        contentStyle: {
-          backgroundColor: COLORS.FILL.BASE,
-        },
-        ...options,
-      } satisfies StackScreenProps['options']
-    },
-    [COLORS]
-  )
-
-  const createScreenOptions = useCallback(
-    (options?: StackScreenProps['options']) => {
-      return {
-        gestureEnabled: true,
-        gestureDirection: 'horizontal',
-        animation: 'default',
-        headerShown: true,
-        headerBackButtonDisplayMode: 'minimal',
-        headerTransparent: Platform.OS === 'ios',
-        headerBlurEffect: isGlassEffectAPIAvailable() ? 'none' : themeModeSystem,
-        headerTintColor: COLORS.TYPOGRAPHY.BASE,
-        headerStyle: {
-          backgroundColor: Platform.by({
-            ios: COLORS.FILL.TRANSPARENT,
-            default: COLORS.FILL.CONTRAST,
-          }),
-        },
-        headerTitleStyle: {
-          color: COLORS.TYPOGRAPHY.BASE,
-        },
-        ...options,
-      } satisfies StackScreenProps['options']
-    },
-    [COLORS, themeModeSystem]
-  )
-
-  return { createStackOptions, createScreenOptions }
-}
-
-const useNavigationTabBarOptions = () => {
-  const { COLORS } = useThemeMode()
-  const { isThemeModeDark } = useThemeSetup()
-
-  const createTabBarOptions = useCallback(
-    (options?: NativeTabsProps) => {
-      return {
-        sidebarAdaptable: Platform.OS === 'ios',
-        disableTransparentOnScrollEdge: Platform.OS === 'ios',
-        labelVisibilityMode: 'labeled',
-        blurEffect:
-          (isGlassEffectAPIAvailable() && 'systemMaterial') ||
-          (isThemeModeDark && 'dark') ||
-          'light',
-        ...options,
-      } satisfies NativeTabsProps
-    },
-    [isThemeModeDark]
-  )
-
-  const createTabOptions = useCallback(
-    ({
-      name,
-      children,
-      sf,
-      md,
-    }: NativeTabTriggerProps &
-      NativeTabsTriggerLabelProps &
-      Partial<SFSymbolIcon> &
-      Partial<MaterialIcon> = {}) => {
-      const triggerProps = {
-        name,
-      } satisfies NativeTabTriggerProps
-
-      const triggerLabelProps = {
-        hidden: Platform.OS !== 'web',
-        children,
-      } satisfies NativeTabsTriggerLabelProps
-
-      const triggerIconProps = {
-        selectedColor: COLORS.TYPOGRAPHY.PRIMARY,
-        sf,
-        md,
-      } satisfies NativeTabsTriggerIconProps
-
-      return {
-        triggerProps,
-        triggerLabelProps,
-        triggerIconProps,
-      }
-    },
-    [COLORS]
-  )
-
-  return {
-    createTabBarOptions,
-    createTabOptions,
-  }
-}
-
-export { useNavigationStackOptions, useNavigationTabBarOptions }

package/src/shared/lib/navigation/navigation-native-tabs.context.tsx

@@ -1,5 +0,0 @@
-import { createContext } from 'react'
-
-const NavigationNativeTabsContext = createContext(false)
-
-export { NavigationNativeTabsContext }