fansunited-widget-either-or 1.0.1 → 1.1.1

package/README.md

@@ -56,6 +56,7 @@ type  EitherOrManagerProps = {
 	sportal365Project?: string;
 	sportal365Infrastructure?: 'shared' | 'betway';
 	labels?: LabelsModel;
+	hideSignOutButton?: boolean;
 };
 ```
 
@@ -71,6 +72,8 @@ Fans United Either/Or Management Widget depends on [Fans United JS SDK](https://
 
 -  `sportal365Infrastructure` - The Sportal365 infrastructure. Used to determine what authorization should be used when communicating with Sportal365 APIs. If no value given (when sportal365Project props is provided) it will be set to **shared** .
 
+-  `hideSignOutButton` - By default on the top left corner of the widget will be displayed a sign out button. To hide that button set this prop to **true**.
+
 ## Translation
 
 You can easily translate Fans United Either/Or Management Widget in your language! You just need to pass an object to `labels`  **prop** with concrete keys and values and that's it! Here's an example how you can do it:
@@ -94,6 +97,19 @@ const  labels = {
 	save: 'Save',
 	preview: 'Preview',
 	close: 'Close',
+	filterBy: 'Filter by:',
+	sortBy: 'Sort by:',
+	clearStatus: 'Clear status',
+	contextEntityTag: 'Context entity tag',
+	typeContextTagNamePlaceholder: 'Type context tag name...',
+	showMoreImages: 'Show more images',
+	hideMoreImages: 'Hide more images',
+	uploadImage: 'Upload image',
+	groupByStatus: 'Group by status',
+	copyUrl: 'Copy URL',
+	copied: 'Copied',
+	add: 'Add',
+	configuration: 'Configuration',
 	titlePlaceholder: 'Provide a title for your Either/Or',
 	description: 'Description',
 	descriptionPlaceholder: 'Describe your Either/Or',
@@ -115,9 +131,9 @@ const  labels = {
 	more: 'More',
 	less: 'Less',
 	time: 'Time',
-	timePlaceholder: 'Enter the time limit for answering questions by users. Time is in seconds',
+	timeDescription: 'Enter the time limit for answering questions by users. Time is in seconds',
 	lives: 'Lives',
-	livesPlaceholder: 'Enter how many lives the user will have during a game',
+	livesDescription: 'Enter how many lives the user will have during a game',
 	points: 'Points',
 	pointsDescription: 'Set the threshold of consecutive correct answers after which points are awarded and define the amount of points received from this step onwards.Valid value for correct steps is between 0-50 and for score 1-100',
 	pointNumber: 'Point number',
@@ -143,7 +159,6 @@ const  labels = {
 	tags: 'Tags',
 	entity: 'Entity',
 	campaign: 'Campaign',
-	tagNumber: 'Tag number',
 	id: 'ID',
 	idContentPlaceholder: 'Type the ID of your content',
 	idCampaignPlaceholder: 'Type the ID of your campaign',
@@ -178,7 +193,7 @@ const  labels = {
 	encryptingImageErrorMessage: 'There was a problem with encrypting image before uploading it to bucket. Please try again',
 	clear: 'Clear'
 	searchSportal365ImagesErrorMessage: 'There was a problem with searching images from Sportal 365 API. Please try again'
-	searchImage: 'Search image',
+	searchImages: 'Search images',
 	clearFromToFilterSportal365ImagesMessage: 'You have cleared from/to filter for Sportal365 search images',
 	hideFilters: 'Hide filters',
 	showFilters: 'Show filters',
@@ -214,6 +229,19 @@ Here is all information about **`LabelsModel`**:
 | `save` | Label for save button | Save |
 | `preview` | Label for preview button | Preview |
 | `close` | Label for close button | Close |
+| `filterBy` | Label for filters container on main screen | Filter by: |
+| `sortBy` | Label for sort container on main screen | Sort by: |
+| `clearStatus` | Label for clear status hyperlink for status filter | Clear status |
+| `contextEntityTag` | Label for input search for context entity tag in filters container | Context entity tag |
+| `typeContextTagNamePlaceholder` | Placeholder for input search for context entity tag in filters container and in context side bar | Type context tag name... |
+| `showMoreImages` | Label for hyperlink in images container | Show more images |
+| `hideMoreImages` | Label for hyperlink in images container | Hide more images |
+| `uploadImage` | Label next to upload button | Upload image |
+| `groupByStatus` | Label for checkbox in sort container | Group by status |
+| `copyUrl` | Label for copy url button | Copy URL |
+| `copied` |  Label for copy url button | Copied |
+| `add` | Label for add button | Add |
+| `configuration` | Label for configuration accordion | Configuration |
 | `titlePlaceholder` | Placeholder/desciption about title input field name on management screen. | Provide a title for your Either/Or |
 | `timeFormat` | Timeformat for displaying dates. Widgets uses [dayjs](https://www.npmjs.com/package/dayjs) as a date dependency. | DD.MM.YYYY, HH:mm |
 | `previous` | Label for pagination button. | Previous |
@@ -239,9 +267,9 @@ Here is all information about **`LabelsModel`**:
 | `more` | Label for more option. | More |
 | `less` | Label for less option. | Less |
 | `time` | Label for time input. | Time |
-| `timePlaceholder` | Placeholder for time input. | Enter the time limit for answering questions by users. Time is in seconds |
+| `timeDescription` | Placeholder for time input. | Enter the time limit for answering questions by users. Time is in seconds |
 | `lives` | Label for lives input. | Lives |
-| `livesPlaceholder` | Placeholder for lives input. | Enter how many lives the user will have during a game |
+| `livesDescription` | Placeholder for lives input. | Enter how many lives the user will have during a game |
 | `points` | Label for points. | Points |
 | `pointsDescription` | Description for points. | Set the threshold of consecutive correct answers after which points are awarded and define the amount of points received from this step onwards.Valid value for correct steps is between 0-50 and for score 1-100 |
 | `pointNumber` | Label for point container. | Point number |
@@ -268,7 +296,6 @@ Here is all information about **`LabelsModel`**:
 | `tags` | Label for context tags container. | Tags |
 | `entity` | Label for entity search in tag. | Entity |
 | `campaign` | Label for context campaign container. | Campaign |
-| `tagNumber` | Label for context tag container's header. | Tag number |
 | `id` | Label for ID. | ID |
 | `idContentPlaceholder` | Placeholder for ID content in context. | Type the ID of your content |
 | `idCampaignPlaceholder` | Placeholder for ID content in campaign. | Type the ID of your campaign |
@@ -284,7 +311,7 @@ Here is all information about **`LabelsModel`**:
 | `typeContentPlaceholder` | Placeholder for type content in context. | Type the content's type |
 | `previewEitherOr` | Title in preview modal. | Preview Either/Or |
 | `clear` | Label tippy clear button | Clear |
-| `searchImage` | Label for search image input | Search image |
+| `searchImages` | Label for search image input | Search images |
 | `hideFilters` | Label for hyperlink to hide filters for image search | Hide filters |
 | `showFilters` | Label for hyperlink to show filters for image search | Show filters |
 | `dateFromTo` | Label for date from/to filter for image search | Date from/to |

package/components/Accordion/Accordion.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type AccordionProps = {
+    title: string;
+};
+declare const Accordion: React.FC<AccordionProps>;
+export default Accordion;

package/components/Buttons/CopyToClipboard.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type CopyToClipboardButtonProps = {
+    isUrlCopied: boolean;
+    isDisabled: boolean;
+    onClick: () => void;
+};
+declare const CopyToClipboardButton: React.FC<CopyToClipboardButtonProps>;
+export default CopyToClipboardButton;

package/components/Buttons/HomeButtons.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 type HomeButtonsProps = {
+    hideSignOutButton: boolean;
     toggleScreen: () => void;
     fansUnitedEnvironment: string;
 };

package/components/Buttons/Sportal365/Sportal365Button.d.ts

@@ -1,7 +1,8 @@
-import React from 'react';
+import React, { Dispatch, SetStateAction } from 'react';
+import Sportal365ImagesContainerToggleModel from '../../../models/Sportal365/Sportal365ImagesContainer';
 type Sportal365ButtonProps = {
-    toggleShowImagesContainer: () => void;
-    isQuestionsAndOptions?: boolean;
+    imageNode: string;
+    setShowImagesContainer: Dispatch<SetStateAction<Sportal365ImagesContainerToggleModel>>;
 };
 declare const Sportal365Button: React.FC<Sportal365ButtonProps>;
 export default Sportal365Button;

package/components/Checkbox/CheckboxFilter.d.ts

@@ -0,0 +1,9 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import EitherOrFiltersModel from '../../models/Filters/EitherOrFiltersModel';
+type CheckboxFilterProps = {
+    value: boolean;
+    setFilters: Dispatch<SetStateAction<EitherOrFiltersModel>>;
+    handleResetData: () => void;
+};
+declare const CheckboxFilter: React.FC<CheckboxFilterProps>;
+export default CheckboxFilter;

package/components/EitherOrs/EitherOrs.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 type EitherOrsProps = {
+    hideSignOutButton: boolean;
     fansUnitedEnvironment: string;
 };
 declare const EitherOrs: React.FC<EitherOrsProps>;

package/components/Filters/Filters.d.ts

@@ -0,0 +1,12 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import EitherOrFiltersModel from '../../models/Filters/EitherOrFiltersModel';
+import SelectOption from '../../models/Select/SelectOption';
+type FiltersProps = {
+    filters: EitherOrFiltersModel;
+    options: SelectOption[];
+    setOptions: Dispatch<SetStateAction<SelectOption[]>>;
+    setFilters: Dispatch<SetStateAction<EitherOrFiltersModel>>;
+    handleResetData: () => void;
+};
+declare const Filters: React.FC<FiltersProps>;
+export default Filters;

package/components/Main.d.ts

@@ -8,6 +8,7 @@ type MainProps = {
     sportal365Project?: string;
     sportal365Infrastructure?: 'shared' | 'betway';
     labels?: LabelsModel;
+    hideSignOutButton?: boolean;
 };
 declare const Main: React.FC<MainProps>;
 export default Main;

package/components/MainLayout.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 type MainLayoutProps = {
+    hideSignOutButton: boolean;
     fansUnitedEnvironment: string;
 };
 declare const MainLayout: React.FC<MainLayoutProps>;

package/components/Management/Context/ContextTabs.d.ts

@@ -0,0 +1,7 @@
+import React, { Dispatch, SetStateAction } from 'react';
+type ContextTabsProps = {
+    tabValue: string;
+    setTabValue: Dispatch<SetStateAction<string>>;
+};
+declare const ContextTabs: React.FC<ContextTabsProps>;
+export default ContextTabs;

package/components/Management/Flags/Flags.d.ts

@@ -1,8 +1,16 @@
 import React, { Dispatch, SetStateAction } from 'react';
 import RequestBody from '../../../models/RequestBody/RequestBody';
+import EitherOrFiltersModel from '../../../models/Filters/EitherOrFiltersModel';
+export declare const flagsSelectStyles: {
+    control: (provided: any) => any;
+    clearIndicator: (provided: any) => any;
+    input: (provided: any) => any;
+};
 type FlagsProps = {
     defaultValue: string[];
-    setRequestBody: Dispatch<SetStateAction<RequestBody>>;
+    showLabel?: boolean;
+    setObject: Dispatch<SetStateAction<RequestBody>> | Dispatch<SetStateAction<EitherOrFiltersModel>>;
+    handleResetData?: () => void;
 };
 declare const Flags: React.FC<FlagsProps>;
 export default Flags;

package/components/Management/Images/Image.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+type ImagesProps = {
+    id: number;
+    type: 'game' | 'option';
+    label: string;
+    imageUrl: string;
+    imageNode: string;
+    onChange: (value: string, imageNode: string) => void;
+};
+declare const Image: React.FC<ImagesProps>;
+export default Image;

package/components/Management/Images/Images.d.ts

@@ -2,8 +2,10 @@ import React from 'react';
 import ImagesModel from 'fansunited-sdk-esm/Core/Global/Models/Images/ImagesModel';
 import MiniGameImages from 'fansunited-sdk-esm/Core/Namespaces/MiniGames/Models/MiniGameImages';
 type ImagesProps = {
+    id: number;
+    type: 'game' | 'option';
+    loadedImages: ImagesModel | MiniGameImages;
     onChange: (value: string, imageCases: string) => void;
-    loadedImages?: ImagesModel | MiniGameImages;
 };
 declare const Images: React.FC<ImagesProps>;
 export default Images;

package/components/Management/Images/Sportal365/Sportal365Images.d.ts

@@ -1,13 +1,9 @@
 import React, { Dispatch, SetStateAction } from 'react';
+import Sportal365ImagesContainerToggleModel from '../../../../models/Sportal365/Sportal365ImagesContainer';
 type Sportal365ImagesProps = {
     onChangeImages: (url: string) => void;
-    type?: 'option';
-    imageNode?: string;
-    toggleShowImagesContainer?: () => void;
-    setShowImagesContainer?: Dispatch<SetStateAction<{
-        mainImage: boolean;
-        mobileImage: boolean;
-    }>>;
+    imageNode: string;
+    setShowImagesContainer: Dispatch<SetStateAction<Sportal365ImagesContainerToggleModel>>;
 };
 declare const Sportal365Images: React.FC<Sportal365ImagesProps>;
 export default Sportal365Images;

package/components/Management/InformationInput/InformationInput.d.ts

@@ -3,9 +3,7 @@ type InformationInputProps = {
     title: string;
     placeholder: string;
     defaultValue: string;
-    imageNode?: string;
     onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    onChangeImages?: (value: string, imageNode: string) => void;
 };
 declare const InformationInput: React.FC<InformationInputProps>;
 export default InformationInput;

package/components/Management/MainColumn.d.ts

@@ -0,0 +1,10 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import EitherOrById from '../../models/EitherOr/EitherOrById';
+type MainColumnProps = {
+    requestBody: EitherOrById;
+    setRequestBody: Dispatch<SetStateAction<EitherOrById>>;
+    description: string;
+    setDescription: Dispatch<SetStateAction<string>>;
+};
+declare const MainColumn: React.FC<MainColumnProps>;
+export default MainColumn;

package/components/Management/ManageEitherOr.d.ts

@@ -1,10 +1,9 @@
-import React from 'react';
+import React, { Dispatch, SetStateAction } from 'react';
 import EitherOrById from '../../models/EitherOr/EitherOrById';
+import EitherOrFiltersModel from '../../models/Filters/EitherOrFiltersModel';
 type ManageEitherOrProps = {
-    refetchEitherOrs: {
-        current: boolean;
-    };
     eitherOrById: EitherOrById | null;
+    setFilters: Dispatch<SetStateAction<EitherOrFiltersModel>>;
     toggleScreen: () => void;
     clearEitherOrById: () => void;
 };

package/components/Management/NumberInput/NumberInput.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 type NumberInputProps = {
     type: 'time' | 'lives' | 'points_correct_steps' | 'points_score' | 'options_value';
     defaultValue: number;
+    showDescription?: boolean;
     onChange: (value: number) => void;
 };
 declare const NumberInput: React.FC<NumberInputProps>;

package/components/Management/SideBar.d.ts

@@ -0,0 +1,12 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import EitherOrById from '../../models/EitherOr/EitherOrById';
+type SideBarProps = {
+    requestBody: EitherOrById;
+    rules: string;
+    adContent: string;
+    setRules: Dispatch<SetStateAction<string>>;
+    setAdContent: Dispatch<SetStateAction<string>>;
+    setRequestBody: Dispatch<SetStateAction<EitherOrById>>;
+};
+declare const SideBar: React.FC<SideBarProps>;
+export default SideBar;

package/components/Modals/ConfirmationModal.d.ts

@@ -1,11 +1,10 @@
-import React from 'react';
+import React, { Dispatch, SetStateAction } from 'react';
 import EitherOrBasicModel from 'fansunited-sdk-esm/Core/Namespaces/MiniGames/Models/EitherOr/EitherOrBasicModel';
+import EitherOrFiltersModel from '../../models/Filters/EitherOrFiltersModel';
 type ConfirmationModalProps = {
     isOpen: boolean;
     eitherOr: EitherOrBasicModel;
-    refetchEitherOrs: {
-        current: boolean;
-    };
+    setFilters: Dispatch<SetStateAction<EitherOrFiltersModel>>;
     handleClose: () => void;
 };
 declare const ConfirmationModal: React.FC<ConfirmationModalProps>;

package/components/Modals/ImageModal.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type ImageModalProps = {
+    imageUrl: string;
+    isOpen: boolean;
+    closeModal: () => void;
+};
+declare const ImageModal: React.FC<ImageModalProps>;
+export default ImageModal;

package/components/Select/ContextSelectFilter.d.ts

@@ -0,0 +1,14 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import EitherOrFiltersModel from '../../models/Filters/EitherOrFiltersModel';
+import SearchModel from 'fansunited-sdk-esm/Core/Namespaces/Football/Models/Search/SearchModel';
+import GroupSelectOption from '../../models/Select/GroupSelectOption';
+import SelectOption from '../../models/Select/SelectOption';
+export declare const formatGroupOptions: (result: SearchModel) => GroupSelectOption[];
+type ContextSelectFilterProps = {
+    options: SelectOption[];
+    setOptions: Dispatch<SetStateAction<SelectOption[]>>;
+    setFilters: Dispatch<SetStateAction<EitherOrFiltersModel>>;
+    handleResetData: () => void;
+};
+declare const ContextSelectFilter: React.FC<ContextSelectFilterProps>;
+export default ContextSelectFilter;

package/components/Select/ContextTagSelect.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import SelectOption from '../../models/Select/SelectOption';
+import TagsModel from 'fansunited-sdk-esm/Core/Namespaces/Activity/Models/RequestBody/Context/TagsModel';
+type ContextTagSelectProps = {
+    tags: TagsModel[];
+    onChangeTags: (entities: SelectOption[]) => void;
+};
+declare const ContextTagSelect: React.FC<ContextTagSelectProps>;
+export default ContextTagSelect;

package/components/Select/EitherOrSelectFilter.d.ts

@@ -0,0 +1,12 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import EitherOrFiltersModel from '../../models/Filters/EitherOrFiltersModel';
+type EitherOrSelectFilterProps = {
+    filterType: 'status' | 'sort';
+    defaultValue: string;
+    filterValues: string[];
+    showClearStatus?: boolean;
+    setFilters: Dispatch<SetStateAction<EitherOrFiltersModel>>;
+    handleResetData: () => void;
+};
+declare const EitherOrSelectFilter: React.FC<EitherOrSelectFilterProps>;
+export default EitherOrSelectFilter;

package/constants/constants.d.ts

@@ -1,4 +1,4 @@
 export declare const inputLabelStyle = "eow-text-xs eow-font-medium eow-block eow-mb-1 eow-uppercase eow-font-extrabold";
 export declare const inputStyle = "eow-rounded eow-border eow-border-gray-200 eow-w-full focus:eow-outline-none eow-px-3 eow-py-2";
 export declare const imagesMap: Map<string, string>;
-export declare const questionAndOptionImagesMap: Map<string, string>;
+export declare const optionImagesMap: Map<string, string>;