Skip to content

Commit 6004522

Browse files
raktima-opensignlabsraktima-opensignlabs
committed
feat: change radio widgets name radio to radio button
1 parent 73b2ba6 commit 6004522

File tree

9 files changed

+70
-45
lines changed

9 files changed

+70
-45
lines changed

‎apps/OpenSign/src/components/pdf/DropdownWidgetOption.js‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React, { useEffect, useState } from "react";
22
import { themeColor } from "../../constant/const";
33
import ModalUi from "../../primitives/ModalUi";
4+
import { radioButtonWidget } from "../../constant/Utils";
45
function DropdownWidgetOption(props) {
56
const [dropdownOptionList, setDropdownOptionList] = useState([
67
"option-1",
@@ -143,7 +144,7 @@ function DropdownWidgetOption(props) {
143144
// styleClass={"dropdownModal"}
144145
isOpen={props.showDropdown}
145146
title={props.title}
146-
closeOff={true}
147+
showClose={false}
147148
>
148149
<div style={{ height: "100%", padding: 20 }}>
149150
<form
@@ -153,7 +154,7 @@ function DropdownWidgetOption(props) {
153154
}}
154155
>
155156
<div className="dropdownContainer">
156-
{["checkbox", "radio"].includes(props.type) &&
157+
{["checkbox", radioButtonWidget].includes(props.type) &&
157158
!props.isSignYourself && (
158159
<div>
159160
<input
@@ -285,7 +286,7 @@ function DropdownWidgetOption(props) {
285286
</>
286287
)}
287288
</div>
288-
{["dropdown", "radio"].includes(props.type) && (
289+
{["dropdown", radioButtonWidget].includes(props.type) && (
289290
<>
290291
<label
291292
style={{
@@ -320,7 +321,7 @@ function DropdownWidgetOption(props) {
320321
</select>
321322
</>
322323
)}
323-
{props.type !== "checkbox" && props.type !== "radio" && (
324+
{props.type !== "checkbox" && props.type !== radioButtonWidget && (
324325
<>
325326
<div
326327
style={{

‎apps/OpenSign/src/components/pdf/Placeholder.js‎

Lines changed: 27 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import {
66
defaultWidthHeight,
77
isMobile,
88
onChangeInput,
9+
radioButtonWidget,
910
textInputWidget,
1011
textWidget
1112
} from "../../constant/Utils";
@@ -232,7 +233,7 @@ function Placeholder(props) {
232233

233234
//function to set state value of onclick on widget's setting icon
234235
const handleWidgetsOnclick = () => {
235-
if (props.pos.type === "radio") {
236+
if (props.pos.type === radioButtonWidget) {
236237
props.setIsRadio(true);
237238
} else if (props.pos.type === "dropdown") {
238239
props?.setShowDropdown(true);
@@ -335,10 +336,14 @@ function Placeholder(props) {
335336
className="fa-solid fa-gear settingIcon"
336337
style={{
337338
color: "#188ae2",
338-
right: ["checkbox", "radio"].includes(props.pos.type)
339+
right: ["checkbox", radioButtonWidget].includes(
340+
props.pos.type
341+
)
339342
? "24px"
340343
: "47px",
341-
top: ["checkbox", "radio"].includes(props.pos.type)
344+
top: ["checkbox", radioButtonWidget].includes(
345+
props.pos.type
346+
)
342347
? "-28px"
343348
: "-19px"
344349
}}
@@ -364,12 +369,12 @@ function Placeholder(props) {
364369
color: "#188ae2",
365370
right:
366371
props.pos.type === "checkbox" ||
367-
props.pos.type === "radio"
372+
props.pos.type === radioButtonWidget
368373
? "8px"
369374
: "32px",
370375
top:
371376
props.pos.type === "checkbox" ||
372-
props.pos.type === "radio"
377+
props.pos.type === radioButtonWidget
373378
? "-28px"
374379
: "-18px"
375380
}}
@@ -457,11 +462,13 @@ function Placeholder(props) {
457462
style={{
458463
color: "#188ae2",
459464
right:
460-
props.pos.type === "checkbox" || props.pos.type === "radio"
465+
props.pos.type === "checkbox" ||
466+
props.pos.type === radioButtonWidget
461467
? "-9px"
462468
: "12px",
463469
top:
464-
props.pos.type === "checkbox" || props.pos.type === "radio"
470+
props.pos.type === "checkbox" ||
471+
props.pos.type === radioButtonWidget
465472
? "-28px"
466473
: "-18px"
467474
}}
@@ -490,11 +497,13 @@ function Placeholder(props) {
490497
style={{
491498
color: "#188ae2",
492499
right:
493-
props.pos.type === "checkbox" || props.pos.type === "radio"
500+
props.pos.type === "checkbox" ||
501+
props.pos.type === radioButtonWidget
494502
? "-27px"
495503
: "-8px",
496504
top:
497-
props.pos.type === "checkbox" || props.pos.type === "radio"
505+
props.pos.type === "checkbox" ||
506+
props.pos.type === radioButtonWidget
498507
? "-28px"
499508
: "-18px"
500509
}}
@@ -526,10 +535,10 @@ function Placeholder(props) {
526535
props.data && props.isNeedSign
527536
? props.data?.signerObjId === props.signerObjId &&
528537
props.pos.type !== "checkbox" &&
529-
props.pos.type !== "radio"
538+
props.pos.type !== radioButtonWidget
530539
? true
531540
: false
532-
: props.pos.type !== "radio" &&
541+
: props.pos.type !== radioButtonWidget &&
533542
props.pos.type !== "checkbox" &&
534543
props.pos.key === props.selectWidgetId &&
535544
true,
@@ -614,31 +623,33 @@ function Placeholder(props) {
614623
}}
615624
>
616625
{props.isShowBorder &&
617-
props.pos.type !== "radio" &&
626+
props.pos.type !== radioButtonWidget &&
618627
props.pos.type !== "checkbox" &&
619628
props.pos.key === props.selectWidgetId ? (
620629
<BorderResize
621630
right={
622-
props.pos.type === "checkbox" || props.pos.type === "radio"
631+
props.pos.type === "checkbox" ||
632+
props.pos.type === radioButtonWidget
623633
? -21
624634
: -12
625635
}
626636
top={
627-
props.pos.type === "checkbox" || props.pos.type === "radio"
637+
props.pos.type === "checkbox" ||
638+
props.pos.type === radioButtonWidget
628639
? -21
629640
: -11
630641
}
631642
/>
632643
) : props.data && props.isNeedSign && props.pos.type !== "checkbox" ? (
633644
props.data?.signerObjId === props.signerObjId &&
634-
props.pos.type !== "radio" &&
645+
props.pos.type !== radioButtonWidget &&
635646
props.pos.type !== "checkbox" ? (
636647
<BorderResize />
637648
) : (
638649
<></>
639650
)
640651
) : (
641-
props.pos.type !== "radio" &&
652+
props.pos.type !== radioButtonWidget &&
642653
props.pos.type !== "checkbox" &&
643654
props.pos.key === props.selectWidgetId && <BorderResize />
644655
)}

‎apps/OpenSign/src/components/pdf/PlaceholderBorder.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,12 @@ import React from "react";
22
import { themeColor } from "../../constant/const";
33
import {
44
defaultWidthHeight,
5+
radioButtonWidget,
56
resizeBorderExtraWidth
67
} from "../../constant/Utils";
78
function PlaceholderBorder(props) {
89
const getResizeBorderExtraWidth =
9-
props.pos.type === "checkbox" || props.pos.type === "radio"
10+
props.pos.type === "checkbox" || props.pos.type === radioButtonWidget
1011
? 38
1112
: resizeBorderExtraWidth();
1213
const defaultWidth = defaultWidthHeight(props.pos.type).width;

‎apps/OpenSign/src/components/pdf/PlaceholderType.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import {
33
getMonth,
44
getYear,
55
onChangeInput,
6+
radioButtonWidget,
67
range,
78
textInputWidget,
89
textWidget
@@ -700,7 +701,7 @@ function PlaceholderType(props) {
700701
<span>{type}</span>
701702
</div>
702703
);
703-
case "radio":
704+
case radioButtonWidget:
704705
return (
705706
<div>
706707
{props.pos.options?.values.map((data, ind) => {

‎apps/OpenSign/src/components/pdf/WidgetComponent.js‎

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,12 @@ import ModalUi from "../../primitives/ModalUi";
33
import RecipientList from "./RecipientList";
44
import { useDrag } from "react-dnd";
55
import WidgetList from "./WidgetList";
6-
import { textInputWidget, textWidget, widgets } from "../../constant/Utils";
6+
import {
7+
radioButtonWidget,
8+
textInputWidget,
9+
textWidget,
10+
widgets
11+
} from "../../constant/Utils";
712
import { themeColor } from "../../constant/const";
813
function WidgetComponent({
914
dragSignature,
@@ -152,16 +157,16 @@ function WidgetComponent({
152157
isDragEmail: !!monitor.isDragging()
153158
})
154159
});
155-
const [, radio] = useDrag({
160+
const [, radioButton] = useDrag({
156161
type: "BOX",
157162

158163
item: {
159164
type: "BOX",
160165
id: 15,
161-
text: "radio"
166+
text: radioButtonWidget
162167
},
163168
collect: (monitor) => ({
164-
isDragRadio: !!monitor.isDragging()
169+
isDragRadiotton: !!monitor.isDragging()
165170
})
166171
});
167172
const [, text] = useDrag({
@@ -211,7 +216,7 @@ function WidgetComponent({
211216
textInput,
212217
checkbox,
213218
dropdown,
214-
radio,
219+
radioButton,
215220
image,
216221
email
217222
];
@@ -227,7 +232,7 @@ function WidgetComponent({
227232
const filterWidgets = widget.filter(
228233
(data) =>
229234
data.type !== "dropdown" &&
230-
data.type !== "radio" &&
235+
data.type !== radioButtonWidget &&
231236
data.type !== textWidget
232237
);
233238
const textWidgetData = widget.filter((data) => data.type !== textWidget);

‎apps/OpenSign/src/constant/Utils.js‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { rgb } from "pdf-lib";
77
export const isMobile = window.innerWidth < 767;
88
export const textInputWidget = "text input";
99
export const textWidget = "text";
10+
export const radioButtonWidget = "radio button";
1011
export const openInNewTab = (url) => {
1112
window.open(url, "_blank", "noopener,noreferrer");
1213
};
@@ -204,7 +205,7 @@ export const widgets = [
204205
iconSize: "19px"
205206
},
206207
{
207-
type: "radio",
208+
type: radioButtonWidget,
208209
icon: "fa-regular fa-circle-dot",
209210
iconSize: "20px"
210211
},
@@ -260,7 +261,7 @@ export const addWidgetOptions = (type) => {
260261
return { ...defaultOpt, validation: { type: "email", pattern: "" } };
261262
case "dropdown":
262263
return defaultOpt;
263-
case "radio":
264+
case radioButtonWidget:
264265
return { ...defaultOpt, values: [] };
265266
case textWidget:
266267
return defaultOpt;
@@ -346,7 +347,7 @@ export const defaultWidthHeight = (type) => {
346347
return { width: 70, height: 70 };
347348
case "email":
348349
return { width: 150, height: 20 };
349-
case "radio":
350+
case radioButtonWidget:
350351
return { width: 15, height: 30 };
351352
case textWidget:
352353
return { width: 150, height: 17 };
@@ -1078,7 +1079,7 @@ export const multiSignEmbed = async (
10781079
? labelDefaultHeight
10791080
: scaleHeight;
10801081
const widgetHeight =
1081-
position.type === "radio"
1082+
position.type === radioButtonWidget
10821083
? 10
10831084
: position.type === "checkbox"
10841085
? 10
@@ -1272,7 +1273,7 @@ export const multiSignEmbed = async (
12721273
height: scaleHeight
12731274
});
12741275
dropdown.enableReadOnly();
1275-
} else if (position.type === "radio") {
1276+
} else if (position.type === radioButtonWidget) {
12761277
const radioRandomId = "radio" + randomId();
12771278
const radioGroup = form.createRadioGroup(radioRandomId);
12781279
let addYPosition = 18;

‎apps/OpenSign/src/pages/PdfRequestFiles.js‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,8 @@ import {
1919
onImageSelect,
2020
onSaveSign,
2121
onSaveImage,
22-
addDefaultSignatureImg
22+
addDefaultSignatureImg,
23+
radioButtonWidget
2324
} from "../constant/Utils";
2425
import Loader from "../primitives/LoaderWithMsg";
2526
import HandleError from "../primitives/HandleError";
@@ -385,7 +386,8 @@ function PdfRequestFiles() {
385386
for (let j = 0; j < checkUser[0].placeHolder[i].pos.length; j++) {
386387
checkboxExist =
387388
checkUser[0].placeHolder[i].pos[j].type === "checkbox";
388-
radioExist = checkUser[0].placeHolder[i].pos[j].type === "radio";
389+
radioExist =
390+
checkUser[0].placeHolder[i].pos[j].type === radioButtonWidget;
389391
if (checkboxExist) {
390392
requiredCheckbox = checkUser[0].placeHolder[i].pos.filter(
391393
(position) =>
@@ -434,7 +436,8 @@ function PdfRequestFiles() {
434436
} else if (radioExist) {
435437
requiredRadio = checkUser[0].placeHolder[i].pos.filter(
436438
(position) =>
437-
!position.options?.isReadOnly && position.type === "radio"
439+
!position.options?.isReadOnly &&
440+
position.type === radioButtonWidget
438441
);
439442
if (requiredRadio && requiredRadio?.length > 0) {
440443
let checkSigned;
@@ -457,7 +460,7 @@ function PdfRequestFiles() {
457460
const requiredWidgets = checkUser[0].placeHolder[i].pos.filter(
458461
(position) =>
459462
position.options?.status === "required" &&
460-
position.type !== "radio" &&
463+
position.type !== radioButtonWidget &&
461464
position.type !== "checkbox"
462465
);
463466
if (requiredWidgets && requiredWidgets?.length > 0) {

‎apps/OpenSign/src/pages/PlaceHolderSign.js‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,8 @@ import {
2626
multiSignEmbed,
2727
addWidgetOptions,
2828
textInputWidget,
29-
textWidget
29+
textWidget,
30+
radioButtonWidget
3031
} from "../constant/Utils";
3132
import RenderPdf from "../components/pdf/RenderPdf";
3233
import { useNavigate } from "react-router-dom";
@@ -484,7 +485,7 @@ function PlaceHolderSign() {
484485
setShowDropdown(true);
485486
} else if (dragTypeValue === "checkbox") {
486487
setIsCheckbox(true);
487-
} else if (dragTypeValue === "radio") {
488+
} else if (dragTypeValue === radioButtonWidget) {
488489
setIsRadio(true);
489490
} else if (
490491
dragTypeValue !== textWidget &&
@@ -1070,7 +1071,7 @@ function PlaceHolderSign() {
10701071
const getPosData = getXYdata;
10711072
const addSignPos = getPosData.map((position) => {
10721073
if (position.key === signKey) {
1073-
if (widgetType === "radio") {
1074+
if (widgetType === radioButtonWidget) {
10741075
if (addOption) {
10751076
return {
10761077
...position,
@@ -1563,7 +1564,7 @@ function PlaceHolderSign() {
15631564
setTempSignerId={setTempSignerId}
15641565
/>
15651566
<DropdownWidgetOption
1566-
type="radio"
1567+
type={radioButtonWidget}
15671568
title="Radio group"
15681569
showDropdown={isRadio}
15691570
setShowDropdown={setIsRadio}

0 commit comments

Comments
 (0)