import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
import { s as styleInject, u as useViewHandler } from './index-bbdfb97a.js';
import { useState, useEffect } from 'react';
import { observer } from 'mobx-react-lite';
import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
import '@babel/runtime/helpers/defineProperty';
import 'react-dynamic-multi-render';
import '@babel/runtime/helpers/asyncToGenerator';
import '@babel/runtime/helpers/objectWithoutProperties';
import '@babel/runtime/regenerator';
import '@babel/runtime/helpers/classCallCheck';
import '@babel/runtime/helpers/createClass';
import '@babel/runtime/helpers/toConsumableArray';
import '@crystaldesign/diva-utils';
import 'mobx';
import '@crystaldesign/web-planner-logic';
import 'classnames';
import 'qrcode.react';
import '@babel/runtime/helpers/typeof';
import 'flat';
import 'react-switch';
import 'react-countup';

var wrapper = "wrapper-PiHd4";
var title = "title-50yik";
var text = "text-LbROy";
var progressText = "progressText-NTSPw";
var progressBar = "progressBar-M9LH7";
var progressFill = "progressFill-2bm6H";
var css_248z = ".wrapper-PiHd4 {\n  text-align: center;\n  color: #2a4b63;\n  color: var(--infoBannerColor, #2a4b63);\n  width: calc(100% - 42px);\n  padding: 12px 16px;\n  background-color: #f5f9fc;\n  background-color: var(--infoBannerBackground, #f5f9fc);\n  border-radius: 8px;\n}\n\n.title-50yik {\n  font-weight: bold;\n  font-size: 17px;\n  margin-bottom: 4px;\n}\n\n.text-LbROy {\n  font-size: 14px;\n  margin-bottom: 8px;\n}\n\n.progressText-NTSPw {\n  font-size: 13px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  font-weight: 500;\n}\n\n.progressBar-M9LH7 {\n  width: 100%;\n  height: 8px;\n  background-color: #e0e0e0;\n  background-color: var(--infoBannerProgressBarBackground, #e0e0e0);\n  border-radius: 4px;\n  overflow: hidden;\n  margin-top: 8px;\n}\n\n.progressFill-2bm6H {\n  height: 100%;\n  transition:\n    width 4s ease,\n    background-color 0.3s ease;\n  border-radius: 4px;\n}\n\n.mobile .title-50yik {\n  font-size: 1em;\n}\n\n.mobile .wrapper-PiHd4 {\n  font-size: 0.9em;\n}\n";
styleInject(css_248z);

var InfoBanner = function InfoBanner(_ref) {
  _objectDestructuringEmpty(_ref);
  var _useTranslation = useTranslation(),
    t = _useTranslation.t;
  var viewHandler = useViewHandler();
  var _useDivaCore = useDivaCore(),
    user = _useDivaCore.state.user;

  // State variables
  var _useState = useState(0),
    _useState2 = _slicedToArray(_useState, 2),
    totalLimit = _useState2[0],
    setTotalLimit = _useState2[1];
  var _useState3 = useState(0),
    _useState4 = _slicedToArray(_useState3, 2),
    usedCount = _useState4[0],
    setUsedCount = _useState4[1];
  var _useState5 = useState(0),
    _useState6 = _slicedToArray(_useState5, 2),
    progressPercent = _useState6[0],
    setProgressPercent = _useState6[1];
  var _useState7 = useState(''),
    _useState8 = _slicedToArray(_useState7, 2),
    bannerText = _useState8[0],
    setBannerText = _useState8[1];
  var _useState9 = useState(''),
    _useState10 = _slicedToArray(_useState9, 2),
    usageText = _useState10[0],
    setUsageText = _useState10[1];

  // Determine if user is anonymous (no user object)
  var isAnonymous = !user;

  // Get usage budget and limit status from AI state
  var usageBudget = viewHandler.aiState.usageBudget;
  var timeframeLimitReached = viewHandler.aiState.isTimeframeLimitReached;
  var isIpLimitOnly = viewHandler.aiState.isIpLimitOnly;
  var hasViolations = viewHandler.aiState.hasViolations;
  var organizationAISettings = viewHandler.settingsState.organizationAISettings;

  // Effect to calculate and update all state values
  useEffect(function () {
    // Calculate values
    var newTotalLimit = 0;
    var newUsedCount = 0;
    var newIsLimitReached = false;
    if (usageBudget) {
      newTotalLimit = usageBudget.total;
      newUsedCount = usageBudget.used;
      newIsLimitReached = !!viewHandler.aiState.isTimeframeLimitReached;
    } else if (isAnonymous) {
      // Fallback to organization settings if no usage limits loaded
      var anonymousLimit = (organizationAISettings === null || organizationAISettings === void 0 ? void 0 : organizationAISettings.anonymousDailyIPLimit) || 2;
      newTotalLimit = anonymousLimit;
      newUsedCount = 0;
    }

    // Update state values
    setTotalLimit(newTotalLimit);
    setUsedCount(newUsedCount);

    // Calculate progress percentage for the bar
    var newProgressPercent = newTotalLimit > 0 ? (newUsedCount + (viewHandler.aiState.isAnyGenerationInProgress ? 1 : 0)) / newTotalLimit * 100 : 0;
    setProgressPercent(newProgressPercent);

    // Determine banner text
    var newBannerText = '';
    var newUsageText = '';
    newUsageText = t('configurator.roomRendering.anonymousBanner.used');
    if (newIsLimitReached) {
      if (isIpLimitOnly) {
        // Only IP limit reached - can be bypassed with lead key
        // If lead key is active, don't show the lead key bonus
        if (organizationAISettings !== null && organizationAISettings !== void 0 && organizationAISettings.leadRewardBonus && !(usageBudget !== null && usageBudget !== void 0 && usageBudget.leadKeyActive)) {
          newBannerText = t('configurator.roomRendering.anonymousBanner.ipLimitReachedWithLeadKey', {
            leadRewardBonus: organizationAISettings.leadRewardBonus
          });
        } else {
          newBannerText = t('configurator.roomRendering.anonymousBanner.ipLimitReached');
        }
      } else if (timeframeLimitReached) {
        switch (timeframeLimitReached) {
          case 'daily':
            newBannerText = t('configurator.roomRendering.banner.dailyLimitReached');
            break;
          case 'weekly':
            newBannerText = t('configurator.roomRendering.banner.weeklyLimitReached');
            break;
          case 'monthly':
            newBannerText = t('configurator.roomRendering.banner.monthlyLimitReached');
            break;
        }
      }
    } else {
      newBannerText = t('configurator.roomRendering.infoText');
    }
    setBannerText(newBannerText);
    setUsageText(newUsageText);
  }, [usageBudget, isAnonymous, isIpLimitOnly, hasViolations, timeframeLimitReached, organizationAISettings, viewHandler.aiState.isAnyGenerationInProgress]);
  return /*#__PURE__*/jsxs("div", {
    className: wrapper,
    children: [/*#__PURE__*/jsx("div", {
      className: title,
      children: t('configurator.roomRendering.infoTitle')
    }), /*#__PURE__*/jsx("div", {
      className: text,
      children: bannerText
    }), (!timeframeLimitReached || timeframeLimitReached == 'daily') && /*#__PURE__*/jsxs(Fragment, {
      children: [/*#__PURE__*/jsxs("div", {
        className: progressText,
        children: [/*#__PURE__*/jsx("div", {
          children: usageText
        }), /*#__PURE__*/jsxs("div", {
          children: [usedCount, " / ", totalLimit]
        })]
      }), /*#__PURE__*/jsx("div", {
        className: progressBar,
        style: {
          marginTop: '8px'
        },
        children: /*#__PURE__*/jsx("div", {
          className: progressFill,
          style: {
            width: "".concat(progressPercent, "%"),
            backgroundColor: progressPercent > 99 ? 'var(--infoBannerProgressFillHigh, #d32f2f)' : progressPercent > 60 ? 'var(--infoBannerProgressFillMedium, #f57c00)' : 'var(--infoBannerProgressFillLow, #4caf50)'
          }
        })
      })]
    })]
  });
};
var InfoBanner$1 = observer(InfoBanner);

export { InfoBanner$1 as default };
