How to use @react-navigation/drawer - 4 common examples

},
  MaterialBottomTabs: {
    title: 'Material Bottom Tabs',
    component: MaterialBottomTabs,
  },
  AuthFlow: {
    title: 'Auth Flow',
    component: AuthFlow,
  },
  CompatAPI: {
    title: 'Compat Layer',
    component: CompatAPI,
  },
};

const Drawer = createDrawerNavigator();
const Stack = createStackNavigator();

const NAVIGATION_PERSISTENCE_KEY = 'NAVIGATION_STATE';
const THEME_PERSISTENCE_KEY = 'THEME_TYPE';

Asset.loadAsync(StackAssets);

export default function App() {
  const containerRef = React.useRef();

  // To test deep linking on, run the following in the Terminal:
  // Android: adb shell am start -a android.intent.action.VIEW -d "exp://127.0.0.1:19000/--/simple-stack"
  // iOS: xcrun simctl openurl booted exp://127.0.0.1:19000/--/simple-stack
  // The first segment of the link is the the scheme + host (returned by `Linking.makeUrl`)
  const { getInitialState } = useLinking(containerRef, {
    prefixes: LinkingPrefixes,

import {Dimensions} from 'react-native';

const {width} = Dimensions.get('window');

import Home from '../screens/AppScreens/Home';
import Blank from '../screens/AppScreens/Blank';
import SideBar from '../screens/AppScreens/SideBar';
import Login from '../screens/AuthScreens/Login';
import AuthLoading from '../screens/AuthLoading';

type RootDrawerParamList = {
  root: undefined;
};

const Drawer = createDrawerNavigator();
const Stack = createStackNavigator();

export default function App() {
  return (
    
      
        
      
    
  );
}

onPress={() => navigation.navigate('Notifications')}
        title="Go to notifications"
      />
    
  );
}

function NotificationsScreen({ navigation }) {
  return (

const DrawerContent = () => {
  return (
    
      {preferences => (
        
      )}
    
  );
};

const Drawer = createDrawerNavigator<{ Home: undefined }>();

export default function PaperExample() {
  useKeepAwake();

  const [isReady, setIsReady] = React.useState(false);
  const [initialState, setInitialState] = React.useState<
    InitialState | undefined
  >();

  const [theme, setTheme] = React.useState(DefaultTheme);
  const [rtl, setRtl] = React.useState(I18nManager.isRTL);

  React.useEffect(() => {
    const restoreState = async () => {
      try {
        const savedStateString = await AsyncStorage.getItem(PERSISTENCE_KEY);