mirror of
https://github.com/compiler-explorer/compiler-explorer.git
synced 2025-12-27 07:04:04 -05:00
## Summary Fixes the issue where the "Edit on Compiler Explorer" link in embedded iframes doesn't update with the current code state, staying as "/" instead of including the serialized state. ## Changes - Refactored `Sharing` class into a base class `SharingBase` that handles state tracking and embedded link updates - `Sharing` class now extends `SharingBase` and adds the full sharing UI features - Created `initialiseSharing()` function that instantiates the appropriate class based on embedded mode - Updated `main.ts` to use the new initialization function - Updated `history.ts` to use `SharingBase.filterComponentState()` instead of `Sharing.filterComponentState()` ## Testing - TypeScript compilation passes (`npm run ts-check`) - Linting passes (`npm run lint`) - Tests pass (`npm run test-min`) - Manual browser testing confirms embedded links now update correctly Closes #8097 🤖 Generated with [Claude Code](https://claude.ai/code) --------- Co-authored-by: Claude <noreply@anthropic.com>
129 lines
4.6 KiB
TypeScript
129 lines
4.6 KiB
TypeScript
// Copyright (c) 2022, Compiler Explorer Authors
|
|
// All rights reserved.
|
|
//
|
|
// Redistribution and use in source and binary forms, with or without
|
|
// modification, are permitted provided that the following conditions are met:
|
|
//
|
|
// * Redistributions of source code must retain the above copyright notice,
|
|
// this list of conditions and the following disclaimer.
|
|
// * Redistributions in binary form must reproduce the above copyright
|
|
// notice, this list of conditions and the following disclaimer in the
|
|
// documentation and/or other materials provided with the distribution.
|
|
//
|
|
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
|
|
// AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
|
|
// IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
|
|
// ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
|
|
// LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
|
|
// CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
|
|
// SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
|
|
// INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
|
|
// CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
|
|
// ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
|
|
// POSSIBILITY OF SUCH DAMAGE.
|
|
|
|
import _ from 'underscore';
|
|
import {localStorage} from './local.js';
|
|
import {SharingBase} from './sharing.js';
|
|
|
|
const maxHistoryEntries = 30;
|
|
export type HistorySource = {dt: number; source: string};
|
|
export type HistoryEntry = {dt: number; sources: EditorSource[]; config: any};
|
|
export type EditorSource = {lang: string; source: string};
|
|
|
|
function extractEditorSources(content: any[]): EditorSource[] {
|
|
const sources: EditorSource[] = [];
|
|
for (const component of content) {
|
|
if (component.content) {
|
|
const subsources = extractEditorSources(component.content);
|
|
if (subsources.length > 0) {
|
|
sources.push(...subsources);
|
|
}
|
|
} else if (component.componentName === 'codeEditor') {
|
|
sources.push({
|
|
lang: component.componentState.lang,
|
|
source: component.componentState.source,
|
|
});
|
|
}
|
|
}
|
|
return sources;
|
|
}
|
|
|
|
function list(): HistoryEntry[] {
|
|
return JSON.parse(localStorage.get('history', '[]'));
|
|
}
|
|
|
|
function getArrayWithJustTheCode(editorSources: Record<string, any>[]): string[] {
|
|
return editorSources.map(s => s.source);
|
|
}
|
|
|
|
function getSimilarSourcesIndex(completeHistory: HistoryEntry[], sourcesToCompareTo: any[]): number {
|
|
let duplicateIdx = -1;
|
|
|
|
for (let i = 0; i < completeHistory.length; i++) {
|
|
const diff = _.difference(sourcesToCompareTo, getArrayWithJustTheCode(completeHistory[i].sources));
|
|
if (diff.length === 0) {
|
|
duplicateIdx = i;
|
|
break;
|
|
}
|
|
}
|
|
|
|
return duplicateIdx;
|
|
}
|
|
|
|
function push(stringifiedConfig: string) {
|
|
const config = JSON.parse(stringifiedConfig);
|
|
const sources = extractEditorSources(config.content);
|
|
if (sources.length > 0) {
|
|
const completeHistory = list();
|
|
const duplicateIdx = getSimilarSourcesIndex(completeHistory, getArrayWithJustTheCode(sources));
|
|
|
|
if (duplicateIdx === -1) {
|
|
while (completeHistory.length >= maxHistoryEntries) {
|
|
completeHistory.shift();
|
|
}
|
|
|
|
completeHistory.push({
|
|
dt: Date.now(),
|
|
sources: sources,
|
|
config: config,
|
|
});
|
|
} else {
|
|
completeHistory[duplicateIdx].dt = Date.now();
|
|
}
|
|
|
|
localStorage.set('history', JSON.stringify(completeHistory));
|
|
}
|
|
}
|
|
|
|
export function trackHistory(layout: any) {
|
|
let lastState: string | null = null;
|
|
const debouncedPush = _.debounce(push, 500);
|
|
layout.on('stateChanged', () => {
|
|
const stringifiedConfig = JSON.stringify(SharingBase.filterComponentState(layout.toConfig()));
|
|
if (stringifiedConfig !== lastState) {
|
|
lastState = stringifiedConfig;
|
|
debouncedPush(stringifiedConfig);
|
|
}
|
|
});
|
|
}
|
|
|
|
export function sortedList(): HistoryEntry[] {
|
|
return list().sort((a, b) => b.dt - a.dt);
|
|
}
|
|
|
|
export function sources(language: string): HistorySource[] {
|
|
const sourcelist: HistorySource[] = [];
|
|
for (const entry of sortedList()) {
|
|
for (const source of entry.sources) {
|
|
if (source.lang === language) {
|
|
sourcelist.push({
|
|
dt: entry.dt,
|
|
source: source.source,
|
|
});
|
|
}
|
|
}
|
|
}
|
|
return sourcelist;
|
|
}
|