index.ts

Overview

This file provides a set of utility functions primarily related to frontend UI measurements and security operations. It exports functions for retrieving the current viewport width, encrypting passwords using RSA encryption with Base64 encoding, and extracting file extensions from filenames. The utilities are designed to be simple, reusable helpers that can be imported and used throughout a web application.

Exported Functions and Objects

1. getWidth()

Purpose

Retrieves the current width of the browser viewport.

Signature

() => { width: number }

Parameters

• None

Returns

• An object containing a single property:

  • width: The current window.innerWidth value, representing the viewport width in pixels.

Usage Example

import utils from './index';

const viewport = utils.getWidth();
console.log(`Current viewport width: ${viewport.width}px`);

Implementation Details

• Uses the global window.innerWidth property.

• Returns the width wrapped inside an object for potential extensibility.

2. rsaPsw(password: string): string | false

Purpose

Encrypts a given password string using RSA public key encryption combined with Base64 encoding.

Signature

(password: string) => string | false

Parameters

• password (string): The plaintext password to encrypt.

Returns

• An RSA-encrypted string encoded from the Base64 version of the input password.

• Returns false if encryption fails.

Usage Example

import { rsaPsw } from './index';

const encryptedPassword = rsaPsw('mySecret123');
if (encryptedPassword) {
  console.log('Encrypted password:', encryptedPassword);
} else {
  console.error('Encryption failed.');
}

Implementation Details

• The password is first Base64 encoded using js-base64.

• A fixed RSA public key is hard-coded in the function.

• The jsencrypt library is used to create an RSA encryptor instance.

• The Base64-encoded password is encrypted with the RSA public key.

• The encrypted string is returned.

• This approach enhances security by combining Base64 encoding with RSA encryption, adding an obfuscation layer before encryption.

3. getFileExtension(filename: string): string

Purpose

Extracts and returns the file extension from a given filename string, normalized to lowercase.

Signature

(filename: string) => string

Parameters

• filename (string): The name of the file (including extension).

Returns

• A lowercase string representing the file extension (characters after the last dot).

Usage Example

import { getFileExtension } from './index';

const ext = getFileExtension('example.Document.PDF'); // returns 'pdf'
console.log(`File extension: ${ext}`);

Implementation Details

• Uses String.prototype.lastIndexOf to find the position of the last '.' character.

• Uses String.prototype.slice to extract the substring after the last dot.

• Converts the result to lowercase to ensure consistent extension formats.

4. Default Export Object

The file also exports a default object containing getWidth and rsaPsw as its properties for convenient named imports:

export default {
  getWidth,
  rsaPsw,
};

Implementation and Algorithms

• RSA Encryption: The file utilizes the jsencrypt library, which implements RSA encryption in JavaScript. The RSA public key is embedded directly in the source as a PEM-formatted string. This key is used to encrypt the Base64 encoded password, ensuring the password is securely transmitted or stored.

• Base64 Encoding: Using the js-base64 library, the password is Base64 encoded before encryption. This step converts the password string into an ASCII-safe format, which is suitable for RSA encryption, avoiding issues with non-ASCII characters.

• Viewport Width Retrieval: getWidth is a simple function that returns the current width of the viewport by accessing the window.innerWidth property, useful for responsive UI calculations.

• File Extension Extraction: getFileExtension extracts file extensions in a robust way by searching for the last dot in the filename and returning the substring after it, normalized to lowercase.

Interaction with Other Parts of the System

• Security Layer: The rsaPsw function provides a client-side encryption utility that can be used before sending sensitive credentials to a backend, enhancing security by avoiding cleartext transmission.

• Responsive UI: The getWidth function can be used in UI components or layout managers to adapt to different screen sizes dynamically.

• File Handling: getFileExtension helps in validating, filtering, or processing file uploads or downloads by identifying file types.

• Dependencies:

  • js-base64: Used for Base64 encoding.

  • jsencrypt: Used for RSA encryption.

These dependencies must be installed and properly bundled in the project for this file to function correctly.

Visual Diagram

classDiagram
    class index {
        +getWidth(): {width: number}
        +rsaPsw(password: string): string | false
        +getFileExtension(filename: string): string
    }

    class JSEncrypt {
        +setPublicKey(pubKey: string): void
        +encrypt(message: string): string | false
    }

    class Base64 {
        +encode(str: string): string
    }

    index ..> JSEncrypt : uses
    index ..> Base64 : uses

Summary

This index.ts file contains utility functions that cover:

• Screen viewport width detection (getWidth).

• Client-side RSA encryption of passwords with Base64 encoding (rsaPsw).

• File extension extraction from filenames (getFileExtension).

These utilities are designed for frontend scenarios involving UI responsiveness, secure handling of passwords, and file processing. The file depends on well-known libraries (js-base64 and jsencrypt) to provide robust and tested functionalities.

If you intend to extend this file, consider adding:

• Error handling for encryption failures.

• Configurable RSA keys for different environments.

• Additional utilities related to file or UI operations.

End of Documentation for index.ts