Add data and data display.

src/App.js

@@ -42,7 +42,7 @@ export default class App extends Component<Props> {
         key: 'a',
         callback: () => Linking.openURL('https://github.com/jaywcjlove/awesome-mac'),
       }
-    ])
+    ]);
   }
   render() {
     return (

src/components/ButtonGroup/index.js

@@ -0,0 +1,58 @@
+import React, { Component } from 'react';
+import ReactNative from 'react-native-macos';
+const { View, Text, Image, Linking, StyleSheet, TouchableOpacity, ScrollView } = ReactNative;
+
+type Props = {
+  dataSource: Array,
+};
+
+export default class ButtonGroup extends React.Component<Props> {
+  static defaultProps = {
+    dataSource: [],
+  }
+  onPressLearnMore(item) {
+    if (item && item.openURL) {
+      Linking.openURL(item.openURL);
+    }
+  }
+  render() {
+    const { dataSource } = this.props;
+    return (
+      <View style={styles.btnGroup}>
+        {dataSource.map((item, idx) => {
+          return (
+            <TouchableOpacity style={styles.item} key={idx} onPress={this.onPressLearnMore.bind(this, item)}>
+              {item.label && <Text>{item.label}</Text>}
+              {item.source && (
+                <View style={styles.imgWarpper}>
+                  <Image style={styles.img} source={item.source} />
+                </View>
+              )}
+            </TouchableOpacity>
+          );
+        })}
+      </View>
+    );
+  }
+}
+
+const styles = StyleSheet.create({
+  btnGroup: {
+    flexDirection: 'row',
+    justifyContent: 'flex-end',
+  },
+  item: {
+    flexDirection: 'row',
+    justifyContent: 'flex-end',
+    marginLeft: 5,
+  },
+  imgWarpper: {
+    // width: 18,
+    // height: 18,
+    // padding: 1,
+  },
+  img: {
+    width: 16,
+    height: 16,
+  }
+});

src/components/Menu/index.js

@@ -4,8 +4,8 @@ const { View, Text, StyleSheet, TouchableOpacity, ScrollView } = ReactNative;
 
 class ListView extends React.Component {
   render() {
-    var componentRow = []
-    for (var a in this.props.dataSource) {
+    const componentRow = []
+    for (const a in this.props.dataSource) {
       componentRow.push(this.props.renderRow(a, this.props.dataSource[a]))
     }
     return (