@selfcommunity/react-ui 0.7.50-event.29 → 0.7.50-events.28

package/lib/cjs/components/Events/Events.d.ts

@@ -0,0 +1,64 @@
+import { EventProps } from '../Event';
+export interface EventsProps {
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Feed API Query Params
+     * @default [{'limit': 20, 'offset': 0}]
+     */
+    endpointQueryParams?: Record<string, string | number>;
+    /**
+     * Props to spread to single event object
+     * @default {}
+     */
+    EventComponentProps?: EventProps;
+    /**
+     * Show/Hide filters
+     * @default true
+     */
+    showFilters?: boolean;
+    /**
+     * Filters component
+     * @param props
+     */
+    filters?: JSX.Element;
+    /** If true, it means that the endpoint fetches all events available
+     * @default true
+     */
+    general?: boolean;
+    /**
+     * Other props
+     */
+    [p: string]: any;
+}
+/**
+ * > API documentation for the Community-JS Events component. Learn about the available props and the CSS API.
+ *
+ *
+ * The Events component renders the list of all available events.
+ * Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/Events)
+
+ #### Import
+ ```jsx
+ import {Events} from '@selfcommunity/react-ui';
+ ```
+ #### Component Name
+ The name `SCEvents` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCEvents-root|Styles applied to the root element.|
+ |filters|.SCEvents-filters|Styles applied to the title element.|
+ |events|.SCEvents-events|Styles applied to the title element.|
+ |item|.SCEvents-item|Styles applied to the title element.|
+ |noResults|.SCEvents-no-results|Styles applied to no results section.|
+ |showMore|.SCEvents-show-more|Styles applied to show more button element.|
+
+ * @param inProps
+ */
+export default function Events(inProps: EventsProps): JSX.Element;

package/lib/cjs/components/Events/Events.js

@@ -0,0 +1,230 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const styles_1 = require("@mui/material/styles");
+const material_1 = require("@mui/material");
+const api_services_1 = require("@selfcommunity/api-services");
+const react_core_1 = require("@selfcommunity/react-core");
+const types_1 = require("@selfcommunity/types");
+const Event_1 = tslib_1.__importStar(require("../Event"));
+const react_intl_1 = require("react-intl");
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const system_1 = require("@mui/system");
+const Errors_1 = require("../../constants/Errors");
+const utils_1 = require("@selfcommunity/utils");
+const HiddenPlaceholder_1 = tslib_1.__importDefault(require("../../shared/HiddenPlaceholder"));
+const constants_1 = require("./constants");
+const Skeleton_1 = tslib_1.__importDefault(require("../Events/Skeleton"));
+const Pagination_1 = require("../../constants/Pagination");
+const CreateEventButton_1 = tslib_1.__importDefault(require("../CreateEventButton"));
+const classes = {
+    root: `${constants_1.PREFIX}-root`,
+    filters: `${constants_1.PREFIX}-filters`,
+    events: `${constants_1.PREFIX}-events`,
+    item: `${constants_1.PREFIX}-item`,
+    itemSkeleton: `${constants_1.PREFIX}-item-skeleton`,
+    noResults: `${constants_1.PREFIX}-no-results`,
+    showMore: `${constants_1.PREFIX}-show-more`
+};
+const options = [
+    { value: types_1.SCEventDateFilterType.ANY, label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.select.any", defaultMessage: "ui.events.select.any" }) },
+    { value: types_1.SCEventDateFilterType.TODAY, label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.select.today", defaultMessage: "ui.events.select.today" }) },
+    { value: types_1.SCEventDateFilterType.TOMORROW, label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.select.tomorrow", defaultMessage: "ui.events.select.tomorrow" }) },
+    { value: types_1.SCEventDateFilterType.THIS_WEEK, label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.select.thisWeek", defaultMessage: "ui.events.select.thisWeek" }) },
+    { value: types_1.SCEventDateFilterType.NEXT_WEEK, label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.select.nextWeek", defaultMessage: "ui.events.select.nextWeek" }) },
+    { value: types_1.SCEventDateFilterType.THIS_MONTH, label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.select.thisMonth", defaultMessage: "ui.events.select.thisMonth" }) }
+];
+const Root = (0, styles_1.styled)(material_1.Box, {
+    name: constants_1.PREFIX,
+    slot: 'Root'
+})(() => ({}));
+const ChipRoot = (0, styles_1.styled)(material_1.Chip, {
+    name: constants_1.PREFIX,
+    slot: 'ChipRoot'
+})(() => ({}));
+/**
+ * > API documentation for the Community-JS Events component. Learn about the available props and the CSS API.
+ *
+ *
+ * The Events component renders the list of all available events.
+ * Take a look at our <strong>demo</strong> component [here](/docs/sdk/community-js/react-ui/Components/Events)
+
+ #### Import
+ ```jsx
+ import {Events} from '@selfcommunity/react-ui';
+ ```
+ #### Component Name
+ The name `SCEvents` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCEvents-root|Styles applied to the root element.|
+ |filters|.SCEvents-filters|Styles applied to the title element.|
+ |events|.SCEvents-events|Styles applied to the title element.|
+ |item|.SCEvents-item|Styles applied to the title element.|
+ |noResults|.SCEvents-no-results|Styles applied to no results section.|
+ |showMore|.SCEvents-show-more|Styles applied to show more button element.|
+
+ * @param inProps
+ */
+function Events(inProps) {
+    // PROPS
+    const props = (0, system_1.useThemeProps)({
+        props: inProps,
+        name: constants_1.PREFIX
+    });
+    const { endpointQueryParams = { limit: 8, offset: Pagination_1.DEFAULT_PAGINATION_OFFSET }, className, EventComponentProps = {}, showFilters = false, filters, general = true } = props, rest = tslib_1.__rest(props, ["endpointQueryParams", "className", "EventComponentProps", "showFilters", "filters", "general"]);
+    // STATE
+    const [events, setEvents] = (0, react_1.useState)([]);
+    const [loading, setLoading] = (0, react_1.useState)(true);
+    const [next, setNext] = (0, react_1.useState)(null);
+    const [search, setSearch] = (0, react_1.useState)('');
+    const [dateSearch, setDateSearch] = (0, react_1.useState)(options[0].value);
+    const [selected, setSelected] = (0, react_1.useState)(false);
+    // CONTEXT
+    const scUserContext = (0, react_1.useContext)(react_core_1.SCUserContext);
+    const scPreferencesContext = (0, react_1.useContext)(react_core_1.SCPreferencesContext);
+    const onlyStaffEnabled = (0, react_1.useMemo)(() => scPreferencesContext.preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_ONLY_STAFF_ENABLED].value, [scPreferencesContext.preferences]);
+    // MEMO
+    const contentAvailability = react_core_1.SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY in scPreferencesContext.preferences &&
+        scPreferencesContext.preferences[react_core_1.SCPreferences.CONFIGURATIONS_CONTENT_AVAILABILITY].value;
+    // CONST
+    const authUserId = scUserContext.user ? scUserContext.user.id : null;
+    // HANDLERS
+    const handleChipClick = () => {
+        setSelected(!selected);
+    };
+    const handleDeleteClick = () => {
+        setSelected(false);
+    };
+    /**
+     * Fetches events list
+     */
+    const fetchEvents = () => {
+        let eventService;
+        if (general) {
+            eventService = api_services_1.EventService.searchEvents(Object.assign(Object.assign(Object.assign(Object.assign({}, endpointQueryParams), (search !== '' && { search: search })), (dateSearch !== types_1.SCEventDateFilterType.ANY && { date_filter: dateSearch })), (selected && { follows: selected })));
+        }
+        else {
+            eventService = api_services_1.EventService.getUserEvents(Object.assign(Object.assign({}, endpointQueryParams), (search !== '' && { search: search })));
+        }
+        eventService
+            .then((res) => {
+            setEvents(res.results);
+            setNext(res.next);
+            setLoading(false);
+        })
+            .catch((error) => {
+            utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
+        });
+    };
+    /**
+     * On mount, fetches events list
+     */
+    (0, react_1.useEffect)(() => {
+        if (!contentAvailability && !authUserId) {
+            return;
+        }
+        else {
+            fetchEvents();
+        }
+    }, [contentAvailability, authUserId, search, dateSearch, selected]);
+    const handleNext = (0, react_1.useMemo)(() => () => {
+        if (!next) {
+            return;
+        }
+        return api_services_1.http
+            .request({
+            url: next,
+            method: general ? api_services_1.Endpoints.SearchEvents.method : api_services_1.Endpoints.GetUserEvents.method
+        })
+            .then((res) => {
+            setEvents([...events, ...res.data.results]);
+            setNext(res.data.next);
+        })
+            .catch((error) => console.log(error))
+            .then(() => setLoading(false));
+    }, [next]);
+    /**
+     * Get events filtered
+     */
+    const getFilteredEvents = () => {
+        if (search) {
+            return events.filter((g) => g.name.toLowerCase().includes(search.toLowerCase()));
+        }
+        return events;
+    };
+    /**
+     * Handle change filter name
+     * @param event
+     */
+    const handleOnChangeFilterName = (event) => {
+        setSearch(event.target.value);
+    };
+    /**
+     * Handle change time frame
+     * @param event
+     */
+    const handleOnChangeTimeFrame = (event) => {
+        setDateSearch(event.target.value);
+    };
+    /**
+     * Renders events list
+     */
+    const filteredEvents = (0, utils_1.sortByAttr)(getFilteredEvents(), 'order');
+    const c = (react_1.default.createElement(react_1.default.Fragment, null,
+        showFilters && (react_1.default.createElement(material_1.Grid, { container: true, className: classes.filters, gap: 2 }, filters ? (filters) : (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(material_1.Grid, { item: true, xs: 12, md: 4 },
+                react_1.default.createElement(material_1.TextField, { size: 'small', fullWidth: true, value: search, label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.filterByName", defaultMessage: "ui.events.filterByName" }), variant: "outlined", onChange: handleOnChangeFilterName, disabled: loading })),
+            react_1.default.createElement(material_1.Grid, { item: true, xs: 12, md: 2 },
+                react_1.default.createElement(material_1.FormControl, { fullWidth: true },
+                    react_1.default.createElement(material_1.InputLabel, null,
+                        react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" })),
+                    react_1.default.createElement(material_1.Select, { size: 'small', label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.filterByDate", defaultMessage: "ui.events.filterByDate" }), value: dateSearch, onChange: handleOnChangeTimeFrame, renderValue: (selected) => options.find((option) => option.value === selected).label }, options.map((option) => (react_1.default.createElement(material_1.MenuItem, { key: option.value, value: option.value },
+                        react_1.default.createElement(material_1.Radio, { checked: dateSearch === option.value, value: option.value, name: "radio-button-select", inputProps: { 'aria-label': option.label } }),
+                        option.label)))))),
+            react_1.default.createElement(material_1.Grid, { item: true, xs: 12, md: 2 },
+                react_1.default.createElement(ChipRoot
+                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                // @ts-ignore
+                , { 
+                    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                    // @ts-ignore
+                    color: selected ? 'secondary' : 'default', 
+                    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                    // @ts-ignore
+                    variant: selected ? 'filled' : 'outlined', label: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.filterByFollowedInterest", defaultMessage: "ui.events.filterByFollowedInterest" }), onClick: handleChipClick, 
+                    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+                    // @ts-ignore
+                    selected: selected, deleteIcon: selected ? react_1.default.createElement(material_1.Icon, null, "close") : null, onDelete: selected ? handleDeleteClick : null })))))),
+        react_1.default.createElement(react_1.default.Fragment, null, !events.length ? (react_1.default.createElement(material_1.Box, { className: classes.noResults }, (onlyStaffEnabled && !react_core_1.UserUtils.isStaff(scUserContext.user)) ||
+            (onlyStaffEnabled && react_core_1.UserUtils.isStaff(scUserContext.user) && general) ? (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(Event_1.EventSkeleton, null),
+            react_1.default.createElement(material_1.Typography, { variant: "body1" },
+                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.noEvents.title", defaultMessage: "ui.events.noEvents.title" })))) : (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(Event_1.EventSkeleton, { action: react_1.default.createElement(CreateEventButton_1.default, null) }),
+            react_1.default.createElement(material_1.Typography, { variant: "body1" },
+                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.noEvents.title.onlyStaff", defaultMessage: "ui.events.noEvents.title.onlyStaff" })))))) : (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(material_1.Grid, { container: true, spacing: { xs: 2 }, className: classes.events },
+                react_1.default.createElement(react_1.default.Fragment, null,
+                    filteredEvents.map((event) => (react_1.default.createElement(material_1.Grid, { item: true, xs: 12, sm: 8, md: 6, key: event.id, className: classes.item },
+                        react_1.default.createElement(Event_1.default, Object.assign({ event: event, eventId: event.id }, EventComponentProps))))),
+                    filteredEvents.length <= 3 && (react_1.default.createElement(material_1.Grid, { item: true, xs: 12, sm: 8, md: 6, key: 'skeleton-item', className: classes.itemSkeleton },
+                        react_1.default.createElement(Event_1.EventSkeleton, { action: react_1.default.createElement(CreateEventButton_1.default, null) }))))),
+            Boolean(next) && (react_1.default.createElement(material_1.Button, { color: "secondary", variant: "text", onClick: handleNext, className: classes.showMore },
+                react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.events.button.seeMore", defaultMessage: "ui.events.button.seeMore" }))))))));
+    /**
+     * Renders root object (if content availability community option is false and user is anonymous, component is hidden)
+     */
+    if (!contentAvailability && !scUserContext.user) {
+        return react_1.default.createElement(HiddenPlaceholder_1.default, null);
+    }
+    if (loading) {
+        return react_1.default.createElement(Skeleton_1.default, null);
+    }
+    return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest), c));
+}
+exports.default = Events;

package/lib/cjs/components/Events/Skeleton.d.ts

@@ -0,0 +1,38 @@
+export interface EventsSkeletonProps {
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    className?: string;
+    /**
+     * Overrides or extends the styles applied to the component.
+     * @default null
+     */
+    EventSkeletonProps?: any;
+    /**
+     * @default 20
+     */
+    eventsNumber?: number;
+}
+/**
+ * > API documentation for the Community-JS Groups Skeleton component. Learn about the available props and the CSS API.
+
+ #### Import
+
+ ```jsx
+ import {EventsSkeleton} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+
+ The name `SCEvents-skeleton-root` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCEvents-skeleton-root|Styles applied to the root element.|
+ |events|.SCEvents-skeleton-events|Styles applied to the group elements.|
+ *
+ */
+export default function EventsSkeleton(inProps: EventsSkeletonProps): JSX.Element;

package/lib/cjs/components/Events/Skeleton.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const styles_1 = require("@mui/material/styles");
+const constants_1 = require("./constants");
+const material_1 = require("@mui/material");
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const Event_1 = require("../Event");
+const classes = {
+    root: `${constants_1.PREFIX}-skeleton-root`,
+    events: `${constants_1.PREFIX}-events`
+};
+const Root = (0, styles_1.styled)(material_1.Box, {
+    name: constants_1.PREFIX,
+    slot: 'SkeletonRoot'
+})(() => ({}));
+/**
+ * > API documentation for the Community-JS Groups Skeleton component. Learn about the available props and the CSS API.
+
+ #### Import
+
+ ```jsx
+ import {EventsSkeleton} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+
+ The name `SCEvents-skeleton-root` can be used when providing style overrides in the theme.
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SCEvents-skeleton-root|Styles applied to the root element.|
+ |events|.SCEvents-skeleton-events|Styles applied to the group elements.|
+ *
+ */
+function EventsSkeleton(inProps) {
+    const { className, EventSkeletonProps = {}, eventsNumber = 8 } = inProps, rest = tslib_1.__rest(inProps, ["className", "EventSkeletonProps", "eventsNumber"]);
+    return (react_1.default.createElement(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest),
+        react_1.default.createElement(material_1.Grid, { container: true, spacing: { xs: 3 }, className: classes.events }, [...Array(eventsNumber)].map((event, index) => (react_1.default.createElement(material_1.Grid, { item: true, xs: 12, sm: 8, md: 6, key: index },
+            react_1.default.createElement(Event_1.EventSkeleton, Object.assign({}, EventSkeletonProps))))))));
+}
+exports.default = EventsSkeleton;

package/lib/cjs/components/Events/constants.d.ts

@@ -0,0 +1 @@
+export declare const PREFIX = "SCEvents";

package/lib/cjs/components/Events/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PREFIX = void 0;
+exports.PREFIX = 'SCEvents';

package/lib/cjs/components/Events/index.d.ts

@@ -0,0 +1,4 @@
+import Events, { EventsProps } from './Events';
+import EventsSkeleton, { EventsSkeletonProps } from './Skeleton';
+export default Events;
+export { EventsProps, EventsSkeleton, EventsSkeletonProps };

package/lib/cjs/components/Events/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EventsSkeleton = void 0;
+const tslib_1 = require("tslib");
+const Events_1 = tslib_1.__importDefault(require("./Events"));
+const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
+exports.EventsSkeleton = Skeleton_1.default;
+exports.default = Events_1.default;

package/lib/cjs/components/Events/prefetchedEvents.d.ts

@@ -0,0 +1,271 @@
+export declare const prefetchedEvents: ({
+    id: number;
+    name: string;
+    description: string;
+    slug: string;
+    color: string;
+    privacy: string;
+    visible: boolean;
+    active: boolean;
+    show_on_feed: boolean;
+    subscription_status: any;
+    image_bigger: string;
+    image_big: string;
+    image_medium: string;
+    image_small: string;
+    subscribers_counter: number;
+    goings_counter: number;
+    start_date: string;
+    end_date: string;
+    recurring: string;
+    location: string;
+    geolocation: any;
+    geolocation_lat: any;
+    geolocation_lng: any;
+    link: string;
+    created_at: string;
+    created_by: {
+        id: number;
+        username: string;
+        real_name: string;
+        avatar: string;
+        ext_id: any;
+        deleted: boolean;
+        followings_counter: number;
+        followers_counter: number;
+        posts_counter: number;
+        discussions_counter: number;
+        polls_counter: number;
+        categories_counter: number;
+        date_joined: string;
+        bio: string;
+        location: string;
+        location_lat_lng: any;
+        position_lat_lng: any;
+        date_of_birth: any;
+        description: string;
+        gender: string;
+        website: string;
+        cover: any;
+        tags: any[];
+        reputation: number;
+        language: string;
+        community_badge: boolean;
+        reg_approved: boolean;
+        job: string;
+        store: string;
+        brand: string;
+    };
+    managed_by: {
+        id: number;
+        username: string;
+        real_name: string;
+        avatar: string;
+        ext_id: any;
+        deleted: boolean;
+        followings_counter: number;
+        followers_counter: number;
+        posts_counter: number;
+        discussions_counter: number;
+        polls_counter: number;
+        categories_counter: number;
+        date_joined: string;
+        bio: string;
+        location: string;
+        location_lat_lng: any;
+        position_lat_lng: any;
+        date_of_birth: any;
+        description: string;
+        gender: string;
+        website: string;
+        cover: any;
+        tags: any[];
+        reputation: number;
+        language: string;
+        community_badge: boolean;
+        reg_approved: boolean;
+        job: string;
+        store: string;
+        brand: string;
+    };
+} | {
+    id: number;
+    name: string;
+    description: string;
+    slug: string;
+    color: string;
+    privacy: string;
+    visible: boolean;
+    active: boolean;
+    show_on_feed: boolean;
+    subscription_status: any;
+    image_bigger: string;
+    image_big: string;
+    image_medium: string;
+    image_small: string;
+    subscribers_counter: number;
+    goings_counter: number;
+    start_date: string;
+    end_date: any;
+    recurring: string;
+    location: string;
+    geolocation: string;
+    geolocation_lat: number;
+    geolocation_lng: number;
+    link: any;
+    created_at: string;
+    created_by: {
+        id: number;
+        username: string;
+        real_name: string;
+        avatar: string;
+        ext_id: any;
+        deleted: boolean;
+        followings_counter: number;
+        followers_counter: number;
+        posts_counter: number;
+        discussions_counter: number;
+        polls_counter: number;
+        categories_counter: number;
+        date_joined: string;
+        bio: string;
+        location: string;
+        location_lat_lng: any;
+        position_lat_lng: any;
+        date_of_birth: any;
+        description: string;
+        gender: string;
+        website: string;
+        cover: any;
+        tags: any[];
+        reputation: number;
+        language: string;
+        community_badge: boolean;
+        reg_approved: boolean;
+        job: string;
+        store: string;
+        brand: string;
+    };
+    managed_by: {
+        id: number;
+        username: string;
+        real_name: string;
+        avatar: string;
+        ext_id: any;
+        deleted: boolean;
+        followings_counter: number;
+        followers_counter: number;
+        posts_counter: number;
+        discussions_counter: number;
+        polls_counter: number;
+        categories_counter: number;
+        date_joined: string;
+        bio: string;
+        location: string;
+        location_lat_lng: any;
+        position_lat_lng: any;
+        date_of_birth: any;
+        description: string;
+        gender: string;
+        website: string;
+        cover: any;
+        tags: any[];
+        reputation: number;
+        language: string;
+        community_badge: boolean;
+        reg_approved: boolean;
+        job: string;
+        store: string;
+        brand: string;
+    };
+} | {
+    id: number;
+    name: string;
+    description: string;
+    slug: string;
+    color: string;
+    privacy: string;
+    visible: boolean;
+    active: boolean;
+    show_on_feed: boolean;
+    subscription_status: string;
+    image_bigger: string;
+    image_big: string;
+    image_medium: string;
+    image_small: string;
+    subscribers_counter: number;
+    goings_counter: number;
+    start_date: string;
+    end_date: any;
+    recurring: string;
+    location: string;
+    geolocation: string;
+    geolocation_lat: number;
+    geolocation_lng: number;
+    link: any;
+    created_at: string;
+    created_by: {
+        id: number;
+        username: string;
+        real_name: string;
+        avatar: string;
+        ext_id: any;
+        deleted: boolean;
+        followings_counter: number;
+        followers_counter: number;
+        posts_counter: number;
+        discussions_counter: number;
+        polls_counter: number;
+        categories_counter: number;
+        date_joined: string;
+        bio: string;
+        location: string;
+        location_lat_lng: any;
+        position_lat_lng: any;
+        date_of_birth: any;
+        description: string;
+        gender: string;
+        website: string;
+        cover: any;
+        tags: any[];
+        reputation: number;
+        language: string;
+        community_badge: boolean;
+        reg_approved: boolean;
+        job: any;
+        store: string;
+        brand: any;
+    };
+    managed_by: {
+        id: number;
+        username: string;
+        real_name: string;
+        avatar: string;
+        ext_id: any;
+        deleted: boolean;
+        followings_counter: number;
+        followers_counter: number;
+        posts_counter: number;
+        discussions_counter: number;
+        polls_counter: number;
+        categories_counter: number;
+        date_joined: string;
+        bio: string;
+        location: string;
+        location_lat_lng: any;
+        position_lat_lng: any;
+        date_of_birth: any;
+        description: string;
+        gender: string;
+        website: string;
+        cover: any;
+        tags: any[];
+        reputation: number;
+        language: string;
+        community_badge: boolean;
+        reg_approved: boolean;
+        job: any;
+        store: string;
+        brand: any;
+    };
+})[];