mcode-react-helper
v1.0.4
Published
all mcode global common function
Downloads
7
Readme
Debouncing Function
Description
The debouncing
function is used to debounce any function, allowing you to limit how frequently a function is called over a certain period of time.
Usage
To use the debouncing
function, you can pass in the callback function you want to debounce, along with any arguments it requires and the debounce time. For example, suppose you have a search input field in your React application and you want to limit how frequently the search function fires as the user types. You can use the debouncing
function to achieve this. Here's an example:
export const debouncing = ({ args, callback, time = 300 }) => {
const timerId = setTimeout(() => {
callback(args);
}, time);
return { timerId };
};
// Example usage
const { timerId } = debouncing({ args: 'searchQuery', callback: getSliderData, time: 300 });
// Clear the timer if needed
return () => {
clearTimeout(timerId);
};
image supported format check Function
Description
This file describes the isSupportedImageFormat
function used to identify basic image formats based on their magic bytes..
Explanation:
-> This function takes a buffer containing image data as input. -> It checks the buffer for magic bytes that identify common image formats: PNG, JPG/JPEG, and GIF. -> Magic bytes are the initial few bytes in an image file that indicate its format. -> The function uses a dictionary called magicBytes to store the expected magic byte sequences for each supported format. -> It iterates through each format and checks if the first bytes of the buffer match the corresponding magic bytes using the every method. -> If a match is found, the function returns true, indicating a supported format. -> If none of the checks match, the function returns false, indicating an unsupported format.
const buffer = // Your image data buffer
const isSupported = isSupportedImageFormat(buffer);
if (isSupported) {
console.log("Supported image format (PNG, JPG/JPEG, or GIF)");
} else {
console.log("Unsupported image format");
}
Note:
-> This method only performs a basic check based on magic bytes and doesn't guarantee complete image validity or handle corrupted files. -> Consider using image processing libraries for more robust image validation if needed.
randomStr Function
Description
The randomStr
function generates a random string of a specified length.
Installation
This function is a standalone JavaScript function and can be used in any JavaScript project. Simply copy the function into your codebase.
Usage
To use the randomStr
function, call it with the desired length of the random string as an argument. For example:
const randomString = randomStr(10);
console.log(randomString);
Output:
e.g., "aB3$Z7tK"
HyperLink Function
Description
The HyperLink
function extracts the domain from a URL and returns a hyperlink string.
Usage
To use the HyperLink
function, call it with a URL string as an argument. For example:
const url = 'https://www.example.com/page';
const hyperlink = HyperLink(url);
console.log(hyperlink);
Output:
e.g.,"https://example.com/page"
generateGridId Function
Description
The generateGridId
function adds a serial number (sNo
) to each item in a grid based on the current page and page size.
Usage
To use the generateGridId
function, call it with the current page number, page size, and the grid data as arguments. For example:
const page = 1;
const pageSize = 10;
const gridData = [{ name: 'John' }, { name: 'Jane' }, { name: 'Doe' }];
const gridWithIds = generateGridId(page, pageSize, gridData);
console.log(gridWithIds);
Output:
[
{ "name": "John", "sNo": 1 },
{ "name": "Jane", "sNo": 2 },
{ "name": "Doe", "sNo": 3 }
]
maxLengthCheck Function
Description
The maxLengthCheck
function checks the length of an input value and truncates it if it exceeds the maximum length specified in the input element.
Usage
To use the maxLengthCheck
function, pass the event object containing the target input element. For example:
const inputElement = document.getElementById('myInput');
inputElement.addEventListener('input', (event) => {
maxLengthCheck(event);
});
Example
Assuming the input element has a maxLength attribute of 10:
- Input: "Hello, world!"
- Output: "Hello, worl"
truncateString Function
Description
The truncateString
function truncates a string if it exceeds a specified length and appends ellipsis (...) to the end.
Usage
To use the truncateString
function, pass the string and the maximum length as arguments. For example:
const str = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.';
const truncated = truncateString(str, 20);
console.log(truncated);
Output:
"Lorem ipsum dolor si..."
isNullish Function
Description
The isNullish
function checks if a value is either undefined
or null
.
Usage
To use the isNullish
function, pass the value you want to check. For example:
const value1 = null;
const value2 = undefined;
console.log(isNullish(value1)); // Output: true
console.log(isNullish(value2)); // Output: true
console.log(isNullish('Hello')); // Output: false
isEmpty Function
Description
The isEmpty
function removes nullish values (undefined or null) from an object and returns a new object without those values.
Usage
To use the isEmpty
function, pass an object as the argument. For example:
const obj = {
name: 'John',
age: null,
city: 'New York',
country: undefined
};
const cleanedObj = isEmpty(obj);
console.log(cleanedObj);
Output:
{
"name": "John",
"city": "New York"
}
getYoutubeVideoId Function
Description
The getYoutubeVideoId
function extracts the video ID from a YouTube video URL.
Usage
To use the getYoutubeVideoId
function, pass a YouTube video URL as the argument. For example:
const uri = 'https://www.youtube.com/watch?v=dQw4w9WgXcQ';
const videoId = getYoutubeVideoId(uri);
console.log(videoId);
Output
"dQw4w9WgXcQ"
dataURLtoBlob Function
Description
The dataURLtoBlob
function converts a data URL to a Blob object.
Usage
To use the dataURLtoBlob
function, pass a data URL string as the argument. For example:
const dataURL = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA...';
const blob = dataURLtoBlob(dataURL);
console.log(blob);
isBase64 Function
Description
The isBase64
function checks if a string is a valid base64 string.
Usage
To use the isBase64
function, pass a string as the argument. For example:
const str1 = 'SGVsbG8gV29ybGQh'; // Valid base64 string
const str2 = 'Hello, World!'; // Not a valid base64 string
console.log(isBase64(str1)); // Output: true
console.log(isBase64(str2)); // Output: false
getDomainWithoutSubdomain Function
Description
The getDomainWithoutSubdomain
function extracts the domain name from a URL, removing any subdomains.
Usage
To use the getDomainWithoutSubdomain
function, pass a URL string as the argument. For example:
const url = 'https://www.example.com/page';
const domain = getDomainWithoutSubdomain(url);
console.log(domain);
Output
"example.com"
slugUrlConverter Function
Description
The slugUrlConverter
function converts a string to a URL-friendly slug format.
Usage
To use the slugUrlConverter
function, pass an object with a value
property as the argument. For example:
const input = { value: 'Hello World' };
const slug = slugUrlConverter(input);
console.log(slug);
output
"hello-world"
isCheckValue Function
Description
The isCheckValue
function checks if a value is not null, not undefined, and not an empty string.
Usage
To use the isCheckValue
function, pass an object with a value
property as the argument. For example:
const input = { value: 'Hello' };
console.log(isCheckValue(input)); // Output: true
const emptyInput = { value: '' };
console.log(isCheckValue(emptyInput)); // Output: false
removeUrlKeyInBGI Function
Description
The removeUrlKeyInBGI
function extracts the URL from a CSS background-image property value.
Usage
To use the removeUrlKeyInBGI
function, pass an object with a urlString
property as the argument. For example:
const input = { urlString: 'url("https://example.com/image.jpg")' };
const extractedUrl = removeUrlKeyInBGI(input);
console.log(extractedUrl);
output
"https://example.com/image.jpg"
convertRGBA Function
Description
The convertRGBA
function converts a CSS RGBA color string to an object format.
Usage
To use the convertRGBA
function, pass an object with an rgbString
property as the argument. For example:
const input = { rgbString: 'rgb(255 0 0 / 0.5)' };
const rgbaObject = convertRGBA(input);
console.log(rgbaObject);
output
{
"r": 255,
"g": 0,
"b": 0,
"a": 0.5
}
addUrlImage Function
Description
The addUrlImage
function formats a URL string as a CSS background image URL.
Usage
To use the addUrlImage
function, pass an object with a urlString
property as the argument. For example:
const input = { urlString: 'https://example.com/image.jpg' };
const bgImage = addUrlImage(input);
console.log(bgImage);
output
"url('https://example.com/image')"
isValidDomain Function
Description
The isValidDomain
function checks if a given string is a valid domain name.
Usage
To use the isValidDomain
function, pass a domain name string as the argument. For example:
console.log(isValidDomain('example.com'));
console.log(isValidDomain('example'));
output
Output: true
Output: false
setCookie Function
Description
The setCookie
function sets a cookie in the browser with the specified name, value, expiration days, and domain.
Usage
To use the setCookie
function, pass the name, value, expiration days, and optional domain as arguments. For example:
setCookie('myCookie', 'value', 7, '.example.com');
getCookie Function
Description
The getCookie
function retrieves the value of a cookie with the specified name.
Usage
To use the getCookie
function, pass the name of the cookie as an argument. For example:
const cookieValue = getCookie('myCookie');
console.log(cookieValue);
deleteCookie Function
Description
The deleteCookie
function deletes a cookie with the specified name and domain.
Usage
To use the deleteCookie
function, pass the name and domain of the cookie to be deleted as arguments. For example:
deleteCookie('myCookie', '.example.com');
setValueNull Function
Description
The setValueNull
function recursively sets all values in an object to null, except for arrays, which are set to empty arrays.
Usage
To use the setValueNull
function, pass an object as the argument. For example:
const obj = {
name: 'John',
age: 30,
address: {
city: 'New York',
country: 'USA'
}
};
const nullObj = setValueNull(obj);
console.log(nullObj);
output
{
"name": null,
"age": null,
"address": {
"city": null,
"country": null
}
}
setValueNullRedirect Function
Description
The setValueNullRedirect
function recursively sets all values in an object to an empty string, except for arrays, which are set to empty arrays.
Usage
To use the setValueNullRedirect
function, pass an object as the argument. For example:
const obj = {
name: 'John',
age: 30,
address: {
city: 'New York',
country: 'USA'
}
};
const emptyObj = setValueNullRedirect(obj);
console.log(emptyObj);
output
{
"name": "",
"age": null,
"address": {
"city": "",
"country": ""
}
}
getLocalStringTime Function
Description
The getLocalStringTime
function takes a time string in the format "HH:mm" and returns a JavaScript Date object with the time set to the input time in the local timezone.
Usage
To use the getLocalStringTime
function, pass a time string as the argument. For example:
const timeString = '10:30';
const dateObject = getLocalStringTime(timeString);
console.log(dateObject);
removeAllSpacesInString Function
Description
The removeAllSpacesInString
function removes all spaces from a given string.
Usage
To use the removeAllSpacesInString
function, pass a string as the argument. For example:
const stringWithSpaces = 'Hello, World!';
const stringWithoutSpaces = removeAllSpacesInString(stringWithSpaces);
console.log(stringWithoutSpaces);
output
Output: "Hello,World!"
removeNumberInputScroll Function
Description
The removeNumberInputScroll
function removes focus from a number input field, preventing the up and down arrow keys from changing its value.
Usage
To use the removeNumberInputScroll
function, pass an event object as the argument. For example, in a React component:
<input type="number" onKeyDown={removeNumberInputScroll} />
preventUpDownKeys Function
Description
The preventUpDownKeys
function prevents the default behavior of the up and down arrow keys and the minus key in a keyboard event.
Usage
To use the preventUpDownKeys
function, pass an event object as the argument. For example, in a React component:
<input type="text" onKeyDown={preventUpDownKeys} />