Skip to content

Commit 3bbce07

Browse files
92hackers92hackers
committed
first commit
1 parent df51efa commit 3bbce07

File tree

181 files changed

+24490
-89
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

181 files changed

+24490
-89
lines changed

‎.editorconfig

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
[*.{js,jsx,ts,tsx,vue,scss}]
2+
indent_style = space
3+
indent_size = 2
4+
trim_trailing_whitespace = true
5+
insert_final_newline = true

‎package-pev2.json

+108
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,108 @@
1+
{
2+
"name": "pev2",
3+
"keywords": [
4+
"PostgreSQL",
5+
"vuejs",
6+
"SQL",
7+
"plan"
8+
],
9+
"version": "0.24.0",
10+
"main": "./dist/pev2.common.js",
11+
"files": [
12+
"dist/*"
13+
],
14+
"scripts": {
15+
"serve": "vue-cli-service serve",
16+
"lint": "vue-cli-service lint",
17+
"build": "vue-cli-service build --target lib --name pev2 ./src/components/Plan.vue && EXTRACT_CSS=true vue-cli-service build --target lib --name pev2 ./src/components/Plan.vue --dest ./dist/components && cp -R ./src/assets/scss ./dist/scss",
18+
"build-app": "vue-cli-service build --dest dist-app",
19+
"test:unit": "jest",
20+
"snyk-protect": "snyk protect",
21+
"prepare": "npm run snyk-protect"
22+
},
23+
"dependencies": {
24+
"@types/dragscroll": "0.0.0",
25+
"@types/highlight.js": "^9.12.4",
26+
"@types/lodash": "^4.14.170",
27+
"@types/moment-duration-format": "^2.2.3",
28+
"bootstrap": "^4.6.0",
29+
"clarinet": "^0.12.3",
30+
"core-js": "^3.16.0",
31+
"highlight.js": "^10.7.2",
32+
"jquery": "^3.6.0",
33+
"lodash": "^4.17.21",
34+
"moment": "^2.29.1",
35+
"moment-duration-format": "^2.3.2",
36+
"popper.js": "^1.16.1",
37+
"splitpanes": "^2.3.8",
38+
"tippy.js": "^6.3.1",
39+
40+
"vue": "^2.6.14",
41+
"vue-class-component": "^7.2.6",
42+
"vue-clipboard3": "^1.0.1",
43+
"vue-fragment": "^1.5.2",
44+
"vue-property-decorator": "^8.5.1",
45+
"vue-sorted-table": "^1.3.0",
46+
"vue-tippy": "^4.10.2"
47+
},
48+
"devDependencies": {
49+
"@fortawesome/fontawesome-free": "^5.13.0",
50+
"@types/jest": "^25.1.2",
51+
"@vue/cli-plugin-babel": "^4.0.5",
52+
"@vue/cli-plugin-typescript": "^4.4.1",
53+
"@vue/cli-service": "^4.0.5",
54+
"@vue/test-utils": "^1.0.0-beta.29",
55+
"babel-core": "^6.26.3",
56+
"husky": "^4.2.2",
57+
"jest": "^25.3.0",
58+
"lint-staged": "^10.0.7",
59+
"moment-locales-webpack-plugin": "^1.1.0",
60+
"node-sass": "^4.14.1",
61+
"prettier": "2.0.5",
62+
"raw-loader": "^4.0.2",
63+
"sass-loader": "^8.0.0",
64+
"snyk": "^1.334.0",
65+
"ts-jest": "^25.2.0",
66+
"typescript": "^3.6.3",
67+
"vue-jest": "^3.0.5",
68+
"vue-router": "^3.1.3",
69+
"vue-template-compiler": "^2.6.14"
70+
},
71+
"gitHooks": {
72+
"pre-commit": "lint-staged blah"
73+
},
74+
"lint-staged": {
75+
"*.ts": [
76+
"vue-cli-service lint"
77+
],
78+
"*.vue": [
79+
"vue-cli-service lint"
80+
],
81+
"*.{js,css,json,md}": [
82+
"prettier --write"
83+
]
84+
},
85+
"husky": {
86+
"hooks": {
87+
"pre-commit": "lint-staged"
88+
}
89+
},
90+
"jest": {
91+
"moduleFileExtensions": [
92+
"js",
93+
"ts",
94+
"json",
95+
"vue"
96+
],
97+
"transform": {
98+
".*\\.(vue)$": "vue-jest",
99+
"^.+\\.tsx?$": "ts-jest"
100+
},
101+
"testURL": "http://localhost/",
102+
"testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
103+
"moduleNameMapper": {
104+
"^@/(.*)$": "<rootDir>/src/$1"
105+
}
106+
},
107+
"snyk": true
108+
}

‎package.json

+31-2
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,50 @@
11
{
2-
"name": "my-app",
2+
"name": "execution-plan-visualizer",
33
"version": "0.1.0",
4-
"private": true,
4+
"private": false,
55
"dependencies": {
66
"@testing-library/jest-dom": "^5.14.1",
77
"@testing-library/react": "^12.0.0",
88
"@testing-library/user-event": "^13.2.1",
9+
"@types/dragscroll": "0.0.0",
10+
"@types/highlight.js": "^9.12.4",
911
"@types/jest": "^27.0.1",
12+
"@types/lodash": "^4.14.170",
13+
"@types/moment-duration-format": "^2.2.3",
1014
"@types/node": "^16.7.13",
1115
"@types/react": "^17.0.20",
1216
"@types/react-dom": "^17.0.9",
17+
"bootstrap": "^4.6.0",
18+
"clarinet": "^0.12.3",
19+
"classnames": "^2.3.1",
20+
"core-js": "^3.16.0",
21+
"highlight.js": "^10.7.2",
22+
"jquery": "^3.6.0",
23+
"lodash": "^4.17.21",
24+
"moment": "^2.29.1",
25+
"moment-duration-format": "^2.3.2",
26+
"popper.js": "^1.16.1",
1327
"react": "^17.0.2",
1428
"react-dom": "^17.0.2",
1529
"react-scripts": "5.0.0",
30+
"splitpanes": "^2.3.8",
31+
"tippy.js": "^6.3.1",
1632
"typescript": "^4.4.2",
1733
"web-vitals": "^2.1.0"
1834
},
35+
"devDependencies": {
36+
"@fortawesome/fontawesome-free": "^5.13.0",
37+
"@types/jest": "^25.1.2",
38+
"husky": "^4.2.2",
39+
"jest": "^25.3.0",
40+
"lint-staged": "^10.0.7",
41+
"moment-locales-webpack-plugin": "^1.1.0",
42+
"node-sass": "^4.14.1",
43+
"prettier": "2.0.5",
44+
"raw-loader": "^4.0.2",
45+
"sass-loader": "^8.0.0",
46+
"ts-jest": "^25.2.0"
47+
},
1948
"scripts": {
2049
"start": "react-scripts start",
2150
"build": "react-scripts build",

‎src/App.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ function App() {
77
<div className="App">
88
<header className="App-header">
99
<img src={logo} className="App-logo" alt="logo" />
10+
<h1>Hello, World</h1>
1011
<p>
1112
Edit <code>src/App.tsx</code> and save to reload.
1213
</p>
@@ -23,4 +24,4 @@ function App() {
2324
);
2425
}
2526

26-
export default App;
27+
export default App;

‎src/assets/scss/_base.scss

+107
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
// Color contrast
2+
@function color-yiq($color, $dark: $yiq-text-dark, $light: $yiq-text-light) {
3+
$r: red($color);
4+
$g: green($color);
5+
$b: blue($color);
6+
7+
$yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;
8+
9+
@if ($yiq >= $yiq-contrasted-threshold) {
10+
@return $dark;
11+
} @else {
12+
@return $light;
13+
}
14+
}
15+
16+
/**
17+
* Severity classes
18+
*/
19+
@each $color, $value in $severity-colors {
20+
.alert.c-#{$color} {
21+
background-color: $value;
22+
color: color-yiq($value);
23+
font-weight: bold;
24+
25+
.text-muted {
26+
color: color-yiq($value) !important;
27+
font-weight: normal;
28+
}
29+
}
30+
31+
.progress-bar.c-#{$color} {
32+
background-color: $value;
33+
border-color: $value !important;
34+
}
35+
36+
.text-c-#{$color} {
37+
color: $value;
38+
}
39+
}
40+
41+
$buffers-colors: (
42+
hit: map-get($severity-colors, 1),
43+
read: map-get($severity-colors, 2),
44+
dirtied: map-get($severity-colors, 3),
45+
written: map-get($severity-colors, 4),
46+
) !default;
47+
48+
49+
/**
50+
* Shared buffers classes
51+
*/
52+
@each $color, $value in $buffers-colors {
53+
.bg-#{$color} {
54+
background-color: $value;
55+
}
56+
}
57+
58+
59+
.btn-group-xs > .btn, .btn-xs {
60+
padding: .25rem .4rem;
61+
font-size: $font-size-sm;
62+
border-radius: .2rem;
63+
64+
&, .fa {
65+
line-height: .5;
66+
}
67+
}
68+
69+
@keyframes flash {
70+
0% {
71+
background: $plan-node-bg;
72+
}
73+
20% {
74+
background: $flash-color;
75+
}
76+
100% {
77+
background: $plan-node-bg;
78+
}
79+
}
80+
81+
/*
82+
* Used with @extend in .plan-node.never-executed
83+
*/
84+
%bg-hatched {
85+
$color: $gray-lightest;
86+
$angle: 45deg;
87+
$progress-height: 1rem !default;
88+
background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
89+
background-size: $progress-height $progress-height;
90+
}
91+
92+
.bg-hatched {
93+
@extend %bg-hatched;
94+
}
95+
96+
.border-dashed {
97+
border-style: dashed !important;
98+
background-color: transparent !important;
99+
}
100+
101+
.line-clamp-2 {
102+
display: -webkit-box;
103+
-webkit-line-clamp: 2;
104+
-webkit-box-orient: vertical;
105+
text-overflow: ellipsis;
106+
overflow: hidden;
107+
}

‎src/assets/scss/_copy.scss

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
* > .copy {
2+
display: none;
3+
}
4+
*:hover > .copy {
5+
display: block;
6+
}

‎src/assets/scss/_pev2.scss

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
@import "base";
2+
@import "copy";
3+
@import "plan";
4+
@import "plan-diagram";
5+
@import "plan-node";

‎src/assets/scss/_plan-diagram.scss

+60
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
.plan-diagram {
2+
line-height: 0.85em;
3+
&.plan-diagram-top {
4+
max-height: 30%;
5+
}
6+
// make sure diagram right column takes as much width as possible
7+
table tr td:nth-child(3) {
8+
width: 90%;
9+
}
10+
font-family: $font-family-sans-serif;
11+
12+
.legend ul li {
13+
font-size: $font-size-base;
14+
span {
15+
display: inline-block;
16+
width: 8px;
17+
height: 8px;
18+
border-radius: 50%;
19+
}
20+
}
21+
22+
tbody::after {
23+
content: '';
24+
display: block;
25+
height: $padding-lg;
26+
}
27+
th, td {
28+
margin: 0;
29+
color: $text-color;
30+
white-space: nowrap;
31+
32+
&.node-index,
33+
&.node-type,
34+
&.subplan {
35+
font-size: $font-size-base;
36+
}
37+
&.node-type {
38+
font-weight: bold;
39+
}
40+
}
41+
th {
42+
font-size: $font-size-base;
43+
}
44+
45+
tr.highlight {
46+
box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.4);
47+
}
48+
tr.selected {
49+
outline: 1px solid $highlight-color;
50+
box-shadow: 0px 0px 5px 2px rgba($highlight-color,0.4);
51+
}
52+
tr.highlight,
53+
tr.selected {
54+
background-color: white;
55+
}
56+
57+
.tree-lines {
58+
font-family: 'monospace';
59+
}
60+
}

0 commit comments

Comments
 (0)