Что такое хороший Hex-редактор / средство просмотра для Mac? [закрытый]

Похоже, у вас есть дополнительный } в вашем коде. Я отметил это с <- this shouldn't be here. Причина, по которой он говорит, что ошибка находится в этой строке, заключается в том, что именно там открывается View, где содержится ошибка.

render () {
  return (
    <View style={{ flex: 1 }}>
      <View>
        <ActionNavbar title="Add Recipe"
          leftAction={this.cancelRecipe}
          leftIcon={require('app/assets/icons/cancel.png')}
          rightAction={this.saveRecipe}
          rightIcon={require('app/assets/icons/check.png')} />
      </View>
      <ScrollView style={{ flex: 1, maxHeight: this.state.height }} contentContainerStyle={{ paddingBottom: 1000 }}>
        <View>
          <AddImage />
          <Input label="Name of Recipe"
            value={this.state.name}
            onChangeText={name => this.setState({ name })}
            style={styles.nameInput}/>
          <View style={{ width: '100%', flexDirection: 'row', justifyContent: 'space-evenly', marginTop: 30 }}>
            <View style={{ alignItems: 'center' }}>
              <Text style={styles.title}>TOTAL COOK TIME</Text>
              <TouchableOpacity onPress={() => {
                this.props.navigation.navigate('DurationPicker', {
                  hours: this.state.hours,
                  minutes: this.state.minutes
                });
              }}>
                <View style={styles.secondaryButton}>
                  <Text style={styles.textStyle}>{this.state.durationLabel}</Text>
                </View>
              </TouchableOpacity>
            </View>
            <View style={{ alignItems: 'center' }}>
              <Text style={styles.title}>Total Servings</Text>
              <TouchableOpacity onPress={() => {
                this.props.navigation.navigate('ServingsPicker', {
                  servings: this.state.servings
                });
              }}>
                <View style={styles.secondaryButton}>
                  <Text style={styles.textStyle}>{this.state.servingsLabel}</Text>
                </View>
              </TouchableOpacity>
            </View>
          </View>
          <View style={styles.section}>
            <Text style={styles.sectionHeader}>Ingredients</Text>
            <Divider style={styles.sectionDivider} />
            {
              this.state.ingredients.map((ingredient, index) => (
                <View style={{ marginBottom: 3, flexDirection: 'row', alignItems: 'center' }} key={'ingredient-' + index}>
                  <View style={styles.ingredientSize}>
                    <Text style={{ padding: 10 }}>{ingredient.number} {fractionMap[ingredient.fraction]} {ingredient.unitLabel}</Text>
                  </View>
                  <Text style={{ fontSize: 18 }}>{ingredient.name}</Text>
                  <Divider></Divider>
                </View>
              ))
            }
            <ActionButton icon={require('app/assets/icons/whiteAdd.png')}
              text="Add Ingredient"
              onPress={() => {
                this.props.navigation.navigate('AddIngredients', {
                  ingredients: this.state.ingredients,
                  units: this.props.units
                });
              }} />
          </View>
          {
            this.state.steps.map((step, index) => (
              <View style={styles.section} key={`step-${index}`}>
                <Text style={styles.sectionHeader}>Step {index + 1}</Text>
                <Divider style={styles.sectionDivider}/>
                <Text>{step}</Text>
              </View>
            ))
          }
          <View style={styles.section}>
            <Text style={styles.sectionHeader}>Step {this.state.steps.length + 1}</Text>
            <Divider style={styles.sectionDivider} />
            <ActionButton icon={require('app/assets/icons/whiteAdd.png')}
              text="Add Step"
              onPress={() => {
                this.props.navigation.navigate('AddStep', {
                  ingredients: this.state.ingredients
                });
              }} />
          </View>
          <View style={styles.section}>
            <Text style={styles.sectionHeader}>Notes</Text>
            <Divider style={styles.sectionDivider} />
            {
              this.state.notes === ''
                ? <ActionButton icon={require('app/assets/icons/whiteAdd.png')}
                  text="Add Note"
                  onPress={() => {
                    this.props.navigation.navigate('AddNote', {
                      note: this.state.note
                    });
                  }} />
                : <Text>{this.state.notes}</Text>
            }
          </View>
          ***<View style={styles.section}>***
            <Text style={styles.sectionHeader}>Tags</Text>
            <Divider style={styles.sectionDivider} />
            {
              this.state.tag.map((tag, index) => (
                <View style={{ marginBottom: 3, flexDirection: 'row', alignItems: 'center' }} key={'tag-' + index}>
                  <Text style={{ fontSize: 18 }}>{ tag }</Text>
                  <Divider></Divider>
                </View>
              ))
            }
            <ActionButton icon={require('app/assets/icons/whiteAdd.png')}
              text="Add Tag"
              onPress={() => {
                this.props.navigation.navigate('AddTag', {
                  tag: this.state.tag
                });
              }} /> :
            <Text>{this.state.tag}</Text>
            } <- this shouldn't be here
          </View>
          <View style={{ flexDirection: 'row', margin: 10, justifyContent: 'center', alignItems: 'center' }}>
            <Text style={{ flex: 1, fontSize: 16 }}>
          Private Recipe?
            </Text>
            <Switch
              value={this.state.isPrivate}
              onValueChange={priv => this.setState({ isPrivate: priv })}
            />
          </View>
        </View>
      </ScrollView>
    </View>);
}

Я предлагаю вам настроить линтинг, чтобы вы могли ловить подобные ошибки.