Skip to content

Commit

Permalink
fix: Premium settings using wrong Tag variant in Omnichannel (#34060)
Browse files Browse the repository at this point in the history
  • Loading branch information
dougfabris authored Nov 26, 2024
1 parent 7855bc3 commit e49c987
Show file tree
Hide file tree
Showing 3 changed files with 52 additions and 40 deletions.
5 changes: 5 additions & 0 deletions .changeset/lucky-mirrors-tickle.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@rocket.chat/meteor': patch
---

Fixes an issue where premium settings were using the wrong `Tag` variant in Omnichannel Appearance configuration
Original file line number Diff line number Diff line change
@@ -1,32 +1,32 @@
import { FieldLabel as BaseFieldLabel, Box, Tag } from '@rocket.chat/fuselage';
import { FieldLabel, Box, Tag } from '@rocket.chat/fuselage';
import type { ComponentProps } from 'react';
import React from 'react';
import { useTranslation } from 'react-i18next';

import { useHasLicenseModule } from '../../../hooks/useHasLicenseModule';

type FieldLabelProps = ComponentProps<typeof BaseFieldLabel> & {
type AppearanceFieldLabelProps = ComponentProps<typeof FieldLabel> & {
premium?: boolean;
children: string;
};

const FieldLabel = ({ children: label, premium = false }: FieldLabelProps) => {
const AppearanceFieldLabel = ({ children, premium = false }: AppearanceFieldLabelProps) => {
const { t } = useTranslation();
const hasLicense = useHasLicenseModule('livechat-enterprise');
const shouldDisableEnterprise = premium && !hasLicense;

if (!shouldDisableEnterprise) {
return <BaseFieldLabel>{label}</BaseFieldLabel>;
return <FieldLabel>{children}</FieldLabel>;
}

return (
<BaseFieldLabel>
<FieldLabel>
<Box is='span' mie={4}>
{label}
{children}
</Box>
<Tag variant='primary'>{t('Premium')}</Tag>
</BaseFieldLabel>
<Tag variant='featured'>{t('Premium')}</Tag>
</FieldLabel>
);
};

export default FieldLabel;
export default AppearanceFieldLabel;
69 changes: 38 additions & 31 deletions apps/meteor/client/views/omnichannel/appearance/AppearanceForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ import React from 'react';
import { Controller, useFormContext } from 'react-hook-form';
import { useTranslation } from 'react-i18next';

import FieldLabel from './AppearanceFieldLabel';
import AppearanceFieldLabel from './AppearanceFieldLabel';
import MarkdownText from '../../../components/MarkdownText';
import { useHasLicenseModule } from '../../../hooks/useHasLicenseModule';

Expand Down Expand Up @@ -60,9 +60,9 @@ const AppearanceForm = () => {
<FieldGroup>
<Field>
<FieldRow>
<FieldLabel premium htmlFor={livechatHideWatermarkField}>
<AppearanceFieldLabel premium htmlFor={livechatHideWatermarkField}>
{t('Livechat_hide_watermark')}
</FieldLabel>
</AppearanceFieldLabel>
<Controller
name='Livechat_hide_watermark'
control={control}
Expand All @@ -72,11 +72,10 @@ const AppearanceForm = () => {
/>
</FieldRow>
</Field>

<Field>
<FieldLabel premium htmlFor={livechatBackgroundField}>
<AppearanceFieldLabel premium htmlFor={livechatBackgroundField}>
{t('Livechat_background')}
</FieldLabel>
</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_background'
Expand All @@ -92,9 +91,9 @@ const AppearanceForm = () => {
</Field>

<Field>
<FieldLabel premium htmlFor={livechatWidgetPositionField}>
<AppearanceFieldLabel premium htmlFor={livechatWidgetPositionField}>
{t('Livechat_widget_position_on_the_screen')}
</FieldLabel>
</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_widget_position'
Expand All @@ -116,9 +115,9 @@ const AppearanceForm = () => {
</Field>

<Field>
<FieldLabel premium htmlFor={livechatHideSystemMessagesField}>
<AppearanceFieldLabel premium htmlFor={livechatHideSystemMessagesField}>
{t('Livechat_hide_system_messages')}
</FieldLabel>
</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_hide_system_messages'
Expand All @@ -143,9 +142,9 @@ const AppearanceForm = () => {
</Field>
<Field>
<FieldRow>
<FieldLabel htmlFor={omnichannelVisitorsCanCloseConversationField}>
<AppearanceFieldLabel htmlFor={omnichannelVisitorsCanCloseConversationField}>
{t('Omnichannel_allow_visitors_to_close_conversation')}
</FieldLabel>
</AppearanceFieldLabel>
<Controller
name='Omnichannel_allow_visitors_to_close_conversation'
control={control}
Expand All @@ -161,7 +160,7 @@ const AppearanceForm = () => {
<Accordion.Item defaultExpanded title={t('Livechat_online')}>
<FieldGroup>
<Field>
<FieldLabel htmlFor={livechatTitleField}>{t('Title')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatTitleField}>{t('Title')}</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_title'
Expand All @@ -171,7 +170,7 @@ const AppearanceForm = () => {
</FieldRow>
</Field>
<Field>
<FieldLabel htmlFor={livechatTitleColorField}>{t('Title_bar_color')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatTitleColorField}>{t('Title_bar_color')}</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_title_color'
Expand All @@ -182,7 +181,9 @@ const AppearanceForm = () => {
</Field>
<Field>
<FieldRow>
<FieldLabel htmlFor={livechatEnableMessageCharacterLimit}>{t('Livechat_enable_message_character_limit')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatEnableMessageCharacterLimit}>
{t('Livechat_enable_message_character_limit')}
</AppearanceFieldLabel>
<Controller
name='Livechat_enable_message_character_limit'
control={control}
Expand All @@ -193,7 +194,7 @@ const AppearanceForm = () => {
</FieldRow>
</Field>
<Field>
<FieldLabel htmlFor={livechatMessageCharacterLimit}>{t('Message_Characther_Limit')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatMessageCharacterLimit}>{t('Message_Characther_Limit')}</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_message_character_limit'
Expand All @@ -212,7 +213,7 @@ const AppearanceForm = () => {
</Field>
<Field>
<FieldRow>
<FieldLabel htmlFor={livechatShowAgentInfo}>{t('Show_agent_info')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatShowAgentInfo}>{t('Show_agent_info')}</AppearanceFieldLabel>
<Controller
name='Livechat_show_agent_info'
control={control}
Expand All @@ -222,7 +223,7 @@ const AppearanceForm = () => {
</Field>
<Field>
<FieldRow>
<FieldLabel htmlFor={livechatShowAgentEmail}>{t('Show_agent_email')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatShowAgentEmail}>{t('Show_agent_email')}</AppearanceFieldLabel>
<Controller
name='Livechat_show_agent_email'
control={control}
Expand All @@ -237,7 +238,7 @@ const AppearanceForm = () => {
<FieldGroup>
<Field>
<FieldRow>
<FieldLabel htmlFor={livechatDisplayOfflineForm}>{t('Display_offline_form')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatDisplayOfflineForm}>{t('Display_offline_form')}</AppearanceFieldLabel>
<Controller
name='Livechat_display_offline_form'
control={control}
Expand All @@ -246,7 +247,9 @@ const AppearanceForm = () => {
</FieldRow>
</Field>
<Field>
<FieldLabel htmlFor={livechatOfflineFormUnavailableField}>{t('Offline_form_unavailable_message')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatOfflineFormUnavailableField}>
{t('Offline_form_unavailable_message')}
</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_offline_form_unavailable'
Expand All @@ -256,7 +259,7 @@ const AppearanceForm = () => {
</FieldRow>
</Field>
<Field>
<FieldLabel htmlFor={livechatOfflineMessageField}>{t('Offline_message')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatOfflineMessageField}>{t('Offline_message')}</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_offline_message'
Expand All @@ -266,7 +269,7 @@ const AppearanceForm = () => {
</FieldRow>
</Field>
<Field>
<FieldLabel htmlFor={livechatOfflineTitleField}>{t('Title_offline')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatOfflineTitleField}>{t('Title_offline')}</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_offline_title'
Expand All @@ -276,7 +279,7 @@ const AppearanceForm = () => {
</FieldRow>
</Field>
<Field>
<FieldLabel htmlFor={livechatOfflineTitleColorField}>{t('Title_bar_color_offline')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatOfflineTitleColorField}>{t('Title_bar_color_offline')}</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_offline_title_color'
Expand All @@ -286,7 +289,7 @@ const AppearanceForm = () => {
</FieldRow>
</Field>
<Field>
<FieldLabel htmlFor={livechatOfflineEmailField}>{t('Email_address_to_send_offline_messages')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatOfflineEmailField}>{t('Email_address_to_send_offline_messages')}</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_offline_email'
Expand All @@ -296,7 +299,7 @@ const AppearanceForm = () => {
</FieldRow>
</Field>
<Field>
<FieldLabel htmlFor={livechatOfflineSuccessMessageField}>{t('Offline_success_message')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatOfflineSuccessMessageField}>{t('Offline_success_message')}</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_offline_success_message'
Expand All @@ -312,7 +315,7 @@ const AppearanceForm = () => {
<FieldGroup>
<Field>
<FieldRow>
<FieldLabel htmlFor={livechatRegistrationForm}>{t('Enabled')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatRegistrationForm}>{t('Enabled')}</AppearanceFieldLabel>
<Controller
name='Livechat_registration_form'
control={control}
Expand All @@ -322,7 +325,7 @@ const AppearanceForm = () => {
</Field>
<Field>
<FieldRow>
<FieldLabel htmlFor={livechatNameFieldRegistrationForm}>{t('Show_name_field')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatNameFieldRegistrationForm}>{t('Show_name_field')}</AppearanceFieldLabel>
<Controller
name='Livechat_name_field_registration_form'
control={control}
Expand All @@ -334,7 +337,7 @@ const AppearanceForm = () => {
</Field>
<Field>
<FieldRow>
<FieldLabel htmlFor={livechatEmailFieldRegistrationForm}>{t('Show_email_field')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatEmailFieldRegistrationForm}>{t('Show_email_field')}</AppearanceFieldLabel>
<Controller
name='Livechat_email_field_registration_form'
control={control}
Expand All @@ -345,7 +348,9 @@ const AppearanceForm = () => {
</FieldRow>
</Field>
<Field>
<FieldLabel htmlFor={livechatRegistrationFormMessageField}>{t('Livechat_registration_form_message')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatRegistrationFormMessageField}>
{t('Livechat_registration_form_message')}
</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_registration_form_message'
Expand All @@ -362,7 +367,9 @@ const AppearanceForm = () => {
<Accordion.Item title={t('Conversation_finished')}>
<FieldGroup>
<Field>
<FieldLabel htmlFor={livechatConversationFinishedMessageField}>{t('Conversation_finished_message')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatConversationFinishedMessageField}>
{t('Conversation_finished_message')}
</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_conversation_finished_message'
Expand All @@ -374,7 +381,7 @@ const AppearanceForm = () => {
</FieldRow>
</Field>
<Field>
<FieldLabel htmlFor={livechatConversationFinishedTextField}>{t('Conversation_finished_text')}</FieldLabel>
<AppearanceFieldLabel htmlFor={livechatConversationFinishedTextField}>{t('Conversation_finished_text')}</AppearanceFieldLabel>
<FieldRow>
<Controller
name='Livechat_conversation_finished_text'
Expand Down

0 comments on commit e49c987

Please sign in to comment.