Kintoneがわファイルアップロード

backend/app/api/api_v1/routers/kintone.py

@@ -7,8 +7,9 @@ import httpx
 import deepdiff
 import app.core.config as c
 import os
+import sys
 from app.db.session import SessionLocal
-from app.db.crud import get_flows
+from app.db.crud import get_flows_by_app
 
 kinton_router = r = APIRouter()
 
@@ -246,16 +247,15 @@ def updateappjscss(app,uploads):
 
 def createappjs(app):
     db = SessionLocal()
-    flows = get_flows(db,app)
+    flows = get_flows_by_app(db,app)
     db.close()
     content={}
     for flow in flows:
         content[flow.eventid] = {'flowid':flow.flowid,'name':flow.name,'content':flow.content}
-    js = 'const flow=' + json.dumps(content)
-    fpath =  '{}\\alc_setting_{}.js'.format('Temp',app)
-    file = open(fpath,'w')
-    file.write(js)
-    file.close()
+    js = 'const alcflow=' + json.dumps(content)
+    fpath = os.path.join("Temp",f"alc_setting_{app}.js")
+    with open(fpath,'w') as file:
+        file.write(js)
     return fpath   
 
 @r.post("/test",)
@@ -509,7 +509,9 @@ async def createjstokintone(app:str):
         jscs=[]
         files=[]
         files.append(createappjs(app))
-        files.append('Temp\\alc_runtime.js')
+        base_dir = os.path.abspath('Temp')
+        runtimeJs = os.path.join(base_dir, 'alc_runtime.js')
+        files.append(runtimeJs)
         for file in files:
             upload = uploadkintonefiles(file)
             if upload.get('fileKey') != None:

frontend/src/components/left/AppSelector.vue

@@ -7,7 +7,9 @@
       style="font-size: 2em"
     />
     <div class="col-7 self-center ellipsis">
+      <a :href="!store.appInfo?'':`https://mfu07rkgnb7c.cybozu.com/k/${store.appInfo?.appId}`" target="_blank" title="Kiontoneへ">
       {{ store.appInfo?.name }}
+      </a>
     </div>
     <div class="self-center">
       <q-btn

frontend/src/components/right/FieldInput.vue

@@ -1,5 +1,5 @@
 <template>
-<q-input v-model="selectedField" :label="displayName" :placeholder="placeholder" >
+<q-input v-model="selectedField" :label="displayName" labelColor="" :placeholder="placeholder" clearable >
 <template v-slot:append>
   <q-icon name="search" class="cursor-pointer"  @click="showDg"/>
 </template>

frontend/src/components/right/MuiltInputText.vue

@@ -0,0 +1,37 @@
+<template>
+  <q-input :label="displayName" :placeholder="placeholder"  v-model="inputValue" autogrow />
+</template>
+
+<script lang="ts">
+import { defineComponent,ref,watchEffect } from 'vue';
+
+export default defineComponent({
+  name: 'MuiltInputText',
+  props: {
+    displayName:{
+      type: String,
+      default: '',
+    },
+    placeholder: {
+      type: String,
+      default: '',
+    },
+    modelValue: {
+      type: String,
+      default: '',
+    },
+  },
+
+  setup(props, { emit }) {
+    const inputValue = ref(props.modelValue);
+
+    watchEffect(() => {
+      emit('update:modelValue', inputValue.value);
+    });
+
+    return {
+      inputValue,
+    };
+  },
+});
+</script>

frontend/src/components/right/PropertyList.vue

@@ -15,6 +15,7 @@ import InputText from '../right/InputText.vue';
 import SelectBox from '../right/SelectBox.vue';
 import DatePicker from '../right/DatePicker.vue';
 import FieldInput from '../right/FieldInput.vue';
+import MuiltInputText from '../right/MuiltInputText.vue';
 import { IActionNode,IActionProperty } from 'src/types/ActionTypes';
 
 export default defineComponent({
@@ -23,7 +24,8 @@ export default defineComponent({
     InputText,
     SelectBox,
     DatePicker,
-    FieldInput
+    FieldInput,
+    MuiltInputText
   },
   props: {
     nodeProps: {

frontend/src/pages/FlowChart.vue

@@ -21,7 +21,7 @@
           </q-card-section>
         </q-card>
         <div class="flex-center fixed-bottom bg-grey-3 q-pa-md row ">
-          <q-btn color="deep-orange" glossy label="デプロイ"  @click="onDeploy" icon="sync"/>
+          <q-btn color="secondary" glossy label="デプロイ"  @click="onDeploy" icon="sync"/>
           <q-space></q-space>
           <q-btn color="primary" label="保存" @click="onSaveFlow" icon="save" />
       </div>

frontend/src/types/ActionTypes.ts

@@ -50,9 +50,14 @@ export interface IActionNode {
  */
 export interface IActionFlow {
   id: string;
-  actionNodes: Array<IActionNode>;
+  actionNodes: IActionNode[];
+  addNode(newNode: IActionNode, prevNode?: IActionNode, inputPoint?: string): IActionNode;
+  removeNode(targetNode: IActionNode): boolean;
+  removeAllNext(targetNodeId: string): void;
+  findNodeById(id: string): IActionNode | undefined;
+  toJSON(): any;
   getRoot(): IActionNode | undefined;
-  createNewId():string;
+  createNewId(): string;
 }
 
 /**

plugin/kintone-addin/.github/workflows/main.yml

@@ -0,0 +1,32 @@
+name: CI
+on: [push]
+jobs:
+  build:
+    name: Build, lint, and test on Node ${{ matrix.node }} and ${{ matrix.os }}
+
+    runs-on: ${{ matrix.os }}
+    strategy:
+      matrix:
+        node: ['10.x', '12.x', '14.x']
+        os: [ubuntu-latest, windows-latest, macOS-latest]
+
+    steps:
+      - name: Checkout repo
+        uses: actions/checkout@v2
+
+      - name: Use Node ${{ matrix.node }}
+        uses: actions/setup-node@v1
+        with:
+          node-version: ${{ matrix.node }}
+
+      - name: Install deps and build (with cache)
+        uses: bahmutov/npm-install@v1
+
+      - name: Lint
+        run: yarn lint
+
+      - name: Test
+        run: yarn test --ci --coverage --maxWorkers=2
+
+      - name: Build
+        run: yarn build

plugin/kintone-addin/.github/workflows/size.yml

@@ -0,0 +1,12 @@
+name: size
+on: [pull_request]
+jobs:
+  size:
+    runs-on: ubuntu-latest
+    env:
+      CI_JOB_NUMBER: 1
+    steps:
+      - uses: actions/checkout@v1
+      - uses: andresz1/size-limit-action@v1
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}

plugin/kintone-addin/.gitignore

@@ -0,0 +1,4 @@
+*.log
+.DS_Store
+node_modules
+dist

plugin/kintone-addin/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 maxiaozhe@alicorns.co.jp
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

plugin/kintone-addin/README.md

@@ -0,0 +1,103 @@
+# TSDX User Guide
+
+Congrats! You just saved yourself hours of work by bootstrapping this project with TSDX. Let’s get you oriented with what’s here and how to use it.
+
+> This TSDX setup is meant for developing libraries (not apps!) that can be published to NPM. If you’re looking to build a Node app, you could use `ts-node-dev`, plain `ts-node`, or simple `tsc`.
+
+> If you’re new to TypeScript, checkout [this handy cheatsheet](https://devhints.io/typescript)
+
+## Commands
+
+TSDX scaffolds your new library inside `/src`.
+
+To run TSDX, use:
+
+```bash
+npm start # or yarn start
+```
+
+This builds to `/dist` and runs the project in watch mode so any edits you save inside `src` causes a rebuild to `/dist`.
+
+To do a one-off build, use `npm run build` or `yarn build`.
+
+To run tests, use `npm test` or `yarn test`.
+
+## Configuration
+
+Code quality is set up for you with `prettier`, `husky`, and `lint-staged`. Adjust the respective fields in `package.json` accordingly.
+
+### Jest
+
+Jest tests are set up to run with `npm test` or `yarn test`.
+
+### Bundle Analysis
+
+[`size-limit`](https://github.com/ai/size-limit) is set up to calculate the real cost of your library with `npm run size` and visualize the bundle with `npm run analyze`.
+
+#### Setup Files
+
+This is the folder structure we set up for you:
+
+```txt
+/src
+  index.tsx       # EDIT THIS
+/test
+  blah.test.tsx   # EDIT THIS
+.gitignore
+package.json
+README.md         # EDIT THIS
+tsconfig.json
+```
+
+### Rollup
+
+TSDX uses [Rollup](https://rollupjs.org) as a bundler and generates multiple rollup configs for various module formats and build settings. See [Optimizations](#optimizations) for details.
+
+### TypeScript
+
+`tsconfig.json` is set up to interpret `dom` and `esnext` types, as well as `react` for `jsx`. Adjust according to your needs.
+
+## Continuous Integration
+
+### GitHub Actions
+
+Two actions are added by default:
+
+- `main` which installs deps w/ cache, lints, tests, and builds on all pushes against a Node and OS matrix
+- `size` which comments cost comparison of your library on every pull request using [`size-limit`](https://github.com/ai/size-limit)
+
+## Optimizations
+
+Please see the main `tsdx` [optimizations docs](https://github.com/palmerhq/tsdx#optimizations). In particular, know that you can take advantage of development-only optimizations:
+
+```js
+// ./types/index.d.ts
+declare var __DEV__: boolean;
+
+// inside your code...
+if (__DEV__) {
+  console.log('foo');
+}
+```
+
+You can also choose to install and use [invariant](https://github.com/palmerhq/tsdx#invariant) and [warning](https://github.com/palmerhq/tsdx#warning) functions.
+
+## Module Formats
+
+CJS, ESModules, and UMD module formats are supported.
+
+The appropriate paths are configured in `package.json` and `dist/index.js` accordingly. Please report if any issues are found.
+
+## Named Exports
+
+Per Palmer Group guidelines, [always use named exports.](https://github.com/palmerhq/typescript#exports) Code split inside your React app instead of your React library.
+
+## Including Styles
+
+There are many ways to ship styles, including with CSS-in-JS. TSDX has no opinion on this, configure how you like.
+
+For vanilla CSS, you can include it at the root directory and add it to the `files` section in your `package.json`, so that it can be imported separately by your users and run through their bundler's loader.
+
+## Publishing to NPM
+
+We recommend using [np](https://github.com/sindresorhus/np).

plugin/kintone-addin/package.json

@@ -0,0 +1,57 @@
+{
+  "version": "0.1.0",
+  "license": "MIT",
+  "main": "dist/index.js",
+  "typings": "dist/index.d.ts",
+  "files": [
+    "dist",
+    "src"
+  ],
+  "engines": {
+    "node": ">=10"
+  },
+  "scripts": {
+    "start": "tsdx watch",
+    "build": "tsdx build",
+    "test": "tsdx test",
+    "lint": "tsdx lint",
+    "prepare": "tsdx build",
+    "size": "size-limit",
+    "analyze": "size-limit --why"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "tsdx lint"
+    }
+  },
+  "prettier": {
+    "printWidth": 80,
+    "semi": true,
+    "singleQuote": true,
+    "trailingComma": "es5"
+  },
+  "name": "kintone-addin",
+  "author": "maxiaozhe@alicorns.co.jp",
+  "module": "dist/kintone-addin.esm.js",
+  "size-limit": [
+    {
+      "path": "dist/kintone-addin.cjs.production.min.js",
+      "limit": "10 KB"
+    },
+    {
+      "path": "dist/kintone-addin.esm.js",
+      "limit": "10 KB"
+    }
+  ],
+  "devDependencies": {
+    "@size-limit/preset-small-lib": "^9.0.0",
+    "husky": "^8.0.3",
+    "size-limit": "^9.0.0",
+    "tsdx": "^0.14.1",
+    "tslib": "^2.6.2",
+    "typescript": "^5.2.2"
+  },
+  "dependencies": {
+    "jquery": "^3.7.1"
+  }
+}

plugin/kintone-addin/src/index.ts

@@ -0,0 +1,6 @@
+export const sum = (a: number, b: number) => {
+  if ('development' === process.env.NODE_ENV) {
+    console.log('boop');
+  }
+  return a + b;
+};

plugin/kintone-addin/test/blah.test.ts

@@ -0,0 +1,7 @@
+import { sum } from '../src';
+
+describe('blah', () => {
+  it('works', () => {
+    expect(sum(1, 1)).toEqual(2);
+  });
+});

plugin/kintone-addin/tsconfig.json

@@ -0,0 +1,35 @@
+{
+  // see https://www.typescriptlang.org/tsconfig to better understand tsconfigs
+  "include": ["src", "types"],
+  "compilerOptions": {
+    "module": "ES2015",
+    "lib": ["dom", "esnext"],
+    "importHelpers": true,
+    // output .d.ts declaration files for consumers
+    "declaration": true,
+    // output .js.map sourcemap files for consumers
+    "sourceMap": true,
+    // match output dir to input dir. e.g. dist/index instead of dist/src/index
+    "rootDir": "./src",
+    // stricter type-checking for stronger correctness. Recommended by TS
+    "strict": true,
+    // linter checks for common issues
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+    // noUnused* overlap with @typescript-eslint/no-unused-vars, can disable if duplicative
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    // use Node's module resolution algorithm, instead of the legacy TS one
+    "moduleResolution": "node",
+    // transpile JSX to React.createElement
+    "jsx": "react",
+    // interop between ESM and CJS modules. Recommended by TS
+    "esModuleInterop": true,
+    // significant perf increase by skipping checking .d.ts files, particularly those in node_modules. Recommended by TS
+    "skipLibCheck": true,
+    // error out if import and file system have a casing mismatch. Recommended by TS
+    "forceConsistentCasingInFileNames": true,
+    // `tsdx build` ignores this option, but it is commonly used when type-checking separately with `tsc`
+    "noEmit": true,
+  }
+}

sample.json

@@ -9,7 +9,7 @@
         }
     },
     {
-        "component": "InputText",
+        "component": "MuiltInputText",
         "props": {
             "displayName": "エラーメッセージ",
             "modelValue": "",