Migrate jQuery to new build workflow

# Changes
## Migrated jQuery to new workflow
- Managed in `client/`.
- and built into `static/js/main.js`
- then included in `base.html` template

## Removed jQuery from the old workflow from
- `scripts/yarn/package.json`
- `scripts/yarn-update`
- `template/base.html`

## Updated docs
Modifictions in `/docs/contributing/frontend.rst` including wording, steps, and requirements.

Related: WeblateOrg#12490

client/package.json

@@ -1,12 +1,13 @@
 {
-  "name": "client-3rd-party",
+  "name": "weblate-client-libs",
   "version": "0.0.1",
   "description": "Used to manage 3rd party libraries for the  client side.",
   "license": "GPL-3.0-or-later",
   "scripts": {
     "build": "webpack"
   },
   "dependencies": {
+    "jquery": "3.7.1",
     "@sentry/browser": "8.30.0"
   },
   "devDependencies": {

client/src/main.js

@@ -2,8 +2,17 @@
 //
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-/// Imports to project wide dependencies goes in here
+/**
+ * Imports to project wide dependencies goes in here
+ * This file build in weblate/static/js/vendor/main.js
+ * is loaded before any other file in the project so
+ * you can use it to import dependencies that are used
+ * in multiple places in the project
+ */
 
-/// Example:
-// import $ from 'jquery';
-// window.$ = $;
+// Imports
+import jQuery from "jquery";
+
+// Definitions in global scope
+window.$ = jQuery;
+window.jQuery = jQuery;

client/yarn.lock

@@ -523,6 +523,11 @@ jest-worker@^27.4.5:
     merge-stream "^2.0.0"
     supports-color "^8.0.0"
 
+[email protected]:
+  version "3.7.1"
+  resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.7.1.tgz#083ef98927c9a6a74d05a6af02806566d16274de"
+  integrity sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==
+
 json-parse-even-better-errors@^2.3.1:
   version "2.3.1"
   resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d"

docs/contributing/frontend.rst

@@ -19,35 +19,36 @@ Older browsers might work, but some features might be limited.
 Dependency management
 ---------------------
 Installing and managing `3rd party` libraries in the `client` of a django project
-can be a bit tricky. This document provides a step-by-step guide on how to install
+can be a bit tricky. This section provides a step-by-step guide on how to install
 and manage 3rd party libraries used by the `client side` of Weblate using `Webpack`.
 
 Prerequisites
-~~~~~~~~~~~~~
+-------------
 
 Before proceeding with an installation, make sure you have the following prerequisites:
 
-- Node.js.
-- Yarn package manager installed on your system.
+- ``Nodejs`` version 14 or higher.
+- The ``yarn`` package manager installed on your system.
 - Run ``cd client``.
 - Run ``yarn install``
 
 1- Installation
-~~~~~~~~~~~~~~~
+---------------
 
 To install a library, 1st run the following command:
 
 .. code-block:: bash
 
-    yarn add lib
+    yarn add <lib-name>
 
 2- Importing the Library
-~~~~~~~~~~~~~~~~~~~~~~~~~
+-------------------------
 
 Then, there are two ways to import the library:
 
 1. If it is a project-wide library (it is used/needed in all/most pages):
     - Import the library in ``src/main.js``.
+    - And declare it in the global scope (if needed).
 
 2. If it is page-specific library (library is used in a specific page or template):
     - Create a new file named ``src/<lib-name>.js``.
@@ -58,16 +59,16 @@ Then, there are two ways to import the library:
    Note: Replace ``<lib-name>`` with the actual name of the 3rd party library.
 
 3- Building the Library
-~~~~~~~~~~~~~~~~~~~~~~~~
+-----------------------
 
-Build the libraries used by the project, run the following command:
+Build the libraries used by the project, by running the following command:
 
 .. code-block:: bash
 
     yarn build
 
 4- Including the Library
-~~~~~~~~~~~~~~~~~~~~~~~~~
+------------------------
 
 Now the library is built and ready for use. To include it follow these steps:
 

scripts/yarn-update

@@ -20,9 +20,6 @@ cp node_modules/mousetrap/mousetrap.js ../../weblate/static/vendor/
 # Mousetrap global bind
 cp node_modules/mousetrap-global-bind/mousetrap-global-bind.js ../../weblate/static/vendor/
 
-# jQuery
-cp node_modules/jquery/dist/jquery.js ../../weblate/static/vendor/
-
 # Tribute
 cp node_modules/tributejs/dist/tribute.js ../../weblate/static/vendor/
 

scripts/yarn/package.json

@@ -8,7 +8,6 @@
     "autosize": "6.0.1",
     "bootstrap-rtl": "3.3.4",
     "daterangepicker": "^3.1.0",
-    "jquery": "3.7.1",
     "mousetrap": "1.6.5",
     "mousetrap-global-bind": "1.1.0",
     "multi.js": "0.5.3",

weblate/static/js/vendor/main.js.license

@@ -0,0 +1,6 @@
+Copyright © Michal Čihař <[email protected]>
+
+SPDX-License-Identifier: GPL-3.0-or-later
+
+This file is a bundle containing third-party libraries:
+- jQuery (MIT)