ben.carrasco/jambonz-webapp
1
0
Fork 0
mirror of https://github.com/jambonz/jambonz-webapp.git synced 2026-07-04 19:21:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

changes to enable/disable direct calling from chrome extension (#342)

Browse Source 
* changes to enable/disable direct calling from chrome extension

* wip

* wip

* wip

---------

Co-authored-by: Quan HL <quan.luuhoang8@gmail.com>
This commit is contained in:
Dave Horton
2023-11-06 09:34:33 -05:00
committed by GitHub
parent 2e9b86c0c4
commit f031c47228
12 changed files with 130 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/api/types.ts
+3
View File
@@ -522,6 +522,9 @@ export interface Client {
username: null | string;
password?: null | string;
is_active: boolean;
allow_direct_app_calling: boolean;
allow_direct_queue_calling: boolean;
allow_direct_user_calling: boolean;
}
export interface PageQuery {
src/containers/internal/views/accounts/form.tsx
+3 -1
View File
@@ -693,7 +693,9 @@ export const AccountForm = ({
{isDeleteAccount && (
<Section slim>
<form
className="form form--internal"
className={`form form--internal ${
!account?.data && account?.refetch ? "form--blur" : ""
}`}
onSubmit={handleDeleteAccount}
>
<fieldset>
src/containers/internal/views/applications/form.tsx
+6 -1
View File
@@ -550,7 +550,12 @@ export const ApplicationForm = ({ application }: ApplicationFormProps) => {
return (
<Section slim>
<form className="form form--internal" onSubmit={handleSubmit}>
<form
className={`form form--internal ${
!application?.data && application?.refetch ? "form--blur" : ""
}`}
onSubmit={handleSubmit}
>
<fieldset>
<MS>{MSG_REQUIRED_FIELDS}</MS>
</fieldset>
src/containers/internal/views/carriers/form.tsx
+6 -1
View File
@@ -639,7 +639,12 @@ export const CarrierForm = ({
return (
<Section slim>
<form className="form form--internal" onSubmit={handleSubmit}>
<form
className={`form form--internal ${
!carrier?.data && carrier?.refetch ? "form--blur" : ""
}`}
onSubmit={handleSubmit}
>
<fieldset>
<MS>{MSG_REQUIRED_FIELDS}</MS>
</fieldset>
src/containers/internal/views/clients/edit.tsx
+4 -1
View File
@@ -1,13 +1,15 @@
import { H1 } from "@jambonz/ui-kit";
import React, { useEffect } from "react";
import { useParams } from "react-router-dom";
import { useNavigate, useParams } from "react-router-dom";
import { useApiData } from "src/api";
import { Client } from "src/api/types";
import { toastError } from "src/store";
import ClientsForm from "./form";
import { ROUTE_INTERNAL_CLIENTS } from "src/router/routes";
export const ClientsEdit = () => {
const params = useParams();
const navigate = useNavigate();
const [data, refetch, error] = useApiData<Client>(
`Clients/${params.client_sid}`
);
@@ -16,6 +18,7 @@ export const ClientsEdit = () => {
useEffect(() => {
if (error) {
toastError(error.msg);
navigate(ROUTE_INTERNAL_CLIENTS);
}
}, [error]);
src/containers/internal/views/clients/form.tsx
+74 -16
View File
@@ -9,7 +9,7 @@ import {
} from "src/api";
import { USER_ACCOUNT } from "src/api/constants";
import { Account, Client, UseApiDataMap } from "src/api/types";
import { Section } from "src/components";
import { Section, Tooltip } from "src/components";
import { AccountSelect, Message, Passwd } from "src/components/forms";
import { MSG_REQUIRED_FIELDS } from "src/constants";
import { ROUTE_INTERNAL_CLIENTS } from "src/router/routes";
@@ -30,7 +30,12 @@ export const ClientsForm = ({ client }: ClientsFormProps) => {
const [accountSid, setAccountSid] = useState("");
const [password, setPassword] = useState("");
const [username, setUsername] = useState("");
const [isActive, setIsActive] = useState(true);
const [isActive, setIsActive] = useState(
client ? client.data?.is_active : true
);
const [allowDirectAppCalling, setAllowDirectAppCalling] = useState(true);
const [allowDirectQueueCalling, setAllowDirectQueueCalling] = useState(true);
const [allowDirectUserCalling, setAllowDirectUserCalling] = useState(true);
const [modal, setModal] = useState(false);
const [errorMessage, setErrorMessage] = useState("");
const handleSubmit = (e: React.FormEvent) => {
@@ -42,6 +47,9 @@ export const ClientsForm = ({ client }: ClientsFormProps) => {
username: username,
password: password,
is_active: isActive,
allow_direct_app_calling: allowDirectAppCalling,
allow_direct_queue_calling: allowDirectQueueCalling,
allow_direct_user_calling: allowDirectUserCalling,
})
.then(() => {
toastSuccess("Client created successfully");
@@ -56,6 +64,9 @@ export const ClientsForm = ({ client }: ClientsFormProps) => {
username: username,
...(password && { password: password }),
is_active: isActive,
allow_direct_app_calling: allowDirectAppCalling,
allow_direct_queue_calling: allowDirectQueueCalling,
allow_direct_user_calling: allowDirectUserCalling,
})
.then(() => {
toastSuccess("Client updated successfully");
@@ -99,6 +110,9 @@ export const ClientsForm = ({ client }: ClientsFormProps) => {
}
setIsActive(client.data.is_active);
setAllowDirectAppCalling(client.data.allow_direct_app_calling);
setAllowDirectQueueCalling(client.data.allow_direct_queue_calling);
setAllowDirectUserCalling(client.data.allow_direct_user_calling);
}
}, [client]);
@@ -114,7 +128,12 @@ export const ClientsForm = ({ client }: ClientsFormProps) => {
return (
<>
<Section slim>
<form className="form form--internal" onSubmit={handleSubmit}>
<form
className={`form form--internal ${
!client?.data && client?.refetch ? "form--blur" : ""
}`}
onSubmit={handleSubmit}
>
<fieldset>
<MS>{MSG_REQUIRED_FIELDS}</MS>
{errorMessage && <Message message={errorMessage} />}
@@ -136,18 +155,6 @@ export const ClientsForm = ({ client }: ClientsFormProps) => {
/>
</div>
</div>
<label htmlFor="is_active" className="chk">
<input
id="is_active"
name="is_active"
type="checkbox"
checked={isActive}
onChange={(e) => setIsActive(e.target.checked)}
/>
<div>Active</div>
</label>
</fieldset>
<fieldset>
<label htmlFor="password">
Password{!hasValue(client) && <span>*</span>}
</label>
@@ -160,12 +167,63 @@ export const ClientsForm = ({ client }: ClientsFormProps) => {
setValue={setPassword}
/>
</fieldset>
<fieldset>
<label htmlFor="is_active" className="chk">
<input
id="is_active"
name="is_active"
type="checkbox"
checked={isActive}
onChange={(e) => setIsActive(e.target.checked)}
/>
<div>Active</div>
</label>
<label htmlFor="allow_direct_app_calling" className="chk">
<input
id="allow_direct_app_calling"
name="allow_direct_app_calling"
type="checkbox"
checked={allowDirectAppCalling}
onChange={(e) => setAllowDirectAppCalling(e.target.checked)}
/>
<div>Allow direct calling to applications</div>
<Tooltip text="Allow user to call applications without configuring an application for sip device calls.">
{" "}
</Tooltip>
</label>
<label htmlFor="allow_direct_queue_calling" className="chk">
<input
id="allow_direct_queue_calling"
name="allow_direct_queue_calling"
type="checkbox"
checked={allowDirectQueueCalling}
onChange={(e) => setAllowDirectQueueCalling(e.target.checked)}
/>
<div>Allow direct calling to queues</div>
<Tooltip text="Allow user to take calls from queues without configuring an application for sip device calls.">
{" "}
</Tooltip>
</label>
<label htmlFor="allow_direct_user_calling" className="chk">
<input
id="allow_direct_user_calling"
name="allow_direct_user_calling"
type="checkbox"
checked={allowDirectUserCalling}
onChange={(e) => setAllowDirectUserCalling(e.target.checked)}
/>
<div>Allow direct calling to other users</div>
<Tooltip text="Allow user to call other users without configuring an application for sip device calls.">
{" "}
</Tooltip>
</label>
</fieldset>
{user?.scope !== USER_ACCOUNT && (
<fieldset>
<AccountSelect
accounts={accounts}
account={[accountSid, setAccountSid]}
label="Used by"
label="Belongs to"
required={true}
defaultOption={false}
disabled={hasValue(client)}
src/containers/internal/views/least-cost-routing/form.tsx
+6 -1
View File
@@ -449,7 +449,12 @@ export const LcrForm = ({ lcrDataMap, lcrRouteDataMap }: LcrFormProps) => {
return (
<>
<Section slim>
<form className="form form--internal" onSubmit={handleSubmit}>
<form
className={`form form--internal ${
!lcrDataMap?.data && lcrDataMap?.refetch ? "form--blur" : ""
}`}
onSubmit={handleSubmit}
>
<fieldset>
<MS>{MSG_REQUIRED_FIELDS}</MS>
{errorMessage && <Message message={errorMessage} />}
src/containers/internal/views/ms-teams-tenants/form.tsx
+6 -1
View File
@@ -120,7 +120,12 @@ export const MsTeamsTenantForm = ({
return (
<Section slim>
<form className="form form--internal" onSubmit={handleSubmit}>
<form
className={`form form--internal ${
!msTeamsTenant?.data && msTeamsTenant?.refetch ? "form--blur" : ""
}`}
onSubmit={handleSubmit}
>
<fieldset>
<MS>{MSG_REQUIRED_FIELDS}</MS>
</fieldset>
src/containers/internal/views/phone-numbers/form.tsx
+6 -1
View File
@@ -141,7 +141,12 @@ export const PhoneNumberForm = ({ phoneNumber }: PhoneNumberFormProps) => {
return (
<>
<Section slim>
<form className="form form--internal" onSubmit={handleSubmit}>
<form
className={`form form--internal ${
!phoneNumber?.data && phoneNumber?.refetch ? "form--blur" : ""
}`}
onSubmit={handleSubmit}
>
<fieldset>
<MS>{MSG_REQUIRED_FIELDS}</MS>
</fieldset>
src/containers/internal/views/speech-services/form.tsx
+6 -1
View File
@@ -522,7 +522,12 @@ export const SpeechServiceForm = ({ credential }: SpeechServiceFormProps) => {
return (
<Section slim>
<form className="form form--internal" onSubmit={handleSubmit}>
<form
className={`form form--internal ${
!credential?.data && credential?.refetch ? "form--blur" : ""
}`}
onSubmit={handleSubmit}
>
<fieldset>
<MS>{MSG_REQUIRED_FIELDS}</MS>
</fieldset>
src/containers/internal/views/users/form.tsx
+6 -1
View File
@@ -183,7 +183,12 @@ export const UserForm = ({ user }: UserFormProps) => {
return (
<>
<Section slim>
<form className="form form--internal" onSubmit={handleSubmit}>
<form
className={`form form--internal ${
!user?.data && user?.refetch ? "form--blur" : ""
}`}
onSubmit={handleSubmit}
>
<fieldset>
<MS>{MSG_REQUIRED_FIELDS}</MS>
</fieldset>
src/styles/_forms.scss
+4
View File
@@ -105,6 +105,10 @@ fieldset {
}
}
&--blur {
pointer-events: none;
}
label {
@include ui-mixins.m();
@include ui-mixins.font-medium();