feat: add social links with validation and Font Awesome icons

Added comprehensive social links functionality to user profiles:

**New Social Platforms:**
- Website (full URL validation)
- GitHub (username format)
- Bluesky (handle format)
- LinkedIn (username format)
- Twitch (username format)
- YouTube (handle or channel ID format)
- Discord Server (invite code format)

**Features:**
- Database schema updated with 7 new optional social link fields
- Backend services and API routes updated to handle all social links
- Settings form with input fields and helpful validation hints
- Profile display with Font Awesome icons for each platform
- Regex validation patterns for all fields with visual feedback
- Green border for valid input, red border for invalid input
- All form inputs use consistent type="text" for uniform styling
- Discord accepts just invite code (constructs full URL automatically)

**Technical Changes:**
- Installed @fortawesome/angular-fontawesome with pinned versions
- Replaced emoji icons with proper Font Awesome components
- Added FontAwesomeModule to profile component
- Updated all User type interfaces across frontend and backend
- Updated UserService mappings in all methods
- Added comprehensive regex patterns matching platform requirements

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-02-19 17:59:10 -08:00
parent 34c7ca8ba2
commit 5eec4c7640
10 changed files with 425 additions and 4 deletions
+53
View File
@@ -56,6 +56,18 @@ importers:
'@fastify/static':
specifier: 9.0.0
version: 9.0.0
'@fortawesome/angular-fontawesome':
specifier: 4.0.0
version: 4.0.0(@angular/core@21.1.2(@angular/compiler@21.1.2)(rxjs@7.8.2))
'@fortawesome/fontawesome-svg-core':
specifier: 7.2.0
version: 7.2.0
'@fortawesome/free-brands-svg-icons':
specifier: 7.2.0
version: 7.2.0
'@fortawesome/free-solid-svg-icons':
specifier: 7.2.0
version: 7.2.0
'@nhcarrigan/logger':
specifier: 1.1.1
version: 1.1.1
@@ -1659,6 +1671,27 @@ packages:
'@fastify/static@9.0.0':
resolution: {integrity: sha512-r64H8Woe/vfilg5RTy7lwWlE8ZZcTrc3kebYFMEUBrMqlydhQyoiExQXdYAy2REVpST/G35+stAM8WYp1WGmMA==}
'@fortawesome/angular-fontawesome@4.0.0':
resolution: {integrity: sha512-TCqHqT5ovFY1A4RgMpoBUgS+RX3OVs39+CzHFgzDhbCPAopOa26J748TZJcuZwJAvGAk9tbWeVEmWuLByINAeg==}
peerDependencies:
'@angular/core': ^21.0.0
'@fortawesome/fontawesome-common-types@7.2.0':
resolution: {integrity: sha512-IpR0bER9FY25p+e7BmFH25MZKEwFHTfRAfhOyJubgiDnoJNsSvJ7nigLraHtp4VOG/cy8D7uiV0dLkHOne5Fhw==}
engines: {node: '>=6'}
'@fortawesome/fontawesome-svg-core@7.2.0':
resolution: {integrity: sha512-6639htZMjEkwskf3J+e6/iar+4cTNM9qhoWuRfj9F3eJD6r7iCzV1SWnQr2Mdv0QT0suuqU8BoJCZUyCtP9R4Q==}
engines: {node: '>=6'}
'@fortawesome/free-brands-svg-icons@7.2.0':
resolution: {integrity: sha512-VNG8xqOip1JuJcC3zsVsKRQ60oXG9+oYNDCosjoU/H9pgYmLTEwWw8pE0jhPz/JWdHeUuK6+NQ3qsM4gIbdbYQ==}
engines: {node: '>=6'}
'@fortawesome/free-solid-svg-icons@7.2.0':
resolution: {integrity: sha512-YTVITFGN0/24PxzXrwqCgnyd7njDuzp5ZvaCx5nq/jg55kUYd94Nj8UTchBdBofi/L0nwRfjGOg0E41d2u9T1w==}
engines: {node: '>=6'}
'@hapi/boom@10.0.1':
resolution: {integrity: sha512-ERcCZaEjdH3OgSJlyjVk8pHIFeus91CjKP3v+MpgBNp5IvGzP2l/bRiD78nqYcKPaZdbKkK5vDBVPd2ohHBlsA==}
@@ -11651,6 +11684,26 @@ snapshots:
fastq: 1.20.1
glob: 13.0.1
'@fortawesome/angular-fontawesome@4.0.0(@angular/core@21.1.2(@angular/compiler@21.1.2)(rxjs@7.8.2))':
dependencies:
'@angular/core': 21.1.2(@angular/compiler@21.1.2)(rxjs@7.8.2)
'@fortawesome/fontawesome-svg-core': 7.2.0
tslib: 2.8.1
'@fortawesome/fontawesome-common-types@7.2.0': {}
'@fortawesome/fontawesome-svg-core@7.2.0':
dependencies:
'@fortawesome/fontawesome-common-types': 7.2.0
'@fortawesome/free-brands-svg-icons@7.2.0':
dependencies:
'@fortawesome/fontawesome-common-types': 7.2.0
'@fortawesome/free-solid-svg-icons@7.2.0':
dependencies:
'@fortawesome/fontawesome-common-types': 7.2.0
'@hapi/boom@10.0.1':
dependencies:
'@hapi/hoek': 11.0.7