Add BE Rate Limit Request Count Changes

portals/publisher/src/main/webapp/source/src/app/components/Apis/Create/AIAPI/APICreateAIAPI.jsx

@@ -32,6 +32,8 @@ import Alert from 'AppComponents/Shared/Alert';
 import CircularProgress from '@mui/material/CircularProgress';
 import DefaultAPIForm from 'AppComponents/Apis/Create/Components/DefaultAPIForm';
 import APICreateBase from 'AppComponents/Apis/Create/Components/APICreateBase';
+import { API_SECURITY_API_KEY }
+ from 'AppComponents/Apis/Details/Configuration/components/APISecurity/components/apiSecurityConstants';
 import ProvideAIOpenAPI from './Steps/ProvideAIOpenAPI';
 
 
@@ -143,6 +145,7 @@ export default function ApiCreateAIAPI(props) {
  llmProviderName,
  llmProviderApiVersion,
  },
+ securityScheme: [API_SECURITY_API_KEY]
  };
  if (endpoint) {
  additionalProperties.endpointConfig = {

portals/publisher/src/main/webapp/source/src/app/components/Apis/Details/Configuration/RuntimeConfiguration.jsx

@@ -388,9 +388,20 @@ export default function RuntimeConfiguration() {
  case 'saveButtonDisabled':
  setSaveButtonDisabled(value);
  return state;
- case 'aiConfiguration':
+ case 'aiConfiguration': {
  nextState.aiConfiguration = value;
+ const { throttlingConfiguration } = nextState.aiConfiguration;
+ if (throttlingConfiguration) {
+ throttlingConfiguration.isTokenBasedThrottlingEnabled = !!(
+ throttlingConfiguration.productionMaxPromptTokenCount ||
+ throttlingConfiguration.productionMaxCompletionTokenCount ||
+ throttlingConfiguration.productionMaxTotalTokenCount ||
+ throttlingConfiguration.sandboxMaxPromptTokenCount ||
+ throttlingConfiguration.sandboxMaxCompletionTokenCount ||
+ throttlingConfiguration.sandboxMaxTotalTokenCount)
+ }
  return nextState;
+ }
  default:
  return state;
  }

portals/publisher/src/main/webapp/source/src/app/components/Apis/Details/Configuration/components/AIBackendRateLimiting/BackendRateLimiting.jsx

@@ -19,10 +19,6 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import Grid from '@mui/material/Grid';
 
-import { Switch, Typography } from '@mui/material';
-
-import { isRestricted } from 'AppData/AuthManager';
-import { useAPI } from 'AppComponents/Apis/Details/components/ApiContext';
 import BackendRateLimitingForm from './BackendRateLimitingForm';
 
 // import { useIntl } from 'react-intl';
@@ -36,43 +32,9 @@ import BackendRateLimitingForm from './BackendRateLimitingForm';
  */
 export default function BackendRateLimiting(props) {
  const { api, configDispatcher } = props;
- const [apiFromContext] = useAPI();
- // const intl = useIntl();
-
- function handleOnChangeTokenBasedSwitch({ target: { checked } }) {
- let throttlingConfiguration = {};
- if (api.aiConfiguration && api.aiConfiguration.throttlingConfiguration) {
- throttlingConfiguration = api.aiConfiguration.throttlingConfiguration;
- }
- const dispatchValue = {
- ...api.aiConfiguration,
- throttlingConfiguration: {
- ...throttlingConfiguration,
- isTokenBasedThrottlingEnabled: checked
- }
- }
- configDispatcher({
- action: 'aiConfiguration',
- value: dispatchValue,
- })
- }
 
  return (
  <>
- <Grid item xs={12} sx={{ mb: 2, ml:1 }}>
- <Typography variant='h6' component='h4'>
- Token Based Throttling
- <Switch
- disabled={isRestricted(['apim:api_create'], apiFromContext)}
- checked={api.aiConfiguration.throttlingConfiguration.isTokenBasedThrottlingEnabled}
- onChange={handleOnChangeTokenBasedSwitch}
- color='primary'
- inputProps={{
- 'aria-label': 'is Token Based Throttling Enabled',
- }}
- />
- </Typography>
- </Grid>
  <Grid item xs={12} sx={{mb:2}}>
  <BackendRateLimitingForm
  api={api}

portals/publisher/src/main/webapp/source/src/app/components/Apis/Details/Configuration/components/AIBackendRateLimiting/BackendRateLimitingForm.jsx

@@ -25,6 +25,7 @@ import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
 
 import WrappedExpansionPanel from 'AppComponents/Shared/WrappedExpansionPanel';
 import CommonRateLimitingForm from './CommonRateLimitingForm';
+import RequestCountRateLimit from './RequestCountRateLimit';
 
 /**
  * Backend Rate Limiting for AI APIs
@@ -137,6 +138,11 @@ export default function BackendRateLimitingForm(props) {
  tooltip: 'Max Total Token Count as an Integer value',
  }}
  />
+ <RequestCountRateLimit
+ api={api}
+ configDispatcher={configDispatcher}
+ isProduction={isProduction}
+ />
  </AccordionDetails>
  </WrappedExpansionPanel>
  </Root>

portals/publisher/src/main/webapp/source/src/app/components/Apis/Details/Configuration/components/AIBackendRateLimiting/CommonRateLimitingForm.jsx

@@ -45,8 +45,8 @@ export default function CommonRateLimitingForm(props) {
  function validateValue(value) {
  const validity = commonFormProps.validator ?
  commonFormProps.validator.validate(value, { abortEarly: false }).error
- : APIValidation.isReqNumber.validate(value, { abortEarly: false }).error;
- if (validity === null) {
+ : APIValidation.isNumber.validate(value, { abortEarly: false }).error;
+ if (validity === null || !value) {
  setIsValueValid(true);
  configDispatcher({ action: 'saveButtonDisabled', value: false });
  } else {

portals/publisher/src/main/webapp/source/src/app/components/Apis/Details/Configuration/components/AIBackendRateLimiting/RequestCountRateLimit.jsx

@@ -0,0 +1,82 @@
+/*
+ * Copyright (c) 2024, WSO2 LLC. (http://www.wso2.org) All Rights Reserved.
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Grid, InputAdornment, TextField } from '@mui/material';
+import { useIntl } from 'react-intl';
+
+import { isRestricted } from 'AppData/AuthManager';
+import RequestCountRateLimitUnit from './RequestCountRateLimitUnit';
+
+
+export default function RequestCountRateLimit(props) {
+
+ const { api, configDispatcher, isProduction } = props;
+ const intl = useIntl();
+ let maxTpsValue;
+ if (api.maxTps) {
+ maxTpsValue = isProduction ? api.maxTps.production : api.maxTps.sandbox;
+ } else {
+ maxTpsValue = '';
+ }
+
+ return (<>
+ <Grid item xs={12} style={{ marginBottom: 10, position: 'relative' }}>
+ <TextField
+ label={isProduction ? intl.formatMessage({
+ id: 'Apis.Details.Configuration.components.MaxBackendTps.max.'
+ + 'throughput.specify.max.prod.tps',
+ defaultMessage: 'Max Production TPS',
+ }) : intl.formatMessage({
+ id: 'Apis.Details.Configuration.components.MaxBackendTps.max.'
+ + 'throughput.specify.max.sandbox.tps',
+ defaultMessage: 'Max Sandbox TPS',
+ })}
+ margin='normal'
+ variant='outlined'
+ onChange={(event) => {
+ const value = isProduction ?
+ { ...api.maxTps, production: event.target.value } :
+ { ...api.maxTps, sandbox: event.target.value };
+ configDispatcher({
+ action: 'maxTps',
+ value,
+ });
+ }}
+ value={api.maxTps !== null ? maxTpsValue : ''}
+ disabled={isRestricted(['apim:api_create'], api)}
+ InputProps={{
+ endAdornment: <InputAdornment position='end'>
+ <RequestCountRateLimitUnit
+ api={api}
+ configDispatcher={configDispatcher}
+ isProduction={isProduction}
+ />
+ </InputAdornment>,
+ }}
+ />
+ </Grid>
+ </>);
+}
+
+RequestCountRateLimit.propTypes = {
+ api: PropTypes.shape({}).isRequired,
+ configDispatcher: PropTypes.func.isRequired,
+ isProduction: PropTypes.bool.isRequired,
+};

portals/publisher/src/main/webapp/source/src/app/components/Apis/Details/Configuration/components/AIBackendRateLimiting/RequestCountRateLimitUnit.jsx

@@ -0,0 +1,92 @@
+/*
+ * Copyright (c) 2024, WSO2 LLC. (http://www.wso2.org) All Rights Reserved.
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { MenuItem, TextField } from '@mui/material';
+
+// time unit enum
+const timeUnitEnum = {
+ SECOND: 'SECOND',
+ MINUTE: 'MINUTE',
+ HOUR: 'HOUR',
+};
+
+export default function RequestCountRateLimitUnit(props) {
+ const { api, configDispatcher, isProduction } = props; //eslint-disable-line
+ // const intl = useIntl();
+
+ let maxTpsUnitValue;
+ if (api.maxTps) {
+ maxTpsUnitValue = isProduction ? api.maxTps.productionTimeUnit : api.maxTps.sandboxTimeUnit;
+ }
+
+ if (!maxTpsUnitValue) {
+ maxTpsUnitValue = timeUnitEnum.SECOND;
+ }
+
+ return (
+ <>
+ <TextField
+ label='Time Unit'
+ id='time-unit-selector'
+ value={maxTpsUnitValue}
+ select
+ SelectProps={{
+ MenuProps: {
+ anchorOrigin: {
+ vertical: 'bottom',
+ horizontal: 'left',
+ },
+ getContentAnchorEl: null,
+ },
+ }}
+ name='selectTimeUnit'
+ onChange={(event) => {
+ const value = isProduction ?
+ { ...api.maxTps, productionTimeUnit: event.target.value } :
+ { ...api.maxTps, sandboxTimeUnit: event.target.value };
+ configDispatcher({
+ action: 'maxTps',
+ value,
+ });
+ }}
+ margin='none'
+ variant='standard'
+ sx={{
+ '& .MuiInputBase-root': {
+ '&:before': { borderBottom: 'none' }, // Remove underline
+ '&:after': { borderBottom: 'none' }, // Remove underline
+ },
+ }}
+ >
+ {Object.keys(timeUnitEnum).map((unit) => (
+ <MenuItem key={unit} value={unit}>
+ {unit}
+ </MenuItem>
+ ))}
+ </TextField>
+ </>
+ );
+}
+
+RequestCountRateLimitUnit.propTypes = {
+ api: PropTypes.shape({}).isRequired,
+ configDispatcher: PropTypes.func.isRequired,
+ isProduction: PropTypes.bool.isRequired,
+};

portals/publisher/src/main/webapp/source/src/app/components/Apis/Details/Endpoints/EndpointOverview.jsx

@@ -288,6 +288,10 @@ function EndpointOverview(props) {
  supportedEndpointTypes = [
  { key: 'http', value: 'HTTP/REST Endpoint' },
  ];
+ } else if (type === 'http' && api.aiConfiguration) {
+ supportedEndpointTypes = [
+ { key: 'http', value: 'HTTP/REST Endpoint' },
+ ]
  } else {
  supportedEndpointTypes = [
  { key: 'http', value: 'HTTP/REST Endpoint' },
@@ -727,7 +731,22 @@ function EndpointOverview(props) {
  value={endpointType.key === 'MOCKED_OAS' ? 'INLINE' : endpointType.key}
  onChange={handleEndpointTypeSelect}
  >
- {supportedEnpointTypes.map((endpoint) => {
+ {!api.aiConfiguration && supportedEnpointTypes.map((endpoint) => {
+ return (
+ <FormControlLabel
+ value={endpoint.key}
+ control={(
+ <Radio
+ disabled={(isRestricted(['apim:api_create'], api))}
+ color='primary'
+ id={endpoint.key}
+ />
+ )}
+ label={endpoint.value}
+ />
+ );
+ })}
+ {api.aiConfiguration && supportedEnpointTypes.map((endpoint) => {
  return (
  <FormControlLabel
  value={endpoint.key}

portals/publisher/src/main/webapp/source/src/app/components/Apis/Details/Endpoints/Endpoints.jsx

@@ -506,7 +506,7 @@ function Endpoints(props) {
  api.getSwagger(apiObject.id).then((resp) => {
  setSwagger(resp.obj);
  }).catch((err) => {
- console.err(err);
+ console.error(err);
  });
  }
  }, []);

portals/publisher/src/main/webapp/source/src/app/data/APIValidation.js

@@ -198,7 +198,7 @@ const definition = {
  websubOperationTarget: Joi.string().regex(/^[^{}]*$/).required(),
  name: Joi.string().min(1).max(255),
  email: Joi.string().email({ tlds: false }).required(),
- isReqNumber: Joi.number().required(),
+ isNumber: Joi.number(),
 };
 
 export default definition;