@oxyhq/services/lib/module/ui/screens/karma/KarmaRulesScreen.js

Reusable OxyHQ module to handle authentication, user management, karma system, device-based session management and more 🚀

"use strict";

import { useEffect, useState } from 'react';
import { View, Text, StyleSheet, ScrollView, ActivityIndicator } from 'react-native';
import { useOxy } from '../../context/OxyContext';
import { Header } from '../../components';
import { useI18n } from '../../hooks/useI18n';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const KarmaRulesScreen = ({
  goBack,
  theme
}) => {
  const {
    oxyServices
  } = useOxy();
  const {
    t
  } = useI18n();
  const [rules, setRules] = useState([]);
  const [isLoading, setIsLoading] = useState(true);
  const [error, setError] = useState(null);
  const isDarkTheme = theme === 'dark';
  const backgroundColor = isDarkTheme ? '#121212' : '#FFFFFF';
  const textColor = isDarkTheme ? '#FFFFFF' : '#000000';
  const primaryColor = '#d169e5';
  useEffect(() => {
    setIsLoading(true);
    setError(null);
    oxyServices.getKarmaRules().then(data => setRules(Array.isArray(data) ? data : [])).catch(err => setError(err.message || 'Failed to load rules')).finally(() => setIsLoading(false));
  }, [oxyServices]);
  return /*#__PURE__*/_jsxs(View, {
    style: [styles.container, {
      backgroundColor
    }],
    children: [/*#__PURE__*/_jsx(Header, {
      title: t('karma.rules.title') || 'Karma Rules',
      subtitle: t('karma.rules.subtitle') || 'How to earn karma points',
      theme: theme,
      onBack: goBack,
      elevation: "subtle"
    }), isLoading ? /*#__PURE__*/_jsx(ActivityIndicator, {
      size: "large",
      color: primaryColor,
      style: {
        marginTop: 40
      }
    }) : error ? /*#__PURE__*/_jsx(Text, {
      style: [styles.error, {
        color: '#D32F2F'
      }],
      children: error
    }) : /*#__PURE__*/_jsx(ScrollView, {
      contentContainerStyle: styles.listContainer,
      children: rules.length === 0 ? /*#__PURE__*/_jsx(Text, {
        style: [styles.placeholder, {
          color: textColor
        }],
        children: t('karma.rules.empty') || 'No rules found.'
      }) : rules.map((rule, idx) => /*#__PURE__*/_jsx(View, {
        style: styles.ruleRow,
        children: /*#__PURE__*/_jsx(Text, {
          style: [styles.ruleDesc, {
            color: textColor
          }],
          children: rule.description
        })
      }, rule.id || idx))
    })]
  });
};
const styles = StyleSheet.create({
  container: {
    flex: 1
  },
  listContainer: {
    paddingBottom: 40,
    paddingTop: 20
  },
  ruleRow: {
    paddingVertical: 14,
    paddingHorizontal: 24,
    borderBottomWidth: 1,
    borderColor: '#eee'
  },
  ruleDesc: {
    fontSize: 16
  },
  placeholder: {
    fontSize: 16,
    color: '#888',
    textAlign: 'center',
    marginTop: 40
  },
  error: {
    fontSize: 16,
    textAlign: 'center',
    marginTop: 40
  }
});
export default KarmaRulesScreen;
//# sourceMappingURL=KarmaRulesScreen.js.map