start init module + screen dao

apps/mobile/src/app/Router.tsx

@@ -70,6 +70,7 @@ import { Community } from '../screens/Community';
 import { AuthStackParams, HomeBottomStackParams, MainStackParams, RootStackParams } from '../types';
 import { initGoogleAnalytics, logPageView } from '../utils/analytics';
 import { ScreenRecordStream } from '../modules/Studio/ScreenRecord';
+import { DAOScreen } from '../screens/DAO';
 
 type TabBarIconProps = {
   focused: boolean;
@@ -343,6 +344,7 @@ const MainNavigator: React.FC = () => {
       <MainStack.Screen name="Nameservice" component={NameserviceScreen} />
       <MainStack.Screen name="ReceiveEcash" component={ReceiveEcash} />
       <MainStack.Screen name="Community" component={Community} />
+      <MainStack.Screen name="DAO" component={DAOScreen} />
 
     </MainStack.Navigator>
   );
@@ -484,7 +486,14 @@ const linking = {
               token: (token: string) => `${token}`,
             },
           },
-          Community: 'app/community'
+          Community: 'app/community',
+          DAO: 'app/dao',
+          DAODetail: {
+            path: 'app/dao/:daoId',
+            parse: {
+              daoId: (daoId: string) => `${daoId}`,
+            },
+          },
         },
       },
     },

apps/mobile/src/modules/DAO/index.tsx

@@ -0,0 +1,71 @@
+import { useNavigation } from '@react-navigation/native';
+import { useState } from 'react';
+import { View, Text } from 'react-native';
+import { useStyles, useTheme } from '../../hooks';
+import { MainStackNavigationProps } from '../../types';
+import { SelectedTab, TABS_COMMUNITY, TABS_TIP_LIST } from '../../types/tab';
+import stylesheet from './styles';
+import { Button, Input, Modal } from '../../components';
+
+export const DAOComponent: React.FC = () => {
+  const styles = useStyles(stylesheet);
+  const theme = useTheme();
+  const navigation = useNavigation<MainStackNavigationProps>();
+  const [selectedTab, setSelectedTab] = useState<SelectedTab | undefined>(SelectedTab.ALL_GROUP);
+  const handleTabSelected = (tab: string | SelectedTab, screen?: string) => {
+    setSelectedTab(tab as any);
+    if (screen) {
+      navigation.navigate(screen as any);
+    }
+  };
+
+
+  const [isFormCreateDao, setIsFormCreateDao] = useState(false);
+  const handleFormCreateDao = () => {
+
+    setIsFormCreateDao(!isFormCreateDao);
+    // navigation.navigate('MainStack', { screen: 'CreateForm' });
+  }
+
+  const handleCallbackCreateDao = () => {
+
+  }
+  return (
+    <View style={styles.container}>
+
+      {isFormCreateDao && (
+        <View>
+          <Text style={styles.text}>Create DAO</Text>
+          <Modal
+            style={{ height: "90%" }}
+          // style={styles.modal}
+          >
+            <View>
+
+
+              <Input>
+              </Input>
+
+
+              <Button
+                onPress={handleCallbackCreateDao}
+              >
+                <Text>Create</Text>
+              </Button>
+            </View>
+          </Modal>
+        </View>
+      )}
+
+      <Text style={styles.text}>DAO coming soon</Text>
+
+
+      <Button
+        onPress={handleFormCreateDao}
+      >
+        <Text>Create DAO</Text>
+
+      </Button>
+    </View>
+  );
+};

apps/mobile/src/modules/DAO/styles.ts

@@ -0,0 +1,66 @@
+import {Spacing, ThemedStyleSheet} from '../../styles';
+
+export default ThemedStyleSheet((theme) => ({
+  container: {
+    flex: 1,
+    backgroundColor: theme.colors.background,
+    paddingVertical: Spacing.xxxsmall,
+    paddingHorizontal: Spacing.normal,
+  },
+  text: {
+    color: theme.colors.text,
+  },
+
+  flatListContent: {
+    paddingHorizontal: Spacing.pagePadding,
+    paddingVertical: Spacing.medium,
+  },
+
+  separator: {
+    height: 1,
+    backgroundColor: theme.colors.divider,
+  },
+
+  tip: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    backgroundColor: theme.colors.surface,
+    padding: Spacing.xsmall,
+    borderRadius: 8,
+    gap: Spacing.xsmall,
+  },
+  tipInfo: {
+    gap: Spacing.xxsmall,
+  },
+  token: {
+    flex: 1,
+    flexDirection: 'row',
+    gap: Spacing.xsmall,
+  },
+
+  senderInfo: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    gap: Spacing.medium,
+  },
+  sender: {
+    flex: 1,
+  },
+
+  buttonIndicator: {
+    marginRight: Spacing.xsmall,
+  },
+  createPostButton: {
+    position: 'absolute',
+    bottom: Spacing.large,
+    right: Spacing.pagePadding,
+  },
+  modal: {
+    // backgroundColor: theme.colors.background,
+    // padding: Spacing.normal,
+    // borderRadius: 8,
+    height: '100%',
+  },
+}));

apps/mobile/src/screens/DAO/index.tsx

@@ -0,0 +1,40 @@
+import {useState} from 'react';
+import {KeyboardAvoidingView, ScrollView, Text, View} from 'react-native';
+import {SafeAreaView} from 'react-native-safe-area-context';
+import {TextButton} from '../../components';
+import {useStyles, useTheme} from '../../hooks';
+import { DAOScreenProps} from '../../types';
+import {SelectedTab, TABS_CONSOLE} from '../../types/tab';
+import stylesheet from './styles';
+import { DAOComponent } from '../../modules/DAO';
+
+export const DAOScreen: React.FC<DAOScreenProps> = ({navigation}) => {
+  const theme = useTheme();
+  const styles = useStyles(stylesheet);
+  const [selectedTab, setSelectedTab] = useState<SelectedTab | undefined>(
+    SelectedTab.LAUNCHPAD_VIEW,
+  );
+  const handleTabSelected = (tab: string | SelectedTab, screen?: string) => {
+    setSelectedTab(tab as any);
+    if (screen) {
+      navigation.navigate(screen as any);
+    }
+  };
+  return (
+    <View style={styles.container}>
+      <SafeAreaView edges={['top', 'left', 'right']} style={styles.header}>
+        <TextButton style={styles.cancelButton} onPress={navigation.goBack}>
+          Cancel
+        </TextButton>
+      </SafeAreaView>
+      <KeyboardAvoidingView behavior="padding" style={styles.content}>
+
+        <SafeAreaView edges={['bottom', 'left', 'right']} style={styles.viewContent}>
+          <ScrollView>
+            <DAOComponent />
+          </ScrollView>
+        </SafeAreaView>
+      </KeyboardAvoidingView>
+    </View>
+  );
+};

apps/mobile/src/screens/DAO/styles.ts

@@ -0,0 +1,76 @@
+// import {StyleSheet} from 'react-native';
+
+import {Spacing, ThemedStyleSheet, Typography} from '../../styles';
+
+export default ThemedStyleSheet((theme) => ({
+  container: {
+    flex: 1,
+    color: theme.colors.text,
+    backgroundColor: theme.colors.background,
+  },
+  header: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    backgroundColor: theme.colors.surface,
+    paddingHorizontal: Spacing.pagePadding,
+    // borderBottomWidth: StyleSheet.hairlineWidth,
+    // borderBottomColor: theme.colors.divider,
+  },
+  cancelButton: {
+    paddingVertical: Spacing.small,
+    paddingHorizontal: Spacing.xsmall,
+  },
+  content: {
+    flex: 1,
+    backgroundColor: theme.colors.background,
+    margin: Spacing.pagePadding,
+    // color: theme.colors.text,
+  },
+  viewContent: {
+    flex: 1,
+    backgroundColor: theme.colors.background,
+    marginTop: Spacing.pagePadding,
+    marginBottom: Spacing.pagePadding,
+    // color: theme.colors.text,
+  },
+  form: {
+    flex: 1,
+  },
+  input: {
+    flex: 1,
+    padding: Spacing.large,
+    color: theme.colors.inputText,
+    textAlignVertical: 'top',
+    fontSize: 16,
+    lineHeight: 24,
+    ...Typography.medium,
+  },
+  imageContainer: {
+    padding: Spacing.pagePadding,
+  },
+  image: {
+    width: '100%',
+    resizeMode: 'cover',
+    borderRadius: 8,
+    overflow: 'hidden',
+  },
+
+  buttons: {
+    position: 'relative',
+  },
+  mediaButtons: {
+    flexDirection: 'row',
+    paddingHorizontal: Spacing.pagePadding,
+    paddingVertical: Spacing.small,
+    gap: Spacing.large,
+    alignItems: 'center',
+  },
+  sendButton: {
+    position: 'absolute',
+    right: Spacing.pagePadding,
+    bottom: '110%',
+  },
+  text: {
+    color: theme.colors.text,
+  },
+}));

apps/mobile/src/types/routes.ts

@@ -94,6 +94,8 @@ export type MainStackParams = {
   Console: undefined;
   Community: undefined;
   RecordedStream: { streamId: string, recordingUrl?: string };
+  DAO: undefined;
+  DAODetail: { daoId: string };
 };
 
 
@@ -131,6 +133,8 @@ export type HomeBottomStackParams = {
   Nameservice: undefined;
   Console: undefined;
   Community: undefined;
+  DAO: undefined;
+  DAODetail: { daoId: string };
 
   // CreateForm: undefined;
   // ChannelsFeed:undefined;
@@ -426,6 +430,12 @@ export type CommunityScreenProps = CompositeScreenProps<
   NativeStackScreenProps<RootStackParams>
 >;
 
+
+export type DAOScreenProps = CompositeScreenProps<
+  NativeStackScreenProps<MainStackParams | HomeBottomStackParams, 'DAO'>,
+  NativeStackScreenProps<RootStackParams>
+>;
+
 export type DrawerStackNavigationProps = DrawerNavigationProp<MainStackParams>;
 
 /** TODO delete */