fansunited-widget-leaderboard v2.3.0

Leaderboard Management Widget

Welcome to Fans United Leaderboard Management Widget. The widget allows staff members with sufficient permissions to create new custom games with specific criteria. The criteria are: competition, teams, matches, games and fantasy. You can use this widget as it is and embed it in your platform, or you can use the Management Panel can be linked to competition, teams, matches, games and fantasy. With successfull installiation, you can create, edit, delete, see reports, statistics and so on.

Installation and usage

The easiest way to use fansunited-widget-leaderboard is to install it from npm as follows:

npm  install  fansunited-widget-leaderboard

or:

yarn  add  fansunited-widget-leaderboard

Here is an example how you can integrate Fans United Leaderboard Management Widget:

import  'fansunited-widget-leaderboard/style.css';
import { LeaderboardManager } from  'fansunited-widget-leaderboard';

const  App = () => {
	// Prop 'type' possible arguments: competition, teams, matches, games and fantasy. Case insensitive.
	return <LeaderboardManager fansUnitedApiKey={'your-api-key'} fansUnitedClientId={'your-client-id'} type={'competition'} />
}

Notes

• The widget is bundled as a React component and its usage is as simple as the above example

• Don't worry about your project's CSS. The widget's styling is done with Joy UI which is based on headless unstyle react components. This means that the widget's CSS will NOT affect yours. One important thing is that you need to import style.css file from package folder:

import 'fansunited-widget-leaderboard/style.css';

N.B: If you are using an entry point for importing all your stylings, you need to import fansunited-widget-leaderboard/style.css there as well

• Easy translation in every language. For more information check our Translation heading.

Props

type  LeaderboardManagerProps = {
	fansUnitedApiKey: string;
	fansUnitedClientId: string;
	type: string;
	fansUnitedLanguage?: string;
	fansUnitedEnvironment?: string;
	sportal365Project?: string;
	sportal365Infrastructure?: 'shared' | 'betway';
	labels?: LabelsModel;
	hideSignOutButton?: boolean;
};

Fans United Leaderboard Management Widget depends on Fans United JS SDK and Fans United Client API. Thats why fansUnitedApiKey and fansUnitedClientId are required. They will be provided to you from Fans United team.

The type prop is also required. The available options are competition, teams, matches, games and fantasy.

For other optional props here is some information:

• fansUnitedLanguage - for our sports APIs FansUnited platform supports different languages. For now they are Bulgarian (bg), English (en), Romanian (ro), Greek (el), Slovak (sk), Serbian (sr) and Hungarian (hu). If no value given it will be set to English (en).

• fansUnitedEnvironment - You can run the widget in the following environments: staging, production and watg. If no value given it will be set to production (prod).

• labels - you can easily translate all labels, UI messages, descriptions, placeholders and etc. with this prop. By default, Fans United Leaderboard Management Widget is available in English so if no value is given, the widget will be translated in English.

• sportal365Project - The Sportal365 project. Used as a request header when communicating with Sportal365 APIs.

• 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 - The prop is used to hide the sign out button which is positioned on the top right corner on the main screen of the widget.

Translation

You can easily translate Fans United Leaderboard 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:

import  'fansunited-widget-leaderboard/style.css';
import { LeaderboardManager } from  'fansunited-widget-leaderboard';

const labels = {
	userNotFound: 'User not found. Please try again.',
	create: 'Create',
	signOut: 'Sign out',
	manageWinners: 'Manage winners for custom game with name',
	manageCompetitionTitle: 'Manage custom competition game',
	manageTeamsTitle: 'Manage custom teams game',
	manageMatchesTitle: 'Manage custom matches game',
	manageGamesTitle: 'Manage custom games',
	manageFantasyTitle: 'Manage fantasy game',
	manageCompetitionDescription: 'Using this form, you can manage competition games. Choose which competition to collect points for, set the time frame, select markets, customize branding options, and much more.',
	manageTeamsDescription: 'Using this form, you can manage teams games. Choose which teams to collect points for, set the time frame, select markets, customize branding options, and much more.',
	manageMatchesDescription: 'Using this form, you can manage matches games. Choose which matches to collect points for, set the time frame, select markets, customize branding options, and much more.',
	manageGamesDescription: 'Using this form, you can manage games. Choose which games to collect points for, set the time frame, select markets, customize branding options, and much more.',
	manageFantasyDescription: 'Using this form, you can manage fantasy games. Choose for which competition will be the fantasy game based on. Set the time frame, groups, customize branding options, and much more.',
	back: 'Back',
	pending: 'Pending',
	live: 'Live',
	settled: 'Settled',
	name: 'Name',
	market: 'Market',
	fromDate: 'From Date',
	toDate: 'To Date',
	actions: 'Actions',
	timeFormat: 'DD.MM.YYYY',
	edit: 'Edit',
	delete: 'Delete',
	clearImage: 'Clear image',
	copyUrl: 'Copy URL',
	viewImage: 'View image',
	cropImage: 'Crop image',
	standings: 'Standings',
	additionalInformation: 'Additional information',
	add: 'Add',
	clearWinner: 'Clear winner',
	aspectRatio: 'Aspect ratio',
	crop: 'Crop',
	reset: 'Reset',
	id: 'ID',
	description: 'Description',
	status: 'Status',
	templateAutomaticallyChangeStatus: 'Automatically change status',
	marketSelection: 'Market Selection',
	marketSelectionDescription: 'Check what market users can predict for the specified template.',
	showAll: 'Show all',
	playerRelated: 'Player related',
	goals: 'Goals',
	corners: 'Corners',
	correctScores: 'Correct scores',
	misc: 'Misc',
	excludedProfiles: 'Excluded profiles',
	excludedProfilesPlaceholder: 'Search for a profile by their name or nickname',
	searchProfilesErrorMessage: 'There was a problem searching for profiles',
	branding: 'Branding',
	configuration: 'Configuration',
	marketFt1x2: '1X2 at full-time',
	marketHt1x2: '1X2 at half-time',
	marketBothTeamsScore: 'Both teams to score',
	marketDoubleChance: 'Double chance',
	marketHtFt: 'Half-time/Full-time',
	marketRedCardMatch: 'Red card in match',
	marketPenaltyMatch: 'Penalty in match',
	marketCornersMatch: 'Exact number of corners in match',
	marketCorrectScore: 'Correct score',
	marketCorrectScoreHalfTime: 'Correct score at half-time',
	marketCorrectScoreAdvanced: 'Advanced correct score',
	marketPlayerScore: 'Player to score in match',
	marketPlayerYellowCard: 'Yellow card for a player',
	marketPlayerRedCard: 'Red card for a player',
	marketPlayerScoreFirstGoal: 'Player to score first goal',
	marketPlayerScoreTwice: 'Player to score twice',
	marketPlayerScoreHattrick: 'Player to score a hat-trick',
	marketOverZeroGoals: 'Over 0.5 goals in the match',
	marketOverOneGoals: 'Over 1.5 goals in the match',
	marketOverTwoGoals: 'Over 2.5 goals in the match',
	marketOverThreeGoals: 'Over 3.5 goals in the match',
	marketOverFourGoals: 'Over 4.5 goals in the match',
	marketOverFiveGoals: 'Over 5.5 goals in the match',
	marketOverSixGoals: 'Over 6.5 goals in the match',
	marketOverSixCorners: 'Over 6.5 corners in the match',
	marketOverSevenCorners: 'Over 7.5 corners in the match',
	marketOverEightCorners: 'Over 8.5 corners in the match',
	marketOverNineCorners: 'Over 9.5 corners in the match',
	marketOverTenCorners: 'Over 10.5 corners in the match',
	marketOverElevenCorners: 'Over 11.5 corners in the match',
	marketOverTwelveCorners: 'Over 12.5 corners in the match',
	marketOverThirteenCorners: 'Over 13.5 corners in the match',
	competitionSelection: 'Competition Selection',
	competitionSelectionPlaceholder: 'Search for a competition by their name',
	competitionsSelectionPlaceholder: 'Search for competitions by their name',
	teamsSelectionPlaceholder: 'Search for teams by their name',
	searchCompetitionsErrorMessage: 'There was a problem searching for competitions',
	groups: 'Groups',
	groupsDescription: 'You can define a label, an optional ID, and a time frame for your groups. Use this information to organize matches from the competition, including rounds, game weeks, group stages, knockout stages, or specific dates for shorter competitions.',
	addGroup: 'Add Group',
	editGroup: 'Edit Group',
	saveGroup: 'Save Group',
	removeGroup: 'Remove Group',
	label: 'Label',
	loadMore: 'Load more',
	rules: 'Rules',
	adContent: 'Ad content',
	adContentPlaceholder: 'Paste HTML here...',
	flagsLabel: 'Flags',
	flagsPlaceholder: 'Type your flag and hit enter',
	colors: 'Colors',
	primaryColor: 'Primary color',
	secondaryColor: 'Secondary color',
	contentColor: 'Content color',
	backgroundColor: 'Background color',
	borderColor: 'Border color',
	additionalColor: 'Additional color',
	urls: 'URLs',
	primaryUrl: 'Primary URL',
	secondaryUrl: 'Secondary URL',
	privacyPolicyUrl: 'Privacy policy URL',
	termsAndConditionsUrl: 'Terms and conditions URL',
	additionalUrl: 'Additional URL',
	mainLogo: 'Main Logo',
	mobileLogo: 'Mobile logo',
	backgroundImage: 'Background image',
	mobileBackgroundImage: 'Mobile background image',
	additionalImage: 'Additional image',
	hideMoreImages: 'Hide more images',
	showMoreImages: 'Show more images',
	images: 'Images',
	mainImage: 'Main',
	coverImage: 'Cover',
	mobileImage: 'Mobile',
	uploadImage: 'Upload Image',
	sportal365Images: 'Sportal365 Images',
	related: 'Related',
	games: 'Games',
	templates: 'Templates',
	labelsHeading: 'Labels',
	customFields: 'Custom fields',
	keyDynamicFields: 'Key',
	valueDynamicFields: 'Value',
	position: 'Position',
	points: 'Points',
	exportButton: 'Export',
	winnersDescription: 'Describe the winners...',
	note: 'Note',
	tags: 'Tags',
	tagsPlaceholder: 'Provide tags for the winner...',
	save: 'Save',
	preview: 'Preview',
	expand: 'Expand',
	collapse: 'Collapse',
	repeatedValueMessage: 'You have entered a repeated value. Please enter a different one.',
	searchImage: 'Search image',
	hideFilters: 'Hide filters',
	showFilters: 'Show filters',
	filters: 'Filters',
	search: 'Search',
	previous: 'Previous',
	next: 'Next',
	csvModalTitle: 'Enter how many users should be exported',
	csvModalDescription: '',
	csvModalPlaceholder: 'Export the first X users...',
	csvModalDownloadButton: 'Download as CSV file',
	csvModalValidationMessage: 'Input value has to be an integer number between 1 and 100',
	csvModalErrorMessage: "There was a problem with fetching game's report data",
	close: 'Close',
	deleteCustomGameTitle: 'Delete custom game',
	deleteCustomGameDescription: 'Are you sure you want to delete',
	predictionsBy: 'Predictions by',
	latestMatches: 'Latest matches',
	latestGames: 'Latest games',
	match: 'Match',
	total: 'Total',
	settledAt: 'Settled at',
	resettledAt: 'Resettled at',
	won: 'Won',
	partiallyWon: 'Partially won',
	lost: 'Lost',
	correct: 'Correct',
	incorrect: 'Incorrect',
	partiallyCorrect: 'Partially correct',
	predictions: 'Predictions',
	userPredictions: 'User\'s predictions',
	prediction: 'Prediction',
	dates: 'Dates',
	createdAt: 'Created at',
	updatedAt: 'Updated at',
	noDataAvailable: 'No data available',
	noMatchesAvailable: 'No matches available',
	noStandingsAvailable: 'No standings available',
	noPredictionsAvailable: 'No predictions available',
	allMatchesTitle: 'All matches',
	allMatchesDescription: 'All matches who are part of the custom game',
	upcomingMatchesTitle: 'Upcoming matches',
	upcomingMatchesDescription: 'All upcoming matches who are part of the custom game',
	finishedMatchesTitle: 'Finished matches',
	finishedMatchesDescription: 'All finished matches who are part of the custom game',
	groupedMatchesTitle: 'Grouped matches',
	groupedMatchesDescription: 'All matches who are part of the custom game\'s groups',
	matches: 'Matches',
	stats: 'Stats',
	comingSoon: 'Coming soon',
	showDetails: 'Show details',
	configureWinners: 'Configure Winners',
	nicknameAndName: 'Nickname & Name',
	schedule: 'Schedule',
	createScheduledTaskMessage: 'You have successfully created scheduled task',
	createScheduledTaskErrorMessage: 'An error occurred while creating scheduled task. Please try again later',
	updateScheduledTaskMessage: 'You have successfully updated scheduled task',
	updateScheduledTaskErrorMessage: 'An error occurred while updating scheduled task. Please try again later',
	deleteScheduledTaskMessage: 'You have successfully deleted scheduled task',
	deleteScheduledTaskErrorMessage: 'An error occurred while deleting scheduled task. Please try again later',
	changeStatusTo: 'Change status to:',
	at: 'At:',
	deleteScheduledTaskModalTitle: 'Delete scheduled task',
	deleteScheduledTaskModalParagraph: 'Are you sure you want to delete the following scheduled task: ',
	scheduledTaskNotAvailable: 'To configure scheduled tasks you need to edit your game',
	getMatchesErrorMessage: 'An error occurred while fetching the matches. Please try again later',
	getGamesErrorMessage: 'An error occurred while fetching games. Please try again later',
	matchAddedToSelectedMessage: "added to 'Selected matches'",
	matchesAddedToSelectedMessage: "All matches are added to 'Selected matches'",
	matchRemovedFromSelectedMessage: "removed from 'Selected matches'",
	gameAddedToSelectedMessage: "added to 'Selected games'",
	gamesAddedToSelectedMessage: "All games are added to 'Selected games'",
	gameRemovedFromSelectedMessage: "removed from 'Selected games'",
	gameDuration: 'Game Duration',
	gameDurationDescription: 'Select the game duration. Only points accumulated between the from and to dates will be counted.',
	matchesSelection: 'Matches Selection',
	matchesSelectionDescription: 'Search for matches using the filters in the right column and add them to your selection on the left. Only points earned from the selected matches will be counted. The matches are grouped by month for your convenience.',
	addAll: 'Add All',
	addMatch: 'Add match',
	removeMatch: 'Remove match',
	searchMatches: 'Search matches',
	selectedMatches: 'Selected matches',
	getTemplatesErrorMessage: 'There was a problem with fetching templates. Please try again. For more information contact Fans United staff.',
	getTemplateByIdErrorMessage: 'There was a problem with fetching specified template. Please try again',
	createTemplateMessage: 'You have successfully created a template.',
	editTemplateMessage: 'You have successfully edited the template.',
	provideNameTemplateErrorMessage: 'You need to provide a name to your template!',
	provideDurationTemplateErrorMessage: 'You need to provide a duration to your template!',
	durationExceededTemplateErrorMessage: 'The template duration should be no longer than a year!',
	durationFromDateAfterToDateErrorMessage: 'From Date should be before To Date',
	createTemplateErrorMessage: 'There was a problem with creating the template. Please try again.',
	editTemplateErrorMessage: 'There was a problem with editing the template. Please try again.',
	leaderboardErrorMessage: 'There was a problem with displaying leaderboard. Please try again.',
	noSetWinnersMessage: 'No winners are set',
	winnersErrorMessage: 'There was a problem with fetching information about winners. Please try again.',
	positionAndWinnerRequiredMessage: 'Position and winner are required!',
	sameChosenWinnerMessage: 'You have selected same winners. Each winner has to be unique!',
	criteriaNotFulfilledErrorMessage: 'You need to select at least one entity to create the custom game',
	groupsRequiredFieldsErrorMessage: 'You need to provide ID, label and a time frame for the group',
	groupsSpecialCharsErrorMessage: 'Group ID and group label can\'t contain special characters or whitespace',
	groupsUniqueIdErrorMessage: 'You need to provide a unique ID for each group',
	dynamicFieldsKeysValidationMessage: 'Only lowercase, numbers and underscore are accepted as keys',
	createWinnersMessage: 'You have successfully created winners',
	createWinnersErrorMessage: 'There was a problem with creating winners. Please try again.',
	editWinnersMessage: 'You have successfully edited winners',
	editWinnersErrorMessage: 'There was a problem with editing winners. Please try again.',
	urlCopiedToClipboardMessage: 'URL copied to clipboard',
	imageDeletedMessage: 'Image deleted',
	imageResetMessage: 'The initial size of the image has been restored',
	uploadingImageMessage: 'You have successfully uploaded image',
	generateSignedInUrlErrorMessage: 'There was a problem generating signed in URL to store the image in bucket. Please try again',
	uploadingImageErrorMessage: 'There was a problem with uploading image to bucket. Please try again',
	encryptingImageErrorMessage: 'There was a problem with encrypting image before uploading it to bucket. Please try again',
	searchSportal365ImagesErrorMessage: 'There was a problem with searching images from Sportal 365 API. Please try again',
	customGameDeleteMessage: 'Custom game deleted successfully!',
	customGameDeleteErrorMessage: 'There was a problem with deleting custom game. Please try again',
	templateMatchesErrorMessage: 'There was a problem with fetching template matches. Please try again',
	templateGamesPredictionsErrorMessage: "There was a problem with fetching user's predictions details. Please try again",
	searchTeamsErrorMessage: 'There was a problem searching for teams'
};

const  App = () => {
return <LeaderboardManager fansUnitedApiKey={'your-api-key'} fansUnitedClientId={'your-client-id'} type="competition" labels={labels}/>
}

Here is all information about LabelsModel: