2020-02-22 00:09:11 +00:00
|
|
|
import Vue from 'vue';
|
2022-06-16 09:09:15 +00:00
|
|
|
import VueApollo from 'vue-apollo';
|
|
|
|
import createDefaultClient from '~/lib/graphql';
|
2021-02-01 15:08:56 +00:00
|
|
|
import { parseBoolean } from '~/lib/utils/common_utils';
|
2022-08-16 18:12:52 +00:00
|
|
|
import CiAdminVariables from './components/ci_admin_variables.vue';
|
2022-08-17 15:11:57 +00:00
|
|
|
import CiGroupVariables from './components/ci_group_variables.vue';
|
2022-08-19 09:11:29 +00:00
|
|
|
import CiProjectVariables from './components/ci_project_variables.vue';
|
2022-06-16 09:09:15 +00:00
|
|
|
import LegacyCiVariableSettings from './components/legacy_ci_variable_settings.vue';
|
2022-09-21 21:13:33 +00:00
|
|
|
import { cacheConfig, resolvers } from './graphql/settings';
|
2020-02-22 00:09:11 +00:00
|
|
|
import createStore from './store';
|
|
|
|
|
2021-03-16 21:11:53 +00:00
|
|
|
const mountCiVariableListApp = (containerEl) => {
|
2022-06-16 09:09:15 +00:00
|
|
|
const {
|
|
|
|
awsLogoSvgPath,
|
|
|
|
awsTipCommandsLink,
|
|
|
|
awsTipDeployLink,
|
|
|
|
awsTipLearnLink,
|
|
|
|
containsVariableReferenceLink,
|
2022-08-16 18:12:52 +00:00
|
|
|
endpoint,
|
2022-06-16 09:09:15 +00:00
|
|
|
environmentScopeLink,
|
2022-08-16 18:12:52 +00:00
|
|
|
groupId,
|
|
|
|
groupPath,
|
|
|
|
isGroup,
|
|
|
|
isProject,
|
2022-06-16 09:09:15 +00:00
|
|
|
maskedEnvironmentVariablesLink,
|
|
|
|
maskableRegex,
|
|
|
|
projectFullPath,
|
|
|
|
projectId,
|
|
|
|
protectedByDefault,
|
|
|
|
protectedEnvironmentVariablesLink,
|
|
|
|
} = containerEl.dataset;
|
|
|
|
|
2022-08-16 18:12:52 +00:00
|
|
|
const parsedIsProject = parseBoolean(isProject);
|
|
|
|
const parsedIsGroup = parseBoolean(isGroup);
|
2022-06-16 09:09:15 +00:00
|
|
|
const isProtectedByDefault = parseBoolean(protectedByDefault);
|
|
|
|
|
2022-08-17 15:11:57 +00:00
|
|
|
let component = CiAdminVariables;
|
|
|
|
|
|
|
|
if (parsedIsGroup) {
|
|
|
|
component = CiGroupVariables;
|
2022-08-19 09:11:29 +00:00
|
|
|
} else if (parsedIsProject) {
|
|
|
|
component = CiProjectVariables;
|
2022-08-17 15:11:57 +00:00
|
|
|
}
|
2022-08-16 18:12:52 +00:00
|
|
|
|
2022-06-16 09:09:15 +00:00
|
|
|
Vue.use(VueApollo);
|
|
|
|
|
|
|
|
const apolloProvider = new VueApollo({
|
2022-09-21 21:13:33 +00:00
|
|
|
defaultClient: createDefaultClient(resolvers, cacheConfig),
|
2022-06-16 09:09:15 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
return new Vue({
|
|
|
|
el: containerEl,
|
|
|
|
apolloProvider,
|
|
|
|
provide: {
|
|
|
|
awsLogoSvgPath,
|
|
|
|
awsTipCommandsLink,
|
|
|
|
awsTipDeployLink,
|
|
|
|
awsTipLearnLink,
|
|
|
|
containsVariableReferenceLink,
|
2022-08-16 18:12:52 +00:00
|
|
|
endpoint,
|
2022-06-16 09:09:15 +00:00
|
|
|
environmentScopeLink,
|
2022-08-16 18:12:52 +00:00
|
|
|
groupId,
|
|
|
|
groupPath,
|
|
|
|
isGroup: parsedIsGroup,
|
|
|
|
isProject: parsedIsProject,
|
2022-06-16 09:09:15 +00:00
|
|
|
isProtectedByDefault,
|
|
|
|
maskedEnvironmentVariablesLink,
|
|
|
|
maskableRegex,
|
|
|
|
projectFullPath,
|
|
|
|
projectId,
|
|
|
|
protectedEnvironmentVariablesLink,
|
|
|
|
},
|
|
|
|
render(createElement) {
|
2022-08-16 18:12:52 +00:00
|
|
|
return createElement(component);
|
2022-06-16 09:09:15 +00:00
|
|
|
},
|
|
|
|
});
|
|
|
|
};
|
|
|
|
|
|
|
|
const mountLegacyCiVariableListApp = (containerEl) => {
|
2020-06-17 00:16:40 +00:00
|
|
|
const {
|
|
|
|
endpoint,
|
|
|
|
projectId,
|
2022-08-17 21:09:50 +00:00
|
|
|
isGroup,
|
2020-06-17 00:16:40 +00:00
|
|
|
maskableRegex,
|
|
|
|
protectedByDefault,
|
|
|
|
awsLogoSvgPath,
|
|
|
|
awsTipDeployLink,
|
|
|
|
awsTipCommandsLink,
|
|
|
|
awsTipLearnLink,
|
2021-08-05 12:09:57 +00:00
|
|
|
containsVariableReferenceLink,
|
2020-06-17 00:16:40 +00:00
|
|
|
protectedEnvironmentVariablesLink,
|
|
|
|
maskedEnvironmentVariablesLink,
|
2022-04-29 18:08:18 +00:00
|
|
|
environmentScopeLink,
|
2020-06-17 00:16:40 +00:00
|
|
|
} = containerEl.dataset;
|
2022-08-17 21:09:50 +00:00
|
|
|
const parsedIsGroup = parseBoolean(isGroup);
|
2020-05-13 09:08:37 +00:00
|
|
|
const isProtectedByDefault = parseBoolean(protectedByDefault);
|
2020-02-22 00:09:11 +00:00
|
|
|
|
|
|
|
const store = createStore({
|
|
|
|
endpoint,
|
|
|
|
projectId,
|
2022-08-17 21:09:50 +00:00
|
|
|
isGroup: parsedIsGroup,
|
2020-02-22 00:09:11 +00:00
|
|
|
maskableRegex,
|
2020-05-13 09:08:37 +00:00
|
|
|
isProtectedByDefault,
|
2020-06-17 00:16:40 +00:00
|
|
|
awsLogoSvgPath,
|
|
|
|
awsTipDeployLink,
|
|
|
|
awsTipCommandsLink,
|
|
|
|
awsTipLearnLink,
|
2021-08-05 12:09:57 +00:00
|
|
|
containsVariableReferenceLink,
|
2020-06-17 00:16:40 +00:00
|
|
|
protectedEnvironmentVariablesLink,
|
|
|
|
maskedEnvironmentVariablesLink,
|
2022-04-29 18:08:18 +00:00
|
|
|
environmentScopeLink,
|
2020-02-22 00:09:11 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
return new Vue({
|
2020-06-11 15:08:36 +00:00
|
|
|
el: containerEl,
|
2020-02-22 00:09:11 +00:00
|
|
|
store,
|
|
|
|
render(createElement) {
|
2022-06-16 09:09:15 +00:00
|
|
|
return createElement(LegacyCiVariableSettings);
|
2020-02-22 00:09:11 +00:00
|
|
|
},
|
|
|
|
});
|
|
|
|
};
|
2021-03-16 21:11:53 +00:00
|
|
|
|
2021-04-02 18:09:20 +00:00
|
|
|
export default (containerId = 'js-ci-project-variables') => {
|
|
|
|
const el = document.getElementById(containerId);
|
|
|
|
|
2022-06-16 09:09:15 +00:00
|
|
|
if (el) {
|
|
|
|
if (gon.features?.ciVariableSettingsGraphql) {
|
|
|
|
mountCiVariableListApp(el);
|
|
|
|
} else {
|
|
|
|
mountLegacyCiVariableListApp(el);
|
|
|
|
}
|
|
|
|
}
|
2021-03-16 21:11:53 +00:00
|
|
|
};
|