License UI redesign + composition API (#3225)

* refactor(frontend): revamp license page

- Add more understandable UI
  - Field titles
  - Field description
- Use more semantically correct elements
  - Make paragraph not a label
- Rephrase some parts
- Fields no longer jump around
- Split SPDX-identifier and license name into two seperate fields, for readability
- Sort imports
- fmt

* feat(frontend): encourage license URL on custom license

* refactor(frontend): license page to composition + ts

- Move to Vue composition API
- Move to TypeScript
- Move away from vue-multiselect to the dropdown component
- Use `formatProjectType` function for typesafety
- Remove unused form error highlighting code
- Creating typings for built-in licenses
- Move standard licenses to licenses.ts util
  - There are other license-related utils I want to move there eventually
- Fix typo in Project license type definition

* chore(frontend): fmt

* chore(frontend): fmt

* feat(frontend): require URL and name for custom license

* refactor(frontend): give license or-later checkbox own row

* chore(frontend): fmt

packages/utils/index.ts

@@ -1,8 +1,8 @@
+export * from './billing'
 export * from './highlight'
+export * from './licenses'
 export * from './parse'
 export * from './projects'
+export * from './types'
 export * from './users'
 export * from './utils'
-export * from './billing'
-
-export * from './types'

packages/utils/licenses.ts

@@ -0,0 +1,76 @@
+export interface BuiltinLicense {
+  friendly: string
+  short: string
+  requiresOnlyOrLater?: boolean
+}
+
+export const builtinLicenses: BuiltinLicense[] = [
+  { friendly: 'Custom', short: '' },
+  {
+    friendly: 'All Rights Reserved/No License',
+    short: 'All-Rights-Reserved',
+  },
+  { friendly: 'Apache License 2.0', short: 'Apache-2.0' },
+  {
+    friendly: 'BSD 2-Clause "Simplified" License',
+    short: 'BSD-2-Clause',
+  },
+  {
+    friendly: 'BSD 3-Clause "New" or "Revised" License',
+    short: 'BSD-3-Clause',
+  },
+  {
+    friendly: 'CC Zero (Public Domain equivalent)',
+    short: 'CC0-1.0',
+  },
+  { friendly: 'CC-BY 4.0', short: 'CC-BY-4.0' },
+  {
+    friendly: 'CC-BY-SA 4.0',
+    short: 'CC-BY-SA-4.0',
+  },
+  {
+    friendly: 'CC-BY-NC 4.0',
+    short: 'CC-BY-NC-4.0',
+  },
+  {
+    friendly: 'CC-BY-NC-SA 4.0',
+    short: 'CC-BY-NC-SA-4.0',
+  },
+  {
+    friendly: 'CC-BY-ND 4.0',
+    short: 'CC-BY-ND-4.0',
+  },
+  {
+    friendly: 'CC-BY-NC-ND 4.0',
+    short: 'CC-BY-NC-ND-4.0',
+  },
+  {
+    friendly: 'GNU Affero General Public License v3',
+    short: 'AGPL-3.0',
+    requiresOnlyOrLater: true,
+  },
+  {
+    friendly: 'GNU Lesser General Public License v2.1',
+    short: 'LGPL-2.1',
+    requiresOnlyOrLater: true,
+  },
+  {
+    friendly: 'GNU Lesser General Public License v3',
+    short: 'LGPL-3.0',
+    requiresOnlyOrLater: true,
+  },
+  {
+    friendly: 'GNU General Public License v2',
+    short: 'GPL-2.0',
+    requiresOnlyOrLater: true,
+  },
+  {
+    friendly: 'GNU General Public License v3',
+    short: 'GPL-3.0',
+    requiresOnlyOrLater: true,
+  },
+  { friendly: 'ISC License', short: 'ISC' },
+  { friendly: 'MIT License', short: 'MIT' },
+  { friendly: 'Mozilla Public License 2.0', short: 'MPL-2.0' },
+  { friendly: 'zlib License', short: 'Zlib' },
+] as const

packages/utils/types.ts

@@ -87,8 +87,7 @@ export interface Project {
 
   license: {
     id: string
-    name
-    string
+    name: string
     url?: string
   }
 }