veeroll react js package

Installation

this package is build on react js with tailwind and zustand for state management

1. To install the package and its peer dependencies, run the following commands:

npm i vr-react-sdk

add this to your .env

if you are using next js add this to your .env
NEXT_PUBLIC_VEEROLL_API_URL=https://dev-api.veeroll.com/api/
NEXT_PUBLIC_VEEROLL_API_KEY=test
NEXT_PUBLIC_VEEROLL_SECRET=test

and if not
VITE_VEEROLL_API_URL=https://dev-api.veeroll.com/api/
VEEROLL_API_KEY=test
VEEROLL_SECRET=test

2. To use veeroll package, import the Video Creator component.

pass a props to the redirect link /video/:id, we will redirect on this route after a successfull call of creating a video

import React from "react";

import { CreateVideo } from "vr-react-sdk";
import 'vr-react-sdk/dist/style.css';
const Home = () => {
  return (
    <div>
    <CreateVideo redirectLink={'video'}/>
    </div>
  );
};

export default Home;

if you are using next.js , inclue a use client on top of your page.

pass a props to the redirect link /video/:id, we will redirect on this route after a successfull call of creating a video

"use client"
import React from "react";

import { CreateVideo } from "vr-react-sdk";
import 'vr-react-sdk/dist/style.css';
const Home = () => {
  return (
    <div>
      <CreateVideo redirectLink={'video'}/>
    </div>
  );
};

export default Home;

for next js if you are using typescript, add a new file to your folder types, file named vr-react-sdk.d.ts

declare module 'vr-react-sdk' {
    export const CreateVideo: any;
    export const VideoDetails: any;
    // Add other exports here as needed
  }