{counter}
\r\n * }\r\n */\n\nexport var useSelector = /*#__PURE__*/createSelectorHook();","export default function _setPrototypeOf(o, p) {\n _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {\n o.__proto__ = p;\n return o;\n };\n return _setPrototypeOf(o, p);\n}","import setPrototypeOf from \"./setPrototypeOf.js\";\nexport default function _inheritsLoose(subClass, superClass) {\n subClass.prototype = Object.create(superClass.prototype);\n subClass.prototype.constructor = subClass;\n setPrototypeOf(subClass, superClass);\n}","function isAbsolute(pathname) {\n return pathname.charAt(0) === '/';\n}\n\n// About 1.5x faster than the two-arg version of Array#splice()\nfunction spliceOne(list, index) {\n for (var i = index, k = i + 1, n = list.length; k < n; i += 1, k += 1) {\n list[i] = list[k];\n }\n\n list.pop();\n}\n\n// This implementation is based heavily on node's url.parse\nfunction resolvePathname(to, from) {\n if (from === undefined) from = '';\n\n var toParts = (to && to.split('/')) || [];\n var fromParts = (from && from.split('/')) || [];\n\n var isToAbs = to && isAbsolute(to);\n var isFromAbs = from && isAbsolute(from);\n var mustEndAbs = isToAbs || isFromAbs;\n\n if (to && isAbsolute(to)) {\n // to is absolute\n fromParts = toParts;\n } else if (toParts.length) {\n // to is relative, drop the filename\n fromParts.pop();\n fromParts = fromParts.concat(toParts);\n }\n\n if (!fromParts.length) return '/';\n\n var hasTrailingSlash;\n if (fromParts.length) {\n var last = fromParts[fromParts.length - 1];\n hasTrailingSlash = last === '.' || last === '..' || last === '';\n } else {\n hasTrailingSlash = false;\n }\n\n var up = 0;\n for (var i = fromParts.length; i >= 0; i--) {\n var part = fromParts[i];\n\n if (part === '.') {\n spliceOne(fromParts, i);\n } else if (part === '..') {\n spliceOne(fromParts, i);\n up++;\n } else if (up) {\n spliceOne(fromParts, i);\n up--;\n }\n }\n\n if (!mustEndAbs) for (; up--; up) fromParts.unshift('..');\n\n if (\n mustEndAbs &&\n fromParts[0] !== '' &&\n (!fromParts[0] || !isAbsolute(fromParts[0]))\n )\n fromParts.unshift('');\n\n var result = fromParts.join('/');\n\n if (hasTrailingSlash && result.substr(-1) !== '/') result += '/';\n\n return result;\n}\n\nexport default resolvePathname;\n","export * from './exports';\nimport { unstable_batchedUpdates as batch } from './utils/reactBatchedUpdates';\nimport { setBatch } from './utils/batch'; // Enable batched updates in our subscriptions for use\n// with standard React renderers (ReactDOM, React Native)\n\nsetBatch(batch);\nexport { batch };","var isProduction = process.env.NODE_ENV === 'production';\nvar prefix = 'Invariant failed';\nfunction invariant(condition, message) {\n if (condition) {\n return;\n }\n if (isProduction) {\n throw new Error(prefix);\n }\n var provided = typeof message === 'function' ? message() : message;\n var value = provided ? \"\".concat(prefix, \": \").concat(provided) : prefix;\n throw new Error(value);\n}\n\nexport { invariant as default };\n","import _extends from '@babel/runtime/helpers/esm/extends';\nimport resolvePathname from 'resolve-pathname';\nimport valueEqual from 'value-equal';\nimport warning from 'tiny-warning';\nimport invariant from 'tiny-invariant';\n\nfunction addLeadingSlash(path) {\n return path.charAt(0) === '/' ? path : '/' + path;\n}\nfunction stripLeadingSlash(path) {\n return path.charAt(0) === '/' ? path.substr(1) : path;\n}\nfunction hasBasename(path, prefix) {\n return path.toLowerCase().indexOf(prefix.toLowerCase()) === 0 && '/?#'.indexOf(path.charAt(prefix.length)) !== -1;\n}\nfunction stripBasename(path, prefix) {\n return hasBasename(path, prefix) ? path.substr(prefix.length) : path;\n}\nfunction stripTrailingSlash(path) {\n return path.charAt(path.length - 1) === '/' ? path.slice(0, -1) : path;\n}\nfunction parsePath(path) {\n var pathname = path || '/';\n var search = '';\n var hash = '';\n var hashIndex = pathname.indexOf('#');\n\n if (hashIndex !== -1) {\n hash = pathname.substr(hashIndex);\n pathname = pathname.substr(0, hashIndex);\n }\n\n var searchIndex = pathname.indexOf('?');\n\n if (searchIndex !== -1) {\n search = pathname.substr(searchIndex);\n pathname = pathname.substr(0, searchIndex);\n }\n\n return {\n pathname: pathname,\n search: search === '?' ? '' : search,\n hash: hash === '#' ? '' : hash\n };\n}\nfunction createPath(location) {\n var pathname = location.pathname,\n search = location.search,\n hash = location.hash;\n var path = pathname || '/';\n if (search && search !== '?') path += search.charAt(0) === '?' ? search : \"?\" + search;\n if (hash && hash !== '#') path += hash.charAt(0) === '#' ? hash : \"#\" + hash;\n return path;\n}\n\nfunction createLocation(path, state, key, currentLocation) {\n var location;\n\n if (typeof path === 'string') {\n // Two-arg form: push(path, state)\n location = parsePath(path);\n location.state = state;\n } else {\n // One-arg form: push(location)\n location = _extends({}, path);\n if (location.pathname === undefined) location.pathname = '';\n\n if (location.search) {\n if (location.search.charAt(0) !== '?') location.search = '?' + location.search;\n } else {\n location.search = '';\n }\n\n if (location.hash) {\n if (location.hash.charAt(0) !== '#') location.hash = '#' + location.hash;\n } else {\n location.hash = '';\n }\n\n if (state !== undefined && location.state === undefined) location.state = state;\n }\n\n try {\n location.pathname = decodeURI(location.pathname);\n } catch (e) {\n if (e instanceof URIError) {\n throw new URIError('Pathname \"' + location.pathname + '\" could not be decoded. ' + 'This is likely caused by an invalid percent-encoding.');\n } else {\n throw e;\n }\n }\n\n if (key) location.key = key;\n\n if (currentLocation) {\n // Resolve incomplete/relative pathname relative to current location.\n if (!location.pathname) {\n location.pathname = currentLocation.pathname;\n } else if (location.pathname.charAt(0) !== '/') {\n location.pathname = resolvePathname(location.pathname, currentLocation.pathname);\n }\n } else {\n // When there is no prior location and pathname is empty, set it to /\n if (!location.pathname) {\n location.pathname = '/';\n }\n }\n\n return location;\n}\nfunction locationsAreEqual(a, b) {\n return a.pathname === b.pathname && a.search === b.search && a.hash === b.hash && a.key === b.key && valueEqual(a.state, b.state);\n}\n\nfunction createTransitionManager() {\n var prompt = null;\n\n function setPrompt(nextPrompt) {\n process.env.NODE_ENV !== \"production\" ? warning(prompt == null, 'A history supports only one prompt at a time') : void 0;\n prompt = nextPrompt;\n return function () {\n if (prompt === nextPrompt) prompt = null;\n };\n }\n\n function confirmTransitionTo(location, action, getUserConfirmation, callback) {\n // TODO: If another transition starts while we're still confirming\n // the previous one, we may end up in a weird state. Figure out the\n // best way to handle this.\n if (prompt != null) {\n var result = typeof prompt === 'function' ? prompt(location, action) : prompt;\n\n if (typeof result === 'string') {\n if (typeof getUserConfirmation === 'function') {\n getUserConfirmation(result, callback);\n } else {\n process.env.NODE_ENV !== \"production\" ? warning(false, 'A history needs a getUserConfirmation function in order to use a prompt message') : void 0;\n callback(true);\n }\n } else {\n // Return false from a transition hook to cancel the transition.\n callback(result !== false);\n }\n } else {\n callback(true);\n }\n }\n\n var listeners = [];\n\n function appendListener(fn) {\n var isActive = true;\n\n function listener() {\n if (isActive) fn.apply(void 0, arguments);\n }\n\n listeners.push(listener);\n return function () {\n isActive = false;\n listeners = listeners.filter(function (item) {\n return item !== listener;\n });\n };\n }\n\n function notifyListeners() {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n listeners.forEach(function (listener) {\n return listener.apply(void 0, args);\n });\n }\n\n return {\n setPrompt: setPrompt,\n confirmTransitionTo: confirmTransitionTo,\n appendListener: appendListener,\n notifyListeners: notifyListeners\n };\n}\n\nvar canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);\nfunction getConfirmation(message, callback) {\n callback(window.confirm(message)); // eslint-disable-line no-alert\n}\n/**\n * Returns true if the HTML5 history API is supported. Taken from Modernizr.\n *\n * https://github.com/Modernizr/Modernizr/blob/master/LICENSE\n * https://github.com/Modernizr/Modernizr/blob/master/feature-detects/history.js\n * changed to avoid false negatives for Windows Phones: https://github.com/reactjs/react-router/issues/586\n */\n\nfunction supportsHistory() {\n var ua = window.navigator.userAgent;\n if ((ua.indexOf('Android 2.') !== -1 || ua.indexOf('Android 4.0') !== -1) && ua.indexOf('Mobile Safari') !== -1 && ua.indexOf('Chrome') === -1 && ua.indexOf('Windows Phone') === -1) return false;\n return window.history && 'pushState' in window.history;\n}\n/**\n * Returns true if browser fires popstate on hash change.\n * IE10 and IE11 do not.\n */\n\nfunction supportsPopStateOnHashChange() {\n return window.navigator.userAgent.indexOf('Trident') === -1;\n}\n/**\n * Returns false if using go(n) with hash history causes a full page reload.\n */\n\nfunction supportsGoWithoutReloadUsingHash() {\n return window.navigator.userAgent.indexOf('Firefox') === -1;\n}\n/**\n * Returns true if a given popstate event is an extraneous WebKit event.\n * Accounts for the fact that Chrome on iOS fires real popstate events\n * containing undefined state when pressing the back button.\n */\n\nfunction isExtraneousPopstateEvent(event) {\n return event.state === undefined && navigator.userAgent.indexOf('CriOS') === -1;\n}\n\nvar PopStateEvent = 'popstate';\nvar HashChangeEvent = 'hashchange';\n\nfunction getHistoryState() {\n try {\n return window.history.state || {};\n } catch (e) {\n // IE 11 sometimes throws when accessing window.history.state\n // See https://github.com/ReactTraining/history/pull/289\n return {};\n }\n}\n/**\n * Creates a history object that uses the HTML5 history API including\n * pushState, replaceState, and the popstate event.\n */\n\n\nfunction createBrowserHistory(props) {\n if (props === void 0) {\n props = {};\n }\n\n !canUseDOM ? process.env.NODE_ENV !== \"production\" ? invariant(false, 'Browser history needs a DOM') : invariant(false) : void 0;\n var globalHistory = window.history;\n var canUseHistory = supportsHistory();\n var needsHashChangeListener = !supportsPopStateOnHashChange();\n var _props = props,\n _props$forceRefresh = _props.forceRefresh,\n forceRefresh = _props$forceRefresh === void 0 ? false : _props$forceRefresh,\n _props$getUserConfirm = _props.getUserConfirmation,\n getUserConfirmation = _props$getUserConfirm === void 0 ? getConfirmation : _props$getUserConfirm,\n _props$keyLength = _props.keyLength,\n keyLength = _props$keyLength === void 0 ? 6 : _props$keyLength;\n var basename = props.basename ? stripTrailingSlash(addLeadingSlash(props.basename)) : '';\n\n function getDOMLocation(historyState) {\n var _ref = historyState || {},\n key = _ref.key,\n state = _ref.state;\n\n var _window$location = window.location,\n pathname = _window$location.pathname,\n search = _window$location.search,\n hash = _window$location.hash;\n var path = pathname + search + hash;\n process.env.NODE_ENV !== \"production\" ? warning(!basename || hasBasename(path, basename), 'You are attempting to use a basename on a page whose URL path does not begin ' + 'with the basename. Expected path \"' + path + '\" to begin with \"' + basename + '\".') : void 0;\n if (basename) path = stripBasename(path, basename);\n return createLocation(path, state, key);\n }\n\n function createKey() {\n return Math.random().toString(36).substr(2, keyLength);\n }\n\n var transitionManager = createTransitionManager();\n\n function setState(nextState) {\n _extends(history, nextState);\n\n history.length = globalHistory.length;\n transitionManager.notifyListeners(history.location, history.action);\n }\n\n function handlePopState(event) {\n // Ignore extraneous popstate events in WebKit.\n if (isExtraneousPopstateEvent(event)) return;\n handlePop(getDOMLocation(event.state));\n }\n\n function handleHashChange() {\n handlePop(getDOMLocation(getHistoryState()));\n }\n\n var forceNextPop = false;\n\n function handlePop(location) {\n if (forceNextPop) {\n forceNextPop = false;\n setState();\n } else {\n var action = 'POP';\n transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) {\n if (ok) {\n setState({\n action: action,\n location: location\n });\n } else {\n revertPop(location);\n }\n });\n }\n }\n\n function revertPop(fromLocation) {\n var toLocation = history.location; // TODO: We could probably make this more reliable by\n // keeping a list of keys we've seen in sessionStorage.\n // Instead, we just default to 0 for keys we don't know.\n\n var toIndex = allKeys.indexOf(toLocation.key);\n if (toIndex === -1) toIndex = 0;\n var fromIndex = allKeys.indexOf(fromLocation.key);\n if (fromIndex === -1) fromIndex = 0;\n var delta = toIndex - fromIndex;\n\n if (delta) {\n forceNextPop = true;\n go(delta);\n }\n }\n\n var initialLocation = getDOMLocation(getHistoryState());\n var allKeys = [initialLocation.key]; // Public interface\n\n function createHref(location) {\n return basename + createPath(location);\n }\n\n function push(path, state) {\n process.env.NODE_ENV !== \"production\" ? warning(!(typeof path === 'object' && path.state !== undefined && state !== undefined), 'You should avoid providing a 2nd state argument to push when the 1st ' + 'argument is a location-like object that already has state; it is ignored') : void 0;\n var action = 'PUSH';\n var location = createLocation(path, state, createKey(), history.location);\n transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) {\n if (!ok) return;\n var href = createHref(location);\n var key = location.key,\n state = location.state;\n\n if (canUseHistory) {\n globalHistory.pushState({\n key: key,\n state: state\n }, null, href);\n\n if (forceRefresh) {\n window.location.href = href;\n } else {\n var prevIndex = allKeys.indexOf(history.location.key);\n var nextKeys = allKeys.slice(0, prevIndex + 1);\n nextKeys.push(location.key);\n allKeys = nextKeys;\n setState({\n action: action,\n location: location\n });\n }\n } else {\n process.env.NODE_ENV !== \"production\" ? warning(state === undefined, 'Browser history cannot push state in browsers that do not support HTML5 history') : void 0;\n window.location.href = href;\n }\n });\n }\n\n function replace(path, state) {\n process.env.NODE_ENV !== \"production\" ? warning(!(typeof path === 'object' && path.state !== undefined && state !== undefined), 'You should avoid providing a 2nd state argument to replace when the 1st ' + 'argument is a location-like object that already has state; it is ignored') : void 0;\n var action = 'REPLACE';\n var location = createLocation(path, state, createKey(), history.location);\n transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) {\n if (!ok) return;\n var href = createHref(location);\n var key = location.key,\n state = location.state;\n\n if (canUseHistory) {\n globalHistory.replaceState({\n key: key,\n state: state\n }, null, href);\n\n if (forceRefresh) {\n window.location.replace(href);\n } else {\n var prevIndex = allKeys.indexOf(history.location.key);\n if (prevIndex !== -1) allKeys[prevIndex] = location.key;\n setState({\n action: action,\n location: location\n });\n }\n } else {\n process.env.NODE_ENV !== \"production\" ? warning(state === undefined, 'Browser history cannot replace state in browsers that do not support HTML5 history') : void 0;\n window.location.replace(href);\n }\n });\n }\n\n function go(n) {\n globalHistory.go(n);\n }\n\n function goBack() {\n go(-1);\n }\n\n function goForward() {\n go(1);\n }\n\n var listenerCount = 0;\n\n function checkDOMListeners(delta) {\n listenerCount += delta;\n\n if (listenerCount === 1 && delta === 1) {\n window.addEventListener(PopStateEvent, handlePopState);\n if (needsHashChangeListener) window.addEventListener(HashChangeEvent, handleHashChange);\n } else if (listenerCount === 0) {\n window.removeEventListener(PopStateEvent, handlePopState);\n if (needsHashChangeListener) window.removeEventListener(HashChangeEvent, handleHashChange);\n }\n }\n\n var isBlocked = false;\n\n function block(prompt) {\n if (prompt === void 0) {\n prompt = false;\n }\n\n var unblock = transitionManager.setPrompt(prompt);\n\n if (!isBlocked) {\n checkDOMListeners(1);\n isBlocked = true;\n }\n\n return function () {\n if (isBlocked) {\n isBlocked = false;\n checkDOMListeners(-1);\n }\n\n return unblock();\n };\n }\n\n function listen(listener) {\n var unlisten = transitionManager.appendListener(listener);\n checkDOMListeners(1);\n return function () {\n checkDOMListeners(-1);\n unlisten();\n };\n }\n\n var history = {\n length: globalHistory.length,\n action: 'POP',\n location: initialLocation,\n createHref: createHref,\n push: push,\n replace: replace,\n go: go,\n goBack: goBack,\n goForward: goForward,\n block: block,\n listen: listen\n };\n return history;\n}\n\nvar HashChangeEvent$1 = 'hashchange';\nvar HashPathCoders = {\n hashbang: {\n encodePath: function encodePath(path) {\n return path.charAt(0) === '!' ? path : '!/' + stripLeadingSlash(path);\n },\n decodePath: function decodePath(path) {\n return path.charAt(0) === '!' ? path.substr(1) : path;\n }\n },\n noslash: {\n encodePath: stripLeadingSlash,\n decodePath: addLeadingSlash\n },\n slash: {\n encodePath: addLeadingSlash,\n decodePath: addLeadingSlash\n }\n};\n\nfunction stripHash(url) {\n var hashIndex = url.indexOf('#');\n return hashIndex === -1 ? url : url.slice(0, hashIndex);\n}\n\nfunction getHashPath() {\n // We can't use window.location.hash here because it's not\n // consistent across browsers - Firefox will pre-decode it!\n var href = window.location.href;\n var hashIndex = href.indexOf('#');\n return hashIndex === -1 ? '' : href.substring(hashIndex + 1);\n}\n\nfunction pushHashPath(path) {\n window.location.hash = path;\n}\n\nfunction replaceHashPath(path) {\n window.location.replace(stripHash(window.location.href) + '#' + path);\n}\n\nfunction createHashHistory(props) {\n if (props === void 0) {\n props = {};\n }\n\n !canUseDOM ? process.env.NODE_ENV !== \"production\" ? invariant(false, 'Hash history needs a DOM') : invariant(false) : void 0;\n var globalHistory = window.history;\n var canGoWithoutReload = supportsGoWithoutReloadUsingHash();\n var _props = props,\n _props$getUserConfirm = _props.getUserConfirmation,\n getUserConfirmation = _props$getUserConfirm === void 0 ? getConfirmation : _props$getUserConfirm,\n _props$hashType = _props.hashType,\n hashType = _props$hashType === void 0 ? 'slash' : _props$hashType;\n var basename = props.basename ? stripTrailingSlash(addLeadingSlash(props.basename)) : '';\n var _HashPathCoders$hashT = HashPathCoders[hashType],\n encodePath = _HashPathCoders$hashT.encodePath,\n decodePath = _HashPathCoders$hashT.decodePath;\n\n function getDOMLocation() {\n var path = decodePath(getHashPath());\n process.env.NODE_ENV !== \"production\" ? warning(!basename || hasBasename(path, basename), 'You are attempting to use a basename on a page whose URL path does not begin ' + 'with the basename. Expected path \"' + path + '\" to begin with \"' + basename + '\".') : void 0;\n if (basename) path = stripBasename(path, basename);\n return createLocation(path);\n }\n\n var transitionManager = createTransitionManager();\n\n function setState(nextState) {\n _extends(history, nextState);\n\n history.length = globalHistory.length;\n transitionManager.notifyListeners(history.location, history.action);\n }\n\n var forceNextPop = false;\n var ignorePath = null;\n\n function locationsAreEqual$$1(a, b) {\n return a.pathname === b.pathname && a.search === b.search && a.hash === b.hash;\n }\n\n function handleHashChange() {\n var path = getHashPath();\n var encodedPath = encodePath(path);\n\n if (path !== encodedPath) {\n // Ensure we always have a properly-encoded hash.\n replaceHashPath(encodedPath);\n } else {\n var location = getDOMLocation();\n var prevLocation = history.location;\n if (!forceNextPop && locationsAreEqual$$1(prevLocation, location)) return; // A hashchange doesn't always == location change.\n\n if (ignorePath === createPath(location)) return; // Ignore this change; we already setState in push/replace.\n\n ignorePath = null;\n handlePop(location);\n }\n }\n\n function handlePop(location) {\n if (forceNextPop) {\n forceNextPop = false;\n setState();\n } else {\n var action = 'POP';\n transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) {\n if (ok) {\n setState({\n action: action,\n location: location\n });\n } else {\n revertPop(location);\n }\n });\n }\n }\n\n function revertPop(fromLocation) {\n var toLocation = history.location; // TODO: We could probably make this more reliable by\n // keeping a list of paths we've seen in sessionStorage.\n // Instead, we just default to 0 for paths we don't know.\n\n var toIndex = allPaths.lastIndexOf(createPath(toLocation));\n if (toIndex === -1) toIndex = 0;\n var fromIndex = allPaths.lastIndexOf(createPath(fromLocation));\n if (fromIndex === -1) fromIndex = 0;\n var delta = toIndex - fromIndex;\n\n if (delta) {\n forceNextPop = true;\n go(delta);\n }\n } // Ensure the hash is encoded properly before doing anything else.\n\n\n var path = getHashPath();\n var encodedPath = encodePath(path);\n if (path !== encodedPath) replaceHashPath(encodedPath);\n var initialLocation = getDOMLocation();\n var allPaths = [createPath(initialLocation)]; // Public interface\n\n function createHref(location) {\n var baseTag = document.querySelector('base');\n var href = '';\n\n if (baseTag && baseTag.getAttribute('href')) {\n href = stripHash(window.location.href);\n }\n\n return href + '#' + encodePath(basename + createPath(location));\n }\n\n function push(path, state) {\n process.env.NODE_ENV !== \"production\" ? warning(state === undefined, 'Hash history cannot push state; it is ignored') : void 0;\n var action = 'PUSH';\n var location = createLocation(path, undefined, undefined, history.location);\n transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) {\n if (!ok) return;\n var path = createPath(location);\n var encodedPath = encodePath(basename + path);\n var hashChanged = getHashPath() !== encodedPath;\n\n if (hashChanged) {\n // We cannot tell if a hashchange was caused by a PUSH, so we'd\n // rather setState here and ignore the hashchange. The caveat here\n // is that other hash histories in the page will consider it a POP.\n ignorePath = path;\n pushHashPath(encodedPath);\n var prevIndex = allPaths.lastIndexOf(createPath(history.location));\n var nextPaths = allPaths.slice(0, prevIndex + 1);\n nextPaths.push(path);\n allPaths = nextPaths;\n setState({\n action: action,\n location: location\n });\n } else {\n process.env.NODE_ENV !== \"production\" ? warning(false, 'Hash history cannot PUSH the same path; a new entry will not be added to the history stack') : void 0;\n setState();\n }\n });\n }\n\n function replace(path, state) {\n process.env.NODE_ENV !== \"production\" ? warning(state === undefined, 'Hash history cannot replace state; it is ignored') : void 0;\n var action = 'REPLACE';\n var location = createLocation(path, undefined, undefined, history.location);\n transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) {\n if (!ok) return;\n var path = createPath(location);\n var encodedPath = encodePath(basename + path);\n var hashChanged = getHashPath() !== encodedPath;\n\n if (hashChanged) {\n // We cannot tell if a hashchange was caused by a REPLACE, so we'd\n // rather setState here and ignore the hashchange. The caveat here\n // is that other hash histories in the page will consider it a POP.\n ignorePath = path;\n replaceHashPath(encodedPath);\n }\n\n var prevIndex = allPaths.indexOf(createPath(history.location));\n if (prevIndex !== -1) allPaths[prevIndex] = path;\n setState({\n action: action,\n location: location\n });\n });\n }\n\n function go(n) {\n process.env.NODE_ENV !== \"production\" ? warning(canGoWithoutReload, 'Hash history go(n) causes a full page reload in this browser') : void 0;\n globalHistory.go(n);\n }\n\n function goBack() {\n go(-1);\n }\n\n function goForward() {\n go(1);\n }\n\n var listenerCount = 0;\n\n function checkDOMListeners(delta) {\n listenerCount += delta;\n\n if (listenerCount === 1 && delta === 1) {\n window.addEventListener(HashChangeEvent$1, handleHashChange);\n } else if (listenerCount === 0) {\n window.removeEventListener(HashChangeEvent$1, handleHashChange);\n }\n }\n\n var isBlocked = false;\n\n function block(prompt) {\n if (prompt === void 0) {\n prompt = false;\n }\n\n var unblock = transitionManager.setPrompt(prompt);\n\n if (!isBlocked) {\n checkDOMListeners(1);\n isBlocked = true;\n }\n\n return function () {\n if (isBlocked) {\n isBlocked = false;\n checkDOMListeners(-1);\n }\n\n return unblock();\n };\n }\n\n function listen(listener) {\n var unlisten = transitionManager.appendListener(listener);\n checkDOMListeners(1);\n return function () {\n checkDOMListeners(-1);\n unlisten();\n };\n }\n\n var history = {\n length: globalHistory.length,\n action: 'POP',\n location: initialLocation,\n createHref: createHref,\n push: push,\n replace: replace,\n go: go,\n goBack: goBack,\n goForward: goForward,\n block: block,\n listen: listen\n };\n return history;\n}\n\nfunction clamp(n, lowerBound, upperBound) {\n return Math.min(Math.max(n, lowerBound), upperBound);\n}\n/**\n * Creates a history object that stores locations in memory.\n */\n\n\nfunction createMemoryHistory(props) {\n if (props === void 0) {\n props = {};\n }\n\n var _props = props,\n getUserConfirmation = _props.getUserConfirmation,\n _props$initialEntries = _props.initialEntries,\n initialEntries = _props$initialEntries === void 0 ? ['/'] : _props$initialEntries,\n _props$initialIndex = _props.initialIndex,\n initialIndex = _props$initialIndex === void 0 ? 0 : _props$initialIndex,\n _props$keyLength = _props.keyLength,\n keyLength = _props$keyLength === void 0 ? 6 : _props$keyLength;\n var transitionManager = createTransitionManager();\n\n function setState(nextState) {\n _extends(history, nextState);\n\n history.length = history.entries.length;\n transitionManager.notifyListeners(history.location, history.action);\n }\n\n function createKey() {\n return Math.random().toString(36).substr(2, keyLength);\n }\n\n var index = clamp(initialIndex, 0, initialEntries.length - 1);\n var entries = initialEntries.map(function (entry) {\n return typeof entry === 'string' ? createLocation(entry, undefined, createKey()) : createLocation(entry, undefined, entry.key || createKey());\n }); // Public interface\n\n var createHref = createPath;\n\n function push(path, state) {\n process.env.NODE_ENV !== \"production\" ? warning(!(typeof path === 'object' && path.state !== undefined && state !== undefined), 'You should avoid providing a 2nd state argument to push when the 1st ' + 'argument is a location-like object that already has state; it is ignored') : void 0;\n var action = 'PUSH';\n var location = createLocation(path, state, createKey(), history.location);\n transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) {\n if (!ok) return;\n var prevIndex = history.index;\n var nextIndex = prevIndex + 1;\n var nextEntries = history.entries.slice(0);\n\n if (nextEntries.length > nextIndex) {\n nextEntries.splice(nextIndex, nextEntries.length - nextIndex, location);\n } else {\n nextEntries.push(location);\n }\n\n setState({\n action: action,\n location: location,\n index: nextIndex,\n entries: nextEntries\n });\n });\n }\n\n function replace(path, state) {\n process.env.NODE_ENV !== \"production\" ? warning(!(typeof path === 'object' && path.state !== undefined && state !== undefined), 'You should avoid providing a 2nd state argument to replace when the 1st ' + 'argument is a location-like object that already has state; it is ignored') : void 0;\n var action = 'REPLACE';\n var location = createLocation(path, state, createKey(), history.location);\n transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) {\n if (!ok) return;\n history.entries[history.index] = location;\n setState({\n action: action,\n location: location\n });\n });\n }\n\n function go(n) {\n var nextIndex = clamp(history.index + n, 0, history.entries.length - 1);\n var action = 'POP';\n var location = history.entries[nextIndex];\n transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) {\n if (ok) {\n setState({\n action: action,\n location: location,\n index: nextIndex\n });\n } else {\n // Mimic the behavior of DOM histories by\n // causing a render after a cancelled POP.\n setState();\n }\n });\n }\n\n function goBack() {\n go(-1);\n }\n\n function goForward() {\n go(1);\n }\n\n function canGo(n) {\n var nextIndex = history.index + n;\n return nextIndex >= 0 && nextIndex < history.entries.length;\n }\n\n function block(prompt) {\n if (prompt === void 0) {\n prompt = false;\n }\n\n return transitionManager.setPrompt(prompt);\n }\n\n function listen(listener) {\n return transitionManager.appendListener(listener);\n }\n\n var history = {\n length: entries.length,\n action: 'POP',\n location: entries[index],\n index: index,\n entries: entries,\n createHref: createHref,\n push: push,\n replace: replace,\n go: go,\n goBack: goBack,\n goForward: goForward,\n canGo: canGo,\n block: block,\n listen: listen\n };\n return history;\n}\n\nexport { createBrowserHistory, createHashHistory, createMemoryHistory, createLocation, locationsAreEqual, parsePath, createPath };\n","// MIT License\n// Copyright (c) 2019-present StringEpsilon The first step in this process is to determine the eligible amounts that can be used towards an additional rent increase based on capital expenditures incurred.
\r\nA capital expenditure is eligible for an additional rent increase if it:
\r\n- \r\n
- \r\n is made to install, repair or replace a major system or component of the residential property that required repair or replacement under \r\n section 32 of the Residential Tenancy Act or the repair or replacement\r\n of a major system or component with a useful life of at least five years that has either failed or is close to the end of its useful life, or\r\n \r\n
- \r\n achieves one or more of the following:\r\n
- \r\n
- a measurable reduction in energy use or green house gas emissions \r\n
- improvement in the security of the residential property, and\r\n
\r\n - \r\n is not expected to recur for at least five years, and\r\n \r\n
- \r\n was incurred in the 18-month period preceding the month the landlord made the application.\r\n \r\n
Learn more about capital expenditures here.
\r\nTo begin, enter the total cost of each expenditure and the count of all units that were affected by it. Enter each capital expenditure that applies to individual units click “add another capital expenditure”.
`,\r\n improvements: {\r\n header: 'Capital Expenditure',\r\n title: 'Short title of capital expenditure',\r\n cost: 'Total cost of capital expenditure',\r\n units: 'Number of all Specified Dwelling units affected by the capital expenditure, including non-rental units',\r\n eligibleAmount: 'Calculated eligible amount',\r\n },\r\n addImprovement: 'Add another capital expenditure',\r\n },\r\n step2: {\r\n subText: 'Step 2: Estimated additional rent increases for each unit',\r\n description1: `\t\r\n In this step, you can determine how the additional rent increase granted based on your eligible capital expenditures can be applied with the annual allowable rent increase. If you need more information on the detailed calculations or rules, visit our `,\r\n website: 'website',\r\n maxAllowedUrl: 'https://www2.gov.bc.ca/gov/content/housing-tenancy/residential-tenancies/during-a-tenancy/rent-increases/additional-rent-increase',\r\n\r\n // @params: {{cost}}\r\n improvementCostSingle:\r\n 'Based on the capital expenditures provided, you may be eligible for an additional rent increase of {{cost}}. Enter the monthly rent for the unit you would like to apply an additional rent increase for and select the capital expenditures which affect that unit.',\r\n // @params: {{lowestCost}}, {{allCosts}}\r\n improvementCostMulti:\r\n 'Based on the capital expenditures provided, you may be eligible for an additional rent increase between {{lowestCost}} (lowest single amount) and {{allCosts}} (all amounts). Enter the monthly rent for the unit you would like to apply an additional rent increase for and select the capital expenditures which affect that unit.',\r\n additionalInfo: {\r\n text:\r\n 'Additional rent increase amounts are estimates based on the current maximum annual allowable rent increase amount, which are subject to change each year based on the Consumer Price Index. Learn more about how the ',\r\n urlText: 'maximum annual allowable rent increase is calculated',\r\n url: 'https://www2.gov.bc.ca/gov/content/housing-tenancy/residential-tenancies/during-a-tenancy/rent-increases',\r\n },\r\n unitRent: 'Enter current monthly rent of the selected unit',\r\n unitRentEntered: 'Current monthly rent of the selected unit',\r\n cpiValue: 'Maximum annual allowable rent increase amount',\r\n improvementSelect: 'Indicate the eligible capital expenditures for the selected unit',\r\n editImprovements: 'Edit capital expenditures',\r\n eligibleAmount: 'Total eligible amount',\r\n increaseBreakdown: {\r\n yearOne: 'First Year Rent Increase (for ',\r\n yearTwo: 'Second year additional rent increase (estimate only, as {{year}} maximum annual rent increase has not yet been set)',\r\n yearThree: 'Third year additional rent increase (estimate only, as {{year}} maximum annual rent increase has not yet been set)',\r\n increaseAmount: 'Maximum annual allowable rent increase for',\r\n increaseAmountFutureYears: 'Maximum annual allowable rent increase (using {{year}} rate of {{percentage}}% for estimating purposes only)',\r\n rentWithIncrease: 'Rent amount with annual allowable rent increase',\r\n additionalIncrease: 'Maximum additional rent increase allowed for unit (3.0%)',\r\n rentWithMaxIncrease: 'Potential maximum rent amount with all rent increases applied',\r\n remainingAmount1: 'Remaining eligible amount for additional rent increase in second year',\r\n remainingAmount2: 'Remaining eligible amount for third year',\r\n remainingAmount3: 'Remaining that cannot be applied',\r\n cpiRatesUrl: 'https://www2.gov.bc.ca/gov/content/housing-tenancy/residential-tenancies/during-a-tenancy/rent-increases'\r\n },\r\n print: {\r\n branch: 'Residential Tenancy Branch',\r\n // @params: {{date}}\r\n date: 'Calculated on {{date}}',\r\n },\r\n },\r\n errors: {\r\n title: {\r\n length: 'Title must be at least 2 characters',\r\n empty: 'Enter a title',\r\n },\r\n cost: {\r\n length: 'Must be greater than $1',\r\n empty: 'Enter a dollar amount',\r\n },\r\n units: {\r\n length: 'Must have at least one unit',\r\n empty: 'Enter a number of units',\r\n },\r\n submit: 'Press submit to calculate',\r\n rent: {\r\n length: 'Must be greater than $1',\r\n empty: 'Enter the rent amount',\r\n },\r\n improvement: {\r\n empty: 'Select Improvement',\r\n },\r\n increaseApplied: 'Select an answer',\r\n increaseDate: 'Select the first rent increase date',\r\n increaseAmount: 'Select the number of rent increases',\r\n eligibleAmount: {\r\n empty: 'Enter a valid eligible amount',\r\n },\r\n currentRent: {\r\n length: 'Must be greater than $1',\r\n empty: 'Enter a valid rent amount',\r\n },\r\n nextIncreaseDate: 'Select the rent increase date',\r\n increaseDateAlert: `The date that you entered is beyond 2 years which means that the landlord’s ability to apply an additional rent increase has expired. \r\n To learn more about the rules for additional rent increases, visit `,\r\n increaseDateAlertText: 'our website',\r\n increaseAmountAlert: `The landlord can only implement an additional rent increase to a specific rental unit over three years. \r\n To learn more about the rules for additional rent increases, visit `,\r\n increaseAmountAlertText: 'our website',\r\n },\r\n};\r\n\r\nexport default en;","import { ActionTypes } from '../../constants';\r\nimport { polyglot } from '../../assets/locales';\r\n\r\nlet defaultState = {\r\n list: [\r\n {\r\n id: new Date().getTime(),\r\n title: '',\r\n cost: '',\r\n units: '',\r\n calculatedAmount: '',\r\n submitDisabled: false,\r\n checked: false,\r\n errors: {\r\n title: polyglot.t('errors.title.empty'),\r\n cost: polyglot.t('errors.cost.empty'),\r\n units: polyglot.t('errors.units.empty'),\r\n submit: polyglot.t('errors.submit'),\r\n },\r\n },\r\n ],\r\n currentStep: 1,\r\n continueClicked: false,\r\n};\r\n\r\nexport default function (state = defaultState, action) {\r\n switch (action.type) {\r\n case ActionTypes.SET_IMPROVEMENT:\r\n return { ...state, list: action.payload.improvements };\r\n case ActionTypes.RESET_IMPROVEMENTS:\r\n return { list: defaultState.list, currentStep: defaultState.currentStep };\r\n case ActionTypes.UPDATE_STEP:\r\n return { ...state, currentStep: action.payload.currentStep };\r\n case ActionTypes.CONTINUE_CLICKED:\r\n return { ...state, continueClicked: action.payload.continueClicked };\r\n default:\r\n return state;\r\n }\r\n}","import { ActionTypes } from '../../constants';\r\n\r\nlet defaultState = {\r\n cpiConfig: ''\r\n}\r\n\r\nfunction ConfigReducer (state = defaultState, action) {\r\n switch (action.type) {\r\n case ActionTypes.ADD_CPI_CONFIG:\r\n\r\n return { ...state, cpiConfig: action.payload.cpiConfig };\r\n default:\r\n return state;\r\n }\r\n}\r\n\r\nexport default ConfigReducer;","import { ActionTypes } from '../../constants';\r\nimport { polyglot } from '../../assets/locales';\r\n\r\nlet defaultState = {\r\n data: null,\r\n currentStep: 1,\r\n continueClicked: false,\r\n};\r\n\r\nfunction ValidationReducer (state = defaultState, action) {\r\n switch (action.type) {\r\n case ActionTypes.SET_VALIDATION_DATA:\r\n return { ...state, data: action.payload.validationData };\r\n default:\r\n return state;\r\n }\r\n}\r\n\r\nexport default ValidationReducer;","import { combineReducers } from 'redux';\r\nimport { connectRouter } from 'connected-react-router';\r\nimport ImprovementReducer from './ImprovementReducer';\r\nimport ConfigReducer from './ConfigReducer';\r\nimport ValidationReducer from './ValidationReducer';\r\n\r\nconst rootReducer = (history) =>\r\n combineReducers({\r\n improvements: ImprovementReducer,\r\n validations: ValidationReducer,\r\n config: ConfigReducer,\r\n router: connectRouter(history),\r\n });\r\n\r\nexport default rootReducer;\r\n","import { createHashHistory } from 'history';\r\nimport thunk from 'redux-thunk';\r\nimport { applyMiddleware, createStore } from 'redux';\r\nimport { composeWithDevTools } from 'redux-devtools-extension';\r\nimport { routerMiddleware } from 'connected-react-router';\r\nimport rootReducer from './reducers';\r\n\r\nexport const history = createHashHistory({ hashType: 'noslash' });\r\nexport default function configureStore(preloadedState) {\r\n const store = createStore(\r\n rootReducer(history), // root reducer with router state\r\n preloadedState,\r\n composeWithDevTools(\r\n applyMiddleware(\r\n routerMiddleware(history), // for dispatching history actions\r\n thunk\r\n // ... other middlewares ...\r\n )\r\n )\r\n );\r\n\r\n return store;\r\n}\r\n","export default function _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n}","import toPropertyKey from \"./toPropertyKey.js\";\nfunction _defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, toPropertyKey(descriptor.key), descriptor);\n }\n}\nexport default function _createClass(Constructor, protoProps, staticProps) {\n if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n if (staticProps) _defineProperties(Constructor, staticProps);\n Object.defineProperty(Constructor, \"prototype\", {\n writable: false\n });\n return Constructor;\n}","import setPrototypeOf from \"./setPrototypeOf.js\";\nexport default function _inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function\");\n }\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n writable: true,\n configurable: true\n }\n });\n Object.defineProperty(subClass, \"prototype\", {\n writable: false\n });\n if (superClass) setPrototypeOf(subClass, superClass);\n}","export default function _getPrototypeOf(o) {\n _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {\n return o.__proto__ || Object.getPrototypeOf(o);\n };\n return _getPrototypeOf(o);\n}","import _typeof from \"./typeof.js\";\nimport assertThisInitialized from \"./assertThisInitialized.js\";\nexport default function _possibleConstructorReturn(self, call) {\n if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) {\n return call;\n } else if (call !== void 0) {\n throw new TypeError(\"Derived constructors may only return object or undefined\");\n }\n return assertThisInitialized(self);\n}","export default function _assertThisInitialized(self) {\n if (self === void 0) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n return self;\n}","import getPrototypeOf from \"./getPrototypeOf.js\";\nimport isNativeReflectConstruct from \"./isNativeReflectConstruct.js\";\nimport possibleConstructorReturn from \"./possibleConstructorReturn.js\";\nexport default function _createSuper(Derived) {\n var hasNativeReflectConstruct = isNativeReflectConstruct();\n return function _createSuperInternal() {\n var Super = getPrototypeOf(Derived),\n result;\n if (hasNativeReflectConstruct) {\n var NewTarget = getPrototypeOf(this).constructor;\n result = Reflect.construct(Super, arguments, NewTarget);\n } else {\n result = Super.apply(this, arguments);\n }\n return possibleConstructorReturn(this, result);\n };\n}","export default function _isNativeReflectConstruct() {\n if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n if (Reflect.construct.sham) return false;\n if (typeof Proxy === \"function\") return true;\n try {\n Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n return true;\n } catch (e) {\n return false;\n }\n}","import React from 'react';\r\n\r\nconst Error500 = () => {\r\n return (\r\n\r\n \r\n \r\n
\r\n
\r\n );\r\n};\r\n\r\nexport default Error500;\r\n","import ErrorBoundary from './ErrorBoundary';\r\n\r\nexport default ErrorBoundary;","import React, { Component } from 'react';\r\nimport { Error500 } from './ErrorPages';\r\nclass ErrorBoundary extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = { hasError: false };\r\n }\r\n\r\n static getDerivedStateFromError(error) {\r\n // Update state so the next render will show the fallback UI.\r\n return { hasError: true };\r\n }\r\n\r\n render() {\r\n if (this.state.hasError) {\r\n // You can render any custom fallback UI\r\n return | \r\n | \r\n \r\n 500\r\n | \r\n
| \r\n Server Error \r\n | \r\n |
| \r\n Our server has encountered an unexpected error and cannot complete your request. \r\nIf you came here from somewhere else, try pressing back. If you typed the address make sure it is typed correctly. \r\n | \r\n
\r\n \r\n {endAdornment} \r\n \r\n
\r\n );\r\n }\r\n };\r\n\r\n renderComponentType = () => {\r\n const { name, type, value, disabled, maxLength, selectList, onClick, prependLabel, handleSelectChange } = this.props;\r\n\r\n switch (type) {\r\n case 'text':\r\n case 'number':\r\n return \r\n
\r\n );\r\n }\r\n}\r\n\r\nInputBase.propTypes = {\r\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\r\n name: PropTypes.string.isRequired,\r\n type: PropTypes.string.isRequired,\r\n handleChange: PropTypes.func,\r\n handleSelectChange: PropTypes.func,\r\n preprendLabel: PropTypes.string,\r\n cssClass: PropTypes.string,\r\n topLabel: PropTypes.string,\r\n label: PropTypes.string,\r\n errors: PropTypes.string,\r\n startAdornment: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\r\n endAdornment: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\r\n maxLength: PropTypes.number,\r\n selectList: PropTypes.array, //only used for type=\"select\"\r\n};\r\n\r\nexport default InputBase;\r\n","var _path, _path2;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgWarning(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"3em\",\n height: \"3em\",\n viewBox: \"0 0 16 16\",\n className: \"bi bi-exclamation-circle bi-justify-left\",\n fill: \"currentColor\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n d: \"M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 4.995z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgWarning);\nexport default __webpack_public_path__ + \"static/media/warning.70253f2c86626758055a5954f672af9d.svg\";\nexport { ForwardRef as ReactComponent };","var _path;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgCheckMark(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"2em\",\n height: \"2em\",\n viewBox: \"0 0 16 16\",\n className: \"bi bi-check bi-justify-left\",\n fill: \"currentColor\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n d: \"M10.97 4.97a.75.75 0 0 1 1.071 1.05l-3.992 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425a.236.236 0 0 1 .02-.022z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgCheckMark);\nexport default __webpack_public_path__ + \"static/media/check_mark.c407110eccd7b3c9671b599dcb94c89a.svg\";\nexport { ForwardRef as ReactComponent };","var _path, _path2;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgError(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"2em\",\n height: \"2em\",\n viewBox: \"0 0 16 16\",\n className: \"bi bi-x\",\n fill: \"currentColor\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n d: \"M11.854 4.146a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708-.708l7-7a.5.5 0 0 1 .708 0z\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n fillRule: \"evenodd\",\n d: \"M4.146 4.146a.5.5 0 0 0 0 .708l7 7a.5.5 0 0 0 .708-.708l-7-7a.5.5 0 0 0-.708 0z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgError);\nexport default __webpack_public_path__ + \"static/media/error.415ed49c95355ac0e4fb33227d3dc9d9.svg\";\nexport { ForwardRef as ReactComponent };","import React, { forwardRef } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport InputBase from './InputBase';\r\nimport { Calendar } from '../../../assets/images/svg';\r\nimport DatePicker from 'react-datepicker';\r\nimport 'react-datepicker/dist/react-datepicker.css';\r\n\r\nconst onChange = (value, props) => {\r\n if (props) return props.handleChange(value, props);\r\n};\r\n/*\r\nconst Input = ({ innerRef }) => {\r\n return (\r\n \r\n
\r\n \r\n \r\n {renderTopLabel()}\r\n { this.renderStartAdornment() }\r\n { this.renderComponentType() }\r\n { this.renderEndAdornment() }\r\n
\r\n { renderLabel() }\r\n { this.renderPrintLabel() }\r\n \r\n \r\n
\r\n )\r\n}\r\n*/\r\nconst customDateInput = (disabled, errors, label, cssClass) => {\r\n const CustomDateInput = forwardRef(({ value, onClick }, ref) => (\r\n \r\n
\r\n )\r\n }\r\n\r\nexport default RentalAddress;","const appConfig = {\r\n baseRoute: process.env.NODE_ENV === 'production' ? '/' : '/',//'npm run build': NODE_ENV = 'production' , npm run start: NODE_ENV = 'development'\r\n testMode: false\r\n};\r\n\r\nexport default appConfig;\r\n","import React from 'react';\r\nimport { InputBase, CustomDateInput } from '../../../Helper/InputBase';\r\nimport { formatter } from '../../../../utility';\r\nimport { NormalizationConstants } from '../../../../constants';\r\nimport appConstants from '../../../../config/app_config';\r\nimport moment from 'moment';\r\n\r\nconst DecisionQuestions = (props) => {\r\n const { userAccessDate, decisionDate, minDecisionDate, decisionEligibleAmount, decisionRentAmount, errors, handleChange, handleDateChange, handleDecisionDateChange, disabled } = props;\r\n\r\n return (\r\n \r\n
\r\n British Columbia, Canada
\r\n\r\n
\r\n )\r\n}\r\n\r\nexport default DecisionQuestions;","import React from 'react';\r\nimport { InputBase, CustomDateInput } from '../../../Helper/InputBase';\r\nimport { formatter } from '../../../../utility';\r\nimport moment from 'moment';\r\n\r\nconst DROPDOWN_NO_VALUE = '0';\r\nconst DROPDOWN_YES_VALUE = '1';\r\n\r\nconst PriorRentIncreaseQuestions = (props) => {\r\n const { decisionDate, isPreviousYearRentIncrease, previousYearRentIncreaseDate, errors, handleIsPreviousYearRentIncrease, handleDateChange, disabled } = props;\r\n\r\n const eightMonthsBeforeDecisionDate = moment(decisionDate).startOf('month').subtract(8, 'months').toDate();\r\n const previousRentIncreaseLabel = `Did you issue a notice for an annual allowable rent increase that became effective in the 8 months prior to the decision\r\n ${eightMonthsBeforeDecisionDate && decisionDate ? ` (between ${formatter.toDateDisplay(eightMonthsBeforeDecisionDate)} and ${formatter.toDateDisplay(decisionDate)})` : ''}?`; \r\n\r\n const renderRentIncreaseDate = () => {\r\n if (isPreviousYearRentIncrease !== DROPDOWN_YES_VALUE) return;\r\n return (\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n return (\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default PriorRentIncreaseQuestions;","import React from 'react';\r\nimport { InputBase, CustomDateInput } from '../../../Helper/InputBase';\r\nimport { formatter } from '../../../../utility';\r\nimport { NormalizationConstants } from '../../../../constants';\r\nimport moment from 'moment';\r\n\r\nconst DROPDOWN_NO_VALUE = '0';\r\nconst DROPDOWN_YES_VALUE = '1';\r\n\r\nconst FutureRentIncreaseQuestions = (props) => {\r\n const { decisionDate, isExistingRentIncrease, existingNoticeServiceDate, existingRentEffectiveDate, previousYearRentIncreaseDate, existingRentAmount, errors, handleChange, handleDateChange, handleIsExistingRentIncrease, handleExistingNoticeServiceDateChange, disabled } = props;\r\n\r\n const renderYesQuestions = () => {\r\n if (isExistingRentIncrease !== DROPDOWN_YES_VALUE) return;\r\n return (\r\n <>\r\n \r\n
\r\n\r\n {renderRentIncreaseDate()}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n )\r\n }\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default FutureRentIncreaseQuestions;","const GeneralUtils = {\r\n\r\nlog(msg, color) {\r\n color = color || \"black\";\r\n let bgc = \"White\";\r\n switch (color) {\r\n case \"success\": color = \"Green\"; bgc = \"LimeGreen\"; break;\r\n case \"info\": color = \"DodgerBlue\"; bgc = \"Turquoise\"; break;\r\n case \"error\": color = \"Red\"; bgc = \"Black\"; break;\r\n case \"start\": color = \"OliveDrab\"; bgc = \"PaleGreen\"; break;\r\n case \"warning\": color = \"Tomato\"; bgc = \"Black\"; break;\r\n case \"end\": color = \"White\"; bgc = \"MediumVioletRed\"; break;\r\n default: break;\r\n }\r\n\r\n if (typeof msg == \"object\") {\r\n console.log(msg);\r\n } else if (typeof color == \"object\") {\r\n console.log(\"%c\" + msg, \"color: PowderBlue;font-weight:bold; background-color: RoyalBlue;\");\r\n console.log(color);\r\n } else {\r\n console.log(\"%c\" + msg, \"color:\" + color + \";font-weight:bold; background-color: \" + bgc + \";\");\r\n }\r\n}\r\n\r\n}\r\n\r\nexport default GeneralUtils;","import React, { Component } from 'react';\r\nimport { restartIcon } from '../../../assets/images';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { validate, formatter } from '../../../utility';\r\nimport moment from 'moment';\r\nimport { RentalAddress } from './RentalAddress';\r\nimport { DecisionQuestions } from './DecisionQuestions';\r\nimport { PreviousRentIncreaseQuestions } from './PreviousRentIncreaseQuestions';\r\nimport { FutureRentIncreaseQuestions } from './FutureRentIncreaseQuestions';\r\nimport GeneralUtils from '../../../utility/GeneralUtils';\r\n\r\nconst DROPDOWN_YES_VALUE = '1';\r\nconst DROPDOWN_NO_VALUE = '0';\r\nclass StepOne extends Component {\r\n state = {\r\n //input state\r\n streetAddress: '',\r\n city: '',\r\n postalCode: '',\r\n\r\n userAccessDate: moment().toDate(),\r\n decisionDate:'',\r\n decisionEligibleAmount: '',\r\n decisionRentAmount: '',\r\n\r\n isPreviousYearRentIncrease: '',\r\n previousYearRentIncreaseDate: '',\r\n\r\n isExistingRentIncrease: '',\r\n existingNoticeServiceDate: '',\r\n existingRentEffectiveDate: '',\r\n existingRentAmount: '',\r\n\r\n //input errors\r\n errors: {\r\n streetAddress: null,\r\n city: null,\r\n postalCode: null,\r\n userAccessDate: null,\r\n decisionDate: null,\r\n decisionEligibleAmount: null,\r\n decisionRentAmount: null,\r\n isPreviousYearRentIncrease: null,\r\n previousYearRentIncreaseDate: null,\r\n isExistingRentIncrease: null,\r\n existingNoticeServiceDate: null,\r\n existingRentEffectiveDate: null,\r\n existingRentAmount: null\r\n },\r\n }\r\n\r\n componentDidMount() {\r\n const { stepOneData } = this.props;\r\n if (Object.keys(stepOneData).length === 0) return;\r\n\r\n this.setState({\r\n streetAddress: stepOneData.streetAddress || '',\r\n city: stepOneData.city || '', \r\n postalCode: stepOneData.postalCode || '', \r\n userAccessDate: stepOneData.userAccessDate || moment().toDate(), \r\n decisionDate: stepOneData.decisionDate || '', \r\n decisionEligibleAmount: stepOneData.decisionEligibleAmount || '', \r\n decisionRentAmount: stepOneData.decisionRentAmount || '', \r\n isPreviousYearRentIncrease: stepOneData.isPreviousYearRentIncrease || '', \r\n previousYearRentIncreaseDate: stepOneData.previousYearRentIncreaseDate || '', \r\n isExistingRentIncrease: stepOneData.isExistingRentIncrease || '',\r\n existingNoticeServiceDate: stepOneData.existingNoticeServiceDate || '',\r\n existingRentEffectiveDate: stepOneData.existingRentEffectiveDate || '',\r\n existingRentAmount: stepOneData.existingRentAmount || ''\r\n });\r\n }\r\n\r\n handleChange = (event) => {\r\n const { name, value } = event.target;\r\n this.setState({\r\n [name]: value,\r\n errors: { ...this.state.errors, [name]: '' },\r\n });\r\n };\r\n\r\n handleDateChange = (value, event) => {\r\n const { name } = event;\r\n this.setState({\r\n [name]: value,\r\n errors: { ...this.state.errors, [name]: '' },\r\n });\r\n }\r\n\r\n handleDecisionDateChange = (value, event) => {\r\n const decisionDate = value;\r\n const { previousYearRentIncreaseDate, eightMonthsBeforeDecisionDate, existingNoticeServiceDate } = this.state;\r\n if (!moment(previousYearRentIncreaseDate).isBetween(moment(eightMonthsBeforeDecisionDate), moment(decisionDate))) {\r\n this.setState({ previousYearRentIncreaseDate: '' });\r\n }\r\n\r\n if (moment(existingNoticeServiceDate).isBefore(moment(decisionDate).subtract(6, 'months'))) {\r\n this.setState({ existingNoticeServiceDate: '', existingRentEffectiveDate: '' });\r\n }\r\n \r\n this.setState({\r\n decisionDate,\r\n errors: { ...this.state.errors, decisionDate: '' },\r\n });\r\n }\r\n\r\n handleExistingNoticeServiceDateChange = (value, event) => {\r\n const existingNoticeServiceDate = value;\r\n const { existingRentEffectiveDate } = this.state;\r\n if (moment(existingRentEffectiveDate).isBefore(moment(existingNoticeServiceDate))) {\r\n this.setState({ existingRentEffectiveDate: '' });\r\n }\r\n\r\n this.setState({\r\n existingNoticeServiceDate,\r\n errors: { ...this.state.errors, existingNoticeServiceDate: '' },\r\n });\r\n }\r\n\r\n handleIsExistingRentIncrease = (event) => {\r\n const { name, value } = event.target;\r\n let additionalStateChanges = {};\r\n if (value === DROPDOWN_NO_VALUE) {\r\n additionalStateChanges = {\r\n existingNoticeServiceDate: '',\r\n existingRentEffectiveDate: '',\r\n existingRentAmount: ''\r\n }\r\n }\r\n\r\n this.setState({\r\n isExistingRentIncrease: value,\r\n errors: { ...this.state.errors, [name]: '' },\r\n ...additionalStateChanges\r\n });\r\n }\r\n\r\n handleIsPreviousYearRentIncrease = (event) => {\r\n const { value, name } = event.target;\r\n let additionalStateChanges = {};\r\n if (value === DROPDOWN_NO_VALUE) {\r\n additionalStateChanges = {\r\n previousYearRentIncreaseDate: ''\r\n }\r\n }\r\n\r\n this.setState({\r\n isPreviousYearRentIncrease: value,\r\n errors: { ...this.state.errors, [name]: '' },\r\n ...additionalStateChanges\r\n });\r\n }\r\n\r\n submitStepOne() {\r\n const { \r\n streetAddress, \r\n city, \r\n postalCode, \r\n userAccessDate, \r\n decisionDate, \r\n decisionEligibleAmount, \r\n decisionRentAmount, \r\n isPreviousYearRentIncrease, \r\n previousYearRentIncreaseDate, \r\n isExistingRentIncrease,\r\n existingNoticeServiceDate,\r\n existingRentEffectiveDate,\r\n existingRentAmount\r\n } = this.state;\r\n\r\n const { setStepOneStatus } = this.props;\r\n\r\n const eightMonthsBeforeDecisionDate = moment(decisionDate).startOf('month').subtract(8, 'months').toDate();\r\n\r\n const addressValidations = [\r\n {\r\n streetAddress,\r\n validationRules: [{ minLength: 6 },{ isRequired: true, errorMsg: 'Address is required' }],\r\n },\r\n {\r\n city,\r\n validationRules: [{ minLength: 3 }, { isRequired: true, errorMsg: 'City is required' }],\r\n },\r\n {\r\n postalCode,\r\n validationRules: [{ postalCode: true }, { isRequired: true, errorMsg: 'Postal Code is required' }],\r\n },\r\n ];\r\n\r\n const decisionQuestionsValidations = [\r\n {\r\n userAccessDate,\r\n validationRules: [{ isRequired: true, errorMsg: 'Date is required' }]\r\n },\r\n {\r\n decisionDate,\r\n validationRules: [{ isRequired: true, errorMsg: 'Date is required' }]\r\n },\r\n {\r\n decisionEligibleAmount,\r\n validationRules: [{ minValue: 0 }, { isRequired: true, errorMsg: 'Amount is required' }]\r\n },\r\n {\r\n decisionRentAmount,\r\n validationRules: [{ minValue: 0 }, { isRequired: true, errorMsg: 'Amount is required' }]\r\n }\r\n ];\r\n\r\n const previousRentIncreaseQuestionsValidations = [\r\n {\r\n isPreviousYearRentIncrease,\r\n validationRules: [{ isRequired: true, errorMsg: 'Answer is required' }]\r\n },\r\n {\r\n previousYearRentIncreaseDate,\r\n validationRules: [\r\n isPreviousYearRentIncrease === DROPDOWN_YES_VALUE && eightMonthsBeforeDecisionDate ? { minDate: eightMonthsBeforeDecisionDate } : {},\r\n isPreviousYearRentIncrease === DROPDOWN_YES_VALUE && decisionDate ? { maxDate: decisionDate } : {},\r\n { isRequired: isPreviousYearRentIncrease === DROPDOWN_YES_VALUE, errorMsg: 'Date is required' },\r\n ]\r\n }\r\n ];\r\n\r\n const existingRentIncreaseQuestionsValidation = [\r\n {\r\n isExistingRentIncrease,\r\n validationRules: [{ isRequired: true, errorMsg: 'Answer is required' }]\r\n },\r\n {\r\n existingNoticeServiceDate,\r\n validationRules: [\r\n isExistingRentIncrease === DROPDOWN_YES_VALUE && decisionDate ? { minDate: moment(decisionDate).subtract(6, 'months').toDate() } : {},\r\n { isRequired: isExistingRentIncrease === DROPDOWN_YES_VALUE, errorMsg: 'Date is required' },\r\n ]\r\n },\r\n {\r\n existingRentEffectiveDate,\r\n validationRules: [\r\n isExistingRentIncrease === DROPDOWN_YES_VALUE && existingNoticeServiceDate ? { minDate: existingNoticeServiceDate } : {},\r\n { isRequired: isExistingRentIncrease === DROPDOWN_YES_VALUE, errorMsg: 'Date is required' },\r\n ]\r\n },\r\n {\r\n existingRentAmount,\r\n validationRules: [{ minValue: 0 }, { isRequired: isExistingRentIncrease === DROPDOWN_YES_VALUE, errorMsg: 'Rent amount is required' }]\r\n }\r\n ]\r\n\r\n const validationArray = [...addressValidations, ...decisionQuestionsValidations, ...previousRentIncreaseQuestionsValidations, ...existingRentIncreaseQuestionsValidation];\r\n\r\n let err = validate(validationArray);\r\n console.log('err: ', err);\r\n if (Object.keys(err).length >= 1) {\r\n this.setState({ errors: err });\r\n } else {\r\n this.setStepOneVars();\r\n setStepOneStatus(true);\r\n }\r\n }\r\n\r\n calculateRentVars = (earliestDecisionServiceDate) => {\r\n const { existingRentEffectiveDate, decisionDate, existingNoticeServiceDate, existingRentAmount, previousYearRentIncreaseDate, decisionRentAmount } = this.state;\r\n let dateUsedForMinMaxCalc = '', minRentIncreaseDate = '', rentAmountUsedForCalc = '', oneYearAfterLastRentIncreaseDate ='';\r\n\r\n if (existingRentEffectiveDate && (moment(existingRentEffectiveDate).isAfter(moment(decisionDate)) && moment(existingNoticeServiceDate).isBefore(moment(decisionDate))) ) {\r\n dateUsedForMinMaxCalc = 'In-Flight Rent Increase';\r\n minRentIncreaseDate = moment(existingRentEffectiveDate).add(1, 'year').toDate();\r\n rentAmountUsedForCalc = existingRentAmount;\r\n oneYearAfterLastRentIncreaseDate = moment(existingRentEffectiveDate).add(1, 'year').toDate();\r\n } else if (existingRentEffectiveDate && moment(existingRentEffectiveDate).isAfter(moment(decisionDate)) && moment(existingNoticeServiceDate).isAfter(decisionDate)) {\r\n dateUsedForMinMaxCalc = 'Post-Decision Rent Increase';\r\n minRentIncreaseDate = existingRentEffectiveDate;\r\n rentAmountUsedForCalc = existingRentAmount;\r\n } else if (!existingRentEffectiveDate && !previousYearRentIncreaseDate) {\r\n dateUsedForMinMaxCalc = 'Decision';\r\n minRentIncreaseDate= earliestDecisionServiceDate;\r\n rentAmountUsedForCalc = decisionRentAmount;\r\n } else if (previousYearRentIncreaseDate && moment(previousYearRentIncreaseDate).add(1, 'year').isSameOrAfter(moment(earliestDecisionServiceDate))) { \r\n dateUsedForMinMaxCalc = 'Previous Rent Increase';\r\n minRentIncreaseDate = moment(previousYearRentIncreaseDate).add(1, 'year');\r\n rentAmountUsedForCalc = decisionRentAmount;\r\n oneYearAfterLastRentIncreaseDate = moment(existingRentEffectiveDate ? existingRentEffectiveDate : previousYearRentIncreaseDate).add(1, 'year').toDate();\r\n }\r\n\r\n return { dateUsedForMinMaxCalc, minRentIncreaseDate, rentAmountUsedForCalc, oneYearAfterLastRentIncreaseDate };\r\n }\r\n\r\n getCalcRentIncreaseServiceTimeIsAvailable = (earliestServiceDate, maxRentIncreaseDate) => {\r\n if (!earliestServiceDate || !maxRentIncreaseDate || !maxRentIncreaseDate) return false;\r\n return moment(earliestServiceDate).isBefore(maxRentIncreaseDate) || moment().isBefore(moment(maxRentIncreaseDate));\r\n }\r\n\r\n setStepOneVars = () => {\r\n const { \r\n userAccessDate, \r\n decisionDate, \r\n decisionEligibleAmount, \r\n decisionRentAmount, \r\n existingNoticeServiceDate, \r\n existingRentEffectiveDate, \r\n streetAddress, \r\n city, \r\n postalCode, \r\n isPreviousYearRentIncrease ,\r\n previousYearRentIncreaseDate,\r\n isExistingRentIncrease,\r\n existingRentAmount\r\n } = this.state;\r\n const { setStepOneVars, setStepTwoStatus, setStepThreeStatus } = this.props;\r\n\r\n const address = `${streetAddress}, ${city}, BC, Canada, ${postalCode}`;\r\n const eightMonthsBeforeDecisionDate = moment(decisionDate).startOf('month').subtract(8, 'months').toDate();\r\n const earliestServiceDate = moment(userAccessDate).startOf('month').add(4, 'months').toDate();\r\n const earliestDecisionServiceDate = moment(decisionDate).startOf('month').add(4, 'months').toDate();\r\n const calculatedRentVars = this.calculateRentVars(earliestDecisionServiceDate);\r\n const dateUsedForMinMaxCalc = calculatedRentVars.dateUsedForMinMaxCalc; \r\n const minRentIncreaseDate = calculatedRentVars.minRentIncreaseDate ? moment(calculatedRentVars.minRentIncreaseDate).toDate() : '-';\r\n const rentAmountUsedForCalc = calculatedRentVars.rentAmountUsedForCalc;\r\n const maxRentIncreaseDate = calculatedRentVars.minRentIncreaseDate ? moment(minRentIncreaseDate).add(1, 'year').subtract(1, 'day').toDate() : '-';\r\n const oneYearAfterLastRentIncreaseDate = calculatedRentVars.oneYearAfterLastRentIncreaseDate;\r\n const calcRentIncreaseCausedLoss = moment(existingNoticeServiceDate).isAfter(moment(decisionDate)) && moment(existingRentEffectiveDate).isAfter(moment(earliestDecisionServiceDate));\r\n const calcRentIncreaseServiceTimeIsAvailable = this.getCalcRentIncreaseServiceTimeIsAvailable(earliestServiceDate, maxRentIncreaseDate);\r\n const calcMissedRentIncreaseDate = calcRentIncreaseCausedLoss ? existingRentEffectiveDate\r\n : !calcRentIncreaseServiceTimeIsAvailable ? maxRentIncreaseDate\r\n : null;\r\n const not1YearBetweenRentIncreases = moment(existingRentEffectiveDate).subtract(1, 'year').isBefore(moment(previousYearRentIncreaseDate));\r\n const not3MonthsForService = moment(existingRentEffectiveDate).subtract(3, 'months').isBefore(moment(existingNoticeServiceDate));\r\n\r\n const stepOneVars = {\r\n address,\r\n streetAddress, \r\n city, \r\n postalCode,\r\n userAccessDate,\r\n earliestServiceDate,\r\n earliestDecisionServiceDate,\r\n decisionEligibleAmount,\r\n calculatedRentVars,\r\n dateUsedForMinMaxCalc,\r\n minRentIncreaseDate,\r\n rentAmountUsedForCalc,\r\n maxRentIncreaseDate,\r\n oneYearAfterLastRentIncreaseDate,\r\n calcRentIncreaseCausedLoss,\r\n calcRentIncreaseServiceTimeIsAvailable,\r\n calcMissedRentIncreaseDate,\r\n decisionDate,\r\n decisionRentAmount,\r\n isPreviousYearRentIncrease,\r\n previousYearRentIncreaseDate,\r\n existingNoticeServiceDate,\r\n existingRentEffectiveDate,\r\n existingRentAmount,\r\n isExistingRentIncrease,\r\n not1YearBetweenRentIncreases,\r\n not3MonthsForService\r\n }\r\n\r\n GeneralUtils.log('----- PRINTING ALL STEP 1 VARIABLES -----', 'success');\r\n GeneralUtils.log(`\r\n address: ${address}\\n\r\n userAccessDate: ${formatter.toDateDisplay(userAccessDate)}\\n\r\n decisionDate: ${formatter.toDateDisplay(decisionDate)}\\n\r\n decisionEligibleAmount: ${decisionEligibleAmount}\\n\r\n decisionRentAmount: ${decisionRentAmount}\\n\r\n 8MonthsBeforeDecisionDate: ${formatter.toDateDisplay(eightMonthsBeforeDecisionDate)}\\n\r\n isPreviousYearRentIncrease: ${!!isPreviousYearRentIncrease}\\n\r\n previousYearRentIncreaseDate: ${formatter.toDateDisplay(previousYearRentIncreaseDate)}\\n\r\n isExistingRentIncrease: ${!!isExistingRentIncrease}\\n\r\n earliestServiceDate: ${formatter.toDateDisplay(earliestServiceDate)}\\n\r\n earliestDecisionServiceDate: ${formatter.toDateDisplay(earliestDecisionServiceDate)}\\n\r\n dateUsedForMinMaxCalc: ${dateUsedForMinMaxCalc}\\n\r\n minRentIncreaseDate: ${formatter.toDateDisplay(minRentIncreaseDate)}\\n\r\n maxRentIncreaseDate: ${formatter.toDateDisplay(maxRentIncreaseDate)}\\n\r\n oneYearAfterLastRentIncreaseDate: ${formatter.toDateDisplay(oneYearAfterLastRentIncreaseDate)}\\n\r\n rentAmountUsedForCalc: ${rentAmountUsedForCalc}\\n\r\n existingNoticeServiceDate: ${formatter.toDateDisplay(existingNoticeServiceDate)}\\n\r\n existingRentEffectiveDate: ${formatter.toDateDisplay(existingRentEffectiveDate)}\\n\r\n existingRentAmount: ${existingRentAmount}\\n\r\n calcRentIncreaseCausedLoss: ${calcRentIncreaseCausedLoss}\\n\r\n calcRentIncreaseServiceTimeIsAvailable: ${calcRentIncreaseServiceTimeIsAvailable}\\n\r\n calcMissedRentIncreaseDate: ${formatter.toDateDisplay(calcMissedRentIncreaseDate)}\\n\r\n not1YearBetweenRentIncreases: ${not1YearBetweenRentIncreases}\\n\r\n not3MonthsForService: ${not3MonthsForService}\r\n `\r\n , 'end');\r\n \r\n setStepOneVars(stepOneVars);\r\n }\r\n\r\n modifyClicked = () => {\r\n this.props.setStepOneStatus(false);\r\n }\r\n\r\n render() {\r\n const { \r\n streetAddress,\r\n city,\r\n postalCode,\r\n userAccessDate,\r\n decisionDate,\r\n decisionEligibleAmount,\r\n decisionRentAmount,\r\n isPreviousYearRentIncrease,\r\n previousYearRentIncreaseDate,\r\n errors,\r\n isExistingRentIncrease,\r\n existingNoticeServiceDate,\r\n existingRentEffectiveDate,\r\n existingRentAmount\r\n } = this.state;\r\n const { cpiConfig, submitted } = this.props;\r\n\r\n const renderModifyButton = () => submitted ? this.modifyClicked()}>\r\n not include your eligible amount from your Phase 1 rent increase?`}\r\n handleSelectChange={handleIsExistingRentIncrease}\r\n selectList={[ { text: 'No', value: DROPDOWN_NO_VALUE }, { text: 'Yes', value: DROPDOWN_YES_VALUE } ]}\r\n />\r\n
\r\n {renderYesQuestions()}\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default StepOne;","import React, { Component } from 'react';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { CustomDateInput } from '../../Helper/InputBase';\r\nimport { CalculationUtils, formatter, validate } from '../../../utility';\r\nimport { restartIcon, appliedRuleIcon } from '../../../assets/images';\r\nimport GeneralUtils from '../../../utility/GeneralUtils';\r\nimport moment from 'moment';\r\n\r\nclass StepTwo extends Component {\r\n state = {\r\n selectedRentIncreaseDate: '',\r\n\r\n errors: {\r\n selectedRentIncreaseDate: null\r\n },\r\n }\r\n\r\n componentDidMount() {\r\n const { stepTwoData } = this.props;\r\n \r\n if (Object.keys(stepTwoData).length === 0) return;\r\n this.setState({\r\n selectedRentIncreaseDate: stepTwoData.selectedRentIncreaseDate || ''\r\n });\r\n }\r\n\r\n handleDateChange = (value, event) => {\r\n const { name } = event;\r\n this.setState({\r\n [name]: value,\r\n errors: { ...this.state.errors, [name]: '' },\r\n })\r\n }\r\n\r\n modifyClicked = () => {\r\n this.props.setStepTwoStatus(false);\r\n }\r\n\r\n calculateCpiYear = () => {\r\n const { selectedRentIncreaseDate } = this.state;\r\n const { stepOneData } = this.props;\r\n const calcRentIncreaseCausedLoss = stepOneData.calcRentIncreaseCausedLoss;\r\n const calcRentIncreaseServiceTimeIsAvailable = stepOneData.calcRentIncreaseServiceTimeIsAvailable;\r\n const calcMissedRentIncreaseDate = stepOneData.calcMissedRentIncreaseDate;\r\n\r\n if (selectedRentIncreaseDate) {\r\n return moment(selectedRentIncreaseDate).format('YYYY');\r\n } else if (calcRentIncreaseCausedLoss || !calcRentIncreaseServiceTimeIsAvailable) {\r\n return moment(calcMissedRentIncreaseDate).format('YYYY');\r\n }\r\n }\r\n\r\n submitStepTwo = () => {\r\n const { selectedRentIncreaseDate } = this.state;\r\n const { stepOneData } = this.props;\r\n\r\n const calcRentIncreaseCausedLoss = stepOneData.calcRentIncreaseCausedLoss;\r\n const calcRentIncreaseServiceTimeIsAvailable = stepOneData.calcRentIncreaseServiceTimeIsAvailable;\r\n const rentIncreaseDateRequired = !calcRentIncreaseCausedLoss && calcRentIncreaseServiceTimeIsAvailable;\r\n\r\n const validationArray = [{\r\n selectedRentIncreaseDate,\r\n validationRules: [\r\n rentIncreaseDateRequired ? { minDate: stepOneData.minRentIncreaseDate } : {},\r\n rentIncreaseDateRequired ? { maxDate: stepOneData.maxRentIncreaseDate } : {},\r\n { isRequired: rentIncreaseDateRequired, errorMsg: 'Date is required' }\r\n ]\r\n }];\r\n\r\n let err = validate(validationArray);\r\n console.log('err: ', err);\r\n if (Object.keys(err).length >= 1) {\r\n this.setState({ errors: err });\r\n } else {\r\n this.setStepTwoVars();\r\n this.props.setStepTwoStatus(true);\r\n }\r\n }\r\n\r\n setStepTwoVars = () => {\r\n const { selectedRentIncreaseDate } = this.state;\r\n const { setStepTwoVars, cpiConfig } = this.props;\r\n\r\n const calcCPIYear = this.calculateCpiYear();\r\n const calcCPIValue = CalculationUtils.getCpiForYear(cpiConfig, calcCPIYear);\r\n const dateNextYearCPIAvailable = calcCPIValue ? null : `Sept ${moment(selectedRentIncreaseDate).subtract(1, 'year').format('YYYY')}`;\r\n\r\n const stepTwoVars = {\r\n selectedRentIncreaseDate,\r\n calcCPIYear,\r\n calcCPIValue,\r\n dateNextYearCPIAvailable\r\n }\r\n\r\n const logCalcCPI = calcCPIValue ? `calcCPIValue: year: ${calcCPIValue.year}, value: ${calcCPIValue.value}` : null;\r\n\r\n GeneralUtils.log('----- PRINTING ALL STEP 2 VARIABLES -----', 'success');\r\n GeneralUtils.log(`\r\n selectedRentIncreaseDate: ${formatter.toDateDisplay(selectedRentIncreaseDate)}\\n\r\n calcCPIYear: ${calcCPIYear}\\n\r\n calcCPIValue: ${logCalcCPI}\\n\r\n dateNextYearCPIAvailable: ${dateNextYearCPIAvailable}\r\n `, 'start');\r\n\r\n setStepTwoVars(stepTwoVars);\r\n }\r\n\r\n render() {\r\n const { errors, selectedRentIncreaseDate } = this.state;\r\n const { submitted, stepOneData, cpiConfig } = this.props;\r\n\r\n const minRentIncreaseDate = stepOneData.minRentIncreaseDate\r\n const maxRentIncreaseDate = stepOneData.maxRentIncreaseDate;\r\n const calcRentIncreaseCausedLoss = stepOneData.calcRentIncreaseCausedLoss;\r\n const calcRentIncreaseServiceTimeIsAvailable = stepOneData.calcRentIncreaseServiceTimeIsAvailable;\r\n\r\n const oneYearAfterLastRentIncreaseDate = stepOneData.oneYearAfterLastRentIncreaseDate;\r\n\r\n const renderButtons = () => {\r\n if (calcRentIncreaseCausedLoss || !calcRentIncreaseServiceTimeIsAvailable) {\r\n if (!submitted) this.submitStepTwo();\r\n return;\r\n }\r\n\r\n const renderModifyButton = () => submitted ? this.modifyClicked()}>Please provide the address of the rental unit for this rent increase {address}
\r\n\r\n \r\n {renderModifyButton()}\r\n
\r\n \r\n \r\n {renderModifyButton()}\r\n
\r\n );\r\n }\r\n\r\n const renderRentIncreaseDate = () => {\r\n if (calcRentIncreaseCausedLoss || !calcRentIncreaseServiceTimeIsAvailable) return;\r\n\r\n return (\r\n \r\n
\r\n )\r\n }\r\n\r\n const renderCpiUnavailableError = () => {\r\n const calcCPIYear = this.calculateCpiYear();\r\n const calcCPIValue = CalculationUtils.getCpiForYear(cpiConfig, calcCPIYear);\r\n const dateNextYearCPIAvailable = calcCPIValue ? null : `Sept ${moment(selectedRentIncreaseDate).subtract(1, 'year').format('YYYY')}`;\r\n\r\n if (!calcCPIValue && submitted) {\r\n return (\r\n \r\n Rate of future annual allowable rent increase not known This future rent increase cannot be calculated until the maximum annual allowable rent increase rate is known for the year beginning on {formatter.toDateDisplay(moment(selectedRentIncreaseDate).format('YYYY'))}. This tool is updated each September with the annual allowable rent increase rates for the following calendar year. \r\n Based on the date you have selected for this rent increase, you can return to this site and calculate this rent increase in {dateNextYearCPIAvailable}.\r\n
\r\n );\r\n } else {\r\n return;\r\n }\r\n }\r\n\r\n return (\r\n\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default StepTwo;","import React from 'react';\r\nimport { formatter } from \"../../../../utility\";\r\n\r\nconst RentIncreaseBreakdown = (props) => {\r\n const { \r\n decisionEligibleAmount, \r\n rentAmountUsedForCalc, \r\n rentCPIAmountStandardRentIncrease, \r\n rentAmountStandardRentIncrease,\r\n rentAmountAdditionalPortion,\r\n rentAmountFinalAdditionalRentIncrease,\r\n rentMaxAmountAdditionalPortion,\r\n calcRentIncreaseCausedLoss,\r\n calcRentIncreaseServiceTimeIsAvailable,\r\n calcMissedRentIncreaseDate,\r\n cpiValue,\r\n cpiYear \r\n } = props;\r\n\r\n const renderAllowedRentIncreaseAmount = () => {\r\n if ((calcRentIncreaseCausedLoss || !calcRentIncreaseServiceTimeIsAvailable) && calcMissedRentIncreaseDate) return;\r\n return (\r\n \r\n \r\n \r\n Applied Rule: The first additional rent increase can only be imposed 3 full months after the decision date, to allow for service of the notice of additional rent increase ({(formatter.toDateDisplay(stepOneData.earliestDecisionServiceDate))}) \r\n or a minimum 1 year after the last rent increase, allowing for 3 full months from the decision date for service of the notice {isNaN(oneYearAfterLastRentIncreaseDate) || !oneYearAfterLastRentIncreaseDate ? '(does not apply)' : `(${formatter.toDateDisplay(oneYearAfterLastRentIncreaseDate)})`}. The earliest date allowed for this additional rent increase to take effect is {formatter.toDateDisplay(minRentIncreaseDate)} \r\n \r\n
\r\n \r\n \r\n Applied Rule: The first additional rent increase must be imposed within 1 year of the earliest available additional rent increase date. The last month for this additional rent increase to be effective is {formatter.toDateDisplay(maxRentIncreaseDate, { noDay: true })}. \r\n If the Phase 1 additional rent increase is not imposed by this month, the full eligible amount for the first year becomes an unused portion and cannot be carried forward to the next phase or any future rent increase.\r\n \r\n
\r\n {formatter.toAmountDisplay(rentAmountFinalAdditionalRentIncrease)}\r\n Maximum allowed rent amount with all rent increases applied (the annual allowable rent increase and additional rent increase)\r\n
\r\n );\r\n }\r\n\r\n return (\r\n <>\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default RentIncreaseBreakdown;","import React, { Component } from 'react';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { InputBase } from '../../Helper/InputBase';\r\nimport { formatter, validate } from '../../../utility';\r\nimport { NormalizationConstants } from '../../../constants';\r\nimport { restartIcon, appliedRuleIcon } from '../../../assets/images';\r\nimport GeneralUtils from '../../../utility/GeneralUtils';\r\nimport moment from 'moment';\r\nimport { RentIncreaseBreakdown } from './RentIncreaseBreakdown';\r\n\r\nconst MAX_PORTION_PERCENTAGE = 0.03;\r\nconst PERCENT_TO_VALUE_MULTIPLIER = 0.01;\r\n\r\nclass StepThree extends Component {\r\n state = {\r\n rentCPIAmountStandardRentIncrease: '', \r\n rentAmountStandardRentIncrease: '',\r\n rentMaxAmountAdditionalPortion: '',\r\n rentAmountAdditionalPortion: '',\r\n rentAmountFinalAdditionalRentIncrease: '',\r\n phaseOneRemainingEligibleAmount: '',\r\n\r\n selectedRentIncreaseAmount: '',\r\n\r\n\r\n errors: {\r\n aawds: ''\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n const { stepOneData, stepTwoData, stepThreeData, submitted } = this.props;\r\n\r\n const calcCPIValue = stepTwoData.calcCPIValue ? stepTwoData.calcCPIValue : {};\r\n const cpiPercent = (Number(calcCPIValue.value) * PERCENT_TO_VALUE_MULTIPLIER);\r\n const rentAmountUsedForCalc = Number(stepOneData.rentAmountUsedForCalc);\r\n const rentCPIAmountStandardRentIncrease = formatter.toFixedNumber((rentAmountUsedForCalc * cpiPercent), 2);\r\n const decisionEligibleAmount = Number(stepOneData.decisionEligibleAmount);\r\n const rentAmountStandardRentIncrease = formatter.toFixedNumber(rentCPIAmountStandardRentIncrease + rentAmountUsedForCalc, 2);\r\n const rentMaxAmountAdditionalPortion = formatter.toFixedNumber((rentAmountStandardRentIncrease * MAX_PORTION_PERCENTAGE), 2);\r\n const rentAmountAdditionalPortion = Math.min(decisionEligibleAmount, rentMaxAmountAdditionalPortion);\r\n const rentAmountFinalAdditionalRentIncrease = formatter.toFixedNumber(rentAmountStandardRentIncrease + rentAmountAdditionalPortion, 2);\r\n const phaseOneRemainingEligibleAmount = formatter.toFixedNumber((decisionEligibleAmount - rentAmountAdditionalPortion), 2);\r\n\r\n this.setState({\r\n rentCPIAmountStandardRentIncrease,\r\n rentAmountStandardRentIncrease,\r\n rentMaxAmountAdditionalPortion,\r\n rentAmountAdditionalPortion,\r\n rentAmountFinalAdditionalRentIncrease,\r\n phaseOneRemainingEligibleAmount,\r\n selectedRentIncreaseAmount: stepThreeData.selectedRentIncreaseAmount || ''\r\n }, () => {\r\n if ((stepOneData.calcRentIncreaseCausedLoss || !stepOneData.calcRentIncreaseServiceTimeIsAvailable) && !submitted) this.submitStepThree();\r\n });\r\n\r\n }\r\n\r\n modifyClicked = () => {\r\n this.props.setStepThreeStatus(false);\r\n }\r\n\r\n handleChange = (event) => {\r\n const { name, value } = event.target;\r\n this.setState({\r\n [name]: value,\r\n errors: { ...this.state.errors, [name]: '' },\r\n });\r\n };\r\n\r\n submitStepThree = () => {\r\n const { selectedRentIncreaseAmount, rentAmountFinalAdditionalRentIncrease } = this.state;\r\n const { setStepThreeStatus, stepOneData } = this.props;\r\n const hideRIAmount = stepOneData.calcRentIncreaseCausedLoss || !stepOneData.calcRentIncreaseServiceTimeIsAvailable;\r\n const validationArray = [{\r\n selectedRentIncreaseAmount,\r\n validationRules: [\r\n !hideRIAmount ? { minValue: stepOneData.rentAmountUsedForCalc } : {},\r\n !hideRIAmount ? { maxValue: rentAmountFinalAdditionalRentIncrease } : {},\r\n { isRequired: !hideRIAmount, errorMsg: 'New rent amount is required' },\r\n ]\r\n }];\r\n\r\n let err = validate(validationArray);\r\n console.log('err: ', err);\r\n if (Object.keys(err).length >= 1) {\r\n this.setState({ errors: err });\r\n } else {\r\n this.setStepThreeVars();\r\n setStepThreeStatus(true);\r\n }\r\n }\r\n\r\n getIsGeneratedNoticeAvailable = () => {\r\n const { stepOneData, stepTwoData } = this.props;\r\n const { phaseOneRemainingEligibleAmount } = this.state;\r\n\r\n if((stepOneData.calcRentIncreaseCausedLoss && phaseOneRemainingEligibleAmount <= 0) || (!stepOneData.calcRentIncreaseServiceTimeIsAvailable && phaseOneRemainingEligibleAmount <= 0) || !stepTwoData.calcCPIValue) return false;\r\n else return true;\r\n }\r\n\r\n setStepThreeVars = () => {\r\n const { rentCPIAmountStandardRentIncrease, rentAmountStandardRentIncrease, rentMaxAmountAdditionalPortion, rentAmountAdditionalPortion, rentAmountFinalAdditionalRentIncrease, phaseOneRemainingEligibleAmount, selectedRentIncreaseAmount } = this.state;\r\n const { stepTwoData, setStepThreeVars } = this.props;\r\n\r\n const phaseOneLostEligibleAmount = this.getPhaseOneLostEligibleAmount();\r\n const isGeneratedNoticeAvailable = this.getIsGeneratedNoticeAvailable();\r\n const inPersonMinServiceDate = moment(stepTwoData.selectedRentIncreaseDate).subtract(3, 'months').subtract(1, 'days').toDate() ;\r\n const emailDoorFaxMinServiceDate = moment(stepTwoData.selectedRentIncreaseDate).subtract(3, 'months').subtract(4, 'days').toDate();\r\n const regMailMinServiceDate = moment(stepTwoData.selectedRentIncreaseDate).subtract(3, 'months').subtract(6, 'days').toDate(); \r\n\r\n const stepThreeVars = {\r\n rentCPIAmountStandardRentIncrease,\r\n phaseOneRemainingEligibleAmount,\r\n phaseOneLostEligibleAmount,\r\n isGeneratedNoticeAvailable,\r\n selectedRentIncreaseAmount,\r\n rentAmountAdditionalPortion,\r\n inPersonMinServiceDate,\r\n regMailMinServiceDate,\r\n emailDoorFaxMinServiceDate,\r\n rentAmountFinalAdditionalRentIncrease,\r\n rentAmountStandardRentIncrease,\r\n rentMaxAmountAdditionalPortion\r\n };\r\n \r\n GeneralUtils.log('----- PRINTING ALL STEP 3 VARIABLES -----', 'success');\r\n GeneralUtils.log(`\r\n rentCPIAmountStandardRentIncrease: ${rentCPIAmountStandardRentIncrease}\\n\r\n rentAmountStandardRentIncrease: ${rentAmountStandardRentIncrease}\\n\r\n rentMaxAmountAdditionalPortion: ${rentMaxAmountAdditionalPortion}\\n\r\n rentAmountAdditionalPortion: ${rentAmountAdditionalPortion}\\n\r\n rentAmountFinalAdditionalRentIncrease: ${rentAmountFinalAdditionalRentIncrease}\\n\r\n phaseOneRemainingEligibleAmount: ${phaseOneRemainingEligibleAmount}\\n\r\n phaseOneLostEligibleAmount: ${phaseOneLostEligibleAmount}\\n\r\n isGeneratedNoticeAvailable: ${isGeneratedNoticeAvailable}\\n\r\n inPersonMinServiceDate: ${formatter.toDateDisplay(inPersonMinServiceDate)}\\n\r\n emailDoorFaxMinServiceDate: ${formatter.toDateDisplay(emailDoorFaxMinServiceDate)}\\n\r\n regMailMinServiceDate: ${formatter.toDateDisplay(regMailMinServiceDate)}\r\n `, 'info');\r\n\r\n setStepThreeVars(stepThreeVars);\r\n }\r\n\r\n getPhaseOneLostEligibleAmount() {\r\n const { rentAmountFinalAdditionalRentIncrease, selectedRentIncreaseAmount, rentMaxAmountAdditionalPortion } = this.state;\r\n if ((rentAmountFinalAdditionalRentIncrease - selectedRentIncreaseAmount) <= (rentMaxAmountAdditionalPortion)) {\r\n return formatter.toFixedNumber(rentAmountFinalAdditionalRentIncrease - selectedRentIncreaseAmount, 2);\r\n } else {\r\n return formatter.toFixedNumber(rentMaxAmountAdditionalPortion, 2);\r\n }\r\n }\r\n\r\n render = () => {\r\n const {\r\n rentCPIAmountStandardRentIncrease,\r\n rentAmountStandardRentIncrease,\r\n rentAmountAdditionalPortion, \r\n rentAmountFinalAdditionalRentIncrease, \r\n selectedRentIncreaseAmount,\r\n rentMaxAmountAdditionalPortion,\r\n errors \r\n } = this.state;\r\n const { submitted, stepOneData, stepTwoData } = this.props;\r\n\r\n const calcRentIncreaseCausedLoss = stepOneData.calcRentIncreaseCausedLoss;\r\n const calcRentIncreaseServiceTimeIsAvailable = stepOneData.calcRentIncreaseServiceTimeIsAvailable;\r\n const calcMissedRentIncreaseDate = stepOneData.calcMissedRentIncreaseDate;\r\n const cpiValue = stepTwoData.calcCPIValue ? stepTwoData.calcCPIValue.value : 0;\r\n const cpiYear = stepTwoData.calcCPIValue ? stepTwoData.calcCPIValue.year : 0;\r\n \r\n const renderButtons = () => {\r\n\r\n const renderModifyButton = () => submitted ? this.modifyClicked()}>\r\n {formatter.toAmountDisplay(decisionEligibleAmount)}\r\n Eligible amount from the decision for the unit\r\n
\r\n\r\n \r\n {formatter.toAmountDisplay(rentAmountUsedForCalc)}\r\n Current monthly rent (before any rent increases)\r\n
\r\n\r\n \r\n {formatter.toAmountDisplay(rentCPIAmountStandardRentIncrease)}\r\n Maximum annual allowable rent increase amount {!cpiValue || !cpiYear ? null : `(${cpiValue}% for ${cpiYear})` }\r\n
\r\n\r\n \r\n {formatter.toAmountDisplay(rentAmountStandardRentIncrease)}\r\n Rent amount with maximum annual allowable rent increase \r\n
\r\n\r\n \r\n {formatter.toAmountDisplay(rentAmountAdditionalPortion)}\r\n Additional rent increase amount eligible for Phase 1 (capped at a max of 3% of rent after the annual allowable rent increase is applied or {formatter.toAmountDisplay(rentAmountAdditionalPortion)})\r\n
\r\n\r\n {renderAllowedRentIncreaseAmount()}\r\n \r\n \r\n {renderModifyButton()}\r\n
\r\n )\r\n }\r\n \r\n const renderRentIncreaseAmount = () => {\r\n if (stepOneData.calcRentIncreaseCausedLoss || !stepOneData.calcRentIncreaseServiceTimeIsAvailable) return;\r\n\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default StepThree;","import appConstants from '../config/app_config';\r\nconst baseRoute = appConstants.baseRoute;\r\nconst ROUTES = {\r\n BASE: `${baseRoute}`,\r\n EXPLORER: `${baseRoute}Explorer`,\r\n EXPLORER_STEP1: `${baseRoute}Explorer/step1`,\r\n EXPLORER_STEP2: `${baseRoute}Explorer/step2`,\r\n NOTICEGEN: `${baseRoute}NoticeGeneratorPhaseOne`,\r\n NOTICEGEN_STEP1: `${baseRoute}NoticeGeneratorPhaseOne/step1`,\r\n NOTICEGEN_STEP2: `${baseRoute}NoticeGeneratorPhaseOne/step2`,\r\n LANDLORD_VALIDATOR: `${baseRoute}LandlordValidator`,\r\n TENANT_VALIDATOR: `${baseRoute}TenantValidator`,\r\n RENT_INCREASE_CALCULATOR: `${baseRoute}RentIncreaseCalculator`\r\n};\r\n\r\nexport default ROUTES;\r\n","import React from 'react';\r\n\r\nimport { appliedRuleIcon } from '../../../assets/images';\r\nimport { formatter } from '../../../utility';\r\n\r\nconst StepFour = (props) => {\r\n const { stepOneData, stepThreeData } = props;\r\n\r\n const selectedRentIncreaseAmount = stepThreeData.selectedRentIncreaseAmount;\r\n const phaseOneLostEligibleAmount = stepThreeData.phaseOneLostEligibleAmount;\r\n const phaseOneRemainingEligibleAmount = stepThreeData.phaseOneRemainingEligibleAmount;\r\n const minRentIncreaseDate = stepOneData.minRentIncreaseDate;\r\n const maxRentIncreaseDate = stepOneData.maxRentIncreaseDate;\r\n const rentAmountAdditionalPortion = stepThreeData.rentAmountAdditionalPortion;\r\n const calcRentIncreaseServiceTimeIsAvailable = stepOneData.calcRentIncreaseServiceTimeIsAvailable;\r\n const calcMissedRentIncreaseDate = stepOneData.calcMissedRentIncreaseDate;\r\n const calcRentIncreaseCausedLoss = stepOneData.calcRentIncreaseCausedLoss;\r\n const not1YearBetweenRentIncreases = stepOneData.not1YearBetweenRentIncreases;\r\n const not3MonthsForService = stepOneData.not3MonthsForService;\r\n\r\n const renderUnusedAmountWarning = () => {\r\n if (phaseOneLostEligibleAmount <= 0 || !selectedRentIncreaseAmount) return;\r\n return (\r\n \r\n
\r\n {renderButtons()}\r\n First Additional Rent Increase Breakdown
\r\n\r\n \r\n \r\n Applied Rule: The maximum additional rent increase amount that can be applied to a rent increase is the lesser amount between 3% of the rent (after the maximum annual allowable increase is calculated), or the eligible amount for the unit. \r\n The maximum additional rent increase amount for this rent increase is {formatter.toAmountDisplay(rentAmountAdditionalPortion)}.\r\n \r\n
\r\n Warning. The amount that you have selected for the additional rent increase does not use the full amount available. Based on the amount entered of {formatter.toAmountDisplay(selectedRentIncreaseAmount)} you \r\n will lose {formatter.toAmountDisplay(phaseOneLostEligibleAmount)} of\r\n your Phase 1 eligible amount as an unused portion. This unused portion cannot be carried forward to the next phase or any future rent increase.\r\n
\r\n )\r\n };\r\n\r\n const renderNotOneYearBetweenRentIncreaseError = () => {\r\n if (!not1YearBetweenRentIncreases) return;\r\n return (\r\n \r\n Warning: The landlord may only increase the rent 12 months after the date that the existing rent was established or when rent was last increased. Based on the information you provided, for your previous and future rent increase, \r\n your future rent increase does not comply with the requirements under the Residential Tenancy Act and you should not continue with this tool until this issue is resolved. \r\n If the dates you have entered are incorrect you can enter the correct dates and, if the future rent increase is valid, this warning will disappear.\r\n
\r\n );\r\n }\r\n\r\n const renderNotThreeMonthsForServiceError = () => {\r\n if (!not3MonthsForService) return;\r\n return (\r\n\r\n Warning: All rent increases must have the notice of rent increase served to the tenant at least 3 full months prior to the date that the rent increase is to be effective. \r\n Based on the information you provided, the notice that you served for your future rent increase does not comply with the requirements under the Residential Tenancy Act and you \r\n should not continue with this tool until this issue is resolved. If the dates you have entered are incorrect, you can enter the correct dates and if the future rent increase is \r\n valid this warning will disappear.\r\n
\r\n );\r\n }\r\n\r\n const renderMissedRentIncreaseWarning = () => {\r\n if (calcRentIncreaseServiceTimeIsAvailable) return\r\n\r\n return (\r\n\r\n Warning. Based on the information that you provided, the final month for the Phase 1 additional rent increase to take effect is {formatter.toDateDisplay(calcMissedRentIncreaseDate)}. \r\n As there is less than three full months to provide notice to the tenant as required under the Act, your eligible amount for the Phase 1 additional rent increase has become an unused portion in the amount of {formatter.toAmountDisplay(rentAmountAdditionalPortion)} This\r\n unused portion cannot be carried forward to the next phase or any future rent increase. Your remaining eligible amount is {formatter.toAmountDisplay(phaseOneRemainingEligibleAmount)} for a Phase 2 additional rent increase. You must generate a notice insert for this lost Phase 1 eligible amount and include it with your future additional rent increases.\r\n
\r\n );\r\n }\r\n\r\n const renderAdditionalMissedRentIncreaseWarning = () => {\r\n if (!calcRentIncreaseCausedLoss) return;\r\n\r\n return (\r\n \r\n Warning. Based on the rules, your annual allowable rent increase effective on {formatter.toDateDisplay(calcMissedRentIncreaseDate)} will restrict you from imposing the Phase 1 additional rent increase during this same time frame and will result in the loss of the Phase 1 eligible amount of {formatter.toAmountDisplay(rentAmountAdditionalPortion)}.\r\n
\r\n );\r\n }\r\n\r\n const renderNoRemainingEligibleAmountWarning = () => {\r\n if (phaseOneRemainingEligibleAmount >= 1 || (not1YearBetweenRentIncreases || not3MonthsForService)) return;\r\n\r\n return (\r\n \r\n Warning. Based on the rules and the information provided, you have $0.00 eligible amount remaining for future additional rent increases. The rent for this rental unit may be increased with the annual allowable rent increase, subject to the timing and notice requirements under the Act.\r\n
\r\n );\r\n }\r\n\r\n const renderRegularWarnings = () => {\r\n return (\r\n <>\r\n { renderUnusedAmountWarning() }\r\n\r\n \r\n
\r\n\r\n { renderMissedRentIncreaseWarning() }\r\n { renderAdditionalMissedRentIncreaseWarning() }\r\n { renderNoRemainingEligibleAmountWarning() }\r\n \r\n )\r\n }\r\n\r\n const renderSpecialWarnings = () => {\r\n return <>\r\n { renderNotOneYearBetweenRentIncreaseError() }\r\n { renderNotThreeMonthsForServiceError() }\r\n \r\n }\r\n\r\n return (\r\n \r\n \r\n \r\n Applied Rule: Remaining eligible amounts associated to a rental unit that exceed 3% of the rent, after the maximum annual allowable increase is added, can be applied to future rent increases.\r\n The remaining eligible amount for future additional rent increases is {formatter.toAmountDisplay(phaseOneRemainingEligibleAmount)} \r\n \r\n
\r\n \r\n \r\n Applied Rule: Any additional rent increase amount eligible for Phase 1 that is not used within the first 12 months it may be imposed (to comply with timing and notice requirements) becomes an unused portion. \r\n This unused portion cannot be carried forward to the next phase or any future rent increase. \r\n If no additional rent increase is applied between {formatter.toDateDisplay(minRentIncreaseDate)} and {formatter.toDateDisplay(maxRentIncreaseDate)} the eligible amount that will be lost and becomes an unused portion is {formatter.toAmountDisplay(rentAmountAdditionalPortion)}, \r\n which will leave a remaining eligible amount for this unit of {formatter.toAmountDisplay(phaseOneRemainingEligibleAmount)} for future additional rent increases.\r\n \r\n
\r\n {not1YearBetweenRentIncreases || not3MonthsForService ? renderSpecialWarnings() : renderRegularWarnings()}\r\n
\r\n );\r\n}\r\n\r\nexport default StepFour;","import React from 'react';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { bcLogoPrint } from '../../../assets/images';\r\nimport { formatter } from '../../../utility';\r\nimport { RentIncreaseBreakdown } from '../StepThree/RentIncreaseBreakdown';\r\n\r\nconst GeneratedNoticePhase1 = (props) => {\r\n const { formData } = props;\r\n\r\n const renderSectionOne = () => {\r\n const address = formData.address;\r\n const userAccessDate = formData.userAccessDate;\r\n const selectedRentIncreaseAmount = formData.selectedRentIncreaseAmount;\r\n const rentIncreaseDate = formData.selectedRentIncreaseDate;\r\n const calcMissedRentIncreaseDate = formData.calcMissedRentIncreaseDate;\r\n const minRentIncreaseDate = formData.minRentIncreaseDate;\r\n const maxRentIncreaseDate = formData.maxRentIncreaseDate;\r\n const rentAmountAdditionalPortion = formData.rentAmountAdditionalPortion;\r\n const inPersonMinServiceDate = formData.inPersonMinServiceDate;\r\n const emailDoorFaxMinServiceDate = formData.emailDoorFaxMinServiceDate;\r\n const regMailMinServiceDate = formData.regMailMinServiceDate;\r\n const calcRentIncreaseCausedLoss = formData.calcRentIncreaseCausedLoss;\r\n const calcRentIncreaseServiceTimeIsAvailable = formData.calcRentIncreaseServiceTimeIsAvailable;\r\n const selectedRentIncreaseDate = formData.selectedRentIncreaseDate;\r\n const phaseOneRemainingEligibleAmount = formData.phaseOneRemainingEligibleAmount;\r\n\r\n const renderRentAmount = () => {\r\n if (!calcRentIncreaseCausedLoss && calcRentIncreaseServiceTimeIsAvailable && selectedRentIncreaseAmount) {\r\n return New rent amount: {formatter.toAmountDisplay(selectedRentIncreaseAmount)};\r\n }\r\n }\r\n\r\n const renderRentIncreaseDate = () => {\r\n if (!calcRentIncreaseCausedLoss && calcRentIncreaseServiceTimeIsAvailable && selectedRentIncreaseDate) {\r\n return Effective date of rent increase: {formatter.toDateDisplay(rentIncreaseDate)}*;\r\n }\r\n }\r\n\r\n const renderMissedRentIncreaseDate = () => {\r\n if ((calcRentIncreaseCausedLoss || !calcRentIncreaseServiceTimeIsAvailable) && calcMissedRentIncreaseDate ) {\r\n return Date of lost Phase 1 additional rent increase amount: {formatter.toDateDisplay(calcMissedRentIncreaseDate)};\r\n }\r\n }\r\n\r\n const renderLostFirstYearRentIncreaseWarning = () => {\r\n if(calcRentIncreaseCausedLoss || !calcRentIncreaseServiceTimeIsAvailable) {\r\n return (\r\n \r\n Lost Phase 1 additional rent increase: The Phase 1 additional rent increase was not imposed between the required dates of {formatter.toDateDisplay(minRentIncreaseDate)} and {formatter.toDateDisplay(maxRentIncreaseDate)}. \r\n For this reason, the eligible amount for the Phase 1 additional rent increase has become an unused portion in the amount of {formatter.toAmountDisplay(rentAmountAdditionalPortion)}. This \r\n unused portion cannot be carried forward to the next phase or any future rent increase. The landlord has a remaining eligible amount of {formatter.toAmountDisplay(phaseOneRemainingEligibleAmount)} for future additional rent increases.\r\n
\r\n );\r\n }\r\n }\r\n\r\n const renderServiceDate = () => {\r\n if (!calcRentIncreaseCausedLoss && calcRentIncreaseServiceTimeIsAvailable) {\r\n return (\r\n \r\n Last date on which notice must be served to the tenant(s)\r\n
\r\n );\r\n }\r\n }\r\n\r\n return (\r\n <>\r\n - \r\n
- {formatter.toDateDisplay(inPersonMinServiceDate)} if the notice of rent increase is served in person \r\n
- {formatter.toDateDisplay(emailDoorFaxMinServiceDate)} if the notice of rent increase is served by pre-agreed email, posted on door, or fax \r\n
- {formatter.toDateDisplay(regMailMinServiceDate)} if the notice of rent increase is served by registered mail \r\n
\r\n Section 1: RENT INCREASE AMOUNT, DATES AND SERVICE\r\n Rental unit address: {address}*\r\n Date rent increase insert generated: {formatter.toDateDisplay(userAccessDate)}\r\n { renderRentAmount() }\r\n { renderRentIncreaseDate() }\r\n { renderMissedRentIncreaseDate() }\r\n\r\n { renderLostFirstYearRentIncreaseWarning() }\r\n { renderServiceDate() }\r\n
\r\n \r\n );\r\n }\r\n\r\n const renderSectionTwo = () => {\r\n const decisionDate = formData.decisionDate;\r\n const decisionEligibleAmount = formData.decisionEligibleAmount;\r\n const rentAmountUsedForCalc = formData.rentAmountUsedForCalc;\r\n const previousYearRentIncreaseDate = formData.previousYearRentIncreaseDate;\r\n const minRentIncreaseDate = formData.minRentIncreaseDate;\r\n const maxRentIncreaseDate = formData.maxRentIncreaseDate;\r\n const rentCPIAmountStandardRentIncrease = formData.rentCPIAmountStandardRentIncrease;\r\n const rentAmountStandardRentIncrease = formData.rentAmountStandardRentIncrease;\r\n const rentAmountAdditionalPortion = formData.rentAmountAdditionalPortion;\r\n const rentAmountFinalAdditionalRentIncrease = formData.rentAmountFinalAdditionalRentIncrease;\r\n const cpiValue = formData.calcCPIValue ? formData.calcCPIValue.value : 0;\r\n const cpiYear = formData.calcCPIYear;\r\n const phaseOneRemainingEligibleAmount = formData.phaseOneRemainingEligibleAmount;\r\n const calcRentIncreaseCausedLoss = formData.calcRentIncreaseCausedLoss;\r\n const calcRentIncreaseServiceTimeIsAvailable = formData.calcRentIncreaseServiceTimeIsAvailable;\r\n const rentMaxAmountAdditionalPortion = formData.rentMaxAmountAdditionalPortion;\r\n const calcMissedRentIncreaseDate = formData.calcMissedRentIncreaseDate;\r\n\r\n const renderPreviousRentIncrease = () => {\r\n return Date of previous rent increase for this unit: {previousYearRentIncreaseDate ? formatter.toDateDisplay(previousYearRentIncreaseDate) : 'Not applicable'};\r\n }\r\n\r\n const renderEligibleAmount = () => {\r\n if (!calcRentIncreaseCausedLoss && calcRentIncreaseServiceTimeIsAvailable) {\r\n return Eligible amount used by Phase 1 additional rent increase: {formatter.toAmountDisplay(rentAmountAdditionalPortion)};\r\n }\r\n }\r\n\r\n return (\r\n \r\n Section 2: SUPPORTING INFORMATION\r\n Date of Residential Tenancy Branch decision: {formatter.toDateDisplay(decisionDate)}*\r\n Eligible amount for this unit in the decision: {formatter.toAmountDisplay(decisionEligibleAmount)}*\r\n Rent amount for this unit prior to this rent increase: {formatter.toAmountDisplay(rentAmountUsedForCalc) || '-'}*\r\n { renderPreviousRentIncrease() }\r\n Phase of this additional rent increase: Phase of this additional rent increase: First of up to three (3) maximum additional rent increases\r\n Earliest date allowed for Phase 1 additional rent increase: {formatter.toDateDisplay(minRentIncreaseDate)}\r\n Final month for Phase 1 additional rent increase to be imposed: {formatter.toDateDisplay(maxRentIncreaseDate)}\r\n \r\n
\r\n )\r\n }\r\n\r\n return (\r\n \r\n Rent Increase Calculation:\r\n \r\n
\r\n \r\n
\r\n )\r\n};\r\n\r\nexport default GeneratedNoticePhase1;","import React from 'react';\r\nimport { formatter } from '../../utility';\r\n\r\nconst RICalcIncreaseBreakdown = (props) => {\r\n const { \r\n calc_p1RemainingEligibleAmount, \r\n calc_p1RentAmount, \r\n calc_p2MaxCPIAmountStandardRentIncrease, \r\n calc_p2MaxRentAmountStandardRentIncrease,\r\n calc_p2AppliedEligibleAmount,\r\n calc_p2MaxAdditionalRentIncrease,\r\n calc_p2MaxEligibleAmount,\r\n cpiValue,\r\n cpiYear \r\n } = props;\r\n\r\n\r\n return (\r\n <>\r\n \r\n
\r\n\r\n Phase 1 Additional Rent Increase Calculation
\r\n \r\n Print or save as PDF to create a copy of the rent increase details below and attach it to a completed #RTB-53-P1 form with the additional rent increase decision. \r\n You can then use these documents to provide notice to the tenant(s) of the rent increase. The amount of the rent increase and the dates on which the notice of additional rent increase must be served below are based on the information that you entered in the previous step. \r\n If any of this information is incorrect, you can go back to the previous step and edit the information to correct it. You can learn more on our website.\r\n \r\n\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n 
\r\n
\r\n Instructions\r\n \r\n #RTB-53P1D Additional Rent Increase\r\n First Phase Rent Increase Detail\r\n
\r\n - \r\n
- This form must be served to the tenant(s) with a completed #RTB-53-P1 form on or before the latest service dates below \r\n
- \r\n If any of the bolded labels with a * beside them are not accurate, this rent increase may not be valid and the tenant should file an application\r\n with the residential tenancy branch to dispute the rent increase\r\n \r\n
\r\n
\r\n \r\n );\r\n}\r\n\r\nexport default RICalcIncreaseBreakdown;","import React from 'react';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { formatter } from \"../../../utility\";\r\nimport { bcLogoPrint } from '../../../assets/images';\r\nimport RICalcIncreaseBreakdown from '../../RentIncreaseCalculator/RICalcIncreaseBreakdown';\r\n\r\nconst GeneratedNoticePhase2 = (props) => {\r\n const {\r\n address, userAccessDate, isRentIncreaseAfterPhase2, calc_p2IsServiceTimeAvailable, calc_p2RentIncreaseDate,\r\n calc_p2RemainingEligibleAmount, calc_p2InPersonMinServiceDate, calc_p2EmailDoorFaxMinServiceDate, calc_p2RegMailMinServiceDate, calc_p2MinRentIncreaseDate,\r\n calc_p2MaxRentIncreaseDate, calc_p1IsRentIncreaseAmountValid, calc_p1EligibleErrorAmount, calc_p1IsRemainingEligibleAmountValid, calc_p1IsServiceDateValid, \r\n rentIncreaseDateAfterPhase2, calc_p1RentIncreaseErrorAmount, calc_p1MaxAdditionalRentIncrease, calc_p1IsAppliedEligibleAmountValid, calc_p1UnusedEligibleAmount,\r\n decisionDate, calc_p2AppliedEligibleAmount, phase1RentIncreaseDate, decisionEligibleAmount, phase1RentAmountUsed, calc_p2MaxCPIAmountStandardRentIncrease,\r\n calc_p2MaxRentAmountStandardRentIncrease, calc_p1RemainingEligibleAmount, calc_p2MaxAdditionalRentIncrease, calc_p2CPIValue, calc_p2CPIYear, calc_p2EarliestRentIncreaseDate, \r\n calc_p2MaxEligibleAmount, phase2RentAmount, calc_p1MaxEligibleAmount, remainingPhase1EligibleAmount\r\n \r\n } = props?.formData;\r\n\r\n const renderSectionOne = () => {\r\n\r\n const renderRentAmount = () => {\r\n if (!isRentIncreaseAfterPhase2 && calc_p2IsServiceTimeAvailable) {\r\n return New rent amount: {formatter.toAmountDisplay(phase2RentAmount\r\n )};\r\n }\r\n }\r\n\r\n const renderRentIncreaseDate = () => {\r\n if (!isRentIncreaseAfterPhase2 && calc_p2IsServiceTimeAvailable) {\r\n return Effective date of phase 2 rent increase: {formatter.toDateDisplay(calc_p2RentIncreaseDate, { fullMonth: true })}*;\r\n }\r\n }\r\n\r\n const renderMissedRentIncreaseDate = () => {\r\n if (isRentIncreaseAfterPhase2 || !calc_p2IsServiceTimeAvailable) {\r\n return Date of lost phase 2 additional rent increase amount: {formatter.toDateDisplay(calc_p2MaxRentIncreaseDate, { fullMonth: true })};\r\n }\r\n }\r\n\r\n const renderLostSecondYearRentIncreaseWarning = () => {\r\n if(!calc_p2IsServiceTimeAvailable && !isRentIncreaseAfterPhase2) {\r\n return (\r\n \r\n {formatter.toAmountDisplay(calc_p1RemainingEligibleAmount)}\r\n Eligible amount remaining (not used in previous rent increases)\r\n
\r\n\r\n \r\n {formatter.toAmountDisplay(calc_p1RentAmount)}\r\n Current monthly rent (before any rent increases in year)\r\n
\r\n\r\n \r\n {formatter.toAmountDisplay(calc_p2MaxCPIAmountStandardRentIncrease)}\r\n Maximum annual allowable rent increase amount {!cpiValue || !cpiYear ? null : `(${cpiValue * 100}% for ${cpiYear})` }\r\n
\r\n\r\n \r\n {formatter.toAmountDisplay(calc_p2MaxRentAmountStandardRentIncrease)}\r\n Rent amount with standard rent increase\r\n
\r\n\r\n \r\n {formatter.toAmountDisplay(calc_p2AppliedEligibleAmount)}\r\n Additional rent increase eligible amount for rent increase (max allowed 3% or {formatter.toAmountDisplay(calc_p2MaxEligibleAmount)})\r\n
\r\n\r\n \r\n {formatter.toAmountDisplay(calc_p2MaxAdditionalRentIncrease)}\r\n Maximum allowed rent amount with all rent increases applied\r\n
\r\n \r\n Lost Phase 2 additional rent increase: The second additional rent increase (phase 2) was not imposed between the required dates of {formatter.toDateDisplay(calc_p2EarliestRentIncreaseDate, { fullMonth: true })} and {formatter.toDateDisplay(calc_p2MaxRentIncreaseDate, { fullMonth: true })}. \r\n For this reason, the landlord has lost the right to impose the phase 2 additional rent increase for this unit and {formatter.toAmountDisplay(calc_p2AppliedEligibleAmount)} of eligible amount which cannot be used for the third additional rent increase (phase 3).\r\n
\r\n );\r\n }\r\n }\r\n\r\n const renderServiceDate = () => {\r\n if (!isRentIncreaseAfterPhase2 && calc_p2IsServiceTimeAvailable) {\r\n return (\r\n \r\n Last date on which notice must be served to the tenant(s)\r\n
\r\n );\r\n }\r\n }\r\n\r\n const renderPhase1RIAmountWarning = () => {\r\n if (calc_p1IsRentIncreaseAmountValid) return;\r\n\r\n return - \r\n
- {formatter.toDateDisplay(calc_p2InPersonMinServiceDate, { fullMonth: true })} if the notice of rent increase is served in person \r\n
- {formatter.toDateDisplay(calc_p2EmailDoorFaxMinServiceDate, { fullMonth: true })} if the notice of rent increase is served by pre-agreed email, posted on door, or fax \r\n
- {formatter.toDateDisplay(calc_p2RegMailMinServiceDate, { fullMonth: true })} if the notice of rent increase is served by registered mail \r\n
\r\n Potential phase 1 rent increase issue detected. Based on the information that the landlord provided, they have imposed a rent increase that is \r\n {formatter.toAmountDisplay(calc_p1RentIncreaseErrorAmount)} over the allowed maximum rent increase for this unit of {formatter.toAmountDisplay(calc_p1MaxAdditionalRentIncrease)}.\r\n If this rent increase was not mutually agreed to by the tenant(s), the tenant(s) may dispute the rent increase with the Residential Tenancy Branch or deduct any amount overpaid from future rent payments. You can find information on rent increases here.\r\n
\r\n }\r\n\r\n const renderPhase1AppliedEligibleAmountWarning = () => {\r\n if (calc_p1EligibleErrorAmount <= 0) return;\r\n\r\n return \r\n Potential phase 1 rent increase issue detected. Based on the information that the landlord provided, they have imposed an eligible amount that is \r\n {formatter.toAmountDisplay(calc_p1EligibleErrorAmount)} over the maximum allowed eligible amount for this unit of {formatter.toAmountDisplay(calc_p1MaxEligibleAmount)}.\r\n If this rent increase was not mutually agreed to by the tenant(s), the tenant(s) may dispute the rent increase with the Residential Tenancy Branch or deduct any amount overpaid from future rent payments. You can find information on rent increases here.\r\n
\r\n }\r\n\r\n const renderPhase1RemainingEligibleAmountError = () => {\r\n if (calc_p1IsRemainingEligibleAmountValid) return;\r\n\r\n return \r\n Warning. The landlord has indicated that they have {formatter.toAmountDisplay(remainingPhase1EligibleAmount)} of eligible amount remaining for a future additional rent increase. Based on the information that the landlord provided, \r\n the Phase 2 Additional Rent Increase Calculator has determined the landlord actually has {formatter.toAmountDisplay(calc_p1RemainingEligibleAmount)} of eligible amount remaining for a future additional rent increase. This calculator uses the corrected amount of \r\n {formatter.toAmountDisplay(calc_p1RemainingEligibleAmount)} for the notice.\r\n
\r\n }\r\n\r\n const renderPhase1MinimumServiceTimeError = () => {\r\n if (calc_p1IsServiceDateValid) return;\r\n\r\n return \r\n Warning. Based on the decision date of {formatter.toDateDisplay(decisionDate, { fullMonth: true })}, and your phase 1 rent increase date of {formatter.toDateDisplay(phase1RentIncreaseDate, { fullMonth: true })}, the landlord did not give the required \r\n 3 full months of notice \r\n If this rent increase was not mutually agreed to by the tenant(s), the tenant(s) could dispute this rent increase with the Residential Tenancy Branch or deduct any amount overpaid from future rent payments. \r\n If deducting rent, the tenant should explain to the landlord in writing why the deduction is being made. If the landlord continues with a subsequent rent increase that builds on this base rent amount, they may be adding to the amount which could be disputed by the tenant or deducted from a future rent payment. \r\n You can find information on rent increases here.\r\n
\r\n }\r\n\r\n const renderRegularRentIncreaseBecomingPhase2Warning = () => {\r\n if (!isRentIncreaseAfterPhase2) return;\r\n\r\n return \r\n Warning. Based on the additional rent increase regulations, the rent increase that was effective on {formatter.toDateDisplay(rentIncreaseDateAfterPhase2, { fullMonth: true })}, is considered the phase 2 additional rent increase. If the phase 2 eligible amount of \r\n {formatter.toAmountDisplay(calc_p2AppliedEligibleAmount)} was not included in the rent increase on {formatter.toDateDisplay(rentIncreaseDateAfterPhase2, { fullMonth: true })}, then it is considered a lost amount and cannot be used for a future rent increase.\r\n
\r\n }\r\n\r\n return (\r\n \r\n
\r\n );\r\n }\r\n\r\n const renderSectionTwo = () => {\r\n return (\r\n \r\n Section 1: RENT INCREASE AMOUNT, DATES AND SERVICE\r\n Rental unit address: {address}*\r\n Date rent increase insert generated: {formatter.toDateDisplay(userAccessDate, { fullMonth: true })}\r\n { renderRentAmount() }\r\n { renderRentIncreaseDate() }\r\n { renderMissedRentIncreaseDate() }\r\n
\r\n\r\n { renderRegularRentIncreaseBecomingPhase2Warning() }\r\n { renderLostSecondYearRentIncreaseWarning() }\r\n {calc_p2IsServiceTimeAvailable || isRentIncreaseAfterPhase2 ?\r\n <>\r\n { renderServiceDate() }\r\n { renderPhase1RIAmountWarning() }\r\n { renderPhase1AppliedEligibleAmountWarning() }\r\n { renderPhase1RemainingEligibleAmountError() }\r\n { renderPhase1MinimumServiceTimeError() }\r\n \r\n : null }\r\n \r\n Section 2: SUPPORTING INFORMATION\r\n Date of Residential Tenancy Branch decision: {formatter.toDateDisplay(decisionDate, { fullMonth: true })}*\r\n Eligible amount for this unit in the decision: {formatter.toAmountDisplay(decisionEligibleAmount)}*\r\n Rent amount for this unit prior to this rent increase: {formatter.toAmountDisplay(phase1RentAmountUsed) || '-'}*\r\n Date of previous rent increase for this unit: {phase1RentIncreaseDate ? formatter.toDateDisplay(phase1RentIncreaseDate, { fullMonth: true }) : 'Not applicable'}*\r\n Phase of this additional rent increase: Phase 2 of up to three (3) additional rent increases\r\n Earliest date allowed for phase 2 additional rent increase: {formatter.toDateDisplay(calc_p2EarliestRentIncreaseDate, { fullMonth: true })}\r\n Last month allowed for phase 2 additional rent increase to be imposed: {formatter.toDateDisplay(calc_p2MaxRentIncreaseDate, { fullMonth: true })}\r\n \r\n
\r\n );\r\n }\r\n\r\n return (\r\n \r\n Rent Increase Calculation:\r\n \r\n
\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default GeneratedNoticePhase2","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { bindActionCreators } from 'redux';\r\nimport { NavigateActions } from '../../redux/actions';\r\nimport { restartIcon, printIcon, readyCheckIcon, bcLogoPrint } from '../../assets/images';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { polyglot } from '../../assets/locales';\r\nimport { StepOne } from './StepOne';\r\nimport { StepTwo } from './StepTwo';\r\nimport { StepThree } from './StepThree';\r\nimport ROUTES from '../../constants/RouteConstants';\r\nimport { StepFour } from './StepFour';\r\nimport { GeneratedNoticePhase1 } from './GeneratedNotice';\r\n\r\nclass NoticeGenerator extends Component {\r\n state = {\r\n //step1 state\r\n stepOneData: {},\r\n stepTwoData: {},\r\n stepThreeData: {},\r\n\r\n stepOneSubmitted: false,\r\n stepTwoSubmitted: false,\r\n stepThreeSubmitted: false\r\n\r\n }\r\n\r\n componentDidMount() {\r\n if (this.props.location.pathname !== ROUTES.NOTICEGEN_STEP1) {\r\n this.props.navigate(ROUTES.NOTICEGEN_STEP1);\r\n }\r\n }\r\n\r\n setStepOneVars = (stepOneData) => {\r\n this.setState({ stepOneData });\r\n }\r\n\r\n setStepTwoVars = (stepTwoData) => {\r\n this.setState({ stepTwoData });\r\n }\r\n\r\n setStepThreeVars = (stepThreeData) => {\r\n this.setState({ stepThreeData });\r\n }\r\n\r\n setStepOneStatus = (stepCompleted) => {\r\n this.setState({ stepOneSubmitted: stepCompleted, stepTwoSubmitted: false, stepThreeSubmitted: false, stepTwoData: {}, stepThreeData: {} });\r\n };\r\n\r\n setStepTwoStatus = (stepCompleted) => {\r\n this.setState({ stepTwoSubmitted: stepCompleted, stepThreeSubmitted: false, stepThreeData: {} });\r\n }\r\n\r\n setStepThreeStatus = (stepCompleted) => {\r\n this.setState({ stepThreeSubmitted: stepCompleted });\r\n }\r\n\r\n resetForm = () => {\r\n window.location.reload(false);\r\n }\r\n\r\n generateNotice = () => {\r\n console.log('step1data: ', this.state.stepOneData);\r\n console.log('step2data: ', this.state.stepTwoData);\r\n console.log('step3data: ', this.state.stepThreeData);\r\n this.props.navigate(ROUTES.NOTICEGEN_STEP2);\r\n }\r\n\r\n print = () => {\r\n window.print();\r\n }\r\n\r\n editInformation = () => {\r\n this.props.navigate(ROUTES.NOTICEGEN_STEP1);\r\n }\r\n\r\n render() {\r\n const { location } = this.props;\r\n\r\n return (\r\n \r\n
\r\n\r\n Phase 2 Additional Rent Increase Calculation
\r\n\r\n Print or save as PDF to create a copy of the rent increase details below and attach it to a completed #RTB-53-P2 form. \r\n You must provide these forms with the additional rent increase decision. You can then use these documents to provide notice to the tenant(s) of an additional rent increase. The amount of the rent increase and the dates on which the notice of additional rent increase must be served below are based on \r\n the information that you entered in the previous step. If any of this information is incorrect, you can go back to the previous step and edit the information to correct it. You can learn more on our website.\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n Instructions\r\n \r\n #RTB-53P2D Additional Rent Increase\r\n Second Phase Rent Increase Detail\r\n
\r\n - \r\n
- This form must be served to the tenant(s) with a completed #RTB-53-P2 form on or before the latest service dates below \r\n
- \r\n If any of the bolded values with a * beside them are incorrect, this rent increase may not be valid and you should inform your landlord of the issue so they can correct the notice. If necessary, you can dispute the rent increase \r\n by filing an application with the Residential Tenancy Branch.\r\n \r\n
\r\n { location.pathname === ROUTES.NOTICEGEN_STEP1 ? this.renderSectionOne() : null }\r\n { location.pathname === ROUTES.NOTICEGEN_STEP2 ? this.renderSectionTwo() : null }\r\n
\r\n );\r\n }\r\n\r\n renderSectionOne() {\r\n const { stepOneSubmitted, stepTwoSubmitted, stepThreeSubmitted, stepOneData, stepTwoData, stepThreeData } = this.state;\r\n const { cpiConfig } = this.props;\r\n\r\n const hasFutureRIError = stepOneData.not1YearBetweenRentIncreases || stepOneData.not3MonthsForService;\r\n\r\n const renderGenerateNoticeButton = () => {\r\n if (!stepThreeData.isGeneratedNoticeAvailable || hasFutureRIError) return;\r\n return \r\n }\r\n\r\n const renderSectionOneCompletedButtons = () => {\r\n if ( ((stepOneSubmitted && stepTwoSubmitted) && (stepThreeSubmitted || !stepTwoData.calcCPIValue)) || hasFutureRIError) {\r\n return (\r\n <>\r\n \r\n Process Completed. {stepThreeData.isGeneratedNoticeAvailable ? 'If the above is information is correct you can use it to generate a rent increase notice insert.' : null}\r\n
\r\n { renderGenerateNoticeButton() }\r\n this.print()}>\r\n 
Print\r\n \r\n this.resetForm()}>\r\n 
Start Over\r\n \r\n
\r\n \r\n );\r\n }\r\n\r\n return;\r\n }\r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n Phase 1 Additional Rent Increase Calculator
\r\nPhase 1 Additional Rent Increase Calculation
\r\n \r\n {polyglot.t('noticeGenerator.sectionOne.descriptionWarning')}\r\n\n * I'm a fade Transition!\n *
\n * )}\n * \n * \n * {state => (\n * // ...\n * )}\n * \n * \n *
\n * );\n * }\n * ```\n *\n * When the button is clicked the component will shift to the `'entering'` state\n * and stay there for 500ms (the value of `timeout`) before it finally switches\n * to `'entered'`.\n *\n * When `in` is `false` the same thing happens except the state moves from\n * `'exiting'` to `'exited'`.\n */\n\nvar Transition = /*#__PURE__*/function (_React$Component) {\n _inheritsLoose(Transition, _React$Component);\n\n function Transition(props, context) {\n var _this;\n\n _this = _React$Component.call(this, props, context) || this;\n var parentGroup = context; // In the context of a TransitionGroup all enters are really appears\n\n var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;\n var initialStatus;\n _this.appearStatus = null;\n\n if (props.in) {\n if (appear) {\n initialStatus = EXITED;\n _this.appearStatus = ENTERING;\n } else {\n initialStatus = ENTERED;\n }\n } else {\n if (props.unmountOnExit || props.mountOnEnter) {\n initialStatus = UNMOUNTED;\n } else {\n initialStatus = EXITED;\n }\n }\n\n _this.state = {\n status: initialStatus\n };\n _this.nextCallback = null;\n return _this;\n }\n\n Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {\n var nextIn = _ref.in;\n\n if (nextIn && prevState.status === UNMOUNTED) {\n return {\n status: EXITED\n };\n }\n\n return null;\n } // getSnapshotBeforeUpdate(prevProps) {\n // let nextStatus = null\n // if (prevProps !== this.props) {\n // const { status } = this.state\n // if (this.props.in) {\n // if (status !== ENTERING && status !== ENTERED) {\n // nextStatus = ENTERING\n // }\n // } else {\n // if (status === ENTERING || status === ENTERED) {\n // nextStatus = EXITING\n // }\n // }\n // }\n // return { nextStatus }\n // }\n ;\n\n var _proto = Transition.prototype;\n\n _proto.componentDidMount = function componentDidMount() {\n this.updateStatus(true, this.appearStatus);\n };\n\n _proto.componentDidUpdate = function componentDidUpdate(prevProps) {\n var nextStatus = null;\n\n if (prevProps !== this.props) {\n var status = this.state.status;\n\n if (this.props.in) {\n if (status !== ENTERING && status !== ENTERED) {\n nextStatus = ENTERING;\n }\n } else {\n if (status === ENTERING || status === ENTERED) {\n nextStatus = EXITING;\n }\n }\n }\n\n this.updateStatus(false, nextStatus);\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n this.cancelNextCallback();\n };\n\n _proto.getTimeouts = function getTimeouts() {\n var timeout = this.props.timeout;\n var exit, enter, appear;\n exit = enter = appear = timeout;\n\n if (timeout != null && typeof timeout !== 'number') {\n exit = timeout.exit;\n enter = timeout.enter; // TODO: remove fallback for next major\n\n appear = timeout.appear !== undefined ? timeout.appear : enter;\n }\n\n return {\n exit: exit,\n enter: enter,\n appear: appear\n };\n };\n\n _proto.updateStatus = function updateStatus(mounting, nextStatus) {\n if (mounting === void 0) {\n mounting = false;\n }\n\n if (nextStatus !== null) {\n // nextStatus will always be ENTERING or EXITING.\n this.cancelNextCallback();\n\n if (nextStatus === ENTERING) {\n if (this.props.unmountOnExit || this.props.mountOnEnter) {\n var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749\n // With unmountOnExit or mountOnEnter, the enter animation should happen at the transition between `exited` and `entering`.\n // To make the animation happen, we have to separate each rendering and avoid being processed as batched.\n\n if (node) forceReflow(node);\n }\n\n this.performEnter(mounting);\n } else {\n this.performExit();\n }\n } else if (this.props.unmountOnExit && this.state.status === EXITED) {\n this.setState({\n status: UNMOUNTED\n });\n }\n };\n\n _proto.performEnter = function performEnter(mounting) {\n var _this2 = this;\n\n var enter = this.props.enter;\n var appearing = this.context ? this.context.isMounting : mounting;\n\n var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM.findDOMNode(this), appearing],\n maybeNode = _ref2[0],\n maybeAppearing = _ref2[1];\n\n var timeouts = this.getTimeouts();\n var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED\n // if we are mounting and running this it means appear _must_ be set\n\n if (!mounting && !enter || config.disabled) {\n this.safeSetState({\n status: ENTERED\n }, function () {\n _this2.props.onEntered(maybeNode);\n });\n return;\n }\n\n this.props.onEnter(maybeNode, maybeAppearing);\n this.safeSetState({\n status: ENTERING\n }, function () {\n _this2.props.onEntering(maybeNode, maybeAppearing);\n\n _this2.onTransitionEnd(enterTimeout, function () {\n _this2.safeSetState({\n status: ENTERED\n }, function () {\n _this2.props.onEntered(maybeNode, maybeAppearing);\n });\n });\n });\n };\n\n _proto.performExit = function performExit() {\n var _this3 = this;\n\n var exit = this.props.exit;\n var timeouts = this.getTimeouts();\n var maybeNode = this.props.nodeRef ? undefined : ReactDOM.findDOMNode(this); // no exit animation skip right to EXITED\n\n if (!exit || config.disabled) {\n this.safeSetState({\n status: EXITED\n }, function () {\n _this3.props.onExited(maybeNode);\n });\n return;\n }\n\n this.props.onExit(maybeNode);\n this.safeSetState({\n status: EXITING\n }, function () {\n _this3.props.onExiting(maybeNode);\n\n _this3.onTransitionEnd(timeouts.exit, function () {\n _this3.safeSetState({\n status: EXITED\n }, function () {\n _this3.props.onExited(maybeNode);\n });\n });\n });\n };\n\n _proto.cancelNextCallback = function cancelNextCallback() {\n if (this.nextCallback !== null) {\n this.nextCallback.cancel();\n this.nextCallback = null;\n }\n };\n\n _proto.safeSetState = function safeSetState(nextState, callback) {\n // This shouldn't be necessary, but there are weird race conditions with\n // setState callbacks and unmounting in testing, so always make sure that\n // we can cancel any pending setState callbacks after we unmount.\n callback = this.setNextCallback(callback);\n this.setState(nextState, callback);\n };\n\n _proto.setNextCallback = function setNextCallback(callback) {\n var _this4 = this;\n\n var active = true;\n\n this.nextCallback = function (event) {\n if (active) {\n active = false;\n _this4.nextCallback = null;\n callback(event);\n }\n };\n\n this.nextCallback.cancel = function () {\n active = false;\n };\n\n return this.nextCallback;\n };\n\n _proto.onTransitionEnd = function onTransitionEnd(timeout, handler) {\n this.setNextCallback(handler);\n var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);\n var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;\n\n if (!node || doesNotHaveTimeoutOrListener) {\n setTimeout(this.nextCallback, 0);\n return;\n }\n\n if (this.props.addEndListener) {\n var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback],\n maybeNode = _ref3[0],\n maybeNextCallback = _ref3[1];\n\n this.props.addEndListener(maybeNode, maybeNextCallback);\n }\n\n if (timeout != null) {\n setTimeout(this.nextCallback, timeout);\n }\n };\n\n _proto.render = function render() {\n var status = this.state.status;\n\n if (status === UNMOUNTED) {\n return null;\n }\n\n var _this$props = this.props,\n children = _this$props.children,\n _in = _this$props.in,\n _mountOnEnter = _this$props.mountOnEnter,\n _unmountOnExit = _this$props.unmountOnExit,\n _appear = _this$props.appear,\n _enter = _this$props.enter,\n _exit = _this$props.exit,\n _timeout = _this$props.timeout,\n _addEndListener = _this$props.addEndListener,\n _onEnter = _this$props.onEnter,\n _onEntering = _this$props.onEntering,\n _onEntered = _this$props.onEntered,\n _onExit = _this$props.onExit,\n _onExiting = _this$props.onExiting,\n _onExited = _this$props.onExited,\n _nodeRef = _this$props.nodeRef,\n childProps = _objectWithoutPropertiesLoose(_this$props, [\"children\", \"in\", \"mountOnEnter\", \"unmountOnExit\", \"appear\", \"enter\", \"exit\", \"timeout\", \"addEndListener\", \"onEnter\", \"onEntering\", \"onEntered\", \"onExit\", \"onExiting\", \"onExited\", \"nodeRef\"]);\n\n return (\n /*#__PURE__*/\n // allows for nested Transitions\n React.createElement(TransitionGroupContext.Provider, {\n value: null\n }, typeof children === 'function' ? children(status, childProps) : React.cloneElement(React.Children.only(children), childProps))\n );\n };\n\n return Transition;\n}(React.Component);\n\nTransition.contextType = TransitionGroupContext;\nTransition.propTypes = process.env.NODE_ENV !== \"production\" ? {\n /**\n * A React reference to DOM element that need to transition:\n * https://stackoverflow.com/a/51127130/4671932\n *\n * - When `nodeRef` prop is used, `node` is not passed to callback functions\n * (e.g. `onEnter`) because user already has direct access to the node.\n * - When changing `key` prop of `Transition` in a `TransitionGroup` a new\n * `nodeRef` need to be provided to `Transition` with changed `key` prop\n * (see\n * [test/CSSTransition-test.js](https://github.com/reactjs/react-transition-group/blob/13435f897b3ab71f6e19d724f145596f5910581c/test/CSSTransition-test.js#L362-L437)).\n */\n nodeRef: PropTypes.shape({\n current: typeof Element === 'undefined' ? PropTypes.any : function (propValue, key, componentName, location, propFullName, secret) {\n var value = propValue[key];\n return PropTypes.instanceOf(value && 'ownerDocument' in value ? value.ownerDocument.defaultView.Element : Element)(propValue, key, componentName, location, propFullName, secret);\n }\n }),\n\n /**\n * A `function` child can be used instead of a React element. This function is\n * called with the current transition status (`'entering'`, `'entered'`,\n * `'exiting'`, `'exited'`), which can be used to apply context\n * specific props to a component.\n *\n * ```jsx\n * \r\n
\r\n );\r\n};\r\n\r\nconst mapStateToProps = (state) => ({\r\n pathname: state.router.location.pathname,\r\n hash: state.router.location.hash,\r\n});\r\n\r\nexport default connect(mapStateToProps)(Header);\r\n","import Header from './Header';\r\nimport './Header.scss';\r\n\r\nexport default Header;\r\n","import Improvement from './Improvement';\r\nimport './Improvement.scss';\r\n\r\nexport default Improvement;","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport FormControl from 'react-bootstrap/FormControl';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { deleteIcon, errorIcon } from '../../../../assets/images';\r\nimport { polyglot } from '../../../../assets/locales';\r\nimport { formatter } from '../../../../utility';\r\nimport { CPIConstants, NormalizationConstants } from '../../../../constants';\r\nimport { InputBase } from '../../../Helper/InputBase';\r\nimport validate from '../../../../utility/validate';\r\n\r\nclass Improvement extends Component {\r\n constructor(props) {\r\n super();\r\n\r\n this.state = {\r\n title: '',\r\n cost: '',\r\n units: '',\r\n calculatedAmount: '',\r\n submitDisabled: false,\r\n checked: false,\r\n buttonText: 'Submit',\r\n errors: {},\r\n };\r\n }\r\n\r\n //set state to props if props are available (e.g going from page 2 -> page 1)\r\n componentDidMount() {\r\n const { improvement } = this.props;\r\n if (improvement) {\r\n this.setState({\r\n title: improvement.title,\r\n cost: improvement.cost,\r\n units: improvement.units,\r\n calculatedAmount: improvement.calculatedAmount,\r\n submitDisabled: improvement.submitDisabled ? improvement.submitDisabled : false,\r\n checked: improvement.checked ? improvement.checked : false,\r\n });\r\n }\r\n }\r\n\r\n //change handler. If cost > maxUpgradeSpent or units > maxUnits, input will not be accepted.\r\n handleChange = (event) => {\r\n const { name, value } = event.target;\r\n this.setState({\r\n [name]: value,\r\n errors: { ...this.state.errors, [name]: '' },\r\n });\r\n if (this.state.submitDisabled)\r\n this.setState({\r\n submitDisabled: false,\r\n buttonText: 'Update',\r\n calculatedAmount: '',\r\n });\r\n };\r\n\r\n /*\r\n * Checks for errors once user clicks submit, and calculates the eligibleAmount.\r\n * submit() is also called on each improvement once \"Continue\" button is pressed.\r\n * calls Step1 updateImprovements function with improvement object.\r\n */\r\n submit = (e) => {\r\n const { title, cost, units, submitDisabled, buttonText, checked } = this.state;\r\n const { updateImprovement, id, continueClicked } = this.props;\r\n let calculatedAmount = '',\r\n submit = false;\r\n\r\n const validationArray = [\r\n {\r\n title: title,\r\n validationRules: [\r\n { minLength: 2, errorMsg: polyglot.t('errors.title.length') },\r\n { isRequired: true, errorMsg: polyglot.t('errors.title.empty') },\r\n ],\r\n },\r\n {\r\n cost: cost,\r\n validationRules: [\r\n { minValue: 1, errorMsg: polyglot.t('errors.cost.length') },\r\n { isRequired: true, errorMsg: polyglot.t('errors.cost.empty') },\r\n ],\r\n },\r\n {\r\n units: units,\r\n validationRules: [\r\n { minValue: 1, errorMsg: polyglot.t('errors.units.length') },\r\n { isRequired: true, errorMsg: polyglot.t('errors.units.empty') },\r\n ],\r\n },\r\n ];\r\n\r\n let err = validate(validationArray);\r\n\r\n if (continueClicked && !submitDisabled)\r\n err = {\r\n ...err,\r\n submit: `Press ${buttonText.toLocaleLowerCase()} to calculate`,\r\n };\r\n if (err.title || err.cost || err.units || err.submit) {\r\n this.setState({ errors: err });\r\n } else {\r\n submit = true;\r\n calculatedAmount = cost / CPIConstants.eligibleAmountDivider / units;\r\n this.setState({ submitDisabled: true, calculatedAmount, errors: err });\r\n }\r\n\r\n const updateObject = {\r\n id,\r\n title,\r\n cost,\r\n units,\r\n calculatedAmount,\r\n errors: err,\r\n submitDisabled: submit,\r\n checked,\r\n };\r\n\r\n updateImprovement(id, updateObject);\r\n };\r\n\r\n //check to see if continue button has been clicked in parent component\r\n componentDidUpdate(prevProps) {\r\n if (this.props.continueClicked && !prevProps.continueClicked) {\r\n this.submit();\r\n }\r\n }\r\n\r\n render() {\r\n const { title, cost, units, calculatedAmount, submitDisabled, buttonText, errors } = this.state;\r\n const { index, id, length, deleteImprovement } = this.props;\r\n\r\n return (\r\n \r\n \r\n 
\r\n \r\n
\r\n \r\n \r\n {polyglot.t('header.headerText')}\r\n \r\n
\r\n \r\n 
\r\n
\r\n \r\n \r\n {getSubHeaderText(currentPath)}\r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default Improvement;\r\n\r\nImprovement.propTypes = {\r\n index: PropTypes.number.isRequired,\r\n id: PropTypes.number.isRequired,\r\n improvement: PropTypes.object.isRequired,\r\n deleteImprovement: PropTypes.func.isRequired,\r\n updateImprovement: PropTypes.func.isRequired,\r\n continueClicked: PropTypes.bool.isRequired,\r\n};","import React, { Component } from 'react';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { addIcon, nextIcon } from '../../../assets/images';\r\nimport { polyglot } from '../../../assets/locales';\r\nimport Improvement from './Improvement';\r\nimport ROUTES from '../../../constants/RouteConstants';\r\n\r\nclass Step1 extends Component {\r\n //adds new improvement to end of array.\r\n appendImprovement = () => {\r\n this.props.appendImprovement();\r\n };\r\n\r\n //updates continueClicked field in redux store.\r\n submitStep1 = () => {\r\n this.props.submitStep1(true);\r\n };\r\n\r\n /*\r\n * Checks for errors on all \r\n \r\n Capital Expenditure {index < 9 ? '0' : ''}\r\n {index + 1}\r\n \r\n {length > 1 ? ![]()
deleteImprovement(id)} src={deleteIcon} alt=\"\" /> : null}\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n <>\r\n
\r\n );\r\n }\r\n}\r\nexport default Step1;","import Step1 from './Step1';\r\nimport './Step1.scss';\r\n\r\nexport default Step1;","import React from 'react';\r\nimport { polyglot } from '../../../assets/locales';\r\nimport { CalculationUtils, formatter } from '../../../utility';\r\n\r\n/**\r\n * @returns {html} - Generates breakdown for each year. Uses modifier variable to attach italics for year 2 and 3.\r\n */\r\nconst YEAR_ONE = 1;\r\nconst YEAR_TWO = 2;\r\nconst YEAR_THREE = 3;\r\n\r\nconst generateCalculation = (cpi, year, item1, item2, item3, item4, item5, style) => {\r\n const modifier = !!style ? '-' + style : '';\r\n let remainingAmountText = '';\r\n if (year === YEAR_ONE) remainingAmountText = polyglot.t('step2.increaseBreakdown.remainingAmount1');\r\n if (year === YEAR_TWO) remainingAmountText = polyglot.t('step2.increaseBreakdown.remainingAmount2');\r\n if (year === YEAR_THREE) remainingAmountText = polyglot.t('step2.increaseBreakdown.remainingAmount3');\r\n\r\n const increaseAmount = () => {\r\n if (year === YEAR_ONE) {\r\n return <>{polyglot.t('step2.increaseBreakdown.increaseAmount')} {cpi.year} ({`${cpi.value.toFixed(1)}%, see rates`} here);\r\n } else {\r\n return <>{polyglot.t('step2.increaseBreakdown.increaseAmountFutureYears', { year: cpi.year, percentage: cpi.value.toFixed(1) })};\r\n }\r\n }\r\n return (\r\n <>\r\n {polyglot.t('header.bodyHeader')}
\r\n {polyglot.t('header.disclaimer')}
\r\n {polyglot.t('step1.subText')}
\r\n {/* prettier-ignore*/}\r\n \r\n \r\n
\r\n \r\n\r\n {improvements.map((improvement, index) => (\r\n \r\n 
\r\n {polyglot.t('step1.addImprovement')}\r\n
\r\n \r\n \r\n {formatter.toAmountDisplay(item1)}\r\n \r\n {increaseAmount()}\r\n \r\n
\r\n \r\n {formatter.toAmountDisplay(item2)}\r\n {polyglot.t('step2.increaseBreakdown.rentWithIncrease')}\r\n
\r\n \r\n {formatter.toAmountDisplay(item3)}\r\n {polyglot.t('step2.increaseBreakdown.additionalIncrease')}\r\n
\r\n \r\n {formatter.toAmountDisplay(item4)}\r\n {polyglot.t('step2.increaseBreakdown.rentWithMaxIncrease')}\r\n
\r\n \r\n {formatter.toAmountDisplay(item5)}\r\n {`${remainingAmountText}`}\r\n
\r\n \r\n );\r\n};\r\n\r\nconst FullRentIncreaseBreakdown = (props) => {\r\n const { cpi, rent, eligibleAmount } = props;\r\n const cpiPercent = Number((cpi.value / 100).toFixed(3));\r\n\r\n /* YEAR ONE CALCULATIONS */\r\n const Y1A = CalculationUtils.rentIncreaseAmount(rent, cpiPercent);\r\n const Y1B = CalculationUtils.rentWithIncrease(rent, Y1A);\r\n const Y1C = CalculationUtils.maxAdditionalIncrease(Y1B, eligibleAmount);\r\n const Y1D = CalculationUtils.rentWithAllIncreases(Y1B, Y1C);\r\n const Y1F = CalculationUtils.remainingAmount(eligibleAmount, Y1C);\r\n /* YEAR TWO CALCULATIONS */\r\n const Y2A = CalculationUtils.rentIncreaseAmount(Y1D, cpiPercent);\r\n const Y2B = CalculationUtils.rentWithIncrease(Y1D, Y2A);\r\n const Y2C = CalculationUtils.maxAdditionalIncrease(Y2B, Y1F);\r\n const Y2D = CalculationUtils.rentWithAllIncreases(Y2B, Y2C);\r\n const Y2F = CalculationUtils.remainingAmount(Y1F, Y2C);\r\n /* YEAR THREE CALCULATIONS */\r\n const Y3A = CalculationUtils.rentIncreaseAmount(Y2D, cpiPercent);\r\n const Y3B = CalculationUtils.rentWithIncrease(Y2D, Y3A);\r\n const Y3C = CalculationUtils.maxAdditionalIncrease(Y3B, Y2F);\r\n const Y3D = CalculationUtils.rentWithAllIncreases(Y3B, Y3C);\r\n const Y3F = CalculationUtils.remainingAmount(Y2F, Y3C);\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default FullRentIncreaseBreakdown;","import React, { Component } from 'react';\r\nimport { polyglot } from '../../../assets/locales';\r\nimport { CalculationUtils, formatter } from '../../../utility';\r\n\r\nclass SingleRentIncreaseBreakdown extends Component {\r\n /**\r\n * @returns {html} - Generates breakdown for each year. Uses modifier variable to attach italics for year 2 and 3.\r\n */\r\n generateCalculation = (cpiPercent, year, calcYear, rent, eligibleAmount, item1, item2, item3, item4, item5) => {\r\n let remainingAmountText = polyglot.t('webtool3.remainingAmount');\r\n\r\n if (calcYear === 3) remainingAmountText = polyglot.t('step2.increaseBreakdown.remainingAmount3');\r\n\r\n return (\r\n <>\r\n {calcYear >= 2 ? (\r\n \r\n {polyglot.t('step2.increaseBreakdown.yearOne')}\r\n {cpi.year})\r\n
\r\n {generateCalculation(cpi, YEAR_ONE, Y1A, Y1B, Y1C, Y1D, Y1F)}\r\n\r\n {polyglot.t('step2.increaseBreakdown.yearTwo', { year: cpi.year + YEAR_ONE })}
\r\n {generateCalculation(cpi, YEAR_TWO, Y2A, Y2B, Y2C, Y2D, Y2F, 'italic')}\r\n\r\n {polyglot.t('step2.increaseBreakdown.yearThree', { year: cpi.year + YEAR_TWO })}
\r\n {generateCalculation(cpi, YEAR_THREE, Y3A, Y3B, Y3C, Y3D, Y3F, 'italic')}\r\n \r\n {formatter.toAmountDisplay(eligibleAmount)}\r\n {polyglot.t('webtool3.previousRemainingAmount')}\r\n
\r\n ) : null}\r\n \r\n {formatter.toAmountDisplay(rent)}\r\n {polyglot.t('webtool3.currentRent')}\r\n
\r\n \r\n {formatter.toAmountDisplay(item1)}\r\n \r\n {polyglot.t('step2.increaseBreakdown.increaseAmount')} ({cpiPercent.toFixed(1)}%)\r\n \r\n
\r\n \r\n {formatter.toAmountDisplay(item2)}\r\n \r\n {polyglot.t('webtool2.eligibleAmount')}\r\n \r\n {polyglot.t('webtool2.eligibleAmountUrlText')}\r\n \r\n \r\n
\r\n \r\n {formatter.toAmountDisplay(item3)}\r\n {polyglot.t('step2.increaseBreakdown.additionalIncrease')}\r\n
\r\n \r\n {formatter.toAmountDisplay(item4)}\r\n {polyglot.t('webtool3.maximumApplied', { year: year })}\r\n
\r\n \r\n {formatter.toAmountDisplay(item5)}\r\n {remainingAmountText}\r\n
\r\n \r\n );\r\n };\r\n\r\n shouldComponentUpdate(nextProps) {\r\n if (this.props.rent !== nextProps.rent) {\r\n return true;\r\n }\r\n\r\n return false;\r\n }\r\n\r\n render() {\r\n const { cpi, rent, eligibleAmount, calcYear, displayYear, setFullRentAmount } = this.props;\r\n const year = typeof displayYear === 'string' ? displayYear : displayYear.getFullYear();\r\n const cpiPercent = Number((cpi.value / 100).toFixed(3));\r\n\r\n /* Calculations */\r\n const YA = CalculationUtils.rentIncreaseAmount(rent, cpiPercent);\r\n const YB = CalculationUtils.rentWithIncrease(rent, YA);\r\n const YC = CalculationUtils.maxAdditionalIncrease(YB, eligibleAmount);\r\n const YD = CalculationUtils.rentWithAllIncreases(YB, YC);\r\n const YF = CalculationUtils.remainingAmount(eligibleAmount, YC);\r\n\r\n const yearBreakdown = this.generateCalculation(cpi.value, year, calcYear, rent, eligibleAmount, YA, YB, YC, YD, YF);\r\n setFullRentAmount(YD);\r\n\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default SingleRentIncreaseBreakdown;\r\n","import React, { Component } from 'react';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { backIcon, checkbox, checkboxSelected, calculateIcon, printIcon, restartIcon, errorIcon } from '../../../assets/images';\r\nimport { polyglot } from '../../../assets/locales';\r\nimport { formatter, CalculationUtils } from '../../../utility';\r\nimport { NormalizationConstants } from '../../../constants';\r\nimport { FullRentIncreaseBreakdown } from '../../Helper/RentIncreaseBreakdowns';\r\nimport validate from '../../../utility/validate';\r\nimport { InputBase } from '../../Helper/InputBase';\r\nimport ROUTES from '../../../constants/RouteConstants';\r\nimport moment from 'moment';\r\n\r\nclass Step2 extends Component {\r\n state = {\r\n rent: '',\r\n cpi: '',\r\n totalAmount: 0,\r\n calculateDisabled: false,\r\n errors: {},\r\n };\r\n\r\n //get cpi values from cpi JSON config\r\n calculateTargetYearCPI = () => {\r\n const { cpiConfig } = this.props;\r\n let cpi = '';\r\n\r\n try {\r\n cpi = CalculationUtils.getCpiForYear(cpiConfig, cpiConfig.target_year);\r\n } catch {\r\n cpi = '0';\r\n }\r\n\r\n this.setState({ cpi: cpi });\r\n };\r\n\r\n /**\r\n * Activated once user clicks on \"calculate\" button. If no errors exist, it will see which improvements have been checked,\r\n * calculate total eligible amount, and displays the increase breakdown\r\n */\r\n calculateEligibleAmount = () => {\r\n const { rent } = this.state;\r\n const { improvements } = this.props;\r\n\r\n const totalAmount = improvements.reduce((total, improvement) => {\r\n if (improvement.checked) return Number(total.toFixed(2)) + Number(improvement.calculatedAmount.toFixed(2));\r\n return total;\r\n }, 0);\r\n\r\n const validationArray = [\r\n {\r\n rent: rent,\r\n validationRules: [\r\n { minValue: 1, errorMsg: polyglot.t('errors.rent.length') },\r\n { isRequired: true, errorMsg: polyglot.t('errors.rent.empty') },\r\n ],\r\n },\r\n ];\r\n\r\n let err = validate(validationArray);\r\n\r\n if (improvements.every((improvement) => !improvement.checked)) err = { ...err, select: polyglot.t('errors.improvement.empty') };\r\n if (err.rent || err.select) {\r\n this.setState({ errors: err });\r\n } else {\r\n this.setState({ totalAmount, calculateDisabled: true, errors: err });\r\n }\r\n };\r\n\r\n //sets rent state to input value. If rent > maxRent, input will not be accepted.\r\n setRent = (event) => {\r\n const { value } = event.target;\r\n this.setState({ rent: value, calculateDisabled: false, errors: { ...this.state.errors, rent: '' } });\r\n };\r\n\r\n /**\r\n * updates checked property to true or false in improvements redux store\r\n * @param {Number} id - improvement id\r\n */\r\n toggleCheckbox = (id) => {\r\n const { improvements, updateImprovement } = this.props;\r\n const updateIndex = improvements.findIndex((improvement) => improvement.id === id);\r\n const updateObject = { ...improvements[updateIndex], checked: !improvements[updateIndex].checked };\r\n\r\n updateImprovement(updateObject.id, updateObject);\r\n this.setState({ calculateDisabled: false, totalAmount: 0, errors: { ...this.state.errors, select: '' } });\r\n };\r\n\r\n /**\r\n * Non selected items will not show up in the total, or the page print\r\n * @returns {html} renders improvement select checkboxes\r\n */\r\n renderImprovementSelect = () => {\r\n const { improvements } = this.props;\r\n\r\n return improvements.map((improvement) => {\r\n return (\r\n \r\n {year} Rent Increase Calculation
\r\n {yearBreakdown}\r\n {polyglot.t('step2.improvementCostSingle', { cost: formatter.toAmountDisplay(improvements[0].calculatedAmount) })}
;\r\n }\r\n\r\n const eligibleAmountSum = improvements.reduce((total, improvement) => {\r\n return Number(total) + Number(improvement.calculatedAmount);\r\n }, 0);\r\n const minEligibleAmount = improvements.reduce((min, el) => (Number(el.calculatedAmount) < min ? Number(el.calculatedAmount) : min), improvements[0].calculatedAmount);\r\n\r\n return (\r\n\r\n {polyglot.t('step2.improvementCostMulti', {\r\n lowestCost: formatter.toAmountDisplay(minEligibleAmount),\r\n allCosts: formatter.toAmountDisplay(eligibleAmountSum),\r\n })}\r\n
\r\n );\r\n };\r\n\r\n goToStep1 = () => {\r\n const { navigate, goToStep1 } = this.props;\r\n goToStep1();\r\n navigate(ROUTES.EXPLORER_STEP1);\r\n };\r\n\r\n componentDidMount() {\r\n this.calculateTargetYearCPI();\r\n }\r\n\r\n render() {\r\n const { rent, errors, cpi, calculateDisabled, totalAmount } = this.state;\r\n const { reset } = this.props;\r\n const cpiPercent = cpi.value ? cpi.value.toFixed(1) : '0.0';\r\n const rentLabel = polyglot.t(calculateDisabled ? 'step2.unitRentEntered' : 'step2.unitRent');\r\n return (\r\n\r\n {/* HEADER + DESCRIPTION */}\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default Step2;","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { bindActionCreators } from 'redux';\r\nimport { ImprovementActions, NavigateActions } from '../../redux/actions';\r\n\r\nimport Step1 from './Step1';\r\nimport { Step2 } from './Step2';\r\nimport ROUTES from '../../constants/RouteConstants';\r\n\r\nclass WebToolOne extends Component {\r\n\r\n componentDidUpdate(prevProps) {\r\n if (this.props.location.pathname === ROUTES.EXPLORER && prevProps.location.pathname === ROUTES.EXPLORER_STEP1) {\r\n this.props.navigate(ROUTES.BASE);\r\n }\r\n }\r\n\r\n render() {\r\n const { cpiConfig, navigate, improvements, reset, appendImprovement, deleteImprovement, updateImprovement, goToStep2, location, currentStep, goToStep1, submitStep1, continueState } = this.props;\r\n const path = location.pathname.concat(location.hash);\r\n\r\n if (path === ROUTES.EXPLORER1) {\r\n return (\r\n {polyglot.t('header.bodyHeader')}
\r\n {polyglot.t('header.disclaimer')}
\r\n {polyglot.t('step2.subText')}
\r\n \r\n
\r\n {/* prettier-ignore*/}\r\n {polyglot.t('step2.print.branch')}
\r\n {polyglot.t('step2.print.date', { date: formatter.toDateDisplay(moment()) })}
\r\n \r\n
\r\n {/* INPUTS */}\r\n \r\n {polyglot.t('step2.description1')} {polyglot.t('step2.website')}.\r\n
\r\n {this.generateDescription()}\r\n\r\n {polyglot.t('step2.additionalInfo.text')}\r\n {polyglot.t('step2.additionalInfo.urlText')}.\r\n
\r\n\r\n
\r\n {/* IMPROVEMENT SELECT */}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n ${rent}\r\n \r\n {rentLabel}\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {cpi.value}%\r\n \r\n {polyglot.t('step2.cpiValue')}\r\n
\r\n \r\n
\r\n \r\n {/* TOTAL ELIGIBLE AMOUNT */}\r\n \r\n \r\n {polyglot.t('step2.improvementSelect')} \r\n \r\n 
{polyglot.t('step2.editImprovements')}\r\n \r\n \r\n
\r\n {this.renderImprovementSelect()}
\r\n \r\n \r\n
\r\n {/* BUTTONS */}\r\n \r\n \r\n {formatter.toAmountDisplay(totalAmount)}\r\n \r\n {polyglot.t('step2.eligibleAmount')}\r\n
\r\n \r\n \r\n {calculateDisabled ? (\r\n
\r\n {calculateDisabled ? \r\n \r\n \r\n
\r\n ) : null}\r\n \r\n \r\n \r\n
\r\n
\r\n );\r\n}\r\n\r\nexport default Error404;","import arrayWithHoles from \"./arrayWithHoles.js\";\nimport iterableToArrayLimit from \"./iterableToArrayLimit.js\";\nimport unsupportedIterableToArray from \"./unsupportedIterableToArray.js\";\nimport nonIterableRest from \"./nonIterableRest.js\";\nexport default function _slicedToArray(arr, i) {\n return arrayWithHoles(arr) || iterableToArrayLimit(arr, i) || unsupportedIterableToArray(arr, i) || nonIterableRest();\n}","export default function _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}","export default function _iterableToArrayLimit(arr, i) {\n var _i = null == arr ? null : \"undefined\" != typeof Symbol && arr[Symbol.iterator] || arr[\"@@iterator\"];\n if (null != _i) {\n var _s,\n _e,\n _x,\n _r,\n _arr = [],\n _n = !0,\n _d = !1;\n try {\n if (_x = (_i = _i.call(arr)).next, 0 === i) {\n if (Object(_i) !== _i) return;\n _n = !1;\n } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);\n } catch (err) {\n _d = !0, _e = err;\n } finally {\n try {\n if (!_n && null != _i[\"return\"] && (_r = _i[\"return\"](), Object(_r) !== _r)) return;\n } finally {\n if (_d) throw _e;\n }\n }\n return _arr;\n }\n}","export default function _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}","\r\nimport React, { useState, useEffect } from 'react';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { CalculationUtils, validate, formatter } from '../../utility';\r\nimport { RentalAddress } from '../NoticeGenerator/StepOne/RentalAddress';\r\nimport { calculateIcon, restartIcon } from '../../assets/images';\r\nimport { InputBase, CustomDateInput } from '../Helper/InputBase';\r\nimport { NormalizationConstants, AppConstants } from '../../constants';\r\nimport GeneralUtils from '../../utility/GeneralUtils';\r\nimport appConfig from '../../config/app_config';\r\nimport moment from 'moment';\r\n\r\nconst MAX_PORTION_PERCENTAGE = 0.03;\r\n\r\nconst RentIncreaseInformation = (props) => {\r\n const { disabled, minDecisionDate, setIsSubmitted, setValidationData, cpiConfig, validationData } = props;\r\n\r\n const [address, setStreetAddress] = useState({\r\n streetAddress: '',\r\n city: '',\r\n postalCode: '',\r\n errors: {}\r\n });\r\n\r\n const [decisionData, setDecisionData] = useState({\r\n decisionDate: '',\r\n decisionEligibleAmount: '',\r\n userAccessDate: moment().toDate(),\r\n phase1RentIncreaseDate: '',\r\n priorRentAmount: '',\r\n appliedPhase1EligibleAmount: '',\r\n phase1RentAmount: '',\r\n remainingPhase1EligibleAmount: '',\r\n errors: {}\r\n });\r\n\r\n useEffect(() => {\r\n if (JSON.stringify(validationData) === '{}') return;\r\n setStreetAddress(validationData)\r\n setDecisionData(validationData)\r\n },[validationData])\r\n\r\nconst addressChangeHandler = e => {\r\n const { name, value } = e.target;\r\n if (address?.[name] === undefined) return;\r\n setStreetAddress({...address, [name]: value, errors: { ...address?.errors, [name]: '' }})\r\n}\r\n\r\nconst decisionDataChangeHandler = e => {\r\n const { name, value } = e.target;\r\n if (decisionData?.[name] === undefined) return;\r\n setDecisionData({...decisionData, [name]: value, errors: { }})\r\n}\r\n\r\nconst handleDateChange = (value, event) => {\r\n const { name } = event;\r\n setDecisionData({...decisionData, [name]: value, errors: { ...decisionData?.errors, [name]: '' }})\r\n}\r\n\r\nconst setData = () => {\r\n const { streetAddress, city, postalCode } = address;\r\n const { decisionDate, decisionEligibleAmount, userAccessDate, phase1RentIncreaseDate, priorRentAmount, appliedPhase1EligibleAmount, phase1RentAmount, remainingPhase1EligibleAmount } = decisionData;\r\n \r\n const calcCPIValue = CalculationUtils.getCpiForYear(cpiConfig, moment(phase1RentIncreaseDate).year());\r\n const logCalcCPI = calcCPIValue ? `year: ${calcCPIValue.year}, value: ${calcCPIValue.value}` : null;\r\n const p2ToolUsedFor = AppConstants.VALIDATION_PHASE_ONE;\r\n const calc_p1EarliestServiceDate = moment(decisionDate).startOf('month').add(4, 'months');\r\n const calc_p1CPIYear = moment(phase1RentIncreaseDate).year();\r\n const calc_p1CPIValue = (calcCPIValue?.value / 100).toFixed(3);\r\n const calc_p1MaxCPIAmountStandardRentIncrease = formatter.toFixedNumber(Number(priorRentAmount) * Number(calc_p1CPIValue), 3);\r\n const calc_p1MaxRentAmountStandardRentIncrease = Number(priorRentAmount) + calc_p1MaxCPIAmountStandardRentIncrease;\r\n const p1MaxEligibleAmount = formatter.toFixedNumber((calc_p1MaxRentAmountStandardRentIncrease * MAX_PORTION_PERCENTAGE), 2);\r\n const calc_p1MaxEligibleAmount = Math.min(decisionEligibleAmount, p1MaxEligibleAmount);\r\n const calc_p1EligibleErrorAmount = Number(calc_p1MaxEligibleAmount) >= appliedPhase1EligibleAmount ? 0 : Number(appliedPhase1EligibleAmount) - Number(calc_p1MaxEligibleAmount);\r\n const calc_p1UnusedEligibleAmount = calc_p1MaxEligibleAmount > appliedPhase1EligibleAmount ? formatter.toFixedNumber(calc_p1MaxEligibleAmount - appliedPhase1EligibleAmount, 2) : 0;//const rentAmountAdditionalPortion = Math.min(decisionEligibleAmount, rentMaxAmountAdditionalPortion);\r\n //NEW phase1RentAmount > calc_p1MaxRentAmountStandardRentIncrease + calc_p1MaxEligibleAmount ? 0 : formatter.toFixedNumber(Number(calc_p1MaxEligibleAmount) - Number(appliedPhase1EligibleAmount), 2)\r\n //OLD (calc_p1MaxRentAmountStandardRentIncrease + calc_p1MaxEligibleAmount) - Number(phase1RentAmount) > 0 ? (calc_p1MaxRentAmountStandardRentIncrease + calc_p1MaxEligibleAmount) - Number(phase1RentAmount) : 0 //Number(calc_p1MaxEligibleAmount) <= appliedPhase1EligibleAmount ? 0 : formatter.toFixedNumber(Number(calc_p1MaxEligibleAmount) - Number(appliedPhase1EligibleAmount), 2)\r\n const calc_p1MaxAdditionalRentIncrease = Number(calc_p1MaxRentAmountStandardRentIncrease) + Number(calc_p1MaxEligibleAmount);\r\n const calc_p1RemainingEligibleAmount = Number(calc_p1MaxEligibleAmount) > 0 ? formatter.toFixedNumber(Number(decisionEligibleAmount) - (Number(calc_p1MaxEligibleAmount)), 2) : 0;\r\n const calc_p1IsServiceDateValid = moment(moment(phase1RentIncreaseDate).startOf('day')).isSameOrAfter(moment(moment(calc_p1EarliestServiceDate).startOf('day')));\r\n const calc_p1IsServiceDateExpired = Math.abs(moment(decisionDate).diff(moment(phase1RentIncreaseDate), 'months', true)).toFixed(2) > 12;\r\n const calc_p1IsAppliedEligibleAmountValid = Number(appliedPhase1EligibleAmount) <= Number(calc_p1MaxEligibleAmount);\r\n const calc_p1IsPhase2Available = Number(calc_p1RemainingEligibleAmount) > 0 && !calc_p1IsServiceDateExpired;\r\n const calc_p1IsRentIncreaseAmountValid = Number(phase1RentAmount) <= Number(calc_p1MaxAdditionalRentIncrease);\r\n const calc_p1RentIncreaseErrorAmount = Number(phase1RentAmount) > Number(calc_p1MaxAdditionalRentIncrease) ? Number(phase1RentAmount) - Number(calc_p1MaxAdditionalRentIncrease) : 0;\r\n const calc_p1IsRemainingEligibleAmountValid = Number(remainingPhase1EligibleAmount) === Number(calc_p1RemainingEligibleAmount);\r\n const addressString = `${streetAddress}, ${city}, BC, Canada, ${postalCode}`;\r\n\r\n const calculatedVars = {\r\n p2ToolUsedFor,\r\n calcCPIValue,\r\n calc_p1CPIYear,\r\n calc_p1CPIValue,\r\n calc_p1MaxCPIAmountStandardRentIncrease,\r\n calc_p1MaxRentAmountStandardRentIncrease,\r\n calc_p1MaxEligibleAmount,\r\n calc_p1EligibleErrorAmount,\r\n calc_p1UnusedEligibleAmount,\r\n calc_p1MaxAdditionalRentIncrease,\r\n calc_p1RemainingEligibleAmount,\r\n calc_p1IsServiceDateValid,\r\n calc_p1IsAppliedEligibleAmountValid,\r\n calc_p1IsPhase2Available,\r\n calc_p1IsRentIncreaseAmountValid,\r\n calc_p1RentIncreaseErrorAmount,\r\n calc_p1IsRemainingEligibleAmountValid,\r\n calc_p1IsServiceDateExpired,\r\n address: addressString\r\n }\r\n\r\n setValidationData({...address, ...decisionData, ...calculatedVars});\r\n \r\n GeneralUtils.log('----- PRINTING ALL PHASE 1 VARIABLES -----', 'success');\r\n GeneralUtils.log(`\r\n address: ${addressString}\\n\r\n decisionDate: ${formatter.toDateDisplay(decisionDate)}\\n\r\n decisionEligibleAmount: ${decisionEligibleAmount}\\n\r\n userAccessDate: ${formatter.toDateDisplay(userAccessDate)}\\n\r\n phase1RentIncreaseDate: ${formatter.toDateDisplay(phase1RentIncreaseDate)}\\n\r\n priorRentAmount: ${priorRentAmount}\\n\r\n appliedPhase1EligibleAmount: ${appliedPhase1EligibleAmount}\\n\r\n phase1RentAmount: ${phase1RentAmount}\\n\r\n remainingPhase1EligibleAmount: ${remainingPhase1EligibleAmount}\\n\r\n p2ToolUsedFor: ${p2ToolUsedFor}\\n\r\n logCalcCPI: ${logCalcCPI}\\n\r\n calc_p1MaxCPIAmountStandardRentIncrease: ${calc_p1MaxCPIAmountStandardRentIncrease}\\n\r\n calc_p1MaxRentAmountStandardRentIncrease: ${calc_p1MaxRentAmountStandardRentIncrease}\\n\r\n calc_p1MaxEligibleAmount: ${calc_p1MaxEligibleAmount}\\n\r\n calc_p1EligibleErrorAmount: ${calc_p1EligibleErrorAmount}\\n\r\n calc_p1UnusedEligibleAmount: ${calc_p1UnusedEligibleAmount}\\n\r\n calc_p1MaxAdditionalRentIncrease: ${calc_p1MaxAdditionalRentIncrease}\\n\r\n calc_p1RemainingEligibleAmount: ${calc_p1RemainingEligibleAmount}\\n\r\n calc_p1IsServiceDateValid: ${calc_p1IsServiceDateValid}\\n\r\n calc_p1IsAppliedEligibleAmountValid: ${calc_p1IsAppliedEligibleAmountValid}\\n\r\n calc_p1IsPhase2Available: ${calc_p1IsPhase2Available}\\n\r\n calc_p1IsRentIncreaseAmountValid: ${calc_p1IsRentIncreaseAmountValid}\\n\r\n calc_p1RentIncreaseErrorAmount: ${calc_p1RentIncreaseErrorAmount}\\n\r\n calc_p1IsRemainingEligibleAmountValid: ${calc_p1IsRemainingEligibleAmountValid}\\n\r\n `\r\n , 'end');\r\n}\r\n\r\nconst calculate = () => {\r\n let isValid = true;\r\n const { streetAddress, city, postalCode } = address;\r\n const { decisionDate, decisionEligibleAmount, phase1RentIncreaseDate, priorRentAmount, appliedPhase1EligibleAmount, phase1RentAmount, remainingPhase1EligibleAmount } = decisionData;\r\n \r\n const addressValidations = [\r\n {\r\n streetAddress,\r\n validationRules: [{ minLength: 6 },{ isRequired: true, errorMsg: 'Address is required' }],\r\n },\r\n {\r\n city,\r\n validationRules: [{ minLength: 3 }, { isRequired: true, errorMsg: 'City is required' }],\r\n },\r\n {\r\n postalCode,\r\n validationRules: [{ postalCode: true }, { isRequired: true, errorMsg: 'Postal Code is required' }],\r\n },\r\n ];\r\n\r\n const decisionDataValidations = [\r\n {\r\n decisionDate,\r\n validationRules: [{ isRequired: true, errorMsg: 'Date is required' }]\r\n },\r\n {\r\n decisionEligibleAmount,\r\n validationRules: [{ minValue: 0 }, { isRequired: true, errorMsg: 'Amount is required' }]\r\n },\r\n {\r\n phase1RentIncreaseDate,\r\n validationRules: [{ isRequired: true, errorMsg: 'Date is required' }]\r\n },\r\n {\r\n priorRentAmount,\r\n validationRules: [{ minValue: 0 }, { isRequired: true, errorMsg: 'Amount is required' }]\r\n },\r\n {\r\n appliedPhase1EligibleAmount,\r\n validationRules: [{ minValue: 0 }, { maxValue: decisionEligibleAmount, errorMsg: `Must be less than or equal to eligible amount${decisionEligibleAmount ? `: ${decisionEligibleAmount}` : ''}` }, { isRequired: true, errorMsg: 'Amount is required' }]\r\n },\r\n {\r\n phase1RentAmount,\r\n validationRules: [{ minValue: Number(priorRentAmount) + Number(appliedPhase1EligibleAmount), errorMsg: `Enter an amount greater than the prior rent plus the applied eligible amount${Number(priorRentAmount) + Number(appliedPhase1EligibleAmount) ? `: ${Number(priorRentAmount) + Number(appliedPhase1EligibleAmount)}` : ''}` }, { isRequired: true, errorMsg: 'Amount is required' }]\r\n },\r\n {\r\n remainingPhase1EligibleAmount,\r\n validationRules: [{ minValue: 0, errorMsg: 'Amount is required, if you have no remaining amount enter 0' }, { isRequired: true, errorMsg: 'Amount is required' }]\r\n }\r\n ]\r\n\r\n const addressErrors = validate(addressValidations);\r\n const decisionDataErrors = validate(decisionDataValidations);\r\n \r\n if (Object.keys(addressErrors).length) {\r\n isValid = false;\r\n setStreetAddress({...address, errors: addressErrors });\r\n } \r\n \r\n if (Object.keys(decisionDataErrors).length) {\r\n isValid = false;\r\n setDecisionData({...decisionData, errors: decisionDataErrors });\r\n }\r\n\r\n if (isValid) {\r\n setStreetAddress({...address, errors: {}})\r\n setDecisionData({...decisionData, errors: {}})\r\n setData();\r\n setIsSubmitted(true);\r\n }\r\n} \r\n\r\nconst { streetAddress, city, postalCode } = address;\r\nconst { decisionDate, decisionEligibleAmount, userAccessDate, phase1RentIncreaseDate, priorRentAmount, appliedPhase1EligibleAmount, phase1RentAmount, remainingPhase1EligibleAmount } = decisionData;\r\nconst renderModifyButton = () => disabled ? setIsSubmitted(false)}>| \r\n | \r\n \r\n 404\r\n | \r\n
| \r\n Not Found \r\n | \r\n |
| \r\n The page you requested was not found. \r\nIf you came here from somewhere else, try pressing back. If you typed the address make sure it is typed correctly. \r\n | \r\n
\r\n
\r\n );\r\n}\r\n\r\nexport default RentIncreaseInformation;","import { formatter } from \"../../utility\";\r\nimport { readyCheckIcon, notReadyCheckIcon } from \"../../assets/images\";\r\n\r\n\r\nconst ValidationSummary = (props) => {\r\n const { \r\n phase1RentIncreaseDate, calc_p1IsServiceDateValid, appliedPhase1EligibleAmount, calc_p1IsAppliedEligibleAmountValid, calc_p1MaxEligibleAmount, phase1RentAmount, calc_p1RentIncreaseErrorAmount, \r\n calc_p1IsRentIncreaseAmountValid, calc_p1MaxAdditionalRentIncrease, calc_p1IsRemainingEligibleAmountValid, calc_p1RemainingEligibleAmount, remainingPhase1EligibleAmount \r\n } = props?.validationData;\r\n \r\n const renderMinDateValidation = () => {\r\n const displayTextLandlord = calc_p1IsServiceDateValid ? 'The phase 1 rent increase was imposed at least 3 full months after the decision.' \r\n : 'The phase 1 rent increase was not imposed at least 3 full months after the decision';\r\n const displayTextTenant = calc_p1IsServiceDateValid ? 'The phase 1 rent increase was imposed at least 3 full months after the decision with enough time to serve notice' \r\n : 'The phase 1 rent increase was not imposed at least 3 full months after the decision and did not include adequate notice.'\r\n return (\r\n \r\n
\r\n { decisionDate ? \r\n \r\n
\r\n \r\n
\r\n \r\n
: null }\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n { renderModifyButton() }\r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n const renderEligibleAmount = () => {\r\n const displayText = calc_p1IsAppliedEligibleAmountValid ? `The additional rent increase amount that was imposed is within the maximum rent increase allowed of ${formatter.toAmountDisplay(calc_p1MaxEligibleAmount)}.` \r\n : `The additional rent increase amount that was imposed is over the maximum rent increase allowed of ${formatter.toAmountDisplay(calc_p1MaxEligibleAmount)}.`\r\n return (\r\n \r\n {formatter.toDateDisplay(phase1RentIncreaseDate, { fullMonth: true })}\r\n
\r\n \r\n {props?.isTenantRoute ? displayTextTenant : displayTextLandlord}\r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n const renderRentIncreaseAmount = () => {\r\n const displayText = calc_p1IsRentIncreaseAmountValid ? `${props?.isTenantRoute ? 'The' : 'Your'} phase 1 rent increase is within the maximum rent increase allowed of ${formatter.toAmountDisplay(calc_p1MaxAdditionalRentIncrease)}.` \r\n : `${props?.isTenantRoute ? 'The' : 'Your'} phase 1 rent increase is ${formatter.toAmountDisplay(calc_p1RentIncreaseErrorAmount)} over the maximum rent increase allowed of ${formatter.toAmountDisplay(calc_p1MaxAdditionalRentIncrease)}.`;\r\n return (\r\n \r\n {formatter.toAmountDisplay(appliedPhase1EligibleAmount)}\r\n
\r\n \r\n {displayText}\r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n const renderRemainingEligibleAmount = () => {\r\n const correctAmountDisplay = calc_p1RemainingEligibleAmount > 0 ? calc_p1RemainingEligibleAmount : 0;\r\n const displayText = calc_p1IsRemainingEligibleAmountValid ? `${props?.isTenantRoute ? 'The' : 'Your'} remaining eligible amount of ${formatter.toAmountDisplay(calc_p1RemainingEligibleAmount)} is correct.` \r\n : `${props?.isTenantRoute ? 'The' : 'Your'} remaining eligible amount of ${formatter.toAmountDisplay(remainingPhase1EligibleAmount)} is not correct. The correct amount is ${formatter.toAmountDisplay(correctAmountDisplay)}.`;\r\n return (\r\n \r\n {formatter.toAmountDisplay(phase1RentAmount)}\r\n
\r\n \r\n {displayText}\r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n const renderValidationSummary = () => {\r\n const processHadNoErrors = calc_p1IsServiceDateValid && calc_p1IsAppliedEligibleAmountValid && calc_p1IsRentIncreaseAmountValid && calc_p1IsRemainingEligibleAmountValid\r\n const displayText = processHadNoErrors ? \r\n `Based on the information you provided, the phase 1 rent increase was imposed correctly` : \r\n `Based on the information you provided, warnings were identified ${props?.isTenantRoute ? 'in the' : 'for your'} phase 1 rent increase. This may happen if the information\r\n you provided was not correct. You can click modify to change any incorrect information that you provided.`;\r\n \r\n return \r\n {formatter.toAmountDisplay(remainingPhase1EligibleAmount)}\r\n
\r\n \r\n {displayText}\r\n
\r\n \r\n \r\n {displayText}\r\n
\r\n
\r\n )\r\n}\r\n\r\nexport default ValidationSummary;","import { formatter } from \"../../utility\";\r\nimport moment from 'moment';\r\n\r\nconst ValidationErrors = (props) => {\r\n const { \r\n decisionDate, phase1RentIncreaseDate, calc_p1IsServiceDateValid, calc_p1IsAppliedEligibleAmountValid, calc_p1RentIncreaseErrorAmount, calc_p1MaxEligibleAmount, calc_p1IsServiceDateExpired,\r\n calc_p1IsRentIncreaseAmountValid, calc_p1MaxAdditionalRentIncrease, calc_p1IsRemainingEligibleAmountValid, calc_p1RemainingEligibleAmount, calc_p1UnusedEligibleAmount, calc_p1EligibleErrorAmount\r\n } = props?.validationData;\r\n \r\n const renderNoticeError = () => {\r\n if (calc_p1IsServiceDateValid) return;\r\n return Phase 1 Rent Increase Validation
\r\n { renderMinDateValidation() }\r\n { renderEligibleAmount() }\r\n { renderRentIncreaseAmount() }\r\n { renderRemainingEligibleAmount() }\r\n { renderValidationSummary() }\r\n\r\n Warning. Based on the decision date of {formatter.toDateDisplay(decisionDate, { fullMonth: true })} and your phase 1 rent increase date of {formatter.toDateDisplay(phase1RentIncreaseDate, { fullMonth: true })}, {props?.isTenantRoute ? 'the landlord' : 'you'} did not give the required 3 full months of notice to the tenant prior to this rent increase. \r\n If this rent increase was not mutually agreed to by the tenant(s), the tenant(s) could dispute the rent increase with the Residential Tenancy Branch or or deduct any amount overpaid from future rent payments. If you continue with a subsequent rent increase that builds on this base rent amount, you may be adding to the amount which could be disputed by the tenant or deducted from a future rent payment. \r\n You can find information on rent increases here.\r\n
\r\n }\r\n\r\n const renderLostRentIncreaseWarning = () => {\r\n if (!calc_p1IsServiceDateExpired) return;\r\n return \r\n Warning. The first additional rent increase (phase 1) was not imposed between the required dates of {formatter.toDateDisplay(decisionDate)} and {formatter.toDateDisplay(moment(decisionDate).add(1, 'year'))}. \r\n Due to the phase 1 rent increase date not being imposed in the allowed timeframe, you may not use this webtool to calculate phase 2 rent increase. \r\n The landlord may have raised the rent by an amount that is more than they are allowed to do. If this rent increase was not mutually agreed to by the tenant(s), \r\n the tenant(s) may dispute the rent increase with the Residential Tenancy Branch or deduct any amount overpaid from future rent payments. You can find information on rent increases here.\r\n
\r\n }\r\n\r\n const renderMaxEligibleAmountError = () => {\r\n if (calc_p1IsAppliedEligibleAmountValid) return;\r\n return \r\n Warning. Based on the information that you provided, {props?.isTenantRoute ? 'the landlord has' : 'you have'} applied an eligible amount that is {formatter.toAmountDisplay(calc_p1EligibleErrorAmount)} over the allowed\r\n maximum rent increase for this unit of {formatter.toAmountDisplay(calc_p1MaxEligibleAmount)}.\r\n
\r\n }\r\n\r\n const renderMaxIncreaseAmountError = () => {\r\n if (calc_p1IsRentIncreaseAmountValid) return;\r\n return \r\n Warning. Based on the information that you provided, {props?.isTenantRoute ? 'the landlord has' : 'you have'} applied a rent increase that is {formatter.toAmountDisplay(calc_p1RentIncreaseErrorAmount)} over the allowed maximum rent increase for this unit of {formatter.toAmountDisplay(calc_p1MaxAdditionalRentIncrease)}. \r\n If this rent increase was not mutually agreed to by the tenant(s), it is possible that the tenant(s) could dispute the rent increase with the Residential Tenancy Branch or deduct any amount overpaid from future rent payments. You can find information on rent increases here.\r\n
\r\n }\r\n\r\n const renderWrongEligibleAmountError = () => {\r\n if (calc_p1IsRemainingEligibleAmountValid || Number(calc_p1RemainingEligibleAmount) < 0) return;\r\n return \r\n Warning. Based on the information that you provided, the remaining eligible amount for an additional rent increase is {formatter.toAmountDisplay(calc_p1RemainingEligibleAmount)}. The phase 2 calculator will use the corrected amount, not the amount you provided. \r\n
\r\n }\r\n\r\n const renderUnusedligibleAmountError = () => {\r\n if (Number(calc_p1UnusedEligibleAmount) <= 0) return;\r\n return \r\n Warning. Based on the information that you provided, {props?.isTenantRoute ? 'the landlord has' : 'you have'} {formatter.toAmountDisplay(calc_p1UnusedEligibleAmount)} of unused eligible amount in your phase 1 rent increase. This amount cannot be used for future rent increases.\r\n
\r\n }\r\n\r\n return (\r\n \r\n { renderLostRentIncreaseWarning() }\r\n { renderNoticeError() }\r\n { renderMaxEligibleAmountError() }\r\n { renderMaxIncreaseAmountError() }\r\n { renderWrongEligibleAmountError() }\r\n { renderUnusedligibleAmountError() }\r\n
\r\n )\r\n}\r\n\r\nexport default ValidationErrors;","import React, { useState } from 'react';\r\nimport { InputBase } from '../Helper/InputBase';\r\nimport Button from 'react-bootstrap/Button';\r\nimport { restartIcon, printIcon } from '../../assets/images';\r\nimport { formatter, validate } from '../../utility';\r\nimport GeneralUtils from '../../utility/GeneralUtils';\r\nimport ROUTES from '../../constants/RouteConstants';\r\nimport { useEffect } from 'react';\r\n\r\nconst ValidationComplete = (props) => {\r\n const { validationData, setValidationData } = props;\r\n const { phase1RentAmount, calc_p1RemainingEligibleAmount, calc_p1MaxAdditionalRentIncrease, calc_p1IsPhase2Available, calc_p1IsRentIncreaseAmountValid, phase1RentAmountUsed } = props?.validationData;\r\n const [data, setRentData] = useState({\r\n phase1RentAmountUsed : '',\r\n errors: {}\r\n });\r\n\r\n useEffect(() => {\r\n if (!data?.phase1RentAmountUsed) {\r\n setRentData({ phase1RentAmountUsed, errors: {} })\r\n }\r\n },[phase1RentAmountUsed])\r\n\r\n const handleSelectChange = (event) => {\r\n const { name, value } = event.target;\r\n setRentData({...data, [name]: value, errors: { ...data?.errors, [name]: '' }});\r\n }\r\n\r\n const noEligibleAmount = () => {\r\n if (calc_p1RemainingEligibleAmount > 0) return;\r\n return {props?.isTenantRoute ? 'The landlord has' : 'You have'} no eligible amount remaining for future additional rent increases and can now only apply a standard rent increase to this unit.
\r\n }\r\n\r\n const continueClick = () => {\r\n const { phase1RentAmountUsed } = data;\r\n\r\n const rentAmountValidation = [\r\n {\r\n phase1RentAmountUsed: phase1RentAmountUsed ? phase1RentAmountUsed : '',\r\n validationRules: [{ isRequired: !calc_p1IsRentIncreaseAmountValid && calc_p1IsPhase2Available, errorMsg: 'Selected rent amount for phase 2 is required' }],\r\n },\r\n ];\r\n\r\n const rentAmountErrors = validate(rentAmountValidation);\r\n if (Object.keys(rentAmountErrors).length) {\r\n setRentData({ phase1RentAmountUsed, errors: rentAmountErrors });\r\n return;\r\n } else {\r\n setRentData({ phase1RentAmountUsed, errors: {} });\r\n const phase1RentAmountUsedTemp = !calc_p1IsRentIncreaseAmountValid && calc_p1IsPhase2Available ? data?.phase1RentAmountUsed : phase1RentAmount\r\n\r\n setValidationData({ ...validationData, ...{ phase1RentAmountUsed: phase1RentAmountUsedTemp, rentAmountError: !calc_p1IsRentIncreaseAmountValid && calc_p1IsPhase2Available ? Number(phase1RentAmountUsed) !== Number(calc_p1MaxAdditionalRentIncrease) : false } });\r\n GeneralUtils.log(`\r\n phase1RentAmountUsed: ${phase1RentAmountUsed}\r\n `);\r\n props?.navigate(ROUTES.RENT_INCREASE_CALCULATOR)\r\n }\r\n }\r\n\r\n const resetForm = () => {\r\n window.location.reload(false);\r\n }\r\n\r\n const print = () => {\r\n window.print();\r\n }\r\n \r\n return (\r\n \r\n { noEligibleAmount() }\r\n { !props?.isTenantRoute ?
\r\n )\r\n}\r\n\r\nexport default ValidationComplete;","import React, { useState, useEffect } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { bindActionCreators } from 'redux';\r\nimport { NavigateActions, ValidationActions } from '../../redux/actions';\r\nimport { polyglot } from '../../assets/locales';\r\nimport ROUTES from '../../constants/RouteConstants';\r\nimport RentIncreaseInformation from './RentIncreaseInformation';\r\nimport ValidationSummary from './ValidationSummary';\r\nimport ValidationErrors from './ValidationErrors';\r\nimport ValidationComplete from './ValidationComplete';\r\n\r\nconst Validator = (props) => {\r\n const { cpiConfig } = props;\r\n const [validationDataSubmitted, setIsSubmitted] = useState(false); \r\n const [validationData, setValidationData] = useState({});\r\n const isTenantRoute = props?.location?.pathname === ROUTES.TENANT_VALIDATOR;\r\n\r\n useEffect(() => {\r\n if (JSON.stringify(validationData) === '{}' && Object.keys(props?.validationData || {})?.length) {\r\n setIsSubmitted(true);\r\n setValidationData(props.validationData);\r\n }\r\n },[]);\r\n\r\n useEffect(() => {\r\n props.setValidationData(validationData);\r\n },[validationData, props])\r\n\r\n return (\r\n \r\n { !calc_p1IsRentIncreaseAmountValid && calc_p1IsPhase2Available ?
: null }\r\n \r\n Do you want to adjust your current rent to the the corrected amount above of {formatter.toAmountDisplay(calc_p1MaxAdditionalRentIncrease)}, or continue with the rent amount that you are charging the tenant today of {formatter.toAmountDisplay(phase1RentAmount)}. \r\n Important: If you continue with an amount that is not determined to be correct, a warning will be included in your generated rent increase notice to inform the tenant of the discrepancy.\r\n
: null }\r\n\r\n { !calc_p1IsRentIncreaseAmountValid && calc_p1IsPhase2Available ?
\r\n \r\n print()}>\r\n Print\r\n \r\n resetForm()}>\r\n Start Over\r\n \r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nconst mapStateToProps = (state) => {\r\n return {\r\n cpiConfig: state.config.cpiConfig,\r\n validationData: state.validations.data,\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = (dispatch) =>\r\n bindActionCreators(\r\n {\r\n navigate: NavigateActions.navigate,\r\n setValidationData: ValidationActions.setValidationData\r\n },\r\n dispatch\r\n );\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(Validator);","import React, { useState, useEffect } from 'react';\r\nimport { appliedRuleIcon, restartIcon } from \"../../assets/images\";\r\nimport { formatter, validate } from \"../../utility\";\r\nimport { CustomDateInput, InputBase } from \"../Helper/InputBase\";\r\nimport { Button } from 'react-bootstrap';\r\nimport appConstants from '../../config/app_config';\r\nimport moment from 'moment';\r\nimport GeneralUtils from '../../utility/GeneralUtils';\r\n\r\nconst DROPDOWN_YES_VALUE = '1';\r\nconst DROPDOWN_NO_VALUE = '0';\r\n\r\nconst RICalcStepOne = (props) => {\r\n const { \r\n phase1RentIncreaseDate, calc_p1RemainingEligibleAmount, phase1RentAmountUsed, phase1RentAmount, \r\n calc_p1IsRemainingEligibleAmountValid, userAccessDate, address, rentAmountError\r\n } = props?.phaseOneData;\r\n\r\n const {\r\n calc_p2EarliestRentIncreaseDate,\r\n stepOneSubmitted,\r\n calc_p2EarliestServiceDate,\r\n calc_p2MaxRentIncreaseDate\r\n } = props?.phaseTwoData;\r\n\r\n const [stepOneData, setStepOneData] = useState({\r\n rentIncreaseDateAfterPhase2: props?.phaseTwoData?.rentIncreaseDateAfterPhase2 || '',\r\n isRentIncreaseAfterPhase2: props?.phaseTwoData?.isRentIncreaseAfterPhase2 === true ? DROPDOWN_YES_VALUE : props?.phaseTwoData?.isRentIncreaseAfterPhase2 === false ? DROPDOWN_NO_VALUE : '',\r\n errors: {}\r\n });\r\n\r\n const hideRentIncreaseDateAfterPhase2Question = moment(calc_p2EarliestRentIncreaseDate).isAfter(moment()) && !appConstants.testMode;\r\n\r\n useEffect(() => {\r\n if (hideRentIncreaseDateAfterPhase2Question) {\r\n setStepOneData({...stepOneData, isRentIncreaseAfterPhase2: DROPDOWN_NO_VALUE, errors: { ...stepOneData?.errors, [isRentIncreaseAfterPhase2]: '' }});\r\n submitStepOne();\r\n }\r\n },[])\r\n\r\n const handleSelectChange = (event) => {\r\n const { name, value } = event.target;\r\n setStepOneData({...stepOneData, [name]: value, errors: {}});\r\n }\r\n\r\n const handleDateChange = (value, event) => {\r\n const { name } = event;\r\n setStepOneData({...stepOneData, [name]: value, errors: { ...stepOneData?.errors, [name]: '' }})\r\n }\r\n\r\n const calculateStepOneVars = () => {\r\n const getCalcRentIncreaseServiceTimeIsAvailable = (earliestServiceDate, maxRentIncreaseDate) => {\r\n if (!earliestServiceDate || !maxRentIncreaseDate || !maxRentIncreaseDate) return false;\r\n return moment(earliestServiceDate).isBefore(maxRentIncreaseDate);\r\n }\r\n const calc_p2IsServiceTimeAvailable = getCalcRentIncreaseServiceTimeIsAvailable(calc_p2EarliestServiceDate, calc_p2MaxRentIncreaseDate);\r\n\r\n const p2StepOneData = {\r\n calc_p2IsServiceTimeAvailable\r\n }\r\n \r\n GeneralUtils.log('----- PRINTING ALL PHASE 2 - STEP 1 CALC VARIABLES -----', 'success');\r\n GeneralUtils.log(`\r\n rentIncreaseDateAfterPhase2: ${rentIncreaseDateAfterPhase2}\\n\r\n isRentIncreaseAfterPhase2: ${Boolean(isRentIncreaseAfterPhase2)}\\n\r\n calc_p2IsServiceTimeAvailable: ${calc_p2IsServiceTimeAvailable}\r\n `, 'info');\r\n\r\n return p2StepOneData;\r\n }\r\n\r\n const submitStepOne = () => {\r\n const validations = [\r\n {\r\n isRentIncreaseAfterPhase2,\r\n validationRules: [{ isRequired: !hideRentIncreaseDateAfterPhase2Question, errorMsg: 'Answer is required' }],\r\n },\r\n {\r\n rentIncreaseDateAfterPhase2,\r\n validationRules: [{ isRequired: isRentIncreaseAfterPhase2 === DROPDOWN_YES_VALUE, errorMsg: 'Date is required' }],\r\n },\r\n ]\r\n \r\n const validationErrors = validate(validations);\r\n if (Object.keys(validationErrors).length) {\r\n setStepOneData({...stepOneData, errors: validationErrors });\r\n } else {\r\n if (isRentIncreaseAfterPhase2 === DROPDOWN_NO_VALUE) {\r\n setStepOneData({ ...stepOneData, ...{ rentIncreaseDateAfterPhase2: isRentIncreaseAfterPhase2 === DROPDOWN_NO_VALUE ? '' : rentIncreaseDateAfterPhase2 }})\r\n }\r\n\r\n const calculatedStepOneVars = calculateStepOneVars();\r\n let data = { ...stepOneData, ...{ isRentIncreaseAfterPhase2: isRentIncreaseAfterPhase2 === DROPDOWN_YES_VALUE, rentIncreaseDateAfterPhase2: isRentIncreaseAfterPhase2 === DROPDOWN_NO_VALUE ? '' : rentIncreaseDateAfterPhase2}};\r\n props?.setPhaseTwoData({...props?.phaseTwoData, ...data, ...calculatedStepOneVars, ...{ stepOneSubmitted: true }});\r\n }\r\n }\r\n\r\n const modifyClicked = () => {\r\n props?.setPhaseTwoData({...props?.phaseTwoData, ...{ stepOneSubmitted: false, stepTwoSubmitted: false, stepThreeSubmitted: false }})\r\n }\r\n\r\n const { isRentIncreaseAfterPhase2, rentIncreaseDateAfterPhase2, errors } = stepOneData;\r\n \r\n return (\r\n \r\n
\r\n Phase 1 Additional Rent Increase Validation
\r\n \r\n {polyglot.t('noticeGenerator.sectionOne.descriptionWarning')}\r\n\r\n \r\n \r\n \r\n \r\n : null }\r\n\r\n { validationDataSubmitted && !validationData?.calcCPIValue ? \r\n <>\r\n
\r\n Please provide the address of the rental unit for this rent increase: {validationData?.streetAddress}
\r\n\r\n CPI not available. There is no CPI avaialable for the selected year.\r\n
\r\n \r\n : null }\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default RICalcStepOne;","import React, { useState, useEffect } from 'react';\r\nimport { appliedRuleIcon, restartIcon } from \"../../assets/images\";\r\nimport { CalculationUtils, formatter, validate } from \"../../utility\";\r\nimport { Button } from 'react-bootstrap';\r\nimport { CustomDateInput } from \"../Helper/InputBase\";\r\nimport appConstants from '../../config/app_config';\r\nimport moment from 'moment';\r\nimport GeneralUtils from '../../utility/GeneralUtils';\r\n\r\nconst MAX_PORTION_PERCENTAGE = 0.03;\r\nconst DROPDOWN_NO_VALUE = '0';\r\nconst DROPDOWN_YES_VALUE = '1';\r\n\r\nconst RICalcStepTwo = (props) => {\r\n \r\n const {\r\n calc_p1RemainingEligibleAmount\r\n } = props?.phaseOneData\r\n\r\n const {\r\n calc_p2EarliestServiceDate,\r\n calc_p2MaxRentIncreaseDate,\r\n calc_p2MinRentIncreaseDate,\r\n calc_p2IsServiceTimeAvailable,\r\n stepTwoSubmitted,\r\n isRentIncreaseAfterPhase2,\r\n rentIncreaseDateAfterPhase2,\r\n } = props?.phaseTwoData;\r\n\r\n const {\r\n phase1RentAmountUsed\r\n } = props?.phaseOneData;\r\n \r\n const [stepTwoData, setStepTwoData] = useState({\r\n phase2RentIncreaseDate: props?.phaseTwoData?.phase2RentIncreaseDate || '',\r\n errors: {}\r\n });\r\n\r\n useEffect(() => {\r\n if (!calc_p2IsServiceTimeAvailable || isRentIncreaseAfterPhase2) {\r\n const stepTwoVars = setStepTwoVars();\r\n props?.setPhaseTwoData({...props?.phaseTwoData, ...stepTwoData, ...stepTwoVars, ...{ stepTwoSubmitted: true }});\r\n }\r\n },[calc_p2IsServiceTimeAvailable])\r\n\r\n const handleDateChange = (value, event) => {\r\n const { name } = event;\r\n setStepTwoData({...stepTwoData, [name]: value, errors: { ...stepTwoData?.errors, [name]: '' }})\r\n }\r\n\r\n const setStepTwoVars = () => {\r\n const calc_p2RentIncreaseDate = \r\n calc_p2IsServiceTimeAvailable && !isRentIncreaseAfterPhase2 ? phase2RentIncreaseDate :\r\n calc_p2IsServiceTimeAvailable && isRentIncreaseAfterPhase2 ? rentIncreaseDateAfterPhase2 :\r\n calc_p2MaxRentIncreaseDate\r\n \r\n const calc_p2CPIYear = moment(calc_p2RentIncreaseDate).year();\r\n const calcCPIValue = CalculationUtils.getCpiForYear(props?.cpiConfig, calc_p2CPIYear)?.value || null;\r\n const calc_p2CPIValue = calcCPIValue ? (calcCPIValue / 100).toFixed(3) : 0;\r\n const calc_nextCPIUpdateDate = moment(`Sep 15, ${calc_p2CPIYear}`).subtract(1, 'year');\r\n const calc_p2MaxCPIAmountStandardRentIncrease = formatter.toFixedNumber(Number(phase1RentAmountUsed) * Number(calc_p2CPIValue), 3);\r\n const calc_p2MaxRentAmountStandardRentIncrease = formatter.toFixedNumber(Number(phase1RentAmountUsed) + Number(calc_p2MaxCPIAmountStandardRentIncrease), 2);\r\n const p2MaxEligibleAmount = formatter.toFixedNumber((Number(calc_p2MaxRentAmountStandardRentIncrease) * MAX_PORTION_PERCENTAGE), 3);\r\n const calc_p2MaxEligibleAmount = Math.min(calc_p1RemainingEligibleAmount, p2MaxEligibleAmount);\r\n const calc_p2AppliedEligibleAmount = Number(calc_p2MaxEligibleAmount) <= Number(calc_p1RemainingEligibleAmount) ? calc_p2MaxEligibleAmount : calc_p1RemainingEligibleAmount;\r\n const calc_p2MaxAdditionalRentIncrease = formatter.toFixedNumber(Number(calc_p2MaxRentAmountStandardRentIncrease) + Number(calc_p2AppliedEligibleAmount), 2);\r\n const calc_p2RemainingEligibleAmount = calc_p2MaxEligibleAmount > 0 ? calc_p1RemainingEligibleAmount - calc_p2MaxEligibleAmount : 0;\r\n\r\n const p2StepTwoData = {\r\n calc_p2RentIncreaseDate,\r\n calc_p2CPIYear,\r\n calc_p2CPIValue,\r\n calc_nextCPIUpdateDate,\r\n calc_p2MaxCPIAmountStandardRentIncrease,\r\n calc_p2MaxRentAmountStandardRentIncrease,\r\n calc_p2MaxEligibleAmount,\r\n calc_p2AppliedEligibleAmount,\r\n calc_p2MaxAdditionalRentIncrease,\r\n calc_p2RemainingEligibleAmount,\r\n calcCPIValue\r\n }\r\n\r\n GeneralUtils.log('----- PRINTING ALL PHASE 2 - STEP 2 VARIABLES -----', 'success');\r\n GeneralUtils.log(`\r\n calc_p2RentIncreaseDate: ${calc_p2RentIncreaseDate}\\n\r\n calc_p2CPIYear: ${calc_p2CPIYear}\\n\r\n calc_p2CPIValue: ${calc_p2CPIValue}\\n\r\n calc_nextCPIUpdateDate: ${formatter.toDateDisplay(calc_nextCPIUpdateDate)}\\n\r\n calc_p2MaxCPIAmountStandardRentIncrease: ${calc_p2MaxCPIAmountStandardRentIncrease}\\n\r\n calc_p2MaxRentAmountStandardRentIncrease: ${calc_p2MaxRentAmountStandardRentIncrease}\\n\r\n calc_p2MaxEligibleAmount: ${calc_p2MaxEligibleAmount}\\n\r\n calc_p2AppliedEligibleAmount: ${calc_p2AppliedEligibleAmount}\\n\r\n calc_p2MaxAdditionalRentIncrease: ${calc_p2MaxAdditionalRentIncrease}\\n\r\n calc_p2RemainingEligibleAmount: ${calc_p2RemainingEligibleAmount}\r\n `, 'info')\r\n\r\n return p2StepTwoData;\r\n }\r\n\r\n const submitStepTwo = () => {\r\n const validations = [\r\n {\r\n phase2RentIncreaseDate,\r\n validationRules: [{ isRequired: true, errorMsg: 'Date is required' }],\r\n },\r\n ]\r\n \r\n const validationErrors = validate(validations);\r\n if (Object.keys(validationErrors).length) {\r\n setStepTwoData({...stepTwoData, errors: validationErrors });\r\n } else {\r\n const stepTwoVars = setStepTwoVars();\r\n props?.setPhaseTwoData({...props?.phaseTwoData, ...stepTwoData, ...stepTwoVars, ...{ stepTwoSubmitted: true }});\r\n }\r\n }\r\n\r\n const modifyClicked = () => {\r\n props?.setPhaseTwoData({...props?.phaseTwoData, ...{ stepTwoSubmitted: false, stepThreeSubmitted: false }});\r\n }\r\n\r\n const { phase2RentIncreaseDate, errors } = stepTwoData;\r\n\r\n return (\r\n \r\n
\r\n\r\n { !hideRentIncreaseDateAfterPhase2Question ? \r\n
\r\n Rental unit address:
\r\n {address}
\r\n \r\n
\r\n Phase 1 rent increase date:
\r\n {formatter.toDateDisplay(phase1RentIncreaseDate, { fullMonth: true })}
\r\n \r\n
\r\n Rent amount after phase 1 rent increase:
\r\n {formatter.toAmountDisplay(phase1RentAmountUsed, { fullMonth: true })} {rentAmountError ? *potential error detected : ''}
\r\n \r\n
\r\n Remaining eligible amount:
\r\n {formatter.toAmountDisplay(calc_p1RemainingEligibleAmount, { fullMonth: true })} {!calc_p1IsRemainingEligibleAmountValid ? *corrected : ''}
\r\n \r\n
\r\n Date of rent increase calculation:
\r\n {formatter.toDateDisplay(userAccessDate, { fullMonth: true })}
\r\n \r\n \r\n \r\n Applied Rule: The second additional rent increase (phase 2) can only be imposed at least 12 months after the effective date of the first additional rent increase (phase 1).\r\n The earliest effective date allowed for the phase 2 rent increase is {formatter.toDateDisplay(calc_p2EarliestRentIncreaseDate, { fullMonth: true })}.\r\n \r\n
\r\n { hideRentIncreaseDateAfterPhase2Question ? null : \r\n
\r\n { isRentIncreaseAfterPhase2 === DROPDOWN_YES_VALUE ? \r\n
: null }\r\n\r\n { !hideRentIncreaseDateAfterPhase2Question ? \r\n \r\n { stepOneSubmitted ? modifyClicked()}> Modify : null }\r\n
: null }\r\n \r\n \r\n `}\r\n handleChange={handleDateChange}\r\n /> \r\n : null }\r\n\r\n { calc_p2IsServiceTimeAvailable && !isRentIncreaseAfterPhase2 ?
\r\n )\r\n}\r\n\r\nexport default RICalcStepTwo;","import React, { useState, useEffect } from 'react';\r\nimport { appliedRuleIcon, restartIcon } from \"../../assets/images\";\r\nimport { formatter, validate } from \"../../utility\";\r\nimport { Button } from 'react-bootstrap';\r\nimport { InputBase } from \"../Helper/InputBase\";\r\nimport { NormalizationConstants } from '../../constants';\r\nimport GeneralUtils from '../../utility/GeneralUtils';\r\nimport moment from 'moment';\r\n\r\nconst RICalcStepThree = (props) => {\r\n\r\n const {\r\n calc_p1RentAmount,\r\n calc_p2CPIYear,\r\n calc_p2CPIValue,\r\n calc_nextCPIUpdateDate,\r\n calc_p2MaxCPIAmountStandardRentIncrease,\r\n calcCPIValue,\r\n calc_p2MaxAdditionalRentIncrease,\r\n calc_p2MaxRentAmountStandardRentIncrease,\r\n calc_p2AppliedEligibleAmount,\r\n calc_p2MaxEligibleAmount,\r\n stepThreeSubmitted,\r\n phase2RentIncreaseDate,\r\n calc_p2IsServiceTimeAvailable,\r\n calc_p2RemainingEligibleAmount,\r\n isRentIncreaseAfterPhase2,\r\n calc_p2RentIncreaseDate,\r\n } = props?.phaseTwoData;\r\n\r\n const { calc_p1RemainingEligibleAmount, phase1RentAmountUsed } = props?.phaseOneData;\r\n\r\n const [stepThreeData, setStepThreeData] = useState({\r\n phase2RentAmount: props?.phaseTwoData?.phase2RentAmount || '',\r\n errors: {}\r\n });\r\n\r\n useEffect(() => {\r\n if (!calc_p2IsServiceTimeAvailable || !calc_p2CPIValue || !phase2RentIncreaseDate) {\r\n const stepThreeVars = setPhaseThreeVars();\r\n props?.setPhaseTwoData({...props?.phaseTwoData, ...stepThreeData, ...stepThreeVars, ...{ stepThreeSubmitted: true }});\r\n }\r\n },[])\r\n\r\n const { phase2RentAmount } = stepThreeData;\r\n\r\n const modifyClicked = () => {\r\n props?.setPhaseTwoData({...props?.phaseTwoData, ...{ stepThreeSubmitted: false }});\r\n }\r\n\r\n const getIsGeneratedNoticeAvailable = () => {\r\n //Calc_P2RemainingEligibleAmount != 0 and Calc_P2IsServiceTimeAvailable = true and IsRentIncreaseAfterPhase2 = No THEN Calc_IsGeneratedNoticeAvailable\r\n if((isRentIncreaseAfterPhase2 && calc_p2RemainingEligibleAmount <= 0) || (!calc_p2IsServiceTimeAvailable && calc_p2RemainingEligibleAmount <= 0) || !calc_p2CPIValue) return false;\r\n return true;\r\n }\r\n\r\n const setPhaseThreeVars = () => {\r\n const calc_p2UnusedEligibleAmount = Number(calc_p2MaxAdditionalRentIncrease) - Number(phase2RentAmount) < Number(calc_p2MaxAdditionalRentIncrease) ? \r\n formatter.toFixedNumber(Number(calc_p2MaxAdditionalRentIncrease) - Number(phase2RentAmount), 3) \r\n : Number(calc_p2MaxAdditionalRentIncrease)\r\n\r\n const calc_isGeneratedNoticeAvailable = getIsGeneratedNoticeAvailable();\r\n const calc_p2InPersonMinServiceDate = moment(calc_p2RentIncreaseDate).subtract(3, 'months').subtract(1, 'day');\r\n const calc_p2EmailDoorFaxMinServiceDate = moment(calc_p2RentIncreaseDate).subtract(3, 'months').subtract(4, 'days');\r\n const calc_p2RegMailMinServiceDate = moment(calc_p2RentIncreaseDate).subtract(3, 'months').subtract(6, 'days');\r\n\r\n const p2StepThreeData = {\r\n calc_p2UnusedEligibleAmount,\r\n calc_isGeneratedNoticeAvailable,\r\n calc_p2InPersonMinServiceDate,\r\n calc_p2EmailDoorFaxMinServiceDate,\r\n calc_p2RegMailMinServiceDate\r\n }\r\n\r\n GeneralUtils.log('----- PRINTING ALL PHASE 2 - STEP 3 VARIABLES -----', 'success');\r\n GeneralUtils.log(`\r\n calc_p2UnusedEligibleAmount: ${calc_p2UnusedEligibleAmount}\\n\r\n calc_isGeneratedNoticeAvailable: ${calc_isGeneratedNoticeAvailable}\\n\r\n calc_p2InPersonMinServiceDate: ${formatter.toDateDisplay(calc_p2InPersonMinServiceDate)}\\n\r\n calc_p2EmailDoorFaxMinServiceDate: ${formatter.toDateDisplay(calc_p2EmailDoorFaxMinServiceDate)}\\n\r\n calc_p2RegMailMinServiceDate: ${formatter.toDateDisplay(calc_p2RegMailMinServiceDate)}\r\n `, 'info')\r\n\r\n return p2StepThreeData;\r\n }\r\n\r\n const submitStepThree = () => {\r\n const validations = [\r\n {\r\n phase2RentAmount,\r\n validationRules: [{ minValue: phase1RentAmountUsed }, { maxValue: calc_p2MaxAdditionalRentIncrease }, { isRequired: true, errorMsg: 'Amount is required' }],\r\n },\r\n ]\r\n \r\n const validationErrors = validate(validations);\r\n if (Object.keys(validationErrors).length) {\r\n setStepThreeData({...stepThreeData, errors: validationErrors });\r\n } else {\r\n const stepThreeVars = setPhaseThreeVars();\r\n props?.setPhaseTwoData({...props?.phaseTwoData, ...stepThreeData, ...stepThreeVars, ...{ stepThreeSubmitted: true }});\r\n }\r\n }\r\n\r\n const changeHandler = e => {\r\n const { name, value } = e.target;\r\n if (stepThreeData?.[name] === undefined) return;\r\n setStepThreeData({...stepThreeData, [name]: value, errors: { ...stepThreeData?.errors, [name]: '' }})\r\n }\r\n\r\n const renderCpiNotAvailableError = () => {\r\n if (calc_p2CPIValue) return;\r\n return (\r\n \r\n \r\n \r\n Applied Rule: The second additional rent increase (phase 2) can only be imposed at least 12 months after the effective date of the most recent rent increase, and a notice of rent increase must be served at least three full months before the effective date of the rent increase.\r\n Based on today's date and the information you provided, the earliest allowed effective date for the phase 2 rent increase would be {formatter.toDateDisplay(calc_p2MinRentIncreaseDate, { fullMonth: true })}. {/* calc_p2EarliestServiceDate */}\r\n \r\n
\r\n \r\n \r\n Applied Rule: The phase 2 additional rent increase must be imposed within 12 months of the earliest allowed date after the phase 1 rent increase.\r\n The last allowed date for this rent increase to be effective is {formatter.toDateDisplay(calc_p2MaxRentIncreaseDate, { fullMonth: true })}. If you do not impose the second additional rent increase by this date, you will not be allowed to include the eligible amount for phase 2 in any future rent increases.\r\n \r\n
\r\n \r\n { stepTwoSubmitted ? modifyClicked()}> Modify : null }\r\n
: null }\r\n \r\n Annual Allowable Rent Increase not known. This rent increase cannot be calculated until the annual allowable rent increase is known for the year 2024. \r\n This tool is updated each September with the annual allowable rate for the following year. \r\n Based on the date you have selected for this rent increase, you can return to this site and calculate this rent increase on {formatter.toDateDisplay(calc_nextCPIUpdateDate, { fullMonth: true })}.\r\n
\r\n )\r\n }\r\n\r\n const renderRentIncreaseCalculations = () => {\r\n if (!calc_p2CPIValue) return;\r\n\r\n return \r\n
\r\n }\r\n\r\n const renderMaxAdditionalRule = () => {\r\n if (!calc_p2CPIValue) return;\r\n return Second Additional Rent Increase Calculation
\r\n \r\n
\r\n {formatter.toAmountDisplay(calc_p1RemainingEligibleAmount)}
\r\n Eligible amount remaining (not used in previous rent increases)
\r\n \r\n
\r\n {formatter.toAmountDisplay(phase1RentAmountUsed)}
\r\n Current monthly rent (before any rent increases in year)
\r\n \r\n
\r\n {formatter.toAmountDisplay(calc_p2MaxCPIAmountStandardRentIncrease)}
\r\n Maximum annual allowable rent increase amount ({calcCPIValue}% for {calc_p2CPIYear})
\r\n \r\n
\r\n {formatter.toAmountDisplay(calc_p2MaxRentAmountStandardRentIncrease)}
\r\n Rent amount with standard rent increase
\r\n \r\n
\r\n {formatter.toAmountDisplay(calc_p2AppliedEligibleAmount)}
\r\n Additional rent increase eligible amount for rent increase (max allowed 3% or {formatter.toAmountDisplay(calc_p2MaxEligibleAmount)})
\r\n \r\n
\r\n {formatter.toAmountDisplay(calc_p2MaxAdditionalRentIncrease)}
\r\n Maximum allowed rent amount with all rent increases applied
\r\n \r\n \r\n \r\n Applied Rule: The amount that can be applied to an additional rent increase in a year is either 3% of the rent amount after the annual allowable rent increase has been added, or the remaining eligible amount for the unit, whichever is less.\r\n The maximum rent increase amount for the phase 2 additional rent increase is {formatter.toAmountDisplay(calc_p2AppliedEligibleAmount)}.\r\n \r\n
\r\n
\r\n )\r\n }\r\n\r\n return (\r\n \r\n { renderCpiNotAvailableError() }\r\n { renderRentIncreaseCalculations() }\r\n { renderMaxAdditionalRule() }\r\n { renderRentIncreaseAmount() }\r\n { calc_p2IsServiceTimeAvailable && calc_p2CPIValue && phase2RentIncreaseDate ?
\r\n )\r\n}\r\n\r\nexport default RICalcStepThree;","import React, { useState, useEffect } from 'react';\r\nimport { appliedRuleIcon, restartIcon, printIcon, readyCheckIcon } from \"../../assets/images\";\r\nimport { formatter, validate } from \"../../utility\";\r\nimport { Button } from 'react-bootstrap';\r\nimport { InputBase } from \"../Helper/InputBase\";\r\nimport { NormalizationConstants } from '../../constants';\r\n\r\nconst RICalcStepFour = (props) => {\r\n\r\n const { \r\n calc_p2UnusedEligibleAmount, phase2RentAmount, calc_p2CPIValue, rentIncreaseDateAfterPhase2, \r\n calc_p2AppliedEligibleAmount, calc_p2IsServiceTimeAvailable, isRentIncreaseAfterPhase2, calc_p2RemainingEligibleAmount,\r\n calc_p2RentIncreaseDate, calc_p2MinRentIncreaseDate, calc_p2MaxRentIncreaseDate, calc_isGeneratedNoticeAvailable\r\n } = props?.phaseTwoData;\r\n \r\n const print = () => {\r\n window.print();\r\n }\r\n\r\n const resetForm = () => {\r\n props?.resetPhaseTwo()\r\n }\r\n \r\n const renderUnusedEligibleAmountWarning = () => {\r\n if (calc_p2UnusedEligibleAmount <= 0 || !phase2RentAmount || phase2RentAmount <= 0) return;\r\n return \r\n \r\n { stepThreeSubmitted ? modifyClicked()}> Modify : null }\r\n
: null }\r\n \r\n Warning. The rent amount that you selected for the phase 2 additional rent increase does not use the full eligible amount available. Based on the rent amount entered of \r\n {formatter.toAmountDisplay(phase2RentAmount)}, you will lose {formatter.toAmountDisplay(calc_p2UnusedEligibleAmount)} of eligible amount which cannot be used in a future rent increase.\r\n
\r\n }\r\n\r\n const renderRemainingAmountRule = () => {\r\n return \r\n \r\n \r\n Applied Rule: Any unused eligible amounts associated to a rental unit can be applied to a future rent increase.\r\n The remaining eligible amount for a future rent increase is {formatter.toAmountDisplay(calc_p2RemainingEligibleAmount)}.\r\n \r\n
\r\n \r\n \r\n Applied Rule:\r\n \r\n If the phase 2 additional rent increase is not imposed between {formatter.toDateDisplay(calc_p2MinRentIncreaseDate, { fullMonth: true })}, and {formatter.toDateDisplay(calc_p2MaxRentIncreaseDate, { fullMonth: true })},\r\n the eligible amount for phase 2 is lost and cannot be used in a future rent increase. The eligible amount remaining for the phase 3 additional rent increase would be {formatter.toAmountDisplay(calc_p2RemainingEligibleAmount)}.\r\n \r\n \r\n
\r\n Warning. Based on the additional rent increase regulations, the rent increase that was effective on {formatter.toDateDisplay(rentIncreaseDateAfterPhase2, { fullMonth: true })}, is considered the phase 2 additional rent increase. \r\n If the phase 2 eligible amount of {formatter.toAmountDisplay(calc_p2AppliedEligibleAmount)} was not included in the rent increase on {formatter.toDateDisplay(rentIncreaseDateAfterPhase2, { fullMonth: true })}, then it is considered a lost amount and cannot be used for a future rent increase.\r\n
\r\n }\r\n\r\n const renderMissedDeadlineWithRemainingAmount = () => {\r\n if (!calc_p2IsServiceTimeAvailable && !isRentIncreaseAfterPhase2) {\r\n return \r\n Warning. Based on the information that you provided. the last allowed date for the second additional rent increase (phase 2) was {formatter.toDateDisplay(calc_p2RentIncreaseDate, { fullMonth: true })}. \r\n As this date has passed, you have lost the right to impose the phase 2 additional rent increase and {formatter.toAmountDisplay(calc_p2AppliedEligibleAmount)} of eligible amount. \r\n If you have any eligible amount remaining for a third rent increase (phase 3), you must generate a notice insert for this lost phase 2 rent increase and include it with your phase 3 additional rent increase.\r\n
\r\n }\r\n }\r\n\r\n const renderNoEligibleAmountRemainingWarning = () => {\r\n if (calc_p2RemainingEligibleAmount) return;\r\n return \r\n Warning. Based on the rules and the information provided, you have {formatter.toAmountDisplay(calc_p2RemainingEligibleAmount)} eligible amount remaining for future rent increases. Only standard rent increases will be allowed for this rental unit going forward.\r\n
\r\n }\r\n\r\n return (\r\n \r\n { calc_p2CPIValue ?\r\n <>\r\n { renderUnusedEligibleAmountWarning() }\r\n { renderRemainingAmountRule() }\r\n { renderLostAmountRule() }\r\n { renderRegularIncreaseConsideredAdditionalWarning() }\r\n { renderMissedDeadlineWithRemainingAmount() }\r\n { renderNoEligibleAmountRemainingWarning() }\r\n : null }\r\n
\r\n )\r\n}\r\n\r\nexport default RICalcStepFour;","import React, { useState, useEffect } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { bindActionCreators } from 'redux';\r\nimport { NavigateActions } from '../../redux/actions';\r\nimport { polyglot } from '../../assets/locales';\r\nimport moment from 'moment';\r\nimport ROUTES from '../../constants/RouteConstants';\r\nimport GeneralUtils from '../../utility/GeneralUtils';\r\nimport RICalcStepOne from './RICalcStepOne';\r\nimport RICalcStepTwo from './RICalcStepTwo';\r\nimport { CalculationUtils, formatter } from '../../utility';\r\nimport RICalcStepThree from './RICalcStepThree';\r\nimport RICalcStepFour from './RICalcStepFour';\r\nimport { GeneratedNoticePhase2 } from '../NoticeGenerator/GeneratedNotice';\r\nimport { backIcon } from '../../assets/images';\r\n\r\nconst RentIncreaseCalculator = (props) => {\r\n if (!props?.validationData || !Object.keys(props?.validationData)?.length) props.navigate(ROUTES.LANDLORD_VALIDATOR)\r\n\r\n const [p2Data, setData] = useState({});\r\n\r\n const { \r\n stepOneSubmitted, stepTwoSubmitted, stepThreeSubmitted, displayGenerateNotice\r\n } = p2Data;\r\n\r\n useEffect(() => {\r\n setPreStepOneData();\r\n },[]);\r\n\r\n const setPreStepOneData = () => {\r\n if (!props?.validationData) return;\r\n\r\n const { userAccessDate, phase1RentIncreaseDate, rentAmountError, phase1RentAmountUsed, calc_p1MaxAdditionalRentIncrease } = props?.validationData;\r\n\r\n const calc_p2EarliestServiceDate = moment(userAccessDate).startOf('month').add(4, 'months');\r\n const calc_p2EarliestRentIncreaseDate = moment(phase1RentIncreaseDate).add(1, 'year');\r\n const calc_p2MaxRentIncreaseDate = moment(phase1RentIncreaseDate).add(2, 'year').subtract(1, 'day');\r\n const calc_p2MinRentIncreaseDate = calc_p2EarliestServiceDate.isAfter(calc_p2EarliestRentIncreaseDate) ? calc_p2EarliestServiceDate : calc_p2EarliestRentIncreaseDate;\r\n const calc_p1RentAmount = rentAmountError ? calc_p1MaxAdditionalRentIncrease : phase1RentAmountUsed;\r\n \r\n const initP2Data = {\r\n stepOneSubmitted: false,\r\n displayGenerateNotice: false,\r\n calc_p2EarliestServiceDate,\r\n calc_p2EarliestRentIncreaseDate,\r\n calc_p2MinRentIncreaseDate,\r\n calc_p2MaxRentIncreaseDate,\r\n calc_p1RentAmount,\r\n }\r\n \r\n GeneralUtils.log('----- PRINTING ALL PHASE 2 - PRE STEP 1 CALC VARIABLES -----', 'success');\r\n GeneralUtils.log(`\r\n calc_p2EarliestServiceDate: ${formatter.toDateDisplay(calc_p2EarliestServiceDate)}\\n\r\n calc_p2EarliestRentIncreaseDate: ${formatter.toDateDisplay(calc_p2EarliestRentIncreaseDate)}\\n\r\n calc_p2MinRentIncreaseDate: ${formatter.toDateDisplay(calc_p2MinRentIncreaseDate)}\\n\r\n calc_p2MaxRentIncreaseDate: ${formatter.toDateDisplay(calc_p2MaxRentIncreaseDate)}\\n\r\n calc_p1RentAmount: ${calc_p1RentAmount}\\n\r\n `\r\n , 'info');\r\n\r\n setData(p2Data => ({...p2Data, ...initP2Data }));\r\n }\r\n\r\n const resetPhaseTwo = () => {\r\n setData({});\r\n setTimeout(() => setPreStepOneData(), 100)\r\n }\r\n\r\n const goBackToPreviousStep = () => {\r\n props?.navigate(ROUTES.LANDLORD_VALIDATOR);\r\n }\r\n\r\n const editInformation = () => {\r\n toggleDisplayGeneratedNotice();\r\n props.navigate(ROUTES.RENT_INCREASE_CALCULATOR);\r\n }\r\n\r\n const toggleDisplayGeneratedNotice = () => {\r\n setData({...p2Data, ...{ displayGenerateNotice: !displayGenerateNotice } })\r\n }\r\n\r\n const renderPageHeader = () => {\r\n if (displayGenerateNotice) return;\r\n\r\n return \r\n Process Completed. {calc_isGeneratedNoticeAvailable ? 'If the above is information is correct you can use it to generate a rent increase notice insert.' : null}\r\n
\r\n { calc_isGeneratedNoticeAvailable ? : null }\r\n print()}>\r\n Print\r\n \r\n resetForm()}>\r\n Start Over\r\n \r\n
\r\n \r\n back to the previous step and modify these values.\r\n \r\n
\r\n }\r\n\r\n return (\r\n Phase 2 Additional Rent Increase Calculation
\r\n \r\n The information you entered in the previous step will be used for this process. If any of these values are not correct, you can go \r\n goBackToPreviousStep()}>\r\n { renderPageHeader() }\r\n { !displayGenerateNotice && Object.keys(p2Data).length ? : null }\r\n { displayGenerateNotice ?
\r\n )\r\n}\r\n\r\nconst mapStateToProps = (state) => {\r\n return {\r\n cpiConfig: state.config.cpiConfig,\r\n validationData: state.validations.data,\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = (dispatch) =>\r\n bindActionCreators(\r\n {\r\n navigate: NavigateActions.navigate,\r\n },\r\n dispatch\r\n );\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(RentIncreaseCalculator);","import React, {Component} from 'react';\r\nimport { Route, Switch } from 'react-router';\r\nimport { connect } from 'react-redux';\r\nimport { bindActionCreators } from 'redux';\r\nimport { ConfigActions } from './redux/actions';\r\nimport \"isomorphic-fetch\";\r\nimport NoticeGenerator from './components/NoticeGenerator';\r\nimport Header from './components/Header';\r\nimport ROUTES from './constants/RouteConstants';\r\nimport { WebToolOne } from './components/WebtoolOne';\r\nimport Error404 from './components/ErrorBoundary/ErrorPages/Error404';\r\nimport { Validator } from './components/Validator';\r\nimport { RentIncreaseCalculator } from './components/RentIncreaseCalculator';\r\n\r\nclass App extends Component {\r\n constructor(props) {\r\n super(props);\r\n fetch(this.getJSONFilePath()).then((res) => {\r\n if(!res.ok) throw new Error(\"HTTP error \" + res.status);\r\n return res.json();\r\n }).then((json) => {\r\n this.props.addCpiConfig(json);\r\n }).catch((err) => {\r\n throw new Error(\"Incorrect CPI config\" + err);\r\n });\r\n }\r\n\r\n getJSONFilePath() {\r\n let filePath = `${process.env.PUBLIC_URL}/cpi_config.json`;\r\n // Append a timestamp query param to json files so they are not cached, by default\r\n filePath += `${filePath.indexOf('?') === -1 ? '?' : '&'}t=${(new Date()).getTime()}`;\r\n return filePath;\r\n }\r\n \r\n render() {\r\n return (\r\n <>\r\n