Tweak avi follow button styles (#4304)

* Tighten up

* Tweak colors

* Tweak for night mode

* Add missing file

* Contrast plus

src/alf/index.tsx

@@ -1,12 +1,14 @@
 import React from 'react'
 import {Dimensions} from 'react-native'
+
 import * as themes from '#/alf/themes'
 
-export * from '#/alf/types'
-export * as tokens from '#/alf/tokens'
 export {atoms} from '#/alf/atoms'
-export * from '#/alf/util/platform'
+export * as tokens from '#/alf/tokens'
+export * from '#/alf/types'
 export * from '#/alf/util/flatten'
+export * from '#/alf/util/platform'
+export * from '#/alf/util/themeSelector'
 
 type BreakpointName = keyof typeof breakpoints
 

src/alf/themes.ts

@@ -1,11 +1,11 @@
+import {atoms} from '#/alf/atoms'
 import * as tokens from '#/alf/tokens'
 import type {Mutable} from '#/alf/types'
-import {atoms} from '#/alf/atoms'
 import {BLUE_HUE, GREEN_HUE, RED_HUE} from '#/alf/util/colorGeneration'
 
 export type ThemeName = 'light' | 'dim' | 'dark'
 export type ReadonlyTheme = typeof light
-export type Theme = Mutable<ReadonlyTheme>
+export type Theme = Mutable<ReadonlyTheme> & {name: ThemeName}
 export type ReadonlyPalette = typeof lightPalette
 export type Palette = Mutable<ReadonlyPalette>
 
@@ -193,7 +193,7 @@ export const dimPalette: Palette = {
 } as const
 
 export const light = {
-  name: 'light',
+  name: 'light' as ThemeName,
   palette: lightPalette,
   atoms: {
     text: {
@@ -278,7 +278,7 @@ export const light = {
 }
 
 export const dark: Theme = {
-  name: 'dark',
+  name: 'dark' as ThemeName,
   palette: darkPalette,
   atoms: {
     text: {
@@ -367,7 +367,7 @@ export const dark: Theme = {
 
 export const dim: Theme = {
   ...dark,
-  name: 'dim',
+  name: 'dim' as ThemeName,
   palette: dimPalette,
   atoms: {
     ...dark.atoms,

src/alf/util/themeSelector.ts

@@ -0,0 +1,14 @@
+import {ThemeName} from '#/alf/themes'
+
+export function select<T>(name: ThemeName, options: Record<ThemeName, T>) {
+  switch (name) {
+    case 'light':
+      return options.light
+    case 'dark':
+      return options.dark || options.dim
+    case 'dim':
+      return options.dim || options.dark
+    default:
+      throw new Error(`select(theme, options) received unknown theme ${name}`)
+  }
+}