Skip to content

Commit

Permalink
Merge pull request #2 from dcSpark/feature/organizing-project
Browse files Browse the repository at this point in the history
- improve: iteration to organizing project
  • Loading branch information
agallardol authored Sep 6, 2023
2 parents 8248f52 + 7585e54 commit 3ecd84c
Show file tree
Hide file tree
Showing 171 changed files with 25,823 additions and 424 deletions.
5 changes: 5 additions & 0 deletions .vscode/config.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"files.exclude": {
"**/dist": true
}
}
28 changes: 14 additions & 14 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,29 +1,29 @@
<h1 align="center">
<img src="assets/visor-logo.png" width="224px"/><br/>
Agrihan Visor
Shinkai Visor
</h1>
<p align="center">Agrihan Visor is a chrome extension which unlocks the full capabilities/automation of first-class LLM (AI) support in the web browser. It enables creating multiple agents, each connected to either local or 3rd-party LLMs (ex. OpenAI GPT), which have permissioned (meaning secure) access to act in every webpage you visit.</p><br/>
<p align="center">Shinkai Visor is a chrome extension which unlocks the full capabilities/automation of first-class LLM (AI) support in the web browser. It enables creating multiple agents, each connected to either local or 3rd-party LLMs (ex. OpenAI GPT), which have permissioned (meaning secure) access to act in every webpage you visit.</p><br/>

Agrihan Visor is designed to be your go-to solution for users interacting with LLMs period, thereby offering essential features such as:
Shinkai Visor is designed to be your go-to solution for users interacting with LLMs period, thereby offering essential features such as:

- Pulling up the AI Launcher (think Spotlight on Macs) via hotkey to instantly request your Agent to automate anything in your web browser
- Start/continue conversations with ChatGPT or any LLM of your choice without leaving your browser window (with entire history backlog available)
- Full per-agent permission system, allowing you to control which agents can read/interact with certain webpages.
- Enables development of a new generation of AV (Agrihan Visor) Web Apps that securely interact with your agents leaking your API keys or data. Web devs can treat your personal agents like external library calls, with no registration required, no API keys, just direct communication with the user's LLMs.
- Provides a cross-extension messaging solution, enabling building Agihan Visor Web Extensions which augment Agrihan Visor's key capabilities (ex. a specific extension built for Twitter which offers advanced automation/summarization above and beyond using the LLM by itself)
- Enables development of a new generation of AV (Shinkai Visor) Web Apps that securely interact with your agents leaking your API keys or data. Web devs can treat your personal agents like external library calls, with no registration required, no API keys, just direct communication with the user's LLMs.
- Provides a cross-extension messaging solution, enabling building Agihan Visor Web Extensions which augment Shinkai Visor's key capabilities (ex. a specific extension built for Twitter which offers advanced automation/summarization above and beyond using the LLM by itself)

## Getting Started

The fastest way to get started using Agrihan Visor is via the [Chrome Web Store]().
The fastest way to get started using Shinkai Visor is via the [Chrome Web Store]().

This will provide you with a seamless install process and allow you to get up and running instantly. Alternatively the instructions below allow you to compile Agrihan Visor locally.
This will provide you with a seamless install process and allow you to get up and running instantly. Alternatively the instructions below allow you to compile Shinkai Visor locally.

## Compile It Yourself

To get started first clone this repo:

```
$ git clone https://github.com/dcSpark-ai/agrihan-visor
$ git clone https://github.com/dcSpark-ai/shinkai-visor
```

Once you have done that simply use `npm` to compile it yourself:
Expand All @@ -43,26 +43,26 @@ This will install all of the dependencies and build the extension. Now that the
4. Click _Load unpacked_.
5. Select the `dist` directory which has been created through the compilation process.

## ⚙️ Agrihan Visor API
## ⚙️ Shinkai Visor API

After a user installs the Agrihan Visor extension into their web browser, the extension will inject a listener into each webpage that they visit. This allows both AV Web Apps and AV Extensions to import the `av-core` library to use the exposed `agrihanVisor` API object which seamlessly handles interacting directly with Agrihan Visor, and thus the user's ship, without having to do any extra setup at all. (Note: Originally Agrihan Visor injected the API directly into each web page, however in order to unify the Agrihan Web App and AV Extension development experience at his approach was reworked into the current solution)
After a user installs the Shinkai Visor extension into their web browser, the extension will inject a listener into each webpage that they visit. This allows both AV Web Apps and AV Extensions to import the `sv-core` library to use the exposed `shinkaiVisor` API object which seamlessly handles interacting directly with Shinkai Visor, and thus the user's ship, without having to do any extra setup at all. (Note: Originally Shinkai Visor injected the API directly into each web page, however in order to unify the Shinkai Web App and AV Extension development experience at his approach was reworked into the current solution)

Below you will find the API which the current version of Agrihan Visor supports. If a given method requires permission, this means that the user must grant the website permission to have access to use this method. If this authorization has not yet been given, Agrihan Visor will automatically ask the user to authorize said permission upon attempt to use said method.
Below you will find the API which the current version of Shinkai Visor supports. If a given method requires permission, this means that the user must grant the website permission to have access to use this method. If this authorization has not yet been given, Shinkai Visor will automatically ask the user to authorize said permission upon attempt to use said method.

| Method | Description | Requires Permission | Input | Returns |
| ----------------------- | --------------------------------------------------------------------------------------------------------- | ------------------- | -------------------------------------------------------------- | ------------------- |
| `isConnected` | Returns whether or not the user actively has an agent connected. | No | `()` | `boolean` |
| `getLLMName` | Returns the name of the LLM that the agent is using. | Yes | `()` | `string` |
| `requestPermissions` | Domain/app requests for permissions to be able to use the connected Agent. | No | `Array<Permission>` | `void` |
| `authorizedPermissions` | Returns the permissions that the user has authorized for the current domain/agent. | No | `()` | `Array<Permission>` |
| `on` | Adds an event listener for a subscription to Agrihan Visor Events (ex. user switched to different agent). | No | `(eventType: string, keys: Array<string>, callback: Function)` | `Subscription` |
| `on` | Adds an event listener for a subscription to Shinkai Visor Events (ex. user switched to different agent). | No | `(eventType: string, keys: Array<string>, callback: Function)` | `Subscription` |
| `off` | Removes an event listener set up by `on()`. | No | `Subscription` (returned by `.on()`) | undefined |
| `require` | Requests the required permissions for your app and ensures their presence before triggering callback. | No | `(perms: Array<Permission>, callback: Function)` | undefined |

### .require()

Agrihan Visor offers a endpoint to make the initial setup of your app much easier, thereby cleaning up most of the boilerplate.
Shinkai Visor offers a endpoint to make the initial setup of your app much easier, thereby cleaning up most of the boilerplate.

On the top page of your app (e.g. `App.tsx`) run `agrihanVisor.require` and pass it two pieces of data: one array with the permissions you want, and a callback function to automatically query for the data that you know you will need.
On the top page of your app (e.g. `App.tsx`) run `shinkaiVisor.require` and pass it two pieces of data: one array with the permissions you want, and a callback function to automatically query for the data that you know you will need.

If the connected agent has not granted the current domain the permissions required yet, they will be automatically requested, and once granted by the user, it will know that they were granted and automatically run the setData callback. This greatly reducing the amount of initial code you need to write so you can focus on your business logic for your apps.
6 changes: 6 additions & 0 deletions shinkai-app/.browserslistrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
Chrome >=79
ChromeAndroid >=79
Firefox >=70
Edge >=79
Safari >=14
iOS >=14
17 changes: 17 additions & 0 deletions shinkai-app/.eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
module.exports = {
root: true,
env: {
node: true
},
'extends': [
'plugin:react/recommended',
'eslint:recommended'
],
parserOptions: {
ecmaVersion: 2020
},
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
}
}
29 changes: 29 additions & 0 deletions shinkai-app/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.

# dependencies
/node_modules
/.pnp
.pnp.js

# testing
/coverage

# production
/build

# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
/.vscode/*
!/.vscode/extensions.json
.idea

npm-debug.log*
yarn-debug.log*
yarn-error.log*

# Optional eslint cache
.eslintcache
1 change: 1 addition & 0 deletions shinkai-app/.nvmrc
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
v18.17.0
5 changes: 5 additions & 0 deletions shinkai-app/.vscode/extensions.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"recommendations": [
"ionic.ionic"
]
}
10 changes: 10 additions & 0 deletions shinkai-app/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
## Install

`nvm use`
`npm install`

Note: it requires the wasm `pkg` folder to be copied to the src directory of this project.

## Tests

`npm run test.unit`
12 changes: 12 additions & 0 deletions shinkai-app/capacitor.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
appId: 'io.ionic.starter',
appName: 'ShinkaiApp',
webDir: 'dist',
server: {
androidScheme: 'https'
}
};

export default config;
10 changes: 10 additions & 0 deletions shinkai-app/cypress.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import { defineConfig } from "cypress";

export default defineConfig({
e2e: {
baseUrl: "http://localhost:5173",
setupNodeEvents(on, config) {
// implement node event listeners here
},
},
});
6 changes: 6 additions & 0 deletions shinkai-app/cypress/e2e/test.cy.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
describe('My First Test', () => {
it('Visits the app root url', () => {
cy.visit('/')
cy.contains('#container', 'Ready to create an app?')
})
})
5 changes: 5 additions & 0 deletions shinkai-app/cypress/fixtures/example.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"name": "Using fixtures to represent data",
"email": "[email protected]",
"body": "Fixtures are a great way to mock data for responses to routes"
}
37 changes: 37 additions & 0 deletions shinkai-app/cypress/support/commands.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
/// <reference types="cypress" />
// ***********************************************
// This example commands.ts shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
//
//
// -- This is a parent command --
// Cypress.Commands.add('login', (email, password) => { ... })
//
//
// -- This is a child command --
// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This will overwrite an existing command --
// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
//
// declare global {
// namespace Cypress {
// interface Chainable {
// login(email: string, password: string): Chainable<void>
// drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
// dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
// visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
// }
// }
// }
20 changes: 20 additions & 0 deletions shinkai-app/cypress/support/e2e.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
// ***********************************************************
// This example support/e2e.ts is processed and
// loaded automatically before your test files.
//
// This is a great place to put global configuration and
// behavior that modifies Cypress.
//
// You can change the location of this file or turn off
// automatically serving support files with the
// 'supportFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/configuration
// ***********************************************************

// Import commands.js using ES2015 syntax:
import './commands'

// Alternatively you can use CommonJS syntax:
// require('./commands')
30 changes: 30 additions & 0 deletions shinkai-app/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Ionic App</title>

<base href="/" />

<meta name="color-scheme" content="light dark" />
<meta
name="viewport"
content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
/>
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />

<link rel="manifest" href="/manifest.json" />

<link rel="shortcut icon" type="image/png" href="/favicon.png" />

<!-- add to homescreen for ios -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-title" content="Ionic App" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
7 changes: 7 additions & 0 deletions shinkai-app/ionic.config.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"name": "ShinkaiApp",
"integrations": {
"capacitor": {}
},
"type": "react-vite"
}
Loading

0 comments on commit 3ecd84c

Please sign in to comment.