Skip to content

Commit

Permalink
Update coreui to use vue3 syntax etc
Browse files Browse the repository at this point in the history
  • Loading branch information
@bermannoah
bermannoah committed Feb 2, 2024
1 parent 3d6295b commit ef12ee7
Show file tree
Hide file tree
Showing 10 changed files with 68 additions and 47 deletions.
20 changes: 10 additions & 10 deletions authn.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,13 +55,13 @@ func (x *sessionManager) sign(user strixUser, c *gin.Context) error {
})
signed, err := token.SignedString(x.jwtSecret)
if err != nil {
return errors.Wrapf(err, "Fail to sign JWT token: %v", token)
return errors.Wrapf(err, "fail to sign JWT token: %v", token)
}

ssn.Set(cookieKey, signed)
if err := ssn.Save(); err != nil {
logger.WithError(err).Errorf("Fail to save cookie")
return errors.Wrap(err, "Fail to save cookie")
logger.WithError(err).Errorf("fail to save cookie")
return errors.Wrap(err, "fail to save cookie")
}

return nil
Expand All @@ -73,23 +73,23 @@ func claimToStrixUser(claims jwt.MapClaims) (*strixUser, error) {
if v, ok := claims["user"].(string); ok {
user.UserID = v
} else {
return nil, fmt.Errorf("Missing 'user' field in token")
return nil, fmt.Errorf("missing 'user' field in token")
}

if v, ok := claims["image"].(string); ok {
user.Image = v
} else {
return nil, fmt.Errorf("Missing 'image' field in token")
return nil, fmt.Errorf("missing 'image' field in token")
}

if v, ok := claims["expires_at"].(string); ok {
if expires, err := time.Parse("2006-01-02T15:04:05.999999Z07:00", v); err == nil {
user.ExpiresAt = expires
} else {
return nil, errors.Wrapf(err, "Fail to parse 'expires_at' field properly: %s", v)
return nil, errors.Wrapf(err, "fail to parse 'expires_at' field properly: %s", v)
}
} else {
return nil, fmt.Errorf("Missing 'expires_at' field in token")
return nil, fmt.Errorf("missing 'expires_at' field in token")
}

return &user, nil
Expand All @@ -107,18 +107,18 @@ func (x *sessionManager) validate(c *gin.Context) (*strixUser, error) {
ssn := sessions.Default(c)
cookie := ssn.Get(cookieKey)
if cookie == nil {
return nil, fmt.Errorf("No cookie")
return nil, fmt.Errorf("no cookie")
}

raw, ok := cookie.(string)
if !ok {
return nil, fmt.Errorf("Invalid cookie data format: %v", cookie)
return nil, fmt.Errorf("invalid cookie data format: %v", cookie)
}

token, err := jwt.Parse(raw, func(token *jwt.Token) (interface{}, error) {
// Don't forget to validate the alg is what you expect:
if _, ok := token.Method.(*jwt.SigningMethodHMAC); !ok {
return nil, fmt.Errorf("Unexpected signing method: %v", token.Header["alg"])
return nil, fmt.Errorf("unexpected signing method: %v", token.Header["alg"])
}

return x.jwtSecret, nil
Expand Down
2 changes: 1 addition & 1 deletion main.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ func main() {

app.Action = func(c *cli.Context) error {
if c.NArg() != 1 {
return fmt.Errorf("Endpoint is required")
return fmt.Errorf("endpoint is required")
}
args.Endpoint = c.Args().Get(0)

Expand Down
4 changes: 2 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,8 @@
"webpack-dev-server": "^4.15.1"
},
"dependencies": {
"@coreui/coreui": "^4.0.5",
"@coreui/vue": "4.0.0",
"@coreui/coreui": "^4.3.2",
"@coreui/vue": "^4.10.2",
"@coreui/vue-chartjs": "^2.2.0",
"@popperjs/core": "^2.9.2",
"chart.js": "^3.9.1",
Expand Down
4 changes: 3 additions & 1 deletion src/css/coreui.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -108,4 +108,6 @@ ul.pagination {
color: #34495e
}
}
}
}

.wrapper { width: 100%; @include ltr-rtl("padding-left", var(--cui-sidebar-occupy-start, 0)); will-change: auto; @include transition(padding .15s); }
14 changes: 7 additions & 7 deletions src/js/header.vue
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
<template>
<CHeader fixed light>
<CHeaderNav class="d-md-down-none mr-auto">
<CHeaderNavItem class="px-3">
<CHeaderNavLink to="/">Strix</CHeaderNavLink>
</CHeaderNavItem>
<CNavItem class="px-3">
<CNavLink to="/">Strix</CNavLink>
</CNavItem>
</CHeaderNav>
<CHeaderNav class="mr-4">
<CHeaderNavItem class="d-md-down-none mx-2" v-if="user === null">
<CNavItem class="d-md-down-none mx-2" v-if="user === null">
<CButton color="primary" class="m-2" v-on:click="moveToLoginPage">
<!-- <a href="/auth/google">Login</a>-->
Login
</CButton>
</CHeaderNavItem>
</CNavItem>

<CDropdown
v-else
Expand All @@ -21,11 +21,11 @@
add-menu-classes="pt-0"
>
<template #toggler>
<CHeaderNavLink>
<CNavLink>
<div class="c-avatar">
<img :src="user.image" class="c-avatar-img" />
</div>
</CHeaderNavLink>
</CNavLink>
</template>

<CDropdownHeader tag="div" class="text-center" color="light">
Expand Down
36 changes: 23 additions & 13 deletions src/js/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,58 +5,68 @@ import _ from "lodash";
import "babel-polyfill";
import * as Vue from 'vue';
import { createRouter, createWebHashHistory } from 'vue-router'
import CoreuiVue from "@coreui/vue";
import { CHeaderNav, CNavLink, CNavItem, CFormInput, CFormSelect, CButton, CDropdownHeader, CDropdownItem, CDropdown, CHeader, CCol, CRow, CCardBody, CCard, CContainer } from "@coreui/vue";
import Header from "./header.vue";
import Search from "./search.vue";
import Query from "./query.vue";
import { CChartBar } from "@coreui/vue-chartjs";

const app = Vue.createApp({});

const router = createRouter({
history: createWebHashHistory(),
routes: [
{
path: "/search/:search_id",
component: {
template: `<div>
<CWrapper>
template: `<div class="wrapper d-flex flex-column min-vh-100 bg-light">
<strix-header></strix-header>
<div class="c-body">
<main class="c-main">
<strix-query></strix-query>
<strix-search></strix-search>
</main>
</div>
</CWrapper>
</div>`,
},
},
{
path: "/",
component: {
template: `<div>
<CWrapper>
template: `<div class="wrapper d-flex flex-column min-vh-100 bg-light">
<strix-header></strix-header>
<div class="c-body">
<main class="c-main">
<strix-query></strix-query>
</main>
</div>
</CWrapper>
</div>`,
},
},
],
});

const app = Vue.createApp({
router
})

app.component("strix-header", Header);
app.component("strix-query", Query);
app.component("strix-search", Search);
app.component("CChartBar", CChartBar);
app.use(VueRouter)
app.use(CoreuiVue)
app.component("CHeaderNav", CHeaderNav);
app.component("CNavLink", CNavLink);
app.component("CNavItem", CNavItem);
app.component("CFormInput", CFormInput);
app.component("CFormSelect", CFormSelect);
app.component("CButton", CButton);
app.component("CDropdownHeader", CDropdownHeader);
app.component("CDropdownItem", CDropdownItem);
app.component("CDropdown", CDropdown);
app.component("CHeader", CHeader);
app.component("CCol", CCol);
app.component("CRow", CRow);
app.component("CCardBody", CCardBody);
app.component("CCard", CCard);
app.component("CContainer", CContainer);


app.use(router)

app.mount("#app")
6 changes: 3 additions & 3 deletions src/js/query.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<CCardBody>
<CRow>
<CCol sm="12">
<CInput
<CFormInput
type="text"
autofocus
autocomplete="off"
Expand All @@ -19,7 +19,7 @@
</CRow>
<CRow>
<CCol sm="2">
<CSelect
<CFormSelect
v-on:update:value="spanMode = $event"
v-bind:value="spanMode"
:options="[
Expand All @@ -30,7 +30,7 @@
</CCol>

<CCol sm="2" v-if="spanMode === 'relative'">
<CSelect
<CFormSelect
v-on:update:value="timeSpan = $event"
:options="[
{ value: '3600', label: '1 hour' },
Expand Down
2 changes: 1 addition & 1 deletion src/js/search.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@

<CCard>
<CCardHeader>
<CInput
<CFormInput
type="text"
autocomplete="off"
placeholder="jq filter"
Expand Down
13 changes: 11 additions & 2 deletions webpack.config.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
const path = require('path');
const { VueLoaderPlugin } = require('vue-loader');
const webpack = require('webpack');

module.exports = {
mode: "development",
Expand Down Expand Up @@ -33,7 +34,10 @@ module.exports = {
]
},
resolve: {
extensions: [".js", ".json", ".jsx", ".vue"]
extensions: [".js", ".json", ".jsx", ".vue"],
alias: {
'vue$': 'vue/dist/vue.esm-bundler.js'
}
},
devServer: {
contentBase: "static",
Expand All @@ -43,5 +47,10 @@ module.exports = {
"/": "http://localhost:9080",
}
},
plugins: [new VueLoaderPlugin()]
plugins: [new VueLoaderPlugin(),
new webpack.DefinePlugin( {
__VUE_OPTIONS_API__: true,
__VUE_PROD_DEVTOOLS__: false,
__VUE_PROD_HYDRATION_MISMATCH_DETAILS__: false
})]
};
14 changes: 7 additions & 7 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,7 @@

"@babel/parser@^7.10.3", "@babel/parser@^7.23.6", "@babel/parser@^7.23.9":
version "7.23.9"
resolved "https://registry.npmjs.org/@babel/parser/-/parser-7.23.9.tgz"
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.23.9.tgz#7b903b6149b0f8fa7ad564af646c4c38a77fc44b"
integrity sha512-9tcKgqKbs3xGJ+NtKF2ndOBBLVwPjl1SHxPQkd36r3Dlirw3xWUeGaTbqr7uGZcTaxkVNwc+03SVP7aCdWrTlA==

"@babel/template@^7.10.3", "@babel/template@^7.22.15", "@babel/template@^7.23.9":
Expand Down Expand Up @@ -161,7 +161,7 @@
"@babel/helper-validator-identifier" "^7.22.20"
to-fast-properties "^2.0.0"

"@coreui/coreui@^4.0.5":
"@coreui/coreui@^4.3.2":
version "4.3.2"
resolved "https://registry.yarnpkg.com/@coreui/coreui/-/coreui-4.3.2.tgz#3c1d7eae4a740d2b473e862580ee863c40dcde18"
integrity sha512-SKGY6E6v7QGq0P3YTnZQRSrU8t0euLQ3UV/FH5j0JmHYBBu7Mv0Hd9g8AESnj8xrCelKZ5bdZKZhmKaIdG5clw==
Expand All @@ -173,10 +173,10 @@
resolved "https://registry.yarnpkg.com/@coreui/vue-chartjs/-/vue-chartjs-2.2.0.tgz#6adf88a9beaf03e832daddd4c890fd07120937b9"
integrity sha512-0hXipn7WJMLp5lM6mfacJ3OEoR3i5nF5qRLolbpWLk362gLplyDWRsrIwbaIeAU9dPWXKdKtkQW+rMVm31iAoQ==

"@coreui/vue@4.0.0":
version "4.0.0"
resolved "https://registry.yarnpkg.com/@coreui/vue/-/vue-4.0.0.tgz#2d9e271120648526c7e460b9c67411a31a1c571a"
integrity sha512-7AL6Sb6PPYQWHGIrX+V2RS1yW3jCwbBc3krgJ64/gtKX42okUvvDRbyxvVj0Ooci/NlVgQ24iPcpIbso8EINtA==
"@coreui/vue@^4.10.2":
version "4.10.2"
resolved "https://registry.yarnpkg.com/@coreui/vue/-/vue-4.10.2.tgz#7e063d7b68d85a8f5d3610238c977133e9843ffb"
integrity sha512-2HGgIRjH1SIdmYa4vLwhPAQXdrsTDrHfXTOwVKm0LiYTkg0vIudbFIugGPphgkPNKp5eMCJ40UnpowYigzZggQ==

"@discoveryjs/json-ext@^0.5.0":
version "0.5.7"
Expand Down Expand Up @@ -2649,7 +2649,7 @@ source-map@^0.5.0:

source-map@^0.6.0:
version "0.6.1"
resolved "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==

spdy-transport@^3.0.0:
Expand Down

0 comments on commit ef12ee7

Please sign in to comment.