chore(appbar): merge latest main into appbar improvements

Author: Paweł Kata

.github/workflows/contributor-label.yml

@@ -6,46 +6,74 @@ on:
 
 permissions:
   issues: write
-  pull-requests: write
 
 jobs:
   label:
     name: Add contributor label
     runs-on: ubuntu-latest
     steps:
+      - uses: actions/create-github-app-token@bcd2ba49218906704ab6c1aa796996da409d3eb1 # v3.2.0
+        id: app-token
+        with:
+          app-id: ${{ secrets.ORG_MEMBERSHIP_APP_ID }}
+          private-key: ${{ secrets.ORG_MEMBERSHIP_APP_PRIVATE_KEY }}
+          owner: callstack-internal
+          permission-members: read
+
       - uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
+        env:
+          ORG_MEMBERSHIP_TOKEN: ${{ steps.app-token.outputs.token }}
         with:
           github-token: ${{ secrets.GITHUB_TOKEN }}
           script: |
             const owner = context.repo.owner;
             const repo = context.repo.repo;
 
-            let permission = 'none';
+            const label = 'Contributor: Internal';
+
+            const pullRequest = context.payload.pull_request;
+
+            if (pullRequest.labels.some(({ name }) => name === label)) {
+              return;
+            }
+
+            const username = pullRequest.user.login;
 
-            try {
-              const { data } = await github.rest.repos.getCollaboratorPermissionLevel({
+            const { data } =
+              await github.rest.repos.getCollaboratorPermissionLevel({
                 owner,
                 repo,
-                username: context.payload.pull_request.user.login,
+                username,
               });
 
-              permission = data.permission;
-            } catch (error) {
-              if (error.status !== 404) {
-                throw error;
+            let isInternal =
+              ['MEMBER', 'OWNER'].includes(pullRequest.author_association) ||
+              ['admin', 'maintain', 'write'].includes(data.permission);
+
+            if (!isInternal) {
+              try {
+                const internalGithub = getOctokit(process.env.ORG_MEMBERSHIP_TOKEN);
+
+                await internalGithub.rest.orgs.checkMembershipForUser({
+                  org: 'callstack-internal',
+                  username,
+                });
+
+                isInternal = true;
+              } catch (error) {
+                if (error.status !== 404) {
+                  throw error;
+                }
               }
             }
 
-            if (
-              !['MEMBER', 'OWNER'].includes(context.payload.pull_request.author_association) &&
-              !['admin', 'maintain', 'write'].includes(permission)
-            ) {
+            if (!isInternal) {
               return;
             }
 
             await github.rest.issues.addLabels({
               owner,
               repo,
-              issue_number: context.issue.number,
-              labels: ['Contributor: Internal'],
+              issue_number: pullRequest.number,
+              labels: [label],
             });

example/src/DrawerItems.tsx

@@ -17,7 +17,7 @@ import {
   useTheme,
 } from 'react-native-paper';
 
-import { dynamicThemeSupported, isWeb } from '../utils';
+import { dynamicThemeSupported } from '../utils';
 import { PreferencesContext } from './PreferencesContext';
 
 const DrawerItemsData = [
@@ -92,7 +92,6 @@ function DrawerItems() {
   const _setDrawerItem = (index: number) => setDrawerItemIndex(index);
 
   const { colors } = useTheme();
-  const isIOS = Platform.OS === 'ios';
   const expoGoExecution =
     Constants.executionEnvironment === ExecutionEnvironment.StoreClient;
 
@@ -114,7 +113,7 @@ function DrawerItems() {
   } = preferences;
 
   const _handleToggleRTL = () => {
-    if (!isWeb && expoGoExecution) {
+    if (Platform.OS !== 'web' && expoGoExecution) {
       setShowRTLDialog(true);
       return;
     }
@@ -222,7 +221,7 @@ function DrawerItems() {
             <TouchableRipple onPress={toggleRippleEffect}>
               <View style={[styles.preference, styles.v3Preference]}>
                 <Text variant="labelLarge">
-                  {isIOS ? 'Highlight' : 'Ripple'} effect *
+                  {Platform.OS === 'ios' ? 'Highlight' : 'Ripple'} effect *
                 </Text>
                 <View pointerEvents="none">
                   <Switch value={rippleEffectEnabled} />

example/src/Examples/CardExample.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Alert, ScrollView, StyleSheet, View } from 'react-native';
+import { Alert, Platform, ScrollView, StyleSheet, View } from 'react-native';
 
 import {
   Avatar,
@@ -11,7 +11,6 @@ import {
   useTheme,
 } from 'react-native-paper';
 
-import { isWeb } from '../../utils';
 import { PreferencesContext } from '../PreferencesContext';
 import ScreenWrapper from '../ScreenWrapper';
 
@@ -151,7 +150,7 @@ const CardExample = () => {
         <Card
           style={styles.card}
           onPress={() => {
-            isWeb
+            Platform.OS === 'web'
               ? alert('The Chameleon is Pressed')
               : Alert.alert('The Chameleon is Pressed');
           }}
@@ -168,7 +167,7 @@ const CardExample = () => {
         <Card
           style={styles.card}
           onLongPress={() => {
-            isWeb
+            Platform.OS === 'web'
               ? alert('The City is Long Pressed')
               : Alert.alert('The City is Long Pressed');
           }}

example/src/Examples/Dialogs/DialogWithLoadingIndicator.tsx

@@ -4,8 +4,6 @@ import { Dialog, Palette, Portal } from 'react-native-paper';
 
 import { TextComponent } from './DialogTextComponent';
 
-const isIOS = Platform.OS === 'ios';
-
 const DialogWithLoadingIndicator = ({
   visible,
   close,
@@ -21,7 +19,7 @@ const DialogWithLoadingIndicator = ({
           <View style={styles.flexing}>
             <ActivityIndicator
               color={Palette.tertiary30}
-              size={isIOS ? 'large' : 48}
+              size={Platform.OS === 'ios' ? 'large' : 48}
               style={styles.marginRight}
             />
             <TextComponent>Loading.....</TextComponent>

example/src/Examples/TooltipExample.tsx

@@ -15,7 +15,6 @@ import {
   Card,
 } from 'react-native-paper';
 
-import { isWeb } from '../../utils';
 import ScreenWrapper from '../ScreenWrapper';
 
 const MORE_ICON = Platform.OS === 'ios' ? 'dots-horizontal' : 'dots-vertical';
@@ -91,7 +90,7 @@ const TooltipExample = () => {
       <ScreenWrapper>
         <Banner visible>
           A tooltip is displayed upon
-          {!isWeb
+          {Platform.OS !== 'web'
             ? ' tapping and holding a screen element or component'
             : ' hovering over a screen element or component'}
           . Continuously display the tooltip as long as the user long-presses or

example/utils/index.ts

@@ -60,8 +60,6 @@ export function inputReducer<T extends keyof State>(
   }
 }
 
-export const isWeb = Platform.OS === 'web';
-
 export const animatedFABExampleData = [
   {
     id: '1',

src/components/ActivityIndicator.tsx

@@ -4,7 +4,7 @@ import { Animated, Easing, Platform, StyleSheet, View } from 'react-native';
 import type { ColorValue, StyleProp, ViewProps, ViewStyle } from 'react-native';
 
 import { useInternalTheme } from '../core/theming';
-import type { ThemeProp } from '../types';
+import type { ThemeProp } from '../theme/types';
 
 export type Props = ViewProps & {
   /**

src/components/Appbar/AppbarButton.tsx

@@ -2,7 +2,7 @@ import { StyleSheet } from 'react-native';
 
 import AppbarBackIcon from './AppbarBackIcon';
 import type { AppbarLeadingButton, AppbarTrailingAction } from './types';
-import type { Theme } from '../../types';
+import type { Theme } from '../../theme/types';
 import IconButton from '../IconButton/IconButton';
 
 type Props = {

src/components/Appbar/AppbarContent.tsx

@@ -8,7 +8,7 @@ import type {
   Props as AppbarProps,
 } from './types';
 import { APPBAR_HEADLINE_IMAGE_HEIGHT } from './utils';
-import type { Theme, TypescaleKey } from '../../types';
+import type { Theme, TypescaleKey } from '../../theme/types';
 import Text from '../Typography/Text';
 
 type Props = Pick<

src/components/Appbar/types.ts

@@ -9,7 +9,7 @@ import type {
   ViewStyle,
 } from 'react-native';
 
-import type { ThemeProp } from '../../types';
+import type { ThemeProp } from '../../theme/types';
 import type { IconSource } from '../Icon';
 import type { Props as IconButtonProps } from '../IconButton/IconButton';
 import type { Props as SearchbarProps } from '../Searchbar';