Add Title Sponsor Nokian to Avy

[kevinherdez]

• Add title sponsor Nokian Tyres! #1205

The Nokian Tyre sponsorship is being added to 3 areas: the splash screen, the Drawer, and the FRE

Splash Screen

The splash.png file was removed in favor of using avy-logo-transparent.png for the splash screen. The main reason for this is that full screen images were deprecated for splash screens, and, also, the smaller asset allows us to have more control over the image.

The new flow for the splash screen is that we're now always showing the "mirrored" splash screen view that we used to show only when load up was taking a long time. The view was broken out into the SponsorSplashScreen file. SponsorSplashScreen shows the Avy logo in the same exact spot as the built in splash screen, and animates in the Nokian logo.

This view was added directly into the BaseAppView to allow for a smooth transition between the SponsorSplashScreen and the app's content.

SplashScreenContext was added to prevent the AvalancheCenterSelectorModal from showing while the SponsorSplashScreen was still visible.

Demo: https://github.com/user-attachments/assets/0af7eada-24d0-4c3f-a30f-1444d4597683

Drawer

A new sponsor section was added to the top of the Drawer that predominantly shows Nokian as our sponsor. When a user taps on the section it opens the new DrawerModal to explain more about the partnership and to give users the option to go to the Nokian site using our campaign URL.

Drawer Sponsorship	Drawer Modal

FRE

The Nokian logo and an extra bullet point was added to the FRE that we're going to show with the release of the map project

---

^{Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.}

[yuliadub]

we have both jpg and png (and we are using jpg and not png it looks like), historically png is better to use, but since we dont support dark mode this wont be an issue for now most likely

[kevinherdez]

Good point. I just downloaded their black and white logos from the Nokian asset catalog that they have. I'll see if there's a PNG for the black text one.

[yuliadub]

maybe lets catch and show an error in case we cant open the browser for any reason?

[yuliadub]

do we have a better place to put this URL so it doesnt get lost? maybe makes sense to make a sponsor.ts in data that would look something like this (if we add new sponsors this hopefully makes it easier too)

// data/sponsors.ts
export interface Sponsor {
  id: string;
  displayName: string;
  campaignUrl: string;
  // eslint-disable-next-line @typescript-eslint/no-require-imports
  logo: number;        // require('assets/logos/…')
  logoSnow: number;    // white-on-dark variant for splash
  logoAspectRatio: number; // width / height, drops the 416/1024 magic numbers
  drawerBlurb: string;
  splashBlurb: string; // "IN PARTNERSHIP WITH"
}

export const TITLE_SPONSOR: Sponsor = {
  id: 'nokian-tyres',
  displayName: 'Nokian Tyres',
  campaignUrl:
    'https://na.nokiantyres.com/?utm_medium=referral&utm_source=3rd%20Party&utm_campaign=Nokian_Tyres_Avy',
  logo: require('assets/logos/Nokian_Tyres_Logo.jpg'),
  logoSnow: require('assets/logos/Nokian_Tyres_Snow.png'),
  logoAspectRatio: 1024 / 416,
  drawerBlurb:
    'Nokian Tyres invented the winter tire in 1934…',
  splashBlurb: 'IN PARTNERSHIP WITH',
};

[kevinherdez]

Great point

[yuliadub]

Have not verified this - so apply as you see this.

claude tells me that setTimeout may cause a delay on slower devices where after you tap out of the sponsor logo, your first click for a zone may not go through. It suggests this instead

useEffect(() => {
  if (!dismissed) return;
  opacity.value = withTiming(
    0,
    {duration: FADE_OUT_DURATION_MS},
    (finished) => {
      if (finished) runOnJS(handleFadeComplete)();
    },
  );
}, [dismissed, opacity, handleFadeComplete]);

also it says to add pointerEvents so even during the fade the view lets touches through.

<Animated.View
  pointerEvents={dismissed ? 'none' : 'auto'}
  style={[StyleSheet.absoluteFill, {backgroundColor: SPLASH_BACKGROUND_COLOR}, rootStyle]}
>

[kevinherdez]

Nice I removed the pointer events so that the touches wouldn't go through the new splash screen but this is better