LogoMkSaaS Docs
LogoMkSaaS Docs
HomepageIntroductionGetting StartedEnvironment Setup
Configuration

Integrations

DatabaseAuthenticationEmailNewsletterStoragePaymentCreditsCron JobsAIAnalyticsNotificationCaptchaChatboxAffiliates

Customization

MetadataFontsThemesImagesi18nBlogDocsComponentsCustom PagesLanding PageUser Management

Codebase

CodebaseIDE SetupProject StructureFormatting & LintingUpdating the Codebase
X (Twitter)

Credit packages

Configuring credit packages

Expands the credit packages defined in website.tsx with translated content.

src/config/credits-config.tsx
// Returns credit packages with translated content
export function getCreditPackages(): Record<string, CreditPackage> {
  const t = useTranslations('CreditPackages');
  const creditsConfig = websiteConfig.credits;
  const packages: Record<string, CreditPackage> = {};

  // Add translated content to each package
  if (creditsConfig.packages.basic) {
    packages.basic = {
      ...creditsConfig.packages.basic,
      name: t('basic.name'),
      description: t('basic.description'),
    };
  }
  ...
}

Each credit package in the packages object can have the following properties:

PropertyTypeDescription
idstringUnique identifier for the package
namestring?Display name of the package
descriptionstring?Description of the package
popularbooleanWhether this package is recommended
creditsnumberNumber of credits included in the package
priceobjectPrice info, including priceId, amount, currency, allowPromotionCode
expireDaysnumber?Validity period (days) for the credits, optional, undefined means no expire
disabledboolean?Whether to disable this package in UI, optional

Q: What is the difference between the credit packages in website.tsx and the credit packages in credits-config.tsx?

A: The website.tsx file defines the basic information about the credit packages, excluding locale-specific information, whereas the credits-config.tsx file enhances these packages by adding translated content.

Credits

Next Steps

Now that you understand the credit packages configuration, explore these related topics:

Website Configuration

Configure core settings for your MkSaaS website

Price Configuration

Configure the price plans of the product

Footer Configuration

Configure the links in the website footer

Sidebar Configuration

Configure the navigation menu for dashboard

Table of Contents

Next Steps