Add note support to (party) block opponents (#3348)

* opponentDisplay Modules

* player display modules

* fix alignment issue

components/opponent/commons/opponent_display.lua

@@ -189,6 +189,8 @@ OpponentDisplay.propTypes.BlockOpponent = {
 ---@field abbreviateTbd boolean?
 ---@field playerClass string?
 ---@field teamStyle teamStyle?
+---@field dq boolean?
+---@field note string|number|nil
 
 --[[
 Displays an opponent as a block element. The width of the component is
@@ -228,9 +230,15 @@ end
 function OpponentDisplay.BlockPlayers(props)
 	local opponent = props.opponent
 
-	local playerNodes = Array.map(opponent.players, function(player)
-		return PlayerDisplay.BlockPlayer(Table.merge(props, {player = player, team = player.team}))
-			:addClass(props.playerClass)
+	--only apply note to first player, hence extract it here
+	local note = Table.extract(props, 'note')
+
+	local playerNodes = Array.map(opponent.players, function(player, playerIndex)
+		return PlayerDisplay.BlockPlayer(Table.merge(props, {
+			player = player,
+			team = player.team,
+			note = playerIndex == 1 and note or nil,
+		})):addClass(props.playerClass)
 	end)
 
 	local playersNode = mw.html.create('div')

components/opponent/commons/player_display.lua

@@ -33,6 +33,7 @@ PlayerDisplay.propTypes.BlockPlayer = {
 	showLink = 'boolean?',
 	showPlayerTeam = 'boolean?',
 	abbreviateTbd = 'boolean?',
+	note = 'string?',
 }
 
 --[[
@@ -44,14 +45,22 @@ function PlayerDisplay.BlockPlayer(props)
 	local player = props.player
 
 	local zeroWidthSpace = '​'
-	local nameNode = mw.html.create(props.dq and 's' or 'span'):addClass('name')
+	local nameNode = mw.html.create(props.dq and 's' or 'span')
 		:wikitext(props.abbreviateTbd and Opponent.playerIsTbd(player) and TBD_ABBREVIATION
 			or props.showLink ~= false and Logic.isNotEmpty(player.pageName)
 			and '[[' .. player.pageName .. '|' .. player.displayName .. ']]'
 			or Logic.emptyOr(player.displayName, zeroWidthSpace)
 		)
 	DisplayUtil.applyOverflowStyles(nameNode, props.overflow or 'ellipsis')
 
+	if props.note then
+		nameNode = mw.html.create('span'):addClass('name')
+			:node(nameNode)
+			:tag('sup'):addClass('note'):wikitext(props.note):done()
+	else
+		nameNode:addClass('name')
+	end
+
 	local flagNode
 	if props.showFlag ~= false and player.flag then
 		flagNode = PlayerDisplay.Flag(player.flag)

components/opponent/commons/starcraft_starcraft2/opponent_display_starcraft.lua

@@ -178,19 +178,16 @@ function StarcraftOpponentDisplay.PlayerBlockOpponent(props)
 	local opponent = props.opponent
 	local showRace = props.showRace ~= false
 
-	local playerNodes = Array.map(opponent.players, function(player)
-		return StarcraftPlayerDisplay.BlockPlayer({
-			flip = props.flip,
-			overflow = props.overflow,
+	--only apply note to first player, hence extract it here
+	local note = Table.extract(props, 'note')
+
+	local playerNodes = Array.map(opponent.players, function(player, playerIndex)
+		return StarcraftPlayerDisplay.BlockPlayer(Table.merge(props, {
 			player = player,
-			showFlag = props.showFlag,
-			showLink = props.showLink,
-			showPlayerTeam = props.showPlayerTeam,
-			showRace = showRace and not opponent.isArchon and not opponent.isSpecialArchon,
 			team = player.team,
-			abbreviateTbd = props.abbreviateTbd,
-		})
-			:addClass(props.playerClass)
+			note = playerIndex == 1 and note or nil,
+			showRace = showRace and not opponent.isArchon and not opponent.isSpecialArchon,
+		})):addClass(props.playerClass)
 	end)
 
 	if #opponent.players == 1 then

components/opponent/commons/starcraft_starcraft2/player_display_starcraft.lua

@@ -39,6 +39,7 @@ StarcraftPlayerDisplay.propTypes.BlockPlayer = {
 	showPlayerTeam = 'boolean?',
 	showRace = 'boolean?',
 	abbreviateTbd = 'boolean?',
+	note = 'string?',
 }
 
 --[[
@@ -50,7 +51,7 @@ function StarcraftPlayerDisplay.BlockPlayer(props)
 	local player = props.player
 
 	local zeroWidthSpace = '​'
-	local nameNode = html.create(props.dq and 's' or 'span'):addClass('name')
+	local nameNode = html.create(props.dq and 's' or 'span')
 		:wikitext(
 			props.abbreviateTbd and Opponent.playerIsTbd(player) and TBD_ABBREVIATION
 			or props.showLink ~= false and player.pageName
@@ -59,6 +60,14 @@ function StarcraftPlayerDisplay.BlockPlayer(props)
 		)
 	DisplayUtil.applyOverflowStyles(nameNode, props.overflow or 'ellipsis')
 
+	if props.note then
+		nameNode = mw.html.create('span'):addClass('name')
+			:node(nameNode)
+			:tag('sup'):addClass('note'):wikitext(props.note):done()
+	else
+		nameNode:addClass('name')
+	end
+
 	local flagNode
 	if props.showFlag ~= false and player.flag then
 		flagNode = PlayerDisplay.Flag(player.flag)

components/opponent/wikis/fortnite/opponent_display_custom.lua

@@ -102,18 +102,15 @@ end
 function FortniteOpponentDisplay.PlayerBlockOpponent(props)
 	local opponent = props.opponent
 
-	local playerNodes = Array.map(opponent.players, function(player)
-		return PlayerDisplay.BlockPlayer({
-			flip = props.flip,
-			overflow = props.overflow,
+	--only apply note to first player, hence extract it here
+	local note = Table.extract(props, 'note')
+
+	local playerNodes = Array.map(opponent.players, function(player, playerIndex)
+		return PlayerDisplay.BlockPlayer(Table.merge(props, {
 			player = player,
-			showFlag = props.showFlag,
-			showLink = props.showLink,
-			showPlayerTeam = props.showPlayerTeam,
 			team = player.team,
-			abbreviateTbd = props.abbreviateTbd,
-		})
-			:addClass(props.playerClass)
+			note = playerIndex == 1 and note or nil,
+		})):addClass(props.playerClass)
 	end)
 
 	if #opponent.players == 1 then

components/opponent/wikis/warcraft/opponent_display_custom.lua

@@ -95,9 +95,16 @@ function CustomOpponentDisplay.BlockPlayers(props)
 	local opponent = props.opponent
 	local showRace = props.showRace ~= false
 
-	local playerNodes = Array.map(opponent.players, function(player)
-		return PlayerDisplay.BlockPlayer(Table.merge(props, {team = player.team, player = player, showRace = showRace}))
-			:addClass(props.playerClass)
+	--only apply note to first player, hence extract it here
+	local note = Table.extract(props, 'note')
+
+	local playerNodes = Array.map(opponent.players, function(player, playerIndex)
+		return PlayerDisplay.BlockPlayer(Table.merge(props, {
+			team = player.team,
+			player = player,
+			showRace = showRace,
+			note = playerIndex == 1 and note or nil,
+		})):addClass(props.playerClass)
 	end)
 
 	local playersNode = mw.html.create('div')

components/opponent/wikis/warcraft/player_display_custom.lua

@@ -33,13 +33,14 @@ CustomPlayerDisplay.propTypes.BlockPlayer = {
 	showPlayerTeam = 'boolean?',
 	showRace = 'boolean?',
 	abbreviateTbd = 'boolean?',
+	note = 'string?',
 }
 
 function CustomPlayerDisplay.BlockPlayer(props)
 	DisplayUtil.assertPropTypes(props, CustomPlayerDisplay.propTypes.BlockPlayer)
 	local player = props.player
 
-	local nameNode = mw.html.create(props.dq and 's' or 'span'):addClass('name')
+	local nameNode = mw.html.create(props.dq and 's' or 'span')
 		:wikitext(
 			props.abbreviateTbd and Opponent.playerIsTbd(player) and TBD_ABBREVIATION
 			or props.showLink ~= false and player.pageName
@@ -48,6 +49,14 @@ function CustomPlayerDisplay.BlockPlayer(props)
 		)
 	DisplayUtil.applyOverflowStyles(nameNode, props.overflow or 'ellipsis')
 
+	if props.note then
+		nameNode = mw.html.create('span'):addClass('name')
+			:node(nameNode)
+			:tag('sup'):addClass('note'):wikitext(props.note):done()
+	else
+		nameNode:addClass('name')
+	end
+
 	local flagNode
 	if props.showFlag ~= false and player.flag then
 		flagNode = PlayerDisplay.Flag(player.flag)