options
dencelman1 edited this page Feb 11, 2024
·
5 revisions
// Copy paste for try;
// * Use have to replace LocalBackend on your backend with fetch(), new WebSocket() etc;
import ReactDOM from 'react-dom/client';
import AnyBack from 'anyback-react';
var cachedToken = "MY_TOKEN"
var errorMessage = "Error: invalid password"
// Like your CRUD database on backend
var data = [];
var getEntries = (dbName, tableName) => {
var db, table;
db =
data
.filter(currentDb => currentDb?.name === dbName)
[0]
!db && data.push(
db = {
name: dbName,
tables: [],
}
)
table =
db.tables
.filter(currentTable => currentTable?.name === tableName)
[0]
!table && db.tables.push(
table = {
name: tableName,
entries: [],
}
)
return table.entries;
}
function filterByWhere(entries, where) {
return (
entries
.filter(e => {
if (!where)
return true;
for (var [key, value] of Object.entries(where)) {
if (e[key] !== value)
return false;
}
return true;
})
)
}
function create(d, t, value) {
getEntries(d, t)
.push(value)
}
function read(d, t, where) {
return (
filterByWhere(
getEntries(d, t),
where,
)
)
}
function delete_(d, t, where) {
var entries = getEntries(d, t)
filterByWhere(entries, where)
.map(e => entries.indexOf(e))
.forEach(eIndex => {
entries.splice(eIndex, 1);
})
return true
}
function update(
d, t, value, where,
) {
for (var e of filterByWhere(getEntries(d, t), where)) {
for (var [key, updateValue] of Object.entries(value)) {
if ( !( key in e ) )
return false;
e[key] = updateValue;
}
}
return true
}
var LocalBackend = {
create,
read,
delete_,
update,
generateId: () => ( new Date().getTime() ),
}
// Your settings options for frontend admin panel
var options = {
authTitle: 'Log in',
defaultValue: {
offset: 0,
limit: 20,
searchDebounceDelay: 100,
currentEntryKey: "id",
},
border: {
reqDelayMs: 1000,
maxCreateManyEntry: 20,
},
getDatabases() {
var databases = (
[
{
name: 'dencelman.com',
extra: {
size: 15_000, // bytes
isEmpty: false,
anyData: 'fuck_you',
},
tables: [
{
name: 'users',
extra: {
count: 150,
hello: 'world',
},
fields: [
{
name: 'name',
type: 'string',
defaultValue: '',
},
{
name: 'age',
type: 'number',
defaultValue: 60,
},
{
name: 'is_full_year',
type: 'boolean',
defaultValue: false,
},
],
},
{
name: 'posts',
extra: {
count: 10050
},
fields: [
{
name: 'title',
type: 'string',
defaultValue: '',
},
{
name: 'description',
type: 'string',
defaultValue: '',
},
],
},
]
},
]
)
return databases;
},
read(
databaseName,
tableName,
offset,
limit,
where,
) {
return (new Promise((res, rej) => {
setTimeout(() => {
res(
LocalBackend.read(databaseName, tableName, where)
.slice(offset, ( offset + limit ))
)
}, 1000)
}))
},
update(
databaseName,
tableName,
value,
where,
) {
return (
LocalBackend
.update(databaseName, tableName, value, where)
)
},
delete (
databaseName,
tableName,
where,
) {
var response = {
success:
LocalBackend.delete_(databaseName, tableName, where),
}
return response.success
},
create(
databaseName,
tableName,
value,
) {
return new Promise((res, rej) => {
LocalBackend.create(databaseName, tableName, {
id: LocalBackend.generateId(),
...value,
});
var response = {
success: true,
}
res(response.success)
});
},
checkAuth(
result, // token
) { // Promise<boolean> or boolean возвращает
return new Promise((res) => res(result === cachedToken))
// 1 true
// pass to admin panel
// 2 false
// delete token from cookie
// authed = false
// go to auth form
// 3 Promise -> true | false
// {SAME}
// 4 Promise -> error
// .catch(error => {
// return false
// })
},
auth(login, password) {
// return true
// 1
// return new Promise((res, rej) => res(true))
// return "myToken"
// return (login === 'Masha' && password === '1234')
// 2
// return new Promise((res, rej) => {
// res(true)
// })
// 3
// return new Promise((res, rej) => {
// res("AUTH_TOKEN")
// })
return new Promise((res, rej) => {
var authed = (login === "Masha" && password === "1234")
if (authed)
return res(cachedToken)
rej(errorMessage)
})
},
onLogout() {
console.log("logouted")
},
analEnv: {
count(where) {
return new Promise((res, rej) => {
res(where?.isAdmin ? 15_000: 1_000_000);
})
},
}
}
ReactDOM.createRoot(
document.querySelector('#root')
)
.render(
<AnyBack.AdminPanel
options={options}
/>
)