@oxyhq/services
Version:
173 lines (171 loc) • 7.1 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _reactNative = require("react-native");
var _sonner = require("../../lib/sonner");
var _index = require("../components/index.js");
var _useI18n = require("../hooks/useI18n.js");
var _useThemeStyles = require("../hooks/useThemeStyles.js");
var _useColorScheme = require("../hooks/useColorScheme.js");
var _OxyContext = require("../context/OxyContext.js");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
const SavesCollectionsScreen = ({
onClose,
theme,
goBack
}) => {
// Use useOxy() hook for OxyContext values
const {
oxyServices,
user
} = (0, _OxyContext.useOxy)();
const {
t
} = (0, _useI18n.useI18n)();
const [savedItems, setSavedItems] = (0, _react.useState)([]);
const [collections, setCollections] = (0, _react.useState)([]);
const [isLoading, setIsLoading] = (0, _react.useState)(true);
const [activeTab, setActiveTab] = (0, _react.useState)('saves');
const colorScheme = (0, _useColorScheme.useColorScheme)();
const themeStyles = (0, _useThemeStyles.useThemeStyles)(theme || 'light', colorScheme);
const tabActiveColor = themeStyles.colors.iconSecurity;
const tabInactiveColor = themeStyles.isDarkTheme ? '#888888' : '#666666';
// Load saved items and collections from API
(0, _react.useEffect)(() => {
const loadData = async () => {
try {
setIsLoading(true);
if (user?.id && oxyServices) {
const [saved, cols] = await Promise.all([oxyServices.getSavedItems(user.id), oxyServices.getCollections(user.id)]);
setSavedItems(saved.map(item => ({
id: item.id,
title: item.title,
type: item.itemType === 'post' ? 'post' : 'collection',
savedAt: new Date(item.createdAt),
url: item.url
})));
setCollections(cols.map(col => ({
id: col.id,
name: col.name,
description: col.description,
itemCount: col.itemCount,
createdAt: col.createdAt ? new Date(col.createdAt) : undefined
})));
}
} catch (error) {
_sonner.toast.error(t('saves.loadError') || 'Failed to load saved items');
} finally {
setIsLoading(false);
}
};
loadData();
}, [user?.id, oxyServices, t]);
const formatDate = date => {
return date.toLocaleDateString();
};
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
style: [styles.container, {
backgroundColor: themeStyles.backgroundColor
}],
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Header, {
title: t('saves.title') || 'Saves & Collections',
onBack: goBack || onClose,
variant: "minimal",
elevation: "subtle"
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
style: [styles.tabs, {
borderBottomColor: themeStyles.borderColor
}],
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
style: [styles.tab, activeTab === 'saves' && {
borderBottomColor: tabActiveColor
}],
onPress: () => setActiveTab('saves'),
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
style: [styles.tabText, {
color: activeTab === 'saves' ? tabActiveColor : tabInactiveColor,
fontWeight: activeTab === 'saves' ? '600' : '400'
}],
children: t('saves.tabs.saves') || 'Saves'
})
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
style: [styles.tab, activeTab === 'collections' && {
borderBottomColor: tabActiveColor
}],
onPress: () => setActiveTab('collections'),
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
style: [styles.tabText, {
color: activeTab === 'collections' ? tabActiveColor : tabInactiveColor,
fontWeight: activeTab === 'collections' ? '600' : '400'
}],
children: t('saves.tabs.collections') || 'Collections'
})
})]
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, {
style: styles.content,
children: isLoading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.LoadingState, {
message: t('saves.loading') || 'Loading...',
color: themeStyles.textColor
}) : activeTab === 'saves' ? savedItems.length === 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.EmptyState, {
message: t('saves.empty') || 'No saved items yet',
textColor: themeStyles.textColor
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Section, {
title: t('saves.savedItems') || 'Saved Items',
isFirst: true,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.GroupedSection, {
items: savedItems.map(item => ({
id: item.id,
icon: item.type === 'post' ? 'document-text' : 'folder',
iconColor: item.type === 'post' ? themeStyles.colors.iconSecurity : themeStyles.colors.iconStorage,
title: item.title,
subtitle: formatDate(item.savedAt)
}))
})
}) : collections.length === 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.EmptyState, {
message: t('saves.noCollections') || 'No collections yet',
textColor: themeStyles.textColor
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Section, {
title: t('saves.collections') || 'Collections',
isFirst: true,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.GroupedSection, {
items: collections.map(collection => ({
id: collection.id,
icon: 'folder',
iconColor: themeStyles.colors.iconStorage,
title: collection.name,
subtitle: `${collection.itemCount || 0} items`
}))
})
})
})]
});
};
const styles = _reactNative.StyleSheet.create({
container: {
flex: 1
},
tabs: {
flexDirection: 'row',
borderBottomWidth: 1
},
tab: {
flex: 1,
paddingVertical: 16,
alignItems: 'center',
borderBottomWidth: 2,
borderBottomColor: 'transparent'
},
tabText: {
fontSize: 16
},
content: {
flex: 1,
padding: 16
}
});
var _default = exports.default = /*#__PURE__*/_react.default.memo(SavesCollectionsScreen);
//# sourceMappingURL=SavesCollectionsScreen.js.map