jrshikoku/components/Settings/settings.tsx

import React, { useState, useEffect, useLayoutEffect } from "react";
import {
  View,
  Text,
  TouchableOpacity,
  Linking,
  ScrollView,
  Image,
  useWindowDimensions,
  ToastAndroid,
  Platform
} from "react-native";
import { createStackNavigator } from "@react-navigation/stack";
import { TransitionPresets } from "@react-navigation/stack";
//import * as ExpoFelicaReader from "../../modules/expo-felica-reader/src";
import * as Updates from "expo-updates";
import { AS } from "../../storageControl";
import { STORAGE_KEYS } from "@/constants";
import { Switch } from "react-native-elements";
import AutoHeightImage from "react-native-auto-height-image";
import { SettingTopPage } from "./SettingTopPage";
import { LayoutSettings } from "./LayoutSettings";
import { FavoriteSettings } from "./FavoriteSettings";
import { WidgetSettings } from "./WidgetSettings";
import { NotificationSettings } from "./NotificationSettings";
import { LauncherIconSettings } from "./LauncherIconSettings";

const Stack = createStackNavigator();
export default function Setting(props) {
  const {
    navigation: { navigate },
  } = props;
  const [iconSetting, setIconSetting] = useState(false);
  const [mapSwitch, setMapSwitch] = useState(false);
  const [stationMenu, setStationMenu] = useState(false);
  const [usePDFView, setUsePDFView] = useState(false);
  const [trainMenu, setTrainMenu] = useState(false);
  const [trainPosition, setTrainPosition] = useState(false);
  const [headerSize, setHeaderSize] = useState("default");
  const [startPage, setStartPage] = useState(false);
  const [uiSetting, setUiSetting] = useState("tokyo");
  useLayoutEffect(() => {
    AS.getItem(STORAGE_KEYS.ICON_SWITCH).then(setIconSetting);
    AS.getItem(STORAGE_KEYS.MAP_SWITCH).then(setMapSwitch);
    AS.getItem(STORAGE_KEYS.STATION_SWITCH).then(setStationMenu);
    AS.getItem(STORAGE_KEYS.USE_PDF_VIEW).then(setUsePDFView);
    AS.getItem(STORAGE_KEYS.TRAIN_SWITCH).then(setTrainMenu);
    AS.getItem(STORAGE_KEYS.TRAIN_POSITION_SWITCH).then(setTrainPosition);
    AS.getItem(STORAGE_KEYS.HEADER_SIZE).then(setHeaderSize);
    AS.getItem(STORAGE_KEYS.START_PAGE).then(setStartPage);
    AS.getItem(STORAGE_KEYS.UI_SETTING).then(setUiSetting);
  }, []);
  const testNFC = async () => {
    //const result = await ExpoFelicaReader.scan();
    //alert(result);
  };
  const updateAndReload = () => {
    Promise.all([
      AS.setItem(STORAGE_KEYS.ICON_SWITCH, iconSetting.toString()),
      AS.setItem(STORAGE_KEYS.MAP_SWITCH, mapSwitch.toString()),
      AS.setItem(STORAGE_KEYS.STATION_SWITCH, stationMenu.toString()),
      AS.setItem(STORAGE_KEYS.USE_PDF_VIEW, usePDFView.toString()),
      AS.setItem(STORAGE_KEYS.TRAIN_SWITCH, trainMenu.toString()),
      AS.setItem(STORAGE_KEYS.TRAIN_POSITION_SWITCH, trainPosition.toString()),
      AS.setItem(STORAGE_KEYS.HEADER_SIZE, headerSize),
      AS.setItem(STORAGE_KEYS.START_PAGE, startPage.toString()),
      AS.setItem(STORAGE_KEYS.UI_SETTING, uiSetting),
    ]).then(() => Updates.reloadAsync());
  };
  return (
    <Stack.Navigator>
      <Stack.Screen
        name="settingTopPage"
        options={{
          gestureEnabled: false,
          ...TransitionPresets.SlideFromRightIOS,
          cardOverlayEnabled: true,
          headerTransparent: true,
          headerShown: false,
        }}
      >
        {(props) => (
          <SettingTopPage
            {...props}
            testNFC={testNFC}
            startPage={startPage}
            setStartPage={setStartPage}
            updateAndReload={updateAndReload}
          />
        )}
      </Stack.Screen>
      <Stack.Screen
        name="LayoutSettings"
        options={{
          gestureEnabled: true,
          ...TransitionPresets.SlideFromRightIOS,
          cardOverlayEnabled: true,
          headerTransparent: true,
          headerShown: false,
        }}
      >
        {(props) => (
          <LayoutSettings
            {...props}
            iconSetting={iconSetting}
            setIconSetting={setIconSetting}
            mapSwitch={mapSwitch}
            setMapSwitch={setMapSwitch}
            stationMenu={stationMenu}
            setStationMenu={setStationMenu}
            usePDFView={usePDFView}
            setUsePDFView={setUsePDFView}
            trainMenu={trainMenu}
            setTrainMenu={setTrainMenu}
            trainPosition={trainPosition}
            setTrainPosition={setTrainPosition}
            uiSetting={uiSetting}
            setUiSetting={setUiSetting}
            testNFC={testNFC}
            updateAndReload={updateAndReload}
            headerSize={headerSize}
            setHeaderSize={setHeaderSize}
          />
        )}
      </Stack.Screen>
      <Stack.Screen
        name="NotificationSettings"
        options={{
          //gestureEnabled: true,
          ...TransitionPresets.SlideFromRightIOS,
          cardOverlayEnabled: true,
          headerTransparent: true,
          headerShown: false,
        }}
        component={NotificationSettings}
      />
      {Platform.OS === 'android' && <Stack.Screen
        name="WidgetSettings"
        options={{
          gestureEnabled: true,
          ...TransitionPresets.SlideFromRightIOS,
          cardOverlayEnabled: true,
          headerTransparent: true,
          headerShown: false,
        }}
        component={WidgetSettings}
      />}
      <Stack.Screen
        name="LauncherIconSettings"
        options={{
          gestureEnabled: true,
          ...TransitionPresets.SlideFromRightIOS,
          cardOverlayEnabled: true,
          headerTransparent: true,
          headerShown: false,
        }}
        component={LauncherIconSettings}
      />
      <Stack.Screen
        name="FavoriteSettings"
        options={{
          gestureEnabled: true,
          ...TransitionPresets.SlideFromRightIOS,
          cardOverlayEnabled: true,
          headerTransparent: true,
          headerShown: false,
        }}
        component={FavoriteSettings}
      />
    </Stack.Navigator>
  );
}