mirror of https://github.com/Budibase/budibase.git
Martin McKeaveney
5 years ago
committed by
GitHub
GitHub
236 changed files with 10830 additions and 2573 deletions
@ -0,0 +1,52 @@ |
|||
name: Budibase Release Staging |
|||
|
|||
on: |
|||
push: |
|||
branches: |
|||
- develop |
|||
|
|||
env: |
|||
POSTHOG_TOKEN: ${{ secrets.POSTHOG_TOKEN }} |
|||
POSTHOG_URL: ${{ secrets.POSTHOG_URL }} |
|||
SENTRY_DSN: ${{ secrets.SENTRY_DSN }} |
|||
|
|||
jobs: |
|||
release: |
|||
runs-on: ubuntu-latest |
|||
|
|||
steps: |
|||
- uses: actions/checkout@v2 |
|||
- uses: actions/setup-node@v1 |
|||
with: |
|||
node-version: 12.x |
|||
- run: yarn |
|||
- run: yarn bootstrap |
|||
- run: yarn lint |
|||
- run: yarn build |
|||
- run: yarn test |
|||
|
|||
- name: Configure AWS Credentials |
|||
uses: aws-actions/configure-aws-credentials@v1 |
|||
with: |
|||
aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }} |
|||
aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }} |
|||
aws-region: eu-west-1 |
|||
|
|||
- name: Publish budibase packages to NPM |
|||
env: |
|||
NPM_TOKEN: ${{ secrets.NPM_TOKEN }} |
|||
run: | |
|||
# setup the username and email. I tend to use 'GitHub Actions Bot' with no email by default |
|||
git config user.name "Budibase Staging Release Bot" |
|||
git config user.email "<>" |
|||
echo //registry.npmjs.org/:_authToken=${NPM_TOKEN} >> .npmrc |
|||
yarn release:develop |
|||
|
|||
- name: Build/release Docker images |
|||
run: | |
|||
docker login -u $DOCKER_USER -p $DOCKER_PASSWORD |
|||
yarn build |
|||
yarn build:docker:develop |
|||
env: |
|||
DOCKER_USER: ${{ secrets.DOCKER_USERNAME }} |
|||
DOCKER_PASSWORD: ${{ secrets.DOCKER_API_KEY }} |
|||
@ -0,0 +1,3 @@ |
|||
module.exports = { |
|||
user: require("./src/cache/user"), |
|||
} |
|||
@ -0,0 +1,5 @@ |
|||
const env = require("../src/environment") |
|||
|
|||
env._set("NODE_ENV", "jest") |
|||
env._set("JWT_SECRET", "test-jwtsecret") |
|||
env._set("LOG_LEVEL", "silent") |
|||
@ -0,0 +1 @@ |
|||
module.exports = require("./src/security/sessions") |
|||
@ -0,0 +1,21 @@ |
|||
const { getDB } = require("../db") |
|||
const { StaticDatabases } = require("../db/utils") |
|||
const redis = require("../redis/authRedis") |
|||
|
|||
const EXPIRY_SECONDS = 3600 |
|||
|
|||
exports.getUser = async userId => { |
|||
const client = await redis.getUserClient() |
|||
// try cache
|
|||
let user = await client.get(userId) |
|||
if (!user) { |
|||
user = await getDB(StaticDatabases.GLOBAL.name).get(userId) |
|||
client.store(userId, user, EXPIRY_SECONDS) |
|||
} |
|||
return user |
|||
} |
|||
|
|||
exports.invalidateUser = async userId => { |
|||
const client = await redis.getUserClient() |
|||
await client.delete(userId) |
|||
} |
|||
@ -0,0 +1,128 @@ |
|||
const fetch = require("node-fetch") |
|||
const OIDCStrategy = require("@techpass/passport-openidconnect").Strategy |
|||
const { authenticateThirdParty } = require("./third-party-common") |
|||
|
|||
/** |
|||
* @param {*} issuer The identity provider base URL |
|||
* @param {*} sub The user ID |
|||
* @param {*} profile The user profile information. Created by passport from the /userinfo response |
|||
* @param {*} jwtClaims The parsed id_token claims |
|||
* @param {*} accessToken The access_token for contacting the identity provider - may or may not be a JWT |
|||
* @param {*} refreshToken The refresh_token for obtaining a new access_token - usually not a JWT |
|||
* @param {*} idToken The id_token - always a JWT |
|||
* @param {*} params The response body from requesting an access_token |
|||
* @param {*} done The passport callback: err, user, info |
|||
*/ |
|||
async function authenticate( |
|||
issuer, |
|||
sub, |
|||
profile, |
|||
jwtClaims, |
|||
accessToken, |
|||
refreshToken, |
|||
idToken, |
|||
params, |
|||
done |
|||
) { |
|||
const thirdPartyUser = { |
|||
// store the issuer info to enable sync in future
|
|||
provider: issuer, |
|||
providerType: "oidc", |
|||
userId: profile.id, |
|||
profile: profile, |
|||
email: getEmail(profile, jwtClaims), |
|||
oauth2: { |
|||
accessToken: accessToken, |
|||
refreshToken: refreshToken, |
|||
}, |
|||
} |
|||
|
|||
return authenticateThirdParty( |
|||
thirdPartyUser, |
|||
false, // don't require local accounts to exist
|
|||
done |
|||
) |
|||
} |
|||
|
|||
/** |
|||
* @param {*} profile The structured profile created by passport using the user info endpoint |
|||
* @param {*} jwtClaims The claims returned in the id token |
|||
*/ |
|||
function getEmail(profile, jwtClaims) { |
|||
// profile not guaranteed to contain email e.g. github connected azure ad account
|
|||
if (profile._json.email) { |
|||
return profile._json.email |
|||
} |
|||
|
|||
// fallback to id token email
|
|||
if (jwtClaims.email) { |
|||
return jwtClaims.email |
|||
} |
|||
|
|||
// fallback to id token preferred username
|
|||
const username = jwtClaims.preferred_username |
|||
if (username && validEmail(username)) { |
|||
return username |
|||
} |
|||
|
|||
throw new Error( |
|||
`Could not determine user email from profile ${JSON.stringify( |
|||
profile |
|||
)} and claims ${JSON.stringify(jwtClaims)}` |
|||
) |
|||
} |
|||
|
|||
function validEmail(value) { |
|||
return ( |
|||
value && |
|||
!!value.match( |
|||
/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/ |
|||
) |
|||
) |
|||
} |
|||
|
|||
/** |
|||
* Create an instance of the oidc passport strategy. This wrapper fetches the configuration |
|||
* from couchDB rather than environment variables, using this factory is necessary for dynamically configuring passport. |
|||
* @returns Dynamically configured Passport OIDC Strategy |
|||
*/ |
|||
exports.strategyFactory = async function (config, callbackUrl) { |
|||
try { |
|||
const { clientID, clientSecret, configUrl } = config |
|||
|
|||
if (!clientID || !clientSecret || !callbackUrl || !configUrl) { |
|||
throw new Error( |
|||
"Configuration invalid. Must contain clientID, clientSecret, callbackUrl and configUrl" |
|||
) |
|||
} |
|||
|
|||
const response = await fetch(configUrl) |
|||
|
|||
if (!response.ok) { |
|||
throw new Error( |
|||
`Unexpected response when fetching openid-configuration: ${response.statusText}` |
|||
) |
|||
} |
|||
|
|||
const body = await response.json() |
|||
|
|||
return new OIDCStrategy( |
|||
{ |
|||
issuer: body.issuer, |
|||
authorizationURL: body.authorization_endpoint, |
|||
tokenURL: body.token_endpoint, |
|||
userInfoURL: body.userinfo_endpoint, |
|||
clientID: clientID, |
|||
clientSecret: clientSecret, |
|||
callbackURL: callbackUrl, |
|||
}, |
|||
authenticate |
|||
) |
|||
} catch (err) { |
|||
console.error(err) |
|||
throw new Error("Error constructing OIDC authentication strategy", err) |
|||
} |
|||
} |
|||
|
|||
// expose for testing
|
|||
exports.authenticate = authenticate |
|||
@ -0,0 +1,74 @@ |
|||
// Mock data
|
|||
|
|||
const { data } = require("./utilities/mock-data") |
|||
|
|||
const googleConfig = { |
|||
callbackURL: "http://somecallbackurl", |
|||
clientID: data.clientID, |
|||
clientSecret: data.clientSecret, |
|||
} |
|||
|
|||
const profile = { |
|||
id: "mockId", |
|||
_json: { |
|||
email : data.email |
|||
}, |
|||
provider: "google" |
|||
} |
|||
|
|||
const user = data.buildThirdPartyUser("google", "google", profile) |
|||
|
|||
describe("google", () => { |
|||
describe("strategyFactory", () => { |
|||
// mock passport strategy factory
|
|||
jest.mock("passport-google-oauth") |
|||
const mockStrategy = require("passport-google-oauth").OAuth2Strategy |
|||
|
|||
it("should create successfully create a google strategy", async () => { |
|||
const google = require("../google") |
|||
|
|||
await google.strategyFactory(googleConfig) |
|||
|
|||
const expectedOptions = { |
|||
clientID: googleConfig.clientID, |
|||
clientSecret: googleConfig.clientSecret, |
|||
callbackURL: googleConfig.callbackURL, |
|||
} |
|||
|
|||
expect(mockStrategy).toHaveBeenCalledWith( |
|||
expectedOptions, |
|||
expect.anything() |
|||
) |
|||
}) |
|||
}) |
|||
|
|||
describe("authenticate", () => { |
|||
afterEach(() => { |
|||
jest.clearAllMocks(); |
|||
}); |
|||
|
|||
// mock third party common authentication
|
|||
jest.mock("../third-party-common") |
|||
const authenticateThirdParty = require("../third-party-common").authenticateThirdParty |
|||
|
|||
// mock the passport callback
|
|||
const mockDone = jest.fn() |
|||
|
|||
it("delegates authentication to third party common", async () => { |
|||
const google = require("../google") |
|||
|
|||
await google.authenticate( |
|||
data.accessToken, |
|||
data.refreshToken, |
|||
profile, |
|||
mockDone |
|||
) |
|||
|
|||
expect(authenticateThirdParty).toHaveBeenCalledWith( |
|||
user, |
|||
true, |
|||
mockDone) |
|||
}) |
|||
}) |
|||
}) |
|||
|
|||
@ -0,0 +1,143 @@ |
|||
// Mock data
|
|||
|
|||
const { data } = require("./utilities/mock-data") |
|||
|
|||
const issuer = "mockIssuer" |
|||
const sub = "mockSub" |
|||
const profile = { |
|||
id: "mockId", |
|||
_json: { |
|||
email : data.email |
|||
} |
|||
} |
|||
let jwtClaims = {} |
|||
const idToken = "mockIdToken" |
|||
const params = {} |
|||
|
|||
const callbackUrl = "http://somecallbackurl" |
|||
|
|||
// response from .well-known/openid-configuration
|
|||
const oidcConfigUrlResponse = { |
|||
issuer: issuer, |
|||
authorization_endpoint: "mockAuthorizationEndpoint", |
|||
token_endpoint: "mockTokenEndpoint", |
|||
userinfo_endpoint: "mockUserInfoEndpoint" |
|||
} |
|||
|
|||
const oidcConfig = { |
|||
configUrl: "http://someconfigurl", |
|||
clientID: data.clientID, |
|||
clientSecret: data.clientSecret, |
|||
} |
|||
|
|||
const user = data.buildThirdPartyUser(issuer, "oidc", profile) |
|||
|
|||
describe("oidc", () => { |
|||
describe("strategyFactory", () => { |
|||
// mock passport strategy factory
|
|||
jest.mock("@techpass/passport-openidconnect") |
|||
const mockStrategy = require("@techpass/passport-openidconnect").Strategy |
|||
|
|||
// mock the request to retrieve the oidc configuration
|
|||
jest.mock("node-fetch") |
|||
const mockFetch = require("node-fetch") |
|||
mockFetch.mockReturnValue({ |
|||
ok: true, |
|||
json: () => oidcConfigUrlResponse |
|||
}) |
|||
|
|||
it("should create successfully create an oidc strategy", async () => { |
|||
const oidc = require("../oidc") |
|||
|
|||
await oidc.strategyFactory(oidcConfig, callbackUrl) |
|||
|
|||
expect(mockFetch).toHaveBeenCalledWith(oidcConfig.configUrl) |
|||
|
|||
const expectedOptions = { |
|||
issuer: oidcConfigUrlResponse.issuer, |
|||
authorizationURL: oidcConfigUrlResponse.authorization_endpoint, |
|||
tokenURL: oidcConfigUrlResponse.token_endpoint, |
|||
userInfoURL: oidcConfigUrlResponse.userinfo_endpoint, |
|||
clientID: oidcConfig.clientID, |
|||
clientSecret: oidcConfig.clientSecret, |
|||
callbackURL: callbackUrl, |
|||
} |
|||
expect(mockStrategy).toHaveBeenCalledWith( |
|||
expectedOptions, |
|||
expect.anything() |
|||
) |
|||
}) |
|||
}) |
|||
|
|||
describe("authenticate", () => { |
|||
afterEach(() => { |
|||
jest.clearAllMocks(); |
|||
}); |
|||
|
|||
// mock third party common authentication
|
|||
jest.mock("../third-party-common") |
|||
const authenticateThirdParty = require("../third-party-common").authenticateThirdParty |
|||
|
|||
// mock the passport callback
|
|||
const mockDone = jest.fn() |
|||
|
|||
async function doAuthenticate() { |
|||
const oidc = require("../oidc") |
|||
|
|||
await oidc.authenticate( |
|||
issuer, |
|||
sub, |
|||
profile, |
|||
jwtClaims, |
|||
data.accessToken, |
|||
data.refreshToken, |
|||
idToken, |
|||
params, |
|||
mockDone |
|||
) |
|||
} |
|||
|
|||
async function doTest() { |
|||
await doAuthenticate() |
|||
|
|||
expect(authenticateThirdParty).toHaveBeenCalledWith( |
|||
user, |
|||
false, |
|||
mockDone) |
|||
} |
|||
|
|||
it("delegates authentication to third party common", async () => { |
|||
doTest() |
|||
}) |
|||
|
|||
it("uses JWT email to get email", async () => { |
|||
delete profile._json.email |
|||
jwtClaims = { |
|||
email : "mock@budibase.com" |
|||
} |
|||
|
|||
doTest() |
|||
}) |
|||
|
|||
it("uses JWT username to get email", async () => { |
|||
delete profile._json.email |
|||
jwtClaims = { |
|||
preferred_username : "mock@budibase.com" |
|||
} |
|||
|
|||
doTest() |
|||
}) |
|||
|
|||
it("uses JWT invalid username to get email", async () => { |
|||
delete profile._json.email |
|||
|
|||
jwtClaims = { |
|||
preferred_username : "invalidUsername" |
|||
} |
|||
|
|||
await expect(doAuthenticate()).rejects.toThrow("Could not determine user email from profile"); |
|||
}) |
|||
|
|||
}) |
|||
}) |
|||
|
|||
@ -0,0 +1,152 @@ |
|||
// Mock data
|
|||
|
|||
require("./utilities/test-config") |
|||
|
|||
const database = require("../../../db") |
|||
const { authenticateThirdParty } = require("../third-party-common") |
|||
const { data } = require("./utilities/mock-data") |
|||
|
|||
const { |
|||
StaticDatabases, |
|||
generateGlobalUserID |
|||
} = require("../../../db/utils") |
|||
const { newid } = require("../../../hashing") |
|||
|
|||
let db |
|||
|
|||
const done = jest.fn() |
|||
|
|||
const getErrorMessage = () => { |
|||
return done.mock.calls[0][2].message |
|||
} |
|||
|
|||
describe("third party common", () => { |
|||
describe("authenticateThirdParty", () => { |
|||
let thirdPartyUser |
|||
|
|||
beforeEach(() => { |
|||
db = database.getDB(StaticDatabases.GLOBAL.name) |
|||
thirdPartyUser = data.buildThirdPartyUser() |
|||
}) |
|||
|
|||
afterEach(async () => { |
|||
jest.clearAllMocks() |
|||
await db.destroy() |
|||
}) |
|||
|
|||
describe("validation", () => { |
|||
const testValidation = async (message) => { |
|||
await authenticateThirdParty(thirdPartyUser, false, done) |
|||
expect(done.mock.calls.length).toBe(1) |
|||
expect(getErrorMessage()).toContain(message) |
|||
} |
|||
|
|||
it("provider fails", async () => { |
|||
delete thirdPartyUser.provider |
|||
testValidation("third party user provider required") |
|||
}) |
|||
|
|||
it("user id fails", async () => { |
|||
delete thirdPartyUser.userId |
|||
testValidation("third party user id required") |
|||
}) |
|||
|
|||
it("email fails", async () => { |
|||
delete thirdPartyUser.email |
|||
testValidation("third party user email required") |
|||
}) |
|||
}) |
|||
|
|||
const expectUserIsAuthenticated = () => { |
|||
const user = done.mock.calls[0][1] |
|||
expect(user).toBeDefined() |
|||
expect(user._id).toBeDefined() |
|||
expect(user._rev).toBeDefined() |
|||
expect(user.token).toBeDefined() |
|||
return user |
|||
} |
|||
|
|||
const expectUserIsSynced = (user, thirdPartyUser) => { |
|||
expect(user.provider).toBe(thirdPartyUser.provider) |
|||
expect(user.email).toBe(thirdPartyUser.email) |
|||
expect(user.firstName).toBe(thirdPartyUser.profile.name.givenName) |
|||
expect(user.lastName).toBe(thirdPartyUser.profile.name.familyName) |
|||
expect(user.thirdPartyProfile).toStrictEqual(thirdPartyUser.profile._json) |
|||
expect(user.oauth2).toStrictEqual(thirdPartyUser.oauth2) |
|||
} |
|||
|
|||
describe("when the user doesn't exist", () => { |
|||
describe("when a local account is required", () => { |
|||
it("returns an error message", async () => { |
|||
await authenticateThirdParty(thirdPartyUser, true, done) |
|||
expect(done.mock.calls.length).toBe(1) |
|||
expect(getErrorMessage()).toContain("Email does not yet exist. You must set up your local budibase account first.") |
|||
}) |
|||
}) |
|||
|
|||
describe("when a local account isn't required", () => { |
|||
it("creates and authenticates the user", async () => { |
|||
await authenticateThirdParty(thirdPartyUser, false, done) |
|||
const user = expectUserIsAuthenticated() |
|||
expectUserIsSynced(user, thirdPartyUser) |
|||
expect(user.roles).toStrictEqual({}) |
|||
}) |
|||
}) |
|||
}) |
|||
|
|||
describe("when the user exists", () => { |
|||
let dbUser |
|||
let id |
|||
let email |
|||
|
|||
const createUser = async () => { |
|||
dbUser = { |
|||
_id: id, |
|||
email: email, |
|||
} |
|||
const response = await db.post(dbUser) |
|||
dbUser._rev = response.rev |
|||
} |
|||
|
|||
const expectUserIsUpdated = (user) => { |
|||
// id is unchanged
|
|||
expect(user._id).toBe(id) |
|||
// user is updated
|
|||
expect(user._rev).not.toBe(dbUser._rev) |
|||
} |
|||
|
|||
describe("exists by email", () => { |
|||
beforeEach(async () => { |
|||
id = generateGlobalUserID(newid()) // random id
|
|||
email = thirdPartyUser.email // matching email
|
|||
await createUser() |
|||
}) |
|||
|
|||
it("syncs and authenticates the user", async () => { |
|||
await authenticateThirdParty(thirdPartyUser, true, done) |
|||
|
|||
const user = expectUserIsAuthenticated() |
|||
expectUserIsSynced(user, thirdPartyUser) |
|||
expectUserIsUpdated(user) |
|||
}) |
|||
}) |
|||
|
|||
describe("exists by id", () => { |
|||
beforeEach(async () => { |
|||
id = generateGlobalUserID(thirdPartyUser.userId) // matching id
|
|||
email = "test@test.com" // random email
|
|||
await createUser() |
|||
}) |
|||
|
|||
it("syncs and authenticates the user", async () => { |
|||
await authenticateThirdParty(thirdPartyUser, true, done) |
|||
|
|||
const user = expectUserIsAuthenticated() |
|||
expectUserIsSynced(user, thirdPartyUser) |
|||
expectUserIsUpdated(user) |
|||
}) |
|||
}) |
|||
}) |
|||
}) |
|||
}) |
|||
|
|||
@ -0,0 +1,20 @@ |
|||
const PouchDB = require("pouchdb") |
|||
const allDbs = require("pouchdb-all-dbs") |
|||
const env = require("../../../../environment") |
|||
|
|||
let POUCH_DB_DEFAULTS |
|||
|
|||
// should always be test but good to do the sanity check
|
|||
if (env.isTest()) { |
|||
PouchDB.plugin(require("pouchdb-adapter-memory")) |
|||
POUCH_DB_DEFAULTS = { |
|||
prefix: undefined, |
|||
adapter: "memory", |
|||
} |
|||
} |
|||
|
|||
const Pouch = PouchDB.defaults(POUCH_DB_DEFAULTS) |
|||
|
|||
allDbs(Pouch) |
|||
|
|||
module.exports = Pouch |
|||
@ -0,0 +1,54 @@ |
|||
// Mock Data
|
|||
|
|||
const mockClientID = "mockClientID" |
|||
const mockClientSecret = "mockClientSecret" |
|||
|
|||
const mockEmail = "mock@budibase.com" |
|||
const mockAccessToken = "mockAccessToken" |
|||
const mockRefreshToken = "mockRefreshToken" |
|||
|
|||
const mockProvider = "mockProvider" |
|||
const mockProviderType = "mockProviderType" |
|||
|
|||
const mockProfile = { |
|||
id: "mockId", |
|||
name: { |
|||
givenName: "mockGivenName", |
|||
familyName: "mockFamilyName", |
|||
}, |
|||
_json: { |
|||
email: mockEmail, |
|||
}, |
|||
} |
|||
|
|||
const buildOauth2 = ( |
|||
accessToken = mockAccessToken, |
|||
refreshToken = mockRefreshToken |
|||
) => ({ |
|||
accessToken: accessToken, |
|||
refreshToken: refreshToken, |
|||
}) |
|||
|
|||
const buildThirdPartyUser = ( |
|||
provider = mockProvider, |
|||
providerType = mockProviderType, |
|||
profile = mockProfile, |
|||
email = mockEmail, |
|||
oauth2 = buildOauth2() |
|||
) => ({ |
|||
provider: provider, |
|||
providerType: providerType, |
|||
userId: profile.id, |
|||
profile: profile, |
|||
email: email, |
|||
oauth2: oauth2, |
|||
}) |
|||
|
|||
exports.data = { |
|||
clientID: mockClientID, |
|||
clientSecret: mockClientSecret, |
|||
email: mockEmail, |
|||
accessToken: mockAccessToken, |
|||
refreshToken: mockRefreshToken, |
|||
buildThirdPartyUser, |
|||
} |
|||
@ -0,0 +1,3 @@ |
|||
const packageConfiguration = require("../../../../index") |
|||
const CouchDB = require("./db") |
|||
packageConfiguration.init(CouchDB) |
|||
@ -0,0 +1,129 @@ |
|||
const env = require("../../environment") |
|||
const jwt = require("jsonwebtoken") |
|||
const database = require("../../db") |
|||
const { StaticDatabases, generateGlobalUserID } = require("../../db/utils") |
|||
const { authError } = require("./utils") |
|||
const { newid } = require("../../hashing") |
|||
const { createASession } = require("../../security/sessions") |
|||
const { getGlobalUserByEmail } = require("../../utils") |
|||
|
|||
/** |
|||
* Common authentication logic for third parties. e.g. OAuth, OIDC. |
|||
*/ |
|||
exports.authenticateThirdParty = async function ( |
|||
thirdPartyUser, |
|||
requireLocalAccount = true, |
|||
done |
|||
) { |
|||
if (!thirdPartyUser.provider) |
|||
return authError(done, "third party user provider required") |
|||
if (!thirdPartyUser.userId) |
|||
return authError(done, "third party user id required") |
|||
if (!thirdPartyUser.email) |
|||
return authError(done, "third party user email required") |
|||
|
|||
const db = database.getDB(StaticDatabases.GLOBAL.name) |
|||
|
|||
let dbUser |
|||
|
|||
// use the third party id
|
|||
const userId = generateGlobalUserID(thirdPartyUser.userId) |
|||
|
|||
// try to load by id
|
|||
try { |
|||
dbUser = await db.get(userId) |
|||
} catch (err) { |
|||
// abort when not 404 error
|
|||
if (!err.status || err.status !== 404) { |
|||
return authError( |
|||
done, |
|||
"Unexpected error when retrieving existing user", |
|||
err |
|||
) |
|||
} |
|||
} |
|||
|
|||
// fallback to loading by email
|
|||
if (!dbUser) { |
|||
dbUser = await getGlobalUserByEmail(thirdPartyUser.email) |
|||
} |
|||
|
|||
// exit early if there is still no user and auto creation is disabled
|
|||
if (!dbUser && requireLocalAccount) { |
|||
return authError( |
|||
done, |
|||
"Email does not yet exist. You must set up your local budibase account first." |
|||
) |
|||
} |
|||
|
|||
// first time creation
|
|||
if (!dbUser) { |
|||
// setup a blank user using the third party id
|
|||
dbUser = { |
|||
_id: userId, |
|||
roles: {}, |
|||
} |
|||
} |
|||
|
|||
dbUser = syncUser(dbUser, thirdPartyUser) |
|||
|
|||
// create or sync the user
|
|||
const response = await db.post(dbUser) |
|||
dbUser._rev = response.rev |
|||
|
|||
// authenticate
|
|||
const sessionId = newid() |
|||
await createASession(dbUser._id, sessionId) |
|||
|
|||
dbUser.token = jwt.sign( |
|||
{ |
|||
userId: dbUser._id, |
|||
sessionId, |
|||
}, |
|||
env.JWT_SECRET |
|||
) |
|||
|
|||
return done(null, dbUser) |
|||
} |
|||
|
|||
/** |
|||
* @returns a user that has been sync'd with third party information |
|||
*/ |
|||
function syncUser(user, thirdPartyUser) { |
|||
// provider
|
|||
user.provider = thirdPartyUser.provider |
|||
user.providerType = thirdPartyUser.providerType |
|||
|
|||
// email
|
|||
user.email = thirdPartyUser.email |
|||
|
|||
if (thirdPartyUser.profile) { |
|||
const profile = thirdPartyUser.profile |
|||
|
|||
if (profile.name) { |
|||
const name = profile.name |
|||
// first name
|
|||
if (name.givenName) { |
|||
user.firstName = name.givenName |
|||
} |
|||
// last name
|
|||
if (name.familyName) { |
|||
user.lastName = name.familyName |
|||
} |
|||
} |
|||
|
|||
// profile
|
|||
user.thirdPartyProfile = { |
|||
...profile._json, |
|||
} |
|||
} |
|||
|
|||
// oauth tokens for future use
|
|||
if (thirdPartyUser.oauth2) { |
|||
user.oauth2 = { |
|||
...thirdPartyUser.oauth2, |
|||
} |
|||
} |
|||
|
|||
return user |
|||
} |
|||
@ -0,0 +1,14 @@ |
|||
/** |
|||
* Utility to handle authentication errors. |
|||
* |
|||
* @param {*} done The passport callback. |
|||
* @param {*} message Message that will be returned in the response body |
|||
* @param {*} err (Optional) error that will be logged |
|||
*/ |
|||
exports.authError = function (done, message, err = null) { |
|||
return done( |
|||
err, |
|||
null, // never return a user
|
|||
{ message: message } |
|||
) |
|||
} |
|||
@ -0,0 +1,29 @@ |
|||
const Client = require("./index") |
|||
const utils = require("./utils") |
|||
|
|||
let userClient, sessionClient |
|||
|
|||
async function init() { |
|||
userClient = await new Client(utils.Databases.USER_CACHE).init() |
|||
sessionClient = await new Client(utils.Databases.SESSIONS).init() |
|||
} |
|||
|
|||
process.on("exit", async () => { |
|||
if (userClient) await userClient.finish() |
|||
if (sessionClient) await sessionClient.finish() |
|||
}) |
|||
|
|||
module.exports = { |
|||
getUserClient: async () => { |
|||
if (!userClient) { |
|||
await init() |
|||
} |
|||
return userClient |
|||
}, |
|||
getSessionClient: async () => { |
|||
if (!sessionClient) { |
|||
await init() |
|||
} |
|||
return sessionClient |
|||
}, |
|||
} |
|||
@ -0,0 +1,69 @@ |
|||
const redis = require("../redis/authRedis") |
|||
|
|||
const EXPIRY_SECONDS = 86400 |
|||
|
|||
async function getSessionsForUser(userId) { |
|||
const client = await redis.getSessionClient() |
|||
const sessions = await client.scan(userId) |
|||
return sessions.map(session => session.value) |
|||
} |
|||
|
|||
function makeSessionID(userId, sessionId) { |
|||
return `${userId}/${sessionId}` |
|||
} |
|||
|
|||
exports.createASession = async (userId, sessionId) => { |
|||
const client = await redis.getSessionClient() |
|||
const session = { |
|||
createdAt: new Date().toISOString(), |
|||
lastAccessedAt: new Date().toISOString(), |
|||
sessionId, |
|||
userId, |
|||
} |
|||
await client.store(makeSessionID(userId, sessionId), session, EXPIRY_SECONDS) |
|||
} |
|||
|
|||
exports.invalidateSessions = async (userId, sessionId = null) => { |
|||
let sessions = [] |
|||
if (sessionId) { |
|||
sessions.push({ key: makeSessionID(userId, sessionId) }) |
|||
} else { |
|||
sessions = await getSessionsForUser(userId) |
|||
} |
|||
const client = await redis.getSessionClient() |
|||
const promises = [] |
|||
for (let session of sessions) { |
|||
promises.push(client.delete(session.key)) |
|||
} |
|||
await Promise.all(promises) |
|||
} |
|||
|
|||
exports.updateSessionTTL = async session => { |
|||
const client = await redis.getSessionClient() |
|||
const key = makeSessionID(session.userId, session.sessionId) |
|||
session.lastAccessedAt = new Date().toISOString() |
|||
await client.store(key, session, EXPIRY_SECONDS) |
|||
} |
|||
|
|||
exports.endSession = async (userId, sessionId) => { |
|||
const client = await redis.getSessionClient() |
|||
await client.delete(makeSessionID(userId, sessionId)) |
|||
} |
|||
|
|||
exports.getUserSessions = getSessionsForUser |
|||
|
|||
exports.getSession = async (userId, sessionId) => { |
|||
try { |
|||
const client = await redis.getSessionClient() |
|||
return client.get(makeSessionID(userId, sessionId)) |
|||
} catch (err) { |
|||
// if can't get session don't error, just don't return anything
|
|||
return null |
|||
} |
|||
} |
|||
|
|||
exports.getAllSessions = async () => { |
|||
const client = await redis.getSessionClient() |
|||
const sessions = await client.scan() |
|||
return sessions.map(session => session.value) |
|||
} |
|||
File diff suppressed because it is too large
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 4.3 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 7.2 KiB |
@ -0,0 +1,97 @@ |
|||
<script> |
|||
import { Icon, Combobox, Drawer, Button } from "@budibase/bbui" |
|||
import { |
|||
readableToRuntimeBinding, |
|||
runtimeToReadableBinding, |
|||
} from "builderStore/dataBinding" |
|||
import BindingPanel from "components/common/bindings/BindingPanel.svelte" |
|||
import { createEventDispatcher } from "svelte" |
|||
|
|||
export let panel = BindingPanel |
|||
export let value = "" |
|||
export let bindings = [] |
|||
export let title = "Bindings" |
|||
export let placeholder |
|||
export let label |
|||
export let disabled = false |
|||
export let options |
|||
|
|||
const dispatch = createEventDispatcher() |
|||
let bindingDrawer |
|||
$: tempValue = Array.isArray(value) ? value : [] |
|||
$: readableValue = runtimeToReadableBinding(bindings, value) |
|||
|
|||
const handleClose = () => { |
|||
onChange(tempValue) |
|||
bindingDrawer.hide() |
|||
} |
|||
|
|||
const onChange = value => { |
|||
dispatch("change", readableToRuntimeBinding(bindings, value)) |
|||
} |
|||
</script> |
|||
|
|||
<div class="control"> |
|||
<Combobox |
|||
{label} |
|||
{disabled} |
|||
value={readableValue} |
|||
on:change={event => onChange(event.detail)} |
|||
{placeholder} |
|||
{options} |
|||
/> |
|||
{#if !disabled} |
|||
<div class="icon" on:click={bindingDrawer.show}> |
|||
<Icon size="S" name="FlashOn" /> |
|||
</div> |
|||
{/if} |
|||
</div> |
|||
<Drawer bind:this={bindingDrawer} {title}> |
|||
<svelte:fragment slot="description"> |
|||
Add the objects on the left to enrich your text. |
|||
</svelte:fragment> |
|||
<Button cta slot="buttons" on:click={handleClose}>Save</Button> |
|||
<svelte:component |
|||
this={panel} |
|||
slot="body" |
|||
value={readableValue} |
|||
close={handleClose} |
|||
on:update={event => (tempValue = event.detail)} |
|||
bindableProperties={bindings} |
|||
/> |
|||
</Drawer> |
|||
|
|||
<style> |
|||
.control { |
|||
flex: 1; |
|||
position: relative; |
|||
} |
|||
|
|||
.icon { |
|||
right: 31px; |
|||
bottom: 1px; |
|||
position: absolute; |
|||
justify-content: center; |
|||
align-items: center; |
|||
display: flex; |
|||
flex-direction: row; |
|||
box-sizing: border-box; |
|||
border-left: 1px solid var(--spectrum-alias-border-color); |
|||
border-right: 1px solid var(--spectrum-alias-border-color); |
|||
width: 31px; |
|||
color: var(--spectrum-alias-text-color); |
|||
background-color: var(--spectrum-global-color-gray-75); |
|||
transition: background-color |
|||
var(--spectrum-global-animation-duration-100, 130ms), |
|||
box-shadow var(--spectrum-global-animation-duration-100, 130ms), |
|||
border-color var(--spectrum-global-animation-duration-100, 130ms); |
|||
height: calc(var(--spectrum-alias-item-height-m) - 2px); |
|||
} |
|||
|
|||
.icon:hover { |
|||
cursor: pointer; |
|||
color: var(--spectrum-alias-text-color-hover); |
|||
background-color: var(--spectrum-global-color-gray-50); |
|||
border-color: var(--spectrum-alias-border-color-hover); |
|||
} |
|||
</style> |
|||
@ -0,0 +1,120 @@ |
|||
<script> |
|||
import { |
|||
Icon, |
|||
Modal, |
|||
notifications, |
|||
ModalContent, |
|||
Body, |
|||
Button, |
|||
} from "@budibase/bbui" |
|||
import { store } from "builderStore" |
|||
import api from "builderStore/api" |
|||
import clientPackage from "@budibase/client/package.json" |
|||
|
|||
let updateModal |
|||
|
|||
$: appId = $store.appId |
|||
$: updateAvailable = clientPackage.version !== $store.version |
|||
$: revertAvailable = $store.revertableVersion != null |
|||
|
|||
const refreshAppPackage = async () => { |
|||
const applicationPkg = await api.get( |
|||
`/api/applications/${appId}/appPackage` |
|||
) |
|||
const pkg = await applicationPkg.json() |
|||
if (applicationPkg.ok) { |
|||
await store.actions.initialise(pkg) |
|||
} else { |
|||
throw new Error(pkg) |
|||
} |
|||
} |
|||
|
|||
const update = async () => { |
|||
try { |
|||
const response = await api.post( |
|||
`/api/applications/${appId}/client/update` |
|||
) |
|||
const json = await response.json() |
|||
if (response.status !== 200) { |
|||
throw json.message |
|||
} |
|||
|
|||
// Don't wait for the async refresh, since this causes modal flashing |
|||
refreshAppPackage() |
|||
notifications.success( |
|||
`App updated successfully to version ${clientPackage.version}` |
|||
) |
|||
} catch (err) { |
|||
notifications.error(`Error updating app: ${err}`) |
|||
} |
|||
} |
|||
|
|||
const revert = async () => { |
|||
try { |
|||
const revertableVersion = $store.revertableVersion |
|||
const response = await api.post( |
|||
`/api/applications/${appId}/client/revert` |
|||
) |
|||
const json = await response.json() |
|||
if (response.status !== 200) { |
|||
throw json.message |
|||
} |
|||
|
|||
// Don't wait for the async refresh, since this causes modal flashing |
|||
refreshAppPackage() |
|||
notifications.success( |
|||
`App reverted successfully to version ${revertableVersion}` |
|||
) |
|||
} catch (err) { |
|||
notifications.error(`Error reverting app: ${err}`) |
|||
} |
|||
updateModal.hide() |
|||
} |
|||
</script> |
|||
|
|||
<div class="icon-wrapper" class:highlight={updateAvailable}> |
|||
<Icon name="Refresh" hoverable on:click={updateModal.show} /> |
|||
</div> |
|||
<Modal bind:this={updateModal}> |
|||
<ModalContent |
|||
title="App version" |
|||
confirmText="Update" |
|||
cancelText={updateAvailable ? "Cancel" : "Close"} |
|||
onConfirm={update} |
|||
showConfirmButton={updateAvailable} |
|||
> |
|||
<div slot="footer"> |
|||
{#if revertAvailable} |
|||
<Button quiet secondary on:click={revert}>Revert</Button> |
|||
{/if} |
|||
</div> |
|||
{#if updateAvailable} |
|||
<Body size="S"> |
|||
This app is currently using version <b>{$store.version}</b>, but version |
|||
<b>{clientPackage.version}</b> is available. Updates can contain new features, |
|||
performance improvements and bug fixes. |
|||
</Body> |
|||
{:else} |
|||
<Body size="S"> |
|||
This app is currently using version <b>{$store.version}</b> which is the |
|||
latest version available. |
|||
</Body> |
|||
{/if} |
|||
{#if revertAvailable} |
|||
<Body size="S"> |
|||
You can revert this app to version |
|||
<b>{$store.revertableVersion}</b> |
|||
if you're experiencing issues with the current version. |
|||
</Body> |
|||
{/if} |
|||
</ModalContent> |
|||
</Modal> |
|||
|
|||
<style> |
|||
.icon-wrapper { |
|||
display: contents; |
|||
} |
|||
.icon-wrapper.highlight :global(svg) { |
|||
color: var(--spectrum-global-color-blue-600); |
|||
} |
|||
</style> |
|||
@ -0,0 +1,38 @@ |
|||
<script> |
|||
import { Select } from "@budibase/bbui" |
|||
import { store } from "builderStore" |
|||
|
|||
const themeOptions = [ |
|||
{ |
|||
label: "Lightest", |
|||
value: "spectrum--lightest", |
|||
}, |
|||
{ |
|||
label: "Light", |
|||
value: "spectrum--light", |
|||
}, |
|||
{ |
|||
label: "Dark", |
|||
value: "spectrum--dark", |
|||
}, |
|||
{ |
|||
label: "Darkest", |
|||
value: "spectrum--darkest", |
|||
}, |
|||
] |
|||
</script> |
|||
|
|||
<div> |
|||
<Select |
|||
value={$store.theme || "spectrum--light"} |
|||
options={themeOptions} |
|||
placeholder={null} |
|||
on:change={e => store.actions.theme.save(e.detail)} |
|||
/> |
|||
</div> |
|||
|
|||
<style> |
|||
div { |
|||
padding-right: 8px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,36 @@ |
|||
<script> |
|||
import { DetailSummary, ActionButton, Drawer, Button } from "@budibase/bbui" |
|||
import { store } from "builderStore" |
|||
import ConditionalUIDrawer from "./PropertyControls/ConditionalUIDrawer.svelte" |
|||
|
|||
export let componentInstance |
|||
|
|||
let tempValue |
|||
let drawer |
|||
|
|||
const openDrawer = () => { |
|||
tempValue = JSON.parse(JSON.stringify(componentInstance?._conditions ?? [])) |
|||
drawer.show() |
|||
} |
|||
|
|||
const save = () => { |
|||
store.actions.components.updateConditions(tempValue) |
|||
drawer.hide() |
|||
} |
|||
</script> |
|||
|
|||
<DetailSummary |
|||
name={`Conditions${componentInstance?._conditions ? " *" : ""}`} |
|||
collapsible={false} |
|||
> |
|||
<div> |
|||
<ActionButton on:click={openDrawer}>Configure conditions</ActionButton> |
|||
</div> |
|||
</DetailSummary> |
|||
<Drawer bind:this={drawer} title="Conditions"> |
|||
<svelte:fragment slot="description"> |
|||
Show, hide and update components in response to conditions being met. |
|||
</svelte:fragment> |
|||
<Button cta slot="buttons" on:click={() => save()}>Save</Button> |
|||
<ConditionalUIDrawer slot="body" bind:conditions={tempValue} /> |
|||
</Drawer> |
|||
@ -1,42 +1,8 @@ |
|||
<script> |
|||
import { createEventDispatcher } from "svelte" |
|||
import Colorpicker from "@budibase/colorpicker" |
|||
|
|||
const dispatch = createEventDispatcher() |
|||
import { ColorPicker } from "@budibase/bbui" |
|||
import { store } from "builderStore" |
|||
|
|||
export let value |
|||
|
|||
const WAIT = 150 |
|||
|
|||
function throttle(callback, wait, immediate = false) { |
|||
let timeout = null |
|||
let initialCall = true |
|||
|
|||
return function () { |
|||
const callNow = immediate && initialCall |
|||
const next = () => { |
|||
callback.apply(this, arguments) |
|||
timeout = null |
|||
} |
|||
|
|||
if (callNow) { |
|||
initialCall = false |
|||
next() |
|||
} |
|||
|
|||
if (!timeout) { |
|||
timeout = setTimeout(next, wait) |
|||
} |
|||
} |
|||
} |
|||
|
|||
const onChange = throttle( |
|||
e => { |
|||
dispatch("change", e.detail) |
|||
}, |
|||
WAIT, |
|||
true |
|||
) |
|||
</script> |
|||
|
|||
<Colorpicker value={value || "#C4C4C4"} on:change={onChange} /> |
|||
<ColorPicker {value} on:change spectrumTheme={$store.theme} /> |
|||
|
|||
@ -0,0 +1,290 @@ |
|||
<script> |
|||
import { |
|||
Button, |
|||
Body, |
|||
Icon, |
|||
DrawerContent, |
|||
Layout, |
|||
Select, |
|||
DatePicker, |
|||
} from "@budibase/bbui" |
|||
import { flip } from "svelte/animate" |
|||
import { dndzone } from "svelte-dnd-action" |
|||
import { generate } from "shortid" |
|||
import DrawerBindableInput from "components/common/bindings/DrawerBindableInput.svelte" |
|||
import { OperatorOptions, getValidOperatorsForType } from "helpers/lucene" |
|||
import { getBindableProperties } from "builderStore/dataBinding" |
|||
import { currentAsset, selectedComponent, store } from "builderStore" |
|||
import { getComponentForSettingType } from "./componentSettings" |
|||
import PropertyControl from "./PropertyControl.svelte" |
|||
|
|||
export let conditions = [] |
|||
|
|||
const flipDurationMs = 150 |
|||
const actionOptions = [ |
|||
{ |
|||
label: "Hide component", |
|||
value: "hide", |
|||
}, |
|||
{ |
|||
label: "Show component", |
|||
value: "show", |
|||
}, |
|||
{ |
|||
label: "Update setting", |
|||
value: "update", |
|||
}, |
|||
] |
|||
const valueTypeOptions = [ |
|||
{ |
|||
value: "string", |
|||
label: "Binding", |
|||
}, |
|||
{ |
|||
value: "number", |
|||
label: "Number", |
|||
}, |
|||
{ |
|||
value: "datetime", |
|||
label: "Date", |
|||
}, |
|||
{ |
|||
value: "boolean", |
|||
label: "Boolean", |
|||
}, |
|||
] |
|||
|
|||
let dragDisabled = true |
|||
$: definition = store.actions.components.getDefinition( |
|||
$selectedComponent?._component |
|||
) |
|||
$: settings = (definition?.settings ?? []).map(setting => { |
|||
return { |
|||
label: setting.label, |
|||
value: setting.key, |
|||
} |
|||
}) |
|||
$: bindableProperties = getBindableProperties( |
|||
$currentAsset, |
|||
$store.selectedComponentId |
|||
) |
|||
$: conditions.forEach(link => { |
|||
if (!link.id) { |
|||
link.id = generate() |
|||
} |
|||
}) |
|||
|
|||
const getSettingDefinition = key => { |
|||
return definition?.settings?.find(setting => { |
|||
return setting.key === key |
|||
}) |
|||
} |
|||
|
|||
const getComponentForSetting = key => { |
|||
const settingDefinition = getSettingDefinition(key) |
|||
return getComponentForSettingType(settingDefinition?.type || "text") |
|||
} |
|||
|
|||
const addCondition = () => { |
|||
conditions = [ |
|||
...conditions, |
|||
{ |
|||
valueType: "string", |
|||
id: generate(), |
|||
action: "hide", |
|||
operator: OperatorOptions.Equals.value, |
|||
}, |
|||
] |
|||
} |
|||
|
|||
const removeCondition = id => { |
|||
conditions = conditions.filter(link => link.id !== id) |
|||
} |
|||
|
|||
const handleFinalize = e => { |
|||
updateConditions(e) |
|||
dragDisabled = true |
|||
} |
|||
|
|||
const updateConditions = e => { |
|||
conditions = e.detail.items |
|||
} |
|||
|
|||
const getOperatorOptions = condition => { |
|||
return getValidOperatorsForType(condition.valueType) |
|||
} |
|||
|
|||
const onOperatorChange = (condition, newOperator) => { |
|||
const noValueOptions = [ |
|||
OperatorOptions.Empty.value, |
|||
OperatorOptions.NotEmpty.value, |
|||
] |
|||
condition.noValue = noValueOptions.includes(newOperator) |
|||
if (condition.noValue) { |
|||
condition.referenceValue = null |
|||
condition.valueType = "string" |
|||
} |
|||
} |
|||
|
|||
const onValueTypeChange = (condition, newType) => { |
|||
condition.referenceValue = null |
|||
|
|||
// Ensure a valid operator is set |
|||
const validOperators = getValidOperatorsForType(newType).map(x => x.value) |
|||
if (!validOperators.includes(condition.operator)) { |
|||
condition.operator = validOperators[0] ?? OperatorOptions.Equals.value |
|||
onOperatorChange(condition, condition.operator) |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<DrawerContent> |
|||
<div class="container"> |
|||
<Layout noPadding> |
|||
{#if conditions?.length} |
|||
<div |
|||
class="conditions" |
|||
use:dndzone={{ |
|||
items: conditions, |
|||
flipDurationMs, |
|||
dropTargetStyle: { outline: "none" }, |
|||
dragDisabled, |
|||
}} |
|||
on:finalize={handleFinalize} |
|||
on:consider={updateConditions} |
|||
> |
|||
{#each conditions as condition (condition.id)} |
|||
<div |
|||
class="condition" |
|||
class:update={condition.action === "update"} |
|||
animate:flip={{ duration: flipDurationMs }} |
|||
> |
|||
<div |
|||
class="handle" |
|||
aria-label="drag-handle" |
|||
style={dragDisabled ? "cursor: grab" : "cursor: grabbing"} |
|||
on:mousedown={() => (dragDisabled = false)} |
|||
> |
|||
<Icon name="DragHandle" size="XL" /> |
|||
</div> |
|||
<Select |
|||
placeholder={null} |
|||
options={actionOptions} |
|||
bind:value={condition.action} |
|||
/> |
|||
{#if condition.action === "update"} |
|||
<Select options={settings} bind:value={condition.setting} /> |
|||
<div>TO</div> |
|||
{#if getSettingDefinition(condition.setting)} |
|||
<PropertyControl |
|||
type={getSettingDefinition(condition.setting).type} |
|||
control={getComponentForSetting(condition.setting)} |
|||
key={getSettingDefinition(condition.setting).key} |
|||
value={condition.settingValue} |
|||
componentInstance={$selectedComponent} |
|||
onChange={val => (condition.settingValue = val)} |
|||
props={{ |
|||
options: getSettingDefinition(condition.setting).options, |
|||
placeholder: getSettingDefinition(condition.setting) |
|||
.placeholder, |
|||
}} |
|||
/> |
|||
{:else} |
|||
<Select disabled placeholder=" " /> |
|||
{/if} |
|||
{/if} |
|||
<div>IF</div> |
|||
<DrawerBindableInput |
|||
bindings={bindableProperties} |
|||
placeholder="Value" |
|||
value={condition.newValue} |
|||
on:change={e => (condition.newValue = e.detail)} |
|||
/> |
|||
<Select |
|||
placeholder={null} |
|||
options={getOperatorOptions(condition)} |
|||
bind:value={condition.operator} |
|||
on:change={e => onOperatorChange(condition, e.detail)} |
|||
/> |
|||
<Select |
|||
disabled={condition.noValue} |
|||
options={valueTypeOptions} |
|||
bind:value={condition.valueType} |
|||
placeholder={null} |
|||
on:change={e => onValueTypeChange(condition, e.detail)} |
|||
/> |
|||
{#if ["string", "number"].includes(condition.valueType)} |
|||
<DrawerBindableInput |
|||
disabled={condition.noValue} |
|||
bindings={bindableProperties} |
|||
placeholder="Value" |
|||
value={condition.referenceValue} |
|||
on:change={e => (condition.referenceValue = e.detail)} |
|||
/> |
|||
{:else if condition.valueType === "datetime"} |
|||
<DatePicker |
|||
placeholder="Value" |
|||
disabled={condition.noValue} |
|||
bind:value={condition.referenceValue} |
|||
/> |
|||
{:else if condition.valueType === "boolean"} |
|||
<Select |
|||
placeholder="Value" |
|||
disabled={condition.noValue} |
|||
options={["True", "False"]} |
|||
bind:value={condition.referenceValue} |
|||
/> |
|||
{/if} |
|||
<Icon |
|||
name="Close" |
|||
hoverable |
|||
size="S" |
|||
on:click={() => removeCondition(condition.id)} |
|||
/> |
|||
</div> |
|||
{/each} |
|||
</div> |
|||
{:else} |
|||
<Body size="S">Add your first condition to get started.</Body> |
|||
{/if} |
|||
<div> |
|||
<Button secondary icon="Add" on:click={addCondition}> |
|||
Add condition |
|||
</Button> |
|||
</div> |
|||
</Layout> |
|||
</div> |
|||
</DrawerContent> |
|||
|
|||
<style> |
|||
.container { |
|||
width: 100%; |
|||
max-width: 1400px; |
|||
margin: 0 auto; |
|||
} |
|||
.conditions { |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: flex-start; |
|||
align-items: stretch; |
|||
gap: var(--spacing-m); |
|||
} |
|||
.condition { |
|||
gap: var(--spacing-l); |
|||
display: grid; |
|||
align-items: center; |
|||
grid-template-columns: auto 1fr auto 1fr 1fr 1fr 1fr auto; |
|||
border-radius: var(--border-radius-s); |
|||
transition: background-color ease-in-out 130ms; |
|||
} |
|||
.condition.update { |
|||
grid-template-columns: auto 1fr 1fr auto 1fr auto 1fr 1fr 1fr 1fr auto; |
|||
} |
|||
.condition:hover { |
|||
background-color: var(--spectrum-global-color-gray-100); |
|||
} |
|||
.handle { |
|||
display: grid; |
|||
place-items: center; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,12 @@ |
|||
<script> |
|||
import { store } from "builderStore" |
|||
import DrawerBindableCombobox from "components/common/bindings/DrawerBindableCombobox.svelte" |
|||
|
|||
export let value |
|||
|
|||
$: urlOptions = $store.screens |
|||
.map(screen => screen.routing?.route) |
|||
.filter(x => x != null) |
|||
</script> |
|||
|
|||
<DrawerBindableCombobox {value} on:change options={urlOptions} /> |
|||
Some files were not shown because too many files changed in this diff
Loading…
Reference in new issue